easyorders 0.1.8 → 0.1.10

package/README.md

@@ -69,9 +69,14 @@ my-theme/
     ├── theme-data.json
     ├── style.css
     ├── script.js
-    └── sections/
-        ├── header.liquid
-        ├── footer.liquid
+    ├── sections/
+    │   ├── header.liquid
+    │   ├── footer.liquid
+    │   └── ...
+    └── home-sections/
+        ├── <section-key>/
+        │   ├── config.json
+        │   └── template.liquid
         └── ...
 ```
 

package/dist/bin/cli.js

@@ -87,7 +87,7 @@ async function createTheme() {
     console.log("");
     console.log(`   ${DIM}Next steps:${RESET}`);
     console.log(`     ${CYAN}cd ${projectName}${RESET}`);
-    console.log(`     ${CYAN}npx easyorders start${RESET}`);
+    console.log(`     ${CYAN} easyorders start${RESET}`);
     console.log("");
 }
 async function startDev() {
@@ -103,15 +103,36 @@ async function startDev() {
     const serverDir = path.join(CLI_ROOT, "server");
     const indexScript = path.join(serverDir, "index.js");
     const tunnelScript = path.join(serverDir, "tunnel.js");
-    const cmd = `node "${tunnelScript}" & node "${indexScript}"`;
-    const child = spawn(cmd, {
+    const childEnv = { ...process.env, THEME_DIR: themeDir };
+    // Spawn both processes independently for cross-platform support
+    // (Using shell `&` only works on Unix; on Windows cmd.exe it runs sequentially and hangs)
+    const tunnel = spawn("node", [tunnelScript], {
         stdio: "inherit",
         cwd,
-        env: { ...process.env, THEME_DIR: themeDir },
-        shell: true,
+        env: childEnv,
     });
-    child.on("exit", (code) => {
-        process.exit(code ?? 0);
+    const server = spawn("node", [indexScript], {
+        stdio: "inherit",
+        cwd,
+        env: childEnv,
+    });
+    let exitCode = 0;
+    function cleanup(code) {
+        exitCode = code;
+        tunnel.kill();
+        server.kill();
+    }
+    tunnel.on("exit", (code) => cleanup(code ?? 1));
+    server.on("exit", (code) => cleanup(code ?? 1));
+    process.on("SIGINT", () => {
+        tunnel.kill();
+        server.kill();
+        process.exit(exitCode);
+    });
+    process.on("SIGTERM", () => {
+        tunnel.kill();
+        server.kill();
+        process.exit(exitCode);
     });
 }
 function showMenu() {

package/dist/server/index.js

@@ -23,6 +23,7 @@ const port = Number(process.env.PORT) || 4000;
 const URL_FILE = path.resolve(process.cwd(), ".tunnel-url");
 const THEME_DIR = process.env.THEME_DIR || path.resolve(process.cwd(), "theme");
 const SECTIONS_DIR = path.join(THEME_DIR, "sections");
+const HOME_SECTIONS_DIR = path.join(THEME_DIR, "home-sections");
 const AUTH_READY_FILE = path.resolve(process.cwd(), ".auth-ready");
 app.use(express.json());
 function getBaseUrl(req) {
@@ -49,6 +50,26 @@ function buildSections() {
         template: fs.readFileSync(path.join(SECTIONS_DIR, file), "utf-8"),
     }));
 }
+function buildHomeSections() {
+    if (!fs.existsSync(HOME_SECTIONS_DIR))
+        return [];
+    const result = [];
+    const entries = fs.readdirSync(HOME_SECTIONS_DIR, { withFileTypes: true });
+    for (const entry of entries) {
+        if (!entry.isDirectory())
+            continue;
+        const key = entry.name.replace(/-/g, "_");
+        const folderPath = path.join(HOME_SECTIONS_DIR, entry.name);
+        const configPath = path.join(folderPath, "config.json");
+        const templatePath = path.join(folderPath, "template.liquid");
+        if (!fs.existsSync(configPath) || !fs.existsSync(templatePath))
+            continue;
+        const config = readJsonFile(configPath);
+        const template = fs.readFileSync(templatePath, "utf-8");
+        result.push({ key, ...config, template });
+    }
+    return result;
+}
 function extractSubdomain(input) {
     const trimmed = input.trim();
     try {
@@ -211,7 +232,9 @@ app.get("/theme", (req, res) => {
     const baseUrl = getBaseUrl(req);
     res.json({
         sections: buildSections(),
+        home_sections: buildHomeSections(),
         theme_data: readJsonFile(path.join(THEME_DIR, "theme-data.json")),
+        theme_data_schema: readJsonFile(path.join(THEME_DIR, "schema.json")),
         config: readJsonFile(path.join(THEME_DIR, "config.json")),
         style: `${baseUrl}/style.css`,
         script: `${baseUrl}/script.js`,

package/dist/template/theme/config.json

@@ -3,20 +3,7 @@
     "logo": "",
     "pages": [
       {
-        "slug": "terms-and-conditions",
-        "title": "شروط الاستخدام"
-      },
-      {
-        "slug": "shipping-policy",
-        "title": "سياسة الشحن"
-      },
-      {
-        "slug": "refund-policy",
-        "title": "سياسة الاستبدال و الاسترجاع"
-      },
-      {
-        "slug": "privacy-policy",
-        "title": "سياسات الخصوصية"
+        "id": "ADD_PAGE_ID_HERE"
       }
     ],
     "social": [
@@ -47,16 +34,7 @@
     ],
     "categories": [
       {
-        "name": "Men",
-        "slug": "womens-accessories"
-      },
-      {
-        "name": "Women",
-        "slug": "mens-accessories"
-      },
-      {
-        "name": "New Arrival",
-        "slug": "98"
+        "id": "ADD_CATEGORY_ID_HERE"
       }
     ],
     "payment_img": "https://easyorders.fra1.digitaloceanspaces.com/1773958283329740254payment_icons.svg",
@@ -66,45 +44,39 @@
     "logo": "",
     "links": [
       {
-        "url": "/collections/womens-accessories",
-        "name": "Men",
-        "slug": "womens-accessories",
-        "type": "category"
-      },
-      {
-        "url": "/collections/mens-accessories",
-        "name": "Women",
-        "slug": "mens-accessories",
+        "id": "ADD_CATEGORY_ID_HERE",
         "type": "category"
       },
       {
-        "url": "/collections/98",
-        "name": "New Arrival",
-        "slug": "98",
-        "type": "category"
-      },
-      {
-        "url": "/collections/30-off-tree-runner-go-tree-gliders",
-        "name": "Sale",
-        "slug": "30-off-tree-runner-go-tree-gliders",
-        "type": "category"
+        "id": "ADD_PAGE_ID_HERE",
+        "type": "page"
       }
     ],
     "is_use_config": true
   },
   "palette": {
-    "ft_bg": "",
-    "hd_bg": "#a4e6b6",
-    "ann_bg": "#000000",
-    "ft_text": "",
+    "hd_bg": "",
     "hd_text": "",
+    "ann_bg": "",
     "ann_text": "",
+    "ft_bg": "",
+    "ft_text": "",
     "buy_btn_bg": "",
-    "crt_btn_bg": "",
     "buy_btn_text": "",
-    "crt_btn_text": "",
     "buy_btn_border": "",
-    "crt_btn_border": ""
+    "crt_btn_bg": "",
+    "crt_btn_text": "",
+    "crt_btn_border": "",
+    "product_name_text": "",
+    "product_price_text": "",
+    "product_sale_price_text": "",
+    "body_bg": "",
+    "body_text": "",
+    "input_border": "",
+    "input_bg": "",
+    "input_text": "",
+    "checkout_form_bg": "",
+    "checkout_heading_text": ""
   },
   "theme_data": {
     "hero_slides": [],

package/dist/template/theme/home-sections/category-mosaic/config.json

@@ -0,0 +1,40 @@
+{
+  "icon": "https://api.iconify.design/lucide:grid-3x3.svg",
+  "label": "Category mosaic",
+  "section_schema": [
+    {
+      "name": "title",
+      "type": "string",
+      "default": "Shop by mood",
+      "description": "Section heading"
+    },
+    {
+      "name": "subtitle",
+      "type": "string",
+      "default": "Curated drops for work, weekend, and everything between.",
+      "description": "Subheading under the title"
+    },
+    {
+      "name": "columns",
+      "type": "select",
+      "default": "3",
+      "description": "Columns on large screens",
+      "options": [
+        { "label": "Two columns", "value": "2" },
+        { "label": "Three columns", "value": "3" },
+        { "label": "Four columns", "value": "4" }
+      ]
+    },
+    {
+      "name": "gap_tight",
+      "type": "boolean",
+      "default": false,
+      "description": "Use tighter spacing between tiles"
+    },
+    {
+      "name": "mosaic_category_ids",
+      "type": "category_multi_select",
+      "description": "Categories to show as tiles (search and reorder in the picker). Images and titles load from each category."
+    }
+  ]
+}

package/dist/template/theme/home-sections/category-mosaic/template.liquid

@@ -0,0 +1,155 @@
+<section
+  class="category-mosaic eo-hs{% if section_data.gap_tight %} category-mosaic--tight{% endif %}{% if section_data.mosaic_category_ids == blank or section_data.mosaic_category_ids.size == 0 %} eo-hs--empty{% endif %}"
+  style="--mosaic-cols: {{ section_data.columns | default: '3' }};"
+  data-eo-hs-entity="categories"
+  data-eo-hs-ids="{{ section_data.mosaic_category_ids | join: ',' | strip }}"
+>
+  <div class="category-mosaic__head">
+    {% if section_data.title != blank %}
+      <h2 class="category-mosaic__title">{{ section_data.title }}</h2>
+    {% endif %}
+    {% if section_data.subtitle != blank %}
+      <p class="category-mosaic__subtitle">{{ section_data.subtitle }}</p>
+    {% endif %}
+  </div>
+
+  <div class="category-mosaic__grid" data-eo-hs-mount>
+    {% if section_data.mosaic_category_ids and section_data.mosaic_category_ids.size > 0 %}
+      {% for id in section_data.mosaic_category_ids %}
+        <div class="eo-hs-skeleton eo-hs-skeleton--category" aria-hidden="true"></div>
+      {% endfor %}
+    {% else %}
+      <p class="category-mosaic__placeholder">Choose categories in the section settings to build this mosaic.</p>
+    {% endif %}
+  </div>
+</section>
+
+<style>
+  .category-mosaic {
+    padding: clamp(2.5rem, 5vw, 4rem) 1.25rem 3rem;
+    background: #fff;
+    color: #141218;
+  }
+  .category-mosaic--tight .category-mosaic__grid {
+    gap: 0.75rem;
+  }
+  .category-mosaic__head {
+    max-width: 720px;
+    margin: 0 auto 2rem;
+    text-align: center;
+  }
+  .category-mosaic__title {
+    margin: 0 0 0.5rem;
+    font-family: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
+    font-weight: 500;
+    font-size: clamp(1.75rem, 4vw, 2.35rem);
+  }
+  .category-mosaic__subtitle {
+    margin: 0;
+    font-size: 1rem;
+    line-height: 1.6;
+    color: #5c5852;
+  }
+  .category-mosaic__grid {
+    max-width: 1200px;
+    margin: 0 auto;
+    display: grid;
+    grid-template-columns: repeat(var(--mosaic-cols, 3), minmax(0, 1fr));
+    gap: 1.25rem;
+  }
+  .category-mosaic__grid.eo-hs-loading {
+    opacity: 0.85;
+  }
+  @media (max-width: 899px) {
+    .category-mosaic__grid {
+      grid-template-columns: repeat(2, minmax(0, 1fr));
+    }
+  }
+  @media (max-width: 520px) {
+    .category-mosaic__grid {
+      grid-template-columns: 1fr;
+    }
+  }
+  .category-mosaic .eo-hs-skeleton--category {
+    aspect-ratio: 3 / 4;
+    border-radius: 6px;
+    background: linear-gradient(110deg, #ece8e2 8%, #f5f2ee 18%, #ece8e2 33%);
+    background-size: 200% 100%;
+    animation: category-mosaic-shimmer 1.2s ease-in-out infinite;
+  }
+  .category-mosaic__placeholder {
+    grid-column: 1 / -1;
+    margin: 0;
+    padding: 1.25rem;
+    text-align: center;
+    color: #7a7368;
+    font-size: 0.9rem;
+  }
+  .category-mosaic.eo-hs--empty .category-mosaic__grid {
+    display: flex;
+    justify-content: center;
+  }
+  .category-mosaic .eo-hs-card--category {
+    position: relative;
+    display: block;
+    text-decoration: none;
+    color: inherit;
+    border-radius: 6px;
+    overflow: hidden;
+    background: #ece8e1;
+    transition: transform 0.25s ease, box-shadow 0.25s ease;
+  }
+  .category-mosaic .eo-hs-card--category:hover {
+    transform: translateY(-4px);
+    box-shadow: 0 22px 50px rgba(20, 18, 24, 0.18);
+  }
+  .category-mosaic .eo-hs-card--category .eo-hs-card__media {
+    display: block;
+    aspect-ratio: 3 / 4;
+    background: #ece8e2;
+    overflow: hidden;
+  }
+  .category-mosaic .eo-hs-card--category .eo-hs-card__media--empty {
+    min-height: 200px;
+  }
+  .category-mosaic .eo-hs-card--category .eo-hs-card__media img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    display: block;
+    transition: transform 0.45s ease;
+  }
+  .category-mosaic .eo-hs-card--category:hover .eo-hs-card__media img {
+    transform: scale(1.04);
+  }
+  .category-mosaic .eo-hs-card--category .eo-hs-card__body {
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    padding: 1.25rem 1.1rem 1.1rem;
+    background: linear-gradient(to top, rgba(12, 10, 14, 0.72), transparent 55%);
+  }
+  .category-mosaic .eo-hs-card--category .eo-hs-card__title {
+    font-size: 1.05rem;
+    font-weight: 600;
+    letter-spacing: 0.02em;
+    color: #fff;
+  }
+  .category-mosaic .eo-hs-error {
+    grid-column: 1 / -1;
+    margin: 0;
+    padding: 1rem;
+    text-align: center;
+    font-size: 0.88rem;
+    color: #8b3225;
+  }
+  @keyframes category-mosaic-shimmer {
+    0% {
+      background-position: 100% 0;
+    }
+    100% {
+      background-position: -100% 0;
+    }
+  }
+</style>

package/dist/template/theme/home-sections/editorial-feature/config.json

@@ -0,0 +1,67 @@
+{
+  "icon": "https://api.iconify.design/lucide:layout-template.svg",
+  "label": "Editorial feature",
+  "section_schema": [
+    {
+      "name": "image",
+      "type": "image",
+      "default": "",
+      "description": "Feature image"
+    },
+    {
+      "name": "eyebrow",
+      "type": "string",
+      "default": "Inside the atelier",
+      "description": "Small label above the title"
+    },
+    {
+      "name": "title",
+      "type": "string",
+      "default": "Tailoring that moves with you",
+      "description": "Headline"
+    },
+    {
+      "name": "body",
+      "type": "string",
+      "default": "Precision cuts and fluid fabrics—designed for city days and slow evenings. Discover the pieces our stylists reach for first.",
+      "description": "Body copy"
+    },
+    {
+      "name": "cta_label",
+      "type": "string",
+      "default": "Explore the story",
+      "description": "Link label"
+    },
+    {
+      "name": "cta_page_id",
+      "type": "page_single_select",
+      "description": "Simple page the CTA opens (link URL is resolved on the storefront)"
+    },
+    {
+      "name": "image_position",
+      "type": "select",
+      "default": "left",
+      "description": "Image side on desktop",
+      "options": [
+        { "label": "Image left", "value": "left" },
+        { "label": "Image right", "value": "right" }
+      ]
+    },
+    {
+      "name": "surface",
+      "type": "select",
+      "default": "light",
+      "description": "Color mood",
+      "options": [
+        { "label": "Light editorial", "value": "light" },
+        { "label": "Dark editorial", "value": "dark" }
+      ]
+    },
+    {
+      "name": "accent_color",
+      "type": "color",
+      "default": "#8B7355",
+      "description": "Eyebrow and link accent"
+    }
+  ]
+}

package/dist/template/theme/home-sections/editorial-feature/template.liquid

@@ -0,0 +1,153 @@
+<section
+  class="editorial-feature editorial-feature--{{ section_data.surface | default: 'light' }} editorial-feature--img-{{ section_data.image_position | default: 'left' }}"
+  style="--ed-accent: {{ section_data.accent_color | default: '#8B7355' }};"
+>
+  <div class="editorial-feature__grid">
+    <div class="editorial-feature__media">
+      {% if section_data.image != blank %}
+        <img
+          class="editorial-feature__img"
+          src="{{ section_data.image }}"
+          alt="{{ section_data.title | default: 'Feature' }}"
+          loading="lazy"
+          width="900"
+          height="1100"
+        />
+      {% else %}
+        <div class="editorial-feature__placeholder" role="img" aria-label=""></div>
+      {% endif %}
+    </div>
+    <div class="editorial-feature__copy">
+      {% if section_data.eyebrow != blank %}
+        <p class="editorial-feature__eyebrow">{{ section_data.eyebrow }}</p>
+      {% endif %}
+      {% if section_data.title != blank %}
+        <h2 class="editorial-feature__title">{{ section_data.title }}</h2>
+      {% endif %}
+      {% if section_data.body != blank %}
+        <p class="editorial-feature__body">{{ section_data.body }}</p>
+      {% endif %}
+      {% if section_data.cta_label != blank %}
+        <a
+          class="editorial-feature__link"
+          href="#"
+          {% if section_data.cta_page_id != blank %}
+            data-eo-hs-cta="1"
+            data-eo-hs-cta-entity="pages"
+            data-eo-hs-cta-id="{{ section_data.cta_page_id }}"
+          {% endif %}
+        >
+          {{ section_data.cta_label }}
+          <span class="editorial-feature__link-arrow" aria-hidden="true">→</span>
+        </a>
+      {% endif %}
+    </div>
+  </div>
+</section>
+
+<style>
+  .editorial-feature {
+    padding: clamp(2.5rem, 5vw, 4.5rem) 1.25rem;
+  }
+  .editorial-feature--light {
+    background: #f6f3ee;
+    color: #1c1a17;
+  }
+  .editorial-feature--dark {
+    background: #121015;
+    color: #f4eee6;
+  }
+  .editorial-feature__grid {
+    max-width: 1120px;
+    margin: 0 auto;
+    display: grid;
+    gap: clamp(1.75rem, 4vw, 3rem);
+    align-items: center;
+  }
+  @media (min-width: 900px) {
+    .editorial-feature__grid {
+      grid-template-columns: 1.05fr 1fr;
+    }
+    .editorial-feature--img-right .editorial-feature__media {
+      order: 2;
+    }
+    .editorial-feature--img-right .editorial-feature__copy {
+      order: 1;
+    }
+  }
+  .editorial-feature__media {
+    position: relative;
+  }
+  .editorial-feature__img {
+    width: 100%;
+    display: block;
+    border-radius: 4px;
+    object-fit: cover;
+    aspect-ratio: 4 / 5;
+    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.18);
+  }
+  .editorial-feature--dark .editorial-feature__img {
+    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.55);
+  }
+  .editorial-feature__placeholder {
+    width: 100%;
+    aspect-ratio: 4 / 5;
+    border-radius: 4px;
+    background: linear-gradient(145deg, rgba(139, 115, 85, 0.35), rgba(28, 26, 23, 0.08));
+  }
+  .editorial-feature--dark .editorial-feature__placeholder {
+    background: linear-gradient(145deg, rgba(201, 169, 98, 0.25), rgba(0, 0, 0, 0.4));
+  }
+  .editorial-feature__copy {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    padding: 0.25rem 0;
+  }
+  .editorial-feature__eyebrow {
+    margin: 0;
+    font-size: 0.72rem;
+    letter-spacing: 0.28em;
+    text-transform: uppercase;
+    font-weight: 600;
+    color: var(--ed-accent, #8b7355);
+  }
+  .editorial-feature__title {
+    margin: 0;
+    font-family: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
+    font-weight: 500;
+    font-size: clamp(1.85rem, 4vw, 2.65rem);
+    line-height: 1.15;
+  }
+  .editorial-feature__body {
+    margin: 0;
+    font-size: 1.02rem;
+    line-height: 1.75;
+    opacity: 0.88;
+    max-width: 34rem;
+  }
+  .editorial-feature__link {
+    margin-top: 0.25rem;
+    display: inline-flex;
+    align-items: center;
+    gap: 0.5rem;
+    font-size: 0.82rem;
+    font-weight: 600;
+    letter-spacing: 0.18em;
+    text-transform: uppercase;
+    text-decoration: none;
+    color: var(--ed-accent, #8b7355);
+    border-bottom: 1px solid currentColor;
+    padding-bottom: 2px;
+    width: fit-content;
+    transition: gap 0.2s ease, opacity 0.2s ease;
+  }
+  .editorial-feature__link:hover {
+    gap: 0.65rem;
+    opacity: 0.85;
+  }
+  .editorial-feature__link-arrow {
+    font-size: 1rem;
+    line-height: 1;
+  }
+</style>