vviinn-widgets 2.18.21 → 2.19.0

package/dist/collection/components/vviinn-vpr-button/vviinn-vpr-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vviinn-vpr-button.js","sourceRoot":"","sources":["../../../src/components/vviinn-vpr-button/vviinn-vpr-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n} from \"@stencil/core\";\nimport { VisualSearchIcon } from \"../vviinn-icons\";\nimport { CarouselMode } from \"../vviinn-carousel/vviinn-carousel\";\nimport { BasicEventData } from \"../../recommendation/events\";\nimport { CampaignName, campaignTypeNames } from \"../../campaign/Campaign\";\n\n/**\n *\n * @part button - clickable button element\n */\n@Component({\n  tag: \"vviinn-vpr-button\",\n  styleUrl: \"vviinn-vpr-button.css\",\n  shadow: true,\n})\nexport class VviinnVprButton {\n  @Element() el: HTMLElement;\n  @Prop() token: string;\n  @Prop() productId: string;\n  @Prop() position: \"bottom\" | \"right\" = \"bottom\";\n  @Prop() sourceImage: string | null = null;\n  @Prop() sidebarTitle: string = \"Visually similar products\";\n  @Prop() modalScrollbar: boolean = false;\n  /** comma-separated list of campaign-ids */\n  @Prop() campaigns: string = \"\";\n  /** Campaign type */\n  @Prop() campaignType: CampaignName = \"VPR\";\n  @Prop() color: string;\n  @Prop() addStyle: boolean = true;\n  @Prop() mode: CarouselMode = \"continuity\";\n  @Prop() imageWidth: number = 300;\n  @Prop() currencySign: string = \"€\";\n  /** This message is displayed when no results */\n  @Prop() noResultText?: string;\n  /** Showing message (when true) or hiding the whole widget, when no results */\n  @Prop() noResultShow?: boolean = true;\n  /** Hiding disabled arrows in the carousel if true */\n  @Prop() gridArrowsDynamic: boolean = false;\n\n  /** @internal */\n  @Prop() apiPath: string | undefined = \"https://api.vviinn.com\";\n\n  /** Event emitted when vpr-button clicked */\n  @Event() vviinnWidgetOpen: EventEmitter<BasicEventData>;\n\n  // List to show in the Storybook:\n  @Event() vviinnWidgetLoad: EventEmitter;\n  @Event() vviinnWidgetClose: EventEmitter;\n  @Event() vviinnProductClick: EventEmitter;\n  @Event() vviinnProductView: EventEmitter;\n  @Event() vviinnProductLoad: EventEmitter;\n  @Event() vviinnNoResult: EventEmitter;\n\n  private sidebar: HTMLVviinnRecommendationsSidebarElement | null = null;\n  private sidebarCloseListener: () => void = () => {\n    document.body.removeChild(this.sidebar);\n  };\n\n  render() {\n    return (\n      <Host\n        onClick={(): void => {\n          this.handleClick();\n          this.vviinnWidgetOpen.emit({\n            widgetType: \"VPR\",\n            campaignTypeId: this.campaignType,\n            campaignTypeName: campaignTypeNames[this.campaignType],\n            widgetId: this.el.id,\n          });\n        }}\n        role=\"button\"\n        tabindex=\"0\"\n      >\n        <vviinn-button addStyle={this.addStyle} part=\"vviinn-button\">\n          <slot>\n            <VisualSearchIcon />\n          </slot>\n        </vviinn-button>\n      </Host>\n    );\n  }\n\n  handleClick(): void {\n    const sidebar = document.createElement(\"vviinn-recommendations-sidebar\");\n    sidebar.sidebarTitle = this.sidebarTitle;\n    sidebar.productId = this.productId;\n    sidebar.token = this.token;\n    sidebar.position = this.position;\n    sidebar.sourceImage = this.sourceImage;\n    sidebar.widgetScrollbar = this.modalScrollbar;\n    sidebar.campaigns = this.campaigns;\n    sidebar.campaignType = this.campaignType;\n    sidebar.color = this.color;\n    sidebar.mode = this.position === \"right\" ? \"grid\" : this.mode;\n    sidebar.imageWidth = this.imageWidth;\n    sidebar.currencySign = this.currencySign;\n    sidebar.apiPath = this.apiPath;\n    sidebar.buttonElementId = this.el.id;\n    sidebar.noResultText = this.noResultText;\n    sidebar.noResultShow = this.noResultShow;\n    sidebar.gridArrowsDynamic = this.gridArrowsDynamic;\n\n    this.sidebar = sidebar;\n\n    sidebar.addEventListener(\"vviinnWidgetClose\", this.sidebarCloseListener);\n    document.body.append(this.sidebar);\n  }\n\n  disconnectedCallback() {\n    if (!this.sidebar) return;\n    this.sidebar.removeEventListener(\n      \"vviinnWidgetClose\",\n      this.sidebarCloseListener\n    );\n    document.body.removeChild(this.sidebar);\n  }\n}\n"]}

