cloudcommerce 0.23.2 → 0.24.0

package/packages/storefront/dist/server/chunks/pages/{index.astro.f1104ab2.mjs → index.astro.0f31fa39.mjs}

@@ -1,5 +1,5 @@
-import { c as createAstro, a as createComponent, r as renderTemplate, b as renderComponent, m as maybeRenderHead, d as addAttribute, u as unescapeHTML, F as Fragment$1 } from '../astro.6adaff02.mjs';
-import { c as $$Picture, p as parseShippingPhrase, _ as _export_sfc, C as Carousel, d as CarouselControl, e as addProductToCart, P as Prices, l as loadRouteContext, $ as $$BaseHead, a as $$PageHeader, b as $$Base } from './_...slug_.astro.501582b9.mjs';
+import { c as createAstro, a as createComponent, r as renderTemplate, b as renderComponent, m as maybeRenderHead, d as addAttribute, u as unescapeHTML, F as Fragment$1 } from '../astro.a7611b51.mjs';
+import { $ as $$Picture, p as parseShippingPhrase, _ as _export_sfc, C as Carousel, a as CarouselControl, b as addProductToCart, P as Prices, l as loadRouteContext, c as $$BaseHead, d as $$PageHeader, e as $$Base } from './_...slug_.astro.0f33557e.mjs';
 import { ref, shallowReactive, computed, useSSRContext, defineComponent, mergeProps, createVNode, resolveDynamicComponent, withCtx, renderSlot, createTextVNode, toDisplayString, withDirectives, vShow, openBlock, createBlock, Fragment, renderList, resolveComponent, createCommentVNode, withModifiers, withAsyncContext } from 'vue';
 import api from '@cloudcommerce/api';
 import { inStock, price, name, img, onPromotion } from '@ecomplus/utils';
@@ -234,8 +234,7 @@ const $$BannerPictures = createComponent(async ($$result, $$props, $$slots) => {
   if (!mobileWidths?.length) {
     mobileWidths = [720, 856];
   }
-  return renderTemplate`${img && renderTemplate`${renderComponent($$result, "Picture", $$Picture, { "src": img, "alt": alt || "", "widths": widths, "fetchpriority": index === 0 ? "high" : "low", "loading": index === 0 ? "eager" : "lazy", "class": `${mobileImg ? "hidden md:block " : ""}mx-auto ${className}` })}`}
-${mobileImg && renderTemplate`${renderComponent($$result, "Picture", $$Picture, { "src": mobileImg, "alt": alt || "", "widths": mobileWidths, "fetchpriority": index === 0 ? "high" : "low", "loading": index === 0 ? "eager" : "lazy", "class": `md:hidden mx-auto ${mobileClass}` })}`}`;
+  return renderTemplate`${img && renderTemplate`${renderComponent($$result, "Picture", $$Picture, { "src": img, "alt": alt || "", "widths": widths, "fetchpriority": index === 0 ? "high" : "low", "loading": index === 0 ? "eager" : "lazy", "class": `${mobileImg ? "hidden md:block " : ""}mx-auto ${className}` })}`}${mobileImg && renderTemplate`${renderComponent($$result, "Picture", $$Picture, { "src": mobileImg, "alt": alt || "", "widths": mobileWidths, "fetchpriority": index === 0 ? "high" : "low", "loading": index === 0 ? "eager" : "lazy", "class": `md:hidden mx-auto ${mobileClass}` })}`}`;
 }, "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/lib/components/BannerPictures.astro", void 0);
 
 const useBanner = (props) => {
@@ -492,13 +491,7 @@ const $$BannersGrid = createComponent(async ($$result, $$props, $$slots) => {
   const Astro2 = $$result.createAstro($$Astro$4, $$props, $$slots);
   Astro2.self = $$BannersGrid;
   const { banners } = Astro2.props;
-  return renderTemplate`${maybeRenderHead()}<section class="ui-section">
-  <ul class="flex flex-wrap lg:flex-nowrap gap-4">
-    ${banners.map((banner) => renderTemplate`<li class="lg:flex-1 [&_img]:w-full [&_img]:object-cover">
-        ${renderComponent($$result, "Banner", Banner, { ...banner }, { "picture": ($$result2) => renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { ...banner, "slot": "picture" })}` })}
-      </li>`)}
-  </ul>
-</section>`;
+  return renderTemplate`${maybeRenderHead()}<section class="ui-section"><ul class="flex flex-wrap lg:flex-nowrap gap-4">${banners.map((banner) => renderTemplate`<li class="lg:flex-1 [&_img]:w-full [&_img]:object-cover">${renderComponent($$result, "Banner", Banner, { ...banner }, { "picture": ($$result2) => renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { ...banner, "slot": "picture" })}` })}</li>`)}</ul></section>`;
 }, "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/components/BannersGrid.astro", void 0);
 
 const useProductCard = (props) => {
@@ -889,8 +882,7 @@ const $$Sections = createComponent(async ($$result, $$props, $$slots) => {
       return { props: content };
     }
   });
-  return renderTemplate`${maybeRenderHead()}<article class="my-9 md:my-12">
-  ${sections.map(({ type, props }) => {
+  return renderTemplate`${maybeRenderHead()}<article class="my-9 md:my-12">${sections.map(({ type, props }) => {
     switch (type) {
       case "product-shelf":
         return renderTemplate`${renderComponent($$result, "ProductShelf", ProductShelf, { ...props, "client:visible": true, "client:component-hydration": "visible", "client:component-path": "~/components/ProductShelf.vue", "client:component-export": "default" })}`;
@@ -901,8 +893,7 @@ const $$Sections = createComponent(async ($$result, $$props, $$slots) => {
       default:
         return renderTemplate`<div${addAttribute(type, "data-section")}></div>`;
     }
-  })}
-</article>`;
+  })}</article>`;
 }, "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/main/Sections.astro", void 0);
 
 const $$Astro$2 = createAstro("https://ecom2-demo.web.app");
