@getlupa/vue 0.15.5 → 0.15.6

package/dist/lupaSearch.js

@@ -12945,6 +12945,17 @@ const renderHtmlTemplate = (template, document2 = {}) => {
   const rendered = mustache.render(template, document2);
   return sanitizeHtml$1(rendered);
 };
+const getDynamicAttributes = (dynamicAttributes = [], document2 = {}) => {
+  var _a, _b;
+  const parsedAttributes = {};
+  for (const attribute of dynamicAttributes) {
+    if (!((_a = attribute == null ? void 0 : attribute.key) == null ? void 0 : _a.startsWith("data-"))) {
+      continue;
+    }
+    parsedAttributes[attribute == null ? void 0 : attribute.key] = escapeHtml$1(mustache.render((_b = attribute == null ? void 0 : attribute.value) != null ? _b : "", document2));
+  }
+  return parsedAttributes;
+};
 const getFieldValue = (doc, field = "") => {
   var _a;
   if (typeof field === "number") {
@@ -13630,7 +13641,8 @@ const _sfc_main$1d = /* @__PURE__ */ vue.defineComponent({
   props: {
     item: {},
     options: {},
-    inStock: { type: Boolean }
+    inStock: { type: Boolean },
+    dynamicAttributes: {}
   },
   emits: ["productEvent"],
   setup(__props, { emit }) {
@@ -13660,13 +13672,13 @@ const _sfc_main$1d = /* @__PURE__ */ vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$15, [
         vue.createElementVNode("div", _hoisted_2$O, [
-          vue.createElementVNode("button", {
+          vue.createElementVNode("button", vue.mergeProps({
             onClick: vue.withModifiers(handleClick, ["stop", "prevent"]),
-            class: vue.normalizeClass(loading.value ? "lupa-add-to-cart-loading" : "lupa-add-to-cart"),
+            class: loading.value ? "lupa-add-to-cart-loading" : "lupa-add-to-cart",
             "data-cy": "lupa-add-to-cart",
             type: "button",
             disabled: !inStockValue.value || loading.value
-          }, vue.toDisplayString(label.value), 11, _hoisted_3$B)
+          }, _ctx.dynamicAttributes), vue.toDisplayString(label.value), 17, _hoisted_3$B)
         ])
       ]);
     };
@@ -13721,6 +13733,9 @@ const _sfc_main$1c = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadV
       }
       return "search-box-product-title";
     });
+    const renderDynamicAttributesOnParentElement = vue.computed(() => {
+      return props.element.type !== DocumentElementType.ADDTOCART;
+    });
     const displayElement = vue.computed(() => {
       const element = props.element;
       const item = props.item;
@@ -13737,20 +13752,24 @@ const _sfc_main$1c = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadV
       const enhancementData = (_d = (_c = dynamicDataIdMap.value) == null ? void 0 : _c[(_b = props.item) == null ? void 0 : _b.id]) != null ? _d : {};
       return __spreadValues(__spreadValues({}, props.item), enhancementData);
     });
+    const dynamicAttributes = vue.computed(() => {
+      return getDynamicAttributes(props.element.dynamicAttributes, enhancedItem.value);
+    });
     const isLoadingDynamicData = (id) => {
       return Boolean(props.element.dynamic && id && loading.value && (loadingIds == null ? void 0 : loadingIds.value[id]));
     };
     return (_ctx, _cache) => {
       var _a, _b;
       return !_ctx.$slots.badges ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
-        displayElement.value ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(elementComponent.value), {
+        displayElement.value ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(elementComponent.value), vue.mergeProps({
           key: 0,
           item: enhancedItem.value,
           options: _ctx.element,
           labels: _ctx.labels,
-          class: vue.normalizeClass({ "lupa-loading-dynamic-data": isLoadingDynamicData((_a = _ctx.item) == null ? void 0 : _a.id) }),
-          inStock: _ctx.isInStock
-        }, null, 8, ["item", "options", "labels", "class", "inStock"])) : vue.createCommentVNode("", true)
+          class: { "lupa-loading-dynamic-data": isLoadingDynamicData((_a = _ctx.item) == null ? void 0 : _a.id) },
+          inStock: _ctx.isInStock,
+          "dynamic-attributes": dynamicAttributes.value
+        }, renderDynamicAttributesOnParentElement.value && dynamicAttributes.value), null, 16, ["item", "options", "labels", "class", "inStock", "dynamic-attributes"])) : vue.createCommentVNode("", true)
       ], 64)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$14, [
         displayElement.value ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(elementComponent.value), {
           key: 0,
@@ -18642,7 +18661,8 @@ const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
   props: {
     item: {},
     options: {},
-    inStock: { type: Boolean }
+    inStock: { type: Boolean },
+    dynamicAttributes: {}
   },
   emits: ["productEvent"],
   setup(__props, { emit }) {
@@ -18677,13 +18697,14 @@ const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$r, [
         vue.createElementVNode("div", _hoisted_2$m, [
-          vue.createElementVNode("button", {
+          vue.createElementVNode("button", vue.mergeProps({
             id: id.value,
-            class: vue.normalizeClass(loading.value ? "lupa-add-to-cart-loading" : "lupa-add-to-cart"),
+            class: loading.value ? "lupa-add-to-cart-loading" : "lupa-add-to-cart",
             "data-cy": "lupa-add-to-cart",
-            disabled: !inStockValue.value || loading.value,
+            disabled: !inStockValue.value || loading.value
+          }, _ctx.dynamicAttributes, {
             onClick: vue.withModifiers(handleClick, ["stop"])
-          }, vue.toDisplayString(label.value), 11, _hoisted_3$g)
+          }), vue.toDisplayString(label.value), 17, _hoisted_3$g)
         ])
       ]);
     };
@@ -18879,6 +18900,9 @@ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadVa
       }
       return "searchResultsProductTitle";
     });