package/dist/collection/components/vviinn-vpr-widget/stories/args.js

@@ -182,3 +182,4 @@ export const continuityLayoutArgs = {
   recommendationsContinuityProductsTablet,
   recommendationsContinuityProductsMobile,
 };
+//# sourceMappingURL=args.js.map

package/dist/collection/components/vviinn-vpr-widget/stories/args.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"args.js","sourceRoot":"","sources":["../../../../src/components/vviinn-vpr-widget/stories/args.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,OAAO,GAAG;EACrB,IAAI,EAAE,UAAU;EAChB,OAAO,EAAE;IACP,IAAI,EAAE,MAAM;GACb;EACD,KAAK,EAAE;IACL,YAAY,EAAE,EAAE,OAAO,EAAE,wBAAwB,EAAE;GACpD;CACF,CAAC;AAEF,MAAM,KAAK,GAAG;EACZ,IAAI,EAAE,OAAO;EACb,OAAO,EAAE;IACP,IAAI,EAAE,MAAM;GACb;CACF,CAAC;AAEF,MAAM,SAAS,GAAG;EAChB,IAAI,EAAE,YAAY;EAClB,OAAO,EAAE;IACP,IAAI,EAAE,MAAM;GACb;CACF,CAAC;AAEF,MAAM,KAAK,GAAG;EACZ,IAAI,EAAE,OAAO;EACb,OAAO,EAAE;IACP,IAAI,EAAE,OAAO;GACd;CACF,CAAC;AAEF,MAAM,SAAS,GAAG;EAChB,IAAI,EAAE,WAAW;EACjB,OAAO,EAAE;IACP,IAAI,EAAE,MAAM;GACb;CACF,CAAC;AAEF,MAAM,MAAM,GAAG;EACb,IAAI,EAAE,SAAS;EACf,WAAW,EACT,iEAAiE;EACnE,OAAO,EAAE;IACP,IAAI,EAAE,MAAM;GACb;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,WAAW,GAAG;EAClB,IAAI,EAAE,4BAA4B;EAClC,WAAW,EACT,mHAAmH;EACrH,OAAO,EAAE;IACP,IAAI,EAAE,MAAM;GACb;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;EAC1B,IAAI,EAAE,eAAe;EACrB,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;IACd,MAAM,EAAE;MACN,GAAG,EAAE,iCAAiC;MACtC,GAAG,EAAE,8BAA8B;KACpC;GACF;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,SAAS,GAAG;EAChB,IAAI,EAAE,eAAe;EACrB,OAAO,EAAE;IACP,IAAI,EAAE,SAAS;GAChB;EACD,KAAK,EAAE;IACL,YAAY,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;GAChC;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,aAAa,GAAG;EACpB,IAAI,EAAE,mCAAmC;EACzC,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;GACf;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,UAAU,GAAG;EACjB,IAAI,EAAE,aAAa;EACnB,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;GACf;CACF,CAAC;AAEF,MAAM,gBAAgB,GAAG;EACvB,IAAI,EAAE,mBAAmB;EACzB,OAAO,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,CAAC;EACtC,OAAO,EAAE;IACP,IAAI,EAAE,CAAC;IACP,QAAQ,EAAE,CAAC;IACX,KAAK,EAAE,CAAC;GACT;EACD,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;IACd,OAAO,EAAE,CAAC;GACX;CACF,CAAC;AAEF,MAAM,gBAAgB,GAAG;EACvB,IAAI,EAAE,oBAAoB;EAC1B,OAAO,EAAE;IACP,IAAI,EAAE,OAAO;GACd;EACD,WAAW,EACT,wFAAwF;CAC3F,CAAC;AAEF,MAAM,kBAAkB,GAAG;EACzB,IAAI,EAAE,sBAAsB;EAC5B,WAAW,EAAE,mBAAmB;EAChC,OAAO,EAAE;IACP,IAAI,EAAE,OAAO;GACd;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG;EACtB,WAAW;EACX,OAAO;EACP,YAAY;EACZ,SAAS;EACT,gBAAgB;EAChB,MAAM;EACN,UAAU;EACV,gBAAgB;EAChB,SAAS;EACT,kBAAkB;EAClB,SAAS;EACT,aAAa;EACb,KAAK;EACL,KAAK;CACN,CAAC;AAEF,MAAM,kCAAkC,GAAG;EACzC,IAAI,EAAE,gCAAgC;EACtC,WAAW,EACT,0EAA0E;EAC5E,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;GACf;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,iCAAiC,GAAG;EACxC,IAAI,EAAE,+BAA+B;EACrC,WAAW,EACT,sHAAsH;EACxH,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;GACf;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,iCAAiC,GAAG;EACxC,IAAI,EAAE,+BAA+B;EACrC,WAAW,EACT,8GAA8G;EAChH,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;GACf;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG;EAC5B,kCAAkC;EAClC,iCAAiC;EACjC,iCAAiC;CAClC,CAAC;AAEF,MAAM,wCAAwC,GAAG;EAC/C,IAAI,EAAE,wCAAwC;EAC9C,WAAW,EACT,qEAAqE;EACvE,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;GACf;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,uCAAuC,GAAG;EAC9C,IAAI,EAAE,wCAAwC;EAC9C,WAAW,EACT,oEAAoE;EACtE,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;GACf;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,uCAAuC,GAAG;EAC9C,IAAI,EAAE,wCAAwC;EAC9C,WAAW,EACT,qEAAqE;EACvE,OAAO,EAAE;IACP,IAAI,EAAE,QAAQ;GACf;EACD,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG;EAClC,wCAAwC;EACxC,uCAAuC;EACvC,uCAAuC;CACxC,CAAC","sourcesContent":["export const apiPath = {\n  name: \"api-path\",\n  control: {\n    type: \"text\",\n  },\n  table: {\n    defaultValue: { summary: \"https://api.vviinn.com\" },\n  },\n};\n\nconst token = {\n  name: \"token\",\n  control: {\n    type: \"text\",\n  },\n};\n\nconst productId = {\n  name: \"product-id\",\n  control: {\n    type: \"text\",\n  },\n};\n\nconst color = {\n  name: \"color\",\n  control: {\n    type: \"color\",\n  },\n};\n\nconst campaigns = {\n  name: \"campaigns\",\n  control: {\n    type: \"text\",\n  },\n};\n\nconst cssUrl = {\n  name: \"css-url\",\n  description:\n    \"Optional for custom CSS.  It will overwrite all other settings.\",\n  control: {\n    type: \"text\",\n  },\n  required: false,\n};\n\nconst analyticsId = {\n  name: \"Google tracking account ID\",\n  description:\n    \"Optional. Goolge Analytics account id or tag manager id and click events will be send for analytics product lists\",\n  control: {\n    type: \"text\",\n  },\n  required: false,\n};\n\nexport const campaignType = {\n  name: \"campaign-type\",\n  control: {\n    type: \"select\",\n    labels: {\n      VPR: \"Visually similar products (VPR)\",\n      VCS: \"Visually cross-selling (VCS)\",\n    },\n  },\n  required: false,\n};\n\nconst showTitle = {\n  name: \"Section title\",\n  control: {\n    type: \"boolean\",\n  },\n  table: {\n    defaultValue: { summary: true },\n  },\n  required: false,\n};\n\nconst titleFontSize = {\n  name: \"Section title name font size (px)\",\n  control: {\n    type: \"number\",\n  },\n  required: false,\n};\n\nconst imageWidth = {\n  name: \"image-width\",\n  control: {\n    type: \"number\",\n  },\n};\n\nconst contentAlignment = {\n  name: \"Content alignment\",\n  options: [\"Left\", \"Centered\", \"Right\"],\n  mapping: {\n    Left: 0,\n    Centered: 1,\n    Right: 2,\n  },\n  control: {\n    type: \"select\",\n    default: 0,\n  },\n};\n\nconst primaryTextColor = {\n  name: \"Primary text color\",\n  control: {\n    type: \"color\",\n  },\n  description:\n    \"Used where the most user attention is needed: product brand, product title, and price.\",\n};\n\nconst secondaryTextColor = {\n  name: \"Secondary text color\",\n  description: \"Used in Old Price\",\n  control: {\n    type: \"color\",\n  },\n};\n\nexport const argTypes = {\n  analyticsId,\n  apiPath,\n  campaignType,\n  campaigns,\n  contentAlignment,\n  cssUrl,\n  imageWidth,\n  primaryTextColor,\n  productId,\n  secondaryTextColor,\n  showTitle,\n  titleFontSize,\n  token,\n  color,\n};\n\nconst recommendationsGridProductsDesktop = {\n  name: \"Product cards shown on desktop\",\n  description:\n    \"Desktop mode is bigger than 1024px. (Use arrow buttons to apply changes)\",\n  control: {\n    type: \"number\",\n  },\n  required: false,\n};\n\nconst recommendationsGridProductsTablet = {\n  name: \"Product cards shown on tablet\",\n  description:\n    \"How many product cards users will see inside one grid in a screen 768px-1024px. (Use arrow buttons to apply changes)\",\n  control: {\n    type: \"number\",\n  },\n  required: false,\n};\n\nconst recommendationsGridProductsMobile = {\n  name: \"Product cards shown on mobile\",\n  description:\n    \"How many product cards users will see inside one grid in a screen <768. (Use arrow buttons to apply changes)\",\n  control: {\n    type: \"number\",\n  },\n  required: false,\n};\n\nexport const gridLayoutArgs = {\n  recommendationsGridProductsDesktop,\n  recommendationsGridProductsTablet,\n  recommendationsGridProductsMobile,\n};\n\nconst recommendationsContinuityProductsDesktop = {\n  name: \"Product cards width in a L screen [px]\",\n  description:\n    \"How wide product cards will be on a screen bigger than 1024px width\",\n  control: {\n    type: \"number\",\n  },\n  required: false,\n};\n\nconst recommendationsContinuityProductsTablet = {\n  name: \"Product cards width in a M screen [px]\",\n  description:\n    \"How wide product cards will be on a screen from 768px-1024px width\",\n  control: {\n    type: \"number\",\n  },\n  required: false,\n};\n\nconst recommendationsContinuityProductsMobile = {\n  name: \"Product cards width in a S screen [px]\",\n  description:\n    \"How wide product cards will be on a screen smaller than 768px width\",\n  control: {\n    type: \"number\",\n  },\n  required: false,\n};\n\nexport const continuityLayoutArgs = {\n  recommendationsContinuityProductsDesktop,\n  recommendationsContinuityProductsTablet,\n  recommendationsContinuityProductsMobile,\n};\n"]}

