JS Modules

Self-contained feature scripts activated via the data-module attribute or imported directly.

Self-contained feature scripts activated via the data-module attribute or imported directly.

accept_terms

Requires the customer to check a terms-and-conditions checkbox before the cart submit button is enabled.

add_to_cart_button

Manages the dynamic add-to-cart button state, including quantity increase/decrease controls, stock limit enforcement, volume discount notices, and quote flow support.

add_to_cart_loader

Scans the page for product forms marked with data-add-to-cart and initialises the appropriate add-to-cart component (button, dynamic variant selector, or options panel) based on each form’s data attributes.

add_to_cart_with_options

Shows a slide-out drawer or inline panel for products that require variant selection before adding to cart (e.g. products with size or color options). Loads the product form dynamically and handles variant selection and quantity.

animate_number

Smoothly animates a numeric counter from its current value to a new target value with an easing effect. This module is called programmatically via Bolder.call rather than configured with options.

cart_modal

Displays a cart preview modal or slide-out panel when a product is added to the cart. Renders the live cart contents including line items, totals, and a checkout link.

cart_quote

Presents a contact form modal so a customer can request a formal quote for the current cart contents instead of placing a direct order.

cart_rules

Exposes shop-configured order requirements to other modules that need to look one up directly — currently just AddToCartButton, which caps a product’s quantity stepper against a matching max_units_per_product requirement before it’s ever added to the cart. Cart-page validation (disabling checkout, showing which requirements aren’t met) is no longer done here: it’s now declarative, computed by cart-decorator.js/cart-rules.js (the shared core module) inside cart-table-v3’s beforeUpdate() and dynamic_cart_table.js’s renderCart(), and rendered directly by the cart-table templates — see cart_action_buttons in cart-table-v3/template.qiq and cart-table/template.qiq.

cart_slideout

cart_tracking

Sends cart event data (add, remove, checkout) to the Bolder tracking endpoint for analytics and remarketing purposes. No user-facing options required.

cart_units

Updates item quantities in the cart in real time via AJAX without a page reload. Attaches increment/decrement controls to quantity inputs and syncs with the cart API. Emits cart update events that other modules (CartModal, CartBadge) can listen to.

dynamic_cart_buttons

Upgrades static add-to-cart forms to dynamic AJAX buttons that add items without a page reload, updating button state to reflect in-cart status.

dynamic_cart_table

Renders and keeps the cart table in sync with live cart state. Handles quantity changes, item removal, promo codes, shipping estimates, and related product suggestions.

dynamic_prices

Updates displayed prices, comparison prices, and stock status in real time when variant or quantity selections change. Also handles volume discount tier displays.

dynamic_quantity_buttons

Adds increase/decrease quantity controls to in-cart item rows, updating totals live via the Cart API without a page reload.

dynamic_variants

Updates price, availability status, and images in real time when a customer selects a product variant (size, color, etc.). Reads variant data from the product JSON endpoint and applies changes to the surrounding product form without a page reload.

favorites

Lets customers save products to a favourites list, storing them locally or server-side when logged in, and toggles heart/star icons on product cards accordingly. When a logged-in session starts, locally-stored favourites are synced to the server automatically.

image_gallery

Initialises a touch-friendly image slideshow (powered by Siema) for product image lists. Supports auto-play, previous/next controls, optional dot navigation, and add-to-cart integration.

image_zoom

Adds a CSS zoom effect to a product image on hover or touch, loading a higher-resolution version. An optional magnifier mode (WebGL) can be enabled via the mode option.

notify_restocked

Shows a modal form where customers can subscribe to receive an email notification when an out-of-stock product is restocked. Optionally fetches and displays the product’s variant list in the form.

product_comparison_picker

Lets customers select 2–4 products to compare side by side, rendering a checkbox on each product card and navigating to the comparison page once enough products are chosen. Products of different types cannot be mixed in the same comparison.

product_filters

Handles faceted product filtering: listens for changes on filter form inputs and selects, then submits the form via AJAX and replaces the product list without a full page reload, optionally updating the browser URL.

product_images

Manages the main product image viewer: clicking a thumbnail swaps the main image with a fade/spinner transition, and optionally activates zoom on the displayed image.

product_modal

Opens a product detail page inside a modal overlay when a product link is clicked, keeping the customer on the listing page and setting a URL hash for shareability.

product_promotions

Fetches and displays active promotion details (discount conditions, savings amount, and related product groups) for the products currently in view, updating dynamically as the cart changes.

products_lists_modal

Opens a modal listing products that qualify for a volume discount or matching bundle, letting customers browse and add items directly from the overlay.

variant_images

Switches the displayed product images when the customer selects a different variant (size, colour, etc.), highlighting images tagged with the chosen variant’s ID. Also triggers a click on the matching thumbnail so the main image viewer updates when ProductImages is active.

address_autocomplete

Enhances an address text input with Google Places-powered autocomplete suggestions, auto-filling region and locality fields on selection.

address_fields

Populates region and locality <select> fields from the delivery API based on the selected country code.

auth_delivery

Combines customer authentication and delivery address selection into a single unified flow component, mounting automatically into a managed container.