+    const renderDynamicAttributesOnParentElement = vue.computed(() => {
+      return props.element.type !== DocumentElementType.ADDTOCART;
+    });
     const enhancedItem = vue.computed(() => {
       var _a, _b, _c, _d;
       if (!((_a = props.item) == null ? void 0 : _a.id)) {
@@ -18895,6 +18919,9 @@ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadVa
       }
       return typeof element.display === "function" ? element.display(item) : processDisplayCondition(element.display, item);
     });
+    const dynamicAttributes = vue.computed(() => {
+      return getDynamicAttributes(props.element.dynamicAttributes, enhancedItem.value);
+    });
     const handleProductEvent = (item) => {
       emit("productEvent", item);
     };
@@ -18903,16 +18930,16 @@ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadVa
     };
     return (_ctx, _cache) => {
       var _a;
-      return displayElement.value ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(elementComponent.value), {
+      return displayElement.value ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(elementComponent.value), vue.mergeProps({
         key: 0,
         item: enhancedItem.value,
         options: _ctx.element,
         labels: _ctx.labels,
         inStock: _ctx.inStock,
         link: _ctx.link,
-        class: vue.normalizeClass({ "lupa-loading-dynamic-data": isLoadingDynamicData((_a = _ctx.item) == null ? void 0 : _a.id) }),
-        onProductEvent: handleProductEvent
-      }, null, 40, ["item", "options", "labels", "inStock", "link", "class"])) : vue.createCommentVNode("", true);
+        class: { "lupa-loading-dynamic-data": isLoadingDynamicData((_a = _ctx.item) == null ? void 0 : _a.id) },
+        "dynamic-attributes": dynamicAttributes.value
+      }, renderDynamicAttributesOnParentElement.value && dynamicAttributes.value, { onProductEvent: handleProductEvent }), null, 16, ["item", "options", "labels", "inStock", "link", "class", "dynamic-attributes"])) : vue.createCommentVNode("", true);
     };
   }
 }));

package/dist/lupaSearch.mjs

@@ -12943,6 +12943,17 @@ const renderHtmlTemplate = (template, document2 = {}) => {
   const rendered = mustache.render(template, document2);
   return sanitizeHtml$1(rendered);
 };
+const getDynamicAttributes = (dynamicAttributes = [], document2 = {}) => {
+  var _a, _b;
+  const parsedAttributes = {};
+  for (const attribute of dynamicAttributes) {
+    if (!((_a = attribute == null ? void 0 : attribute.key) == null ? void 0 : _a.startsWith("data-"))) {
+      continue;
+    }
+    parsedAttributes[attribute == null ? void 0 : attribute.key] = escapeHtml$1(mustache.render((_b = attribute == null ? void 0 : attribute.value) != null ? _b : "", document2));
+  }
+  return parsedAttributes;
+};
 const getFieldValue = (doc, field = "") => {
   var _a;
   if (typeof field === "number") {
@@ -13628,7 +13639,8 @@ const _sfc_main$1d = /* @__PURE__ */ defineComponent({
   props: {
     item: {},
     options: {},
-    inStock: { type: Boolean }
+    inStock: { type: Boolean },
+    dynamicAttributes: {}
   },
   emits: ["productEvent"],
   setup(__props, { emit }) {
@@ -13658,13 +13670,13 @@ const _sfc_main$1d = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$15, [
         createElementVNode("div", _hoisted_2$O, [
-          createElementVNode("button", {
+          createElementVNode("button", mergeProps({
             onClick: withModifiers(handleClick, ["stop", "prevent"]),
-            class: normalizeClass(loading.value ? "lupa-add-to-cart-loading" : "lupa-add-to-cart"),
+            class: loading.value ? "lupa-add-to-cart-loading" : "lupa-add-to-cart",
             "data-cy": "lupa-add-to-cart",
             type: "button",
             disabled: !inStockValue.value || loading.value
-          }, toDisplayString(label.value), 11, _hoisted_3$B)
+          }, _ctx.dynamicAttributes), toDisplayString(label.value), 17, _hoisted_3$B)
         ])
       ]);
     };
@@ -13719,6 +13731,9 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValue
       }
       return "search-box-product-title";
     });