package/dist/collection/components/vviinn-vpr-widget/stories/decorators.js

@@ -27,3 +27,4 @@ export const continuityDecorator = (story) => `
 </style>
 ${story()}
 `;
+//# sourceMappingURL=decorators.js.map

package/dist/collection/components/vviinn-vpr-widget/stories/decorators.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"decorators.js","sourceRoot":"","sources":["../../../../src/components/vviinn-vpr-widget/stories/decorators.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE,EAAE,CAAC;;;;;;;;;;;;;;;;;EAiBtC,KAAK,EAAE;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,KAAK,EAAE,EAAE,CAAC;;;;;;;;EAQ5C,KAAK,EAAE;CACR,CAAC","sourcesContent":["export const gridDecorator = (story) => `\n<style>\n  @media (min-width: 836px) {\n    #root-inner {\n      padding: 0 10%;\n    }\n  }\n\n  @media (max-width: 860px) {\n    vviinn-product-card::part(title),\n    vviinn-product-card::part(brand),\n    vviinn-product-card::part(type),\n    vviinn-product-card::part(price-container) {\n      font-size: 14px;\n    }\n  }\n</style>\n${story()}\n`;\n\nexport const continuityDecorator = (story) => `\n<style>\n  @media (min-width: 836px) {\n    #root-inner {\n      padding-left: 10%;\n    }\n  }\n</style>\n${story()}\n`;\n"]}

