@rxdrag/website-lib 0.0.129 → 0.0.131

package/components/Image.astro

@@ -7,6 +7,8 @@ interface Props extends ImageProps {}
 const {
   src,
   alt = "",
+  width,
+  height,
   layout,
   formats,
   loading,
@@ -42,6 +44,8 @@ if (isStringSrc && (src.startsWith("/src/") || src.startsWith("src/"))) {
     <img
       src={src}
       alt={alt}
+      width={width}
+      height={height}
       loading={loading}
       class={className}
       {...restProps}
@@ -50,6 +54,8 @@ if (isStringSrc && (src.startsWith("/src/") || src.startsWith("src/"))) {
     <AstroPicture
       src={src}
       alt={alt}
+      width={width}
+      height={height}
       formats={formats}
       quality={quality}
       loading={priority ? "eager" : loading}
@@ -62,6 +68,8 @@ if (isStringSrc && (src.startsWith("/src/") || src.startsWith("src/"))) {
     <AstroImage
       src={src}
       alt={alt}
+      width={width}
+      height={height}
       quality={quality}
       loading={loading}
       sizes={actualSizes}

package/components/Image.type.ts

@@ -113,6 +113,22 @@ export interface ImageProps extends Omit<HTMLAttributes<"img">, "src" | "width"
    */
   src: string | ImageMetadata;
 
+  /**
+   * 图片宽度
+   * - 本地图片可自动推断，可不填
+   * - 远程图片必须填写
+   * - 使用 Tailwind aspect-* 时可省略
+   */
+  width?: number;
+
+  /**
+   * 图片高度
+   * - 本地图片可自动推断，可不填
+   * - 远程图片必须填写
+   * - 使用 Tailwind aspect-* 时可省略
+   */
+  height?: number;
+
   /**
    * 图片描述（用于无障碍访问和 SEO）
    * - 内容图片：填写描述文字

package/components/Video.astro

@@ -4,15 +4,14 @@ import {
   ReactVideoPlayer,
   type Locals,
 } from "@rxdrag/website-lib-core";
+import { getImage } from "astro:assets";
+import type { ImageMetadata } from "astro";
+
 const { env, imageSizes } = Astro.locals as Locals;
 
 interface Props {
-  //TODO 要删除
   videoRef?: string;
-  //TODO 要删除
-  posterRef?: string;
-  src?: string;
-  poster?: string;
+  poster?: string | ImageMetadata;
   endTitle?: string;
   eagerLoad?: boolean;
   classNames?: {
@@ -31,8 +30,6 @@ interface Props {
 
 const {
   videoRef,
-  posterRef,
-  src,
   poster,
   eagerLoad,
   endTitle = "Contact Us Now",
@@ -43,7 +40,17 @@ const rx = Entify.getInstance(env, imageSizes);
 
 // 获取媒体数据（增加 rx 为空时的保护）
 const media = rx ? await rx.getMedia(videoRef) : undefined;
-const posterObj = rx ? await rx.getMedia(posterRef) : undefined;
+
+// 处理封面图
+let posterUrl: string | undefined;
+if (poster) {
+  if (typeof poster === "string") {
+    posterUrl = poster;
+  } else {
+    const posterImage = await getImage({ src: poster });
+    posterUrl = posterImage.src;
+  }
+}
 ---
 
 {
@@ -52,7 +59,7 @@ const posterObj = rx ? await rx.getMedia(posterRef) : undefined;
       client:load
       media={media}
       endTitle={endTitle}
-      posterUrl={posterObj?.file?.original}
+      posterUrl={posterUrl}
       eagerLoad={eagerLoad}
       classNames={classNames}
     />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rxdrag/website-lib",
-  "version": "0.0.129",
+  "version": "0.0.131",
   "type": "module",
   "exports": {
     ".": "./index.ts",
@@ -26,10 +26,10 @@
     "eslint": "^9.39.2",
     "gsap": "^3.12.7",
     "typescript": "^5",
+    "@rxdrag/tiptap-preview": "0.0.3",
     "@rxdrag/entify-hooks": "0.2.79",
     "@rxdrag/rxcms-models": "0.3.98",
     "@rxdrag/eslint-config-custom": "0.2.13",
-    "@rxdrag/tiptap-preview": "0.0.3",
     "@rxdrag/tsconfig": "0.2.1"
   },
   "dependencies": {
@@ -38,8 +38,8 @@
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "vanilla-cookieconsent": "3.1.0",
-    "@rxdrag/website-lib-core": "0.0.122",
-    "@rxdrag/rxcms-models": "0.3.98"
+    "@rxdrag/rxcms-models": "0.3.98",
+    "@rxdrag/website-lib-core": "0.0.123"
   },
   "peerDependencies": {
     "astro": "^4.0.0 || ^5.0.0"