+    const renderDynamicAttributesOnParentElement = computed(() => {
+      return props.element.type !== DocumentElementType.ADDTOCART;
+    });
     const displayElement = computed(() => {
       const element = props.element;
       const item = props.item;
@@ -13735,20 +13750,24 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValue
       const enhancementData = (_d = (_c = dynamicDataIdMap.value) == null ? void 0 : _c[(_b = props.item) == null ? void 0 : _b.id]) != null ? _d : {};
       return __spreadValues(__spreadValues({}, props.item), enhancementData);
     });
+    const dynamicAttributes = computed(() => {
+      return getDynamicAttributes(props.element.dynamicAttributes, enhancedItem.value);
+    });
     const isLoadingDynamicData = (id) => {
       return Boolean(props.element.dynamic && id && loading.value && (loadingIds == null ? void 0 : loadingIds.value[id]));
     };
     return (_ctx, _cache) => {
       var _a, _b;
       return !_ctx.$slots.badges ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-        displayElement.value ? (openBlock(), createBlock(resolveDynamicComponent(elementComponent.value), {
+        displayElement.value ? (openBlock(), createBlock(resolveDynamicComponent(elementComponent.value), mergeProps({
           key: 0,
           item: enhancedItem.value,
           options: _ctx.element,
           labels: _ctx.labels,
-          class: normalizeClass({ "lupa-loading-dynamic-data": isLoadingDynamicData((_a = _ctx.item) == null ? void 0 : _a.id) }),
-          inStock: _ctx.isInStock
-        }, null, 8, ["item", "options", "labels", "class", "inStock"])) : createCommentVNode("", true)
+          class: { "lupa-loading-dynamic-data": isLoadingDynamicData((_a = _ctx.item) == null ? void 0 : _a.id) },
+          inStock: _ctx.isInStock,
+          "dynamic-attributes": dynamicAttributes.value
+        }, renderDynamicAttributesOnParentElement.value && dynamicAttributes.value), null, 16, ["item", "options", "labels", "class", "inStock", "dynamic-attributes"])) : createCommentVNode("", true)
       ], 64)) : (openBlock(), createElementBlock("div", _hoisted_1$14, [
         displayElement.value ? (openBlock(), createBlock(resolveDynamicComponent(elementComponent.value), {
           key: 0,
@@ -18640,7 +18659,8 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
   props: {
     item: {},
     options: {},
-    inStock: { type: Boolean }
+    inStock: { type: Boolean },
+    dynamicAttributes: {}
   },
   emits: ["productEvent"],
   setup(__props, { emit }) {
@@ -18675,13 +18695,14 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$r, [
         createElementVNode("div", _hoisted_2$m, [
-          createElementVNode("button", {
+          createElementVNode("button", mergeProps({
             id: id.value,
-            class: normalizeClass(loading.value ? "lupa-add-to-cart-loading" : "lupa-add-to-cart"),
+            class: loading.value ? "lupa-add-to-cart-loading" : "lupa-add-to-cart",
             "data-cy": "lupa-add-to-cart",
-            disabled: !inStockValue.value || loading.value,
+            disabled: !inStockValue.value || loading.value
+          }, _ctx.dynamicAttributes, {
             onClick: withModifiers(handleClick, ["stop"])
-          }, toDisplayString(label.value), 11, _hoisted_3$g)
+          }), toDisplayString(label.value), 17, _hoisted_3$g)
         ])
       ]);
     };
@@ -18877,6 +18898,9 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
       }
       return "searchResultsProductTitle";
     });
+    const renderDynamicAttributesOnParentElement = computed(() => {
+      return props.element.type !== DocumentElementType.ADDTOCART;
+    });
     const enhancedItem = computed(() => {
       var _a, _b, _c, _d;
       if (!((_a = props.item) == null ? void 0 : _a.id)) {
@@ -18893,6 +18917,9 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
       }
       return typeof element.display === "function" ? element.display(item) : processDisplayCondition(element.display, item);
     });
+    const dynamicAttributes = computed(() => {
+      return getDynamicAttributes(props.element.dynamicAttributes, enhancedItem.value);
+    });
     const handleProductEvent = (item) => {
       emit("productEvent", item);
     };
@@ -18901,16 +18928,16 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues
     };
     return (_ctx, _cache) => {
       var _a;
-      return displayElement.value ? (openBlock(), createBlock(resolveDynamicComponent(elementComponent.value), {
+      return displayElement.value ? (openBlock(), createBlock(resolveDynamicComponent(elementComponent.value), mergeProps({
         key: 0,
         item: enhancedItem.value,
         options: _ctx.element,
         labels: _ctx.labels,
         inStock: _ctx.inStock,
         link: _ctx.link,
-        class: normalizeClass({ "lupa-loading-dynamic-data": isLoadingDynamicData((_a = _ctx.item) == null ? void 0 : _a.id) }),
-        onProductEvent: handleProductEvent
-      }, null, 40, ["item", "options", "labels", "inStock", "link", "class"])) : createCommentVNode("", true);
+        class: { "lupa-loading-dynamic-data": isLoadingDynamicData((_a = _ctx.item) == null ? void 0 : _a.id) },
+        "dynamic-attributes": dynamicAttributes.value
+      }, renderDynamicAttributesOnParentElement.value && dynamicAttributes.value, { onProductEvent: handleProductEvent }), null, 16, ["item", "options", "labels", "inStock", "link", "class", "dynamic-attributes"])) : createCommentVNode("", true);
     };
   }
 }));

