@beamimpact/web-sdk 1.38.0 → 1.39.0

package/dist/components/post-purchase.js.map

@@ -1 +1 @@
-{"version":3,"file":"post-purchase.js","sources":["../../src/components/post-purchase/index.ts"],"sourcesContent":["import { html, LitElement, PropertyValues } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { state } from \"lit/decorators/state.js\";\nimport { MissingConfig } from \"../../utils/beam-errors\";\nimport { deleteCookieValue, getCookieValue } from \"../../utils/cookies\";\nimport { cssReset } from \"../../shared/css-reset\";\nimport { defineCustomElement } from \"../../shared/defineCustomElement\";\nimport { createScopedLocalStorage } from \"../../utils/local-storage\";\nimport { AsyncController } from \"../../shared/controllers/async-controller\";\nimport { _errorMessage } from \"../../shared/fragments/error-message-template\";\nimport { enforceConfig } from \"../../shared/enforce-config\";\nimport { LANGUAGES } from \"../../api-sdk/types\";\nimport { DEFAULT_BASE_URL } from \"../../api-sdk/constants\";\nimport { postTransaction } from \"../../api-sdk/v3/routes\";\nimport \"../redeem-transaction\";\nimport \"../impact-overview\";\nimport { BEAM_CART_COOKIE_NAME, TBeamCartLocalStorage, TCart } from \"../../shared/cart-contents\";\nimport { BeamNonprofitSelectEvent, BeamOrderCreatedEvent } from \"../../utils/events\";\n\nconst REQUIRED_DATA_PROPS = [\"baseUrl\", \"apiKey\", \"orderId\", \"cartTotal\", \"currencyCode\", \"lang\"];\nconst OPTIONAL_DATA_PROPS = [\"storeId\", \"postalCode\", \"countryCode\", \"cart\", \"discountCodes\", \"email\", \"partnerUserId\"];\n\nexport class BeamPostPurchase extends LitElement {\n  static tagName = \"beam-post-purchase\";\n\n  @property({ type: String })\n  public baseUrl: string = DEFAULT_BASE_URL;\n\n  @property({ type: String })\n  public apiKey!: string;\n\n  @property({ type: Number, reflect: true })\n  public storeId?: number; // Either storeId or postalCode, countryCode must be provided\n\n  @property({ type: String })\n  public postalCode?: string;\n\n  @property({ type: String })\n  public countryCode?: string;\n\n  @property({ type: String })\n  public orderId!: string;\n\n  /**\n   * Either email or partnerUserId is required\n   */\n  @property({ type: String })\n  public email?: string;\n\n  /**\n   * Either email or partnerUserId is required\n   */\n  @property({ type: String })\n  public partnerUserId?: string;\n\n  @property({ type: Number })\n  public cartTotal!: number;\n\n  @property({ type: String })\n  public currencyCode = \"USD\";\n\n  @property({ type: String })\n  public lang: LANGUAGES = \"en\";\n\n  @property({ type: Object })\n  public cart?: TCart;\n\n  @property({ type: Array })\n  public discountCodes?: string[];\n\n  @property({ type: String })\n  public domain?: string;\n\n  @property({ type: Boolean })\n  public debug = false;\n\n  @state() private activeWidget: \"redeem-transaction\" | \"impact-overview\" | null = null; // wait for postTransaction\n  @state() private nonprofitId: number | null = null; // from localStorage or redeem-transaction result\n  @state() private selectionId: string | null = null; // from localStorage\n  @state() private cartId: string | null = null; // from localStorage, external cart ID\n  @state() private beamCartId: string | null = null; // from cookie, Beam cart ID\n  @state() private userId: string | null = null; // from postTransaction\n  @state() private transactionId: string | null = null; // from postTransaction\n\n  private localStorage = createScopedLocalStorage(this);\n\n  firstUpdated(_changedProperties: PropertyValues) {\n    this.enforceConfig();\n    this.nonprofitId = Number(this.localStorage.getItem(\"nonprofit\")) || null;\n    this.selectionId = this.localStorage.getItem(\"transaction\") || null;\n    this.cartId = this.localStorage.getItemJson<TBeamCartLocalStorage>(\"cart\")?.cartId || null;\n    // Reading beamCartId from cookies instead of localStorage allows it to work across subdomains\n    this.beamCartId = getCookieValue(BEAM_CART_COOKIE_NAME) || null;\n\n    if (this.selectionId && this.nonprofitId) {\n      this.activeWidget = \"impact-overview\";\n    }\n  }\n\n  async updated(previousPropertyValues: PropertyValues) {\n    // Also fires on first load as props go from undefined => value\n    const refreshOnChangeProps = [...REQUIRED_DATA_PROPS, ...OPTIONAL_DATA_PROPS];\n    if (refreshOnChangeProps.some((p) => previousPropertyValues.has(p))) {\n      await this.transactionDataController.exec();\n    }\n  }\n\n  enforceConfig() {\n    enforceConfig(REQUIRED_DATA_PROPS, this);\n\n    if (!this.email && !this.partnerUserId) {\n      throw new MissingConfig(\n        [this.email ? \"\" : \"email\", this.partnerUserId ? \"\" : \"partnerUserId\"].filter(Boolean),\n        \"At least one of [email, partnerUserId] must be provided\"\n      );\n    }\n  }\n\n  handlePostTransaction = async () => {\n    this.enforceConfig();\n    const result = await postTransaction({\n      baseUrl: this.baseUrl,\n      headers: {\n        authorization: `Api-Key ${this.apiKey}`,\n      },\n      requestBody: {\n        nonprofitId: this.nonprofitId || undefined,\n        selectionId: this.selectionId || undefined,\n        cartId: this.cartId || undefined,\n        beamCartId: this.beamCartId || undefined,\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        storeId: this.storeId,\n        orderId: this.orderId,\n        cartTotal: this.cartTotal,\n        email: this.email, // One or both of email & partnerUserId should be defined\n        partnerUserId: this.partnerUserId, // One or both of email & partnerUserId should be defined\n        currencyCode: this.currencyCode,\n        postalCode: this.postalCode,\n        countryCode: this.countryCode,\n        cart: this.cart,\n        discountCodes: this.discountCodes,\n      },\n    });\n\n    this.transactionId = result.transactionId;\n    this.userId = result.beamUserId;\n    this.nonprofitId = result.nonprofitId;\n\n    this.activeWidget = this.nonprofitId ? \"impact-overview\" : \"redeem-transaction\";\n\n    this.localStorage.removeItem(\"transaction\");\n    this.localStorage.removeItem(\"cart\");\n    deleteCookieValue({ name: BEAM_CART_COOKIE_NAME, path: \"/\", domain: this.domain });\n\n    // Emit order created event only when order is registered with Beam for the first time\n    if (result.transactionCreated) {\n      dispatchEvent(\n        new BeamOrderCreatedEvent({\n          transactionId: result.transactionId,\n          orderId: this.orderId,\n          cartTotal: this.cartTotal,\n          currencyCode: this.currencyCode,\n        })\n      );\n    }\n    return result;\n  };\n\n  private transactionDataController = new AsyncController<typeof this.handlePostTransaction>(\n    this,\n    this.handlePostTransaction\n  );\n\n  render() {\n    if (this.transactionDataController.loading) {\n      return \"\";\n    }\n    if (this.transactionDataController.error) {\n      if (this.debug) {\n        return _errorMessage({ error: this.transactionDataController.error });\n      }\n      return \"\";\n    }\n    if (this.activeWidget === \"redeem-transaction\") {\n      return html`\n        <beam-redeem-transaction\n          part=\"redeem-transaction\"\n          baseUrl=\"${this.baseUrl}\"\n          apiKey=\"${this.apiKey}\"\n          storeId=\"${this.storeId}\"\n          postalCode=\"${this.postalCode}\"\n          countryCode=\"${this.countryCode}\"\n          transactionId=\"${this.transactionId}\"\n          cart=\"${JSON.stringify(this.cart)}\"\n          lang=\"${this.lang}\"\n          ?debug=\"${this.debug}\"\n          @beamnonprofitselect=\"${(event: Event) => {\n            if (!(event instanceof CustomEvent)) return; // TS guard\n            const { selectedNonprofitId } = (event as BeamNonprofitSelectEvent).detail;\n            this.nonprofitId = selectedNonprofitId ?? null;\n            this.activeWidget = \"impact-overview\";\n          }}\"\n        ></beam-redeem-transaction>\n      `;\n    }\n    if (this.activeWidget === \"impact-overview\") {\n      return html`\n        <beam-impact-overview\n          part=\"impact-overview\"\n          storeId=\"${this.storeId}\"\n          baseUrl=\"${this.baseUrl}\"\n          apiKey=\"${this.apiKey}\"\n          userId=\"${this.userId}\"\n          nonprofitId=\"${this.nonprofitId}\"\n          lang=\"${this.lang}\"\n          ?debug=\"${this.debug}\"\n        ></beam-impact-overview>\n      `;\n    }\n    return \"\";\n  }\n\n  static styles = [cssReset];\n}\n\ndefineCustomElement(BeamPostPurchase);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"beam-post-purchase\": BeamPostPurchase;\n  }\n}\n"],"names":["REQUIRED_DATA_PROPS","OPTIONAL_DATA_PROPS","BeamPostPurchase","LitElement","DEFAULT_BASE_URL","createScopedLocalStorage","result","postTransaction","deleteCookieValue","BEAM_CART_COOKIE_NAME","BeamOrderCreatedEvent","AsyncController","_changedProperties","getCookieValue","previousPropertyValues","p","enforceConfig","MissingConfig","_errorMessage","html","event","selectedNonprofitId","cssReset","__decorateClass","property","state","defineCustomElement"],"mappings":"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"}
+{"version":3,"file":"post-purchase.js","sources":["../../src/components/post-purchase/index.ts"],"sourcesContent":["import { html, LitElement, PropertyValues } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { state } from \"lit/decorators/state.js\";\nimport { MissingConfig } from \"../../utils/beam-errors\";\nimport { deleteCookieValue, getCookieValue } from \"../../utils/cookies\";\nimport { cssReset } from \"../../shared/css-reset\";\nimport { defineCustomElement } from \"../../shared/defineCustomElement\";\nimport { createScopedLocalStorage } from \"../../utils/local-storage\";\nimport { AsyncController } from \"../../shared/controllers/async-controller\";\nimport { _errorMessage } from \"../../shared/fragments/error-message-template\";\nimport { enforceConfig } from \"../../shared/enforce-config\";\nimport { LANGUAGES } from \"../../api-sdk/types\";\nimport { DEFAULT_BASE_URL } from \"../../api-sdk/constants\";\nimport { postTransaction } from \"../../api-sdk/v3/routes\";\nimport \"../redeem-transaction\";\nimport \"../impact-overview\";\nimport { BEAM_CART_COOKIE_NAME, TBeamCartLocalStorage, TCart } from \"../../shared/cart-contents\";\nimport { BeamNonprofitSelectEvent, BeamOrderCreatedEvent } from \"../../utils/events\";\n\nconst REQUIRED_DATA_PROPS = [\"baseUrl\", \"apiKey\", \"orderId\", \"cartTotal\", \"currencyCode\", \"lang\"];\nconst OPTIONAL_DATA_PROPS = [\"storeId\", \"postalCode\", \"countryCode\", \"cart\", \"discountCodes\", \"email\", \"partnerUserId\"];\n\nexport class BeamPostPurchase extends LitElement {\n  static tagName = \"beam-post-purchase\";\n\n  @property({ type: String })\n  public baseUrl: string = DEFAULT_BASE_URL;\n\n  @property({ type: String })\n  public apiKey!: string;\n\n  @property({ type: Number, reflect: true })\n  public storeId?: number; // Either storeId or postalCode, countryCode must be provided\n\n  @property({ type: String })\n  public postalCode?: string;\n\n  @property({ type: String })\n  public countryCode?: string;\n\n  @property({ type: String })\n  public orderId!: string;\n\n  /**\n   * Either email or partnerUserId is required\n   */\n  @property({ type: String })\n  public email?: string;\n\n  /**\n   * Either email or partnerUserId is required\n   */\n  @property({ type: String })\n  public partnerUserId?: string;\n\n  @property({ type: Number })\n  public cartTotal!: number;\n\n  @property({ type: String })\n  public currencyCode = \"USD\";\n\n  @property({ type: String })\n  public lang: LANGUAGES = \"en\";\n\n  @property({ type: Object })\n  public cart?: TCart;\n\n  @property({ type: Array })\n  public discountCodes?: string[];\n\n  @property({ type: String })\n  public domain?: string;\n\n  @property({ type: Boolean })\n  public debug = false;\n\n  @state() private activeWidget: \"redeem-transaction\" | \"impact-overview\" | null = null; // wait for postTransaction\n  @state() private nonprofitId: number | null = null; // from localStorage or redeem-transaction result\n  @state() private selectionId: string | null = null; // from localStorage\n  @state() private cartId: string | null = null; // from localStorage, external cart ID\n  @state() private beamCartId: string | null = null; // from cookie, Beam cart ID\n  @state() private userId: string | null = null; // from postTransaction\n  @state() private transactionId: string | null = null; // from postTransaction\n\n  private localStorage = createScopedLocalStorage(this);\n\n  firstUpdated(_changedProperties: PropertyValues) {\n    this.enforceConfig();\n    this.nonprofitId = Number(this.localStorage.getItem(\"nonprofit\")) || null;\n    this.selectionId = this.localStorage.getItem(\"transaction\") || null;\n    this.cartId = this.localStorage.getItemJson<TBeamCartLocalStorage>(\"cart\")?.cartId || null;\n    // Reading beamCartId from cookies instead of localStorage allows it to work across subdomains\n    this.beamCartId = getCookieValue(BEAM_CART_COOKIE_NAME) || null;\n\n    if (this.selectionId && this.nonprofitId) {\n      this.activeWidget = \"impact-overview\";\n    }\n  }\n\n  async updated(previousPropertyValues: PropertyValues) {\n    // Also fires on first load as props go from undefined => value\n    const refreshOnChangeProps = [...REQUIRED_DATA_PROPS, ...OPTIONAL_DATA_PROPS];\n    if (refreshOnChangeProps.some((p) => previousPropertyValues.has(p))) {\n      await this.transactionDataController.exec();\n    }\n  }\n\n  enforceConfig() {\n    enforceConfig(REQUIRED_DATA_PROPS, this);\n\n    if (!this.email && !this.partnerUserId) {\n      throw new MissingConfig(\n        [this.email ? \"\" : \"email\", this.partnerUserId ? \"\" : \"partnerUserId\"].filter(Boolean),\n        \"At least one of [email, partnerUserId] must be provided\"\n      );\n    }\n  }\n\n  handlePostTransaction = async () => {\n    this.enforceConfig();\n    const result = await postTransaction({\n      baseUrl: this.baseUrl,\n      headers: {\n        authorization: `Api-Key ${this.apiKey}`,\n      },\n      requestBody: {\n        nonprofitId: this.nonprofitId || undefined,\n        selectionId: this.selectionId || undefined,\n        cartId: this.cartId || undefined,\n        beamCartId: this.beamCartId || undefined,\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        storeId: this.storeId,\n        orderId: this.orderId,\n        cartTotal: this.cartTotal,\n        email: this.email, // One or both of email & partnerUserId should be defined\n        partnerUserId: this.partnerUserId, // One or both of email & partnerUserId should be defined\n        currencyCode: this.currencyCode,\n        postalCode: this.postalCode,\n        countryCode: this.countryCode,\n        cart: this.cart,\n        discountCodes: this.discountCodes,\n      },\n    });\n\n    this.transactionId = result.transactionId;\n    this.userId = result.beamUserId;\n    this.nonprofitId = result.nonprofitId;\n\n    this.activeWidget = this.nonprofitId ? \"impact-overview\" : \"redeem-transaction\";\n\n    this.localStorage.removeItem(\"transaction\");\n    this.localStorage.removeItem(\"cart\");\n    deleteCookieValue({ name: BEAM_CART_COOKIE_NAME, path: \"/\", domain: this.domain });\n\n    // Emit order created event only when order is registered with Beam for the first time\n    if (result.transactionCreated) {\n      dispatchEvent(\n        new BeamOrderCreatedEvent({\n          transactionId: result.transactionId,\n          orderId: this.orderId,\n          cartTotal: this.cartTotal,\n          currencyCode: this.currencyCode,\n        })\n      );\n    }\n    return result;\n  };\n\n  private transactionDataController = new AsyncController<typeof this.handlePostTransaction>(\n    this,\n    this.handlePostTransaction\n  );\n\n  render() {\n    if (this.transactionDataController.loading) {\n      return \"\";\n    }\n    if (this.transactionDataController.error) {\n      if (this.debug) {\n        return _errorMessage({ error: this.transactionDataController.error });\n      }\n      return \"\";\n    }\n    if (this.activeWidget === \"redeem-transaction\") {\n      return html`\n        <beam-redeem-transaction\n          part=\"redeem-transaction\"\n          baseUrl=\"${this.baseUrl}\"\n          apiKey=\"${this.apiKey}\"\n          storeId=\"${this.storeId}\"\n          postalCode=\"${this.postalCode}\"\n          countryCode=\"${this.countryCode}\"\n          transactionId=\"${this.transactionId}\"\n          cart=\"${JSON.stringify(this.cart)}\"\n          lang=\"${this.lang}\"\n          ?debug=\"${this.debug}\"\n          @beamnonprofitselect=\"${(event: Event) => {\n            if (!(event instanceof CustomEvent)) return; // TS guard\n            const { selectedNonprofitId } = (event as BeamNonprofitSelectEvent).detail;\n            this.nonprofitId = selectedNonprofitId ?? null;\n            this.activeWidget = \"impact-overview\";\n          }}\"\n        ></beam-redeem-transaction>\n      `;\n    }\n    if (this.activeWidget === \"impact-overview\") {\n      return html`\n        <beam-impact-overview\n          part=\"impact-overview\"\n          storeId=\"${this.storeId}\"\n          baseUrl=\"${this.baseUrl}\"\n          apiKey=\"${this.apiKey}\"\n          userId=\"${this.userId}\"\n          nonprofitId=\"${this.nonprofitId}\"\n          lang=\"${this.lang}\"\n          ?debug=\"${this.debug}\"\n        ></beam-impact-overview>\n      `;\n    }\n    return \"\";\n  }\n\n  static styles = [cssReset];\n}\n\ndefineCustomElement(BeamPostPurchase);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"beam-post-purchase\": BeamPostPurchase;\n  }\n}\n"],"names":["REQUIRED_DATA_PROPS","OPTIONAL_DATA_PROPS","BeamPostPurchase","LitElement","DEFAULT_BASE_URL","createScopedLocalStorage","result","postTransaction","deleteCookieValue","BEAM_CART_COOKIE_NAME","BeamOrderCreatedEvent","AsyncController","_changedProperties","getCookieValue","previousPropertyValues","p","enforceConfig","MissingConfig","_errorMessage","html","event","selectedNonprofitId","cssReset","__decorateClass","property","state","defineCustomElement"],"mappings":"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"}

