@gemboss/gem-framework 0.18.15 → 0.18.16

package/dist/index.js

@@ -435,7 +435,7 @@ function gemButtonGradientEndCss(accent = "var(--gem-color-accent)", accentText
 }
 
 // ../../packages/gem-framework/src/tokens.ts
-var gemFrameworkVersion = "0.18.15";
+var gemFrameworkVersion = "0.18.16";
 var GEM_FOCUS_RING_CSS_VAR = "--gem-focus-ring: 2px solid var(--gem-color-accent);";
 var GEM_TAP_MIN_CSS_VAR = "--gem-tap-min: 44px;";
 var GEM_FOCUS_OFFSET_CSS_VAR = "--gem-focus-offset: 3px;";
@@ -1462,6 +1462,11 @@ var gemFrameworkRuntimePlugins = [
     key: "reviews",
     load_strategy: "idle",
     events: ["gem:reviews:ready", "gem:reviews:render", "gem:review:vote"]
+  },
+  {
+    key: "bundle",
+    load_strategy: "idle",
+    events: ["gem:bundle:ready", "gem:bundle:change", "gem:bundle:complete"]
   }
 ];
 var gemFrameworkValidationRules = [
@@ -5445,7 +5450,7 @@ function reviewsEngineRuntimeScript() {
           const b = document.createElement('button');
           b.type = 'button'; b.className = strip.getAttribute('data-rv-thumb-class') || ''; b.setAttribute('data-rv-lb-thumb', String(k));
           b.setAttribute('aria-label', (strip.getAttribute('data-rv-thumb-label') || 'Media {n} of {total}').replace('{n}', String(k + 1)).replace('{total}', String(lbSet.length)));
-          const img = document.createElement('img'); img.src = x.thumb; img.alt = ''; img.loading = 'lazy'; img.decoding = 'async';
+          const img = document.createElement('img'); img.loading = 'lazy'; img.decoding = 'async'; img.alt = ''; img.src = x.thumb;
           b.appendChild(img); strip.appendChild(b);
         });
         strip.hidden = lbSet.length <= 1;
