denwa-web-shared 1.0.19 → 1.0.21

package/dist/server/index.cjs.js

@@ -6641,41 +6641,43 @@ const responseSchema = object({
 });
 const BasePicture = ({
   imgProps,
-  image1x,
-  image2x,
-  image1xWebp,
-  image2xWebp,
-  image1xAvif,
-  image2xAvif,
-  mobileImage1x,
-  mobileImage2x,
-  mobileImage1xWebp,
-  mobileImage2xWebp,
-  mobileImage1xAvif,
-  mobileImage2xAvif,
+  data,
   type,
   alt,
   mobileMaxWidth = 450,
   loading = "lazy",
   ...pictureProps
 }) => {
+  const {
+    image1x,
+    image2x,
+    image1xWebp,
+    image2xWebp,
+    image1xAvif,
+    image2xAvif,
+    mobileImage1x,
+    mobileImage2x,
+    mobileImage1xWebp,
+    mobileImage2xWebp,
+    mobileImage1xAvif,
+    mobileImage2xAvif
+  } = data;
   return /* @__PURE__ */ jsxRuntime.jsxs("picture", { ...pictureProps, children: [
-    mobileImage1x && /* @__PURE__ */ jsxRuntime.jsx(
+    image1xAvif && /* @__PURE__ */ jsxRuntime.jsx(
       "source",
       {
-        srcSet: `${mobileImage1x} 1x${mobileImage2x ? `, ${mobileImage2x} 2x` : ""}`,
-        media: `(max-width: ${mobileMaxWidth}px)`,
-        type
+        srcSet: `${image1xAvif} 1x${image2xAvif ? `, ${image2xAvif} 2x` : ""}`,
+        type: "image/avif"
       }
     ),
-    mobileImage1xWebp && /* @__PURE__ */ jsxRuntime.jsx(
+    image1xWebp && /* @__PURE__ */ jsxRuntime.jsx(
       "source",
       {
-        srcSet: `${mobileImage1xWebp} 1x${mobileImage2xWebp ? `, ${mobileImage2xWebp} 2x` : ""}`,
-        media: `(max-width: ${mobileMaxWidth}px)`,
+        srcSet: `${image1xWebp} 1x${image2xWebp ? `, ${image2xWebp} 2x` : ""}`,
         type: "image/webp"
       }
     ),
+    /* @__PURE__ */ jsxRuntime.jsx("source", { srcSet: `${image1x} 1x${image2x ? `, ${image2x} 2x` : ""}`, type }),
     mobileImage1xAvif && /* @__PURE__ */ jsxRuntime.jsx(
       "source",
       {
@@ -6684,29 +6686,31 @@ const BasePicture = ({
         type: "image/avif"
       }
     ),
-    image1xWebp && /* @__PURE__ */ jsxRuntime.jsx(
+    mobileImage1xWebp && /* @__PURE__ */ jsxRuntime.jsx(
       "source",
       {
-        srcSet: `${image1xWebp} 1x${image2xWebp ? `, ${image2xWebp} 2x` : ""}`,
+        srcSet: `${mobileImage1xWebp} 1x${mobileImage2xWebp ? `, ${mobileImage2xWebp} 2x` : ""}`,
+        media: `(max-width: ${mobileMaxWidth}px)`,
         type: "image/webp"
       }
     ),
-    image1xAvif && /* @__PURE__ */ jsxRuntime.jsx(
+    mobileImage1x && /* @__PURE__ */ jsxRuntime.jsx(
       "source",
       {
-        srcSet: `${image1xAvif} 1x${image2xAvif ? `, ${image2xAvif} 2x` : ""}`,
-        type: "image/avif"
+        srcSet: `${mobileImage1x} 1x${mobileImage2x ? `, ${mobileImage2x} 2x` : ""}`,
+        media: `(max-width: ${mobileMaxWidth}px)`,
+        type
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx("source", { srcSet: `${image1x} 1x${image2x ? `, ${image2x} 2x` : ""}`, type }),
     /* @__PURE__ */ jsxRuntime.jsx(
       "img",
       {
         ...imgProps,
-        className: imgProps == null ? void 0 : imgProps.className,
         src: image1x,
         alt,
-        loading
+        loading,
+        decoding: loading === "eager" ? "sync" : "async",
+        fetchPriority: loading === "eager" ? "high" : "low"
       }
     )
   ] });

package/dist/server/index.es.js

@@ -6639,41 +6639,43 @@ const responseSchema = object({
 });
 const BasePicture = ({
   imgProps,
-  image1x,
-  image2x,
-  image1xWebp,
-  image2xWebp,
-  image1xAvif,
-  image2xAvif,
-  mobileImage1x,
-  mobileImage2x,
-  mobileImage1xWebp,
-  mobileImage2xWebp,
-  mobileImage1xAvif,
-  mobileImage2xAvif,
+  data,
   type,
   alt,
   mobileMaxWidth = 450,
   loading = "lazy",
   ...pictureProps
 }) => {
+  const {
+    image1x,
+    image2x,
+    image1xWebp,
+    image2xWebp,
+    image1xAvif,
+    image2xAvif,
+    mobileImage1x,
+    mobileImage2x,
+    mobileImage1xWebp,
+    mobileImage2xWebp,
+    mobileImage1xAvif,
+    mobileImage2xAvif
+  } = data;
   return /* @__PURE__ */ jsxs("picture", { ...pictureProps, children: [
-    mobileImage1x && /* @__PURE__ */ jsx(
+    image1xAvif && /* @__PURE__ */ jsx(
       "source",
       {
-        srcSet: `${mobileImage1x} 1x${mobileImage2x ? `, ${mobileImage2x} 2x` : ""}`,
-        media: `(max-width: ${mobileMaxWidth}px)`,
-        type
+        srcSet: `${image1xAvif} 1x${image2xAvif ? `, ${image2xAvif} 2x` : ""}`,
+        type: "image/avif"
       }
     ),
-    mobileImage1xWebp && /* @__PURE__ */ jsx(
+    image1xWebp && /* @__PURE__ */ jsx(
       "source",
       {
-        srcSet: `${mobileImage1xWebp} 1x${mobileImage2xWebp ? `, ${mobileImage2xWebp} 2x` : ""}`,
-        media: `(max-width: ${mobileMaxWidth}px)`,
+        srcSet: `${image1xWebp} 1x${image2xWebp ? `, ${image2xWebp} 2x` : ""}`,
         type: "image/webp"
       }
     ),
+    /* @__PURE__ */ jsx("source", { srcSet: `${image1x} 1x${image2x ? `, ${image2x} 2x` : ""}`, type }),
     mobileImage1xAvif && /* @__PURE__ */ jsx(
       "source",
       {
@@ -6682,29 +6684,31 @@ const BasePicture = ({
         type: "image/avif"
       }
     ),
-    image1xWebp && /* @__PURE__ */ jsx(
+    mobileImage1xWebp && /* @__PURE__ */ jsx(
       "source",
       {
-        srcSet: `${image1xWebp} 1x${image2xWebp ? `, ${image2xWebp} 2x` : ""}`,
+        srcSet: `${mobileImage1xWebp} 1x${mobileImage2xWebp ? `, ${mobileImage2xWebp} 2x` : ""}`,
+        media: `(max-width: ${mobileMaxWidth}px)`,
         type: "image/webp"
       }
     ),
-    image1xAvif && /* @__PURE__ */ jsx(
+    mobileImage1x && /* @__PURE__ */ jsx(
       "source",
       {
-        srcSet: `${image1xAvif} 1x${image2xAvif ? `, ${image2xAvif} 2x` : ""}`,
-        type: "image/avif"
+        srcSet: `${mobileImage1x} 1x${mobileImage2x ? `, ${mobileImage2x} 2x` : ""}`,
+        media: `(max-width: ${mobileMaxWidth}px)`,
+        type
       }
     ),
-    /* @__PURE__ */ jsx("source", { srcSet: `${image1x} 1x${image2x ? `, ${image2x} 2x` : ""}`, type }),
     /* @__PURE__ */ jsx(
       "img",
       {
         ...imgProps,
-        className: imgProps == null ? void 0 : imgProps.className,
         src: image1x,
         alt,
-        loading
+        loading,
+        decoding: loading === "eager" ? "sync" : "async",
+        fetchPriority: loading === "eager" ? "high" : "low"
       }
     )
   ] });

package/dist/server/ui/image.d.ts

@@ -1,7 +1,14 @@
 import { DetailedHTMLProps, FC, HTMLAttributes, ImgHTMLAttributes } from 'react';
 import { ImageType } from '../types';
-export interface BasePictureProps extends DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement> {
+export interface BasePictureProps extends DetailedHTMLProps<HTMLAttributes<HTMLPictureElement>, HTMLPictureElement> {
     imgProps?: DetailedHTMLProps<ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>;
+    data: PictureData;
+    type: ImageType;
+    alt: string;
+    mobileMaxWidth?: number;
+    loading?: 'eager' | 'lazy';
+}
+export interface PictureData {
     image1x: string;
     image2x?: string;
     image1xWebp?: string;
@@ -14,9 +21,5 @@ export interface BasePictureProps extends DetailedHTMLProps<HTMLAttributes<HTMLE
     mobileImage2xWebp?: string;
     mobileImage1xAvif?: string;
     mobileImage2xAvif?: string;
-    type: ImageType;
-    alt: string;
-    mobileMaxWidth?: number;
-    loading?: 'eager' | 'lazy';
 }
 export declare const BasePicture: FC<BasePictureProps>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "denwa-web-shared",
   "private": false,
-  "version": "1.0.19",
+  "version": "1.0.21",
   "type": "module",
   "author": "Denwa",
   "main": "dist/denwa-web-shared.cjs.js",