package/dist/components/product-details-page.d.ts

@@ -0,0 +1,75 @@
+import * as lit from 'lit';
+import { LitElement } from 'lit';
+import * as lit_html from 'lit-html';
+import { T as TUrl, L as LANGUAGES } from '../chunks/types-aju0qrRe.esm.js';
+
+type RequiredConfig = {
+    apiKey: string;
+    storeId: number;
+};
+declare class BeamProductDetailsPage extends LitElement {
+    static tagName: string;
+    baseUrl: TUrl;
+    apiKey?: RequiredConfig["apiKey"];
+    storeId?: number;
+    lang: LANGUAGES;
+    debug: boolean;
+    get configLang(): LANGUAGES;
+    getProductDetailsPageData: () => Promise<{
+        config: {
+            web: {
+                title: string;
+                description: string;
+                promoDescriptionPrefix?: string | undefined;
+                promoDescription?: string | undefined;
+                theme?: {
+                    [key: string]: unknown;
+                } | null | undefined;
+                nonprofitSelectedHeader?: string | undefined;
+                nonprofitUnselectedHeader?: string | undefined;
+                disableAnimation?: boolean | undefined;
+                promo?: {
+                    "promo-text-long": string;
+                    "promo-text-short": string;
+                    "promo-cause-alt-text": string;
+                } | undefined;
+            };
+            mobileWeb?: {
+                title: string;
+                description: string;
+                nonprofitSelectedHeader?: string | undefined;
+                nonprofitUnselectedHeader?: string | undefined;
+            } | undefined;
+            mobile: {
+                title: string;
+                description: string;
+                nonprofitSelectedHeader?: string | undefined;
+                nonprofitUnselectedHeader?: string | undefined;
+            };
+            enableNonprofitDeselection?: boolean | undefined;
+        };
+        ppgfDisclosure?: {
+            copy: string;
+        } | undefined;
+        ppgfDisclosureHyperlink?: {
+            url: string;
+            copy: string;
+        } | undefined;
+    }>;
+    private productDetailsPageDataController;
+    updated(changedProperties: Map<string, unknown>): Promise<void>;
+    renderWidgetIcon(): lit_html.TemplateResult<1>;
+    render(): lit_html.TemplateResult<1> | "";
+    renderDisclosureTooltip(): lit_html.TemplateResult<1>;
+    renderDisclosureTooltipIcon(): lit_html.TemplateResult<1>;
+    renderDisclosureTooltipHyperlink(): lit_html.TemplateResult<1>;
+    get cssVariables(): any;
+    static styles: lit.CSSResult[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "beam-product-details-page": BeamProductDetailsPage;
+    }
+}
+
+export { BeamProductDetailsPage };

package/dist/components/product-details-page.esm.js

@@ -0,0 +1,118 @@
+import{j as P,f as b,g as d,h as m,y as s}from"../chunks/lit-qtGbjGnK.esm.js";import{c as D,u as g,d as h,e as f,A as v,_ as y,i as u,a as p,b as x}from"../chunks/localize-F31ae3j6.esm.js";import{D as C,i as $,S as k}from"../chunks/routes-2FqTWOCW.esm.js";import{makeApiKeyHeader as F}from"../utils/makeApiKeyHeader.esm.js";import"../chunks/vendor-jQ8cxMpw.esm.js";import"../chunks/shoelace-components-R0WKZ63n.esm.js";import"../chunks/beam-errors-P-Lu07Ce.esm.js";import"../utils/logger.esm.js";const w=(r="",{borderRadius:e="0px",borderStyle:t="unset",borderColor:o="#000000",borderWidth:i="1px"}={})=>{const a=r.startsWith("--beam-")?r:`--beam-${r}`;return{[`${a}-borderRadius`]:e,[`${a}-borderStyle`]:t,[`${a}-borderColor`]:o,[`${a}-borderWidth`]:i}},T=(r="",{borderRadius:e="0px",borderStyle:t="unset",borderColor:o="#000000",borderWidth:i="1px"}={})=>{const a=r.startsWith("--beam-")?r:`--beam-${r}`;return P(`        border-radius: var(${a}-borderRadius, ${e});
+        border-style: var(${a}-borderStyle, ${t});
+        border-color: var(${a}-borderColor, ${o});
+        border-width: var(${a}-borderWidth, ${i});
+    `)};var S=Object.defineProperty,G=Object.getOwnPropertyDescriptor,n=(r,e,t,o)=>{for(var i=o>1?void 0:o?G(e,t):e,a=r.length-1,c;a>=0;a--)(c=r[a])&&(i=(o?c(e,t,i):c(i))||i);return o&&i&&S(e,t,i),i};const I="--beam-ProductDetailsPage-imageUrl";class l extends m{constructor(){super(...arguments),this.baseUrl=C,this.lang="en",this.debug=!1,this.getProductDetailsPageData=async()=>(f(["apiKey","storeId"],this),await $({baseUrl:this.baseUrl,headers:F(this.apiKey),queryParams:{version:"1.0.0",lang:this.configLang,storeId:this.storeId,widgetName:"product-details-page"}})),this.productDetailsPageDataController=new v(this,this.getProductDetailsPageData)}get configLang(){return k[this.lang]||"en"}async updated(e){const t=["storeId","baseUrl","lang","apiKey"];for(const o of t)if(e.has(o)){await this.productDetailsPageDataController.exec();break}}renderWidgetIcon(){const e=this.cssVariables[I];return e?s`
+    <span class="icon-container">
+      <img src=${e} alt="Widget Icon"></img>
+    </span>
+    `:s``}render(){const{data:e,loading:t}=this.productDetailsPageDataController;return t?s``:e==null?this.debug?y({error:new Error("No data")}):"":s`
+      <style>
+        :host {
+          ${this.cssVariables.toCSS()}
+        }
+      </style>
+      <div class="root">
+        ${this.renderWidgetIcon()}
+        <span class="info-container">
+          <div class="title-block">
+            <h3 class="title">${u(this.configLang,e.config?.web?.title)}</h3>
+          </div>
+          <div class="description-block">
+            <span class="description"> ${u(this.configLang,e.config?.web?.description)}</span
+            >${this.renderDisclosureTooltip()}
+          </div>
+        </span>
+      </div>
+    `}renderDisclosureTooltip(){const e=this.productDetailsPageDataController.data?.ppgfDisclosure;return e?s`<sl-tooltip class="ppgf-disclosure-tooltip">
+          <div class="ppgf-disclosure-tooltip-content" slot="content">
+            ${e.copy} ${this.renderDisclosureTooltipHyperlink()}
+          </div>
+          ${this.renderDisclosureTooltipIcon()}
+        </sl-tooltip>`:s``}renderDisclosureTooltipIcon(){return s`<sl-icon
+      library="lucide"
+      name="info"
+      label="ppgf-disclosure-tooltip-icon"
+      class="ppgf-disclosure-tooltip-icon"
+    ></sl-icon>`}renderDisclosureTooltipHyperlink(){const e=this.productDetailsPageDataController.data?.ppgfDisclosureHyperlink;return e?s`<a class="ppgf-disclosure-hyperlink" href="${e.url}" target="_blank">${e.copy}</a>`:s``}get cssVariables(){const e={"--beam-ProductDetailsPage-imageWidth":"24px","--beam-ProductDetailsPage-imageHeight":"24px","--beam-ProductDetailsPage-maxWidth":"346px","--beam-ProductDetailsPage-paddingTop":"8px","--beam-ProductDetailsPage-paddingRight":"12px","--beam-ProductDetailsPage-paddingBottom":"8px","--beam-ProductDetailsPage-paddingLeft":"15px","--beam-ProductDetailsPage-InfoContainer-marginLeft":"8px","--beam-ProductDetailsPage-backgroundColor":"unset","--beam-ProductDetailsPage-TooltipIcon-width":"10px","--beam-ProductDetailsPage-TooltipIcon-color":"inherit","--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor":"#000000","--beam-ProductDetailsPage-PPGFDisclosure-paddingTop":"10px","--beam-ProductDetailsPage-PPGFDisclosure-paddingRight":"8px","--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom":"10px","--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft":"8px","--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color":"#5CA3FF",...p("--beam-ProductDetailsPage-title",{fontSize:"11px",fontWeight:"bold"}),"--beam-ProductDetailsPage-title-textAlign":"left",...p("--beam-ProductDetailsPage-description",{marginTop:"4px",fontSize:"11px",lineHeight:"15px"}),"--beam-ProductDetailsPage-description-textAlign":"left",...p("--beam-ProductDetailsPage-PPGFDisclosureTooltipContent",{fontSize:"12px",lineHeight:"16px",color:"#FFFFFF"}),...w("--beam-ProductDetailsPage")},t=this.productDetailsPageDataController?.data?.config?.web?.theme||{},o={...e,...t};return Object.assign(Object.create({toCSS(){return x(this)}}),o)}}l.tagName="beam-product-details-page",l.styles=[D,b`
+      :host {
+        font-family: var(--beam-fontFamily);
+        font-style: var(--beam-fontStyle);
+        font-size: var(--beam-fontSize);
+        background-color: var(--beam-backgroundColor);
+        color: var(--beam-textColor);
+        max-width: var(--beam-ProductDetailsPage-maxWidth);
+        word-break: normal;
+        display: block;
+      }
+      .root {
+        display: flex;
+        align-items: center;
+        padding-top: var(--beam-ProductDetailsPage-paddingTop);
+        padding-right: var(--beam-ProductDetailsPage-paddingRight);
+        padding-bottom: var(--beam-ProductDetailsPage-paddingBottom);
+        padding-left: var(--beam-ProductDetailsPage-paddingLeft);
+        width: 100%;
+        background-color: var(--beam-ProductDetailsPage-backgroundColor);
+        ${T("--beam-ProductDetailsPage")}
+      }
+      .icon-container {
+        width: var(--beam-ProductDetailsPage-imageWidth);
+        height: var(--beam-ProductDetailsPage-imageHeight);
+        flex-shrink: 0;
+      }
+      .icon-container > img {
+        width: 100%;
+        height: 100%;
+        object-fit: contain;
+      }
+      .info-container {
+        margin-left: var(--beam-ProductDetailsPage-InfoContainer-marginLeft);
+      }
+      .title {
+        ${g("--beam-ProductDetailsPage-title")}
+      }
+      .title-block {
+        text-align: var(--beam-ProductDetailsPage-title-textAlign);
+        line-height: var(--beam-ProductDetailsPage-title-lineHeight);
+      }
+      .description {
+        ${g("--beam-ProductDetailsPage-description")}
+      }
+      .description-block {
+        text-align: var(--beam-ProductDetailsPage-description-textAlign);
+        line-height: var(--beam-ProductDetailsPage-description-lineHeight);
+      }
+      .ppgf-disclosure-tooltip {
+        --max-width: 268px;
+      }
+      .ppgf-disclosure-tooltip::part(body) {
+        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);
+        padding-top: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingTop);
+        padding-right: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingRight);
+        padding-bottom: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom);
+        padding-left: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft);
+      }
+      .ppgf-disclosure-tooltip::part(base__arrow) {
+        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);
+      }
+      .ppgf-disclosure-tooltip-content {
+        ${g("--beam-ProductDetailsPage-PPGFDisclosureTooltipContent")}
+      }
+      .ppgf-disclosure-hyperlink {
+        pointer-events: auto;
+        user-select: auto;
+        -webkit-user-select: auto;
+        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);
+      }
+      .ppgf-disclosure-hyperlink:visited {
+        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);
+      }
+      .ppgf-disclosure-tooltip-icon {
+        width: var(--beam-ProductDetailsPage-TooltipIcon-width);
+        color: var(--beam-ProductDetailsPage-TooltipIcon-color);
+        height: auto;
+        vertical-align: middle;
+      }
+    `],n([d({type:String,reflect:!0})],l.prototype,"baseUrl",2),n([d({type:String,reflect:!1})],l.prototype,"apiKey",2),n([d({type:Number})],l.prototype,"storeId",2),n([d({type:String})],l.prototype,"lang",2),n([d({type:Boolean})],l.prototype,"debug",2),h(l);export{l as BeamProductDetailsPage};
+//# sourceMappingURL=product-details-page.esm.js.map