@@ -912,10 +903,7 @@ const $$Home = createComponent(async ($$result, $$props, $$slots) => {
   const { routeContext } = Astro2.locals;
   const { heroSlider } = await usePageHero({ routeContext });
   const heroSlides = heroSlider.slides;
-  return renderTemplate`${maybeRenderHead()}<main>
-  ${heroSlider.slides.length && renderTemplate`${renderComponent($$result, "HeroSlider", HeroSlider, { ...heroSlider, "client:load": true, "client:component-hydration": "load", "client:component-path": "~/components/HeroSlider.vue", "client:component-export": "default" }, { "picture-0": ($$result2) => renderTemplate`${heroSlides[0] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-0", ...heroSlides[0], "index": 0 })}`}`, "picture-1": ($$result2) => renderTemplate`${heroSlides[1] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-1", ...heroSlides[1], "index": 1 })}`}`, "picture-2": ($$result2) => renderTemplate`${heroSlides[2] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-2", ...heroSlides[2], "index": 2 })}`}`, "picture-3": ($$result2) => renderTemplate`${heroSlides[3] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-3", ...heroSlides[3], "index": 3 })}`}`, "picture-4": ($$result2) => renderTemplate`${heroSlides[4] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-4", ...heroSlides[4], "index": 4 })}`}`, "picture-5": ($$result2) => renderTemplate`${heroSlides[5] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-5", ...heroSlides[5], "index": 5 })}`}`, "picture-6": ($$result2) => renderTemplate`${heroSlides[6] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-6", ...heroSlides[6], "index": 6 })}`}`, "picture-7": ($$result2) => renderTemplate`${heroSlides[7] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-7", ...heroSlides[7], "index": 7 })}`}`, "picture-8": ($$result2) => renderTemplate`${heroSlides[8] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-8", ...heroSlides[8], "index": 8 })}`}`, "picture-9": ($$result2) => renderTemplate`${heroSlides[9] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-9", ...heroSlides[9], "index": 9 })}`}` })}`}
-  ${renderComponent($$result, "Sections", $$Sections, {})}
-</main>`;
+  return renderTemplate`${maybeRenderHead()}<main>${heroSlider.slides.length && renderTemplate`${renderComponent($$result, "HeroSlider", HeroSlider, { ...heroSlider, "client:load": true, "client:component-hydration": "load", "client:component-path": "~/components/HeroSlider.vue", "client:component-export": "default" }, { "picture-0": ($$result2) => renderTemplate`${heroSlides[0] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-0", ...heroSlides[0], "index": 0 })}`}`, "picture-1": ($$result2) => renderTemplate`${heroSlides[1] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-1", ...heroSlides[1], "index": 1 })}`}`, "picture-2": ($$result2) => renderTemplate`${heroSlides[2] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-2", ...heroSlides[2], "index": 2 })}`}`, "picture-3": ($$result2) => renderTemplate`${heroSlides[3] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-3", ...heroSlides[3], "index": 3 })}`}`, "picture-4": ($$result2) => renderTemplate`${heroSlides[4] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-4", ...heroSlides[4], "index": 4 })}`}`, "picture-5": ($$result2) => renderTemplate`${heroSlides[5] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-5", ...heroSlides[5], "index": 5 })}`}`, "picture-6": ($$result2) => renderTemplate`${heroSlides[6] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-6", ...heroSlides[6], "index": 6 })}`}`, "picture-7": ($$result2) => renderTemplate`${heroSlides[7] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-7", ...heroSlides[7], "index": 7 })}`}`, "picture-8": ($$result2) => renderTemplate`${heroSlides[8] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-8", ...heroSlides[8], "index": 8 })}`}`, "picture-9": ($$result2) => renderTemplate`${heroSlides[9] && renderTemplate`${renderComponent($$result2, "BannerPictures", $$BannerPictures, { "slot": "picture-9", ...heroSlides[9], "index": 9 })}`}` })}`}${renderComponent($$result, "Sections", $$Sections, {})}</main>`;
 }, "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/main/Home.astro", void 0);
 
 const $$Astro$1 = createAstro("https://ecom2-demo.web.app");
@@ -932,14 +920,7 @@ const $$Index$1 = createComponent(async ($$result, $$props, $$slots) => {
     }
     loadError = err;
   }
-  return renderTemplate`<html${addAttribute(routeContext?.lang.replace("_", "-"), "lang")}>
-${routeContext && renderTemplate`${renderComponent($$result, "Base", $$Base, {}, { "base-head": ($$result2) => renderTemplate`${renderComponent($$result2, "BaseHead", $$BaseHead, { "slot": "base-head" })}`, "default": ($$result2) => renderTemplate`
-    
-    ${renderComponent($$result2, "PageHeader", $$PageHeader, {})}
-    ${renderComponent($$result2, "HomeMain", $$Home, {})}
-  ` })}`}
-${loadError && renderTemplate`${renderComponent($$result, "Fragment", Fragment$1, {}, { "default": ($$result2) => renderTemplate`${unescapeHTML(loadError.responseHTML)}` })}`}
-</html>`;
+  return renderTemplate`<html${addAttribute(routeContext?.lang.replace("_", "-"), "lang")}>${routeContext && renderTemplate`${renderComponent($$result, "Base", $$Base, {}, { "base-head": ($$result2) => renderTemplate`${renderComponent($$result2, "BaseHead", $$BaseHead, { "slot": "base-head" })}`, "default": ($$result2) => renderTemplate`${renderComponent($$result2, "PageHeader", $$PageHeader, {})}${renderComponent($$result2, "HomeMain", $$Home, {})}` })}`}${loadError && renderTemplate`${renderComponent($$result, "Fragment", Fragment$1, {}, { "default": ($$result2) => renderTemplate`${unescapeHTML(loadError.responseHTML)}` })}`}</html>`;
 }, "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/index.astro", void 0);
 
 const $$file$1 = "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/index.astro";

package/packages/storefront/dist/server/chunks/pages/{fallback.astro.8d1c6076.mjs → ~fallback.astro.bd93f01e.mjs}

@@ -1,5 +1,5 @@
-import { c as createAstro, a as createComponent, r as renderTemplate, m as maybeRenderHead, d as addAttribute, b as renderComponent } from '../astro.6adaff02.mjs';
-import { l as loadRouteContext, $ as $$BaseHead, a as $$PageHeader, b as $$Base } from './_...slug_.astro.501582b9.mjs';
+import { c as createAstro, a as createComponent, r as renderTemplate, m as maybeRenderHead, d as addAttribute, b as renderComponent } from '../astro.a7611b51.mjs';
+import { l as loadRouteContext, c as $$BaseHead, d as $$PageHeader, e as $$Base } from './_...slug_.astro.0f33557e.mjs';
 import 'path-to-regexp';
 import 'cookie';
 import '@astrojs/internal-helpers/path';
@@ -10,16 +10,9 @@ import 'node:tls';
 import 'mime';
 import 'string-width';
 import 'html-escaper';
-import 'node:fs/promises';
-import 'node:path';
-import 'node:url';
-import 'http-cache-semantics';
-import 'node:os';
-import 'image-size';
-import 'magic-string';
-import 'node:stream';
 import '@cloudcommerce/api';
 import 'node:events';
+import 'node:path';
 import '@cloudcommerce/config';
 import '@ecomplus/utils';
 /* empty css                               */import 'vue';
@@ -28,38 +21,28 @@ import 'vue/server-renderer';
 import '@headlessui/vue';
 
 const $$Astro$1 = createAstro("https://ecom2-demo.web.app");
-const $$Fallback$1 = createComponent(async ($$result, $$props, $$slots) => {
+const $$Fallback = createComponent(async ($$result, $$props, $$slots) => {
   const Astro2 = $$result.createAstro($$Astro$1, $$props, $$slots);
-  Astro2.self = $$Fallback$1;
-  return renderTemplate`${maybeRenderHead()}<main>
-  <h1>Error :/</h1>
-  <p class="instructions">
-    Check out the <code>src/pages</code> directory to get started.<br>
-    <strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message above.
-  </p>
-</main>`;
+  Astro2.self = $$Fallback;
+  return renderTemplate`${maybeRenderHead()}<main><h1>Error :/</h1><p class="instructions">
+Check out the <code>src/pages</code> directory to get started.<br><strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message above.
+</p></main>`;
 }, "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/main/Fallback.astro", void 0);
 
 const $$Astro = createAstro("https://ecom2-demo.web.app");
-const $$Fallback = createComponent(async ($$result, $$props, $$slots) => {
+const $$fallback = createComponent(async ($$result, $$props, $$slots) => {
   const Astro2 = $$result.createAstro($$Astro, $$props, $$slots);
-  Astro2.self = $$Fallback;
+  Astro2.self = $$fallback;
   let routeContext;
   try {
     routeContext = await loadRouteContext(Astro2);
   } catch (err) {
     return err.astroResponse;
   }
-  return renderTemplate`<html${addAttribute(routeContext?.lang.replace("_", "-"), "lang")}>
-${renderComponent($$result, "Base", $$Base, {}, { "base-head": ($$result2) => renderTemplate`${renderComponent($$result2, "BaseHead", $$BaseHead, { "slot": "base-head" })}`, "default": ($$result2) => renderTemplate`
-  
-  ${renderComponent($$result2, "PageHeader", $$PageHeader, {})}
-  ${renderComponent($$result2, "FallbackMain", $$Fallback$1, {})}
-` })}
-</html>`;
-}, "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/fallback.astro", void 0);
+  return renderTemplate`<html${addAttribute(routeContext?.lang.replace("_", "-"), "lang")}>${renderComponent($$result, "Base", $$Base, {}, { "base-head": ($$result2) => renderTemplate`${renderComponent($$result2, "BaseHead", $$BaseHead, { "slot": "base-head" })}`, "default": ($$result2) => renderTemplate`${renderComponent($$result2, "PageHeader", $$PageHeader, {})}${renderComponent($$result2, "FallbackMain", $$Fallback, {})}` })}</html>`;
+}, "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/~fallback.astro", void 0);
 
-const $$file = "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/fallback.astro";
-const $$url = "/fallback";
+const $$file = "/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/~fallback.astro";
+const $$url = "/~fallback";
 
-export { $$Fallback as default, $$file as file, $$url as url };
+export { $$fallback as default, $$file as file, $$url as url };

package/packages/storefront/dist/server/chunks/{fallback@_@astro.9f73db0f.mjs → ~fallback@_@astro.d17419ae.mjs}

@@ -1,6 +1,6 @@
 export { renderers } from '../renderers.mjs';
 export { onRequest } from '../_empty-middleware.mjs';
-import './astro.6adaff02.mjs';
+import './astro.a7611b51.mjs';
 import 'path-to-regexp';
 import 'cookie';
 import '@astrojs/internal-helpers/path';
@@ -14,21 +14,14 @@ import 'html-escaper';
 import 'vue';
 import 'vue/server-renderer';
 import '@ecomplus/utils';
-import './pages/_...slug_.astro.501582b9.mjs';
-import 'node:fs/promises';
-import 'node:path';
-import 'node:url';
-import 'http-cache-semantics';
-import 'node:os';
-import 'image-size';
-import 'magic-string';
-import 'node:stream';
+import './pages/_...slug_.astro.0f33557e.mjs';
 import '@cloudcommerce/api';
 import 'node:events';
+import 'node:path';
 import '@cloudcommerce/config';
 /* empty css                              */import '@vueuse/core';
 import '@headlessui/vue';
 
-const page = () => import('./pages/fallback.astro.8d1c6076.mjs');
+const page = () => import('./pages/~fallback.astro.bd93f01e.mjs');
 
 export { page };

package/packages/storefront/dist/server/entry.mjs

@@ -3,11 +3,12 @@ import { webcrypto } from 'node:crypto';
 import { ByteLengthQueuingStrategy, CountQueuingStrategy, ReadableByteStreamController, ReadableStream, ReadableStreamBYOBReader, ReadableStreamBYOBRequest, ReadableStreamDefaultController, ReadableStreamDefaultReader, TransformStream, WritableStream, WritableStreamDefaultController, WritableStreamDefaultWriter } from 'node:stream/web';
 import { File, FormData, Headers, Request, Response, fetch } from 'undici';
 import { setTimeout as setTimeout$1, clearTimeout as clearTimeout$1 } from 'node:timers';
-import { N as NodeApp, g as deserializeManifest } from './chunks/astro.6adaff02.mjs';
+import { N as NodeApp, g as deserializeManifest } from './chunks/astro.a7611b51.mjs';
 import { Readable } from 'stream';
 import https from 'https';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
+import os from 'os';
 import fs from 'node:fs';
 import http from 'node:http';
 import send from 'send';
@@ -24,13 +25,7 @@ import 'html-escaper';
 import 'vue';
 import 'vue/server-renderer';
 import '@ecomplus/utils';
-import './chunks/pages/_...slug_.astro.501582b9.mjs';
-import 'node:fs/promises';
-import 'http-cache-semantics';
-import 'node:os';
-import 'image-size';
-import 'magic-string';
-import 'node:stream';
+import './chunks/pages/_...slug_.astro.0f33557e.mjs';
 import '@cloudcommerce/api';
 import 'node:events';
 import '@cloudcommerce/config';
@@ -2677,6 +2672,33 @@ async function writeWebResponse(app, res, webResponse) {
   res.end();
 }
 
+const wildcardHosts = /* @__PURE__ */ new Set(["0.0.0.0", "::", "0000:0000:0000:0000:0000:0000:0000:0000"]);
+function getNetworkAddress(protocol = "http", hostname, port, base) {
+  const NetworkAddress = {
+    local: [],
+    network: []
+  };
+  Object.values(os.networkInterfaces()).flatMap((nInterface) => nInterface ?? []).filter(
+    (detail) => detail && detail.address && (detail.family === "IPv4" || // @ts-expect-error Node 18.0 - 18.3 returns number
+    detail.family === 4)
+  ).forEach((detail) => {
+    let host = detail.address.replace(
+      "127.0.0.1",
+      hostname === void 0 || wildcardHosts.has(hostname) ? "localhost" : hostname
+    );
+    if (host.includes(":")) {
+      host = `[${host}]`;
+    }
+    const url = `${protocol}://${host}:${port}${base ? base : ""}`;
+    if (detail.address.includes("127.0.0.1")) {
+      NetworkAddress.local.push(url);
+    } else {
+      NetworkAddress.network.push(url);
+    }
+  });
+  return NetworkAddress;
+}
+
 function parsePathname(pathname, host, port) {
   try {
     const urlPathname = new URL(pathname, `http://${host}:${port}`).pathname;
@@ -2802,7 +2824,17 @@ function startServer$1(app, options) {
     handler
   );
   const protocol = server.server instanceof https.Server ? "https" : "http";
-  console.log(`Server listening on ${protocol}://${host}:${port}`);
+  const address = getNetworkAddress(protocol, host, port);
+  if (host === void 0) {
+    console.log(
+      `Preview server listening on 
+  local: ${address.local[0]} 	
+  network: ${address.network[0]}
+`
+    );
+  } else {
+    console.log(`Preview server listening on ${address.local[0]}`);
+  }
   return {
     server,
     done: server.closed()
@@ -2833,13 +2865,12 @@ const adapter = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
   start
 }, Symbol.toStringTag, { value: 'Module' }));
 
