### Example Bundle Link

Source: https://docs.subbly.dev/docs/installation/docs/guide

This HTML snippet demonstrates a link for a product bundle, using the URL structure `/checkout/buy/bundle/BUNDLE_ID`, which the Subbly widget captures.

```HTML
<a href="https://example.com/checkout/buy/bundle/BUNDLE_ID">
  Buy a bundle
</a>
```

--------------------------------

### Example: Sign in with password

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.auth.login` to authenticate a user with their email and password.

```JavaScript
await subbly.auth.login({
  email: '[email protected]',
  password: 'C5wrzJtK9HHg'
})
```

--------------------------------

### Get a List of Products with Subbly

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

This JavaScript example shows how to fetch a paginated list of products using `subbly.products.list`. It demonstrates how to specify page, items per page, and expand related data like variants and pricings.

```javascript
const { data, pagination } = await subbly.products.list({
  page: 1,
  perPage: 10,
  expand: ['variants.parent', 'pricings.parent']
})
```

--------------------------------

### Example Product Link with URL Structure

Source: https://docs.subbly.dev/docs/installation/docs/guide

This HTML snippet demonstrates a product link using the URL structure `/checkout/buy/PRODUCT_ID`, which SubblyCart.js can intercept to open product configuration.

```HTML
<a href="https://example.com/checkout/buy/PRODUCT_ID">
  Buy
</a>
```

--------------------------------

### Example: Register a new Subbly account

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.auth.register` to create a new account with email, first name, and last name.

```JavaScript
await subbly.auth.register({
  email: '[email protected]',
  firstName: 'John',
  lastName: 'Doe'
})
```

--------------------------------

### Example: Sign in with OTP

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.auth.otpLogin` to authenticate a user with their email and OTP.

```JavaScript
await subbly.auth.otpLogin({
  email: '[email protected]',
  token: '123456'
})
```

--------------------------------

### Example: Load a bundle

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.bundles.load` to fetch bundle information by ID, with optional expansion parameters.

```JavaScript
const bundle = await subbly.bundles.load(123, {
  expand: ['plans.variants.parent', 'plans.pricings.parent']
})
```

--------------------------------

### Subbly.js SDK Installation Methods

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Details the various ways to integrate the Subbly.js SDK into your application, including npm installation and CDN usage.

```APIDOC
Installation:
  - From npm: Install the SDK as a package dependency.
  - Using CDN: Include the SDK script directly via a Content Delivery Network.
```

--------------------------------

### Example: Get access token

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.auth.getAccessToken` to retrieve the current user's access token.

```JavaScript
const accessToken = subbly.auth.getAccessToken()
```

--------------------------------

### Example: Request OTP

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.auth.otp` to request an OTP for a given email.

```JavaScript
await subbly.auth.otp({
  email: '[email protected]'
})
```

--------------------------------

### Example Survey Flow Link

Source: https://docs.subbly.dev/docs/installation/docs/guide

This HTML snippet shows a link for a survey flow, using the URL structure `/checkout/buy/survey/SURVEY_ID`, which the Subbly widget captures.

```HTML
<a href="https://example.com/checkout/buy/survey/SURVEY_ID">
  Start a survey flow
</a>
```

--------------------------------

### Get a Bundle Quote with Subbly API (JavaScript)

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.bundles.quote` to obtain a summary quote for a bundle, specifying product IDs and quantities.

```javascript
const quote = await subbly.subscriptions.quote(123, {
  productId: 123,
  quantity: 1,
  items: [
    {
      productId: 234,
      quantity: 1
    }
  ]
})
```

--------------------------------

### JavaScript: Example of applyCoupon

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example usage of the applyCoupon method to add a coupon to the cart.

```JavaScript
subblyCart.applyCoupon('COUPON_CODE')
```

--------------------------------

### Example Product Link with Data Attribute

Source: https://docs.subbly.dev/docs/installation/docs/guide

This HTML snippet shows a product link using the `data-subbly-product` attribute to specify the product ID, which SubblyCart.js can intercept for product configuration.

```HTML
<a href="#" data-subbly-product="PRODUCT_ID">
  Buy
</a>
```

--------------------------------

### Example: Sign in with social login

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.auth.social` to authenticate a user via a social provider like Facebook using an access token.

```JavaScript
const { accessToken } = await subbly.auth.social({
  token: 'eyJhbGciOiJIb....dQssw5c',
  provider: 'facebook'
})
```

--------------------------------

### Get Setup Token for a Gateway using Subbly Wallet API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Obtains a payment setup token for a specified gateway. The token type varies by gateway (e.g., client token for Braintree, secret for Stripe, order ID for PayPal). This method returns a promise that resolves with a WalletSetupResponse.

```APIDOC
subbly.wallet.setup(payload): Promise<WalletSetupResponse>
  Parameters:
    payload: WalletSetupPayload
  Returns: Promise<WalletSetupResponse>
```

```JavaScript
const { token } = await subbly.wallet.setup({
  gatewayId: 111
})
```

--------------------------------

### Load a Parent Product with Variants and Pricings in Subbly

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

This JavaScript example demonstrates how to load detailed information for a parent product, including its variants and pricing options, using `subbly.products.load`.

```javascript
const product = await subbly.products.load(123, {
  expand: [
    'pricings.parent',
    'variants.parent'
  ]
})
```

--------------------------------

### JavaScript: Example of applyGiftCard

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example usage of the applyGiftCard method to add a gift card to the cart.

```JavaScript
subblyCart.applyGiftCard('ba445a44-e446-47da-b496-97d569f59ff5')
```

--------------------------------

### Basic SubblyCart.js Widget Installation

Source: https://docs.subbly.dev/docs/installation/reference/cart