package/dist/components/product-details-page.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-details-page.esm.js","sources":["../../src/shared/fragments/custom-border.ts","../../src/components/product-details-page/index.ts"],"sourcesContent":["import { CSSResult, unsafeCSS } from \"lit\";\n\nexport const defineCustomBorder = (\n  namespace = \"\",\n  { borderRadius = \"0px\", borderStyle = \"unset\", borderColor = \"#000000\", borderWidth = \"1px\" } = {}\n): Record<string, string> => {\n  const prefix = namespace.startsWith(\"--beam-\") ? namespace : `--beam-${namespace}`;\n  return {\n    [`${prefix}-borderRadius`]: borderRadius,\n    [`${prefix}-borderStyle`]: borderStyle,\n    [`${prefix}-borderColor`]: borderColor,\n    [`${prefix}-borderWidth`]: borderWidth,\n  };\n};\n\nexport const useCustomBorder = (\n  namespace = \"\",\n  { borderRadius = \"0px\", borderStyle = \"unset\", borderColor = \"#000000\", borderWidth = \"1px\" } = {}\n): CSSResult => {\n  const prefix = namespace.startsWith(\"--beam-\") ? namespace : `--beam-${namespace}`;\n  return unsafeCSS(`\\\n        border-radius: var(${prefix}-borderRadius, ${borderRadius});\n        border-style: var(${prefix}-borderStyle, ${borderStyle});\n        border-color: var(${prefix}-borderColor, ${borderColor});\n        border-width: var(${prefix}-borderWidth, ${borderWidth});\n    `);\n};\n","import { LitElement, css, html } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { AsyncController } from \"../../shared/controllers/async-controller\";\nimport { getProductDetailsPage } from \"../../api-sdk/v3/routes\";\nimport { DEFAULT_BASE_URL, SUPPORTED_LANGUAGES } from \"../../api-sdk/constants\";\nimport { LANGUAGES, TUrl } from \"../../api-sdk/types\";\nimport { makeApiKeyHeader } from \"../../utils/makeApiKeyHeader\";\nimport { MissingConfig } from \"../../utils/beam-errors\";\nimport { enforceConfig } from \"../../shared/enforce-config\";\nimport { _cssVariableMap } from \"../../shared/fragments/css-variable-map\";\nimport { localizeUserString } from \"../../shared/localize\";\nimport { _errorMessage } from \"../../shared/fragments/error-message-template\";\nimport { defineCustomElement } from \"../../shared/defineCustomElement\";\nimport { cssReset } from \"../../shared/css-reset\";\nimport { defineCustomText, useCustomText } from \"../../shared/fragments/custom-text\";\nimport { defineCustomBorder, useCustomBorder } from \"../../shared/fragments/custom-border\";\n\n// shoelace html tag imports\nimport \"@shoelace-style/shoelace/dist/components/tooltip/tooltip.js\";\nimport \"../../shared/shoelace-components\";\n\ntype RequiredConfig = {\n  apiKey: string;\n  storeId: number;\n};\n\nconst IMAGE_URL_REMOTE_CONFIG_KEY = \"--beam-ProductDetailsPage-imageUrl\";\n\nexport class BeamProductDetailsPage extends LitElement {\n  static tagName = \"beam-product-details-page\";\n\n  @property({ type: String, reflect: true }) public baseUrl: TUrl = DEFAULT_BASE_URL;\n\n  @property({ type: String, reflect: false }) apiKey?: RequiredConfig[\"apiKey\"];\n\n  @property({ type: Number }) storeId?: number;\n\n  @property({ type: String }) public lang: LANGUAGES = \"en\";\n\n  @property({ type: Boolean }) public debug = false;\n\n  get configLang() {\n    return SUPPORTED_LANGUAGES[this.lang] || \"en\";\n  }\n\n  getProductDetailsPageData = async () => {\n    if (!enforceConfig<RequiredConfig>([\"apiKey\", \"storeId\"], this)) throw new MissingConfig();\n\n    const res = await getProductDetailsPage({\n      baseUrl: this.baseUrl,\n      headers: makeApiKeyHeader(this.apiKey),\n      queryParams: {\n        version: \"1.0.0\",\n        lang: this.configLang,\n        storeId: this.storeId,\n        widgetName: \"product-details-page\",\n      },\n    });\n    return res;\n  };\n\n  private productDetailsPageDataController = new AsyncController<typeof this.getProductDetailsPageData>(\n    this,\n    this.getProductDetailsPageData\n  );\n\n  async updated(changedProperties: Map<string, unknown>) {\n    const requireNewDataProps = [\"storeId\", \"baseUrl\", \"lang\", \"apiKey\"];\n    for (const prop of requireNewDataProps) {\n      if (changedProperties.has(prop)) {\n        await this.productDetailsPageDataController.exec();\n        break;\n      }\n    }\n  }\n\n  renderWidgetIcon() {\n    const imageUrl = this.cssVariables[IMAGE_URL_REMOTE_CONFIG_KEY];\n\n    return imageUrl\n      ? html`\n    <span class=\"icon-container\">\n      <img src=${imageUrl} alt=\"Widget Icon\"></img>\n    </span>\n    `\n      : html``;\n  }\n\n  render() {\n    const { data, loading } = this.productDetailsPageDataController;\n    if (loading) {\n      return html``;\n    }\n    if (data == null) {\n      if (this.debug) {\n        return _errorMessage({ error: new Error(\"No data\") });\n      }\n      return \"\";\n    }\n    return html`\n      <style>\n        :host {\n          ${this.cssVariables.toCSS()}\n        }\n      </style>\n      <div class=\"root\">\n        ${this.renderWidgetIcon()}\n        <span class=\"info-container\">\n          <div class=\"title-block\">\n            <h3 class=\"title\">${localizeUserString(this.configLang, data.config?.web?.title)}</h3>\n          </div>\n          <div class=\"description-block\">\n            <span class=\"description\"> ${localizeUserString(this.configLang, data.config?.web?.description)}</span\n            >${this.renderDisclosureTooltip()}\n          </div>\n        </span>\n      </div>\n    `;\n  }\n\n  /* PayPal Giving Fund Disclosure */\n  renderDisclosureTooltip() {\n    const ppgfDisclosure = this.productDetailsPageDataController.data?.ppgfDisclosure;\n    return ppgfDisclosure\n      ? html`<sl-tooltip class=\"ppgf-disclosure-tooltip\">\n          <div class=\"ppgf-disclosure-tooltip-content\" slot=\"content\">\n            ${ppgfDisclosure.copy} ${this.renderDisclosureTooltipHyperlink()}\n          </div>\n          ${this.renderDisclosureTooltipIcon()}\n        </sl-tooltip>`\n      : html``;\n  }\n\n  renderDisclosureTooltipIcon() {\n    return html`<sl-icon\n      library=\"lucide\"\n      name=\"info\"\n      label=\"ppgf-disclosure-tooltip-icon\"\n      class=\"ppgf-disclosure-tooltip-icon\"\n    ></sl-icon>`;\n  }\n\n  renderDisclosureTooltipHyperlink() {\n    const ppgfHyperlink = this.productDetailsPageDataController.data?.ppgfDisclosureHyperlink;\n    return ppgfHyperlink\n      ? html`<a class=\"ppgf-disclosure-hyperlink\" href=\"${ppgfHyperlink.url}\" target=\"_blank\">${ppgfHyperlink.copy}</a>`\n      : html``;\n  }\n  /* End PayPal Giving Fund Disclosure */\n\n  public get cssVariables() {\n    const defaults = {\n      \"--beam-ProductDetailsPage-imageWidth\": \"24px\",\n      \"--beam-ProductDetailsPage-imageHeight\": \"24px\",\n      \"--beam-ProductDetailsPage-maxWidth\": \"346px\",\n      \"--beam-ProductDetailsPage-paddingTop\": \"8px\",\n      \"--beam-ProductDetailsPage-paddingRight\": \"12px\",\n      \"--beam-ProductDetailsPage-paddingBottom\": \"8px\",\n      \"--beam-ProductDetailsPage-paddingLeft\": \"15px\",\n      \"--beam-ProductDetailsPage-InfoContainer-marginLeft\": \"8px\",\n      \"--beam-ProductDetailsPage-backgroundColor\": \"unset\",\n      \"--beam-ProductDetailsPage-TooltipIcon-width\": \"10px\",\n      \"--beam-ProductDetailsPage-TooltipIcon-color\": \"inherit\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor\": \"#000000\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingTop\": \"10px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingRight\": \"8px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom\": \"10px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft\": \"8px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color\": \"#5CA3FF\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-title\", {\n        fontSize: \"11px\",\n        fontWeight: \"bold\",\n      }),\n      \"--beam-ProductDetailsPage-title-textAlign\": \"left\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-description\", {\n        marginTop: \"4px\",\n        fontSize: \"11px\",\n        lineHeight: \"15px\",\n      }),\n      \"--beam-ProductDetailsPage-description-textAlign\": \"left\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-PPGFDisclosureTooltipContent\", {\n        fontSize: \"12px\",\n        lineHeight: \"16px\",\n        color: \"#FFFFFF\",\n      }),\n      ...defineCustomBorder(\"--beam-ProductDetailsPage\"),\n    };\n    const remoteConfig = this.productDetailsPageDataController?.data?.config?.web?.theme || {};\n\n    const config = { ...defaults, ...remoteConfig };\n\n    const serializable = Object.create({\n      toCSS() {\n        return _cssVariableMap(this as Record<string, string>);\n      },\n    });\n\n    return Object.assign(serializable, config);\n  }\n\n  static styles = [\n    cssReset,\n    css`\n      :host {\n        font-family: var(--beam-fontFamily);\n        font-style: var(--beam-fontStyle);\n        font-size: var(--beam-fontSize);\n        background-color: var(--beam-backgroundColor);\n        color: var(--beam-textColor);\n        max-width: var(--beam-ProductDetailsPage-maxWidth);\n        word-break: normal;\n        display: block;\n      }\n      .root {\n        display: flex;\n        align-items: center;\n        padding-top: var(--beam-ProductDetailsPage-paddingTop);\n        padding-right: var(--beam-ProductDetailsPage-paddingRight);\n        padding-bottom: var(--beam-ProductDetailsPage-paddingBottom);\n        padding-left: var(--beam-ProductDetailsPage-paddingLeft);\n        width: 100%;\n        background-color: var(--beam-ProductDetailsPage-backgroundColor);\n        ${useCustomBorder(\"--beam-ProductDetailsPage\")}\n      }\n      .icon-container {\n        width: var(--beam-ProductDetailsPage-imageWidth);\n        height: var(--beam-ProductDetailsPage-imageHeight);\n        flex-shrink: 0;\n      }\n      .icon-container > img {\n        width: 100%;\n        height: 100%;\n        object-fit: contain;\n      }\n      .info-container {\n        margin-left: var(--beam-ProductDetailsPage-InfoContainer-marginLeft);\n      }\n      .title {\n        ${useCustomText(\"--beam-ProductDetailsPage-title\")}\n      }\n      .title-block {\n        text-align: var(--beam-ProductDetailsPage-title-textAlign);\n        line-height: var(--beam-ProductDetailsPage-title-lineHeight);\n      }\n      .description {\n        ${useCustomText(\"--beam-ProductDetailsPage-description\")}\n      }\n      .description-block {\n        text-align: var(--beam-ProductDetailsPage-description-textAlign);\n        line-height: var(--beam-ProductDetailsPage-description-lineHeight);\n      }\n      .ppgf-disclosure-tooltip {\n        --max-width: 268px;\n      }\n      .ppgf-disclosure-tooltip::part(body) {\n        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);\n        padding-top: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingTop);\n        padding-right: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingRight);\n        padding-bottom: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom);\n        padding-left: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft);\n      }\n      .ppgf-disclosure-tooltip::part(base__arrow) {\n        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);\n      }\n      .ppgf-disclosure-tooltip-content {\n        ${useCustomText(\"--beam-ProductDetailsPage-PPGFDisclosureTooltipContent\")}\n      }\n      .ppgf-disclosure-hyperlink {\n        pointer-events: auto;\n        user-select: auto;\n        -webkit-user-select: auto;\n        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);\n      }\n      .ppgf-disclosure-hyperlink:visited {\n        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);\n      }\n      .ppgf-disclosure-tooltip-icon {\n        width: var(--beam-ProductDetailsPage-TooltipIcon-width);\n        color: var(--beam-ProductDetailsPage-TooltipIcon-color);\n        height: auto;\n        vertical-align: middle;\n      }\n    `,\n  ];\n}\n\ndefineCustomElement(BeamProductDetailsPage);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"beam-product-details-page\": BeamProductDetailsPage;\n  }\n}\n"],"names":["defineCustomBorder","namespace","borderRadius","borderStyle","borderColor","borderWidth","prefix","useCustomBorder","unsafeCSS","IMAGE_URL_REMOTE_CONFIG_KEY","BeamProductDetailsPage","LitElement","DEFAULT_BASE_URL","enforceConfig","getProductDetailsPage","makeApiKeyHeader","AsyncController","SUPPORTED_LANGUAGES","changedProperties","requireNewDataProps","prop","imageUrl","html","data","loading","_errorMessage","localizeUserString","ppgfDisclosure","ppgfHyperlink","defaults","defineCustomText","remoteConfig","config","_cssVariableMap","cssReset","css","useCustomText","__decorateClass","property","defineCustomElement"],"mappings":"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"}