package/dist/src/components/search-box/products/elements/SearchBoxProductAddToCart.vue.d.ts

@@ -14,6 +14,10 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean>;
         required: false;
     };
+    dynamicAttributes: {
+        type: __PropType<Record<string, unknown>>;
+        required: true;
+    };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "productEvent"[], "productEvent", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     item: {
         type: __PropType<Document>;
@@ -27,6 +31,10 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean>;
         required: false;
     };
+    dynamicAttributes: {
+        type: __PropType<Record<string, unknown>>;
+        required: true;
+    };
 }>> & {
     onProductEvent?: (...args: any[]) => any;
 }, {}, {}>;

package/dist/src/components/search-results/products/product-card/elements/SearchResultsProductAddToCart.vue.d.ts

@@ -14,6 +14,10 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean>;
         required: true;
     };
+    dynamicAttributes: {
+        type: __PropType<Record<string, unknown>>;
+        required: true;
+    };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "productEvent"[], "productEvent", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     item: {
         type: __PropType<Document>;
@@ -27,6 +31,10 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<boolean>;
         required: true;
     };
+    dynamicAttributes: {
+        type: __PropType<Record<string, unknown>>;
+        required: true;
+    };
 }>> & {
     onProductEvent?: (...args: any[]) => any;
 }, {}, {}>;

package/dist/src/types/DocumentElement.d.ts

@@ -14,6 +14,10 @@ export type DisplayCondition = {
     condition: 'exists' | 'equals' | 'notEquals' | 'greaterThan' | 'lessThan' | 'greaterThanOrEquals' | 'lessThanOrEquals';
     fields: (string | number)[];
 };
+export type DynamicAttribute = {
+    key: string;
+    value: string;
+};
 export type DocumentElementBase<T = any> = {
     type: DocumentElementType;
     key?: string;
@@ -21,6 +25,7 @@ export type DocumentElementBase<T = any> = {
     isHtml?: boolean;
     group?: string;
     dynamic?: boolean;
+    dynamicAttributes?: DynamicAttribute[];
 };
 export type ImageDocumentElement<T = any> = DocumentElementBase<T> & {
     type: DocumentElementType.IMAGE;

package/dist/src/utils/render.utils.d.ts

@@ -1,3 +1,4 @@
-import { DisplayCondition } from '../types/DocumentElement';
+import { DisplayCondition, DynamicAttribute } from '../types/DocumentElement';
 export declare const renderHtmlTemplate: (template: string, document?: Record<string, unknown>) => string;
+export declare const getDynamicAttributes: (dynamicAttributes?: DynamicAttribute[], document?: Record<string, unknown>) => {};
 export declare const processDisplayCondition: (displayCondition: DisplayCondition, doc?: Record<string, unknown>) => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getlupa/vue",
-  "version": "0.15.5",
+  "version": "0.15.6",
   "main": "dist/lupaSearch.mjs",
   "module": "dist/lupaSearch.mjs",
   "types": "dist/src/index.d.ts",