This snippet demonstrates the standard method to include the SubblyCart.js widget on your webpage. It sets the 'apiKey' globally and loads the script asynchronously, recommended before the closing </body> tag.

```HTML
<script>
  window.subblyConfig = {
    apiKey: 'API_KEY'
  };
</script>
<script type="module" src="https://assets.subbly.co/cart/cart-widget.js"></script>
```

--------------------------------

### Install Subbly.js SDK via npm

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Installs the Subbly.js SDK package using npm, a package manager for JavaScript. This is the standard way to include the SDK in Node.js projects or modern JavaScript frameworks.

```Shell
npm install @subbly/sdk
```

--------------------------------

### Install SubblyCart.js with Script Tags

Source: https://docs.subbly.dev/docs/installation/docs/installation

This snippet demonstrates how to include SubblyCart.js on your webpage using script tags. It requires replacing 'API_KEY' with your actual Subbly API key to enable checkout functionality.

```html
<script>
  window.subblyConfig = {
    apiKey: 'API_KEY'
  }
</script>
<script type="module" src="https://assets.subbly.co/cart/cart-widget.js"></script>
```

--------------------------------

### Create New Customer Pick-up Information with Subbly

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

This JavaScript example demonstrates how to create a new pick-up information entry for a customer using `subbly.pickupInfo.store`. It requires authentication and takes a `PickupInfoStorePayload` as input.

```javascript
const pickupInfo = await subbly.pickupInfo.store({
  firstName: 'John',
  lastName: 'Doe'
  phone: '+447078582260'
})
```

--------------------------------

### SubblyCart Widget API: open() Method Usage

Source: https://docs.subbly.dev/docs/installation/reference/cart

Examples demonstrating how to open the SubblyCart widget, including opening the default summary view and explicitly opening the checkout view.

```JavaScript
subblyCart.open()
// To open the the checkout view
subblyCart.open('checkout')
```

--------------------------------

### APIDOC: WalletSetupIntentPayload Type Declaration

Source: https://docs.subbly.dev/docs/installation/reference/types

Defines the payload structure for initiating a wallet setup intent, requiring a gateway ID and a redirect URL.

```APIDOC
WalletSetupIntentPayload: Object
  gatewayId: ShopGateway["id"]
  redirectUrl: string
```

--------------------------------

### Fetch Customer Pick-up Information with Subbly

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

This JavaScript example shows how to retrieve a list of available customer pick-up information using `subbly.pickupInfo.list`. It requires authentication.

```javascript
const pickupInfos = await subbly.pickupInfo.list()
```

--------------------------------

### Example: Email availability check

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.auth.registered` to check if an email is already registered.

```JavaScript
const { registered } = await subbly.auth.registered({
  email: '[email protected]'
})
```

--------------------------------

### JavaScript: Example of setCurrency

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example usage of the setCurrency method to change the cart's currency to GBP.

```JavaScript
subblyCart.setCurrency('GBP')
```

--------------------------------

### Configure Subbly Cart Language via subblyConfig

Source: https://docs.subbly.dev/docs/installation/docs/guide

This snippet demonstrates how to set the default language for the Subbly cart widget by specifying the 'languageCode' in the 'window.subblyConfig' object. This configuration should be done before the widget initializes to ensure the language is applied from the start.

```javascript
<script>
  window.subblyConfig = {
    apiKey: 'API_KEY',
    languageCode: 'es'
  }
</script>
```

--------------------------------

### APIDOC: WalletSetupResponse Type Declaration

Source: https://docs.subbly.dev/docs/installation/reference/types

Defines the response structure for general wallet setup, providing an authentication token.

```APIDOC
WalletSetupResponse: Object
  token: string
```

--------------------------------

### JavaScript: Example of removeCoupon

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example usage of the removeCoupon method to clear an applied coupon.

```JavaScript
subblyCart.removeCoupon()
```

--------------------------------

### JavaScript: Example of removeGiftCard

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example usage of the removeGiftCard method to clear an applied gift card.

```text

```

--------------------------------

### APIDOC: WalletSetupIntentResponse Type Declaration

Source: https://docs.subbly.dev/docs/installation/reference/types

Defines the response structure for a wallet setup intent, including expiration, ID, redirect URL, and Subbly URL.

```APIDOC
WalletSetupIntentResponse: Object
  expiresAt: string
  id: string
  redirectUrl: string
  subblyUrl: string
```

--------------------------------

### CartSummaryItemSetupFee Object Definition

Source: https://docs.subbly.dev/docs/installation/reference/types

Extends CartSummaryItemBase with properties specific to setup fees, including the associated product ID.

```APIDOC
CartSummaryItemSetupFee: CartSummaryItemBase & {
  productId: ID
}
```

--------------------------------

### APIDOC: WalletSetupPayload Type Declaration

Source: https://docs.subbly.dev/docs/installation/reference/types

Defines the payload structure for general wallet setup, requiring a gateway ID.

```APIDOC
WalletSetupPayload: Object
  gatewayId: ShopGateway["id"]
```

--------------------------------

### JavaScript: Example of setLanguage

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example usage of the setLanguage method to change the widget's language to French.

```JavaScript
subblyCart.setLanguage('fr')
```

--------------------------------

### API: Get Subbly Products List

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Documents the `subbly.products.list` method used to get a list of products. It supports optional parameters for filtering and pagination, and headers for additional request options.

```APIDOC
subbly.products.list(params?, headers?): Promise<ProductsListResponse>
  Description: Use subbly.products.list to get a list of products.
  Parameters:
    params?: ProductsListParams
    headers?: ProductRequestHeaders
  Returns: Promise<ProductsListResponse> - This method returns an array ProductsListResponse.