package/dist/components/product-details-page.js

@@ -0,0 +1,118 @@
+import{j as P,f as b,g as d,h as m,y as s}from"../chunks/lit-qtGbjGnK.esm.js";import{c as D,u as g,d as h,e as f,A as v,_ as y,i as u,a as p,b as x}from"../chunks/localize-fH8KOrMi.esm.js";import{D as C,i as $,S as k}from"../chunks/routes-OzJqNrBl.esm.js";import{makeApiKeyHeader as F}from"../utils/makeApiKeyHeader.js";import"../chunks/vendor-jQ8cxMpw.esm.js";import"../chunks/shoelace-components-7Bz0cgFm.esm.js";import"../chunks/beam-errors-P-Lu07Ce.esm.js";import"../utils/logger.js";const w=(r="",{borderRadius:e="0px",borderStyle:t="unset",borderColor:o="#000000",borderWidth:i="1px"}={})=>{const a=r.startsWith("--beam-")?r:`--beam-${r}`;return{[`${a}-borderRadius`]:e,[`${a}-borderStyle`]:t,[`${a}-borderColor`]:o,[`${a}-borderWidth`]:i}},T=(r="",{borderRadius:e="0px",borderStyle:t="unset",borderColor:o="#000000",borderWidth:i="1px"}={})=>{const a=r.startsWith("--beam-")?r:`--beam-${r}`;return P(`        border-radius: var(${a}-borderRadius, ${e});
+        border-style: var(${a}-borderStyle, ${t});
+        border-color: var(${a}-borderColor, ${o});
+        border-width: var(${a}-borderWidth, ${i});
+    `)};var S=Object.defineProperty,G=Object.getOwnPropertyDescriptor,n=(r,e,t,o)=>{for(var i=o>1?void 0:o?G(e,t):e,a=r.length-1,c;a>=0;a--)(c=r[a])&&(i=(o?c(e,t,i):c(i))||i);return o&&i&&S(e,t,i),i};const I="--beam-ProductDetailsPage-imageUrl";class l extends m{constructor(){super(...arguments),this.baseUrl=C,this.lang="en",this.debug=!1,this.getProductDetailsPageData=async()=>(f(["apiKey","storeId"],this),await $({baseUrl:this.baseUrl,headers:F(this.apiKey),queryParams:{version:"1.0.0",lang:this.configLang,storeId:this.storeId,widgetName:"product-details-page"}})),this.productDetailsPageDataController=new v(this,this.getProductDetailsPageData)}get configLang(){return k[this.lang]||"en"}async updated(e){const t=["storeId","baseUrl","lang","apiKey"];for(const o of t)if(e.has(o)){await this.productDetailsPageDataController.exec();break}}renderWidgetIcon(){const e=this.cssVariables[I];return e?s`
+    <span class="icon-container">
+      <img src=${e} alt="Widget Icon"></img>
+    </span>
+    `:s``}render(){const{data:e,loading:t}=this.productDetailsPageDataController;return t?s``:e==null?this.debug?y({error:new Error("No data")}):"":s`
+      <style>
+        :host {
+          ${this.cssVariables.toCSS()}
+        }
+      </style>
+      <div class="root">
+        ${this.renderWidgetIcon()}
+        <span class="info-container">
+          <div class="title-block">
+            <h3 class="title">${u(this.configLang,e.config?.web?.title)}</h3>
+          </div>
+          <div class="description-block">
+            <span class="description"> ${u(this.configLang,e.config?.web?.description)}</span
+            >${this.renderDisclosureTooltip()}
+          </div>
+        </span>
+      </div>
+    `}renderDisclosureTooltip(){const e=this.productDetailsPageDataController.data?.ppgfDisclosure;return e?s`<sl-tooltip class="ppgf-disclosure-tooltip">
+          <div class="ppgf-disclosure-tooltip-content" slot="content">
+            ${e.copy} ${this.renderDisclosureTooltipHyperlink()}
+          </div>
+          ${this.renderDisclosureTooltipIcon()}
+        </sl-tooltip>`:s``}renderDisclosureTooltipIcon(){return s`<sl-icon
+      library="lucide"
+      name="info"
+      label="ppgf-disclosure-tooltip-icon"
+      class="ppgf-disclosure-tooltip-icon"
+    ></sl-icon>`}renderDisclosureTooltipHyperlink(){const e=this.productDetailsPageDataController.data?.ppgfDisclosureHyperlink;return e?s`<a class="ppgf-disclosure-hyperlink" href="${e.url}" target="_blank">${e.copy}</a>`:s``}get cssVariables(){const e={"--beam-ProductDetailsPage-imageWidth":"24px","--beam-ProductDetailsPage-imageHeight":"24px","--beam-ProductDetailsPage-maxWidth":"346px","--beam-ProductDetailsPage-paddingTop":"8px","--beam-ProductDetailsPage-paddingRight":"12px","--beam-ProductDetailsPage-paddingBottom":"8px","--beam-ProductDetailsPage-paddingLeft":"15px","--beam-ProductDetailsPage-InfoContainer-marginLeft":"8px","--beam-ProductDetailsPage-backgroundColor":"unset","--beam-ProductDetailsPage-TooltipIcon-width":"10px","--beam-ProductDetailsPage-TooltipIcon-color":"inherit","--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor":"#000000","--beam-ProductDetailsPage-PPGFDisclosure-paddingTop":"10px","--beam-ProductDetailsPage-PPGFDisclosure-paddingRight":"8px","--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom":"10px","--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft":"8px","--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color":"#5CA3FF",...p("--beam-ProductDetailsPage-title",{fontSize:"11px",fontWeight:"bold"}),"--beam-ProductDetailsPage-title-textAlign":"left",...p("--beam-ProductDetailsPage-description",{marginTop:"4px",fontSize:"11px",lineHeight:"15px"}),"--beam-ProductDetailsPage-description-textAlign":"left",...p("--beam-ProductDetailsPage-PPGFDisclosureTooltipContent",{fontSize:"12px",lineHeight:"16px",color:"#FFFFFF"}),...w("--beam-ProductDetailsPage")},t=this.productDetailsPageDataController?.data?.config?.web?.theme||{},o={...e,...t};return Object.assign(Object.create({toCSS(){return x(this)}}),o)}}l.tagName="beam-product-details-page",l.styles=[D,b`
+      :host {
+        font-family: var(--beam-fontFamily);
+        font-style: var(--beam-fontStyle);
+        font-size: var(--beam-fontSize);
+        background-color: var(--beam-backgroundColor);
+        color: var(--beam-textColor);
+        max-width: var(--beam-ProductDetailsPage-maxWidth);
+        word-break: normal;
+        display: block;
+      }
+      .root {
+        display: flex;
+        align-items: center;
+        padding-top: var(--beam-ProductDetailsPage-paddingTop);
+        padding-right: var(--beam-ProductDetailsPage-paddingRight);
+        padding-bottom: var(--beam-ProductDetailsPage-paddingBottom);
+        padding-left: var(--beam-ProductDetailsPage-paddingLeft);
+        width: 100%;
+        background-color: var(--beam-ProductDetailsPage-backgroundColor);
+        ${T("--beam-ProductDetailsPage")}
+      }
+      .icon-container {
+        width: var(--beam-ProductDetailsPage-imageWidth);
+        height: var(--beam-ProductDetailsPage-imageHeight);
+        flex-shrink: 0;
+      }
+      .icon-container > img {
+        width: 100%;
+        height: 100%;
+        object-fit: contain;
+      }
+      .info-container {
+        margin-left: var(--beam-ProductDetailsPage-InfoContainer-marginLeft);
+      }
+      .title {
+        ${g("--beam-ProductDetailsPage-title")}
+      }
+      .title-block {
+        text-align: var(--beam-ProductDetailsPage-title-textAlign);
+        line-height: var(--beam-ProductDetailsPage-title-lineHeight);
+      }
+      .description {
+        ${g("--beam-ProductDetailsPage-description")}
+      }
+      .description-block {
+        text-align: var(--beam-ProductDetailsPage-description-textAlign);
+        line-height: var(--beam-ProductDetailsPage-description-lineHeight);
+      }
+      .ppgf-disclosure-tooltip {
+        --max-width: 268px;
+      }
+      .ppgf-disclosure-tooltip::part(body) {
+        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);
+        padding-top: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingTop);
+        padding-right: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingRight);
+        padding-bottom: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom);
+        padding-left: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft);
+      }
+      .ppgf-disclosure-tooltip::part(base__arrow) {
+        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);
+      }
+      .ppgf-disclosure-tooltip-content {
+        ${g("--beam-ProductDetailsPage-PPGFDisclosureTooltipContent")}
+      }
+      .ppgf-disclosure-hyperlink {
+        pointer-events: auto;
+        user-select: auto;
+        -webkit-user-select: auto;
+        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);
+      }
+      .ppgf-disclosure-hyperlink:visited {
+        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);
+      }
+      .ppgf-disclosure-tooltip-icon {
+        width: var(--beam-ProductDetailsPage-TooltipIcon-width);
+        color: var(--beam-ProductDetailsPage-TooltipIcon-color);
+        height: auto;
+        vertical-align: middle;
+      }
+    `],n([d({type:String,reflect:!0})],l.prototype,"baseUrl",2),n([d({type:String,reflect:!1})],l.prototype,"apiKey",2),n([d({type:Number})],l.prototype,"storeId",2),n([d({type:String})],l.prototype,"lang",2),n([d({type:Boolean})],l.prototype,"debug",2),h(l);export{l as BeamProductDetailsPage};
+//# sourceMappingURL=product-details-page.js.map