package/dist/collection/components/vviinn-vpr-widget/stories/vviinn-vpr-widget.stories.js

@@ -223,3 +223,4 @@ Grid.args = {
 };
 Grid.argTypes = Object.assign({}, gridLayoutArgs);
 Grid.decorators = [gridDecorator];
+//# sourceMappingURL=vviinn-vpr-widget.stories.js.map

package/dist/collection/components/vviinn-vpr-widget/stories/vviinn-vpr-widget.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vviinn-vpr-widget.stories.js","sourceRoot":"","sources":["../../../../src/components/vviinn-vpr-widget/stories/vviinn-vpr-widget.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { argTypes, continuityLayoutArgs, gridLayoutArgs } from \"./args\";\nimport { gridDecorator, continuityDecorator } from \"./decorators\";\n\nexport default {\n  title: \"Widgets/Visual Recommendations/Widget\",\n  component: \"vviinn-vpr-widget\",\n  argTypes: {\n    ...argTypes,\n    mode: {\n      table: {\n        disable: true,\n      },\n    },\n  },\n};\n\nconst alignmentLeft = `\n  vviinn-vpr-widget::part(title),\n  vviinn-vpr-widget::part(brand),\n  vviinn-vpr-widget::part(type),\n  vviinn-vpr-widget::part(deeplink),\n  vviinn-vpr-widget::part(price-container) {\n    align-self: start;\n    text-align: left;\n  }`;\n\nconst alignmentCenter = `\n  vviinn-vpr-widget::part(title),\n  vviinn-vpr-widget::part(brand),\n  vviinn-vpr-widget::part(type),\n  vviinn-vpr-widget::part(deeplink),\n  vviinn-vpr-widget::part(price-container) {\n    align-self: center;\n    text-align: center;\n  }`;\n\nconst alignmentRight = `\n  vviinn-vpr-widget::part(title),\n  vviinn-vpr-widget::part(brand),\n  vviinn-vpr-widget::part(type),\n  vviinn-vpr-widget::part(deeplink),\n  vviinn-vpr-widget::part(price-container) {\n    align-self: end;\n    text-align: right;\n  }`;\n\nconst alignment = new Map([\n  [0, alignmentLeft],\n  [1, alignmentCenter],\n  [2, alignmentRight],\n]);\n\nconst Template = (args) => `\n    <script>\n      window.dataLayer = window.dataLayer || [];\n      function gtag() {\n        dataLayer.push(arguments);\n      }\n      gtag(\"js\", new Date());\n\n      gtag(\"config\", \"${args.analyticsId}\");\n      gtag(\"require\", \"ec\");\n    </script>\n    <style>\n      ${alignment.get(args.contentAlignment)}\n      vviinn-vpr-widget::part(title),\n      vviinn-vpr-widget::part(brand),\n      vviinn-vpr-widget::part(type),\n      vviinn-vpr-widget::part(price-sale),\n      vviinn-vpr-widget::part(price-regular) {\n        color: ${args.primaryTextColor};\n      }\n\n      vviinn-vpr-widget::part(price-outdated) {\n        color: ${args.secondaryTextColor};\n      }\n\n      vviinn-vpr-widget::part(recommendations-title) {\n        display: ${args.showTitle ? \"flex\" : \"none\"};\n        font-size: ${args.titleFontSize}px;\n      }\n\n      @media(min-width: 1024px) {\n        * {\n          --vviinn-carousel-columns: ${args.recommendationsGridProductsDesktop};\n        }\n      }\n\n      @media(max-width: 1024px) and (min-width: 768px) {\n        * {\n        --vviinn-carousel-columns: ${args.recommendationsGridProductsTablet};\n        }\n      }\n \n      @media(max-width: 768px) and (min-width: 460px) {\n        * {\n          --vviinn-carousel-columns: ${args.recommendationsGridProductsMobile};\n        }\n\n        vviinn-product-card::part(title) {\n          font-size: 14px; \n        }\n      }\n\n      @media(min-width: 1024px) {\n        vviinn-product-card,\n        vviinn-vpr-widget::part(image) {\n          width: ${args.recommendationsContinuityProductsDesktop}px;\n          max-width: ${args.recommendationsContinuityProductsDesktop}px;\n        }\n\n        vviinn-vpr-widget::part(image) {\n          height: 100%;\n          aspect-ratio: 1;\n        }\n      }\n\n      @media(max-width: 1024px) and (min-width: 768px) {\n        vviinn-product-card,\n        vviinn-vpr-widget::part(image) {\n          width: ${args.recommendationsContinuityProductsTablet}px;\n          max-width: ${args.recommendationsContinuityProductsTablet}px;\n        }\n\n        vviinn-vpr-widget::part(image) {\n          height: 100%;\n          aspect-ratio: 1;\n        }\n      }\n\n      @media(max-width: 768px) and (min-width: 460px) {\n        vviinn-product-card,\n        vviinn-vpr-widget::part(image) {\n          width: ${args.recommendationsContinuityProductsMobile}px;\n          max-width: ${args.recommendationsContinuityProductsMobile}px;\n        }\n\n        vviinn-vpr-widget::part(image) {\n          height: 100%;\n          aspect-ratio: 1;\n        }\n\n        vviinn-vpr-widget::part(title) {\n          font-size: 14px; \n        }\n      }\n    </style>\n\n    <vviinn-vpr-widget\n      block-title=\"${args.blockTitle}\"\n      css-url=\"${args.cssUrl}\"\n      currency-sign=\"${args.currencySign}\"\n      show-scroll=\"${args.showScroll}\"\n      image-ratio=\"${args.imageRatio}\"\n      locale=\"${args.locale}\"\n      price-prefix=\"${args.pricePrefix}\"\n      api-path=\"${args.apiPath}\"\n      product-id=\"${args.productId}\"\n      token=\"${args.token}\"\n      mode=\"${args.mode}\"\n      image-width=\"${args.imageWidth}\"\n      campaign-type=\"${args.campaignType}\"\n      campaigns=\"${args.campaigns}\"\n      color=\"${args.color ? args.color.slice(1) : \"\"}\"\n      grid-arrows-dynamic=\"${args.gridArrowsDynamic}\"\n      no-result-text=\"${args.noResultText}\"\n      no-result-show=\"${args.noResultShow}\"\n    >\n    </vviinn-vpr-widget>\n`;\n\nexport const Continuity = Template.bind({});\nContinuity.args = {\n  analyticsId: \"UA-34442043-5\",\n  apiPath: \"https://api.vviinn.com\",\n  campaigns: \"\",\n  campaignType: \"VPR\",\n  contentAlignment: \"Left\",\n  imageWidth: 300,\n  mode: \"continuity\",\n  color: \"\",\n  primaryTextColor: \"#161616\",\n  productId: \"4114460310\",\n  recommendationsContinuityProductsDesktop: 200,\n  recommendationsContinuityProductsMobile: 160,\n  recommendationsContinuityProductsTablet: 150,\n  secondaryTextColor: \"#757575\",\n  showScroll: false,\n  showTitle: true,\n  titleFontSize: 28,\n  blockTitle: \"Recommended products\",\n  cssUrl: \"\",\n  locale: \"en-US\",\n  currencySign: \"€\",\n  pricePrefix: \"\",\n  imageRatio: 1,\n  noResultText: \"No results! Please, try again later.\",\n  noResultShow: true,\n  gridArrowsDynamic: false,\n  token:\n    \"eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJzdWIiOjgzLCJqdGkiOiI3ZTg2Y2I1YS00ZTFjLTRhYjctYjU2My1lN2FjMTYzZTYyZDIiLCJzY29wZXMiOlsidnByIiwidnBzIiwidnBjIl19.SbaQnBkvoXer3GPCWUthFQStFKLHZNMBfj4Qu44WHM8nzaIt48I74yVy4gVbX29vtd6jIkDPdakqEXRXmAxOCtv7_nsd4iBs1yMegfOWW5g8f10PKfZqmWJcfhwKIEElnUMFmP6rXpogntZ7iFfeTBbiRNzQPhkaa7jUjgQkCC4\",\n};\n\nContinuity.decorators = [continuityDecorator];\n\nContinuity.argTypes = {\n  ...continuityLayoutArgs,\n};\n\nexport const Grid = Template.bind({});\nGrid.args = {\n  analyticsId: \"UA-34442043-5\",\n  apiPath: \"https://api.vviinn.com\",\n  campaigns: \"\",\n  campaignType: \"VPR\",\n  contentAlignment: \"Centered\",\n  imageWidth: 420,\n  mode: \"grid\",\n  color: \"\",\n  primaryTextColor: \"#161616\",\n  productId: \"4114460310\",\n  recommendationsGridProductsDesktop: 4,\n  recommendationsGridProductsMobile: 4,\n  recommendationsGridProductsTablet: 4,\n  secondaryTextColor: \"#757575\",\n  showScroll: true,\n  showTitle: true,\n  titleFontSize: 28,\n  blockTitle: \"Recommended products\",\n  cssUrl: \"\",\n  locale: \"en-US\",\n  currencySign: \"€\",\n  pricePrefix: \"\",\n  imageRatio: 1,\n  noResultText: \"No results! Please, try again later.\",\n  noResultShow: true,\n  gridArrowsDynamic: false,\n  token:\n    \"eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJzdWIiOjgzLCJqdGkiOiI3ZTg2Y2I1YS00ZTFjLTRhYjctYjU2My1lN2FjMTYzZTYyZDIiLCJzY29wZXMiOlsidnByIiwidnBzIiwidnBjIl19.SbaQnBkvoXer3GPCWUthFQStFKLHZNMBfj4Qu44WHM8nzaIt48I74yVy4gVbX29vtd6jIkDPdakqEXRXmAxOCtv7_nsd4iBs1yMegfOWW5g8f10PKfZqmWJcfhwKIEElnUMFmP6rXpogntZ7iFfeTBbiRNzQPhkaa7jUjgQkCC4\",\n};\n\nGrid.argTypes = {\n  ...gridLayoutArgs,\n};\n\nGrid.decorators = [gridDecorator];\n"]}