```

--------------------------------

### Load Product or Product Variant Information

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

This section documents the `subbly.products.load` method for retrieving product information and provides an example of using `subbly.products.loadVariant` to specifically load product variant details. The `expand` option allows including related parent product data.

```APIDOC
Method: subbly.products.load
Signature: subbly.products.load(productId, params?, headers?): Promise<Product>
Description: Use subbly.products.loadVariant to load information of a product variant/pricing.
Parameters:
  productId: number
  params?: ProductsResourceParams (Reference: /reference/types/#productsResourceParams)
  headers?: ProductRequestHeaders (Reference: /reference/types/#productRequestHeaders)
Returns: Promise<Product> (Reference: /reference/types/#product)
```

```JavaScript
const product = await subbly.products.loadVariant(123, {
  expand: ['parent']
})
```

--------------------------------

### AuthResourceRegisterPayload Type Definition and Example

Source: https://docs.subbly.dev/docs/installation/reference/types

Defines the payload structure for user registration, including `email`, `firstName`, `lastName`, and an optional `password`. An example payload is provided.

```javascript
const payload = {
  email: '[email protected]',
  firstName: 'John',
  lastName: 'Doe'
}
```

```APIDOC
AuthResourceRegisterPayload: Object
  email: string
  firstName: string
  lastName: string
  password?: string
```

--------------------------------

### SubblyCart Widget API: toggle() Method Usage

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example demonstrating how to toggle the visibility of the SubblyCart widget.

```JavaScript
subblyCart.toggle()
```

--------------------------------

### Add Item to Cart with Subbly API (JavaScript)

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Example of using `subbly.cart.addItem` to add a new product to the cart, specifying product ID and quantity.

```javascript
const cart = await subbly.cart.addItem({
  productId: 111,
  quantity: 2
})
```

--------------------------------

### Add Products Programmatically with SubblyCart.js

Source: https://docs.subbly.dev/docs/installation/docs/guide

This JavaScript snippet demonstrates how to programmatically add products to the cart using `subblyCart.configureItem` or `subblyCart.addItem` methods, typically triggered by a button click event.

```JavaScript
<script>
  const myButton = document.querySelector('.my-custom-button')

  myButton.addEventListener('click', () => {
    subblyCart.configureItem({
      productId: 111,
      quantity: 1
    })
  })
  // or
  myButton.addEventListener('click', () => {
    subblyCart.addItem({
      productId: 111,
      quantity: 1
    })
  })
</script>
```

--------------------------------

### Subbly Widget Extended Settings Configuration

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example configuration for the Subbly widget, setting API key, language, and various cart display options like intercepting product links, specifying counter and toggle elements, and custom cart button image.

```JavaScript
window.subblyConfig = {
  apiKey: 'API_KEY',
  languageCode: 'es',
  settings: {
    interceptProductLinks: true,
    cartCounterEl: '#cartCounter',
    cartToggleEl: '#cartToggle',
    cartButton: true,
    cartButtonImage: 'https://example.com/cart-icon.png'
  }
}
```

--------------------------------

### CustomerAddress Object Definition and Example

Source: https://docs.subbly.dev/docs/installation/reference/types

Defines the structure of a customer's shipping address object, including an example JavaScript object and its type declaration with property names and types.

```javascript
const address = {
  addressOne: '123 Main St',
  addressTwo: null,
  city: 'New York',
  country: 'United States',
  countryCode: 'US',
  countryId: 230,
  firstName: 'John',
  id: 111,
  lastName: 'Doe',
  phone: '+15105829395',
  regionId: 2472,
  zip: '12992'
}
```

```APIDOC
CustomerAddress:
  addressOne: string
  addressTwo: string | null
  city: string
  country: string
  countryCode: string
  countryId: Country["id"]
  firstName: string
  id: ID
  lastName: string
  phone: string
  region: string
  regionId: CountryRegion["id"] | null
  zip: string
```

--------------------------------

### Configure Subbly to Intercept Product Links

Source: https://docs.subbly.dev/docs/installation/docs/guide

This JavaScript configuration snippet enables `interceptProductLinks` in `window.subblyConfig`, allowing the widget to automatically handle product links on the page for opening product configuration.

```JavaScript
<script>
  window.subblyConfig = {
    apiKey: 'API_KEY',
    settings: {
      interceptProductLinks: true
    }
  }
</script>
```

--------------------------------

### Get shipping methods for Subbly Cart

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Use `subbly.cart.getShippingMethods` to get a list of available shipping methods for the cart. This method returns a promise that resolves with an array of ShippingMethodDelivery.

```APIDOC
subbly.cart.getShippingMethods(params): Promise<ShippingMethodDelivery>
  Parameters:
    params?: CartShippingMethodsParams
  Returns:
    Promise<ShippingMethodDelivery>
```

```javascript
const cart = await subbly.cart.getShippingMethods({
  country: 2,
  zip: 'GL56 8EH'
})
```

--------------------------------

### AddressStorePayload Type Definition and Example

Source: https://docs.subbly.dev/docs/installation/reference/types

Defines the structure for storing a shipping address, including fields like `addressOne`, `city`, `countryId`, `firstName`, `lastName`, `phone`, `regionId`, and `zip`. It also provides an example JSON object for this payload.

```javascript
const address = {
  addressOne: '123 Main St',
  addressTwo: 'Apt 4B',
  city: 'New York',
  countryId: 230,
  firstName: 'John',
  lastName: 'Doe',
  phone: '+15105829395',
  regionId: 2472,
  zip: '12992'
}
```

```APIDOC
AddressStorePayload: Object
  addressOne: string
  addressTwo: string | null
  city: string
  countryId: ID
  firstName: string
  lastName: string
  phone?: string
  region?: string
  regionId?: ID
  zip: string
```

--------------------------------

### Get pick-up points for Subbly Cart

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Use `subbly.cart.getLocalPickups` to get a list of available pick-up points for the cart. This method returns a promise that resolves with an array of ShippingMethodPickup.

```APIDOC
subbly.cart.getLocalPickups(): Promise<ShippingMethodPickup>
  Returns:
    Promise<ShippingMethodPickup>
```

```javascript
const cart = await subbly.cart.getLocalPickups()
```

--------------------------------

### SubblyCart Widget API: close() Method Usage

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example demonstrating how to close the SubblyCart widget.

```JavaScript
subblyCart.close()
```

--------------------------------

### APIDOC: ProductSubscription Type Definition

Source: https://docs.subbly.dev/docs/installation/reference/types

Extends ProductBase with properties specific to subscription products, such as pre-order end date, pricings, and setup fee.

```APIDOC
ProductSubscription: ProductBase & { preOrderEndAt: string | null ; pricings: ProductPricing[] ; setupFee: number ; type: subscription }
```

--------------------------------

### API: Get Customer Profile

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Documents the `subbly.customers.me` method, which retrieves the current authenticated customer's profile.

```APIDOC
subbly.customers.me(): Promise<SubblyCustomer>
Returns: Promise<SubblyCustomer> - Resolves with SubblyCustomer
```

```JavaScript
const customer = await subbly.customers.me({
  marketingConsent: true,
  tosConsent: true
})
```

--------------------------------

### SubblyCart Widget API: updateCart() Method Usage

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example demonstrating how to update the cart with various details such as referral ID, currency, coupon code, gift card code, and gift information.

```JavaScript
subblyCart.updateCart({
  referralId: 555,
  currencyCode: 'EUR',
  couponCode: 'COUPON_CODE',
  giftCardCode: 'ba445a44-e446-47da-b496-97d569f59ff5',
  giftInfo: {
    startsAt: '2023-01-13
```

--------------------------------

### API: Fetch Subbly Pick-up Information List

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Documents the `subbly.pickupInfo.list` method used to get a list of available customer's pick-up infos. This method requires authentication and can be filtered by providing a `shippingMethodId` parameter.

```APIDOC
subbly.pickupInfo.list(params): Promise<CustomerPickupInfo>
  Description: Use subbly.pickupInfo.list to get a list of available customer's pick-up infos. Requires authentication. Filter pick-up infos by a country by providing shippingMethodId parameter.
  Parameters:
    params: PickupInfoFetchParams
  Returns: Promise<CustomerPickupInfo> - This method returns a promise that resolves with an array of CustomerPickupInfo
```

--------------------------------

### Get customer addresses using Subbly.js SDK

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Fetches a list of customer's addresses using the `subbly.addresses.list()` method. This operation requires the client to be authenticated.

```JavaScript
const addresses = await subbly.addresses.list()
```

--------------------------------

### Configure Subbly.js SDK with advanced options

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Demonstrates how to initialize the Subbly.js SDK with additional configuration options such as `cartId`, `loadCart`, and `accessToken`. This allows for more granular control over the SDK's behavior upon startup.

```JavaScript
Subbly.init({
  apiKey: 'API_KEY',
  cartId: 'aaea067c-6364-4157-82e9-71b6edfd84a0',
  loadCart: true,
  accessToken: 'eyJh...eyJ9'
})
```

--------------------------------

### Open Subbly Cart Gift Configuration View

Source: https://docs.subbly.dev/docs/installation/docs/guide

This JavaScript snippet shows how to programmatically open the gift configuration view in the Subbly cart using 'subblyCart.configureGift()'. The second argument 'true' makes it open immediately upon execution, while 'false' would defer opening until the customer interacts with the widget.

```javascript
<script>
  window.addEventListener('subbly-cart-initialized', () => {
    subblyCart.configureGift(null, true)
  })
</script>
```

--------------------------------

### Fetch a list of countries via Subbly API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Use `subbly.countries.list` to get a complete list of countries. This method returns an array of Country.

```APIDOC
subbly.countries.list: Promise<Country>
  Returns:
    Promise<Country>
```

```javascript
const countries = await subbly.countries.list()
```

--------------------------------

### Initialize Subbly.js SDK using CDN

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Includes the Subbly.js SDK via a CDN script tag directly in an HTML page and initializes it with an API key. This approach is suitable for simple HTML pages where a build step is not desired, making the SDK globally available via `window.Subbly`.

```HTML
<script src="https://cdn.jsdelivr.net/npm/@subbly/sdk"></script>
<script>
  window.Subbly.init({
    apiKey: 'API_KEY'
  }).then((subbly) => {
    // access Subbly SDK methods
  })
</script>
```

--------------------------------

### Apply Coupon to Subbly Cart

Source: https://docs.subbly.dev/docs/installation/docs/guide

This JavaScript snippet shows how to apply a coupon code to the Subbly cart using the 'subblyCart.applyCoupon()' method. The coupon code is passed as a string argument, allowing for programmatic application of discounts.

```javascript
<script>
  window.addEventListener('subbly-cart-initialized', () => {
    subblyCart.applyCoupon('COUPON_CODE')
  })
</script>
```

--------------------------------

### Subbly.js SDK Configuration

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Outlines the necessary steps and parameters for configuring the Subbly.js SDK to connect with your Subbly store.

```APIDOC
Configuration:
  - Initialize the SDK with your Subbly store credentials and settings.
```

--------------------------------

### SubblyCart Widget API Overview

Source: https://docs.subbly.dev/docs/installation/reference/cart

Provides a set of methods and events for the initialized SubblyCart widget.

```APIDOC
Widget API:
  Initialized cart widget provides a set of methods and events.
```

--------------------------------

### Get Customer Payment Methods using Subbly Wallet API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Retrieves a customer's available payment methods for a specified currency. This operation requires authentication. This method returns a promise that resolves with an array of PaymentMethod objects.

```APIDOC
subbly.wallet.list(currencyCode): Promise<PaymentMethod>
  Parameters:
    currencyCode: string
  Returns: Promise<PaymentMethod>
```

```JavaScript
const paymentMethods = await subbly.wallet.list('USD')
```

--------------------------------

### JavaScript: Example of removeItem

Source: https://docs.subbly.dev/docs/installation/reference/cart

Example usage of the removeItem method to remove a cart item by its ID.

```JavaScript
subblyCart.removeItem('53c511f3-14bc-42b7-b548-07e697f3db19')
```

--------------------------------

### Create a New Cart with Subbly API (JavaScript)

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Illustrates how to use `subbly.cart.create` to initialize a new shopping cart, optionally setting its currency code.

```javascript
const cart = await subbly.cart.create({
  currencyCode: 'EUR'
})
```

--------------------------------

### API Reference: Subbly.init Configuration Options

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Defines the configuration parameters for initializing the Subbly.js SDK. These options control aspects like API key, manual cart ID provision, cart loading behavior, and customer authentication via an access token.

```APIDOC
apiKey: REQUIRED string
  The Subbly Storefront API key is required. To obtain your API key, visit Shop Settings in Subbly Admin.
cartId: optional string
  Manually provide a Cart ID to initialize the SDK with. By the default Subbly.js manages the cart ID in secure browser cookies. During initialization the SDK will check for `subbly_cart_id` cookie if `cartId` is not provided.
loadCart: optional string
  Optional `loadCart` allows to load the cart during initialization, or create a new one and save it's ID in the browser cookies.
accessToken: optional string
  Optional `accessToken` allows to authenticate the customer during initialization. The token is saved in the browser cookies and used for all subsequent requests.
```

--------------------------------

### Subbly.js SDK Product Catalog API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Provides methods for accessing product information, including listing products and loading details for parent and individual products.

```APIDOC
Products Module:
  - getProductsList(filters: object): Promise<Product[]>
    Description: Retrieves a list of products, optionally filtered.
  - loadParentProduct(productId: string): Promise<Product>
    Description: Loads details for a parent product.
  - loadProduct(productId: string): Promise<Product>
    Description: Loads details for a specific product variant or simple product.
```

--------------------------------

### Confirm Subbly Payment Intent Verification with Stripe

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

This JavaScript example demonstrates how to handle a 'payment_requires_action' error from `subbly.checkout.purchase`. It retrieves the payment intent token, confirms the card payment with Stripe, then confirms the payment intent with Subbly, and finally retries the purchase.

```javascript
// in subbly.checkout.purchase error handler
const { token } = await subbly.paymentIntents.getPaymentIntent(paymentIntentId)
const { paymentIntent } = await stripe.confirmCardPayment(token)
await subbly.paymentIntents.confirm(paymentIntentId, paymentIntent.id)
await subbly.checkout.purchase(paymentIntentId)
```

--------------------------------

### Listen for SubblyCart Widget Initialization Event

Source: https://docs.subbly.dev/docs/installation/reference/cart

Since SubblyCart loads asynchronously, this JavaScript snippet shows how to listen for the 'subbly-cart-initialized' global event. This event signals that the widget has fully loaded and 'window.subblyCart' is ready for use.

```JavaScript
window.addEventListener('subbly-cart-initialized', () => {
  // window.subblyCart is now available
})
```

--------------------------------

### Subbly Cart API: create Method Reference

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

API documentation for the `subbly.cart.create` method, detailing parameters for creating a new cart and its return type.

```APIDOC
subbly.cart.create(payload?, params?): Promise<Cart>
  payload?: CartUpdatePayload
  params?: CartResourceParams
Returns: Promise<Cart>
```

--------------------------------

### Load Shop Information

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

This section documents the `subbly.shop.load` method for retrieving general shop information.

```APIDOC
Method: subbly.shop.load
Signature: subbly.shop.load(): Promise<Shop>
Description: Use subbly.shop.load to load the shop information.
Parameters: None
Returns: Promise<Shop> (Reference: /reference/types/#subblyshop)
```

```JavaScript
const shop = await subbly.shop.load()
```

--------------------------------

### Subbly Bundles API: loadItems Method Reference

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

API documentation for the `subbly.bundles.loadItems` method, detailing its parameters and return type for loading items associated with a bundle.

```APIDOC
subbly.bundles.loadItems(bundleId, params?, headers?): Promise<BundleItemsResponse>
  bundleId: number
  params?: BundleItemsParams
  headers?: BundleRequestHeaders
Returns: Promise<BundleItemsResponse>
```

--------------------------------

### Get available gifting dates for Subbly Cart

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Use `subbly.cart.getGiftingDates` to get available date for configuring the cart as a gift. This method returns a promise that resolves with a CartResourceGiftingDatesResponse object.

```APIDOC
subbly.cart.getGiftingDates(): Promise<CartResourceGiftingDatesResponse>
  Returns:
    Promise<CartResourceGiftingDatesResponse>
```

```javascript
const cart = await subbly.cart.getGiftingDates()
```

--------------------------------

### Load Bundle Items with Subbly API (JavaScript)

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Demonstrates how to use `subbly.bundles.loadItems` to retrieve items for a specific bundle, including pagination and expansion options.

```javascript
const { data, pagination } = await subbly.bundles.loadItems(123, {
  page: 1,
  perPage: 10,
  expand: ['product.parent']
})
```

--------------------------------

### Subbly.js SDK Bundle Management API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Enables interaction with product bundles, including loading bundle details, items, and obtaining quotes.

```APIDOC
Bundles Module:
  - loadBundle(bundleId: string): Promise<Bundle>
    Description: Loads details for a specific product bundle.
  - loadBundleItems(bundleId: string): Promise<BundleItem[]>
    Description: Retrieves items associated with a specific bundle.
  - getBundleQuote(bundleData: object): Promise<Quote>
    Description: Obtains a quote for a given bundle configuration.
```

--------------------------------

### Subbly.js SDK Shop Information API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Enables retrieval of general shop information and settings.

```APIDOC
Shop Module:
  - loadShop(): Promise<ShopInfo>
    Description: Loads general information and settings for the shop.
```

--------------------------------

### Get locally stored access token

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Use `subbly.auth.getAccessToken` to retrieve the locally stored access token of the current authenticated user.

```APIDOC
Method: subbly.auth.getAccessToken(): string | undefined
Parameters:
  (None)
Returns: string | undefined
```

--------------------------------

### Subbly.js SDK Authentication API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Offers a suite of methods for user authentication, including account creation, various sign-in options (password, OTP, social), and token management.

```APIDOC
Auth Module:
  - checkAuthentication(): Promise<boolean>
    Description: Checks the current authentication status of the user.
  - createAccount(userData: object): Promise<User>
    Description: Creates a new user account.
  - signInWithPassword(credentials: object): Promise<AuthToken>
    Description: Authenticates a user using email and password.
  - requestOTP(email: string): Promise<void>
    Description: Requests a One-Time Password for a given email.
  - signInWithOTP(otpData: object): Promise<AuthToken>
    Description: Authenticates a user using an OTP.
  - signInWithSocialLogin(provider: string, token: string): Promise<AuthToken>
    Description: Authenticates a user via a social login provider.
  - emailAvailabilityCheck(email: string): Promise<boolean>
    Description: Checks if an email address is available for registration.
  - getAccessToken(): Promise<string>
    Description: Retrieves the current access token.
```

--------------------------------

### CartGiftInfo Type Definition

Source: https://docs.subbly.dev/docs/installation/reference/types

Information related to a cart being a gift, including message, number of orders, recipient email, and start date.

```APIDOC
CartGiftInfo: Object
  message: string | null
  numberOfOrders: number | null
  recipientEmail?: string | null
  startsAt: string | null
```

--------------------------------

### API: Create Subbly Pick-up Information

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Documents the `subbly.pickupInfo.store` method used to create a new pick-up info for the customer. This method requires authentication.

```APIDOC
subbly.pickupInfo.store(payload): Promise<CustomerPickupInfo>
  Description: Use subbly.pickupInfo.store to create a new pick-up info for the customer. Requires authentication.
  Parameters:
    payload: PickupInfoStorePayload
  Returns: Promise<CustomerPickupInfo> - This method returns a promise that resolves with CustomerPickupInfo
```

--------------------------------

### Register a new Subbly account

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Use `subbly.auth.register` to create a new customer account. If a password is not provided, a generated password will be sent to the provided email. Successful registration automatically authenticates the customer.

```APIDOC
Method: subbly.auth.register(payload): Promise<AuthResourceLoginResponse>
Parameters:
  payload: AuthResourceRegisterPayload
Returns: Promise<AuthResourceLoginResponse> - This method returns a promise that resolves with AuthResourceLoginResponse
```

--------------------------------

### API: Load a Parent Product in Subbly

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Documents the `subbly.products.load` method used to load detailed information of a product that has variants or pricing options. It requires a `productId` and supports optional parameters for expanding related data and headers.

```APIDOC
subbly.products.load(productId, params?, headers?): Promise<ParentProduct>
  Description: Use subbly.products.load to load information of a product that has variants or pricing options.
  Parameters:
    productId: number
    params?: ProductsResourceParams
    headers?: ProductRequestHeaders
  Returns: Promise<ParentProduct> - This method returns a promise that resolves with ParentProduct.
```

--------------------------------

### Initialize Subbly.js SDK with ES6 Modules

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Imports the Subbly.js SDK using ES6 modules and initializes it with an API key. This method is recommended for use with modern JavaScript frameworks like React.js and Vue.js, providing access to SDK methods upon successful initialization.

```JavaScript
import Subbly from '@subbly/sdk'

Subbly.init({
  apiKey: 'API_KEY'
}).then((subbly) => {
  // access Subbly SDK methods
})
```

--------------------------------

### Subbly Cart API: attachCustomer Method Reference

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

API documentation for the `subbly.cart.attachCustomer` method, including its parameters and return type for assigning a cart to an authenticated customer.

```APIDOC
subbly.cart.attachCustomer(params?): Promise<Cart>
  params?: CartResourceParams
Returns: Promise<Cart>
```

--------------------------------

### Subbly.js SDK Funnel Management API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Manages pre-purchase, mid-purchase, and post-purchase offers, allowing for fetching, accepting, and rejecting offers, and refreshing progress.

```APIDOC
Funnels Module:
  - fetchPrePurchaseOffer(offerId: string): Promise<Offer>
    Description: Fetches details of a pre-purchase offer.
  - acceptPrePurchaseOffer(offerId: string): Promise<OfferResult>
    Description: Accepts a pre-purchase offer.
  - rejectPrePurchaseOffer(offerId: string): Promise<void>
    Description: Rejects a pre-purchase offer.
  - refreshPrePurchaseOfferProgress(offerId: string): Promise<OfferProgress>
    Description: Refreshes the progress status of a pre-purchase offer.
  - fetchMidPurchaseOffer(offerId: string): Promise<Offer>
    Description: Fetches details of a mid-purchase offer.
  - acceptMidPurchaseOffer(offerId: string): Promise<OfferResult>
    Description: Accepts a mid-purchase offer.
  - rejectMidPurchaseOffer(offerId: string): Promise<void>
    Description: Rejects a mid-purchase offer.
  - fetchPostPurchaseOffer(offerId: string): Promise<Offer>
    Description: Fetches details of a post-purchase offer.
  - acceptPostPurchaseOffer(offerId: string): Promise<OfferResult>
    Description: Accepts a post-purchase offer.
  - rejectPostPurchaseOffer(offerId: string): Promise<void>
    Description: Rejects a post-purchase offer.
```

--------------------------------

### HTML Button for Subbly Cart Toggle

Source: https://docs.subbly.dev/docs/installation/docs/guide

This HTML snippet defines a button element with the class `cart-button`, which can be used to toggle the visibility of the Subbly cart widget when configured with `cartToggleEl`.

```HTML
<button class="cart-button">
  Cart
</button>
```

--------------------------------

### API: Accept Pre-Purchase Funnel Offer

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Documents the `subbly.funnels.prePurchaseAccept` method, used to accept a pre-purchase offer for a given cart and funnel step.

```APIDOC
subbly.funnels.prePurchaseAccept(cartId, funnelStepId, payload, params?): Promise<SubblyCart>
Parameters:
  cartId: string
  funnelStepId: number
  payload: FunnelAcceptPayload
  params?: CartResourceParams
Returns: Promise<SubblyCart> - Resolves with SubblyCart
```

```JavaScript
const cartId = subbly.cart.id
const { step } = await subbly.funnels.prePurchaseFetch(cartId)
await subbly.funnels.prePurchaseAccept(cartId, step.id, {
  offers: [
    {
      productId: 111
    }
  ]
})
```

--------------------------------

### Subbly Bundles API: quote Method Reference

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

API documentation for the `subbly.bundles.quote` method, outlining its parameters and return type for generating a bundle quote.

```APIDOC
subbly.bundles.quote(bundleId, payload, params?, headers?): Promise<BundleQuote>
  bundleId: number
  payload: BundleQuotePayload
  params?: BundleQuoteParams
  headers?: BundleRequestHeaders
Returns: Promise<BundleQuote>
```

--------------------------------

### CartSummaryItem Union Type Definition

Source: https://docs.subbly.dev/docs/installation/reference/types

Represents a union of different types of items that can appear in a cart summary, including one-time, subscription, setup fee, and survey items.

```APIDOC
CartSummaryItem: CartSummaryItemOneTime | CartSummaryItemSubscription | CartSummaryItemSetupFee | CartSummaryItemSurvey
```

--------------------------------

### Subbly.js SDK Pick-up Info API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Manages pick-up information, allowing for fetching existing details and creating new pick-up points.

```APIDOC
Pick-up Info Module:
  - fetchPickUpInfos(): Promise<PickUpInfo[]>
    Description: Fetches a list of available pick-up information.
  - createPickUpInfo(pickUpData: object): Promise<PickUpInfo>
    Description: Creates new pick-up information.
```

--------------------------------

### Enable Subbly Built-in Floating Cart Button

Source: https://docs.subbly.dev/docs/installation/docs/guide

This JavaScript configuration snippet enables the built-in floating cart button provided by Subbly by setting the `cartButton` setting parameter to `true`.

```JavaScript
<script>
  window.subblyConfig = {
    apiKey: 'API_KEY',
    settings: {
      cartButton: true
    }
  }
</script>
```

--------------------------------

### Subbly Cart API: load Method Reference

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

API documentation for the `subbly.cart.load` method, specifying parameters for loading a cart by ID and its return type.

```APIDOC
subbly.cart.load(cartId?, params?): Promise<Cart>
  cartId?: string - not required if the cart is already loaded
  params?: CartResourceParams
Returns: Promise<Cart>
```

--------------------------------

### Subbly.js SDK Lead Management API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Provides functionality for managing leads, specifically for subscribing new leads.

```APIDOC
Lead Module:
  - subscribeLead(leadData: object): Promise<Lead>
    Description: Subscribes a new lead with provided information.
```

--------------------------------

### Configure Subbly Cart Toggle Element

Source: https://docs.subbly.dev/docs/installation/docs/guide

This JavaScript configuration snippet sets the `cartToggleEl` property in `window.subblyConfig` to a CSS selector, enabling the specified button to control the cart widget's visibility.

```JavaScript
<script>
  window.subblyConfig = {
    apiKey: 'API_KEY',
    settings: {
      cartToggleEl: '.cart-button'
    }
  }
</script>
```

--------------------------------

### Load Subscription Information

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

This section documents the `subbly.subscriptions.load` method for retrieving detailed information about a specific subscription. The `expand` option allows including related product parent data.

```APIDOC
Method: subbly.subscriptions.load
Signature: subbly.subscriptions.load(subscriptionId, params?): Promise<Subscription>
Description: Use subbly.subscriptions.load to load subscription information.
Parameters:
  subscriptionId: number
  params?: SubscriptionsResourceParams (Reference: /reference/types/#subscriptionsresourceparams)
Returns: Promise<Subscription> (Reference: /reference/types/#subscription)
```

```JavaScript
const subscription = await subbly.subscriptions.load(123, {
  expand: ['product.parent']
})
```

--------------------------------

### Load bundle information

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Use `subbly.bundles.load` to retrieve detailed information about a specific bundle.

```APIDOC
Method: subbly.subbly.bundles.load(bundleId): Promise<Bundle>
Parameters:
  bundleId: number
  params?: BundleResourceParams
  headers?: BundleRequestHeaders
Returns: Promise<Bundle>
```

--------------------------------

### Set Subbly Cart Currency with setCurrency Method

Source: https://docs.subbly.dev/docs/installation/docs/guide

This JavaScript snippet demonstrates how to change the currency of the Subbly cart using the 'subblyCart.setCurrency()' method. This setting persists across page reloads once set, ensuring a consistent currency experience for the user.

```javascript
<script>
  window.addEventListener('subbly-cart-initialized', () => {
    subblyCart.setCurrency('EUR')
  })
</script>
```

--------------------------------

### Subbly.js SDK Subscription Management API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Manages customer subscriptions, allowing for loading details of existing subscriptions.

```APIDOC
Subscriptions Module:
  - loadSubscription(subscriptionId: string): Promise<Subscription>
    Description: Loads details for a specific customer subscription.
```

--------------------------------

### Apply Gift Card to Subbly Cart

Source: https://docs.subbly.dev/docs/installation/docs/guide

This JavaScript snippet demonstrates how to apply a gift card code to the Subbly cart using the 'subblyCart.applyGiftCard()' method. The gift card code is passed as a string argument, enabling the redemption of gift cards programmatically.

```javascript
<script>
  window.addEventListener('subbly-cart-initialized', () => {
    subblyCart.applyGiftCard('GIFT_CARD_CODE')
  })
</script>
```

--------------------------------

### Dynamically Set Subbly Cart Language with setLanguage Method

Source: https://docs.subbly.dev/docs/installation/docs/guide

This JavaScript snippet shows how to dynamically change the Subbly cart's language after it has been initialized, using the 'subblyCart.setLanguage()' method. This is useful for user-driven language changes or updates based on application logic.

```javascript
<script>
  window.addEventListener('subbly-cart-initialized', () => {
    subblyCart.setLanguage('es')
  })
</script>
```

--------------------------------

### Authenticate with email and password

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Use `subbly.auth.login` to authenticate a customer using their email and password.

```APIDOC
Method: subbly.auth.login(payload): Promise<AuthResourceLoginResponse>
Parameters:
  payload: AuthResourceLoginPayload
Returns: Promise<AuthResourceLoginResponse> - This method returns a promise that resolves with AuthResourceLoginResponse
```

--------------------------------

### Attach Customer to Cart with Subbly API (JavaScript)

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Shows how to use `subbly.cart.attachCustomer` to link an authenticated customer to the current cart.

```javascript
const cart = await subbly.cart.attachCustomer()
```

--------------------------------

### SubblyCart Widget API: open() Method Definition

Source: https://docs.subbly.dev/docs/installation/reference/cart

Documents the `open()` method, which opens the SubblyCart widget. It can optionally take a 'view' argument to specify whether to open the 'summary' or 'checkout' view.

```APIDOC
open()
  description: This method opens SubblyCart widget
  parameters:
    view: optional, string, "summary" | "checkout"
      description: By default the 'open' method opens the cart summary. You can customize the behavior by passing the view as an argument.
```

--------------------------------

### Set HTML Page Language for Subbly Cart Detection

Source: https://docs.subbly.dev/docs/installation/docs/guide

The Subbly cart widget can automatically detect the language from the 'lang' attribute on the '<html>' tag of your page. This is a standard HTML way to declare the page's primary language, allowing the widget to adapt accordingly.

```html
<html lang="es">
```

--------------------------------

### Get Payment Intent Details with Subbly Payment Intents API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Retrieves details for a specific payment intent, including a token necessary for performing 3DS verification using Stripe's `confirmCardPayment` method. This is crucial for handling payment actions required by strong customer authentication.

```APIDOC
subbly.paymentIntents.getPaymentIntent(paymentIntentId): Promise<PaymentIntentResponse>
  paymentIntentId: string - The ID of the payment intent.
Returns: Promise<PaymentIntentResponse> - A promise that resolves with the payment intent details.
```

```javascript
try {
  await subbly.checkout.purchase(cartId)
} catch (err) {
  if (err.code === 'payment_requires_action') {
    const { token } = await subbly.paymentIntents.getPaymentIntent(err.paymentIntentId)
    // perform Stripe 3DS verification and repeat the purchase
  }
}
```

--------------------------------

### Subbly.js SDK Stock Availability API

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Provides functionality to subscribe to stock availability updates for products.

```APIDOC
Stock Module:
  - subscribeToStockAvailability(productId: string, callback: function): Promise<Subscription>
    Description: Subscribes to real-time updates on stock availability for a given product.
```

--------------------------------

### Create a new customer address using Subbly.js SDK

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Creates a new address for the customer using the `subbly.addresses.store()` method, which requires a `payload` object containing the address details.

```JavaScript
const address = await subbly.addresses.store(payload)
```

--------------------------------

### Subbly Cart API: addItem Method Reference

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

API documentation for the `subbly.cart.addItem` method, detailing its parameters for adding a new item to the cart.

```APIDOC
subbly.cart.addItem(payload, params?): Promise<Cart>
  payload: CartItemAddPayload
  params?: CartResourceParams
```

--------------------------------

### API Reference: subbly.addresses.store()

Source: https://docs.subbly.dev/docs/installation/reference/subbly-sdk

Creates a new address for the customer using the `subbly.addresses.store()` method. This API call requires an `AddressStorePayload` and returns a promise that resolves with the newly created `CustomerAddress` object.

```APIDOC
subbly.addresses.store(): Promise<CustomerAddress>
  Parameters:
    payload: AddressStorePayload
  Returns:
    Promise<CustomerAddress>
      This method returns a promise that resolves with CustomerAddress.
```