@liquidcommerce/elements-sdk 2.7.2 → 2.7.3

package/dist/types/modules/product-list/components/product-list-search.component.d.ts

@@ -9,9 +9,7 @@ export declare class ProductListSearchComponent extends BaseComponent {
     private readonly DEFAULT_DEBOUNCE_MS;
     get hostClasses(): string[];
     disconnectedCallback(): void;
-    getCurrentSearchTerm(): string;
     private fetchProducts;
-    private buildCurrentFiltersFromState;
     protected template(): HTMLElement[];
     private handleDebouncedSearch;
     private handleClearSearch;

package/dist/types/modules/product-list/product-list-card.component.d.ts

@@ -1,30 +1,32 @@
-import type { IProductListProduct } from 'core/store/interfaces/product-list.interface';
 import type { IProductListComponent } from 'interfaces/configs';
-import { BaseComponent } from '@/core/base-component.service';
-import type { IFulfillment } from '@/interfaces/api/product.interface';
+import { BaseComponent, type IOnStoreChanged } from '@/core/base-component.service';
 export interface IProductListCardParams {
-    product: IProductListProduct;
-    shippingFulfillment: IFulfillment | null;
-    onDemandFulfillment: IFulfillment | null;
+    productId: string;
     productUrl?: string;
 }
 export declare class ProductListCardComponent extends BaseComponent<IProductListCardParams, IProductListComponent> {
-    private selectedSize;
-    private unsubscribeFromState?;
+    private imageElement;
+    private priceElement;
+    private personalizeElement;
+    private fulfillmentTextElement;
+    private addToCartButton;
+    private previousSelectedSizeId;
+    private previousSelectedFulfillmentId;
     constructor();
     get hostClasses(): string[];
-    protected connected(): Promise<void>;
-    disconnected(): void;
-    private reRender;
+    protected disconnected?(): void;
+    onStoreWatch(changes: IOnStoreChanged[]): void;
+    private getSelectedSize;
     protected template(): HTMLElement[];
+    private updatePriceDisplay;
+    private updateFulfillmentText;
+    private updateImage;
+    private updatePersonalizeVisibility;
+    private updateAddToCartButton;
     private generateProductUrl;
-    private createVariantStandard;
     private createImageSection;
     private createContentSection;
-    private createPricePersonalizationSection;
-    private createSizesSection;
-    private handleDeliveryOptionsClick;
     private createFulfillmentSectionWrapper;
-    createFulfillmentTextSection(selectedFulfillmentType: string, selectedFulfillmentRetailerName: string): HTMLElement;
+    private createFulfillmentTextSection;
     private createAddToCartSection;
 }

package/dist/types/modules/product-list/product-list-filter.utils.d.ts

@@ -0,0 +1,8 @@
+import type { IFilterSchema, IProductSearchParams } from '@/interfaces/api/product-list.interface';
+import type { ProductListFilterType } from '@/interfaces/injection.interface';
+import type { IExtendedFilterSchema, IProductListFilters } from './product-list.interface';
+export declare const FILTER_TYPE_MAP: Record<string, string>;
+export declare function getSanitizedFilters(filters: IFilterSchema[], configuredFilters: ProductListFilterType[]): IExtendedFilterSchema[];
+export declare function syncFiltersToAppliedFormat(filters: IProductListFilters): Record<string, string[]>;
+export declare function buildSearchParams(page: number, perPage: number, searchTerm: string, currentFilters: IProductListFilters, configuredFilters: ProductListFilterType[]): IProductSearchParams;
+export declare function buildCurrentFiltersFromState(stateFilters: Record<string, string[]>): IProductListFilters;

package/dist/types/modules/product-list/product-list.commands.d.ts

@@ -1,76 +1,29 @@
-import type { IModalContentConfig } from 'core/store/interfaces/core.interface';
-import type { IProductSizeStore } from 'core/store/interfaces/product.interface';
-import type { IProductListProduct, IProductListStore } from 'core/store/interfaces/product-list.interface';
 import { BaseCommand } from '@/core/command/base-command.service';
 import { type FulfillmentType } from '@/enums';
-import type { IFulfillment, IProduct, IProductSizeAttributes, IRetailer } from '@/interfaces/api/product.interface';
 import type { IFilterSchema, INavigationResponse, IProductSearchParams, IProductSearchResponse } from '@/interfaces/api/product-list.interface';
-import type { ProductListFilterType } from '@/interfaces/core.interface';
+import type { ProductListFilterType } from '@/interfaces/injection.interface';
 import { type AddItemParams } from '@/modules/cart/cart.commands';
-import type { IExtendedFilterSchema, IPagination, IProductAvailabilityData, IProductListFilters } from './product-list.interface';
-type StateListener = (state: IProductListStore) => void;
+import type { IExtendedFilterSchema, IPagination, IProductListFilters } from './product-list.interface';
 export declare class ProductListCommands extends BaseCommand {
     private readonly uiCommands;
     private readonly cartCommands;
-    private readonly checkoutCommands;
-    private readonly FILTER_TYPE_MAP;
-    private listeners;
     constructor();
     static getInstance(): ProductListCommands;
-    subscribe(listener: StateListener): () => void;
-    private getStoreState;
     updateSearchTerm(searchTerm: string): void;
     setLoading(isLoading: boolean): void;
-    private notifyListeners;
-    private initializeProductFulfillment;
-    private transformProductVariantsToFulfillments;
-    private transformSingleProduct;
-    private transformProductSize;
-    private addShippingFulfillments;
-    private addOnDemandFulfillments;
     loadInitialProducts(page: number, perPage: number, searchTerm: string, currentFilters: IProductListFilters, configuredFilters: ProductListFilterType[]): Promise<void>;
     loadMoreProducts(perPage: number, searchTerm: string, currentFilters: IProductListFilters, configuredFilters: ProductListFilterType[]): Promise<void>;
     getProductList(params: IProductSearchParams): Promise<IProductSearchResponse>;
     syncFiltersFromComponent(filters: IProductListFilters): void;
     getSanitizedFilters(filters: IFilterSchema[], configuredFilters: ProductListFilterType[]): IExtendedFilterSchema[];
-    buildSearchParams(page: number, perPage: number, searchTerm: string, currentFilters: IProductListFilters, configuredFilters: ProductListFilterType[]): IProductSearchParams;
-    private buildFilters;
-    private addToggleFilters;
-    private getBooleanFilterValue;
-    private addEngravingFilter;
-    private addPresaleFilter;
-    private addFulfillmentFilter;
-    private addPriceFilter;
-    private addDynamicFilters;
     setGridConfig(rows: number, columns: number): void;
     getItemsPerPage(): number;
     updatePagination(navigation: INavigationResponse | undefined): IPagination;
     createInitialPagination(): IPagination;
-    mergeRetailers(existingRetailers: Record<string, IRetailer>, newRetailers: Record<string, IRetailer>): Record<string, IRetailer>;
-    extractProductCardData(product: IProductListProduct, retailers: Record<string, IRetailer>): {
-        product: IProductListProduct;
-        retailer: IRetailer;
-    } | null;
-    private getFilterKeyToTypeMap;
-    addToCart(params: AddItemParams): Promise<void>;
-    addPresaleToCart(params: AddItemParams): Promise<void>;
-    trackViewItemList(products: IProduct[]): void;
-    trackSelectItem(product: IProductListProduct): void;
-    private convertProductToBaseItem;
-    openProductListModal(productId: string, contentType: IModalContentConfig['type'], data?: Record<string, any>): void;
-    closeProductListModal(productId: string): void;
-    selectFulfillmentType: (productId: string, selectedFulfillmentType: FulfillmentType) => Promise<void>;
-    selectFulfillment: (productId: string, fulfillmentId: string) => Promise<void>;
-    selectSize: (productId: string, sizeId: string) => Promise<void>;
-    private getFulfillmentForSize;
+    addToCart(productId: string, params: AddItemParams): Promise<void>;
+    selectSize(productId: string, sizeId: string): Promise<void>;
+    changeFulfillmentType: (productId: string, newFulfillmentType: FulfillmentType) => Promise<void>;
+    selectFulfillment: (productId: string, selectedFulfillmentId: string) => Promise<void>;
     updateQuantity: (productId: string, quantity: number) => void;
-    getAvailabilityData(params: {
-        product: IProductListProduct;
-        size?: IProductSizeStore;
-        shippingFulfillment?: IFulfillment | null;
-        onDemandFulfillment?: IFulfillment | null;
-        state?: string;
-    }): IProductAvailabilityData;
-    isPresaleActive(sizeAttributes: IProductSizeAttributes): boolean;
+    saveEngravingLines(productId: string, engravingLines: string[]): void;
 }
-export {};

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

@@ -1,6 +1,6 @@
 import type { IProductListComponent } from 'interfaces/configs';
 import { BaseComponent, type IOnStoreChanged } from '@/core/base-component.service';
-import type { ProductListFilterType } from '@/interfaces/core.interface';
+import type { ProductListFilterType } from '@/interfaces/injection.interface';
 export interface IProductListComponentParams {
     rows: number;
     columns: number;
@@ -9,7 +9,6 @@ export interface IProductListComponentParams {
 }
 export declare class ProductListComponent extends BaseComponent<IProductListComponentParams, IProductListComponent> {
     private products;
-    private retailers;
     private pagination;
     private cardsContainer;
     private sentinelElement;
@@ -22,23 +21,15 @@ export declare class ProductListComponent extends BaseComponent<IProductListComp
     protected connected(): Promise<void>;
     disconnected(): void;
     private initializeComponent;
-    private handleStateUpdate;
-    private updateLoadingState;
-    private hasProductsChanged;
-    private updateProductData;
-    private handleProductRendering;
-    private renderSimplifiedProducts;
+    private toProductArray;
     private setLoadingState;
     private renderCurrentState;
     private loadInitialProducts;
     private loadMoreProducts;
-    private buildCurrentFiltersFromState;
-    private mapStateFilterToComponentFilter;
     private createCardsContainer;
     private renderLoadingState;
     private renderProducts;
     private appendNewProducts;
-    private createProductCard;
     private getResponsiveColumns;
     private setupInfiniteScroll;
     private createScrollSentinel;

package/dist/types/modules/product-list/product-list.interface.d.ts

@@ -1,4 +1,3 @@
-import type { IProductFulfillmentStore, IProductSizeStore } from 'core/store/interfaces/product.interface';
 import type { IFilterValue } from '@/interfaces/api/product-list.interface';
 export interface IPriceConfig {
     min?: string;
@@ -12,9 +11,6 @@ export interface IExtendedFilterSchema {
     type: string;
     values: IFilterValue[];
 }
-export interface IProductListSearch {
-    searchTerm: string;
-}
 export interface IPagination {
     currentPage: number;
     totalPages: number;
@@ -58,29 +54,3 @@ export interface IRenderCheckboxItemsParams {
     state: ICheckboxLabelStates;
     onCheckboxChange: (value: string, checked: boolean) => void;
 }
-export interface ICreateFiltersContainerParams {
-    isDrawerMode?: boolean;
-}
-export interface IProductAvailabilityData {
-    hasAvailability: boolean;
-    upc: string;
-    fulfillmentId: string;
-    partNumber: string;
-    quantity: number;
-    state: string;
-    isPresale: boolean;
-    isPresaleActive: boolean;
-    presaleShipBy: string | null;
-}
-export interface IProductVariantParams {
-    image: string;
-    name: string;
-    size: string | null;
-    price: number;
-    availability: IProductAvailabilityData;
-    hasPersonalization: boolean;
-    sizes: Record<string, IProductSizeStore>;
-    maxQuantityPerOrder: number;
-    shippingVariants: Record<string, IProductFulfillmentStore>;
-    onDemandVariants: Record<string, IProductFulfillmentStore>;
-}

package/dist/types/modules/ui-components/drawer/drawer.component.d.ts

@@ -6,6 +6,7 @@ export declare class DrawerComponent extends BaseComponent {
     private backdropElement;
     private contentContainer;
     private currentContentType;
+    private mode;
     private isTransitioning;
     private readonly boundHandleKeydown;
     constructor();

package/dist/types/modules/ui-components/engraving/engraving-form.component.d.ts

@@ -1,8 +1,5 @@
-import type { IProductListProduct } from 'core/store/interfaces/product-list.interface';
-import type { IFulfillment } from 'interfaces/api/product.interface';
 import { BaseComponent } from '@/core/base-component.service';
-import { type DisplayModeType, type NavigationSourceType } from '@/enums';
-import type { IProductListComponent } from '@/interfaces/configs';
+import { type DisplayModeType } from '@/enums';
 export interface IEngravingFormComponentParams {
     identifier: string;
     context: 'product' | 'cart' | 'product-list';
@@ -12,12 +9,6 @@ export interface IEngravingFormComponentParams {
     fee: number;
     location?: string;
     displayMode?: DisplayModeType;
-    navigationSource?: NavigationSourceType;
-    product?: IProductListProduct;
-    shippingFulfillment?: IFulfillment | null;
-    onDemandFulfillment?: IFulfillment | null;
-    showCollections?: boolean;
-    config?: IProductListComponent;
 }
 export declare class EngravingFormComponent extends BaseComponent<IEngravingFormComponentParams, null> {
     get hostClasses(): string[];

package/dist/types/modules/ui-components/engraving/engraving-view.component.d.ts

@@ -2,7 +2,10 @@ import { BaseComponent } from '@/core/base-component.service';
 import type { IProductComponent } from '@/interfaces/configs';
 export interface IEngravingViewComponentParams {
     identifier: string;
-    context: 'cart' | 'checkout';
+    context: 'cart' | 'checkout' | 'product-list';
+    productListMaxLines?: number;
+    productListMaxCharsPerLine?: number;
+    productListLocation?: string;
 }
 export declare class EngravingViewComponent extends BaseComponent<IEngravingViewComponentParams, IProductComponent> {
     get hostClasses(): string[];

package/dist/types/modules/ui-components/promo-code-ticker/promo-code-ticker.component.d.ts

@@ -1,7 +1,7 @@
 import { BaseComponent, type IOnStoreChanged } from '@/core/base-component.service';
 import type { IPromoTicker } from '@/interfaces/configs';
 export interface IPromoCodeTickerParams {
-    context: 'cart' | 'checkout';
+    context: 'cart';
     tickers: IPromoTicker[];
 }
 export declare class PromoCodeTickerComponent extends BaseComponent<IPromoCodeTickerParams, null> {

package/dist/types/modules/ui-components/ui.commands.d.ts

@@ -1,9 +1,11 @@
 import { BaseCommand } from '@/core/command/base-command.service';
-import type { IDrawerContentConfig, IModalContentConfig } from '@/core/store/interfaces/core.interface';
+import type { IDrawerContentConfig } from '@/core/store/interfaces/core.interface';
 export declare class UICommands extends BaseCommand {
     static getInstance(): UICommands;
-    openDrawer(contentType: IDrawerContentConfig['type'], data?: Record<string, any>): void;
+    openDrawer({ mode, contentType, data, }: {
+        mode?: 'drawer' | 'modal';
+        contentType: IDrawerContentConfig['type'];
+        data?: Record<string, any>;
+    }): void;
     closeDrawer(): void;
-    openModal(contentType: IModalContentConfig['type'], data?: Record<string, any>): void;
-    closeModal(): void;
 }

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

@@ -0,0 +1,6 @@
+export type { DebugMode, ElementsEnv } from '../enums/core.enum';
+export { DEBUG_MODE, ELEMENTS_ENV } from '../enums/core.enum';
+export type { IElementsCheckoutActions, IElementsCheckoutClient, } from '../interfaces/client.interface';
+export type { IInjectedComponent } from '../interfaces/component.interface';
+export type { ILiquidCommerceElementsCheckoutClientConfig } from '../interfaces/config.interface';
+export declare function ElementsCheckout(..._args: any[]): Promise<null>;

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

@@ -0,0 +1,10 @@
+export { SDKError, isSDKError } from '../core/sdk-error-handler';
+export type { CartEventLevel, CartEventType, CheckoutEventLevel, CheckoutEventType, ComponentType, DebugMode, DisplayModeType, ElementsEnv, FulfillmentType, NavigationSourceType, } from '../enums/core.enum';
+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 * 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>;
+export declare function ElementsBuilder(..._args: any[]): Promise<null>;

package/dist/types/utils/product-selection.d.ts

@@ -0,0 +1,16 @@
+import type { IProductFulfillmentStore, IProductSizeStore } from '@/core/store/interfaces/product.interface';
+import { type FulfillmentType } from '@/enums';
+export interface ISizeSelectionResult {
+    selectedFulfillmentType: FulfillmentType;
+    selectedFulfillment: IProductFulfillmentStore | null;
+    selectedFulfillmentId: string | null;
+    productHasAvailability: boolean;
+    fulfillmentHasAvailability: boolean;
+}
+export interface IFulfillmentTypeChangeResult {
+    selectedFulfillment: IProductFulfillmentStore | null;
+    selectedFulfillmentId: string | null;
+    fulfillmentHasAvailability: boolean;
+}
+export declare function calculateSizeSelection(productSize: IProductSizeStore, currentFulfillmentType: FulfillmentType): ISizeSelectionResult;
+export declare function calculateFulfillmentTypeChange(productSize: IProductSizeStore, newFulfillmentType: FulfillmentType): IFulfillmentTypeChangeResult | null;

package/dist/types/utils/product.d.ts

@@ -0,0 +1,10 @@
+import type { IProductStore } from '@/core/store/interfaces/product.interface';
+import type { IPLProductStore } from '@/core/store/interfaces/product-list.interface';
+import type { IProduct, IProductAvailabilityResponse } from '@/interfaces/api/product.interface';
+export interface IPrepareApiProductForStoreParams {
+    context: 'product-list' | 'product-page';
+    product: IProduct;
+    retailers: IProductAvailabilityResponse['retailers'];
+    enableShippingFulfillment: boolean;
+}
+export declare function prepareApiProductForStore({ context, product, retailers, enableShippingFulfillment, }: IPrepareApiProductForStoreParams): IProductStore | IPLProductStore;

package/docs/v1/README.md

@@ -125,13 +125,13 @@ await client.injectProductElement([
 ### Opening the Cart
 
 ```javascript
-window.elements.actions.cart.openCart();
+window.LiquidCommerce.elements.actions.cart.openCart();
 ```
 
 ### Adding to Cart Programmatically
 
 ```javascript
-await window.elements.actions.cart.addProduct([
+await window.LiquidCommerce.elements.actions.cart.addProduct([
   {
     identifier: '00619947000020',
     fulfillmentType: 'shipping',

package/docs/v1/api/actions/address-actions.md

@@ -21,7 +21,7 @@ setAddressByPlacesId(placesId: string): Promise<void>
 ### Example
 
 ```javascript
-await window.elements.actions.address.setAddressByPlacesId(
+await window.LiquidCommerce.elements.actions.address.setAddressByPlacesId(
   'ChIJOwg_06VPwokRYv534QaPC8g'
 );
 ```
@@ -65,7 +65,7 @@ interface IAddressCoordinates {
 ### Example
 
 ```javascript
-await window.elements.actions.address.setAddressManually(
+await window.LiquidCommerce.elements.actions.address.setAddressManually(
   {
     one: '123 Main Street',
     two: 'Apt 4',
@@ -110,7 +110,7 @@ clear(): Promise<void>
 ### Example
 
 ```javascript
-await window.elements.actions.address.clear();
+await window.LiquidCommerce.elements.actions.address.clear();
 ```
 
 ### Effects
@@ -156,7 +156,7 @@ Returns `null` if no address is set.
 ### Example
 
 ```javascript
-const address = window.elements.actions.address.getDetails();
+const address = window.LiquidCommerce.elements.actions.address.getDetails();
 
 if (address) {
   console.log('Current address:', address.formattedAddress);
@@ -171,7 +171,7 @@ if (address) {
 #### Check if Address is Set
 
 ```javascript
-if (!window.elements.actions.address.getDetails()) {
+if (!window.LiquidCommerce.elements.actions.address.getDetails()) {
   // Prompt user to set address
   showAddressPrompt();
 }
@@ -180,7 +180,7 @@ if (!window.elements.actions.address.getDetails()) {
 #### Display Current Address
 
 ```javascript
-const address = window.elements.actions.address.getDetails();
+const address = window.LiquidCommerce.elements.actions.address.getDetails();
 
 if (address) {
   document.getElementById('current-address').textContent = 
@@ -217,10 +217,10 @@ Google Places provides accurate geocoding:
 
 ```javascript
 // Good - accurate and validated
-await window.elements.actions.address.setAddressByPlacesId(placesId);
+await window.LiquidCommerce.elements.actions.address.setAddressByPlacesId(placesId);
 
 // Less ideal - requires manual geocoding
-await window.elements.actions.address.setAddressManually(address, coords);
+await window.LiquidCommerce.elements.actions.address.setAddressManually(address, coords);
 ```
 
 ### Validate Manual Addresses
@@ -244,7 +244,7 @@ async function setManualAddress(address, coords) {
     throw new Error('Invalid ZIP code');
   }
   
-  await window.elements.actions.address.setAddressManually(address, coords);
+  await window.LiquidCommerce.elements.actions.address.setAddressManually(address, coords);
 }
 ```
 
@@ -252,7 +252,7 @@ async function setManualAddress(address, coords) {
 
 ```javascript
 try {
-  await window.elements.actions.address.setAddressByPlacesId(placesId);
+  await window.LiquidCommerce.elements.actions.address.setAddressByPlacesId(placesId);
   showSuccess('Address saved!');
 } catch (error) {
   console.error('Failed to set address:', error);
@@ -266,7 +266,7 @@ Set address as soon as possible in user flow:
 
 ```javascript
 window.addEventListener('lce:actions.client_ready', () => {
-  if (!window.elements.actions.address.getDetails()) {
+  if (!window.LiquidCommerce.elements.actions.address.getDetails()) {
     // Prompt for address on first visit
     showAddressModal();
   }

package/docs/v1/api/actions/cart-actions.md

@@ -15,7 +15,7 @@ openCart(): void
 ### Example
 
 ```javascript
-window.elements.actions.cart.openCart();
+window.LiquidCommerce.elements.actions.cart.openCart();
 ```
 
 ---
@@ -33,7 +33,7 @@ closeCart(): void
 ### Example
 
 ```javascript
-window.elements.actions.cart.closeCart();
+window.LiquidCommerce.elements.actions.cart.closeCart();
 ```
 
 ---
@@ -53,7 +53,7 @@ toggleCart(): void
 ```javascript
 // Add to your cart button
 document.getElementById('cart-btn').addEventListener('click', () => {
-  window.elements.actions.cart.toggleCart();
+  window.LiquidCommerce.elements.actions.cart.toggleCart();
 });
 ```
 
@@ -88,7 +88,7 @@ interface IAddProductParams {
 
 ```javascript
 // Add single product
-await window.elements.actions.cart.addProduct([
+await window.LiquidCommerce.elements.actions.cart.addProduct([
   {
     identifier: '00619947000020',
     fulfillmentType: 'shipping',
@@ -97,7 +97,7 @@ await window.elements.actions.cart.addProduct([
 ], true);  // Open cart after adding
 
 // Add multiple products
-await window.elements.actions.cart.addProduct([
+await window.LiquidCommerce.elements.actions.cart.addProduct([
   {
     identifier: '00619947000020',
     fulfillmentType: 'shipping',
@@ -149,7 +149,7 @@ applyPromoCode(promoCode: string): Promise<void>
 
 ```javascript
 try {
-  await window.elements.actions.cart.applyPromoCode('SUMMER20');
+  await window.LiquidCommerce.elements.actions.cart.applyPromoCode('SUMMER20');
   console.log('Promo code applied successfully');
 } catch (error) {
   console.error('Invalid promo code:', error);
@@ -178,7 +178,7 @@ removePromoCode(): Promise<void>
 ### Example
 
 ```javascript
-await window.elements.actions.cart.removePromoCode();
+await window.LiquidCommerce.elements.actions.cart.removePromoCode();
 ```
 
 ---
@@ -196,7 +196,7 @@ resetCart(): Promise<void>
 ### Example
 
 ```javascript
-await window.elements.actions.cart.resetCart();
+await window.LiquidCommerce.elements.actions.cart.resetCart();
 console.log('Cart cleared');
 ```
 
@@ -238,7 +238,7 @@ interface IBaseCartEventData {
 ### Example
 
 ```javascript
-const cart = window.elements.actions.cart.getDetails();
+const cart = window.LiquidCommerce.elements.actions.cart.getDetails();
 
 console.log(`Cart ID: ${cart.cartId}`);
 console.log(`Items: ${cart.itemsCount}`);
@@ -256,7 +256,7 @@ if (cart.promoCode) {
 
 ```javascript
 function updateCartSummary() {
-  const cart = window.elements.actions.cart.getDetails();
+  const cart = window.LiquidCommerce.elements.actions.cart.getDetails();
   
   document.getElementById('cart-count').textContent = cart.itemsCount;
   document.getElementById('cart-total').textContent = `$${cart.total / 100}`;
@@ -270,21 +270,21 @@ window.addEventListener('lce:actions.cart_updated', updateCartSummary);
 
 ```javascript
 document.getElementById('checkout-btn').addEventListener('click', () => {
-  const cart = window.elements.actions.cart.getDetails();
+  const cart = window.LiquidCommerce.elements.actions.cart.getDetails();
   
   if (cart.itemsCount === 0) {
     alert('Your cart is empty');
     return;
   }
   
-  window.elements.actions.checkout.openCheckout();
+  window.LiquidCommerce.elements.actions.checkout.openCheckout();
 });
 ```
 
 #### Track Cart Value
 
 ```javascript
-const cart = window.elements.actions.cart.getDetails();
+const cart = window.LiquidCommerce.elements.actions.cart.getDetails();
 
 gtag('event', 'view_cart', {
   value: cart.total / 100,