package/dist/collection/components/vviinn-vpr-widget/token-helpers.js

@@ -9,3 +9,4 @@ const createFetchAuthOptions = (x) => {
   };
 };
 export const createBearAuthedHeader = flow(createBearerString, createAuthedHeader, createFetchAuthOptions);
+//# sourceMappingURL=token-helpers.js.map

package/dist/collection/components/vviinn-vpr-widget/token-helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"token-helpers.js","sourceRoot":"","sources":["../../../src/components/vviinn-vpr-widget/token-helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAE1C,MAAM,kBAAkB,GAAG,CAAC,CAAS,EAAU,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC;AAEhE,MAAM,kBAAkB,GAAG,CAAC,CAAS,EAAW,EAAE,CAChD,IAAI,OAAO,CAAC;EACV,aAAa,EAAE,CAAC;CACjB,CAAC,CAAC;AAEL,MAAM,sBAAsB,GAAG,CAAC,CAAU,EAAe,EAAE;EACzD,OAAO;IACL,OAAO,EAAE,CAAC;GACX,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,IAAI,CACxC,kBAAkB,EAClB,kBAAkB,EAClB,sBAAsB,CACvB,CAAC","sourcesContent":["import { flow } from \"fp-ts/lib/function\";\n\nconst createBearerString = (x: string): string => `Bearer ${x}`;\n\nconst createAuthedHeader = (x: string): Headers =>\n  new Headers({\n    Authorization: x,\n  });\n\nconst createFetchAuthOptions = (x: Headers): RequestInit => {\n  return {\n    headers: x,\n  };\n};\n\nexport const createBearAuthedHeader = flow(\n  createBearerString,\n  createAuthedHeader,\n  createFetchAuthOptions\n);\n"]}