package/dist/components/product-details-page.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-details-page.js","sources":["../../src/shared/fragments/custom-border.ts","../../src/components/product-details-page/index.ts"],"sourcesContent":["import { CSSResult, unsafeCSS } from \"lit\";\n\nexport const defineCustomBorder = (\n  namespace = \"\",\n  { borderRadius = \"0px\", borderStyle = \"unset\", borderColor = \"#000000\", borderWidth = \"1px\" } = {}\n): Record<string, string> => {\n  const prefix = namespace.startsWith(\"--beam-\") ? namespace : `--beam-${namespace}`;\n  return {\n    [`${prefix}-borderRadius`]: borderRadius,\n    [`${prefix}-borderStyle`]: borderStyle,\n    [`${prefix}-borderColor`]: borderColor,\n    [`${prefix}-borderWidth`]: borderWidth,\n  };\n};\n\nexport const useCustomBorder = (\n  namespace = \"\",\n  { borderRadius = \"0px\", borderStyle = \"unset\", borderColor = \"#000000\", borderWidth = \"1px\" } = {}\n): CSSResult => {\n  const prefix = namespace.startsWith(\"--beam-\") ? namespace : `--beam-${namespace}`;\n  return unsafeCSS(`\\\n        border-radius: var(${prefix}-borderRadius, ${borderRadius});\n        border-style: var(${prefix}-borderStyle, ${borderStyle});\n        border-color: var(${prefix}-borderColor, ${borderColor});\n        border-width: var(${prefix}-borderWidth, ${borderWidth});\n    `);\n};\n","import { LitElement, css, html } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { AsyncController } from \"../../shared/controllers/async-controller\";\nimport { getProductDetailsPage } from \"../../api-sdk/v3/routes\";\nimport { DEFAULT_BASE_URL, SUPPORTED_LANGUAGES } from \"../../api-sdk/constants\";\nimport { LANGUAGES, TUrl } from \"../../api-sdk/types\";\nimport { makeApiKeyHeader } from \"../../utils/makeApiKeyHeader\";\nimport { MissingConfig } from \"../../utils/beam-errors\";\nimport { enforceConfig } from \"../../shared/enforce-config\";\nimport { _cssVariableMap } from \"../../shared/fragments/css-variable-map\";\nimport { localizeUserString } from \"../../shared/localize\";\nimport { _errorMessage } from \"../../shared/fragments/error-message-template\";\nimport { defineCustomElement } from \"../../shared/defineCustomElement\";\nimport { cssReset } from \"../../shared/css-reset\";\nimport { defineCustomText, useCustomText } from \"../../shared/fragments/custom-text\";\nimport { defineCustomBorder, useCustomBorder } from \"../../shared/fragments/custom-border\";\n\n// shoelace html tag imports\nimport \"@shoelace-style/shoelace/dist/components/tooltip/tooltip.js\";\nimport \"../../shared/shoelace-components\";\n\ntype RequiredConfig = {\n  apiKey: string;\n  storeId: number;\n};\n\nconst IMAGE_URL_REMOTE_CONFIG_KEY = \"--beam-ProductDetailsPage-imageUrl\";\n\nexport class BeamProductDetailsPage extends LitElement {\n  static tagName = \"beam-product-details-page\";\n\n  @property({ type: String, reflect: true }) public baseUrl: TUrl = DEFAULT_BASE_URL;\n\n  @property({ type: String, reflect: false }) apiKey?: RequiredConfig[\"apiKey\"];\n\n  @property({ type: Number }) storeId?: number;\n\n  @property({ type: String }) public lang: LANGUAGES = \"en\";\n\n  @property({ type: Boolean }) public debug = false;\n\n  get configLang() {\n    return SUPPORTED_LANGUAGES[this.lang] || \"en\";\n  }\n\n  getProductDetailsPageData = async () => {\n    if (!enforceConfig<RequiredConfig>([\"apiKey\", \"storeId\"], this)) throw new MissingConfig();\n\n    const res = await getProductDetailsPage({\n      baseUrl: this.baseUrl,\n      headers: makeApiKeyHeader(this.apiKey),\n      queryParams: {\n        version: \"1.0.0\",\n        lang: this.configLang,\n        storeId: this.storeId,\n        widgetName: \"product-details-page\",\n      },\n    });\n    return res;\n  };\n\n  private productDetailsPageDataController = new AsyncController<typeof this.getProductDetailsPageData>(\n    this,\n    this.getProductDetailsPageData\n  );\n\n  async updated(changedProperties: Map<string, unknown>) {\n    const requireNewDataProps = [\"storeId\", \"baseUrl\", \"lang\", \"apiKey\"];\n    for (const prop of requireNewDataProps) {\n      if (changedProperties.has(prop)) {\n        await this.productDetailsPageDataController.exec();\n        break;\n      }\n    }\n  }\n\n  renderWidgetIcon() {\n    const imageUrl = this.cssVariables[IMAGE_URL_REMOTE_CONFIG_KEY];\n\n    return imageUrl\n      ? html`\n    <span class=\"icon-container\">\n      <img src=${imageUrl} alt=\"Widget Icon\"></img>\n    </span>\n    `\n      : html``;\n  }\n\n  render() {\n    const { data, loading } = this.productDetailsPageDataController;\n    if (loading) {\n      return html``;\n    }\n    if (data == null) {\n      if (this.debug) {\n        return _errorMessage({ error: new Error(\"No data\") });\n      }\n      return \"\";\n    }\n    return html`\n      <style>\n        :host {\n          ${this.cssVariables.toCSS()}\n        }\n      </style>\n      <div class=\"root\">\n        ${this.renderWidgetIcon()}\n        <span class=\"info-container\">\n          <div class=\"title-block\">\n            <h3 class=\"title\">${localizeUserString(this.configLang, data.config?.web?.title)}</h3>\n          </div>\n          <div class=\"description-block\">\n            <span class=\"description\"> ${localizeUserString(this.configLang, data.config?.web?.description)}</span\n            >${this.renderDisclosureTooltip()}\n          </div>\n        </span>\n      </div>\n    `;\n  }\n\n  /* PayPal Giving Fund Disclosure */\n  renderDisclosureTooltip() {\n    const ppgfDisclosure = this.productDetailsPageDataController.data?.ppgfDisclosure;\n    return ppgfDisclosure\n      ? html`<sl-tooltip class=\"ppgf-disclosure-tooltip\">\n          <div class=\"ppgf-disclosure-tooltip-content\" slot=\"content\">\n            ${ppgfDisclosure.copy} ${this.renderDisclosureTooltipHyperlink()}\n          </div>\n          ${this.renderDisclosureTooltipIcon()}\n        </sl-tooltip>`\n      : html``;\n  }\n\n  renderDisclosureTooltipIcon() {\n    return html`<sl-icon\n      library=\"lucide\"\n      name=\"info\"\n      label=\"ppgf-disclosure-tooltip-icon\"\n      class=\"ppgf-disclosure-tooltip-icon\"\n    ></sl-icon>`;\n  }\n\n  renderDisclosureTooltipHyperlink() {\n    const ppgfHyperlink = this.productDetailsPageDataController.data?.ppgfDisclosureHyperlink;\n    return ppgfHyperlink\n      ? html`<a class=\"ppgf-disclosure-hyperlink\" href=\"${ppgfHyperlink.url}\" target=\"_blank\">${ppgfHyperlink.copy}</a>`\n      : html``;\n  }\n  /* End PayPal Giving Fund Disclosure */\n\n  public get cssVariables() {\n    const defaults = {\n      \"--beam-ProductDetailsPage-imageWidth\": \"24px\",\n      \"--beam-ProductDetailsPage-imageHeight\": \"24px\",\n      \"--beam-ProductDetailsPage-maxWidth\": \"346px\",\n      \"--beam-ProductDetailsPage-paddingTop\": \"8px\",\n      \"--beam-ProductDetailsPage-paddingRight\": \"12px\",\n      \"--beam-ProductDetailsPage-paddingBottom\": \"8px\",\n      \"--beam-ProductDetailsPage-paddingLeft\": \"15px\",\n      \"--beam-ProductDetailsPage-InfoContainer-marginLeft\": \"8px\",\n      \"--beam-ProductDetailsPage-backgroundColor\": \"unset\",\n      \"--beam-ProductDetailsPage-TooltipIcon-width\": \"10px\",\n      \"--beam-ProductDetailsPage-TooltipIcon-color\": \"inherit\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor\": \"#000000\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingTop\": \"10px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingRight\": \"8px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom\": \"10px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft\": \"8px\",\n      \"--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color\": \"#5CA3FF\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-title\", {\n        fontSize: \"11px\",\n        fontWeight: \"bold\",\n      }),\n      \"--beam-ProductDetailsPage-title-textAlign\": \"left\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-description\", {\n        marginTop: \"4px\",\n        fontSize: \"11px\",\n        lineHeight: \"15px\",\n      }),\n      \"--beam-ProductDetailsPage-description-textAlign\": \"left\",\n      ...defineCustomText(\"--beam-ProductDetailsPage-PPGFDisclosureTooltipContent\", {\n        fontSize: \"12px\",\n        lineHeight: \"16px\",\n        color: \"#FFFFFF\",\n      }),\n      ...defineCustomBorder(\"--beam-ProductDetailsPage\"),\n    };\n    const remoteConfig = this.productDetailsPageDataController?.data?.config?.web?.theme || {};\n\n    const config = { ...defaults, ...remoteConfig };\n\n    const serializable = Object.create({\n      toCSS() {\n        return _cssVariableMap(this as Record<string, string>);\n      },\n    });\n\n    return Object.assign(serializable, config);\n  }\n\n  static styles = [\n    cssReset,\n    css`\n      :host {\n        font-family: var(--beam-fontFamily);\n        font-style: var(--beam-fontStyle);\n        font-size: var(--beam-fontSize);\n        background-color: var(--beam-backgroundColor);\n        color: var(--beam-textColor);\n        max-width: var(--beam-ProductDetailsPage-maxWidth);\n        word-break: normal;\n        display: block;\n      }\n      .root {\n        display: flex;\n        align-items: center;\n        padding-top: var(--beam-ProductDetailsPage-paddingTop);\n        padding-right: var(--beam-ProductDetailsPage-paddingRight);\n        padding-bottom: var(--beam-ProductDetailsPage-paddingBottom);\n        padding-left: var(--beam-ProductDetailsPage-paddingLeft);\n        width: 100%;\n        background-color: var(--beam-ProductDetailsPage-backgroundColor);\n        ${useCustomBorder(\"--beam-ProductDetailsPage\")}\n      }\n      .icon-container {\n        width: var(--beam-ProductDetailsPage-imageWidth);\n        height: var(--beam-ProductDetailsPage-imageHeight);\n        flex-shrink: 0;\n      }\n      .icon-container > img {\n        width: 100%;\n        height: 100%;\n        object-fit: contain;\n      }\n      .info-container {\n        margin-left: var(--beam-ProductDetailsPage-InfoContainer-marginLeft);\n      }\n      .title {\n        ${useCustomText(\"--beam-ProductDetailsPage-title\")}\n      }\n      .title-block {\n        text-align: var(--beam-ProductDetailsPage-title-textAlign);\n        line-height: var(--beam-ProductDetailsPage-title-lineHeight);\n      }\n      .description {\n        ${useCustomText(\"--beam-ProductDetailsPage-description\")}\n      }\n      .description-block {\n        text-align: var(--beam-ProductDetailsPage-description-textAlign);\n        line-height: var(--beam-ProductDetailsPage-description-lineHeight);\n      }\n      .ppgf-disclosure-tooltip {\n        --max-width: 268px;\n      }\n      .ppgf-disclosure-tooltip::part(body) {\n        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);\n        padding-top: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingTop);\n        padding-right: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingRight);\n        padding-bottom: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingBottom);\n        padding-left: var(--beam-ProductDetailsPage-PPGFDisclosure-paddingLeft);\n      }\n      .ppgf-disclosure-tooltip::part(base__arrow) {\n        background-color: var(--beam-ProductDetailsPage-PPGFDisclosure-backgroundColor);\n      }\n      .ppgf-disclosure-tooltip-content {\n        ${useCustomText(\"--beam-ProductDetailsPage-PPGFDisclosureTooltipContent\")}\n      }\n      .ppgf-disclosure-hyperlink {\n        pointer-events: auto;\n        user-select: auto;\n        -webkit-user-select: auto;\n        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);\n      }\n      .ppgf-disclosure-hyperlink:visited {\n        color: var(--beam-ProductDetailsPage-PPGFDisclosureHyperlink-color);\n      }\n      .ppgf-disclosure-tooltip-icon {\n        width: var(--beam-ProductDetailsPage-TooltipIcon-width);\n        color: var(--beam-ProductDetailsPage-TooltipIcon-color);\n        height: auto;\n        vertical-align: middle;\n      }\n    `,\n  ];\n}\n\ndefineCustomElement(BeamProductDetailsPage);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"beam-product-details-page\": BeamProductDetailsPage;\n  }\n}\n"],"names":["defineCustomBorder","namespace","borderRadius","borderStyle","borderColor","borderWidth","prefix","useCustomBorder","unsafeCSS","IMAGE_URL_REMOTE_CONFIG_KEY","BeamProductDetailsPage","LitElement","DEFAULT_BASE_URL","enforceConfig","getProductDetailsPage","makeApiKeyHeader","AsyncController","SUPPORTED_LANGUAGES","changedProperties","requireNewDataProps","prop","imageUrl","html","data","loading","_errorMessage","localizeUserString","ppgfDisclosure","ppgfHyperlink","defaults","defineCustomText","remoteConfig","config","_cssVariableMap","cssReset","css","useCustomText","__decorateClass","property","defineCustomElement"],"mappings":"weAEO,MAAMA,EAAqB,CAChCC,EAAY,GACZ,CAAE,aAAAC,EAAe,MAAO,YAAAC,EAAc,QAAS,YAAAC,EAAc,UAAW,YAAAC,EAAc,KAAM,EAAI,CAAA,IACrE,CAC3B,MAAMC,EAASL,EAAU,WAAW,SAAS,EAAIA,EAAY,UAAUA,CAAS,GAChF,MAAO,CACL,CAAC,GAAGK,CAAM,eAAe,EAAGJ,EAC5B,CAAC,GAAGI,CAAM,cAAc,EAAGH,EAC3B,CAAC,GAAGG,CAAM,cAAc,EAAGF,EAC3B,CAAC,GAAGE,CAAM,cAAc,EAAGD,CAC7B,CACF,EAEaE,EAAkB,CAC7BN,EAAY,GACZ,CAAE,aAAAC,EAAe,MAAO,YAAAC,EAAc,QAAS,YAAAC,EAAc,UAAW,YAAAC,EAAc,KAAM,EAAI,CAClF,IAAA,CACd,MAAMC,EAASL,EAAU,WAAW,SAAS,EAAIA,EAAY,UAAUA,CAAS,GAChF,OAAOO,EAAU,8BACUF,CAAM,kBAAkBJ,CAAY;AAAA,4BACrCI,CAAM,iBAAiBH,CAAW;AAAA,4BAClCG,CAAM,iBAAiBF,CAAW;AAAA,4BAClCE,CAAM,iBAAiBD,CAAW;AAAA,KACzD,CACL,kMCAA,MAAMI,EAA8B,2CAEvBC,UAA+BC,CAAW,CAAhD,aAGsC,CAAA,MAAA,GAAA,SAAA,EAAA,KAAO,QAAgBC,EAMtC,KAAO,KAAkB,KAExB,KAAO,MAAQ,GAM5C,KAAA,0BAA4B,UACrBC,EAA8B,CAAC,SAAU,SAAS,EAAG,IAAI,EAElD,MAAMC,EAAsB,CACtC,QAAS,KAAK,QACd,QAASC,EAAiB,KAAK,MAAM,EACrC,YAAa,CACX,QAAS,QACT,KAAM,KAAK,WACX,QAAS,KAAK,QACd,WAAY,sBACd,CACF,CAAC,GAIH,KAAQ,iCAAmC,IAAIC,EAC7C,KACA,KAAK,yBACP,CAvBA,CAAA,IAAI,YAAa,CACf,OAAOC,EAAoB,KAAK,IAAI,GAAK,IAC3C,CAuBA,MAAM,QAAQC,EAAyC,CACrD,MAAMC,EAAsB,CAAC,UAAW,UAAW,OAAQ,QAAQ,EACnE,UAAWC,KAAQD,EACjB,GAAID,EAAkB,IAAIE,CAAI,EAAG,CAC/B,MAAM,KAAK,iCAAiC,OAC5C,KACF,CAEJ,CAEA,kBAAmB,CACjB,MAAMC,EAAW,KAAK,aAAaZ,CAA2B,EAE9D,OAAOY,EACHC;AAAAA;AAAAA,iBAESD,CAAQ;AAAA;AAAA,MAGjBC,GACN,CAEA,QAAS,CACP,KAAM,CAAE,KAAAC,EAAM,QAAAC,CAAQ,EAAI,KAAK,iCAC/B,OAAIA,EACKF,IAELC,GAAQ,KACN,KAAK,MACAE,EAAc,CAAE,MAAO,IAAI,MAAM,SAAS,CAAE,CAAC,EAE/C,GAEFH;AAAAA;AAAAA;AAAAA,YAGC,KAAK,aAAa,OAAO;AAAA;AAAA;AAAA;AAAA,UAI3B,KAAK,kBAAkB;AAAA;AAAA;AAAA,gCAGDI,EAAmB,KAAK,WAAYH,EAAK,QAAQ,KAAK,KAAK,CAAC;AAAA;AAAA;AAAA,yCAGnDG,EAAmB,KAAK,WAAYH,EAAK,QAAQ,KAAK,WAAW,CAAC;AAAA,eAC5F,KAAK,yBAAyB;AAAA;AAAA;AAAA;AAAA,KAK3C,CAGA,yBAA0B,CACxB,MAAMI,EAAiB,KAAK,iCAAiC,MAAM,eACnE,OAAOA,EACHL;AAAAA;AAAAA,cAEMK,EAAe,IAAI,IAAI,KAAK,kCAAkC;AAAA;AAAA,YAEhE,KAAK,6BAA6B;AAAA,uBAEtCL,GACN,CAEA,6BAA8B,CAC5B,OAAOA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,gBAMT,CAEA,kCAAmC,CACjC,MAAMM,EAAgB,KAAK,iCAAiC,MAAM,wBAClE,OAAOA,EACHN,+CAAkDM,EAAc,GAAG,qBAAqBA,EAAc,IAAI,OAC1GN,GACN,CAGA,IAAW,cAAe,CACxB,MAAMO,EAAW,CACf,uCAAwC,OACxC,wCAAyC,OACzC,qCAAsC,QACtC,uCAAwC,MACxC,yCAA0C,OAC1C,0CAA2C,MAC3C,wCAAyC,OACzC,qDAAsD,MACtD,4CAA6C,QAC7C,8CAA+C,OAC/C,8CAA+C,UAC/C,2DAA4D,UAC5D,sDAAuD,OACvD,wDAAyD,MACzD,yDAA0D,OAC1D,uDAAwD,MACxD,0DAA2D,UAC3D,GAAGC,EAAiB,kCAAmC,CACrD,SAAU,OACV,WAAY,MACd,CAAC,EACD,4CAA6C,OAC7C,GAAGA,EAAiB,wCAAyC,CAC3D,UAAW,MACX,SAAU,OACV,WAAY,MACd,CAAC,EACD,kDAAmD,OACnD,GAAGA,EAAiB,yDAA0D,CAC5E,SAAU,OACV,WAAY,OACZ,MAAO,SACT,CAAC,EACD,GAAG9B,EAAmB,2BAA2B,CACnD,EACM+B,EAAe,KAAK,kCAAkC,MAAM,QAAQ,KAAK,OAAS,CAAA,EAElFC,EAAS,CAAE,GAAGH,EAAU,GAAGE,CAAa,EAQ9C,OAAO,OAAO,OANO,OAAO,OAAO,CACjC,OAAQ,CACN,OAAOE,EAAgB,IAA8B,CACvD,CACF,CAAC,EAEkCD,CAAM,CAC3C,CAsFF,CAhQatB,EACJ,QAAU,4BADNA,EA4KJ,OAAS,CACdwB,EACAC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,UAoBM5B,EAAgB,2BAA2B,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAgB5C6B,EAAc,iCAAiC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAOhDA,EAAc,uCAAuC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAoBtDA,EAAc,wDAAwD,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAkB/E,EA5PkDC,EAAA,CAAjDC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,CAAA,EAH9B5B,EAGuC,UAAA,UAAA,CAAA,EAEN2B,EAAA,CAA3CC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAM,CAAC,CAL/B,EAAA5B,EAKiC,UAEhB2B,SAAAA,CAAAA,EAAAA,EAAA,CAA3BC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EAPf5B,EAOiB,UAAA,UAAA,CAAA,EAEO2B,EAAA,CAAlCC,EAAS,CAAE,KAAM,MAAO,CAAC,CAAA,EATf5B,EASwB,UAEC2B,OAAAA,CAAAA,EAAAA,EAAA,CAAnCC,EAAS,CAAE,KAAM,OAAQ,CAAC,CAXhB,EAAA5B,EAWyB,UAuPtC6B,QAAAA,CAAAA,EAAAA,EAAoB7B,CAAsB"}

