@rxdrag/website-lib 0.0.144 → 0.0.145

package/components/Document.astro

@@ -1,8 +1,10 @@
 ---
+import "aos/dist/aos.css";
 import { PageType, type PageMeta } from "@rxdrag/rxcms-models";
 import type { Locals } from "@rxdrag/website-lib-core";
 import Meta from "@rxdrag/website-lib/components/Meta.astro";
 import { Entify } from "@rxdrag/website-lib-core";
+import { ClientRouter } from "astro:transitions";
 
 const { env, imageSizes } = Astro.locals as Locals;
 
@@ -31,6 +33,15 @@ const {
   ...rest
 } = Astro.props;
 
+const bodyAttrs = {
+  "data-aos-easing": "ease-out-cubic",
+  "data-aos-duration": "800",
+  "data-aos-delay": "0",
+  "data-aos-offset": "50",
+  "data-aos-once": "true",
+  ...rest,
+};
+
 //TODO: 添加meta获取逻辑，有可能需要重构后端数据结构，现在看来，只有动态内容需要获取meta，其它页面可以传入
 
 let resolvedMeta: PageMeta | undefined = meta;
@@ -40,8 +51,10 @@ let resolvedTitle: string | undefined = title;
 if (!resolvedMeta || !resolvedTitle) {
   try {
     const pathname = Astro.url?.pathname || "";
-    const slug = typeof Astro.params?.slug === "string" ? Astro.params.slug : undefined;
-    const id = typeof Astro.params?.id === "string" ? Astro.params.id : undefined;
+    const slug =
+      typeof Astro.params?.slug === "string" ? Astro.params.slug : undefined;
+    const id =
+      typeof Astro.params?.id === "string" ? Astro.params.id : undefined;
 
     if (slug && pathname.startsWith("/posts/categories/")) {
       const category = await rx.getPostCategoryBySlug(slug);
@@ -63,7 +76,10 @@ if (!resolvedMeta || !resolvedTitle) {
       resolvedTitle = resolvedTitle ?? post?.title;
       resolvedMeta = resolvedMeta ?? post?.meta;
     } else if (slug && pathname.startsWith("/products/")) {
-      const product = await rx.getProductBySlug(slug, { width: 800, height: 800 });
+      const product = await rx.getProductBySlug(slug, {
+        width: 800,
+        height: 800,
+      });
       resolvedTitle = resolvedTitle ?? product?.title;
       resolvedMeta = resolvedMeta ?? product?.meta;
     }
@@ -86,6 +102,99 @@ if (!resolvedMeta || !resolvedTitle) {
     <link rel="sitemap" href="/sitemap-index.xml" />
     <link rel="icon" type="image/png" href="/favicon.png" />
     <!-- 给上层 Layout/页面注入自定义 head 内容（预加载、脚本、样式等） -->
+    <!-- 预连接 -->
+    <link
+      rel="preconnect"
+      href="https://customer-amj1dt4tnge8w6ji.cloudflarestream.com"
+      crossorigin
+    />
+    <script>
+      const w = window as any;
+      const state =
+        w.__aos_state__ ||
+        (w.__aos_state__ = { inited: false, loading: null, aos: null });
+
+      const el = document.documentElement;
+      const raf = () =>
+        new Promise((resolve) =>
+          requestAnimationFrame(() => resolve(undefined)),
+        );
+
+      const ensureAos = async () => {
+        if (state.aos) return state.aos;
+        if (!state.loading) {
+          state.loading = import("aos").then((m) => {
+            state.aos = m.default;
+            return state.aos;
+          });
+        }
+        return state.loading;
+      };
+
+      const bootOrRefresh = async () => {
+        if (
+          window.matchMedia &&
+          window.matchMedia("(prefers-reduced-motion: reduce)").matches
+        ) {
+          el.classList.add("aos-ready");
+          el.classList.remove("aos-preload");
+          return;
+        }
+
+        if (!document.querySelector("[data-aos]")) {
+          el.classList.add("aos-ready");
+          el.classList.remove("aos-preload");
+          return;
+        }
+
+        el.classList.add("aos-preload");
+        el.classList.remove("aos-ready");
+
+        const AOS = await ensureAos();
+        if (!state.inited) {
+          state.inited = true;
+          AOS.init({
+            duration: 800,
+            easing: "ease-out-cubic",
+            once: true,
+            offset: 50,
+          });
+        }
+
+        await raf();
+        await raf();
+        AOS.refresh();
+
+        el.classList.add("aos-ready");
+        el.classList.remove("aos-preload");
+      };
+
+      const boot = () => {
+        bootOrRefresh();
+      };
+
+      if (document.readyState === "loading") {
+        document.addEventListener("DOMContentLoaded", boot, { once: true });
+      } else {
+        boot();
+      }
+
+      document.addEventListener("astro:page-load", boot);
+      document.addEventListener("astro:after-swap", boot);
+    </script>
+    <ClientRouter />
+    <!-- Consent default (Google) -->
+    <script is:inline>
+      window.dataLayer = window.dataLayer || [];
+      function gtag() {
+        dataLayer.push(arguments);
+      }
+      gtag("js", new Date());
+      gtag("consent", "default", {
+        ad_storage: "denied",
+        analytics_storage: "denied",
+      });
+    </script>
     <slot name="head" />
     <Meta title={resolvedTitle} content={resolvedMeta} />
     <style>
@@ -97,7 +206,7 @@ if (!resolvedMeta || !resolvedTitle) {
     </style>
   </head>
   <!-- rest 会被展开到 body 上，方便上层控制 data-* 等属性 -->
-  <body class:list={[className, className2]} {...rest}>
+  <body class:list={[className, className2]} {...bodyAttrs}>
     <slot />
   </body>
 </html>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rxdrag/website-lib",
-  "version": "0.0.144",
+  "version": "0.0.145",
   "type": "module",
   "exports": {
     ".": "./index.ts",
@@ -29,11 +29,11 @@
     "gsap": "^3.12.7",
     "swiper": "^12.0.3",
     "typescript": "^5",
-    "@rxdrag/entify-hooks": "0.2.79",
     "@rxdrag/rxcms-models": "0.3.106",
-    "@rxdrag/eslint-config-custom": "0.2.13",
+    "@rxdrag/tiptap-preview": "0.0.3",
+    "@rxdrag/entify-hooks": "0.2.79",
     "@rxdrag/tsconfig": "0.2.1",
-    "@rxdrag/tiptap-preview": "0.0.3"
+    "@rxdrag/eslint-config-custom": "0.2.13"
   },
   "dependencies": {
     "aos": "3.0.0-beta.6",