@runwell/shopify-toolkit 0.1.0

package/modules/post-purchase-upsell/admin/discount-setup.md

@@ -0,0 +1,25 @@
+# Discount setup for post-purchase-upsell
+
+This module surfaces a discount-applied deep link to complementary products on the Shopify order status page. Create the matching discount code in Shopify before the upsell goes live.
+
+## Steps
+
+1. Go to **Discounts > Create discount > Amount off order**
+2. Method: **Discount code**
+3. Code: **{{config.discount_code}}**
+4. Discount value: **15% off** (or whatever rate matches your `discount_label` config)
+5. Applies to: All products
+6. Customer eligibility: All customers
+7. Maximum discount uses: 1 use per customer
+8. Active dates: Starts today, no end date
+9. Save
+
+## URL params auto-apply
+
+When customers click an upsell card, the URL includes `?discount={{config.discount_code}}`. Shopify auto-applies the code at checkout if the discount is valid for the customer.
+
+## Test
+
+1. Place a test order on the dev store
+2. On the order status page, scroll past the order summary; the upsell strip should render with 3 complementary products
+3. Click any card; confirm the discount is auto-applied at checkout

package/modules/post-purchase-upsell/admin/order-status-paste.html

@@ -0,0 +1,31 @@
+<!-- Runwell post-purchase upsell. Paste this entire block into:
+     Shopify admin > Settings > Checkout > Order status page > Additional scripts.
+     Generated from @runwell/shopify-toolkit. Module: post-purchase-upsell.
+     Discount code in use: {{config.discount_code}}
+-->
+<div data-runwell-upsell></div>
+<style>
+/* Runwell post-purchase upsell inline styles for the order status page. */
+.runwell-ty-upsell{margin:2.5rem 0;padding:2.5rem 1.5rem;background:{{brand.cream}};border-radius:8px;color:{{brand.primary}};font-family:system-ui,-apple-system,sans-serif}
+.runwell-ty-upsell__inner{max-width:880px;margin:0 auto}
+.runwell-ty-upsell__header{text-align:center;margin-bottom:2rem}
+.runwell-ty-upsell__eyebrow{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;margin:0 0 .6rem;opacity:.65}
+.runwell-ty-upsell__heading{font-family:Georgia,serif;font-weight:400;font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.1;margin:0 0 .8rem}
+.runwell-ty-upsell__lede{font-size:.95rem;line-height:1.5;margin:0;opacity:.85;max-width:50ch;margin-inline:auto}
+.runwell-ty-upsell__lede strong{background:rgba(173,221,189,.5);padding:.05em .35em;border-radius:2px;font-weight:700;letter-spacing:.04em}
+.runwell-ty-upsell__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem}
+.runwell-ty-card{display:flex;flex-direction:column;background:#fff;border-radius:6px;padding:1.2rem;text-decoration:none;color:inherit;transition:transform .18s,box-shadow .18s;border:1px solid rgba(0,0,0,.06)}
+.runwell-ty-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.08)}
+.runwell-ty-card__media{aspect-ratio:4/5;background:{{brand.oat}};border-radius:4px;overflow:hidden;margin-bottom:.9rem}
+.runwell-ty-card__media img{width:100%;height:100%;object-fit:cover;display:block}
+.runwell-ty-card__body{flex:1;display:flex;flex-direction:column;gap:.2rem;margin-bottom:1rem}
+.runwell-ty-card__title{font-family:Georgia,serif;font-size:1.1rem;line-height:1.2}
+.runwell-ty-card__price{font-size:.9rem;opacity:.7}
+.runwell-ty-card__cta{font-size:.85rem;font-weight:700;text-decoration:underline;text-underline-offset:4px;text-decoration-color:{{brand.accent}};margin-top:auto}
+@media (max-width:749px){.runwell-ty-upsell{padding:2rem 1rem}.runwell-ty-upsell__grid{grid-template-columns:1fr}}
+</style>
+<script>
+window.RUNWELL_THANKYOU_DISCOUNT = '{{config.discount_code}}';
+window.RUNWELL_THANKYOU_DISCOUNT_LABEL = '{{config.discount_label}}';
+</script>
+<script src="https://{{client.store}}/cdn/shop/files/runwell-thank-you.js" defer></script>

