@liquidcommerce/elements-sdk 2.7.38 → 2.7.40

package/dist/ssr-stub.esm.js

@@ -214,6 +214,7 @@ const COMPONENT_TYPE = {
     CHECKOUT_ITEM: 'checkout-item',
     CHECKOUT_ITEM_QUANTITY: 'checkout-item-quantity',
     CHECKOUT_PLACE_ORDER_BUTTON: 'checkout-place-order-button',
+    CHECKOUT_PROP65_WARNING: 'checkout-prop65-warning',
     CHECKOUT_HEADER: 'checkout-header',
     CHECKOUT_PRESALE_COUNTDOWN: 'checkout-presale-countdown',
     CHECKOUT_PRESALE_EXPIRED: 'checkout-presale-expired',

package/dist/types/auto-initialize/shared-utils.d.ts

@@ -19,6 +19,7 @@ export declare const SHARED_ATTR: {
         readonly PROMO_CODE_PARAM: "data-promo-code-param";
         readonly CHECKOUT_PARAM: "data-checkout-param";
         readonly CHECKOUT_URL: "data-checkout-url";
+        readonly GTM_GATEWAY_URL: "data-gtm-gateway-url";
     };
     readonly ELEMENT: {
         readonly CHECKOUT: "data-lce-checkout";

package/dist/types/constants/index.d.ts

@@ -1 +1,2 @@
 export * from './core.constant';
+export * from './prop65.constant';

package/dist/types/constants/prop65.constant.d.ts

@@ -0,0 +1,8 @@
+export declare const PROP65: {
+    readonly LABEL: "CA WARNING";
+    readonly URL: "https://www.p65warnings.ca.gov/alcohol";
+    readonly URL_TEXT: "www.P65Warnings.ca.gov/alcohol";
+    readonly BODY_LEAD: "WARNING:";
+    readonly BODY: "Drinking distilled spirits, beer, coolers, wine and other alcoholic beverages may increase cancer risk, and, during pregnancy, can cause birth defects. For more information go to";
+};
+export declare function isProp65State(state: string | null | undefined): boolean;

package/dist/types/core/client/client-config.service.d.ts

@@ -1,5 +1,5 @@
 import { type DebugMode, type ElementsEnv } from '@/enums';
-import type { IClientCustomThemeConfig, IElementsProxyConfig, ILiquidCommerceElementsCheckoutConfig } from '@/interfaces/config.interface';
+import type { IClientCustomThemeConfig, IElementsGTMConfig, IElementsProxyConfig, ILiquidCommerceElementsCheckoutConfig } from '@/interfaces/config.interface';
 import type { IPromoTicker } from '@/interfaces/configs';
 export type DeviceType = 'desktop' | 'tablet' | 'mobile';
 export interface IClientConfigs {
@@ -12,6 +12,7 @@ export interface IClientConfigs {
     partnerName?: string;
     customTheme: IClientCustomThemeConfig | null;
     proxy: IElementsProxyConfig | null;
+    gtm: IElementsGTMConfig | null;
     deviceType: DeviceType;
     userDeviceId?: string;
     localStorageKeyPrefix?: string;
@@ -31,6 +32,7 @@ export interface IClientConfigInput {
     debugMode?: DebugMode;
     customTheme?: IClientCustomThemeConfig;
     proxy?: IElementsProxyConfig;
+    gtm?: IElementsGTMConfig;
     promoTicker?: IPromoTicker[];
     development?: {
         customApiUrl?: string;

package/dist/types/core/google-tag-manager.service.d.ts

@@ -51,6 +51,7 @@ export declare class GoogleTagManagerService {
     private partnerName?;
     private partnerCode?;
     private partnerGTMId?;
+    private partnerGatewayUrl?;
     private liquidCommerceGTMId?;
     private enablePartnerGTM;
     private enableLiquidCommerceGTM;
@@ -67,6 +68,12 @@ export declare class GoogleTagManagerService {
     private waitForDOMReady;
     private isGTMAlreadyLoaded;
     private isContainerLoaded;
+    private isGatewayScriptForContainer;
+    private getPartnerGatewayScripts;
+    private parseScriptUrl;
+    private resolveGatewayUrl;
+    private getContainerRegistry;
+    private isContainerRegistered;
     private isContainerInitialized;
     private loadGTMScript;
     private waitForContainerInit;

package/dist/types/enums/core.enum.d.ts

@@ -133,6 +133,7 @@ export declare const COMPONENT_TYPE: {
     readonly CHECKOUT_ITEM: "checkout-item";
     readonly CHECKOUT_ITEM_QUANTITY: "checkout-item-quantity";
     readonly CHECKOUT_PLACE_ORDER_BUTTON: "checkout-place-order-button";
+    readonly CHECKOUT_PROP65_WARNING: "checkout-prop65-warning";
     readonly CHECKOUT_HEADER: "checkout-header";
     readonly CHECKOUT_PRESALE_COUNTDOWN: "checkout-presale-countdown";
     readonly CHECKOUT_PRESALE_EXPIRED: "checkout-presale-expired";

package/dist/types/interfaces/config.interface.d.ts

@@ -7,6 +7,9 @@ export interface IElementsProxyConfig {
     baseUrl: string;
     headers?: Record<string, string>;
 }
+export interface IElementsGTMConfig {
+    gatewayUrl?: string;
+}
 export interface ILiquidCommerceElementsDevelopmentConfig {
     customApiUrl?: string;
     openShadowDom?: boolean;
@@ -30,6 +33,7 @@ export interface ILiquidCommerceElementsBaseConfig {
     debugMode?: DebugMode;
     checkout?: ILiquidCommerceElementsCheckoutConfig;
     proxy?: IElementsProxyConfig;
+    gtm?: IElementsGTMConfig;
     development?: ILiquidCommerceElementsDevelopmentConfig;
 }
 export interface ILiquidCommerceElementsBuilderConfig extends ILiquidCommerceElementsBaseConfig {

package/dist/types/modules/checkout/components/checkout-prop65-warning.component.d.ts

@@ -0,0 +1,8 @@
+import { BaseComponent } from '@/core/base-component.service';
+import type { ICheckoutComponent } from '@/interfaces/configs';
+export declare class CheckoutProp65WarningComponent extends BaseComponent<null, ICheckoutComponent> {
+    constructor();
+    get hostClasses(): string[];
+    private colorMode;
+    protected template(): HTMLElement | HTMLElement[];
+}

package/dist/types/modules/checkout/components/index.d.ts

@@ -18,6 +18,7 @@ export * from './checkout-place-order-button.component';
 export * from './checkout-presale-countdown.component';
 export * from './checkout-presale-expired.component';
 export * from './checkout-promo-code.component';
+export * from './checkout-prop65-warning.component';
 export * from './checkout-send-as-gift.component';
 export * from './checkout-stripe-form.component';
 export * from './checkout-stripe-handler.component';

package/dist/types/modules/product/components/product-prop65-warning.d.ts

@@ -0,0 +1 @@
+export declare function createProductProp65Warning(): HTMLDetailsElement;

package/dist/types/modules/product/product.component.d.ts

@@ -5,9 +5,12 @@ export interface IProductComponentParams {
 }
 export declare class ProductComponent extends BaseComponent<IProductComponentParams, IProductComponent> {
     private titleElement;
+    private contentElement;
+    private prop65Warning;
     constructor();
     private getProductId;
     onStoreWatch(changes: IOnStoreChanged[]): void;
+    private syncProp65Warning;
     protected template(): HTMLElement;
     disconnected(): Promise<void>;
 }

package/dist/types/modules/product/styles/prop65-warning.style.d.ts

@@ -0,0 +1 @@
+export declare const getProp65WarningStyles: () => string;

package/dist/types/ssr/stub.d.ts

@@ -3,7 +3,7 @@ export type { CartEventLevel, CartEventType, CheckoutEventLevel, CheckoutEventTy
 export { CART_EVENT_LEVEL, CART_EVENT_TYPE, CHECKOUT_EVENT_LEVEL, CHECKOUT_EVENT_TYPE, COMPONENT_TYPE, DEBUG_MODE, DISPLAY_MODE, ELEMENTS_ACTIONS_EVENT, ELEMENTS_ENV, ELEMENTS_FORM, FULFILLMENT_TYPE, NAVIGATION_SOURCE, } from '../enums/core.enum';
 export type { ILiquidCommerceElementsActions, ILiquidCommerceElementsBuilderClient, ILiquidCommerceElementsClient, } from '../interfaces/client.interface';
 export type { IInjectedComponent } from '../interfaces/component.interface';
-export type { IElementsProxyConfig, ILiquidCommerceElementsBuilderConfig, ILiquidCommerceElementsCheckoutConfig, ILiquidCommerceElementsConfig, ILiquidCommerceElementsDevelopmentConfig, } from '../interfaces/config.interface';
+export type { IElementsGTMConfig, IElementsProxyConfig, ILiquidCommerceElementsBuilderConfig, ILiquidCommerceElementsCheckoutConfig, ILiquidCommerceElementsConfig, ILiquidCommerceElementsDevelopmentConfig, } from '../interfaces/config.interface';
 export type * from '../interfaces/configs';
 export type { IBuilderInjectElementParams, IInjectCheckoutBuilderParams, IInjectCheckoutParams, IInjectProductElement, IInjectProductListFiltersParams, IInjectProductListParams, IInjectProductListSearchParams, ProductListFilterType, } from '../interfaces/injection.interface';
 export declare function Elements(..._args: any[]): Promise<null>;

package/docs/v1/api/client.md

@@ -108,6 +108,7 @@ interface ILiquidCommerceElementsConfig {
   customTheme?: IClientCustomThemeConfig;
   promoTicker?: IPromoTicker[];
   proxy?: IElementsProxyConfig;
+  gtm?: IElementsGTMConfig;
   checkout?: ILiquidCommerceElementsCheckoutConfig;
   development?: ILiquidCommerceElementsDevelopmentConfig;
 }
@@ -192,6 +193,24 @@ proxy: {
 
 See [Proxy Setup Guide](../integration/proxy-setup.md) for implementation.
 
+#### GTM Configuration
+
+```typescript
+interface IElementsGTMConfig {
+  gatewayUrl?: string;
+}
+```
+
+**Example:**
+
+```javascript
+gtm: {
+  gatewayUrl: 'https://www.yoursite.com/metrics/'
+}
+```
+
+Set this when your site serves its own GTM container through Google tag gateway. See [Analytics → Google tag gateway](../reference/analytics.md#google-tag-gateway).
+
 #### Checkout Configuration
 
 ```typescript

package/docs/v1/api/configuration.md

@@ -16,6 +16,7 @@ interface ILiquidCommerceElementsConfig {
   debugMode?: DebugMode;
   checkout?: ILiquidCommerceElementsCheckoutConfig;
   proxy?: IElementsProxyConfig;
+  gtm?: IElementsGTMConfig;
   development?: ILiquidCommerceElementsDevelopmentConfig;
 }
 ```
@@ -28,6 +29,7 @@ interface ILiquidCommerceElementsConfig {
 | `debugMode` | `'none' \| 'console' \| 'panel'` | No | Debug output mode |
 | `checkout` | `ILiquidCommerceElementsCheckoutConfig` | No | Checkout behavior settings |
 | `proxy` | `IElementsProxyConfig` | No | Proxy configuration for API requests |
+| `gtm` | `IElementsGTMConfig` | No | Google tag gateway URL of your own GTM container |
 | `development` | `ILiquidCommerceElementsDevelopmentConfig` | No | Development/testing options |
 
 > **Note:** `debugMode` (`'console'` or `'panel'`) is **ignored in production** -- it is forced off when `env` is `'production'`. It only takes effect outside production (`'staging'`).
@@ -143,7 +145,7 @@ interface IGlobalLayout {
 | `enableOrderedProductSizes` | `boolean` | Enable a fixed display order for product/PLC size selectors (defined by `orderedProductSizes`) instead of the default ordering |
 | `orderedProductSizes` | `string[]` | Ordered list of size values controlling the sequence in which size selectors are rendered; changes trigger targeted rerenders of the affected size selectors |
 | `showPoweredBy` | `boolean` | Show "Powered by LiquidCommerce" badge |
-| `poweredByMode` | `'light' \| 'dark'` | Color mode for the powered-by badge |
+| `poweredByMode` | `'light' \| 'dark'` | Colour mode for the checkout: the powered-by badge, the Stripe payment form, and the California Proposition 65 warning panel |
 
 > **Note:** `showPoweredBy` is a server/plan-controlled setting and **cannot** be overridden by hosts. Any value supplied via `customTheme` (or a later config update) is stripped and the server value is restored. Only `poweredByMode` (`'light' \| 'dark'`) is host-overridable.
 
@@ -530,6 +532,22 @@ See [Proxy Setup Guide](../integration/proxy-setup.md) for implementation detail
 
 ---
 
+## GTM Configuration
+
+### IElementsGTMConfig
+
+```typescript
+interface IElementsGTMConfig {
+  gatewayUrl?: string;
+}
+```
+
+If your site loads its own GTM container through Google tag gateway for advertisers, set `gatewayUrl` to that first-party path (e.g. `'https://www.yoursite.com/metrics/'` or `'/metrics/'`) so the SDK recognizes the container instead of treating the page as having none. Declarative equivalent: `data-gtm-gateway-url`. An empty or non-string value drops the whole `gtm` config with a console warning.
+
+See [Analytics → Google tag gateway](../reference/analytics.md#google-tag-gateway).
+
+---
+
 ## Development Configuration
 
 ### ILiquidCommerceElementsDevelopmentConfig

package/docs/v1/api/typescript-types.md

@@ -99,6 +99,7 @@ interface ILiquidCommerceElementsConfig {
   debugMode?: DebugMode;
   checkout?: ILiquidCommerceElementsCheckoutConfig;
   proxy?: IElementsProxyConfig;
+  gtm?: IElementsGTMConfig;
   development?: ILiquidCommerceElementsDevelopmentConfig;
 }
 ```
@@ -133,6 +134,16 @@ interface IElementsProxyConfig {
 }
 ```
 
+### IElementsGTMConfig
+
+```typescript
+interface IElementsGTMConfig {
+  gatewayUrl?: string;
+}
+```
+
+`gatewayUrl` is the Google tag gateway path your own GTM container is served from (see [Analytics → Google tag gateway](../reference/analytics.md#google-tag-gateway)).
+
 ### ILiquidCommerceElementsDevelopmentConfig
 
 ```typescript

package/docs/v1/getting-started/installation.md

@@ -47,6 +47,7 @@ The path segment selects which bundle is served:
 | `data-liquid-commerce-elements` | Yes | Identifies this as the Elements SDK script |
 | `data-token` | Yes | Your LiquidCommerce API key |
 | `data-env` | No | Environment: `staging` or `production`. Defaults to `production` if omitted. |
+| `data-gtm-gateway-url` | No | Google tag gateway path your own GTM container is served from (e.g. `/metrics/`). See [Analytics → Google tag gateway](../reference/analytics.md#google-tag-gateway). |
 | `defer` | Recommended | Allows non-blocking script loading |
 
 ### Where to Place the Script
@@ -269,6 +270,7 @@ const client = await Elements('YOUR_API_KEY', {
   customTheme: { /* ... */ },   // Optional: Theme customization
   promoTicker: [ /* ... */ ],   // Optional: Promo ticker configuration
   proxy: { /* ... */ },         // Optional: Proxy configuration
+  gtm: { /* ... */ },           // Optional: Google tag gateway URL of your own GTM container
   checkout: { /* ... */ },      // Optional: Checkout configuration
   development: { /* ... */ }    // Optional: Development/testing options
 });

package/docs/v1/guides/accessibility.md

@@ -143,6 +143,11 @@ on render, and a live region recreated with its text already in place is not ann
   `option` and `radio` have presentational children, so the name is the only channel: a delivery
   option names the retailer, the price, the timing, the delivery fee and — for same-day — the
   store address and whether it is currently closed.
+- The California Proposition 65 warning on the product is a native `<details>` / `<summary>`
+  disclosure: the summary is a button that exposes its expanded state, and `Enter` / `Space` toggle
+  it with no scripting involved. Its `+` / `−` indicator is decorative and hidden. In checkout it is
+  a plain link whose accessible name ends "(opens in a new tab)", since following it leaves the
+  purchase mid-flow; the `·` separator is hidden.
 
 ### Headings
 
@@ -180,6 +185,12 @@ The tokens worth checking are `defaultTextColor`, `linkTextColor`, `warningColor
 `successColor` against `drawerBackgroundColor` (or whatever your page puts behind the Element), plus
 `selectedTextColor` against `primaryColor` for text on brand-filled buttons and badges.
 
+`defaultTextColor` also colours the product's California Proposition 65 warning, which is legally
+required copy, so it always uses the full-strength token, never a lighter variant — make sure it
+reaches 4.5:1 on your product background. The checkout's warning panel does not use it: it is a
+fixed colour pair chosen by `global.layout.poweredByMode` (over 13:1 in both `light` and `dark`), so
+set that to `dark` if your checkout is dark.
+
 Every token ships with a default that already passes on a light surface. Two are easy to forget
 because they are optional — leave them out to keep the compliant defaults, or set them explicitly to
 keep those details on-brand:

package/docs/v1/guides/checkout-component.md

@@ -452,6 +452,22 @@ window.addEventListener('lce:actions.checkout_product_add_failed', (event) => {
 });
 ```
 
+## California Proposition 65 Warning
+
+When the shipping address is in California, the order summary shows a panel directly above the
+place-order button reading **Adult signature (21+) required at delivery.** followed by
+**CA WARNING · California Proposition 65 information for these products**, so the warning is
+presented before the purchase completes. The text links to the OEHHA alcohol page,
+[www.P65Warnings.ca.gov/alcohol](https://www.p65warnings.ca.gov/alcohol), in a new tab. The full
+27 CCR § 25607.4 text is on the product element.
+
+The panel appears in the drawer checkout, the hosted checkout and the checkout-only build. The
+whole panel, adult-signature notice included, is shown only for a California shipping address; it
+appears or disappears when the address changes, and nothing renders in its place otherwise. Neither can be turned off or reworded by configuration. Its colours follow `global.layout.poweredByMode` — the same
+light/dark switch the Stripe payment form uses — as a fixed pair so the copy is always legible:
+`light` is `#18181B` on `#F5F3EE`, `dark` is `#F5F3EE` on `#2A2824`. The font and corner radius come
+from your theme. If your checkout is dark, set `poweredByMode: 'dark'`.
+
 ## Customization
 
 ### Theme Configuration

package/docs/v1/guides/product-component.md

@@ -227,6 +227,22 @@ Adjust product quantity before adding to cart:
 - Direct input field
 - Inventory limits enforced
 
+### California Proposition 65 Warning
+
+When the shopper's address is in California, the product element ends with a collapsed
+**CA WARNING — California Proposition 65** row. Expanding it shows the alcoholic-beverage warning
+required by 27 CCR § 25607.4, verbatim, with a link to
+[www.P65Warnings.ca.gov/alcohol](https://www.p65warnings.ca.gov/alcohol). The row appears and
+disappears in place as the address changes; with no address set, or an address in another state, it
+is not rendered.
+
+This is a compliance requirement for alcohol sold online to California, so for a California address
+it cannot be turned off: there is no layout option, theme token or attribute that removes the row or
+changes its wording. It takes its
+colours, fonts and dividers from your theme (`defaultTextColor`, `accentColor`, the heading and
+paragraph fonts) so it fits your design — check that `defaultTextColor` reaches 4.5:1 against your
+product background, since the SDK renders it as given.
+
 ## Actions API
 
 Programmatically interact with products:

package/docs/v1/guides/theming.md

@@ -90,7 +90,7 @@ customTheme: {
       inputFieldStyle: 'outlined',  // or 'filled'
       enableOrderedProductSizes: true,  // enable custom ordering of the size selectors
       orderedProductSizes: ['750ml', '1L', '1.75L'],  // order applied to product and product-list size selectors
-      poweredByMode: 'light'  // or 'dark'  (note: showPoweredBy is controlled server-side and cannot be overridden via customTheme)
+      poweredByMode: 'light'  // or 'dark': badge, Stripe form and Prop 65 panel colours (note: showPoweredBy is controlled server-side and cannot be overridden via customTheme)
     }
   }
 }

package/docs/v1/reference/analytics.md

@@ -48,7 +48,21 @@ Events fired before GTM finishes initializing are queued (up to 100, oldest drop
 
 ## Coexisting With Your Own GTM
 
-The SDK detects an already-present partner/host GTM container rather than replacing it. When a host GTM install (an existing `gtag` function or an existing `googletagmanager.com/gtm.js` script tag) is detected, the SDK integrates with it.
+The SDK detects an already-present partner/host GTM container rather than replacing it. When a host GTM install (an existing `gtag` function, an existing `googletagmanager.com/gtm.js` script tag, or a script served from your configured Google tag gateway) is detected, the SDK integrates with it. A container that has booted is also recognized through GTM's own `window.google_tag_manager[containerId]` registry, whichever host served it.
+
+### Google tag gateway
+
+If your site loads its own GTM container first-party through [Google tag gateway for advertisers](https://developers.google.com/tag-platform/tag-manager/gateway/get-started) (e.g. `https://www.yoursite.com/metrics/` instead of `https://www.googletagmanager.com/gtm.js?id=GTM-XXXX`), tell the SDK where that path is so it recognizes your container:
+
+```javascript
+const client = await Elements('YOUR_API_KEY', {
+  gtm: { gatewayUrl: 'https://www.yoursite.com/metrics/' }, // or '/metrics/'
+});
+```
+
+Or declaratively, on the script tag: `data-gtm-gateway-url="/metrics/"`.
+
+A gateway script URL usually carries no container ID, so without this setting the SDK cannot match the script tag to your partner container. A script with the same origin whose path starts with that value is matched to your partner container by container ID: an `id=` query parameter must equal your partner container ID, and a script without one counts only once GTM's `window.google_tag_manager` registry lists your container ID (or while no container has booted yet). A gateway serving a different container or a GA4/Ads tag is therefore never taken for yours. Relative values resolve against the current page. The setting affects detection only — the SDK never loads your container, and the LiquidCommerce container still loads from `googletagmanager.com`.
 
 When both the LiquidCommerce container and a partner container are initialized, events are sent to both using GA4's `send_to` targeting (a dual-container send). Only containers that are actually initialized are added to `send_to`, so events are never routed to a container that failed to load.
 

package/package.json

@@ -3,7 +3,7 @@
   "description": "LiquidCommerce Elements SDK",
   "license": "UNLICENSED",
   "author": "LiquidCommerce Team",
-  "version": "2.7.38",
+  "version": "2.7.40",
   "homepage": "https://docs.liquidcommerce.co/elements-sdk",
   "repository": {
     "type": "git",
@@ -122,22 +122,22 @@
     "@semantic-release/changelog": "^7.0.0",
     "@semantic-release/commit-analyzer": "^13.0.1",
     "@semantic-release/git": "^11.0.1",
-    "@semantic-release/github": "^12.0.9",
-    "@semantic-release/npm": "^13.1.5",
+    "@semantic-release/github": "^12.0.10",
+    "@semantic-release/npm": "^13.2.0",
     "@semantic-release/release-notes-generator": "^14.1.1",
     "@types/core-js": "^2.5.8",
-    "@types/node": "^26.6.2",
+    "@types/node": "^26.6.3",
     "conventional-changelog": "8.1.3",
     "husky": "^9.1.7",
-    "jsdom": "30.1.0",
+    "jsdom": "30.1.1",
     "process": "^0.11.10",
-    "rollup": "^4.63.4",
+    "rollup": "^4.63.5",
     "rollup-obfuscator": "^4.1.1",
     "rollup-plugin-typescript2": "^0.37.0",
     "semantic-release": "^25.0.9",
     "ts-node": "^10.9.2",
     "typescript": "6.0.3",
-    "vitest": "5.0.1"
+    "vitest": "5.0.2"
   },
   "engines": {
     "node": ">=22"