package/dist/components/redeem-transaction.d.ts

@@ -6,9 +6,9 @@ import '../chunks/progress-bar-0VS_AmEf.esm.js';
 import '../chunks/promo-pill-label-3bA1z-la.esm.js';
 import './beam-partner-logos.js';
 import { b as TNumericId, c as TId } from '../chunks/types-7kSi85Gv.esm.js';
-import { T as TCart } from '../chunks/cart-contents-dKdDg09p.esm.js';
+import { T as TCart } from '../chunks/cart-contents-3-9fB-7m.esm.js';
 import { L as LANGUAGES } from '../chunks/types-aju0qrRe.esm.js';
-import '../chunks/openapi-spec-fxMWpEwU.esm.js';
+import '../chunks/openapi-spec--MzXvfCC.esm.js';
 
 interface TransactionRequiredConfig {
     apiKey: string;
@@ -74,7 +74,7 @@ declare class BeamRedeemTransaction extends LitElement {
     static styles: lit.CSSResult[];
     private handleChooseClick;
     get shouldCollapse(): boolean;
-    protected render(): "" | lit_html.TemplateResult<1>;
+    protected render(): lit_html.TemplateResult<1> | "";
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/components/redeem-transaction.esm.js

@@ -1,4 +1,4 @@
-import{y as c,m as k,f as $,g as l,t as x,h as N,q as v,p as P,k as D}from"../chunks/lit-HCWbxxT7.esm.js";import{d as z}from"../chunks/lodash-P8OIs-at.esm.js";import{c as L,d as U,b as M,e as C,A as B,f as w,a as E,_ as y}from"../chunks/enforce-config-7R9KCF_i.esm.js";import{D as W,e as A,i as F,u as K,S as O}from"../chunks/routes-ga8DTuUO.esm.js";import{p as j}from"../chunks/progress-bar-9vfd2JYm.esm.js";import{p as _}from"../chunks/promo-pill-label-vCWNyiaj.esm.js";import{partnerLogosConfigDefaults as V}from"./beam-partner-logos.esm.js";import{u as h,d as f,_ as q,i as m}from"../chunks/localize-jRg7W6Ul.esm.js";import{M as H,B as G}from"../chunks/beam-errors-P-Lu07Ce.esm.js";import{createScopedLocalStorage as J}from"../utils/local-storage.esm.js";import{c as Z}from"../chunks/css-card-grid-inRnKSWs.esm.js";import{c as Q}from"../chunks/events-Y8fYvSqM.esm.js";import"../utils/logger.esm.js";import"../chunks/vendor-h5FNKy-G.esm.js";const X=({height:i="1em",width:e="1em"}={})=>c`
+import{y as c,m as k,f as $,g as l,t as x,h as N,q as v,p as P,k as D}from"../chunks/lit-qtGbjGnK.esm.js";import{d as z}from"../chunks/lodash-P8OIs-at.esm.js";import{c as L,u as h,d as U,f as M,e as C,A as B,g as w,a as f,b as E,_ as y,i as m}from"../chunks/localize-F31ae3j6.esm.js";import{D as W,f as A,k as F,u as K,S as O}from"../chunks/routes-2FqTWOCW.esm.js";import{p as j}from"../chunks/progress-bar-Sn2QspHy.esm.js";import{p as _}from"../chunks/promo-pill-label-j0A8qZ0c.esm.js";import{partnerLogosConfigDefaults as V}from"./beam-partner-logos.esm.js";import{_ as q}from"../chunks/loading-template-Av0IUyKF.esm.js";import{M as H,B as G}from"../chunks/beam-errors-P-Lu07Ce.esm.js";import{createScopedLocalStorage as J}from"../utils/local-storage.esm.js";import{c as Z}from"../chunks/css-card-grid-7tObtoJx.esm.js";import{c as Q}from"../chunks/events-Y8fYvSqM.esm.js";import"../utils/logger.esm.js";import"../chunks/vendor-jQ8cxMpw.esm.js";const X=({height:i="1em",width:e="1em"}={})=>c`
     <svg
       style="${k({height:i,width:e,position:"relative",bottom:"0"})}"
       xmlns="http://www.w3.org/2000/svg"
@@ -13,7 +13,7 @@ import{y as c,m as k,f as $,g as l,t as x,h as N,q as v,p as P,k as D}from"../ch
         />
       </g>
     </svg>
-  `,u={en:{beamAttribution:()=>"Powered by Beam",ctaTitle:()=>"Choose your impact",ctaPromoPrefixMessage:()=>"At no extra cost,",ctaPromoMessage:({donationPercentage:i="1"}={})=>`select a nonprofit and ${i}% of your purchase will be donated, at no extra cost.`,ctaMessage:({donationPercentage:i="1%"}={})=>`Select a nonprofit and ${i} of your purchase will be donated, at no extra cost.`,submitButtonText:()=>"Confirm",submitButtonTextCompleted:()=>"Confirmed!",chooseButtonText:()=>"Choose"},fr:{beamAttribution:()=>"Optimis\xE9 par Beam",ctaTitle:()=>"Choisissez votre cause",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`Choisissez un organisme \xE0 but non lucratif et ${i}% lui sera vers\xE9 en votre nom, sans frais suppl\xE9mentaires.`,submitButtonText:()=>"Confirmer",submitButtonTextCompleted:()=>"Confirm\xE9!",chooseButtonText:()=>"Choisissez"},de:{beamAttribution:()=>"Unterst\xFCtzt von Beam",ctaTitle:()=>"W\xE4hle deinen Impact",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`W\xE4hle eine der gemeinn\xFCtzigen Organisationen und spende ${i} deines Einkaufs ohne zus\xE4tzliche Kosten`,submitButtonText:()=>"Best\xE4tigen",submitButtonTextCompleted:()=>"Best\xE4tigt!",chooseButtonText:()=>"W\xE4hlen"},es:{ctaTitle:()=>"Elige tu contribuci\xF3n",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`Elige una organizaci\xF3n sin fines de lucro y donaremos ${i} de tu compra sin coste adicional.`,beamAttribution:()=>"Ofrecido por Beam",submitButtonText:()=>"Confirmar",submitButtonTextCompleted:()=>"\xA1Confirmado!",chooseButtonText:()=>"Elige"},it:{ctaTitle:()=>"Scegli dove fare la differenza",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`Seleziona un'organizzazione no-profit a cui devolvere l\u2019${i} del tuo acquisto, senza costi aggiuntivi`,beamAttribution:()=>"Gestito da Beam",submitButtonText:()=>"Confermare",submitButtonTextCompleted:()=>"Confermato!",chooseButtonText:()=>"Scegli"},pl:{beamAttribution:()=>"Wspierany przez Beam",ctaTitle:()=>"Wybierz inicjatyw\u0119, kt\xF3r\u0105 chcesz wesprze\u0107",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`Wybierz organizacj\u0119, kt\xF3rej przeka\u017Cesz ${i} warto\u015Bci Twoich zakup\xF3w \u2013 bez \u017Cadnych dodatkowych koszt\xF3w!`,submitButtonText:()=>"Zatwierd\u017A",submitButtonTextCompleted:()=>"Zatwierdzono!",chooseButtonText:()=>"Wybierz"}};var Y=Object.defineProperty,ee=Object.getOwnPropertyDescriptor,s=(i,e,t,o)=>{for(var a=o>1?void 0:o?ee(e,t):e,p=i.length-1,d;p>=0;p--)(d=i[p])&&(a=(o?d(e,t,a):d(a))||a);return o&&a&&Y(e,t,a),a};class r extends N{constructor(){super(...arguments),this.baseUrl=W,this.lang="en",this.debug=!1,this.isMobile=window.innerWidth<768,this.didUserExpandNonprofits=!1,this.shouldUseNewPromoUI=!1,this.getChainNonprofits=async()=>{if(M(["transactionId","subscriptionId"],this),!this.hasCorrectTransactionConfig&&!this.hasCorrectSubscriptionConfig)throw new H;const e=await A({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{storeId:this.storeId,postalCode:this.postalCode,countryCode:this.countryCode,cart:this.cart??void 0,widgetName:"redeem-transaction",version:"1.0.0",lang:this.configLang}});return e.store?.id&&e.store.id!==this.storeId&&(this.storeId=e.store.id),this.localStorage.setItemJson("chainNonprofits",{createdAt:new Date,data:e}),e},this.updateNonprofitIdForRecord=async({selectedNonprofitId:e})=>this.transactionId?this.putTransaction({selectedNonprofitId:e}):this.subscriptionId?this.putSubscription({selectedNonprofitId:e}):null,this.putTransaction=async({selectedNonprofitId:e})=>(C(["apiKey","transactionId"],this),F({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},pathParams:{transactionId:Number(this.transactionId)},requestBody:{nonprofitId:e}})),this.putSubscription=async({selectedNonprofitId:e})=>(C(["apiKey","subscriptionId"],this),K({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{remoteSubscriptionId:this.subscriptionId,nonprofitId:e}})),this.nonprofitListDataController=new B(this,this.getChainNonprofits),this.selectionDataController=new B(this,this.updateNonprofitIdForRecord),this.localStorage=J(this),this.makeHandleSelect=(e,t,o)=>async a=>{if(!this.allowChange)return;const p=this.selectedNonprofitId;if(a instanceof KeyboardEvent){let d=null;switch(a.key){case"ArrowUp":case"ArrowLeft":t===0?d=o[o.length-1]:d=o[t-1],a.preventDefault();break;case"ArrowRight":case"ArrowDown":t===o.length-1?d=o[0]:d=o[t+1],a.preventDefault();break;case"Enter":case" ":a.preventDefault();break;default:return}if(d){const b=this.renderRoot.querySelector(`[data-value="${d.nonprofit.id}"]`);b!==null&&(b.tabIndex=0,b.focus());return}}if(a.currentTarget instanceof HTMLElement){if(p===e)return;this.selectedNonprofitId=e}},this.handleSubmit=async()=>{const{selectedNonprofitId:e}=this;if(!this.allowSubmit||e==null)return;await this.selectionDataController.exec({selectedNonprofitId:e}),this.shouldUseStoredSelection&&(this.localStorage.setItem("nonprofit",e),this.localStorage.setItem("nonprofit_selected_at",new Date().toISOString()));const t=this.nonprofitListDataController?.data?.nonprofits.find(o=>o.nonprofit.id===e);this.dispatchEvent(new Q({selectedNonprofitId:e,nonprofitName:t?.nonprofit.name}))},this.evaluateBreakPoints=z(()=>{this.isMobile=window.innerWidth<768},50,{maxWait:50,leading:!0})}get configLang(){return O[this.lang]||"en"}get hasCorrectTransactionConfig(){return w(["apiKey","transactionId"],this)}get hasCorrectSubscriptionConfig(){return w(["apiKey","subscriptionId"],this)}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.evaluateBreakPoints)}async firstUpdated(e){await this.restoreStateFromCache()}async updated(e){const t=["baseUrl","storeId","apiKey","countryCode","postalCode","lang"];for(const o of t)if(e.has(o)){await this.nonprofitListDataController.exec();break}}disconnectedCallback(){super.disconnectedCallback()}restoreStateFromCache(){C(["apiKey"],this),this.shouldUseStoredSelection&&(this.selectedNonprofitId=parseInt(this.localStorage.getItem("nonprofit")||"")||void 0);try{const{createdAt:e=0,data:t}=this.localStorage.getItemJson("chainNonprofits")||{},o=2*60*60*1e3;new Date(e).valueOf()+o>new Date().valueOf()&&(this.nonprofitListDataController.data=t,this.nonprofitListDataController.loading=!1)}catch{}}get allowChange(){return this.selectionDataController.data==null&&!this.selectionDataController.loading}get allowSubmit(){return!!(this.selectedNonprofitId&&this.allowChange)}get shouldUseStoredSelection(){return!this.subscriptionId}get cssVariables(){const e={"--beam-fontFamily":"inherit","--beam-fontStyle":"inherit","--beam-fontSize":"inherit","--beam-textColor":"inherit","--beam-backgroundColor":"inherit",...V,...j,"--beam-RedeemTransaction-maxWidth":"1000px","--beam-RedeemTransaction-submitButton-color":"#fff","--beam-RedeemTransaction-submitButton-hover-color":"#fff","--beam-RedeemTransaction-submitButton-disabled-color":"#fff","--beam-RedeemTransaction-submitButton-backgroundColor":"#333","--beam-RedeemTransaction-submitButton-hover-backgroundColor":"#222","--beam-RedeemTransaction-submitButton-disabled-backgroundColor":"#767676","--beam-RedeemTransaction-submitButton-borderColor":"#333","--beam-RedeemTransaction-submitButton-hover-borderColor":"#222","--beam-RedeemTransaction-submitButton-disabled-borderColor":"#767676","--beam-RedeemTransaction-submitButton-fontSize":"14px","--beam-RedeemTransaction-submitButton-fontWeight":"inherit","--beam-RedeemTransaction-submitButton-fontFamily":"inherit","--beam-RedeemTransaction-submitButton-textTransform":"none","--beam-RedeemTransaction-submitButton-borderRadius":"0px","--beam-RedeemTransaction-submitButton-padding":"15px 30px","--beam-RedeemTransaction-submitButton-position":"right","--beam-RedeemTransaction-submitButton-positionRight-width":"auto","--beam-RedeemTransaction-submitButton-positionBottom-width":"100%","--beam-RedeemTransaction-submitButton-positionBottom-marginTop":"10px","--beam-RedeemTransaction-checkmark-color":"transparent","--beam-RedeemTransaction-checkmark-selected-color":"#fff","--beam-RedeemTransaction-checkmark-hover-color":"#fff","--beam-RedeemTransaction-checkmark-backgroundColor":"transparent","--beam-RedeemTransaction-checkmark-selected-backgroundColor":"#333","--beam-RedeemTransaction-checkmark-hover-backgroundColor":"#d9d9d9","--beam-RedeemTransaction-checkmark-borderColor":"transparent","--beam-RedeemTransaction-checkmark-selected-borderColor":"#333","--beam-RedeemTransaction-checkmark-hover-borderColor":"#d9d9d9","--beam-RedeemTransaction-options-minWidth":"250px","--beam-RedeemTransaction-options-columnCount":"2","--beam-RedeemTransaction-options-borderRadius":"0px","--beam-RedeemTransaction-options-borderWidth":"1px","--beam-RedeemTransaction-options-selected-borderWidth":"2px","--beam-RedeemTransaction-options-focus-borderWidth":"1px","--beam-RedeemTransaction-options-image-borderRadius":"0px","--beam-RedeemTransaction-options-borderColor":"#d9d9d9","--beam-RedeemTransaction-options-selected-borderColor":"currentColor","--beam-RedeemTransaction-options-hover-borderColor":"#ccc","--beam-RedeemTransaction-options-backgroundColor":"transparent","--beam-RedeemTransaction-options-selected-backgroundColor":"transparent","--beam-RedeemTransaction-options-hover-backgroundColor":"#f1f1f1","--beam-RedeemTransaction-options-marginTop":"15px",...f("--beam-RedeemTransaction-title",{fontSize:"1.25em",fontWeight:"bold"}),...f("--beam-RedeemTransaction-description",{marginTop:"0.5em"}),...f("--beam-RedeemTransaction-details-cause",{fontSize:"1em",fontWeight:"bold"}),...f("--beam-RedeemTransaction-details-impactDescription",{fontSize:"0.85em",marginTop:"10px"}),"--beam-RedeemTransaction-details-nonprofitName-fontWeight":"bold","--beam-RedeemTransaction-details-nonprofitName-fontStyle":"inherit","--beam-RedeemTransaction-details-fundingProgress-marginTop":"10px",...f("--beam-RedeemTransaction-details-fundingProgressLabel",{fontSize:"0.85em"}),"--beam-RedeemTransaction-cardStyle":"'image'","--beam-RedeemTransaction-options-icon-padding":"0px","--beam-RedeemTransaction-options-collapseNonprofits-mobile":"false","--beam-RedeemTransaction-options-collapseNonprofits-desktop":"false",..._},t=this.nonprofitListDataController?.data?.config?.web?.theme||{},o={...e,...t};return Object.assign(Object.create({toCSS(){return E(this)}}),o)}handleChooseClick(){this.didUserExpandNonprofits=!0}get shouldCollapse(){const e=this.cssVariables["--beam-RedeemTransaction-options-collapseNonprofits-mobile"]==="true",t=this.cssVariables["--beam-RedeemTransaction-options-collapseNonprofits-desktop"]==="true";return this.isMobile&&e||!this.isMobile&&t}render(){const{selectedNonprofitId:e}=this,{data:t,loading:o}=this.nonprofitListDataController;if(o&&!t)return q();if(this.nonprofitListDataController.error)return this.debug?y({error:this.nonprofitListDataController.error}):"";if(this.selectionDataController.error&&this.debug)return y({error:this.selectionDataController.error});if(t==null)return this.debug?y({error:new G("No data")}):"";const a=t?.nonprofits||[],p=a.find(n=>n.nonprofit.id===e)||null,d=this.cssVariables["--beam-RedeemTransaction-cardStyle"]==="'icon'",b=this.cssVariables["--beam-RedeemTransaction-submitButton-position"],R=this.isMobile&&b==="bottom"?"positionBottom":"positionRight";this.shouldUseNewPromoUI=!!(t?.config?.web?.promo&&!this.subscriptionId);const S=a.some(n=>!n.promo||!n.promo.isActive);return c`
+  `,u={en:{beamAttribution:()=>"Powered by Beam",ctaTitle:()=>"Choose your impact",ctaPromoPrefixMessage:()=>"At no extra cost,",ctaPromoMessage:({donationPercentage:i="1"}={})=>`select a nonprofit and ${i}% of your purchase will be donated.`,ctaMessage:({donationPercentage:i="1%"}={})=>`Select a nonprofit and ${i} of your purchase will be donated, at no extra cost.`,submitButtonText:()=>"Confirm",submitButtonTextCompleted:()=>"Confirmed!",chooseButtonText:()=>"Choose"},fr:{beamAttribution:()=>"Optimis\xE9 par Beam",ctaTitle:()=>"Choisissez votre cause",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`Choisissez un organisme \xE0 but non lucratif et ${i}% lui sera vers\xE9 en votre nom, sans frais suppl\xE9mentaires.`,submitButtonText:()=>"Confirmer",submitButtonTextCompleted:()=>"Confirm\xE9!",chooseButtonText:()=>"Choisissez"},de:{beamAttribution:()=>"Unterst\xFCtzt von Beam",ctaTitle:()=>"W\xE4hle deinen Impact",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`W\xE4hle eine der gemeinn\xFCtzigen Organisationen und spende ${i} deines Einkaufs ohne zus\xE4tzliche Kosten`,submitButtonText:()=>"Best\xE4tigen",submitButtonTextCompleted:()=>"Best\xE4tigt!",chooseButtonText:()=>"W\xE4hlen"},es:{ctaTitle:()=>"Elige tu contribuci\xF3n",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`Elige una organizaci\xF3n sin fines de lucro y donaremos ${i} de tu compra sin coste adicional.`,beamAttribution:()=>"Ofrecido por Beam",submitButtonText:()=>"Confirmar",submitButtonTextCompleted:()=>"\xA1Confirmado!",chooseButtonText:()=>"Elige"},it:{ctaTitle:()=>"Scegli dove fare la differenza",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`Seleziona un'organizzazione no-profit a cui devolvere l\u2019${i} del tuo acquisto, senza costi aggiuntivi`,beamAttribution:()=>"Gestito da Beam",submitButtonText:()=>"Confermare",submitButtonTextCompleted:()=>"Confermato!",chooseButtonText:()=>"Scegli"},pl:{beamAttribution:()=>"Wspierany przez Beam",ctaTitle:()=>"Wybierz inicjatyw\u0119, kt\xF3r\u0105 chcesz wesprze\u0107",ctaPromoPrefixMessage:()=>"",ctaPromoMessage:()=>"",ctaMessage:({donationPercentage:i="1%"}={})=>`Wybierz organizacj\u0119, kt\xF3rej przeka\u017Cesz ${i} warto\u015Bci Twoich zakup\xF3w \u2013 bez \u017Cadnych dodatkowych koszt\xF3w!`,submitButtonText:()=>"Zatwierd\u017A",submitButtonTextCompleted:()=>"Zatwierdzono!",chooseButtonText:()=>"Wybierz"}};var Y=Object.defineProperty,ee=Object.getOwnPropertyDescriptor,s=(i,e,t,o)=>{for(var a=o>1?void 0:o?ee(e,t):e,p=i.length-1,d;p>=0;p--)(d=i[p])&&(a=(o?d(e,t,a):d(a))||a);return o&&a&&Y(e,t,a),a};class r extends N{constructor(){super(...arguments),this.baseUrl=W,this.lang="en",this.debug=!1,this.isMobile=window.innerWidth<768,this.didUserExpandNonprofits=!1,this.shouldUseNewPromoUI=!1,this.getChainNonprofits=async()=>{if(M(["transactionId","subscriptionId"],this),!this.hasCorrectTransactionConfig&&!this.hasCorrectSubscriptionConfig)throw new H;const e=await A({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{storeId:this.storeId,postalCode:this.postalCode,countryCode:this.countryCode,cart:this.cart??void 0,widgetName:"redeem-transaction",version:"1.0.0",lang:this.configLang}});return e.store?.id&&e.store.id!==this.storeId&&(this.storeId=e.store.id),this.localStorage.setItemJson("chainNonprofits",{createdAt:new Date,data:e}),e},this.updateNonprofitIdForRecord=async({selectedNonprofitId:e})=>this.transactionId?this.putTransaction({selectedNonprofitId:e}):this.subscriptionId?this.putSubscription({selectedNonprofitId:e}):null,this.putTransaction=async({selectedNonprofitId:e})=>(C(["apiKey","transactionId"],this),F({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},pathParams:{transactionId:Number(this.transactionId)},requestBody:{nonprofitId:e}})),this.putSubscription=async({selectedNonprofitId:e})=>(C(["apiKey","subscriptionId"],this),K({baseUrl:this.baseUrl,headers:{authorization:`Api-Key ${this.apiKey}`},requestBody:{remoteSubscriptionId:this.subscriptionId,nonprofitId:e}})),this.nonprofitListDataController=new B(this,this.getChainNonprofits),this.selectionDataController=new B(this,this.updateNonprofitIdForRecord),this.localStorage=J(this),this.makeHandleSelect=(e,t,o)=>async a=>{if(!this.allowChange)return;const p=this.selectedNonprofitId;if(a instanceof KeyboardEvent){let d=null;switch(a.key){case"ArrowUp":case"ArrowLeft":t===0?d=o[o.length-1]:d=o[t-1],a.preventDefault();break;case"ArrowRight":case"ArrowDown":t===o.length-1?d=o[0]:d=o[t+1],a.preventDefault();break;case"Enter":case" ":a.preventDefault();break;default:return}if(d){const b=this.renderRoot.querySelector(`[data-value="${d.nonprofit.id}"]`);b!==null&&(b.tabIndex=0,b.focus());return}}if(a.currentTarget instanceof HTMLElement){if(p===e)return;this.selectedNonprofitId=e}},this.handleSubmit=async()=>{const{selectedNonprofitId:e}=this;if(!this.allowSubmit||e==null)return;await this.selectionDataController.exec({selectedNonprofitId:e}),this.shouldUseStoredSelection&&(this.localStorage.setItem("nonprofit",e),this.localStorage.setItem("nonprofit_selected_at",new Date().toISOString()));const t=this.nonprofitListDataController?.data?.nonprofits.find(o=>o.nonprofit.id===e);this.dispatchEvent(new Q({selectedNonprofitId:e,nonprofitName:t?.nonprofit.name}))},this.evaluateBreakPoints=z(()=>{this.isMobile=window.innerWidth<768},50,{maxWait:50,leading:!0})}get configLang(){return O[this.lang]||"en"}get hasCorrectTransactionConfig(){return w(["apiKey","transactionId"],this)}get hasCorrectSubscriptionConfig(){return w(["apiKey","subscriptionId"],this)}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.evaluateBreakPoints)}async firstUpdated(e){await this.restoreStateFromCache()}async updated(e){const t=["baseUrl","storeId","apiKey","countryCode","postalCode","lang"];for(const o of t)if(e.has(o)){await this.nonprofitListDataController.exec();break}}disconnectedCallback(){super.disconnectedCallback()}restoreStateFromCache(){C(["apiKey"],this),this.shouldUseStoredSelection&&(this.selectedNonprofitId=parseInt(this.localStorage.getItem("nonprofit")||"")||void 0);try{const{createdAt:e=0,data:t}=this.localStorage.getItemJson("chainNonprofits")||{},o=2*60*60*1e3;new Date(e).valueOf()+o>new Date().valueOf()&&(this.nonprofitListDataController.data=t,this.nonprofitListDataController.loading=!1)}catch{}}get allowChange(){return this.selectionDataController.data==null&&!this.selectionDataController.loading}get allowSubmit(){return!!(this.selectedNonprofitId&&this.allowChange)}get shouldUseStoredSelection(){return!this.subscriptionId}get cssVariables(){const e={"--beam-fontFamily":"inherit","--beam-fontStyle":"inherit","--beam-fontSize":"inherit","--beam-textColor":"inherit","--beam-backgroundColor":"inherit",...V,...j,"--beam-RedeemTransaction-maxWidth":"1000px","--beam-RedeemTransaction-submitButton-color":"#fff","--beam-RedeemTransaction-submitButton-hover-color":"#fff","--beam-RedeemTransaction-submitButton-disabled-color":"#fff","--beam-RedeemTransaction-submitButton-backgroundColor":"#333","--beam-RedeemTransaction-submitButton-hover-backgroundColor":"#222","--beam-RedeemTransaction-submitButton-disabled-backgroundColor":"#767676","--beam-RedeemTransaction-submitButton-borderColor":"#333","--beam-RedeemTransaction-submitButton-hover-borderColor":"#222","--beam-RedeemTransaction-submitButton-disabled-borderColor":"#767676","--beam-RedeemTransaction-submitButton-fontSize":"14px","--beam-RedeemTransaction-submitButton-fontWeight":"inherit","--beam-RedeemTransaction-submitButton-fontFamily":"inherit","--beam-RedeemTransaction-submitButton-textTransform":"none","--beam-RedeemTransaction-submitButton-borderRadius":"0px","--beam-RedeemTransaction-submitButton-padding":"15px 30px","--beam-RedeemTransaction-submitButton-position":"right","--beam-RedeemTransaction-submitButton-positionRight-width":"auto","--beam-RedeemTransaction-submitButton-positionBottom-width":"100%","--beam-RedeemTransaction-submitButton-positionBottom-marginTop":"10px","--beam-RedeemTransaction-checkmark-color":"transparent","--beam-RedeemTransaction-checkmark-selected-color":"#fff","--beam-RedeemTransaction-checkmark-hover-color":"#fff","--beam-RedeemTransaction-checkmark-backgroundColor":"transparent","--beam-RedeemTransaction-checkmark-selected-backgroundColor":"#333","--beam-RedeemTransaction-checkmark-hover-backgroundColor":"#d9d9d9","--beam-RedeemTransaction-checkmark-borderColor":"transparent","--beam-RedeemTransaction-checkmark-selected-borderColor":"#333","--beam-RedeemTransaction-checkmark-hover-borderColor":"#d9d9d9","--beam-RedeemTransaction-options-minWidth":"250px","--beam-RedeemTransaction-options-columnCount":"2","--beam-RedeemTransaction-options-borderRadius":"0px","--beam-RedeemTransaction-options-borderWidth":"1px","--beam-RedeemTransaction-options-selected-borderWidth":"2px","--beam-RedeemTransaction-options-focus-borderWidth":"1px","--beam-RedeemTransaction-options-image-borderRadius":"0px","--beam-RedeemTransaction-options-borderColor":"#d9d9d9","--beam-RedeemTransaction-options-selected-borderColor":"currentColor","--beam-RedeemTransaction-options-hover-borderColor":"#ccc","--beam-RedeemTransaction-options-backgroundColor":"transparent","--beam-RedeemTransaction-options-selected-backgroundColor":"transparent","--beam-RedeemTransaction-options-hover-backgroundColor":"#f1f1f1","--beam-RedeemTransaction-options-marginTop":"15px",...f("--beam-RedeemTransaction-title",{fontSize:"1.25em",fontWeight:"bold"}),...f("--beam-RedeemTransaction-description",{marginTop:"0.5em"}),...f("--beam-RedeemTransaction-details-cause",{fontSize:"1em",fontWeight:"bold"}),...f("--beam-RedeemTransaction-details-impactDescription",{fontSize:"0.85em",marginTop:"10px"}),"--beam-RedeemTransaction-details-nonprofitName-fontWeight":"bold","--beam-RedeemTransaction-details-nonprofitName-fontStyle":"inherit","--beam-RedeemTransaction-details-fundingProgress-marginTop":"10px",...f("--beam-RedeemTransaction-details-fundingProgressLabel",{fontSize:"0.85em"}),"--beam-RedeemTransaction-cardStyle":"'image'","--beam-RedeemTransaction-options-icon-padding":"0px","--beam-RedeemTransaction-options-collapseNonprofits-mobile":"false","--beam-RedeemTransaction-options-collapseNonprofits-desktop":"false",..._},t=this.nonprofitListDataController?.data?.config?.web?.theme||{},o={...e,...t};return Object.assign(Object.create({toCSS(){return E(this)}}),o)}handleChooseClick(){this.didUserExpandNonprofits=!0}get shouldCollapse(){const e=this.cssVariables["--beam-RedeemTransaction-options-collapseNonprofits-mobile"]==="true",t=this.cssVariables["--beam-RedeemTransaction-options-collapseNonprofits-desktop"]==="true";return this.isMobile&&e||!this.isMobile&&t}render(){const{selectedNonprofitId:e}=this,{data:t,loading:o}=this.nonprofitListDataController;if(o&&!t)return q();if(this.nonprofitListDataController.error)return this.debug?y({error:this.nonprofitListDataController.error}):"";if(this.selectionDataController.error&&this.debug)return y({error:this.selectionDataController.error});if(t==null)return this.debug?y({error:new G("No data")}):"";const a=t?.nonprofits||[],p=a.find(n=>n.nonprofit.id===e)||null,d=this.cssVariables["--beam-RedeemTransaction-cardStyle"]==="'icon'",b=this.cssVariables["--beam-RedeemTransaction-submitButton-position"],R=this.isMobile&&b==="bottom"?"positionBottom":"positionRight";this.shouldUseNewPromoUI=!!(t?.config?.web?.promo&&!this.subscriptionId);const S=a.some(n=>!n.promo||!n.promo.isActive);return c`
       <style>
         :host {
           ${this.cssVariables.toCSS()}