@@ -5570,6 +5575,386 @@ function reviewsEngineRuntimeScript() {
     api.emit('gem:reviews:ready', { source: 'gem-runtime', count: boundReviews });`;
 }
 
+// ../../packages/gem-framework/src/bundle-engine.ts
+function bundleEngineRuntimeScript() {
+  return `let boundBundles = 0;
+    const BB_WORDS = ['zero', 'one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten'];
+    document.querySelectorAll('[data-bb-root]').forEach((root) => {
+      if (!mark(root, 'bundle')) return;
+      boundBundles += 1;
+      const on = (el, type, fn, opt) => { if (canListen(el)) el.addEventListener(type, fn, opt); };
+      const isEl = (t) => t instanceof window.Element;
+      const parse = (attr, fallback) => { try { const v = JSON.parse(root.getAttribute(attr) || 'null'); return v == null ? fallback : v; } catch (e) { return fallback; } };
+      let rules = parse('data-bb-rules', {});
+      const text = root.hasAttribute('data-bb-messages') ? parse('data-bb-messages', {}) : parse('data-bb-labels', {});
+      const viMoney = root.getAttribute('data-bb-money') === 'vi';
+      const currency = root.getAttribute('data-bb-currency') || (viMoney ? 'VND' : 'USD');
+      let nf = null;
+      if (!viMoney) { try { nf = new Intl.NumberFormat('en-US', { style: 'currency', currency, maximumFractionDigits: currency === 'VND' ? 0 : 2 }); } catch (e) { nf = null; } }
+      const money = (n) => (viMoney ? String(Math.round(n)).replace(/\\B(?=(\\d{3})+(?!\\d))/g, '.') + '\u0111' : nf ? nf.format(Math.round(n * 100) / 100) : (Math.round(n * 100) / 100).toFixed(2));
+      // A strike price as stores show it: a whole number drops its cents ("$42", not "$42.00").
+      const moneyShort = (n) => { const s = money(n); return Math.abs(n - Math.round(n)) < 0.005 ? s.replace(/[.,]00(?=\\D*$)/, '') : s; };
+      const fill = (tpl, vars) => String(tpl || '').replace(/\\{(\\w+)\\}/g, (m, k) => (Object.hasOwn(vars, k) ? String(vars[k]) : m));
+      // A sentence with {reward}: the reward is a <strong>, the rest plain text. Never innerHTML.
+      const say = (el, tpl, vars) => {
+        if (!el) return;
+        const parts = String(tpl || '').split('{reward}');
+        el.replaceChildren();
+        parts.forEach((part, i) => {
+          if (part) el.append(document.createTextNode(fill(part, vars)));
+          if (i < parts.length - 1 && vars.reward) { const s = document.createElement('strong'); s.textContent = vars.reward; el.append(s); }
+        });
+      };
+      let min = Math.max(1, Number(rules.min) || 1);
+      let cap = Number(rules.max) > 0 ? Number(rules.max) : Infinity;
+      const per = Number(rules.per) > 0 ? Number(rules.per) : Infinity;
+      let tiers = Array.isArray(rules.tiers) ? rules.tiers : [];
+      let goal = tiers.length ? tiers[tiers.length - 1] : null;
+      // The catalog: one entry per item, plus one per extra variant of a card (<key>~<index>).
+      const catalog = new Map();
+      const cards = new Map();
+      root.querySelectorAll('[data-bb-item]').forEach((el) => {
+        const key = el.getAttribute('data-bb-item');
+        const base = {
+          el,
+          variantId: el.getAttribute('data-bb-variant') || '',
+          price: Number(el.getAttribute('data-bb-price')) || 0,
+          compare: Number(el.getAttribute('data-bb-compare')) || 0,
+          title: el.getAttribute('data-bb-title') || '',
+          subtitle: el.getAttribute('data-bb-subtitle') || '',
+          image: el.getAttribute('data-bb-image') || '',
+          group: el.getAttribute('data-bb-group') || '',
+          step: el.getAttribute('data-bb-step') || '',
+          short: el.getAttribute('data-bb-short') || '',
+          available: el.getAttribute('data-available') !== 'false',
+        };
+        catalog.set(key, base);
+        let vs = [];
+        try { vs = JSON.parse(el.getAttribute('data-bb-variants') || '[]'); } catch (e) { vs = []; }
+        if (!Array.isArray(vs)) vs = [];
+        vs.forEach((v, i) => {
+          if (!i) return;
+          catalog.set(key + '~' + i, { ...base, variantId: String(v.id || ''), price: Number(v.price) || 0, compare: Number(v.compare) || 0, image: v.image || base.image, variantTitle: v.title || '' });
+        });
+        if (vs[0]) base.variantTitle = vs[0].title || '';
+        cards.set(key, { el, variants: vs, gift: el.hasAttribute('data-bb-gift') });
+      });
+      const gifts = Array.from(cards.entries()).filter(([, c]) => c.gift).map(([k]) => k);
+      // The variant a card shows now (data-bb-current), as the key an action picks.
+      const currentKey = (key) => { const c = cards.get(key); const i = c ? Number(c.el.getAttribute('data-bb-current')) || 0 : 0; return i ? key + '~' + i : key; };
+      let picks = [];
+      let plan = 'one_time';
+      const planOf = (el) => (el.type === 'checkbox' ? (el.checked ? 'subscribe' : 'one_time') : el.getAttribute('data-bb-plan') || 'one_time');
+      const planInputs = Array.from(root.querySelectorAll('input[data-bb-plan]'));
+      const checkedPlan = planInputs.find((el) => el.checked);
+      if (checkedPlan) plan = planOf(checkedPlan);
+      const tierFor = (n) => tiers.filter((t) => n >= t.min).pop() || null;
+      const pctOf = (t, p) => (!t ? 0 : p === 'subscribe' ? Number(t.sub) || Number(t.pct) || 0 : Number(t.pct) || 0);
+      // The reward in a progress sentence is always "N% off" for the plan in force; a tier's label is the text on its milestone.
+      const rewardOf = (t, p) => (!t ? '' : pctOf(t, p) + '% off');
+      const qtyOf = (key) => picks.filter((p) => p === key).length;
+      const canAdd = (key) => picks.length < cap && (rules.repeat !== false || !picks.includes(key)) && qtyOf(key) < per;
+
+      // Box sizes, when the root declares them (data-bb-sizes): choosing a size sets floor = ceiling = its item count. "trim":
+      // a smaller box drops the LAST picks; "queue": they wait, in order, and come back when there is room again.
+      const sizeMode = root.getAttribute('data-bb-sizes');
+      const sizes = Array.isArray(rules.sizes) ? rules.sizes : [];
+      let size = null;
+      const waiting = [];
+      const refill = () => { while (sizeMode === 'queue' && picks.length < cap && waiting.length) picks.push(waiting.shift()); };
+      const applySize = (n) => {
+        const s = sizes.find((x) => Number(x.items) === n);
+        if (!s) return false;
+        size = s; min = Number(s.items); cap = Number(s.items);
+        goal = tierFor(min) || (tiers.length ? tiers[tiers.length - 1] : null);
+        if (picks.length > cap) { const out = picks.splice(cap); if (sizeMode === 'queue') waiting.unshift(...out); }
+        refill();
+        return true;
+      };
+      if (sizeMode) { const s0 = sizes.find((s) => Number(s.items) === Number(rules.size)) || sizes[0] || null; if (s0) applySize(Number(s0.items)); }
+
+      // Kits (rules.kits): each keeps its own picks and steps; a kit's own rules replace the bundle's while it is chosen.
+      // A kit with steps fills each step's slots in order and moves on by itself; optional steps open after the required ones.
+      const kits = Array.isArray(rules.kits) && rules.kits.length ? rules.kits : null;
+      const stateOf = new Map();
+      (kits || []).forEach((k) => {
+        const steps = Array.isArray(k.steps) ? k.steps : [];
+        const slots = {};
+        steps.forEach((s) => { slots[s.id] = Array.from({ length: Math.max(1, Number(s.pick) || 1) }, () => null); });
+        stateOf.set(k.id, { kit: k, steps, fill: slots, picks: [], current: steps.length ? steps[0].id : null });
+      });
+      let st = kits ? stateOf.get(kits[0].id) : { kit: null, steps: [], fill: {}, picks, current: null };
+      const useKit = (id) => {
+        if (!kits) return;
+        st = stateOf.get(id) || stateOf.get(kits[0].id);
+        const k = st.kit;
+        rules = { ...rules, min: k.min, max: k.max, tiers: k.tiers, repeat: k.repeat, price_mode: k.price_mode, fixed_price: k.fixed_price };
+        min = Math.max(1, Number(k.min) || 1);
+        cap = Number(k.max) > 0 ? Number(k.max) : Infinity;
+        tiers = Array.isArray(k.tiers) ? k.tiers : [];
+        goal = tiers.length ? tiers[tiers.length - 1] : null;
+        picks = st.picks;
+      };
+      if (kits) useKit(kits[0].id);
+      const stepsMode = () => st.steps.length > 0;
+      const required = () => st.steps.filter((s) => !s.optional);
+      const isFull = (s) => st.fill[s.id].every(Boolean);
+      // picks (in step order) are rebuilt from the slots after every change: price and cart read picks.
+      const syncPicks = () => { picks.length = 0; st.steps.forEach((s) => st.fill[s.id].forEach((k) => { if (k) picks.push(k); })); };
+      const openRequired = () => required().find((s) => !isFull(s)) || null;
+      const nextOpen = () => openRequired() || st.steps.find((s) => s.optional && !isFull(s)) || null;
+      const doneCount = () => required().filter(isFull).length;
+      const isComplete = () => (stepsMode() ? doneCount() === required().length : picks.length >= min);
+      const reachable = (s) => { const open = openRequired(); return !open || st.steps.indexOf(s) <= st.steps.indexOf(open); };
+      const slotRef = (idx) => {
+        let n = 0;
+        for (const s of st.steps) for (let j = 0; j < st.fill[s.id].length; j++) { if (n === idx) return [s, j]; n++; }
+        return null;
+      };
+      // Into the card's step: its first empty slot; a full step swaps its last pick (a full optional step refuses).
+      const addToStep = (key) => {
+        const it = catalog.get(key);
+        const step = (it && st.steps.find((s) => s.id === it.step)) || st.steps.find((s) => s.id === st.current);
+        if (!step || (rules.repeat === false && picks.includes(key))) return false;
+        const row = st.fill[step.id];
+        let i = row.indexOf(null);
+        if (i < 0) { if (step.optional) return false; i = row.length - 1; }
+        row[i] = key;
+        syncPicks();
+        if (isFull(step)) { const n = nextOpen(); if (n) st.current = n.id; }
+        return true;
+      };
+      // "Edit" on a required step empties the slot, closes the gap and goes back to that step; on an optional step it only removes.
+      const editSlot = (idx) => {
+        const ref = slotRef(idx);
+        if (!ref) return;
+        const [s, j] = ref;
+        const row = st.fill[s.id];
+        row.splice(j, 1); row.push(null);
+        syncPicks();
+        if (!s.optional) st.current = s.id;
+      };
+      const clearAll = () => {
+        st.steps.forEach((s) => { st.fill[s.id] = st.fill[s.id].map(() => null); });
+        picks.length = 0; waiting.length = 0;
+        st.current = st.steps.length ? st.steps[0].id : null;
+      };
+
+      // Prices. totals(): the bundle price at the tier the bundle WILL reach once it has its minimum (stores show the bundle
+      // price from the first pick), plus a container's base price. totalsNow(): at the tier reached now, rounded to the cent
+      // first so total + saved add up.
+      let basePrice = 0;
+      let cartHead = null;
+      const sumOf = () => {
+        let sum = 0; let compare = 0;
+        picks.forEach((k) => { const it = catalog.get(k); if (!it) return; sum += it.price; compare += Math.max(it.compare, it.price); });
+        return { sum, compare };
+      };
+      const totals = (p) => {
+        const { sum, compare } = sumOf();
+        if (rules.price_mode === 'fixed' && !basePrice) {
+          // A box size with a fixed one-time price; or a kit with one price whatever is picked (no strike price then).
+          if (size && Number(size.fixed) > 0) { if (p !== 'subscribe') return { sum, compare, total: Number(size.fixed) }; }
+          else if (Number(rules.fixed_price) > 0) return { sum, compare: 0, total: Number(rules.fixed_price) };
+        }
+        const t = tierFor(Math.max(picks.length, min)) || goal;
+        return { sum, compare, total: basePrice + sum * (1 - pctOf(t, p) / 100) };
+      };
+      const totalsNow = (p) => {
+        const { sum, compare } = sumOf();
+        return { sum, compare, total: Math.round(sum * (1 - pctOf(tierFor(picks.length), p) / 100) * 100 + 1e-6) / 100 };
+      };
+      // One item's price on its card at the bundle's current tier, counting at least one item.
+      const unitNow = (it, p) => it.price * (1 - pctOf(tierFor(Math.max(picks.length, 1)), p) / 100);
+
+      const frequency = () => root.querySelector('[data-bb-frequency]');
+      const planId = () => {
+        if (plan !== 'subscribe') return '';
+        const f = frequency();
+        if (!f) return '';
+        if (f.matches('select')) return f.value;
+        const c = f.querySelector('input:checked');
+        return c ? c.value : '';
+      };
+      const bundleName = () => {
+        const n = (st.kit && st.kit.label) || (root.querySelector('[data-bb-name]') || {}).textContent || 'Bundle';
+        return String(n).trim();
+      };
+      const toCart = () => {
+        const counts = new Map();
+        picks.concat(gifts).forEach((k) => { const it = catalog.get(k); if (it && it.variantId) counts.set(it.variantId, (counts.get(it.variantId) || 0) + 1); });
+        const ruleKey = root.getAttribute('data-bb-discount-key') || '';
+        const id = (root.getAttribute('data-gem-section-id') || 'bundle') + '-' + Date.now().toString(36);
+        const props = [{ key: '_bundle_id', value: id }, { key: '_bundle', value: bundleName() }].concat(ruleKey ? [{ key: '_bundle_rule', value: ruleKey }] : []);
+        const pid = planId();
+        const lines = Array.from(counts.entries()).map(([variantId, quantity]) => ({ variantId, quantity, properties: props.slice(), ...(pid ? { sellingPlanId: pid } : {}) }));
+        // A container line (a gift box) goes first and carries the section's own properties (lid, gift message).
+        const head = cartHead ? cartHead() : null;
+        if (head) {
+          const hp = props.concat(Array.isArray(head.properties) ? head.properties : []);
+          if (head.variantId) lines.unshift({ variantId: head.variantId, quantity: 1, properties: hp, ...(pid ? { sellingPlanId: pid } : {}) });
+          else if (lines[0]) lines[0].properties = hp;
+        }
+        if (lines.length && typeof window.CustomEvent === 'function') window.dispatchEvent(new window.CustomEvent('gem:cart:add-many', { detail: { lines, after: 'drawer' } }));
+        return lines.length;
+      };
+
+      let busy = false;
+      let wasComplete = false;
+      const state = () => {
+        const n = picks.length;
+        const counts = {};
+        picks.forEach((k) => { counts[k] = (counts[k] || 0) + 1; });
+        return {
+          picks, count: n, counts, min, cap, max: cap === Infinity ? null : cap, per, rules, text, tiers, goal, plan, size, sizes, waiting,
+          catalog, cards, gifts, reached: tierFor(n), next: tiers.find((t) => n < t.min) || null, left: Math.max(0, min - n),
+          kit: st.kit, kits, steps: st.steps, fill: st.fill, current: st.current, stepsMode: stepsMode(), done: doneCount(),
+          required: required(), complete: isComplete(), busy, base: basePrice,
+        };
+      };
+      const outs = () => root.querySelectorAll('[data-bb-out]');
+      const emit = (action, extra) => {
+        const n = picks.length;
+        const complete = isComplete();
+        root.setAttribute('data-bb-count', String(n));
+        root.setAttribute('data-bb-state', n === 0 ? 'empty' : n >= cap ? 'full' : complete ? 'complete' : 'partial');
+        if (outs().length) {
+          const t = totals(plan); const reached = tierFor(n);
+          const v = { count: String(n), left: String(Math.max(0, min - n)), total: money(t.total), compare: money(t.compare), saved: money(Math.max(0, t.compare - t.total)), reward: reached ? rewardOf(reached, plan) : '' };
+          outs().forEach((el) => { const k = el.getAttribute('data-bb-out'); if (Object.hasOwn(v, k)) el.textContent = v[k]; });
+        }
+        const detail = { source: 'gem-runtime', action, ...(extra || {}), count: n, min, max: cap === Infinity ? null : cap, plan, size: size ? Number(size.items) : null, kit: st.kit ? st.kit.id : null, step: st.current, complete, reward: tierFor(n) ? rewardOf(tierFor(n), plan) : '', total: totals(plan).total };
+        if (typeof window.CustomEvent === 'function') {
+          root.dispatchEvent(new window.CustomEvent('gem:bundle:change', { bubbles: true, detail }));
+          if (complete && !wasComplete) root.dispatchEvent(new window.CustomEvent('gem:bundle:complete', { bubbles: true, detail }));
+        }
+        wasComplete = complete;
+      };
+
+      // Actions: the handlers below call these, and so may a section's own controls (root.gemBundle.add(key)\u2026).
+      const add = (key) => {
+        const before = st.current;
+        if (root.hasAttribute('data-bb-add-toggle') && picks.includes(key)) { picks.splice(picks.indexOf(key), 1); emit('remove', { key }); return true; }
+        if (stepsMode()) { if (!addToStep(key)) return false; }
+        else { if (!canAdd(key)) return false; picks.push(key); }
+        emit('add', { key, from: before });
+        return true;
+      };
+      const removeAt = (idx) => { if (stepsMode()) editSlot(idx); else { picks.splice(idx, 1); refill(); } emit('remove', { index: idx }); };
+      const dec = (key) => { const at = picks.lastIndexOf(key); if (at < 0) return false; picks.splice(at, 1); refill(); emit('dec', { key }); return true; };
+      const uncheck = (key) => { for (let i = picks.length - 1; i >= 0; i -= 1) if (picks[i] === key) picks.splice(i, 1); refill(); emit('uncheck', { key }); };
+      const clear = () => { clearAll(); emit('clear'); };
+      // A typed quantity: exactly k picks of that item, within the bundle's ceiling, the item's own and no-repeat.
+      const setQty = (key, want) => {
+        if (!catalog.has(key)) return;
+        const has = qtyOf(key);
+        const room = cap === Infinity ? Infinity : cap - (picks.length - has);
+        const k = Math.max(0, Math.min(Math.floor(Number(want)) || 0, room, per, rules.repeat === false ? 1 : Infinity));
+        for (let i = picks.length - 1; i >= 0; i--) if (picks[i] === key) picks.splice(i, 1);
+        for (let i = 0; i < k; i++) picks.push(key);
+        emit('qty', { key });
+      };
+      const setPlan = (p) => { plan = p === 'subscribe' ? 'subscribe' : 'one_time'; emit('plan'); };
+      const setSize = (n) => {
+        if (!sizeMode || !applySize(Number(n))) return false;
+        // A box size may name its default selling plan.
+        const f = frequency();
+        if (f && f.matches('select') && size && size.plan && Array.from(f.options).some((o) => o.value === size.plan)) f.value = size.plan;
+        emit('size');
+        return true;
+      };
+      // An item's variant radio (a pack size): the whole row changes variant and price, its count stays.
+      const applyVariant = (radio) => {
+        const it = catalog.get(radio.getAttribute('data-bb-size'));
+        if (!it) return false;
+        it.variantId = radio.getAttribute('data-bb-variant') || '';
+        it.price = Number(radio.getAttribute('data-bb-price')) || 0;
+        it.compare = Number(radio.getAttribute('data-bb-compare')) || 0;
+        it.el.setAttribute('data-bb-variant', it.variantId);
+        it.el.setAttribute('data-bb-price', String(it.price));
+        it.el.setAttribute('data-bb-compare', it.compare ? String(it.compare) : '');
+        return true;
+      };
+      const selectKit = (id) => { if (!kits) return; useKit(id); emit('kit'); };
+      const goStep = (id) => { const s = st.steps.find((x) => x.id === id); if (!s || !reachable(s)) return false; st.current = id; emit('step'); return true; };
+      const finish = (ok) => {
+        busy = false;
+        root.querySelectorAll('[data-bb-cta]').forEach((c) => { c.removeAttribute('data-state'); c.removeAttribute('aria-busy'); });
+        if (ok) clearAll();
+        emit(ok ? 'added' : 'add-failed');
+      };
+      const checkout = () => {
+        if (!isComplete() || busy || !picks.length) return false;
+        if (!toCart()) return false;
+        // With gemsite's cart bridge: wait for its answer before clearing (a failure keeps the bundle to try again).
+        if (window.__gemCartAddBridge) {
+          busy = true;
+          const box = st.kit ? root.querySelector('[data-bb-kit-box="' + st.kit.id + '"]') : null;
+          (box || root).querySelectorAll('[data-bb-cta]').forEach((c) => { c.setAttribute('data-state', 'loading'); c.setAttribute('aria-busy', 'true'); });
+          emit('checkout');
+        } else finish(true);
+        return true;
+      };
+
+      on(root, 'click', (event) => {
+        const t = isEl(event.target) ? event.target : null;
+        if (!t) return;
+        const addEl = t.closest('[data-bb-add], [data-bb-inc]');
+        if (addEl) { add(currentKey(addEl.getAttribute('data-bb-add') || addEl.getAttribute('data-bb-inc'))); return; }
+        const decEl = t.closest('[data-bb-dec], [data-bb-minus]');
+        if (decEl) { dec(currentKey(decEl.getAttribute('data-bb-dec') || decEl.getAttribute('data-bb-minus'))); return; }
+        const un = t.closest('[data-bb-uncheck]');
+        if (un) { uncheck(currentKey(un.getAttribute('data-bb-uncheck'))); return; }
+        const rm = t.closest('[data-bb-remove]');
+        if (rm) { removeAt(Number(rm.getAttribute('data-bb-remove')) || 0); return; }
+        if (t.closest('[data-bb-clear]')) { clear(); return; }
+        const nav = t.closest('[data-bb-step-nav]');
+        if (nav) { if (!nav.disabled) goStep(nav.getAttribute('data-bb-step-nav')); return; }
+        const tab = t.closest('[data-bb-kit-tab]');
+        if (tab) { selectKit(tab.getAttribute('data-bb-kit-tab')); return; }
+        if (t.closest('[data-bb-skip]')) { checkout(); return; }
+        const cta = t.closest('[data-bb-cta]');
+        if (cta) { event.preventDefault(); if (cta.getAttribute('aria-disabled') !== 'true') checkout(); }
+      });
+      on(root, 'change', (event) => {
+        const t = isEl(event.target) ? event.target : null;
+        if (!t) return;
+        const p = t.closest('input[data-bb-plan]');
+        if (p) { if (p.type === 'checkbox' || p.checked) setPlan(planOf(p)); return; }
+        const s = t.closest('input[data-bb-size]');
+        if (s && s.checked) { if (s.hasAttribute('data-bb-variant')) { if (applyVariant(s)) emit('variant', { key: s.getAttribute('data-bb-size') }); } else setSize(Number(s.value)); return; }
+        const q = t.closest('input[data-bb-count]');
+        if (q) setQty(q.getAttribute('data-bb-count'), q.value);
+      });
+      // A typed quantity applies as soon as it is a number (an emptied box waits for "change" to go back to 0).
+      on(root, 'input', (event) => {
+        const q = isEl(event.target) ? event.target.closest('input[data-bb-count]') : null;
+        if (q && q.value !== '' && Number.isFinite(Number(q.value))) setQty(q.getAttribute('data-bb-count'), q.value);
+      });
+      on(window, 'gem:cart:added', () => { if (busy) finish(true); });
+      on(window, 'gem:cart:add-failed', () => { if (busy) finish(false); });
+
+      // A page brought back from history restores its form: read back the variant radios and typed quantities in view.
+      root.querySelectorAll('input[data-bb-size][data-bb-variant]').forEach((r) => { if (r.checked) applyVariant(r); });
+      root.querySelectorAll('input[data-bb-count]').forEach((inp) => {
+        const v = Math.floor(Number(inp.value)) || 0;
+        const key = inp.getAttribute('data-bb-count');
+        if (v > 0 && catalog.has(key)) { const k = Math.min(v, per, rules.repeat === false ? 1 : Infinity, cap === Infinity ? Infinity : cap - picks.length); for (let i = 0; i < k; i++) picks.push(key); }
+      });
+
+      root.gemBundle = {
+        state, money, moneyShort, fill, say, words: BB_WORDS, tierFor, pctOf, rewardOf, canAdd, qtyOf, currentKey, totals, totalsNow, unitNow,
+        reachable, isFull, slotRef, required, add, removeAt, dec, uncheck, clear, setQty, setPlan, setSize, selectKit, goStep, checkout,
+        setBase: (n) => { basePrice = Number(n) || 0; emit('base'); },
+        setCartHead: (fn) => { cartHead = typeof fn === 'function' ? fn : null; },
+        refresh: () => emit('refresh'),
+      };
+      root.setAttribute('data-bb-ready', '');
+      emit('init');
+    });
+    api.emit('gem:bundle:ready', { source: 'gem-runtime', count: boundBundles });`;
+}
+
 // ../../packages/gem-framework/src/runtime.ts
 var runtimePluginReadyEvents = {
   "cart-drawer": "gem:cart:ready",
@@ -5594,7 +5979,8 @@ var runtimePluginReadyEvents = {
   "seasonal-effects": "gem:seasonal:ready",
   "context-adapter": "gem:context:ready",
   "offer-engine": "gem:offer:ready",
-  reviews: "gem:reviews:ready"
+  reviews: "gem:reviews:ready",
+  bundle: "gem:bundle:ready"
 };
 var cartDrawerPluginRegistrationLines = [
   "  registerPlugin('cart-drawer', ({ api }) => {",
@@ -6677,6 +7063,11 @@ var reviewsPluginRegistrationLines = [
   "    " + reviewsEngineRuntimeScript(),
   "  });"
 ];
+var bundlePluginRegistrationLines = [
+  "  registerPlugin('bundle', ({ api }) => {",
+  "    " + bundleEngineRuntimeScript(),
+  "  });"
+];
 var runtimePluginSourceLines = [
   ["cart-drawer", cartDrawerPluginRegistrationLines],
   ["mobile-menu", mobileMenuPluginRegistrationLines],
@@ -6699,7 +7090,8 @@ var runtimePluginSourceLines = [
   ["recently-viewed", recentlyViewedPluginRegistrationLines],
   ["runtime-slot-loader", runtimeSlotLoaderPluginRegistrationLines],
   ["offer-engine", offerEnginePluginRegistrationLines],
-  ["reviews", reviewsPluginRegistrationLines]
+  ["reviews", reviewsPluginRegistrationLines],
+  ["bundle", bundlePluginRegistrationLines]
 ];
 var noopPluginRegistrationLine = (key, readyEvent) => `  registerNoopPlugin(${JSON.stringify(key)}, ${JSON.stringify(readyEvent)});`;
 function gemRuntimePluginSources() {
@@ -8376,6 +8768,7 @@ export {
   aaLabelColor,
   aaTextColor,
   auditGemFrameworkClassName,
+  bundleEngineRuntimeScript,
   createGemBaseCss,
   createGemFrameworkManifest,
   createGemRuntimeBootstrap,

package/dist/plugins/bundle.d.ts

@@ -0,0 +1,9 @@
+// @gemboss/gem-framework/plugins/bundle: types of the ES module next to this file. Generated; do not edit here.
+import type { MountOptions, Unmount } from "../runtime-core.js";
+
+export type { MountOptions, Unmount };
+export declare const key: "bundle";
+export declare const readyEvent: "gem:bundle:ready";
+/** Bind every "bundle" hook inside root (default: the whole document). Returns unmount(). Mounting the same root twice binds once. */
+export declare function mount(root?: ParentNode | null, options?: MountOptions): Unmount;
+export default mount;