@miso.ai/client-sdk-ui 1.10.0-beta.3 → 1.10.0-beta.4

package/dist/cjs/affiliation/index.js

@@ -8,7 +8,7 @@ exports.processSovrnProduct = processSovrnProduct;
 var _commons = require("@miso.ai/commons");
 const _excluded = ["sovrn_aff"],
   _excluded2 = ["products"],
-  _excluded3 = ["id", "deeplink", "name", "headline", "currency", "retailPrice", "salePrice", "discountRate", "image", "thumbnail", "merchant"];
+  _excluded3 = ["id", "deeplink", "headline", "currency", "retailPrice", "salePrice", "discountRate", "image", "thumbnail", "merchant"];
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
 function processData(data) {
   if (!data || !data.value) {
@@ -38,6 +38,7 @@ function processSovrnData(_ref) {
       products
     } = _ref,
     sovrn_aff = _objectWithoutPropertiesLoose(_ref, _excluded2);
+  products = products.slice(0, 1);
   return Object.assign({
     channel: 'sovrn'
   }, sovrn_aff, {
@@ -48,8 +49,7 @@ function processSovrnProduct(_ref2) {
   let {
       id,
       deeplink: url,
-      name: title,
-      headline: description,
+      headline: title,
       currency,
       retailPrice: original_price,
       salePrice: sale_price,
@@ -65,7 +65,6 @@ function processSovrnProduct(_ref2) {
     id: `sovrn-${id}`,
     channel: 'sovrn',
     title,
-    description,
     cover_image,
     url,
     currency,

package/dist/cjs/defaults/ask/phrases.js

@@ -12,7 +12,7 @@ const question = exports.question = 'You asked...';
 /**
  * The phrase displayed right before <miso-sources>
  */
-const sources = exports.sources = 'My reply is based on the following';
+const sources = exports.sources = 'This reply is based on the following articles';
 
 /**
  * The phrase displayed right before <miso-query-suggestions>

package/dist/cjs/layout/list/collection.js

@@ -87,10 +87,12 @@ const DEFAULT_TEMPLATES = Object.freeze({
   item,
   productInfoBlock: _templates.productInfoBlock,
   articleInfoBlock: _templates.articleInfoBlock,
+  brandBlock: _templates.brandBlock,
   titleBlock: _templates.titleBlock,
   descriptionBlock: _templates.descriptionBlock,
   dateBlock: _templates.dateBlock,
   priceBlock: _templates.priceBlock,
+  discountRateText: _templates.discountRateText,
   ctaBlock: _templates.ctaBlock,
   cta: _templates.cta,
   imageBlock: _templates.imageBlock,

package/dist/cjs/layout/templates.js

@@ -12,6 +12,7 @@ exports.cta = cta;
 exports.ctaBlock = ctaBlock;
 exports.dateBlock = dateBlock;
 exports.descriptionBlock = descriptionBlock;
+exports.discountRateText = discountRateText;
 exports.helpers = void 0;
 exports.imageBlock = imageBlock;
 exports.indexBlock = indexBlock;
@@ -104,7 +105,6 @@ function brandBlock(_ref3, _ref4) {
   if (!brand && !brand_logo) {
     return '';
   }
-  brand_logo = undefined;
   const content = brand_logo ? `<img class="${className}__item-brand-logo" src="${brand_logo}"${brand ? ` alt="${brand}"` : ''}>` : `<div class="${className}__item-brand">${brand}</div>`;
   return `<div class="${className}__item-brand-container">${content}</div>`;
 }
@@ -131,52 +131,62 @@ function dateBlock(_ref7, _ref8) {
   const date = published_at || created_at || updated_at;
   return date ? `<div class="${className}__item-date">${formatDate(date, templates.date)}</div>` : '';
 }
-function priceBlock(_ref9, _ref10) {
-  let {
-    className
-  } = _ref9;
-  let {
+function priceBlock(layout, data) {
+  const {
+    className,
+    templates
+  } = layout;
+  const {
     sale_price,
     original_price,
-    discount_rate_percent,
     currency = 'USD'
-  } = _ref10;
+  } = data;
   const price = sale_price || original_price;
   if (!price) {
     return '';
   }
   const has_price_difference = original_price !== undefined && sale_price !== undefined && sale_price < original_price;
-  discount_rate_percent = discount_rate_percent || (has_price_difference ? Math.floor((1 - sale_price / original_price) * 100) : undefined);
+  const discount_rate_percent = data.discount_rate_percent || (has_price_difference ? Math.floor((1 - sale_price / original_price) * 100) : undefined);
   let content = '';
+  // original price
   if (has_price_difference) {
     content += `<span class="${className}__item-original-price miso-price" data-currency="${currency}">${original_price}</span><br>`;
   }
+  // current price
   content += `<span class="${className}__item-price miso-price" data-currency="${currency}">${price}</span>`;
+  // discount rate
   if (discount_rate_percent) {
-    content += `<span class="${className}__item-discount-rate"> (${discount_rate_percent}% off)</span>`;
+    const text = (templates.discountRateText || discountRateText)(layout, data);
+    content += ` <span class="${className}__item-discount-rate">${text}</span>`;
   }
   return `<div class="${className}__item-price-container">${content}</div>`;
 }
-function imageBlock(_ref11, _ref12) {
+function discountRateText(layout, _ref9) {
+  let {
+    discount_rate_percent
+  } = _ref9;
+  return `(${discount_rate_percent}% off)`;
+}
+function imageBlock(_ref10, _ref11) {
   let {
     className
-  } = _ref11;
+  } = _ref10;
   let {
     cover_image
-  } = _ref12;
+  } = _ref11;
   if (!cover_image) {
     return '';
   }
   const img = `<img class="${className}__item-cover-image" src="${cover_image}">`;
   return `<div class="${className}__item-cover-image-container">${img}</div>`;
 }
-function indexBlock(_ref13, data, _ref14) {
+function indexBlock(_ref12, data, _ref13) {
   let {
     className
-  } = _ref13;
+  } = _ref12;
   let {
     index
-  } = _ref14;
+  } = _ref13;
   return `<div class="${className}__item-index-container"><span class="${className}__item-index miso-citation-index" data-index="${index + 1}"></span></div>`;
 }
 function ctaBlock(layout, data, meta) {
@@ -203,15 +213,15 @@ function cta(layout, data, meta) {
 }
 
 // helpers //
-function tagPair(_ref15, _ref16) {
+function tagPair(_ref14, _ref15) {
   let {
     className,
     options = {}
-  } = _ref15;
+  } = _ref14;
   let {
     product_id,
     url
-  } = _ref16;
+  } = _ref15;
   let {
     classSuffix = 'item-body',
     role = 'item'

package/dist/cjs/version.js

@@ -4,4 +4,4 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = exports.default = '1.10.0-beta.3';
+var _default = exports.default = '1.10.0-beta.4';

package/package.json

@@ -26,7 +26,7 @@
     "url": "https://github.com/MisoAI/miso-client-js-sdk/issues"
   },
   "dependencies": {
-    "@miso.ai/commons": "1.10.0-beta.3"
+    "@miso.ai/commons": "1.10.0-beta.4"
   },
-  "version": "1.10.0-beta.3"
+  "version": "1.10.0-beta.4"
 }

package/src/affiliation/index.js

@@ -23,6 +23,7 @@ function processValue(value) {
 }
 
 function processSovrnData({ products, ...sovrn_aff }) {
+  products = products.slice(0, 1);
   return {
     channel: 'sovrn',
     ...sovrn_aff,
@@ -33,8 +34,7 @@ function processSovrnData({ products, ...sovrn_aff }) {
 export function processSovrnProduct({
   id,
   deeplink: url,
-  name: title,
-  headline: description,
+  headline: title,
   currency,
   retailPrice: original_price,
   salePrice: sale_price,
@@ -50,7 +50,6 @@ export function processSovrnProduct({
     id: `sovrn-${id}`,
     channel: 'sovrn',
     title,
-    description,
     cover_image,
     url,
     currency,

package/src/defaults/ask/phrases.js

@@ -6,7 +6,7 @@ export const question = 'You asked...';
 /**
  * The phrase displayed right before <miso-sources>
  */
-export const sources = 'My reply is based on the following';
+export const sources = 'This reply is based on the following articles';
 
 /**
  * The phrase displayed right before <miso-query-suggestions>

package/src/layout/list/collection.js

@@ -1,7 +1,7 @@
 import { defineValues } from '@miso.ai/commons';
 import { STATUS, LAYOUT_CATEGORY } from '../../constants.js';
 import TemplateBasedLayout from '../template.js';
-import { product, article, question, productInfoBlock, articleInfoBlock, titleBlock, brandBlock, descriptionBlock, dateBlock, priceBlock, ctaBlock, cta, imageBlock, indexBlock, helpers } from '../templates.js';
+import { product, article, question, productInfoBlock, articleInfoBlock, titleBlock, brandBlock, descriptionBlock, dateBlock, priceBlock, discountRateText, ctaBlock, cta, imageBlock, indexBlock, helpers } from '../templates.js';
 
 const VALUE = Symbol.for('miso.value');
 
@@ -59,10 +59,12 @@ const DEFAULT_TEMPLATES = Object.freeze({
   item,
   productInfoBlock,
   articleInfoBlock,
+  brandBlock,
   titleBlock,
   descriptionBlock,
   dateBlock,
   priceBlock,
+  discountRateText,
   ctaBlock,
   cta,
   imageBlock,

package/src/layout/templates.js

@@ -91,7 +91,6 @@ export function brandBlock({ className }, { brand, brand_logo }) {
   if (!brand && !brand_logo) {
     return '';
   }
-  brand_logo = undefined;
   const content = brand_logo ? `<img class="${className}__item-brand-logo" src="${brand_logo}"${brand ? ` alt="${brand}"` : ''}>` : `<div class="${className}__item-brand">${brand}</div>`;
   return `<div class="${className}__item-brand-container">${content}</div>`;
 }
@@ -105,25 +104,35 @@ export function dateBlock({ className, templates }, { created_at, updated_at, pu
   return date ? `<div class="${className}__item-date">${formatDate(date, templates.date)}</div>` : '';
 }
 
-export function priceBlock({ className }, { sale_price, original_price, discount_rate_percent, currency = 'USD' }) {
+export function priceBlock(layout, data) {
+  const { className, templates } = layout;
+  const { sale_price, original_price, currency = 'USD' } = data;
   const price = sale_price || original_price;
   if (!price) {
     return '';
   }
   const has_price_difference = original_price !== undefined && sale_price !== undefined && sale_price < original_price;
-  discount_rate_percent = discount_rate_percent || (has_price_difference ? Math.floor((1 - sale_price / original_price) * 100) : undefined);
+  const discount_rate_percent = data.discount_rate_percent || (has_price_difference ? Math.floor((1 - sale_price / original_price) * 100) : undefined);
 
   let content = '';
+  // original price
   if (has_price_difference) {
     content += `<span class="${className}__item-original-price miso-price" data-currency="${currency}">${original_price}</span><br>`;
   }
+  // current price
   content += `<span class="${className}__item-price miso-price" data-currency="${currency}">${price}</span>`;
+  // discount rate
   if (discount_rate_percent) {
-    content += `<span class="${className}__item-discount-rate"> (${discount_rate_percent}% off)</span>`;
+    const text = (templates.discountRateText || discountRateText)(layout, data);
+    content += ` <span class="${className}__item-discount-rate">${text}</span>`;
   }
   return `<div class="${className}__item-price-container">${content}</div>`;
 }
 
+export function discountRateText(layout, { discount_rate_percent }) {
+  return `(${discount_rate_percent}% off)`;
+}
+
 export function imageBlock({ className }, { cover_image }) {
   if (!cover_image) {
     return '';

package/src/version.js

@@ -1 +1 @@
-export default '1.10.0-beta.3';
+export default '1.10.0-beta.4';