@runwell/shopify-toolkit 0.4.0 → 0.4.1

package/lib/template.js

@@ -21,7 +21,8 @@ export function interpolate(source, vars) {
   let working = source;
 
   // Second pass: substitute {{config.X}} and {{brand.Y}} and {{client.Z}}
-  working = working.replace(/\{\{\s*([a-zA-Z][a-zA-Z0-9_.]*)\s*\}\}/g, (match, key) => {
+  // Keys can include hyphens (e.g. brand.rain-forrest) and dots for nesting.
+  working = working.replace(/\{\{\s*([a-zA-Z][a-zA-Z0-9_.\-]*)\s*\}\}/g, (match, key) => {
     // If the key starts with a Liquid keyword, leave it alone (it is Shopify Liquid)
     const liquidKeywords = new Set([
       'product', 'collection', 'cart', 'customer', 'shop', 'request',

package/modules/INDEX.md

@@ -44,7 +44,7 @@ Total modules: 31.
 | `reviews` | social-proof | (native build) | sections:1 | heading | (none) | (none) |
 | `risk-reversal` | conversion | (native build) | sections:1 | icon, heading, body, link_label, link_url, background_color, text_color | (none) | (none) |
 | `shipping-bar` | conversion | (native build) | sections:1 | threshold_cents, message_below, message_qualified, message_default, background_color, text_color | (none) | (none) |
-| `sticky-atc` | conversion | (native build) | sections:1 | (none) | (none) | (none) |
+| `sticky-atc` | conversion | Sticky Add To Cart Booster Pro and similar | sections:1 assets:1 | (none) | (none) | (none) |
 | `subscriptions` | catalog | Recharge / Bold Subscriptions / Appstle for the storefront display layer; subscription management still uses Shopify's native customer account | snippets:1 | one_time_label, subscribe_label, fineprint | (none) | install-shopify-subscriptions + create-selling-plan-group + enable-customer-account-tab |
 | `testimonials` | social-proof | (native build) | sections:1 | eyebrow, heading, background_color, text_color | (none) | (none) |
 | `trust-badges` | social-proof | (native build) | sections:1 | background_color, text_color | (none) | (none) |
@@ -243,8 +243,9 @@ Total modules: 31.
 ### sticky-atc
 
 - Category: conversion
-- What: Lushi sticky ATC module migrated from Lushi.
-- Files: sections:1
+- Replaces: Sticky Add To Cart Booster Pro and similar
+- What: Sticky add-to-cart bar that slides up from the bottom on PDP after the buy area scrolls out of view.
+- Files: sections:1 assets:1
 
 ### subscriptions
 

package/modules/sticky-atc/assets/runwell-sticky-atc.css

@@ -0,0 +1,117 @@
+/* Runwell sticky add-to-cart bar.
+   Slides up from bottom on scroll past the buy area; hides when the
+   main buy button returns to view (driven by IntersectionObserver in
+   the section template).
+*/
+
+.runwell-sticky-atc {
+  position: fixed;
+  inset: auto 0 0 0;
+  z-index: 60;
+  background: #FFFFFF;
+  border-top: 1px solid rgba(0, 0, 0, 0.08);
+  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.06);
+  transform: translateY(100%);
+  transition: transform 0.25s ease, opacity 0.25s ease;
+  opacity: 0;
+  visibility: hidden;
+}
+
+.runwell-sticky-atc[aria-hidden='false'] {
+  transform: translateY(0);
+  opacity: 1;
+  visibility: visible;
+}
+
+.runwell-sticky-atc__inner {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0.75rem 1.25rem;
+}
+
+.runwell-sticky-atc__product {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  min-width: 0;
+}
+
+.runwell-sticky-atc__thumb {
+  width: 40px;
+  height: 40px;
+  border-radius: 4px;
+  object-fit: cover;
+  flex-shrink: 0;
+}
+
+.runwell-sticky-atc__meta {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+
+.runwell-sticky-atc__title {
+  font-family: var(--font-heading-family, serif);
+  font-style: italic;
+  font-size: 0.95rem;
+  font-weight: 400;
+  line-height: 1.2;
+  color: var(--runwell-primary, #1A1A1A);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.runwell-sticky-atc__price {
+  font-family: var(--font-body-family, sans-serif);
+  font-size: 0.85rem;
+  font-weight: 500;
+  color: var(--runwell-primary, #1A1A1A);
+  opacity: 0.8;
+}
+
+.runwell-sticky-atc__form {
+  flex-shrink: 0;
+  margin: 0;
+}
+
+.runwell-sticky-atc__cta {
+  background: var(--runwell-primary, #1A1A1A);
+  color: #FFFFFF;
+  border: none;
+  border-radius: 0;
+  padding: 0.75rem 1.5rem;
+  font-family: var(--font-body-family, sans-serif);
+  font-size: 0.9rem;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+  cursor: pointer;
+  transition: opacity 0.15s ease;
+}
+
+.runwell-sticky-atc__cta:hover {
+  opacity: 0.85;
+}
+
+.runwell-sticky-atc__cta:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+@media (max-width: 749px) {
+  .runwell-sticky-atc__inner {
+    padding: 0.6rem 0.9rem;
+  }
+  .runwell-sticky-atc__title {
+    font-size: 0.85rem;
+  }
+  .runwell-sticky-atc__cta {
+    padding: 0.6rem 1.1rem;
+    font-size: 0.8rem;
+  }
+}

package/modules/sticky-atc/module.json

@@ -1,14 +1,17 @@
 {
   "name": "sticky-atc",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "category": "conversion",
-  "description": "Lushi sticky ATC module migrated from Lushi.",
+  "description": "Sticky add-to-cart bar that slides up from the bottom on PDP after the buy area scrolls out of view. Native, no app. Replaces Sticky Add To Cart Booster Pro and similar.",
   "files": {
     "sections": [
       "sections/runwell-pdp-sticky.liquid"
+    ],
+    "assets": [
+      "assets/runwell-sticky-atc.css"
     ]
   },
   "config": {
     "schema": {}
   }
-}
+}

package/modules/sticky-atc/sections/runwell-pdp-sticky.liquid

@@ -5,6 +5,7 @@
 {%- endcomment -%}
 
 {%- if template == 'product' and product != blank -%}
+{{ 'runwell-sticky-atc.css' | asset_url | stylesheet_tag }}
 <div class="runwell-sticky-atc" data-runwell-sticky aria-hidden="true">
   <div class="runwell-sticky-atc__inner">
     <div class="runwell-sticky-atc__product">

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@runwell/shopify-toolkit",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "description": "Reusable Shopify theme modules from Runwell. Replaces typically app-driven features (reviews, wishlist, urgency, FAQ, post-purchase upsell, exit popups, free-ship progress, sticky ATC, testimonials, badges, bundles) with native Liquid + JS + CSS that ship across multiple client themes via a config-driven sync CLI.",
   "type": "module",
   "main": "lib/index.js",