package/modules/post-purchase-upsell/assets/runwell-thank-you.css

@@ -0,0 +1,119 @@
+/* Runwell post-purchase upsell styles. Uses CSS custom properties from
+   the client brand tokens so the upsell matches the rest of the theme.
+   Generated from @runwell/shopify-toolkit; do not hand-edit in client themes.
+*/
+.runwell-ty-upsell {
+  margin: 2.5rem 0;
+  padding: 2.5rem 1.5rem;
+  background: var(--runwell-cream, {{brand.cream}});
+  border-radius: 8px;
+  font-family: var(--font-body-family, system-ui, sans-serif);
+  color: var(--runwell-primary, {{brand.primary}});
+}
+.runwell-ty-upsell__inner {
+  max-width: 880px;
+  margin: 0 auto;
+}
+.runwell-ty-upsell__header {
+  text-align: center;
+  margin-bottom: 2rem;
+}
+.runwell-ty-upsell__eyebrow {
+  font-size: 0.78rem;
+  letter-spacing: 0.2em;
+  text-transform: uppercase;
+  font-weight: 700;
+  margin: 0 0 0.6rem 0;
+  opacity: 0.65;
+}
+.runwell-ty-upsell__heading {
+  font-family: var(--font-heading-family, Georgia, serif);
+  font-style: normal;
+  font-weight: 400;
+  font-size: clamp(1.7rem, 3vw, 2.4rem);
+  line-height: 1.1;
+  margin: 0 0 0.8rem 0;
+}
+.runwell-ty-upsell__lede {
+  font-size: 0.95rem;
+  line-height: 1.5;
+  margin: 0;
+  opacity: 0.85;
+  max-width: 50ch;
+  margin-inline: auto;
+}
+.runwell-ty-upsell__lede strong {
+  background: var(--runwell-accent-soft, rgba(173, 221, 189, 0.5));
+  padding: 0.05em 0.35em;
+  border-radius: 2px;
+  font-weight: 700;
+  letter-spacing: 0.04em;
+}
+.runwell-ty-upsell__grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: 1.2rem;
+}
+.runwell-ty-card {
+  display: flex;
+  flex-direction: column;
+  background: #FFFFFF;
+  border-radius: 6px;
+  padding: 1.2rem;
+  text-decoration: none;
+  color: inherit;
+  transition: transform 0.18s ease, box-shadow 0.18s ease;
+  border: 1px solid rgba(0, 0, 0, 0.06);
+}
+.runwell-ty-card:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
+}
+.runwell-ty-card__media {
+  aspect-ratio: 4/5;
+  background: var(--runwell-oat, {{brand.oat}});
+  border-radius: 4px;
+  overflow: hidden;
+  margin-bottom: 0.9rem;
+}
+.runwell-ty-card__media img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
+}
+.runwell-ty-card__media--noimg {
+  background: linear-gradient(135deg, var(--runwell-oat, #F5F0EE), var(--runwell-cream, #EDE6D8));
+}
+.runwell-ty-card__body {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 0.2rem;
+  margin-bottom: 1rem;
+}
+.runwell-ty-card__title {
+  font-family: var(--font-heading-family, Georgia, serif);
+  font-size: 1.1rem;
+  line-height: 1.2;
+}
+.runwell-ty-card__price {
+  font-size: 0.9rem;
+  opacity: 0.7;
+}
+.runwell-ty-card__cta {
+  font-size: 0.85rem;
+  font-weight: 700;
+  text-decoration: underline;
+  text-underline-offset: 4px;
+  text-decoration-color: var(--runwell-accent, {{brand.accent}});
+  margin-top: auto;
+}
+@media (max-width: 749px) {
+  .runwell-ty-upsell {
+    padding: 2rem 1rem;
+  }
+  .runwell-ty-upsell__grid {
+    grid-template-columns: 1fr;
+  }
+}

package/modules/post-purchase-upsell/assets/runwell-thank-you.js

@@ -0,0 +1,162 @@
+/* Runwell post-purchase upsell module.
+   Renders on Shopify order status page using the Shopify.checkout
+   global. Pulls complementary products based on what was ordered and
+   surfaces a deep link with the configured discount code applied.
+   Replaces Reconvert / OneClickUpsell (display layer only).
+   Generated from @runwell/shopify-toolkit; do not hand-edit in client themes.
+*/
+(function () {
+  if (typeof window === 'undefined') return;
+  var SHOP = window.Shopify && window.Shopify.shop ? window.Shopify.shop : null;
+  if (!SHOP) return;
+
+  var DISCOUNT_CODE = (window.RUNWELL_THANKYOU_DISCOUNT || '{{config.discount_code}}');
+  var DISCOUNT_LABEL = (window.RUNWELL_THANKYOU_DISCOUNT_LABEL || '{{config.discount_label}}');
+  var MAX_ITEMS = {{config.max_items}};
+  var HEADING = '{{config.heading}}';
+  var EYEBROW = '{{config.eyebrow}}';
+  var LEDE = '{{config.lede}}';
+
+  function endpoint() {
+    return 'https://' + SHOP;
+  }
+
+  function detectCategory(title) {
+    if (!title) return null;
+    var t = title.toLowerCase();
+    var skincare = ['serum', 'oil', 'moisturizer', 'cleanser', 'cream', 'spf', 'sunscreen', 'face', 'skin'];
+    var supplement = ['magnesium', 'collagen', 'tonic', 'vitamin', 'tincture', 'capsule', 'protein', 'mineral'];
+    for (var i = 0; i < skincare.length; i++) if (t.indexOf(skincare[i]) !== -1) return 'skincare';
+    for (var j = 0; j < supplement.length; j++) if (t.indexOf(supplement[j]) !== -1) return 'supplement';
+    return null;
+  }
+
+  function getOrderedItems() {
+    if (window.Shopify && window.Shopify.checkout && window.Shopify.checkout.line_items) {
+      return window.Shopify.checkout.line_items.map(function (li) {
+        return { product_id: li.product_id, handle: li.handle || null, title: li.title || '' };
+      });
+    }
+    return [];
+  }
+
+  function fetchAllProducts() {
+    return fetch(endpoint() + '/products.json?limit=20')
+      .then(function (r) { return r.ok ? r.json() : { products: [] }; })
+      .then(function (j) { return j.products || []; })
+      .catch(function () { return []; });
+  }
+
+  function fetchRecommendations(productId) {
+    var intents = ['complementary', 'related'];
+    var attempt = function (i) {
+      if (i >= intents.length) return Promise.resolve([]);
+      return fetch(endpoint() + '/recommendations/products.json?product_id=' + productId + '&limit=' + MAX_ITEMS + '&intent=' + intents[i])
+        .then(function (r) { return r.ok ? r.json() : { products: [] }; })
+        .then(function (j) {
+          if (j.products && j.products.length) return j.products;
+          return attempt(i + 1);
+        })
+        .catch(function () { return attempt(i + 1); });
+    };
+    return attempt(0);
+  }
+
+  function pickFallback(allProducts, ordered) {
+    var orderedHandles = {};
+    var orderedCategories = {};
+    ordered.forEach(function (li) {
+      if (li.handle) orderedHandles[li.handle] = true;
+      var cat = detectCategory(li.title);
+      if (cat) orderedCategories[cat] = true;
+    });
+    var oppositeCategory = null;
+    if (orderedCategories.skincare && !orderedCategories.supplement) oppositeCategory = 'supplement';
+    else if (orderedCategories.supplement && !orderedCategories.skincare) oppositeCategory = 'skincare';
+
+    var ranked = allProducts.filter(function (p) { return !orderedHandles[p.handle]; });
+    if (oppositeCategory) {
+      ranked.sort(function (a, b) {
+        var aMatch = detectCategory(a.title) === oppositeCategory ? 0 : 1;
+        var bMatch = detectCategory(b.title) === oppositeCategory ? 0 : 1;
+        return aMatch - bMatch;
+      });
+    }
+    return ranked.slice(0, MAX_ITEMS);
+  }
+
+  function moneyFormat(cents) {
+    var dollars = (cents / 100).toFixed(2);
+    return '$' + dollars;
+  }
+
+  function render(container, products) {
+    if (!products.length) { container.style.display = 'none'; return; }
+    var html =
+      '<aside class="runwell-ty-upsell" role="region" aria-labelledby="runwell-ty-title">' +
+        '<div class="runwell-ty-upsell__inner">' +
+          '<header class="runwell-ty-upsell__header">' +
+            '<p class="runwell-ty-upsell__eyebrow">' + EYEBROW + '</p>' +
+            '<h2 id="runwell-ty-title" class="runwell-ty-upsell__heading">' + HEADING + '</h2>' +
+            '<p class="runwell-ty-upsell__lede">' + LEDE + ' Use code <strong>' + DISCOUNT_CODE + '</strong> for ' + DISCOUNT_LABEL + ' (auto-applied below).</p>' +
+          '</header>' +
+          '<div class="runwell-ty-upsell__grid">' +
+            products.map(function (p) {
+              var price = (p.variants && p.variants[0] && p.variants[0].price) ? p.variants[0].price : null;
+              var img = p.images && p.images[0] ? (typeof p.images[0] === 'string' ? p.images[0] : p.images[0].src) : null;
+              var url = '/products/' + p.handle + '?discount=' + encodeURIComponent(DISCOUNT_CODE);
+              return (
+                '<a class="runwell-ty-card" href="' + url + '">' +
+                  (img ? '<div class="runwell-ty-card__media"><img src="' + img + '" alt="' + (p.title || '').replace(/"/g, '&quot;') + '" loading="lazy"></div>' : '<div class="runwell-ty-card__media runwell-ty-card__media--noimg"></div>') +
+                  '<div class="runwell-ty-card__body">' +
+                    '<span class="runwell-ty-card__title">' + (p.title || '') + '</span>' +
+                    (price ? '<span class="runwell-ty-card__price">' + (typeof price === 'number' ? moneyFormat(price) : '$' + price) + '</span>' : '') +
+                  '</div>' +
+                  '<span class="runwell-ty-card__cta">Add with ' + DISCOUNT_LABEL.replace(' your next order', '') + ' &rarr;</span>' +
+                '</a>'
+              );
+            }).join('') +
+          '</div>' +
+        '</div>' +
+      '</aside>';
+    container.innerHTML = html;
+    container.style.display = '';
+  }
+
+  function inject() {
+    var host = document.querySelector('[data-lushi-upsell]');
+    if (host) return host;
+    var anchor = document.querySelector('.os-step__info, .os-step, .step__sections, .main__content, main') || document.body;
+    var div = document.createElement('div');
+    div.setAttribute('data-lushi-upsell', '');
+    anchor.appendChild(div);
+    return div;
+  }
+
+  function run() {
+    var ordered = getOrderedItems();
+    if (!ordered.length) return;
+    var firstId = ordered[0].product_id;
+
+    fetchRecommendations(firstId)
+      .then(function (recs) {
+        var dedup = recs.filter(function (p) {
+          return !ordered.some(function (o) { return o.product_id === p.id || o.handle === p.handle; });
+        }).slice(0, MAX_ITEMS);
+        if (dedup.length >= MAX_ITEMS) return dedup;
+        return fetchAllProducts().then(function (all) {
+          return pickFallback(all, ordered);
+        });
+      })
+      .then(function (products) {
+        var host = inject();
+        render(host, products);
+      });
+  }
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', run);
+  } else {
+    run();
+  }
+})();

package/modules/post-purchase-upsell/module.json

@@ -0,0 +1,44 @@
+{
+  "name": "post-purchase-upsell",
+  "version": "0.1.0",
+  "category": "conversion",
+  "description": "Order status page upsell with auto-applied discount on click-through. Replaces Reconvert / OneClickUpsell / AfterSell display layer. Native, app-free.",
+  "replaces": ["reconvert", "one-click-upsell", "aftersell"],
+  "shopify_plan_required": "basic",
+  "shopify_features_used": ["order_status_page_additional_scripts"],
+  "files": {
+    "assets": [
+      "assets/runwell-thank-you.js",
+      "assets/runwell-thank-you.css"
+    ],
+    "admin_blocks": [
+      "admin/order-status-paste.html",
+      "admin/discount-setup.md"
+    ]
+  },
+  "config": {
+    "schema": {
+      "discount_code": { "type": "string", "required": true, "default": "WELCOME15" },
+      "discount_label": { "type": "string", "required": true, "default": "15% off your next order" },
+      "max_items": { "type": "integer", "default": 3, "min": 1, "max": 6 },
+      "heading": { "type": "string", "default": "Complete the ritual." },
+      "eyebrow": { "type": "string", "default": "While you wait" },
+      "lede": { "type": "string", "default": "A few of our customers tend to add these next." },
+      "cross_category_logic": { "type": "boolean", "default": true }
+    }
+  },
+  "admin_steps": [
+    {
+      "id": "create-discount",
+      "label": "Create the discount code",
+      "url": "https://admin.shopify.com/store/{store_handle}/discounts/new",
+      "summary": "Create a percentage discount code matching the discount_code config (e.g. WELCOME15). Type: Amount off order. Value: 15%. Customer eligibility: All. Maximum uses per customer: 1."
+    },
+    {
+      "id": "paste-bootstrap",
+      "label": "Paste the upsell bootstrap into Order status page additional scripts",
+      "url": "https://admin.shopify.com/store/{store_handle}/settings/checkout",
+      "summary": "Settings, Checkout, Order status page, Additional scripts, paste contents of admin/order-status-paste.html (after running runwell-shopify sync, the rendered version with the configured discount code lives in the client theme runwell-admin/post-purchase-upsell/order-status-paste.html)."
+    }
+  ]
+}

package/modules/press-bar/README.md

@@ -0,0 +1,17 @@
+# press-bar
+
+Lushi press bar. Migrated from Lushi (`sections/lushi-press-bar.liquid`) into the Runwell Shopify Toolkit.
+
+Category: `social-proof`
+
+## Files
+
+- `sections/runwell-press-bar.liquid`
+
+## Config
+
+See `module.json` config schema. Defaults match the original Lushi defaults; override per client in `runwell.config.json`.
+
+## Lineage
+
+This module was extracted from the Lushi build (Capital V) and generalised. The original lives at `lushi-shopify/sections/lushi-press-bar.liquid`. The toolkit version uses `runwell-` class prefixes and pulls brand vars from the client config.

package/modules/press-bar/module.json

@@ -0,0 +1,30 @@
+{
+  "name": "press-bar",
+  "version": "0.1.0",
+  "category": "social-proof",
+  "description": "Lushi press bar module migrated from Lushi.",
+  "files": {
+    "sections": [
+      "sections/runwell-press-bar.liquid"
+    ]
+  },
+  "config": {
+    "schema": {
+      "eyebrow": {
+        "type": "string",
+        "default": "As seen in",
+        "label": "Eyebrow"
+      },
+      "background_color": {
+        "type": "string",
+        "default": "#F5F0EE",
+        "label": "Background color"
+      },
+      "text_color": {
+        "type": "string",
+        "default": "#0B3D38",
+        "label": "Text color"
+      }
+    }
+  }
+}

package/modules/press-bar/sections/runwell-press-bar.liquid

@@ -0,0 +1,119 @@
+{%- comment -%}
+  Lushi press bar. Logos in a row with optional eyebrow text and link.
+  Used on homepage and about page. Keep tight; the wins do the talking.
+
+  Block options (in priority order):
+    1. block.settings.image  (Shopify-uploaded image, image_picker)
+    2. block.settings.asset_filename  (bundled theme asset, e.g. runwell-press-vogue.png)
+    3. block.settings.label  (text fallback in italic Baskervville)
+
+  Default homepage preset uses bundled asset filenames so the bar
+  renders on day one without any admin asset uploads.
+{%- endcomment -%}
+
+<section
+  class="runwell-press-bar"
+  style="background: {{ section.settings.background_color }}; color: {{ section.settings.text_color }}; padding: clamp(2rem, 4vw, 3rem) 6vw;"
+>
+  <div style="max-width: 1400px; margin: 0 auto;">
+    {%- if section.settings.eyebrow != blank -%}
+      <div style="text-align: center; font-family: var(--font-body-family); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; opacity: 0.6; margin-bottom: 1.6rem;">
+        {{ section.settings.eyebrow }}
+      </div>
+    {%- endif -%}
+
+    <div style="display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(2rem, 5vw, 4rem);">
+      {%- for block in section.blocks -%}
+        <div {{ block.shopify_attributes }} style="text-align: center;">
+          {%- if block.settings.image != blank -%}
+            <img
+              src="{{ block.settings.image | image_url: height: 80 }}"
+              alt="{{ block.settings.label | escape }}"
+              width="180"
+              height="40"
+              loading="lazy">
+          {%- elsif block.settings.asset_filename != blank -%}
+            <img
+              src="{{ block.settings.asset_filename | asset_url }}"
+              alt="{{ block.settings.label | escape }}"
+              width="180"
+              height="40"
+              loading="lazy">
+          {%- elsif block.settings.label != blank -%}
+            <span style="font-family: var(--font-heading-family); font-style: italic; font-weight: 400; font-size: clamp(1.1rem, 2vw, 1.5rem);">
+              {{ block.settings.label }}
+            </span>
+          {%- endif -%}
+        </div>
+      {%- endfor -%}
+    </div>
+  </div>
+</section>
+
+{% schema %}
+{
+  "name": "Lushi press bar",
+  "tag": "section",
+  "class": "section-runwell-press-bar",
+  "settings": [
+    {
+      "type": "text",
+      "id": "eyebrow",
+      "label": "Eyebrow",
+      "default": "As seen in"
+    },
+    {
+      "type": "color",
+      "id": "background_color",
+      "label": "Background color",
+      "default": "#F5F0EE"
+    },
+    {
+      "type": "color",
+      "id": "text_color",
+      "label": "Text color",
+      "default": "#0B3D38"
+    }
+  ],
+  "blocks": [
+    {
+      "type": "logo",
+      "name": "Logo",
+      "settings": [
+        {
+          "type": "image_picker",
+          "id": "image",
+          "label": "Logo image (uploaded)",
+          "info": "Optional. Falls through to bundled asset, then text label."
+        },
+        {
+          "type": "text",
+          "id": "asset_filename",
+          "label": "Bundled asset filename",
+          "info": "Use a theme asset filename (e.g. runwell-press-bloomberg.png)."
+        },
+        {
+          "type": "text",
+          "id": "label",
+          "label": "Label / alt text",
+          "default": "Publication"
+        }
+      ]
+    }
+  ],
+  "max_blocks": 9,
+  "presets": [
+    {
+      "name": "Lushi press bar",
+      "blocks": [
+        { "type": "logo", "settings": { "label": "Bloomberg",       "asset_filename": "runwell-press-bloomberg.png" } },
+        { "type": "logo", "settings": { "label": "Yahoo Finance",   "asset_filename": "runwell-press-yahoo-finance.png" } },
+        { "type": "logo", "settings": { "label": "Fortune",         "asset_filename": "runwell-press-fortune.png" } },
+        { "type": "logo", "settings": { "label": "Inc.",            "asset_filename": "runwell-press-inc.png" } },
+        { "type": "logo", "settings": { "label": "MSN",             "asset_filename": "runwell-press-msn.png" } },
+        { "type": "logo", "settings": { "label": "Fierce Healthcare","asset_filename": "runwell-press-fierce-healthcare.png" } }
+      ]
+    }
+  ]
+}
+{% endschema %}

package/modules/recently-viewed/README.md

@@ -0,0 +1,18 @@
+# recently-viewed
+
+Lushi recently viewed. Migrated from Lushi (`sections/lushi-recently-viewed.liquid`) into the Runwell Shopify Toolkit.
+
+Category: `pdp`
+
+## Files
+
+- `sections/runwell-recently-viewed.liquid`
+- `assets/runwell-recently-viewed.js`
+
+## Config
+
+See `module.json` config schema. Defaults match the original Lushi defaults; override per client in `runwell.config.json`.
+
+## Lineage
+
+This module was extracted from the Lushi build (Capital V) and generalised. The original lives at `lushi-shopify/sections/lushi-recently-viewed.liquid`. The toolkit version uses `runwell-` class prefixes and pulls brand vars from the client config.

package/modules/recently-viewed/assets/runwell-recently-viewed.js

@@ -0,0 +1,57 @@
+/* Lushi: track recently viewed products in localStorage and render a
+   "Recently viewed" section on PDP and home. Replaces the "Recently
+   Viewed" feature from Vitals/Pagefly without the app overhead. */
+(function () {
+  if (typeof window === 'undefined') return;
+  var KEY = 'lushi_recently_viewed';
+  var MAX = 8;
+
+  function read() {
+    try { return JSON.parse(localStorage.getItem(KEY) || '[]'); } catch (e) { return []; }
+  }
+  function write(list) {
+    try { localStorage.setItem(KEY, JSON.stringify(list)); } catch (e) {}
+  }
+  function track() {
+    var meta = document.querySelector('meta[name="runwell-product-handle"]');
+    if (!meta) return;
+    var handle = meta.getAttribute('content');
+    if (!handle) return;
+    var list = read().filter(function (h) { return h !== handle; });
+    list.unshift(handle);
+    if (list.length > MAX) list = list.slice(0, MAX);
+    write(list);
+  }
+  function render() {
+    var host = document.querySelector('[data-runwell-recently-viewed]');
+    if (!host) return;
+    var list = read();
+    var currentHandle = (document.querySelector('meta[name="runwell-product-handle"]') || {}).getAttribute && document.querySelector('meta[name="runwell-product-handle"]').getAttribute('content');
+    var handles = list.filter(function (h) { return h && h !== currentHandle; }).slice(0, 4);
+    if (!handles.length) { host.style.display = 'none'; return; }
+    Promise.all(handles.map(function (h) {
+      return fetch('/products/' + h + '.js').then(function (r) { return r.ok ? r.json() : null; }).catch(function () { return null; });
+    })).then(function (products) {
+      products = products.filter(Boolean);
+      if (!products.length) { host.style.display = 'none'; return; }
+      var grid = host.querySelector('[data-runwell-recently-viewed-grid]');
+      if (!grid) return;
+      grid.innerHTML = products.map(function (p) {
+        var img = p.featured_image ? '<img src="' + p.featured_image + '" alt="' + p.title + '" loading="lazy">' : '<div class="runwell-rv__noimg"></div>';
+        var price = (p.price / 100).toFixed(2);
+        return '<a class="runwell-rv__card" href="/products/' + p.handle + '">' +
+                 '<div class="runwell-rv__media">' + img + '</div>' +
+                 '<div class="runwell-rv__title">' + p.title + '</div>' +
+                 '<div class="runwell-rv__price">$' + price + '</div>' +
+               '</a>';
+      }).join('');
+      host.style.display = '';
+    });
+  }
+  track();
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', render);
+  } else {
+    render();
+  }
+})();

package/modules/recently-viewed/module.json

@@ -0,0 +1,33 @@
+{
+  "name": "recently-viewed",
+  "version": "0.1.0",
+  "category": "pdp",
+  "description": "Lushi recently viewed module migrated from Lushi.",
+  "files": {
+    "sections": [
+      "sections/runwell-recently-viewed.liquid"
+    ],
+    "assets": [
+      "assets/runwell-recently-viewed.js"
+    ]
+  },
+  "config": {
+    "schema": {
+      "eyebrow": {
+        "type": "string",
+        "default": "Picking up where you left off",
+        "label": "Eyebrow"
+      },
+      "heading": {
+        "type": "string",
+        "default": "Recently viewed.",
+        "label": "Heading"
+      },
+      "background_color": {
+        "type": "string",
+        "default": "#FFFFFF",
+        "label": "Background"
+      }
+    }
+  }
+}