cloudcommerce 0.3.0 → 0.4.0

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

@@ -13,8 +13,8 @@ import send from 'send';
 import { defineComponent, computed, unref, useSSRContext, mergeProps, h as h$2, createSSRApp } from 'vue';
 import { ssrRenderSlotInner, ssrRenderAttrs, ssrRenderSlot, renderToString } from 'vue/server-renderer';
 import { i18n, formatMoney } from '@ecomplus/utils';
-/* empty css                                  */import { _ as _page0, a as _page1, b as _page3, c as _page4, d as _page5 } from './chunks/pages/all.23de4e5c.mjs';
-import { _ as _page2 } from './chunks/prerender.f40361a3.mjs';
+/* empty css                                  */import { _ as _page0, a as _page1, b as _page3, c as _page4, d as _page5 } from './chunks/pages/all.6379e666.mjs';
+import { _ as _page2 } from './chunks/prerender.a1ec39e0.mjs';
 import 'path-to-regexp';
 import 'tls';
 import 'mime';
@@ -3321,7 +3321,7 @@ const _renderer1 = {
 const pageMap = new Map([["../../node_modules/.pnpm/@astrojs+image@0.13.0_astro@2.0.2+sharp@0.31.3/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 renderers = [Object.assign({"name":"astro:jsx","serverEntrypoint":"astro/jsx/server.js","jsxImportSource":"astro"}, { ssr: server_default }),Object.assign({"name":"@astrojs/vue","clientEntrypoint":"@astrojs/vue/client.js","serverEntrypoint":"@astrojs/vue/server.js"}, { ssr: _renderer1 }),];
 
-const _manifest = Object.assign(deserializeManifest({"adapterName":"@astrojs/node","routes":[{"file":"fallback/index.html","links":[],"scripts":[],"routeData":{"route":"/fallback","type":"page","pattern":"^\\/fallback\\/?$","segments":[[{"content":"fallback","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/fallback.astro","pathname":"/fallback","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"routeData":{"type":"endpoint","route":"/_image","pattern":"^\\/_image$","segments":[[{"content":"_image","dynamic":false,"spread":false}]],"params":[],"component":"../../node_modules/.pnpm/@astrojs+image@0.13.0_astro@2.0.2+sharp@0.31.3/node_modules/@astrojs/image/dist/endpoint.js","pathname":"/_image","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":["_astro/_...slug_.32968ccf.css","_astro/index.90df622b.css"],"scripts":[{"type":"external","value":"_astro/hoisted.6edd7364.js"}],"routeData":{"route":"/","type":"page","pattern":"^\\/$","segments":[],"params":[],"component":"src/pages/index.astro","pathname":"/","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"routeData":{"route":"/app","type":"page","pattern":"^\\/app\\/?$","segments":[[{"content":"app","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/app/index.astro","pathname":"/app","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"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","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":["_astro/_...slug_.32968ccf.css"],"scripts":[{"type":"external","value":"_astro/hoisted.6edd7364.js"}],"routeData":{"route":"/[...slug]","type":"page","pattern":"^(?:\\/(.*?))?\\/?$","segments":[[{"content":"...slug","dynamic":true,"spread":true}]],"params":["...slug"],"component":"src/pages/[...slug].astro","_meta":{"trailingSlash":"ignore"}}}],"site":"https://ecom2-002.web.app","base":"/","markdown":{"drafts":false,"syntaxHighlight":"shiki","shikiConfig":{"langs":[],"theme":"github-dark","wrap":false},"remarkPlugins":[],"rehypePlugins":[],"remarkRehype":{},"gfm":true,"smartypants":true,"contentDir":"file:///home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/content/"},"pageMap":null,"renderers":[],"entryModules":{"\u0000@astrojs-ssr-virtual-entry":"_@astrojs-ssr-virtual-entry.mjs","@@sf/components/Prices.vue":"_astro/Prices.6fbcb5ac.js","@@sf/components/PitchBar.vue":"_astro/PitchBar.209c6645.js","@@sf/components/ProductCard.vue":"_astro/ProductCard.ee5eee91.js","/astro/hoisted.js?q=0":"_astro/hoisted.6edd7364.js","/home/leo/code/ecomplus/cloud-commerce/node_modules/workbox-window/build/workbox-window.prod.es5.mjs":"_astro/workbox-window.prod.es5.295a6886.js","@astrojs/vue/client.js":"_astro/client.5a46cc02.js","@@sf/components/ShopHeader.vue":"_astro/ShopHeader.b801c785.js","astro:scripts/before-hydration.js":""},"assets":["/_astro/index.90df622b.css","/_astro/server.60de185d.css","/_astro/_...slug_.32968ccf.css","/manifest.webmanifest","/registerSW.js","/robots.txt","/sw.js","/workbox-e2ee76b5.js","/_astro/PitchBar.209c6645.js","/_astro/Prices.6fbcb5ac.js","/_astro/Prices.vue_vue_type_script_setup_true_lang.44f23680.js","/_astro/ProductCard.ee5eee91.js","/_astro/ShopHeader.b801c785.js","/_astro/client.5a46cc02.js","/_astro/ecom-utils.92f137f6.js","/_astro/hoisted.6edd7364.js","/_astro/index.844a4059.js","/_astro/modules-info.d9373e21.js","/_astro/runtime-core.esm-bundler.f04cee62.js","/_astro/runtime-dom.esm-bundler.00313542.js","/_astro/session-utm.72684b84.js","/_astro/use-component-variant.58788b6e.js","/_astro/workbox-window.prod.es5.295a6886.js","/admin/config.json","/assets/cms-preview.css","/assets/cms.css","/assets/cvv.png","/assets/img-placeholder.png","/assets/payments.png","/assets/ssl-safe.png","/img/icon.png","/img/large-icon.png","/img/uploads/banner1.png","/img/uploads/banner2.png","/img/uploads/banner2.webp","/img/uploads/favicon.png","/img/uploads/headless.png","/img/uploads/headphone.png","/img/uploads/headphone.webp","/img/uploads/icon.png","/img/uploads/large-icon.png","/img/uploads/logo.png","/img/uploads/logo.webp","/img/uploads/og-image.png","/img/uploads/passion.png","/img/uploads/passion.webp","/img/uploads/pwa-reliable.png","/img/uploads/rect8589.png","/img/uploads/rect859.png","/img/uploads/rect89.png","/img/uploads/rect89.webp","/img/uploads/ssl-safe.png","/assets/icons/bootstrap-icons/font/storefront-icons.woff2","/assets/icons/feather-icons/font/storefront-icons.woff2","/assets/icons/font-awesome/font/storefront-icons.woff2","/assets/icons/line-awesome/font/storefront-icons.woff2","/assets/icons/tabler-icons/font/storefront-icons.woff2","/fallback/index.html"]}), {
+const _manifest = Object.assign(deserializeManifest({"adapterName":"@astrojs/node","routes":[{"file":"fallback/index.html","links":[],"scripts":[],"routeData":{"route":"/fallback","type":"page","pattern":"^\\/fallback\\/?$","segments":[[{"content":"fallback","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/fallback.astro","pathname":"/fallback","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"routeData":{"type":"endpoint","route":"/_image","pattern":"^\\/_image$","segments":[[{"content":"_image","dynamic":false,"spread":false}]],"params":[],"component":"../../node_modules/.pnpm/@astrojs+image@0.13.0_astro@2.0.2+sharp@0.31.3/node_modules/@astrojs/image/dist/endpoint.js","pathname":"/_image","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":["_astro/_...slug_.39c46f54.css","_astro/index.0c833781.css"],"scripts":[{"type":"external","value":"_astro/hoisted.6edd7364.js"}],"routeData":{"route":"/","type":"page","pattern":"^\\/$","segments":[],"params":[],"component":"src/pages/index.astro","pathname":"/","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"routeData":{"route":"/app","type":"page","pattern":"^\\/app\\/?$","segments":[[{"content":"app","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/app/index.astro","pathname":"/app","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[],"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","_meta":{"trailingSlash":"ignore"}}},{"file":"","links":["_astro/_...slug_.39c46f54.css"],"scripts":[{"type":"external","value":"_astro/hoisted.6edd7364.js"}],"routeData":{"route":"/[...slug]","type":"page","pattern":"^(?:\\/(.*?))?\\/?$","segments":[[{"content":"...slug","dynamic":true,"spread":true}]],"params":["...slug"],"component":"src/pages/[...slug].astro","_meta":{"trailingSlash":"ignore"}}}],"site":"https://ecom2-002.web.app","base":"/","markdown":{"drafts":false,"syntaxHighlight":"shiki","shikiConfig":{"langs":[],"theme":"github-dark","wrap":false},"remarkPlugins":[],"rehypePlugins":[],"remarkRehype":{},"gfm":true,"smartypants":true,"contentDir":"file:///home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/content/"},"pageMap":null,"renderers":[],"entryModules":{"\u0000@astrojs-ssr-virtual-entry":"_@astrojs-ssr-virtual-entry.mjs","~/components/Prices.vue":"_astro/Prices.b75d44d6.js","@@sf/components/ShopHeader.vue":"_astro/ShopHeader.65213f83.js","@@sf/components/ProductCard.vue":"_astro/ProductCard.9138ec25.js","/astro/hoisted.js?q=0":"_astro/hoisted.6edd7364.js","/home/leo/code/ecomplus/cloud-commerce/node_modules/workbox-window/build/workbox-window.prod.es5.mjs":"_astro/workbox-window.prod.es5.295a6886.js","~/components/PitchBar.vue":"_astro/PitchBar.103168e6.js","@astrojs/vue/client.js":"_astro/client.eba0daa7.js","astro:scripts/before-hydration.js":""},"assets":["/_astro/index.0c833781.css","/_astro/server.60de185d.css","/_astro/_...slug_.39c46f54.css","/manifest.webmanifest","/registerSW.js","/robots.txt","/sw.js","/workbox-e2ee76b5.js","/_astro/PitchBar.103168e6.js","/_astro/Prices.b75d44d6.js","/_astro/Prices.vue_vue_type_script_setup_true_lang.054033ef.js","/_astro/ProductCard.9138ec25.js","/_astro/ShopHeader.65213f83.js","/_astro/client.eba0daa7.js","/_astro/ecom-utils.92f137f6.js","/_astro/hoisted.6edd7364.js","/_astro/index.7577af70.js","/_astro/modules-info.0c999f60.js","/_astro/runtime-core.esm-bundler.4da3640b.js","/_astro/runtime-dom.esm-bundler.0869e112.js","/_astro/session-utm.72684b84.js","/_astro/workbox-window.prod.es5.295a6886.js","/admin/config.json","/assets/cms-preview.css","/assets/cms.css","/assets/cvv.png","/assets/img-placeholder.png","/assets/payments.png","/assets/ssl-safe.png","/img/icon.png","/img/large-icon.png","/img/uploads/banner1.png","/img/uploads/banner2.png","/img/uploads/banner2.webp","/img/uploads/favicon.png","/img/uploads/headless.png","/img/uploads/headphone.png","/img/uploads/headphone.webp","/img/uploads/icon.png","/img/uploads/large-icon.png","/img/uploads/logo.png","/img/uploads/logo.webp","/img/uploads/og-image.png","/img/uploads/passion.png","/img/uploads/passion.webp","/img/uploads/pwa-reliable.png","/img/uploads/rect8589.png","/img/uploads/rect859.png","/img/uploads/rect89.png","/img/uploads/rect89.webp","/img/uploads/ssl-safe.png","/assets/icons/bootstrap-icons/font/storefront-icons.woff2","/assets/icons/feather-icons/font/storefront-icons.woff2","/assets/icons/font-awesome/font/storefront-icons.woff2","/assets/icons/line-awesome/font/storefront-icons.woff2","/assets/icons/tabler-icons/font/storefront-icons.woff2","/fallback/index.html"]}), {
 	pageMap: pageMap,
 	renderers: renderers
 });

package/packages/storefront/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudcommerce/storefront",
   "type": "module",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "E-Com Plus Cloud Commerce storefront with Astro",
   "main": "src/index.js",
   "repository": {

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

@@ -5,29 +5,27 @@ import {
   computed,
   watch,
 } from 'vue';
-import useComponentVariant from '@@sf/composables/use-component-variant';
 
 export interface Props {
   modelValue?: boolean;
   placement?: 'start' | 'end' | 'top' | 'bottom';
-  isTeleported?: boolean;
+  position?: 'fixed' | 'absolute';
   hasCloseButton?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
   modelValue: false,
   placement: 'start',
-  isTeleported: false,
+  position: 'fixed',
   hasCloseButton: true,
 });
 const emit = defineEmits([
   'update:modelValue',
 ]);
 const close = () => emit('update:modelValue', false);
-const anchor = ref(null);
-const canvas = ref(null);
+const drawer = ref(null);
 const outsideClickListener = (ev: MouseEvent) => {
-  if (!canvas.value?.contains(ev.target)) {
+  if (!drawer.value?.contains(ev.target)) {
     close();
   }
 };
@@ -37,23 +35,14 @@ const escClickListener = (ev: KeyboardEvent) => {
   }
 };
 watch(toRef(props, 'modelValue'), async (isOpen) => {
-  const header = anchor.value.closest('[class*="backdrop-"]');
   if (isOpen) {
     document.body.style.overflow = 'hidden';
-    if (header) {
-      header.style.backdropFilter = 'none';
-    }
     setTimeout(() => {
       document.addEventListener('click', outsideClickListener, { passive: true });
       document.addEventListener('keydown', escClickListener, { passive: true });
     }, 500);
   } else {
     document.body.style.overflow = null;
-    if (header) {
-      setTimeout(() => {
-        header.style.backdropFilter = null;
-      }, 500);
-    }
     document.removeEventListener('click', outsideClickListener);
     document.removeEventListener('keydown', escClickListener);
   }
@@ -66,38 +55,43 @@ const slideTo = computed(() => {
     default: return 'down';
   }
 });
-const componentVariant = useComponentVariant(props, ['placement']);
+const isFixed = computed(() => {
+  return props.position === 'fixed';
+});
+const isPlacementX = computed(() => {
+  return props.placement === 'start' || props.placement === 'end';
+});
 </script>
 
 <template>
-  <div ref="anchor" class="relative">
-    <Teleport to="#teleported" :disabled="!isTeleported">
-      <Fade :slide="slideTo" speed="slow" is-floating>
-        <dialog
-          v-if="modelValue"
-          class="w-screen max-w-sm p-0 z-50"
-          :class="isTeleported ? 'fixed top-0 left-0' : 'absolute'"
-          :open="modelValue"
-          :data-drawer="componentVariant"
+  <Fade :slide="slideTo" speed="slow" is-floating>
+    <dialog
+      v-if="modelValue"
+      ref="drawer"
+      class="w-screen max-w-sm shadow p-0 m-0 z-50"
+      :class="[
+        position,
+        isFixed ? `top-0 left-0 ${(isPlacementX ? 'h-screen' : '')}` : null,
+      ]"
+      :open="modelValue"
+      :data-drawer="placement"
+    >
+      <div class="relative">
+        <button
+          v-if="hasCloseButton"
+          type="button"
+          :aria-label="$t.i19close"
+          @click.prevent="close"
+          class="absolute top-2"
+          :class="placement === 'end' ? 'left-2' : 'right-2'"
+          data-drawer-close
         >
-          <div ref="canvas" class="relative">
-            <button
-              v-if="hasCloseButton"
-              type="button"
-              :aria-label="$t.i19close"
-              @click.prevent="close"
-              class="absolute top-2"
-              :class="placement === 'end' ? 'left-2' : 'right-2'"
-              data-drawer-close
-            >
-              <slot name="close">
-                <i class="i-close text-base-400 text-3xl"></i>
-              </slot>
-            </button>
-            <slot />
-          </div>
-        </dialog>
-      </Fade>
-    </Teleport>
-  </div>
+          <slot name="close">
+            <i class="i-close text-base-400 text-3xl"></i>
+          </slot>
+        </button>
+        <slot />
+      </div>
+    </dialog>
+  </Fade>
 </template>

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

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref } from 'vue';
-import Prices from '@@sf/components/Prices.vue';
+import Prices from '~/components/Prices.vue';
 
 export interface Props {
   as?: string;

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

@@ -1,9 +1,16 @@
 <script setup lang="ts">
-import { ref } from 'vue';
+import type { CategoriesList } from '@cloudcommerce/api/types';
+import { ref, computed } from 'vue';
 import { i19myAccount, i19openCart, i19searchProducts } from '@@i18n';
+import useStickyHeader from '@@sf/composables/use-sticky-header';
 import Drawer from '@@sf/components/Drawer.vue';
-import StickyHeader from '@@sf/components/StickyHeader.vue';
+import ShopSidenav from '@@sf/components/ShopSidenav.vue';
 
+export interface Props {
+  categories: CategoriesList;
+}
+
+defineProps<Props>();
 const buttons = ref({
   search: {
     icon: 'i-search',
@@ -22,16 +29,28 @@ const buttons = ref({
   },
 });
 const isSidenavOpen = ref(false);
+const header = ref<HTMLElement | null>(null);
+const {
+  isSticky,
+  staticHeight,
+  staticY,
+} = useStickyHeader({ header });
+const sidenavHeight = computed(() => {
+  return isSticky.value ? staticHeight.value : staticY.value;
+});
 </script>
 
 <template>
-  <StickyHeader>
-    <div
-      class="container lg:max-w-7xl mx-auto px-1 lg:pl-3
+  <header
+    ref="header"
+    class="top-0 z-50"
+    :class="isSticky
+      ? 'bg-white/80 backdrop-blur-md shadow py-2 md:py-3'
+      : 'bg-white py-3 sm:py-4 md:py-5'"
+  >
+    <div class="container lg:max-w-7xl mx-auto px-1 lg:pl-3
       grid grid-flow-col grid-cols-3 justify-between items-center
-      md:grid-cols-none md:auto-cols-max"
-      data-header
-    >
+      md:grid-cols-none md:auto-cols-max">
       <slot name="sidenav-toggle">
         <div class="md:hidden" data-sidenav-toggle>
           <button
@@ -40,12 +59,12 @@ const isSidenavOpen = ref(false);
             @click="isSidenavOpen = !isSidenavOpen"
           >
             <slot name="sidenav-toggle-content">
-              <i class="i-menu text-base-500 text-3xl"></i>
+              <i
+                class="text-base-500 text-3xl"
+                :class="isSidenavOpen ? 'i-close' : 'i-menu'"
+              ></i>
             </slot>
           </button>
-          <Drawer v-model="isSidenavOpen" class="-ml-1 lg:-ml-3">
-            MENU
-          </Drawer>
         </div>
       </slot>
       <slot name="logo" />
@@ -78,5 +97,14 @@ const isSidenavOpen = ref(false);
         </div>
       </slot>
     </div>
-  </StickyHeader>
+    <Drawer
+      v-model="isSidenavOpen"
+      :has-close-button="false"
+      position="absolute"
+      class="mt-3"
+      :style="{ height: `calc(100vh - ${sidenavHeight}px)` }"
+    >
+      <ShopSidenav class="pt-6" :categories="categories" />
+    </Drawer>
+  </header>
 </template>

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

@@ -0,0 +1,26 @@
+<script setup lang="ts">
+import { CategoriesList } from '@cloudcommerce/api/types';
+
+export interface Props {
+  categories: CategoriesList;
+}
+
+const props = defineProps<Props>();
+const mainCategories = props.categories.filter(({ slug, parent }) => {
+  return slug && !parent;
+});
+</script>
+
+<template>
+  <aside data-sidenav>
+    <nav class="py-5" data-sidenav-nav>
+      <ul>
+        <li v-for="mainCategory in mainCategories" :key="mainCategory._id">
+          <a :href="`/${mainCategory.slug}`">
+            {{ mainCategory.name }}
+          </a>
+        </li>
+      </ul>
+    </nav>
+  </aside>
+</template>

package/packages/storefront/src/lib/composables/use-pitch-bar.ts

@@ -0,0 +1,27 @@
+import { computed } from 'vue';
+import { parseShippingPhrase } from '@@sf/state/modules-info';
+
+export interface Props {
+  slides: Array<{
+    href?: string;
+    target?: string;
+    html: string;
+  }>;
+}
+
+const usePitchBar = (props: Props) => {
+  const parsedContents = computed(() => {
+    return props.slides.map(({ html }) => {
+      return parseShippingPhrase(html).value;
+    });
+  });
+  const countValidSlides = computed(() => {
+    return parsedContents.value.filter((html) => html).length;
+  });
+  return {
+    parsedContents,
+    countValidSlides,
+  };
+};
+
+export default usePitchBar;

package/packages/storefront/src/lib/composables/use-sticky-header.ts

@@ -0,0 +1,111 @@
+import type { Ref } from 'vue';
+import {
+  ref,
+  computed,
+  watch,
+  onMounted,
+} from 'vue';
+import {
+  promiseTimeout,
+  useTimeout,
+  useDebounceFn,
+  useScroll,
+} from '@vueuse/core';
+
+export interface Props {
+  header: Ref<HTMLElement>;
+  canSetStyles?: boolean;
+  canCreateHeightDiv?: boolean;
+  isShownOnScrollDown?: boolean;
+}
+
+const useStickyHeader = (props: Props) => {
+  const {
+    header,
+    canSetStyles,
+    canCreateHeightDiv,
+    isShownOnScrollDown,
+  } = {
+    canSetStyles: true,
+    canCreateHeightDiv: true,
+    ...props,
+  };
+  const { ready, start } = useTimeout(100, { controls: true, immediate: false });
+  const staticHeight = ref(0);
+  const staticY = ref(0);
+  let heightDiv: HTMLElement | undefined;
+  const { y } = !import.meta.env.SSR ? useScroll(document) : { y: ref(0) };
+  const isSticky = computed(() => ready.value && y.value > staticY.value * 1.2);
+  const transition = ref('none');
+  watch(isSticky, async (_isSticky) => {
+    if (canSetStyles) {
+      header.value.style.position = _isSticky ? 'sticky' : null;
+    }
+    if (heightDiv) {
+      heightDiv.style.height = _isSticky ? `${staticHeight.value}px` : null;
+    }
+    if (!_isSticky) {
+      start();
+      transition.value = 'none';
+    } else {
+      await promiseTimeout(300);
+      transition.value = 'opacity var(--transition-slow), transform var(--transition)';
+    }
+  });
+  const isScrollUp = ref(false);
+  watch(y, (newY, oldY) => {
+    isScrollUp.value = newY > 0 && newY < oldY;
+  });
+  if (!import.meta.env.SSR) {
+    onMounted(() => {
+      const fixHeight = () => {
+        staticHeight.value = header.value.offsetHeight;
+        staticY.value = staticHeight.value
+          + window.pageYOffset + header.value.getBoundingClientRect().top;
+        start();
+      };
+      const imgs = header.value.getElementsByTagName('IMG');
+      let isAllLoaded = true;
+      for (let i = 0; i < imgs.length; i++) {
+        const img = imgs[i] as HTMLImageElement;
+        if (!img.complete || img.naturalHeight === 0) {
+          isAllLoaded = false;
+          img.onload = fixHeight;
+        }
+      }
+      if (isAllLoaded) {
+        fixHeight();
+      }
+      window.addEventListener('resize', useDebounceFn(fixHeight, 300));
+      if (canSetStyles) {
+        header.value.style.willChange = 'transform';
+        watch([isSticky, isScrollUp], ([_isSticky, _isScrollUp]) => {
+          let opacity: string | null = null;
+          let transform: string | null = null;
+          if (_isSticky && (!_isScrollUp || isShownOnScrollDown)) {
+            opacity = '0';
+            transform = 'translateY(-100%)';
+          }
+          header.value.style.opacity = opacity;
+          header.value.style.transform = transform;
+        });
+        watch(transition, (_transition) => {
+          header.value.style.transition = _transition;
+        });
+      }
+      if (canCreateHeightDiv) {
+        heightDiv = document.createElement('div');
+        header.value.parentElement.insertBefore(heightDiv, header.value);
+      }
+    });
+  }
+  return {
+    staticHeight,
+    staticY,
+    isSticky,
+    isScrollUp,
+    transition,
+  };
+};
+
+export default useStickyHeader;

package/packages/storefront/src/lib/layouts/BaseBody.astro

@@ -12,7 +12,8 @@ export interface Props {
 ---
 
 <body>
+  <div id="teleported-top"></div>
   <slot />
   <slot name="before-body-end" />
-  <div id="teleported"></div>
+  <div id="teleported-bottom"></div>
 </body>

package/packages/storefront/src/lib/layouts/PagesHeader.astro

@@ -1,11 +1,9 @@
 ---
-import type { Categories } from '@cloudcommerce/api/types';
 import type CmsHeader from '@@sf/types/cms-header';
-import type CmsContacts from '@@sf/types/cms-contacts';
 import type { PageContext } from '@@sf/ssr-context';
 import Picture from '@@sf/ssr/Picture.astro';
-import PitchBar, { Props as PitchBarProps } from '@@sf/components/PitchBar.vue';
-import ShopHeader from '@@sf/components/ShopHeader.vue';
+import PitchBar, { type Props as PitchBarProps } from '~/components/PitchBar.vue';
+import ShopHeader, { type Props as ShopHeaderProps } from '@@sf/components/ShopHeader.vue';
 
 export interface Props {
   pageContext: PageContext;
@@ -31,7 +29,9 @@ if (header.pitch_bar) {
     html: header.marketing_stripe.text,
   }];
 }
-const logoSrc = header.logo || settings.logo;
+const shopHeader: ShopHeaderProps = {
+  categories: apiState.categories,
+};
 const LogoHeading = Astro.props.logoHeading || (isHomepage ? 'h1' : 'h2');
 ---
 
@@ -41,19 +41,21 @@ const LogoHeading = Astro.props.logoHeading || (isHomepage ? 'h1' : 'h2');
     {pitchBar.slides.length === 1 && <PitchBar {...pitchBar} />}
   </slot>
   <slot name="sticky-header">
-    <ShopHeader client:load>
+    <ShopHeader {...shopHeader} client:load>
       <Fragment slot="logo">
         <slot name="logo">
           <a href="/">
             <LogoHeading>
-              <Picture
-                src={logoSrc}
-                alt={settings.name}
-                widths={[300]}
-                sizes="150px"
-                fetchpriority="high"
-                class="hover:drop-shadow-sm"
-              />
+              <slot name="logo-picture">
+                <Picture
+                  src={header.logo || settings.logo}
+                  alt={settings.name}
+                  widths={[300]}
+                  sizes="150px"
+                  fetchpriority="high"
+                  class="hover:drop-shadow-sm"
+                />
+              </slot>
             </LogoHeading>
           </a>
         </slot>
@@ -61,14 +63,3 @@ const LogoHeading = Astro.props.logoHeading || (isHomepage ? 'h1' : 'h2');
     </ShopHeader>
   </slot>
 </Fragment>
-
-<style is:global>
-/*
-[data-pitch-bar] {
-  @apply bg-slate-300;
-}
-[data-pitch-bar-controls] > * {
-  @apply bg-slate-300;
-}
-*/
-</style>

package/packages/types/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudcommerce/types",
   "type": "module",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "E-Com Plus Cloud Commerce reusable type definitions",
   "main": "index.ts",
   "repository": {

package/packages/storefront/dist/client/_astro/PitchBar.209c6645.js

@@ -1 +0,0 @@
-import{v as G}from"./runtime-dom.esm-bundler.00313542.js";import{p as J}from"./modules-info.d9373e21.js";import{u as Q,a as X,b as Y}from"./index.844a4059.js";import{d as W,o as r,a as f,r as d,h as B,q as H,u as n,s as Z,k as c,v as y,x as D,c as w,y as ee,z as te,A as ae,B as se,l as M,w as p,p as F,n as L,g as V,e as b,C as oe,F as le,D as ne,b as re}from"./runtime-core.esm-bundler.f04cee62.js";/* empty css                       */import"./session-utm.72684b84.js";import"./ecom-utils.92f137f6.js";const j=Symbol("carousel"),ie=["aria-label","data-carousel-control"],C=W({__name:"CarouselControl",props:{direction:{default:1}},setup(l){const{changeSlide:v}=Z(j);return(o,a)=>(r(),f("button",{type:"button","aria-label":l.direction>0?"Próximo":"Anterior",onClick:a[0]||(a[0]=t=>n(v)(l.direction)),"data-carousel-control":l.direction>0?"next":"previous"},[d(o.$slots,"default",{},()=>[B("i",{class:H(["m-0",l.direction>0?"i-chevron-right":"i-chevron-left"])},null,2)])],8,ie))}}),ue=W({__name:"Carousel",props:{as:{default:"ul"},modelValue:{default:1},autoplay:null},emits:["update:modelValue"],setup(l,{emit:v}){const o=l,a=c(o.modelValue-1);y(D(o,"modelValue"),e=>{a.value=e-1}),y(a,(e,s)=>{e!==s&&v("update:modelValue",e+1)});const t=c(null),{x:$,isScrolling:i,arrivedState:u}=Q(t),_=w(()=>u.left),S=w(()=>u.right),x=c([]),T=c(0),I=c(0),k=c(0),q=()=>{T.value=t.value.scrollWidth,I.value=t.value.offsetWidth},K=()=>{const e=[...t.value.children];x.value=e.map(s=>({offsetLeft:s.offsetLeft,width:s.offsetWidth}))},O=e=>{const s=e>0?a.value:a.value+e,R=x.value[s]?.width||0;return R?R*e:0},P=()=>{const e=x.value.findIndex(s=>Math.abs(s.offsetLeft-$.value)<=5);e>-1&&(a.value=e||0)},z=()=>{const e=T.value-I.value;k.value=x.value.findIndex(({offsetLeft:s})=>s>=e-5)};let h=null;const g=()=>{o.autoplay&&(clearTimeout(h),h=setTimeout(()=>{m(1)},o.autoplay))},m=e=>{if(e<0){if(_.value){z(),a.value=k.value-1,m(1);return}}else if(S.value){a.value=1,m(-1);return}const s=O(e);s&&(t.value.scrollBy({left:s,behavior:"smooth"}),g())};y(i,e=>{e?clearTimeout(h):(P(),g())});const A=c(null),U=X(A);y(U,e=>{e?clearTimeout(h):g()});const E=()=>{t.value&&(q(),K(),P(),z())},N=Y(E,400);return ee(()=>{E(),te(()=>{[...t.value.children].forEach(e=>{e.setAttribute("tabindex","0")})}),g(),window.addEventListener("resize",N)}),ae(()=>{window.removeEventListener("resize",N),clearTimeout(h)}),se(j,{autoplay:D(o,"autoplay"),changeSlide:m,isBoundLeft:_,isBoundRight:S}),(e,s)=>(r(),f("div",{ref_key:"carousel",ref:A,"data-carousel":""},[(r(),M(F(l.as),{ref_key:"wrapper",ref:t,"data-carousel-wrapper":""},{default:p(()=>[d(e.$slots,"default")]),_:3},512)),d(e.$slots,"controls",L(V({changeSlide:m,isBoundLeft:n(_),isBoundRight:n(S),currentPage:a.value+1,pageCount:k.value+1})),()=>[b(C,{direction:-1},{default:p(()=>[d(e.$slots,"previous")]),_:3}),b(C,null,{default:p(()=>[d(e.$slots,"next")]),_:3})])],512))}}),ce={class:"bg-base-100","data-pitch-bar":""},de={class:"container md:w-2/3 mx-auto px-3 py-1"},fe=["innerHTML"],pe={class:"text-xl leading-none text-base-400","data-pitch-bar-controls":""},we=W({__name:"PitchBar",props:{slides:null},setup(l){const v=l,o=w(()=>v.slides.map(({html:t})=>J(t).value)),a=w(()=>o.value.filter(t=>t).length);return(t,$)=>(r(),f("div",ce,[B("div",de,[b(ue,{autoplay:n(a)>1?7e3:null},{controls:p(()=>[d(t.$slots,"controls",L(V({countValidSlides:n(a)})),()=>[oe(B("div",pe,[b(C,{direction:-1,class:"pr-2 bg-base-100 hover:text-base-700"}),b(C,{class:"pl-2 bg-base-100 hover:text-base-700"})],512),[[G,n(a)>1]])])]),default:p(()=>[(r(!0),f(le,null,ne(l.slides,(i,u)=>(r(),f("li",{key:u},[(r(),M(F(i.href?"ALink":"span"),{href:i.href,target:i.target,class:H(["inline-block px-8",i.href?"hover:underline":null])},{default:p(()=>[d(t.$slots,"slide",L(V({slide:i,i:u,parsedContents:n(o)})),()=>[n(o)[u]?(r(),f("span",{key:0,innerHTML:n(o)[u],class:"prose text-sm text-base-800","data-pitch-bar-slide":""},null,8,fe)):re("",!0)])]),_:2},1032,["href","target","class"]))]))),128))]),_:3},8,["autoplay"])])]))}});export{we as default};

package/packages/storefront/dist/client/_astro/Prices.6fbcb5ac.js

@@ -1 +0,0 @@
-import{_ as o}from"./Prices.vue_vue_type_script_setup_true_lang.44f23680.js";/* empty css                       */import"./modules-info.d9373e21.js";import"./session-utm.72684b84.js";import"./runtime-core.esm-bundler.f04cee62.js";import"./ecom-utils.92f137f6.js";import"./use-component-variant.58788b6e.js";export{o as default};

package/packages/storefront/dist/client/_astro/Prices.vue_vue_type_script_setup_true_lang.44f23680.js

@@ -1 +0,0 @@
-import{m as I}from"./modules-info.d9373e21.js";import{g as C,c as F}from"./ecom-utils.92f137f6.js";import{c as r,d as R,a as u,u as e,r as o,n as p,m as W,b as l,g as D,e as w,w as A,f as E,o as m,h as P,t as i,i as S}from"./runtime-core.esm-bundler.f04cee62.js";import{u as q}from"./use-component-variant.58788b6e.js";const T=(n,c)=>{const{type:L,value:y}=c;let a;return y?(L==="percentage"?a=n*((100-y)/100):a=n-y,a>0?a:0):n},G=n=>{const c=r(()=>n.product||{price:n.price||0,base_price:n.basePrice}),L=r(()=>{const{variations:t}=c.value;if(t){const d=C(c.value);for(let _=0;_<t.length;_++)if(C({...c.value,...t[_]})>d)return!0}return!1}),y=r(()=>I.apply_discount.available_extra_discount),a=r(()=>{const t=C(c.value),d=y.value;return d&&(!d.min_amount||t>d.min_amount)?T(t,d):t}),g=r(()=>{if(F(c.value))return c.value.base_price;const t=C(c.value);return t>a.value?t:0}),h=r(()=>n.installmentsOption||I.list_payments.installments_option||{max_number:1}),v=r(()=>{if(h.value.max_number<=1)return 1;const t=h.value.min_installment||5,d=Math.round(a.value/t);return Math.min(d,h.value.max_number)}),k=r(()=>h.value.monthly_interest||0),N=r(()=>{if(v.value>=2){if(!k.value)return a.value/v.value;const t=k.value/100;return a.value*t/(1-(1+t)**-v.value)}return 0}),b=r(()=>{const t=n.discountOption||I.list_payments.discount_option;return t&&(!t.min_amount||t.min_amount<=a.value)&&(!n.isAmountTotal||t.apply_at==="total")?t:{}}),V=r(()=>{const{label:t}=b.value;return t?t.includes(" ")?t:`via ${t}`:""}),$=r(()=>T(a.value,b.value)),f=r(()=>{if(n.loyaltyPointsProgram)return n.loyaltyPointsProgram;const t=I.list_payments.loyalty_points_programs;if(t){const d=Object.keys(t);for(let _=0;_<d.length;_++){const B=t[d[_]];if(B&&B.earn_percentage>0)return B}}return{ratio:0}}),s=r(()=>f.value.min_subtotal_to_earn||0),M=r(()=>f.value.name||""),O=r(()=>f.value.earn_percentage||0),j=r(()=>O.value*f.value.ratio),z=r(()=>j.value>=1?a.value*(j.value/100):0);return{hasVariedPrices:L,salePrice:a,comparePrice:g,installmentsObject:h,installmentsNumber:v,monthlyInterest:k,installmentValue:N,discountObject:b,discountLabel:V,priceWithDiscount:$,pointsProgramObject:f,pointsMinPrice:s,pointsProgramName:M,earnPointsPercentage:O,cashbackPercentage:j,cashbackValue:z}},H=["data-prices"],J={class:"text-base-500 mr-1","data-prices-compare":""},K={key:0},Q={key:0},U={class:"inline-block text-base-800","data-prices-sale":""},X={key:0},Y={key:0,class:"relative z-10","data-prices-cashback":""},Z=["data-tooltip"],x=P("i",{class:"i-cashback mr-1"},null,-1),ee={class:"font-medium"},te=P("small",null," cashback",-1),se={key:0,"data-prices-installment":""},ae={key:0},ne={key:0},oe={key:0},re={key:0,"data-prices-discount":""},le={key:0},ie={key:0},pe=R({__name:"Prices",props:{product:null,price:null,basePrice:null,isAmountTotal:{type:Boolean},installmentsOption:null,discountOption:null,isBig:{type:Boolean},isLiteral:{type:Boolean},hasCashback:{type:Boolean,default:!0},hasPriceOptions:{type:Boolean,default:!0}},setup(n){const c=n,L=G(c),{hasVariedPrices:y,salePrice:a,comparePrice:g,cashbackPercentage:h,cashbackValue:v,installmentsNumber:k,monthlyInterest:N,installmentValue:b,priceWithDiscount:V,discountLabel:$}=L,f=q(c);return(s,M)=>{const O=E("Fade");return m(),u("div",{class:"text-base-600","data-prices":e(f)},[e(g)?o(s.$slots,"compare",p(W({key:0},{salePrice:e(a),comparePrice:e(g)})),()=>[P("span",J,[o(s.$slots,"compare-pre",{},()=>[n.isLiteral?(m(),u("small",K,i("De "))):l("",!0)]),o(s.$slots,"compare-value",p(D({salePrice:e(a),comparePrice:e(g)})),()=>[P("s",null,i(s.$money(e(g))),1)]),o(s.$slots,"compare-post",{},()=>[n.isLiteral?(m(),u("small",Q,i(" Por"))):l("",!0)])])]):l("",!0),o(s.$slots,"sale",p(D({salePrice:e(a)})),()=>[P("strong",U,[o(s.$slots,"sale-pre",{},()=>[e(y)?(m(),u("small",X,i("A partir de "))):l("",!0)]),o(s.$slots,"sale-value",p(D({salePrice:e(a)})),()=>[S(i(s.$money(e(a))),1)]),o(s.$slots,"sale-post")])]),w(O,{slide:"down"},{default:A(()=>[e(v)?o(s.$slots,"cashback",p(W({key:0},{salePrice:e(a),cashbackValue:e(v),cashbackPercentage:e(h)})),()=>[n.hasCashback?(m(),u("div",Y,[P("span",{"data-tooltip":"Receba $1 de volta".replace("$1",s.$percentage(e(h)))},[o(s.$slots,"cashback-pre",{},()=>[x]),o(s.$slots,"cashback-value",p(D({salePrice:e(a),cashbackValue:e(v),cashbackPercentage:e(h)})),()=>[P("span",ee,i(s.$money(e(v))),1)]),o(s.$slots,"cashback-post",{},()=>[te])],8,Z)])):l("",!0)]):l("",!0)]),_:3}),w(O,{slide:"down"},{default:A(()=>[e(b)?o(s.$slots,"installment",p(W({key:0},{salePrice:e(a),installmentValue:e(b),installmentsNumber:e(k),monthlyInterest:e(N)})),()=>[n.hasPriceOptions?(m(),u("div",se,[o(s.$slots,"installment-pre",{},()=>[n.isLiteral?(m(),u("small",ae,i("Até "))):l("",!0)]),o(s.$slots,"installment-value",p(D({salePrice:e(a),installmentValue:e(b),installmentsNumber:e(k),monthlyInterest:e(N)})),()=>[S(i(e(k))+"x ",1),n.isLiteral?(m(),u("small",ne,i(" De "))):l("",!0),P("span",null,i(s.$money(e(b))),1)]),o(s.$slots,"installment-post",{},()=>[!e(N)&&n.isLiteral?(m(),u("small",oe,i("Sem juros"))):l("",!0)])])):l("",!0)]):l("",!0)]),_:3}),w(O,{slide:"down"},{default:A(()=>[e(V)<e(a)?o(s.$slots,"discount",p(W({key:0},{salePrice:e(a),priceWithDiscount:e(V),discountLabel:e($)})),()=>[n.hasPriceOptions?(m(),u("div",re,[o(s.$slots,"discount-pre",{},()=>[e($)?l("",!0):(m(),u("small",le,i("A partir de ")))]),o(s.$slots,"discount-value",p(D({salePrice:e(a),priceWithDiscount:e(V),discountLabel:e($)})),()=>[P("span",null,i(s.$money(e(V))),1)]),o(s.$slots,"discount-post",{},()=>[e($)?(m(),u("small",ie,i(` ${e($)}`),1)):l("",!0)])])):l("",!0)]):l("",!0)]),_:3})],8,H)}}});export{pe as _};

package/packages/storefront/dist/client/_astro/ProductCard.ee5eee91.js

@@ -1 +0,0 @@
-import{_ as e}from"./Prices.vue_vue_type_script_setup_true_lang.44f23680.js";/* empty css                       */import{d as u,k as o,l as n,w as t,p as m,o as d,e as r,i as c,t as l}from"./runtime-core.esm-bundler.f04cee62.js";import"./modules-info.d9373e21.js";import"./session-utm.72684b84.js";import"./ecom-utils.92f137f6.js";import"./use-component-variant.58788b6e.js";const h=u({__name:"ProductCard",props:{as:{default:"div"}},setup(p){const s=o(12),a=o(!1);return setTimeout(()=>{s.value=8,a.value=!0},5e3),(_,f)=>(d(),n(m(p.as),null,{default:t(()=>[r(e,null,{default:t(({salePrice:i})=>[c(" ProductCard "+l(i),1)]),_:1}),r(e,{product:{price:s.value}},null,8,["product"]),r(e,{price:12,"base-price":17}),r(e,{price:12,"base-price":16,"is-literal":!0}),r(e,{price:12,"is-big":a.value},null,8,["is-big"]),r(e,{price:14,"base-price":18,"is-big":a.value,"is-literal":!0},null,8,["is-big"]),r(e,{price:12,"base-price":16},{"compare-value":t(({comparePrice:i})=>[c(" x"+l(i),1)]),_:1})]),_:1}))}});export{h as default};

package/packages/storefront/dist/client/_astro/ShopHeader.b801c785.js

@@ -1 +0,0 @@
-import{w as z}from"./runtime-dom.esm-bundler.00313542.js";import{u as S}from"./use-component-variant.58788b6e.js";import{d as x,k as m,v as _,x as N,c as T,o as h,a as b,l as E,e as L,w as $,q as g,u as f,h as r,r as d,b as V,a2 as D,f as H,y as M,j as A,a3 as B,F,i as P,D as j,m as O,n as U,g as R}from"./runtime-core.esm-bundler.f04cee62.js";import{c as q,b as G,u as I,p as J}from"./index.844a4059.js";const K="Minha conta",Q="Abrir carrinho",W="Buscar produtos",X=["open","data-drawer"],Z=["onClick"],Y=r("i",{class:"i-close text-base-400 text-3xl"},null,-1),ee=x({__name:"Drawer",props:{modelValue:{type:Boolean,default:!1},placement:{default:"start"},isTeleported:{type:Boolean,default:!1},hasCloseButton:{type:Boolean,default:!0}},emits:["update:modelValue"],setup(o,{emit:v}){const s=o,t=()=>v("update:modelValue",!1),i=m(null),a=m(null),u=c=>{a.value?.contains(c.target)||t()},l=c=>{c.key==="Escape"&&t()};_(N(s,"modelValue"),async c=>{const e=i.value.closest('[class*="backdrop-"]');c?(document.body.style.overflow="hidden",e&&(e.style.backdropFilter="none"),setTimeout(()=>{document.addEventListener("click",u,{passive:!0}),document.addEventListener("keydown",l,{passive:!0})},500)):(document.body.style.overflow=null,e&&setTimeout(()=>{e.style.backdropFilter=null},500),document.removeEventListener("click",u),document.removeEventListener("keydown",l))});const n=T(()=>{switch(s.placement){case"start":return"left";case"end":return"right";case"top":return"up";default:return"down"}}),y=S(s,["placement"]);return(c,e)=>{const p=H("Fade");return h(),b("div",{ref_key:"anchor",ref:i,class:"relative"},[(h(),E(D,{to:"#teleported",disabled:!o.isTeleported},[L(p,{slide:f(n),speed:"slow","is-floating":""},{default:$(()=>[o.modelValue?(h(),b("dialog",{key:0,class:g(["w-screen max-w-sm p-0 z-50",o.isTeleported?"fixed top-0 left-0":"absolute"]),open:o.modelValue,"data-drawer":f(y)},[r("div",{ref_key:"canvas",ref:a,class:"relative"},[o.hasCloseButton?(h(),b("button",{key:0,type:"button","aria-label":"Fechar",onClick:z(t,["prevent"]),class:g(["absolute top-2",o.placement==="end"?"left-2":"right-2"]),"data-drawer-close":""},[d(c.$slots,"close",{},()=>[Y])],10,Z)):V("",!0),d(c.$slots,"default")],512)],10,X)):V("",!0)]),_:3},8,["slide"])],8,["disabled"]))],512)}}}),te=["data-sticky-header"],ae=x({__name:"StickyHeader",props:{isShownOnScrollDown:{type:Boolean}},setup(o){const v=o,s=m(null),{ready:t,start:i}=q(100,{controls:!0,immediate:!1}),a=m(0);M(()=>{const e=()=>{a.value=s.value.offsetHeight,i()},p=s.value.getElementsByTagName("IMG");let C=!0;for(let k=0;k<p.length;k++){const w=p[k];(!w.complete||w.naturalHeight===0)&&(C=!1,w.onload=e)}C&&e(),window.addEventListener("resize",G(e,300))});const{y:u}=I(document),l=T(()=>t.value&&u.value>a.value*1.5),n=m("none");_(l,async e=>{e?(await J(300),n.value="opacity var(--transition-slow), transform var(--transition)"):(i(),n.value="none")});const y=m(!1);_(u,(e,p)=>{y.value=e>0&&e<p});const c=S(A({...v,isSticky:l,isScrollUp:y}));return(e,p)=>(h(),b(F,null,[r("div",{style:B(f(l)?`height: ${a.value}px`:null)},null,4),r("header",{ref_key:"header",ref:s,class:g(["z-50 top-0 will-change-transform",{"sticky bg-white/80 backdrop-blur-md shadow py-2 md:py-3":f(l),"opacity-0 -translate-y-full":f(l)&&(!y.value||o.isShownOnScrollDown),"py-3 sm:py-4 md:py-5":!f(l)}]),style:B({transition:n.value}),"data-sticky-header":f(c)},[d(e.$slots,"default")],14,te)],64))}}),se={class:"container lg:max-w-7xl mx-auto px-1 lg:pl-3 grid grid-flow-col grid-cols-3 justify-between items-center md:grid-cols-none md:auto-cols-max","data-header":""},oe={class:"md:hidden","data-sidenav-toggle":""},le=r("i",{class:"i-menu text-base-500 text-3xl"},null,-1),ne={class:"px-2 flex justify-end items-center gap-3 lg:gap-4 text-base-800","data-header-buttons":""},re=["aria-label","onClick","data-header-button"],me=x({__name:"ShopHeader",setup(o){const v=m({search:{icon:"i-search",onClick:()=>{},label:W},account:{icon:"i-account",onClick:()=>{},label:K},cart:{icon:"i-shopping-cart",onClick:()=>{},label:Q}}),s=m(!1);return(t,i)=>(h(),E(ae,null,{default:$(()=>[r("div",se,[d(t.$slots,"sidenav-toggle",{},()=>[r("div",oe,[r("button",{class:"px-2 my-1","aria-label":"Abrir/fechar menu",onClick:i[0]||(i[0]=a=>s.value=!s.value)},[d(t.$slots,"sidenav-toggle-content",{},()=>[le])]),L(ee,{modelValue:s.value,"onUpdate:modelValue":i[1]||(i[1]=a=>s.value=a),class:"-ml-1 lg:-ml-3"},{default:$(()=>[P(" MENU ")]),_:1},8,["modelValue"])])]),d(t.$slots,"logo"),d(t.$slots,"nav"),d(t.$slots,"buttons",{},()=>[r("div",ne,[(h(!0),b(F,null,j(v.value,({icon:a,onClick:u,label:l},n)=>d(t.$slots,"button",O({key:n},{name:n,icon:a,onClick:u}),()=>[r("button",{class:g(n==="account"?"hidden sm:block":null),"aria-label":l,onClick:u,"data-header-button":n},[d(t.$slots,"button-content",U(R({name:n,icon:a})),()=>[r("i",{class:g([a,"hover:text-primary w-7 h-7 hover:scale-110 active:scale-125"])},null,2)])],10,re)])),128))])])])]),_:3}))}});export{me as default};

package/packages/storefront/dist/client/_astro/index.844a4059.js

@@ -1 +0,0 @@
-import{c as E,k as b,$ as U,u as G,a0 as X,a1 as K,j as D,v as M}from"./runtime-core.esm-bundler.f04cee62.js";var H;const L=typeof window<"u",Y=e=>typeof e=="string",y=()=>{};L&&((H=window?.navigator)!=null&&H.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent);function _(e){return typeof e=="function"?e():G(e)}function R(e,n){function t(...r){return new Promise((o,s)=>{Promise.resolve(e(()=>n.apply(this,r),{fn:n,thisArg:this,args:r})).then(o).catch(s)})}return t}function k(e,n={}){let t,r,o=y;const s=u=>{clearTimeout(u),o(),o=y};return u=>{const f=_(e),i=_(n.maxWait);return t&&s(t),f<=0||i!==void 0&&i<=0?(r&&(s(r),r=null),Promise.resolve(u())):new Promise((a,d)=>{o=n.rejectOnCancel?d:a,i&&!r&&(r=setTimeout(()=>{t&&s(t),r=null,a(u())},i)),t=setTimeout(()=>{r&&s(r),r=null,a(u())},f)})}}function q(e,n=!0,t=!0,r=!1){let o=0,s,l=!0,u=y,f;const i=()=>{s&&(clearTimeout(s),s=void 0,u(),u=y)};return d=>{const p=_(e),w=Date.now()-o,T=()=>f=d();if(i(),p<=0)return o=Date.now(),T();if(w>p&&(t||!l))o=Date.now(),T();else if(n)return new Promise((O,m)=>{u=r?m:O,s=setTimeout(()=>{o=Date.now(),l=!0,O(T()),i()},p-w)});return!t&&!s&&(s=setTimeout(()=>l=!0,p)),l=!1,f}}function de(e,n=!1,t="Timeout"){return new Promise((r,o)=>{setTimeout(n?()=>o(t):r,e)})}function z(e){return e}function V(e){return X()?(K(e),!0):!1}function J(e,n=200,t={}){return R(k(n,t),e)}function Z(e,n=200,t=!1,r=!0,o=!1){return R(q(n,t,r,o),e)}function ee(e,n,t={}){const{immediate:r=!0}=t,o=b(!1);let s=null;function l(){s&&(clearTimeout(s),s=null)}function u(){o.value=!1,l()}function f(...i){l(),o.value=!0,s=setTimeout(()=>{o.value=!1,s=null,e(...i)},_(n))}return r&&(o.value=!0,L&&f()),V(u),{isPending:U(o),start:f,stop:u}}var te=Object.defineProperty,Q=Object.getOwnPropertySymbols,ne=Object.prototype.hasOwnProperty,re=Object.prototype.propertyIsEnumerable,j=(e,n,t)=>n in e?te(e,n,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[n]=t,oe=(e,n)=>{for(var t in n||(n={}))ne.call(n,t)&&j(e,t,n[t]);if(Q)for(var t of Q(n))re.call(n,t)&&j(e,t,n[t]);return e};function me(e=1e3,n={}){const{controls:t=!1,callback:r}=n,o=ee(r??y,e,n),s=E(()=>!o.isPending.value);return t?oe({ready:s},o):s}function se(e){var n;const t=_(e);return(n=t?.$el)!=null?n:t}const ae=L?window:void 0;function I(...e){let n,t,r,o;if(Y(e[0])||Array.isArray(e[0])?([t,r,o]=e,n=ae):[n,t,r,o]=e,!n)return y;Array.isArray(t)||(t=[t]),Array.isArray(r)||(r=[r]);const s=[],l=()=>{s.forEach(a=>a()),s.length=0},u=(a,d,p)=>(a.addEventListener(d,p,o),()=>a.removeEventListener(d,p,o)),f=M(()=>se(n),a=>{l(),a&&s.push(...t.flatMap(d=>r.map(p=>u(a,d,p))))},{immediate:!0,flush:"post"}),i=()=>{f(),l()};return V(i),i}const S=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},A="__vueuse_ssr_handlers__";S[A]=S[A]||{};S[A];function ve(e){const n=b(!1);return I(e,"mouseenter",()=>n.value=!0),I(e,"mouseleave",()=>n.value=!1),n}const F=1;function _e(e,n={}){const{throttle:t=0,idle:r=200,onStop:o=y,onScroll:s=y,offset:l={left:0,right:0,top:0,bottom:0},eventListenerOptions:u={capture:!1,passive:!0},behavior:f="auto"}=n,i=b(0),a=b(0),d=E({get(){return i.value},set(c){w(c,void 0)}}),p=E({get(){return a.value},set(c){w(void 0,c)}});function w(c,g){var h,v,C;const P=_(e);P&&((C=P instanceof Document?document.body:P)==null||C.scrollTo({top:(h=_(g))!=null?h:p.value,left:(v=_(c))!=null?v:d.value,behavior:_(f)}))}const T=b(!1),O=D({left:!0,right:!1,top:!0,bottom:!1}),m=D({left:!1,right:!1,top:!1,bottom:!1}),B=J(c=>{T.value=!1,m.left=!1,m.right=!1,m.top=!1,m.bottom=!1,o(c)},t+r),x=c=>{const g=c.target===document?c.target.documentElement:c.target,h=g.scrollLeft;m.left=h<i.value,m.right=h>a.value,O.left=h<=0+(l.left||0),O.right=h+g.clientWidth>=g.scrollWidth-(l.right||0)-F,i.value=h;let v=g.scrollTop;c.target===document&&!v&&(v=document.body.scrollTop),m.top=v<a.value,m.bottom=v>a.value,O.top=v<=0+(l.top||0),O.bottom=v+g.clientHeight>=g.scrollHeight-(l.bottom||0)-F,a.value=v,T.value=!0,B(c),s(c)};return I(e,"scroll",t?Z(x,t,!0,!1):x,u),{x:d,y:p,isScrolling:T,arrivedState:O,directions:m}}var N;(function(e){e.UP="UP",e.RIGHT="RIGHT",e.DOWN="DOWN",e.LEFT="LEFT",e.NONE="NONE"})(N||(N={}));var le=Object.defineProperty,W=Object.getOwnPropertySymbols,ue=Object.prototype.hasOwnProperty,ie=Object.prototype.propertyIsEnumerable,$=(e,n,t)=>n in e?le(e,n,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[n]=t,ce=(e,n)=>{for(var t in n||(n={}))ue.call(n,t)&&$(e,t,n[t]);if(W)for(var t of W(n))ie.call(n,t)&&$(e,t,n[t]);return e};const fe={easeInSine:[.12,0,.39,0],easeOutSine:[.61,1,.88,1],easeInOutSine:[.37,0,.63,1],easeInQuad:[.11,0,.5,0],easeOutQuad:[.5,1,.89,1],easeInOutQuad:[.45,0,.55,1],easeInCubic:[.32,0,.67,0],easeOutCubic:[.33,1,.68,1],easeInOutCubic:[.65,0,.35,1],easeInQuart:[.5,0,.75,0],easeOutQuart:[.25,1,.5,1],easeInOutQuart:[.76,0,.24,1],easeInQuint:[.64,0,.78,0],easeOutQuint:[.22,1,.36,1],easeInOutQuint:[.83,0,.17,1],easeInExpo:[.7,0,.84,0],easeOutExpo:[.16,1,.3,1],easeInOutExpo:[.87,0,.13,1],easeInCirc:[.55,0,1,.45],easeOutCirc:[0,.55,.45,1],easeInOutCirc:[.85,0,.15,1],easeInBack:[.36,0,.66,-.56],easeOutBack:[.34,1.56,.64,1],easeInOutBack:[.68,-.6,.32,1.6]};ce({linear:z},fe);export{ve as a,J as b,me as c,de as p,_e as u};

package/packages/storefront/dist/client/_astro/index.90df622b.css

@@ -1 +0,0 @@
-[data-prices-compare]{font-size:87%}[data-prices-cashback],[data-prices-installment],[data-prices-discount]{font-size:90%}[data-prices] small{text-transform:lowercase;font-size:92%}[data-prices~=Big]{font-size:1.125rem;line-height:1.75rem}[data-prices~=Big] [data-prices-sale]{display:block;font-size:3rem;line-height:1}