-const _page0  = () => import('./chunks/endpoint@_@js.b79eed3b.mjs');
-const _page1  = () => import('./chunks/index@_@astro.66b84ac2.mjs');
-const _page2  = () => import('./chunks/fallback@_@astro.9f73db0f.mjs');
-const _page3  = () => import('./chunks/index@_@astro.0221a7bd.mjs');
-const _page4  = () => import('./chunks/account@_@astro.3e90f29a.mjs');
-const _page5  = () => import('./chunks/_...c5a36021.mjs');const pageMap = new Map([["../../node_modules/.pnpm/@astrojs+image@0.17.3_astro@2.10.2_sharp@0.32.4/node_modules/@astrojs/image/dist/endpoint.js", _page0],["src/pages/index.astro", _page1],["src/pages/fallback.astro", _page2],["src/pages/app/index.astro", _page3],["src/pages/app/account.astro", _page4],["src/pages/[...slug].astro", _page5]]);
-const _manifest = Object.assign(deserializeManifest({"adapterName":"@astrojs/node","routes":[{"file":"","links":[],"scripts":[],"styles":[],"routeData":{"type":"endpoint","route":"/_image","pattern":"^\\/_image$","segments":[[{"content":"_image","dynamic":false,"spread":false}]],"params":[],"component":"../../node_modules/.pnpm/@astrojs+image@0.17.3_astro@2.10.2_sharp@0.32.4/node_modules/@astrojs/image/dist/endpoint.js","pathname":"/_image","prerender":false,"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted.572313d6.js"}],"styles":[{"type":"external","src":"/_astro/_...slug_.07c1fa58.css"}],"routeData":{"route":"/","type":"page","pattern":"^\\/$","segments":[],"params":[],"component":"src/pages/index.astro","pathname":"/","prerender":false,"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted.572313d6.js"}],"styles":[{"type":"external","src":"/_astro/_...slug_.07c1fa58.css"}],"routeData":{"route":"/fallback","type":"page","pattern":"^\\/fallback\\/?$","segments":[[{"content":"fallback","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/fallback.astro","pathname":"/fallback","prerender":false,"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"styles":[],"routeData":{"route":"/app","type":"page","pattern":"^\\/app\\/?$","segments":[[{"content":"app","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/app/index.astro","pathname":"/app","prerender":false,"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"styles":[],"routeData":{"route":"/app/account","type":"page","pattern":"^\\/app\\/account\\/?$","segments":[[{"content":"app","dynamic":false,"spread":false}],[{"content":"account","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/app/account.astro","pathname":"/app/account","prerender":false,"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted.572313d6.js"}],"styles":[{"type":"external","src":"/_astro/_...slug_.07c1fa58.css"}],"routeData":{"route":"/[...slug]","type":"page","pattern":"^(?:\\/(.*?))?\\/?$","segments":[[{"content":"...slug","dynamic":true,"spread":true}]],"params":["...slug"],"component":"src/pages/[...slug].astro","prerender":false,"_meta":{"trailingSlash":"ignore"}}}],"site":"https://ecom2-demo.web.app","base":"/","compressHTML":false,"markdown":{"drafts":false,"syntaxHighlight":"shiki","shikiConfig":{"langs":[],"theme":"github-dark","wrap":false},"remarkPlugins":[],"rehypePlugins":[],"remarkRehype":{},"gfm":true,"smartypants":true},"componentMetadata":[["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/[...slug].astro",{"propagation":"none","containsHead":true}],["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/fallback.astro",{"propagation":"none","containsHead":true}],["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/index.astro",{"propagation":"none","containsHead":true}]],"renderers":[],"clientDirectives":[["idle","(()=>{var i=t=>{let e=async()=>{await(await t())()};\"requestIdleCallback\"in window?window.requestIdleCallback(e):setTimeout(e,200)};(self.Astro||(self.Astro={})).idle=i;window.dispatchEvent(new Event(\"astro:idle\"));})();"],["load","(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).load=e;window.dispatchEvent(new Event(\"astro:load\"));})();"],["media","(()=>{var s=(i,t)=>{let a=async()=>{await(await i())()};if(t.value){let e=matchMedia(t.value);e.matches?a():e.addEventListener(\"change\",a,{once:!0})}};(self.Astro||(self.Astro={})).media=s;window.dispatchEvent(new Event(\"astro:media\"));})();"],["only","(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).only=e;window.dispatchEvent(new Event(\"astro:only\"));})();"],["visible","(()=>{var r=(i,c,n)=>{let s=async()=>{await(await i())()},t=new IntersectionObserver(e=>{for(let o of e)if(o.isIntersecting){t.disconnect(),s();break}});for(let e of n.children)t.observe(e)};(self.Astro||(self.Astro={})).visible=r;window.dispatchEvent(new Event(\"astro:visible\"));})();"]],"entryModules":{"\u0000@astrojs-ssr-virtual-entry":"_@astrojs-ssr-virtual-entry.mjs","\u0000@astro-renderers":"renderers.mjs","\u0000empty-middleware":"_empty-middleware.mjs","/src/pages/app/account.astro":"chunks/pages/account.astro.53400a42.mjs","/src/pages/fallback.astro":"chunks/pages/fallback.astro.8d1c6076.mjs","\u0000@astro-page:../../node_modules/.pnpm/@astrojs+image@0.17.3_astro@2.10.2_sharp@0.32.4/node_modules/@astrojs/image/dist/endpoint@_@js":"chunks/endpoint@_@js.b79eed3b.mjs","\u0000@astro-page:src/pages/index@_@astro":"chunks/index@_@astro.66b84ac2.mjs","\u0000@astro-page:src/pages/fallback@_@astro":"chunks/fallback@_@astro.9f73db0f.mjs","\u0000@astro-page:src/pages/app/index@_@astro":"chunks/index@_@astro.0221a7bd.mjs","\u0000@astro-page:src/pages/app/account@_@astro":"chunks/account@_@astro.3e90f29a.mjs","\u0000@astro-page:src/pages/[...slug]@_@astro":"chunks/_...c5a36021.mjs","~/components/PitchBar.vue":"_astro/PitchBar.c2a2ad79.js","~/components/ProductShelf.vue":"_astro/ProductShelf.4a105932.js","@astrojs/vue/client.js":"_astro/client.9dbf6b61.js","~/components/HeroSlider.vue":"_astro/HeroSlider.8d2ea532.js","/astro/hoisted.js?q=0":"_astro/hoisted.572313d6.js","/home/leo/code/ecomplus/cloud-commerce/node_modules/workbox-window/build/workbox-window.prod.es5.mjs":"_astro/workbox-window.prod.es5.a7b12eab.js","~/components/ShopHeader.vue":"_astro/ShopHeader.2400b065.js","/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/lib/scripts/firebase-app.ts":"_astro/firebase-app.1df8af9a.js","astro:scripts/before-hydration.js":""},"assets":["/_astro/_...slug_.07c1fa58.css","/manifest.webmanifest","/robots.txt","/sw.js","/workbox-5e0bf4e4.js","/_astro/Carousel.63d511ab.js","/_astro/HeroSlider.8d2ea532.js","/_astro/PitchBar.c2a2ad79.js","/_astro/Prices.8572765c.js","/_astro/ProductShelf.4a105932.js","/_astro/ShopHeader.2400b065.js","/_astro/_plugin-vue_export-helper.48e557ba.js","/_astro/client.9dbf6b61.js","/_astro/firebase-app.1df8af9a.js","/_astro/hoisted.572313d6.js","/_astro/img.7def76a1.js","/_astro/index.c0c35ead.js","/_astro/preload-helper.cf010ec4.js","/_astro/session-utm.744b0db3.js","/_astro/workbox-window.prod.es5.a7b12eab.js","/img/icon.png","/img/large-icon.png","/img/uploads/banner2.webp","/img/uploads/ecom-icon.png","/img/uploads/headphone.webp","/img/uploads/logo.png","/img/uploads/og-image.png","/img/uploads/passion.webp","/img/uploads/rect8589.png","/img/uploads/rect859.png","/img/uploads/rect89.webp"]}), {
+const _page0  = () => import('./chunks/index@_@astro.42c693b9.mjs');
+const _page1  = () => import('./chunks/~fallback@_@astro.d17419ae.mjs');
+const _page2  = () => import('./chunks/index@_@astro.d898498a.mjs');
+const _page3  = () => import('./chunks/account@_@astro.a02ffb0b.mjs');
+const _page4  = () => import('./chunks/_...5323ec5a.mjs');const pageMap = new Map([["src/pages/index.astro", _page0],["src/pages/~fallback.astro", _page1],["src/pages/app/index.astro", _page2],["src/pages/app/account.astro", _page3],["src/pages/[...slug].astro", _page4]]);
+const _manifest = Object.assign(deserializeManifest({"adapterName":"@astrojs/node","routes":[{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted.572313d6.js"}],"styles":[{"type":"external","src":"/_astro/_...slug_.a786e016.css"}],"routeData":{"route":"/","type":"page","pattern":"^\\/$","segments":[],"params":[],"component":"src/pages/index.astro","pathname":"/","prerender":false,"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted.572313d6.js"}],"styles":[{"type":"external","src":"/_astro/_...slug_.a786e016.css"}],"routeData":{"route":"/~fallback","type":"page","pattern":"^\\/~fallback\\/?$","segments":[[{"content":"~fallback","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/~fallback.astro","pathname":"/~fallback","prerender":false,"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"styles":[],"routeData":{"route":"/app","type":"page","pattern":"^\\/app\\/?$","segments":[[{"content":"app","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/app/index.astro","pathname":"/app","prerender":false,"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"styles":[],"routeData":{"route":"/app/account","type":"page","pattern":"^\\/app\\/account\\/?$","segments":[[{"content":"app","dynamic":false,"spread":false}],[{"content":"account","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/app/account.astro","pathname":"/app/account","prerender":false,"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted.572313d6.js"}],"styles":[{"type":"external","src":"/_astro/_...slug_.a786e016.css"}],"routeData":{"route":"/[...slug]","type":"page","pattern":"^(?:\\/(.*?))?\\/?$","segments":[[{"content":"...slug","dynamic":true,"spread":true}]],"params":["...slug"],"component":"src/pages/[...slug].astro","prerender":false,"_meta":{"trailingSlash":"ignore"}}}],"site":"https://ecom2-demo.web.app","base":"/","compressHTML":true,"markdown":{"drafts":false,"syntaxHighlight":"shiki","shikiConfig":{"langs":[],"theme":"github-dark","wrap":false},"remarkPlugins":[],"rehypePlugins":[],"remarkRehype":{},"gfm":true,"smartypants":true},"componentMetadata":[["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/[...slug].astro",{"propagation":"none","containsHead":true}],["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/index.astro",{"propagation":"none","containsHead":true}],["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/~fallback.astro",{"propagation":"none","containsHead":true}]],"renderers":[],"clientDirectives":[["idle","(()=>{var i=t=>{let e=async()=>{await(await t())()};\"requestIdleCallback\"in window?window.requestIdleCallback(e):setTimeout(e,200)};(self.Astro||(self.Astro={})).idle=i;window.dispatchEvent(new Event(\"astro:idle\"));})();"],["load","(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).load=e;window.dispatchEvent(new Event(\"astro:load\"));})();"],["media","(()=>{var s=(i,t)=>{let a=async()=>{await(await i())()};if(t.value){let e=matchMedia(t.value);e.matches?a():e.addEventListener(\"change\",a,{once:!0})}};(self.Astro||(self.Astro={})).media=s;window.dispatchEvent(new Event(\"astro:media\"));})();"],["only","(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).only=e;window.dispatchEvent(new Event(\"astro:only\"));})();"],["visible","(()=>{var r=(i,c,n)=>{let s=async()=>{await(await i())()},t=new IntersectionObserver(e=>{for(let o of e)if(o.isIntersecting){t.disconnect(),s();break}});for(let e of n.children)t.observe(e)};(self.Astro||(self.Astro={})).visible=r;window.dispatchEvent(new Event(\"astro:visible\"));})();"]],"entryModules":{"\u0000@astrojs-ssr-virtual-entry":"_@astrojs-ssr-virtual-entry.mjs","\u0000@astro-renderers":"renderers.mjs","\u0000empty-middleware":"_empty-middleware.mjs","/src/pages/app/account.astro":"chunks/pages/account.astro.9325adb2.mjs","/src/pages/~fallback.astro":"chunks/pages/~fallback.astro.bd93f01e.mjs","\u0000@astro-page:src/pages/index@_@astro":"chunks/index@_@astro.42c693b9.mjs","\u0000@astro-page:src/pages/~fallback@_@astro":"chunks/~fallback@_@astro.d17419ae.mjs","\u0000@astro-page:src/pages/app/index@_@astro":"chunks/index@_@astro.d898498a.mjs","\u0000@astro-page:src/pages/app/account@_@astro":"chunks/account@_@astro.a02ffb0b.mjs","\u0000@astro-page:src/pages/[...slug]@_@astro":"chunks/_...5323ec5a.mjs","~/components/PitchBar.vue":"_astro/PitchBar.c2a2ad79.js","@astrojs/vue/client.js":"_astro/client.9dbf6b61.js","~/components/HeroSlider.vue":"_astro/HeroSlider.8d2ea532.js","~/components/ProductShelf.vue":"_astro/ProductShelf.4a105932.js","/astro/hoisted.js?q=0":"_astro/hoisted.572313d6.js","/home/leo/code/ecomplus/cloud-commerce/node_modules/workbox-window/build/workbox-window.prod.es5.mjs":"_astro/workbox-window.prod.es5.a7b12eab.js","~/components/ShopHeader.vue":"_astro/ShopHeader.2400b065.js","/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/lib/scripts/firebase-app.ts":"_astro/firebase-app.1df8af9a.js","astro:scripts/before-hydration.js":""},"assets":["/_astro/_...slug_.a786e016.css","/manifest.webmanifest","/robots.txt","/sw.js","/workbox-5e0bf4e4.js","/_astro/Carousel.63d511ab.js","/_astro/HeroSlider.8d2ea532.js","/_astro/PitchBar.c2a2ad79.js","/_astro/Prices.8572765c.js","/_astro/ProductShelf.4a105932.js","/_astro/ShopHeader.2400b065.js","/_astro/_plugin-vue_export-helper.48e557ba.js","/_astro/client.9dbf6b61.js","/_astro/firebase-app.1df8af9a.js","/_astro/hoisted.572313d6.js","/_astro/img.7def76a1.js","/_astro/index.c0c35ead.js","/_astro/preload-helper.cf010ec4.js","/_astro/session-utm.744b0db3.js","/_astro/workbox-window.prod.es5.a7b12eab.js","/img/icon.png","/img/large-icon.png","/img/uploads/banner2.webp","/img/uploads/ecom-icon.png","/img/uploads/headphone.webp","/img/uploads/logo.png","/img/uploads/og-image.png","/img/uploads/passion.webp","/img/uploads/rect8589.png","/img/uploads/rect859.png","/img/uploads/rect89.webp"]}), {
 	pageMap,
 	renderers,
 });

package/packages/storefront/dist/server/images.dist.csv

@@ -0,0 +1,38 @@
+ecom-icon_CDmhA.png,192,192
+ecom-icon_Z27EX9f.png,512,512
+ecom-icon_Zo1CLq.png,32,32
+logo_1ug3XF.png,300,71
+rect8589_1Sqf3x.png,856,213
+rect8589_2wFECM.png,2048,509
+rect8589_7mg8W.png,1536,382
+rect859_1pj5UP.png,2048,509
+rect859_HaXay.png,856,213
+rect859_Z100iy0.png,1536,382
+headphone_Z1hoMcQ.webp,720,480
+headphone_Z1j5MXv.webp,856,571
+logo_144owC.webp,300,71
+passion_29BEzB.webp,856,571
+passion_HYj6i.webp,1536,1024
+passion_ZK2FPz.webp,2048,1365
+rect8589_1EUYOa.webp,856,213
+rect8589_Kv492.webp,2048,509
+rect8589_Z1DNkkN.webp,1536,382
+rect859_1Bqr36.webp,2048,509
+rect859_xyq7d.webp,856,213
+rect859_ZMRWqJ.webp,1536,382
+rect89_1DkX0O.webp,2048,530
+rect89_Z1rGPGT.webp,1536,398
+headphone_22qtrt.avif,856,571
+headphone_247ud8.avif,720,480
+logo_Z1EIN1I.avif,300,71
+passion_2sykkb.avif,2048,1365
+passion_pVNbE.avif,856,571
+passion_Z18ANwS.avif,1536,1024
+rect8589_1VeSii.avif,2048,509
+rect8589_Z1IS4wy.avif,856,213
+rect8589_Zt4vbx.avif,1536,382
+rect859_2dVuzq.avif,856,213
+rect859_mPQHw.avif,1536,382
+rect859_Z2i1RBz.avif,2048,509
+rect89_2uIqYp.avif,2048,530
+rect89_ZAjmIj.avif,1536,398

package/packages/storefront/dist/server/images.src.csv

@@ -0,0 +1,11 @@
+img/icon.png,512,512
+img/large-icon.png,1024,1024
+img/uploads/ecom-icon.png,1024,1024
+img/uploads/logo.png,411,97
+img/uploads/og-image.png,1200,1200
+img/uploads/rect8589.png,1500,373
+img/uploads/rect859.png,1500,373
+img/uploads/banner2.webp,1200,311
+img/uploads/headphone.webp,480,320
+img/uploads/passion.webp,480,320
+img/uploads/rect89.webp,1201,311

package/packages/storefront/dist/server/renderers.mjs

@@ -1,8 +1,8 @@
-import { h as server_default } from './chunks/astro.6adaff02.mjs';
+import { h as server_default } from './chunks/astro.a7611b51.mjs';
 import { useSSRContext, defineComponent, computed, mergeProps, h, createSSRApp } from 'vue';
 import { ssrRenderSlotInner, ssrRenderAttrs, ssrRenderSlot, renderToString } from 'vue/server-renderer';
 import { img, imgSizes, i18n, formatMoney } from '@ecomplus/utils';
-import { _ as _export_sfc } from './chunks/pages/_...slug_.astro.501582b9.mjs';
+import { _ as _export_sfc } from './chunks/pages/_...slug_.astro.0f33557e.mjs';
 import 'path-to-regexp';
 import 'cookie';
 import '@astrojs/internal-helpers/path';
@@ -13,16 +13,9 @@ import 'node:tls';
 import 'mime';
 import 'string-width';
 import 'html-escaper';
-import 'node:fs/promises';
-import 'node:path';
-import 'node:url';
-import 'http-cache-semantics';
-import 'node:os';
-import 'image-size';
-import 'magic-string';
-import 'node:stream';
 import '@cloudcommerce/api';
 import 'node:events';
+import 'node:path';
 import '@cloudcommerce/config';
 /* empty css                                     */import '@vueuse/core';
 import '@headlessui/vue';

package/packages/storefront/dist/server/stylesheets.csv

@@ -0,0 +1 @@
+./dist/client/_astro/_...slug_.a786e016.css

package/packages/storefront/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudcommerce/storefront",
   "type": "module",
-  "version": "0.23.2",
+  "version": "0.24.0",
   "description": "E-Com Plus Cloud Commerce storefront with Astro",
   "bin": {
     "storefront": "./scripts/build-prod.sh"
@@ -21,7 +21,7 @@
   "scripts": {
     "dev": "astro dev",
     "start": "astro dev --host",
-    "build": "astro build",
+    "build:ssr": "astro build",
     "build:static": "BUILD_OUTPUT=static astro build",
     "build:prod": "bash scripts/build-prod.sh",
     "preview": "astro preview",
@@ -30,7 +30,7 @@
   },
   "dependencies": {
     "@astrojs/image": "0.17.3",
-    "@astrojs/node": "5.3.2",
+    "@astrojs/node": "5.3.4",
     "@astrojs/vue": "2.2.1",
     "@cloudcommerce/api": "workspace:*",
     "@cloudcommerce/config": "workspace:*",
@@ -43,7 +43,7 @@
     "@iconify-json/logos": "^1.1.34",
     "@vite-pwa/astro": "^0.1.1",
     "@vueuse/core": "10.3.0",
-    "astro": "2.10.2",
+    "astro": "2.10.9",
     "chroma-js": "^2.4.2",
     "dotenv": "^16.3.1",
     "firebase": "^10.1.0",
@@ -52,13 +52,14 @@
     "semver": "^7.5.4",
     "sharp": "^0.32.4",
     "tailwindcss": "^3.3.3",
-    "unocss": "^0.54.2",
+    "unocss": "^0.55.0",
     "vite": "^4.4.9",
     "vite-plugin-pwa": "^0.16.4",
     "vue": "^3.3.4"
   },
   "devDependencies": {
     "@cloudcommerce/eslint": "workspace:*",
-    "@cloudcommerce/types": "workspace:*"
+    "@cloudcommerce/types": "workspace:*",
+    "@vue/runtime-core": "^3.3.4"
   }
 }

package/packages/storefront/scripts/build-prod.sh

@@ -8,6 +8,8 @@ DEPLOY_RUNTIME=serverless npx astro build
 mv ./.cloudcommerce/sf-tmp-dist/_astro/*.{png,jpg,jpeg,webp,avif,svg} \
   ./dist/client/_astro/ \
   2>/dev/null
+mv ./.cloudcommerce/sf-tmp-dist/~fallback/index.html ./dist/client/~fallback.html
+mv ./.cloudcommerce/sf-tmp-dist/index.html ./dist/client/~index.html
 rm -rf ./.cloudcommerce/sf-tmp-dist
 
 identify -format "%f,%w,%h\n" \

package/packages/storefront/src/env.d.ts

@@ -4,8 +4,6 @@
 /// <reference types="../client" />
 /// <reference types="../server" />
 
-/* eslint-disable import/newline-after-import */
-
 declare module '*.vue' {
   import { type DefineComponent } from 'vue';
   const component: DefineComponent<{}, {}, any>;

package/packages/storefront/src/helpers/server-data.ts

@@ -11,8 +11,11 @@ const networkNames = [
   'youtube',
   'tiktok',
   'pinterest',
+  'threads',
 ] as const;
-type NetworkName = typeof networkNames[number];
+
+export type NetworkName = typeof networkNames[number];
+
 const socialNetworks: Partial<Record<NetworkName, string>> = {};
 networkNames.forEach((network: NetworkName) => {
   if (settings[network]) {
@@ -22,4 +25,8 @@ networkNames.forEach((network: NetworkName) => {
 
 export { settings, apiContext, socialNetworks };
 
-export type { NetworkName };
+export const serviceLinks = settings.service_links;
+
+export const paymentMethodFlags = settings.payment_methods;
+
+export type PaymentMethodFlag = Exclude<typeof paymentMethodFlags, undefined>[number];

package/packages/storefront/src/lib/components/BannerPictures.astro

@@ -45,7 +45,7 @@ if (!mobileWidths?.length) {
     widths={widths}
     fetchpriority={index === 0 ? 'high' : 'low'}
     loading={index === 0 ? 'eager' : 'lazy'}
-    class={`${(mobileImg ? 'hidden md:block ' : '')}mx-auto ${className}`}
+    class={`${(mobileImg ? 'hidden md:block ' : '')}mx-auto text-sm text-opacity-70 ${className}`}
   />
 }
 {mobileImg &&
@@ -55,6 +55,6 @@ if (!mobileWidths?.length) {
     widths={mobileWidths}
     fetchpriority={index === 0 ? 'high' : 'low'}
     loading={index === 0 ? 'eager' : 'lazy'}
-    class={`md:hidden mx-auto ${mobileClass}`}
+    class={`md:hidden mx-auto text-sm text-opacity-70 ${mobileClass}`}
   />
 }

package/packages/storefront/src/lib/components/Drawer.vue

@@ -94,7 +94,7 @@ const isPlacementX = computed(() => {
           type="button"
           :aria-label="$t.i19close"
           @click.prevent="close"
-          class="absolute top-2"
+          class="absolute top-2 z-30"
           :class="placement === 'end' ? 'left-2' : 'right-2'"
           data-drawer-close
         >

package/packages/storefront/src/lib/components/PaymentMethodFlag.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+import type { PaymentMethodFlag } from '@@sf/sf-lib';
+import { computed } from 'vue';
+
+export interface Props {
+  as?: string;
+  flag: PaymentMethodFlag;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  as: 'i',
+});
+const iconClassName = computed(() => {
+  switch (props.flag) {
+    case 'pix': return 'i-pix text-[#77B6A8]';
+    case 'visa': return 'i-visa';
+    case 'mastercard': return 'i-mastercard';
+    case 'elo': return 'i-elo';
+    case 'amex': return 'i-amex';
+    case 'hipercard': return 'i-hipercard';
+    case 'diners': return 'i-dinersclub';
+    case 'discover': return 'i-discover';
+    default: return '';
+  }
+});
+</script>
+
+<template>
+  <b
+    v-if="!iconClassName"
+    class="tracking-tighter leading-none mb-1 text-black text-[57%]"
+  >
+    {{ props.flag }}
+  </b>
+  <component v-else :is="as" :class="iconClassName" />
+</template>

package/packages/storefront/src/lib/components/SocialNetworkIcon.vue

@@ -19,6 +19,7 @@ const iconClassName = computed(() => {
     case 'pinterest': return 'i-pinterest';
     case 'tiktok': return 'i-tiktok';
     case 'twitter': return 'i-twitter';
+    case 'threads': return 'i-threads';
     default: return '';
   }
 });