choose_branch_modal

Shows a modal listing available store locations so the customer can select a branch for pickup or delivery.

country_code_inputs

delivery_setup

Opens a modal that guides the customer through selecting their delivery method (shipping or pickup) and address before adding items to the cart.

rut_formatter

Formats and validates Chilean RUT (tax ID) inputs in real time as the customer types, automatically applying dots and a dash in the correct positions.

shipping_costs

Opens the shipping calculator component in a modal so the customer can estimate shipping costs before checkout.

live_search

Live product search with autocomplete and instant results. Displays matching products, collections, and tags as the user types. Can show product images, prices, SKUs, and inline add-to-cart buttons.

beta_mode

Manages beta user mode in the storefront. - Injects a dismissible “Beta” ribbon badge in the top-left corner when beta mode is active. - Wires data-toggle-beta elements for toggling beta mode on/off via AJAX. - Shows toast notifications confirming the change.

bounce

Detects exit-intent behaviour (mouse leaving the viewport towards the top) and invokes a callback, useful for triggering a last-chance offer or modal.

countdown_timer

Displays a live countdown to a target date/time, updating days, hours, minutes, and seconds every second. Optionally shows a “finished” message when the countdown reaches zero.

link_preview

Shows a floating product-card preview when the customer hovers over a product link, fetching and rendering the product component inline.

lottie_animations

Loads and plays Lottie JSON animations on page elements, supporting event-triggered playback (hover, click, scroll).

map

Map integration — embed Leaflet or Google Maps for address input and delivery zone display. Access via: Bolder.call(‘Map’, ‘init’, opts, callback)

modal

Modal dialogs — create and manage overlay popups. Access via: Bolder.call(‘Modal’, ‘methodName’, args, callback)

notice

Top-of-page notification bar — display and listen for page-level notices. Access via: Bolder.call(‘Notice’, ‘methodName’, args, callback)

page_modal

Intercepts clicks on internal page links (collections, pages, tags) and loads the target page inside a modal overlay instead of navigating away.

promo_notice

Displays an inline promotion notice (applied discounts and free shipping status) in a designated banner element whenever the cart is updated.

promo_toasts

Shows toast notifications when promotions are applied to or removed from the cart, displaying the discount name and amount saved.

range_slider

Renders a styled price-range slider input for filter forms.

section_menus

Auto-generates a sticky or inline navigation menu from page <section> elements, inserting anchor links into .bootic-section-menu placeholders.

share_button

Activates the browser’s native Web Share API on a designated share button, falling back gracefully if the API is unavailable.

spin_wheel

Renders a spin-the-wheel prize game with configurable prize tiers, probabilities, and coupon code rewards.

ticker

Cycles through a list of text messages in a container, fading each in and out on a configurable interval.

toasts

Toast notifications — brief, auto-dismissing alerts in a corner of the page. Access via: Bolder.call(‘Toasts’, ‘show’, opts)

view_modal

Fetches an arbitrary internal URL and renders its content inside a modal overlay.

view_transitions

welcome_modal

Shows a welcome pop-up modal on first visit (using a cookie to avoid repeat displays), optionally including a newsletter subscribe form or promotional image and message.

login_modal

user_menu

Renders the customer account drop-down menu with links to orders, profile, and favourites when the customer is logged in, or a login prompt when logged out.

user_signup

Renders a customer registration / sign-in form component inside a specified container, handling submission, validation errors, and post-login redirects.

ajax_pagination

Loads the next page of products or blog posts via AJAX and appends them to the current page without a full reload. Works with both numbered pagination and “load more” style buttons.

async_partial

Fetches a Liquid template partial asynchronously via AJAX and injects its HTML into a target element, with optional timezone-aware scheduling and query-param forwarding.

console_api

Provides a consolidated API for the Buyer/Customer Console UI

contact_widget

Renders a floating contact widget with links to WhatsApp, email, phone, Telegram, Twitter, and other configured channels.

feedback

Loads and displays customer comments and a feedback form for the current page, connecting to the Bolder comments service.

lazyload

Defers loading of images and iframes until they scroll near the viewport, replacing data-src with src using IntersectionObserver.

link_tracking

Tracks link clicks (banner items, menu links) by firing a link-click event through the Bolder analytics pipeline. Reads tracking data from br_* params that LinkDrop appends to URLs when a parent collection (GalleryDrop, LinksDrop) sets tracking context, plus section context from the surrounding DOM (same approach as CartTracking). Loaded automatically by ShopVisits when trackLinks: true is passed.

native_client

Bridges the web storefront with Bolder’s native mobile app WebView by detecting the Capacitor runtime and adding platform-specific CSS classes to the body element.

pdf_viewer

Embeds a PDF file viewer inside the page using a PDF.js-based renderer. Sets minimum dimensions on the container if needed.

places_map

Renders an interactive Google Map with markers for each store branch location. Requires branches to have latitude/longitude coordinates set.

shop_visits

Sends an anonymous shop-visit beacon to Bolder analytics on every page load. No configuration required.

streaming_videos

Initialises embedded video players supporting direct video files and HLS (.m3u8) streams found in page content.