dune-react 0.0.31 → 0.0.33

package/dist/components/puck-block/cta-sections/side-media-cta/side-media-cta.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { CompoundButton } from "../../../puck-base/button.js";
-import { CompoundImage } from "../../../puck-base/image.js";
+import { CompoundMedia } from "../../../puck-base/media.js";
 import { cn } from "../../../../utils/css-utils.js";
 import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
 const SideMediaCta = (props) => {
@@ -10,7 +10,7 @@ const SideMediaCta = (props) => {
     heading,
     description,
     buttons,
-    images,
+    medias,
     // inputPlaceholder,
     // formButton,
     // termsAndConditions,
@@ -35,7 +35,7 @@ const SideMediaCta = (props) => {
     /* @__PURE__ */ jsx("p", { className: "md:text-md", children: description }),
     renderActions()
   ] });
-  const mediaContent = /* @__PURE__ */ jsx("div", { className: cn({ "flex items-center justify-center": bordered }), children: /* @__PURE__ */ jsx(CompoundImage, { src: (_a = images == null ? void 0 : images[0]) == null ? void 0 : _a.src, className: "w-full object-cover", alt: (_b = images == null ? void 0 : images[0]) == null ? void 0 : _b.alt }) });
+  const mediaContent = /* @__PURE__ */ jsx("div", { className: cn({ "flex items-center justify-center": bordered }), children: /* @__PURE__ */ jsx(CompoundMedia, { src: (_a = medias == null ? void 0 : medias[0]) == null ? void 0 : _a.src, className: "w-full object-cover", alt: (_b = medias == null ? void 0 : medias[0]) == null ? void 0 : _b.alt }) });
   const isLeftMedia = mediaPosition === "left";
   if (bordered) {
     return /* @__PURE__ */ jsx(SectionWrapper, { className: cn("px-[5%] py-6 md:py-8 lg:py-10", sectionClassName), style: sectionStyle, css, children: /* @__PURE__ */ jsx("div", { className: "container", children: /* @__PURE__ */ jsx("div", { className: "grid auto-cols-fr grid-cols-1 border border-border-primary lg:grid-cols-2", children: isLeftMedia ? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -57,7 +57,7 @@ const SideMediaCtaDefaults = {
   heading: "Medium length heading goes here",
   description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.",
   buttons: [{ label: "Button" }, { label: "Button", variant: "secondary" }],
-  images: [
+  medias: [
     {
       src: "https://picsum.photos/seed/cta-side/800/600",
       alt: "Placeholder image"

package/dist/components/puck-block/cta-sections/text-block-cta/index.d.ts

@@ -91,7 +91,7 @@ declare const conf: {
                 readonly instructions: "Buttons must use the same size";
             };
         };
-        images: {
+        medias: {
             readonly type: "array";
             readonly max: 10;
             readonly getItemSummary: (item: {
@@ -220,7 +220,7 @@ declare const conf: {
         };
     };
     defaultProps: Omit<import("../props").CtaSectionBaseProps, "inputPlaceholder" | "formButton" | "termsAndConditions"> & {
-        logos: import("@/components/puck-core/core/props/media").BaseImage[];
+        logos: import("@/components/puck-core/core/props/media").BaseMedia[];
     };
     render: (props: TextBlockCtaProps) => import("react/jsx-runtime").JSX.Element;
 };

package/dist/components/puck-block/cta-sections/text-block-cta/index.js

@@ -1,7 +1,7 @@
 import { TextBlockCta, TextBlockCtaDefaults } from "./text-block-cta.js";
 import { descriptionField, headingField } from "../../../puck-core/core/props/content.js";
 import { buttonsField } from "../../../puck-core/core/props/interactive.js";
-import { imagesField } from "../../../puck-core/core/props/media.js";
+import { mediasField } from "../../../puck-core/core/props/media.js";
 import { ctaStyleFields } from "../props.js";
 import { sectionWrapperFields } from "../../../puck-core/section-wrapper.js";
 const conf = {
@@ -9,12 +9,12 @@ const conf = {
     heading: headingField,
     description: descriptionField,
     buttons: buttonsField,
-    images: imagesField,
+    medias: mediasField,
     video: { type: "text" },
     // inputPlaceholder: { type: "text" },
     // formButton: buttonField,
     // termsAndConditions: { type: "textarea" },
-    logos: imagesField,
+    logos: mediasField,
     styles: {
       type: "object",
       label: "Styles",

package/dist/components/puck-block/cta-sections/text-block-cta/text-block-cta.d.ts

@@ -1,8 +1,8 @@
-import type { CtaComponentProps, CtaSectionBaseProps, BaseImage } from "../props";
+import type { CtaComponentProps, CtaSectionBaseProps, BaseMedia } from "../props";
 export type TextBlockCtaProps = CtaComponentProps<{
-    logos: BaseImage[];
+    logos: BaseMedia[];
 }>;
 export declare const TextBlockCta: (props: TextBlockCtaProps) => import("react/jsx-runtime").JSX.Element;
 export declare const TextBlockCtaDefaults: Omit<CtaSectionBaseProps, "inputPlaceholder" | "formButton" | "termsAndConditions"> & {
-    logos: BaseImage[];
+    logos: BaseMedia[];
 };

package/dist/components/puck-block/cta-sections/text-block-cta/text-block-cta.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { CompoundButton } from "../../../puck-base/button.js";
-import { CompoundImage } from "../../../puck-base/image.js";
+import { CompoundMedia } from "../../../puck-base/media.js";
 import { cn } from "../../../../utils/css-utils.js";
 import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
 const TextBlockCta = (props) => {
@@ -9,7 +9,7 @@ const TextBlockCta = (props) => {
     heading,
     description,
     buttons,
-    images,
+    medias,
     video,
     // inputPlaceholder,
     // formButton,
@@ -42,18 +42,18 @@ const TextBlockCta = (props) => {
     return /* @__PURE__ */ jsx("div", { className: "mt-6 flex flex-wrap gap-4 md:mt-8", children: buttons.map((button, index) => /* @__PURE__ */ jsx(CompoundButton, { label: button.label, variant: button.variant, size: button.size, action: button.action, icon: button.icon }, index)) });
   };
   const renderBottomContent = () => {
-    if (bottomContent === "image" && images && images.length > 0) {
+    if (bottomContent === "image" && medias && medias.length > 0) {
       return /* @__PURE__ */ jsx("div", { className: "mt-12 md:mt-18 lg:mt-20", children: /* @__PURE__ */ jsx(
-        CompoundImage,
+        CompoundMedia,
         {
-          src: images[0].src,
-          alt: images[0].alt,
+          src: medias[0].src,
+          alt: medias[0].alt,
           className: "w-full object-cover"
         }
       ) });
     }
     if (bottomContent === "logos" && logos && logos.length > 0) {
-      return /* @__PURE__ */ jsx("div", { className: "mt-12 flex flex-wrap items-center justify-center gap-x-8 gap-y-6 md:mt-18 lg:mt-20", children: logos.map((logo, index) => /* @__PURE__ */ jsx(CompoundImage, { src: logo.src, alt: logo.alt, className: "max-h-12" }, index)) });
+      return /* @__PURE__ */ jsx("div", { className: "mt-12 flex flex-wrap items-center justify-center gap-x-8 gap-y-6 md:mt-18 lg:mt-20", children: logos.map((logo, index) => /* @__PURE__ */ jsx(CompoundMedia, { src: logo.src, alt: logo.alt, className: "max-h-12" }, index)) });
     }
     return null;
   };
@@ -63,7 +63,7 @@ const TextBlockCta = (props) => {
     if (isFullscreenBg) {
       return /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 z-0", children: [
         isBgImage && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(CompoundImage, { src: (_a = images == null ? void 0 : images[0]) == null ? void 0 : _a.src, className: "size-full object-cover", alt: (_b = images == null ? void 0 : images[0]) == null ? void 0 : _b.alt }),
+          /* @__PURE__ */ jsx(CompoundMedia, { src: (_a = medias == null ? void 0 : medias[0]) == null ? void 0 : _a.src, className: "size-full object-cover", alt: (_b = medias == null ? void 0 : medias[0]) == null ? void 0 : _b.alt }),
           /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-black/50" })
         ] }),
         isBgVideo && /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -78,7 +78,7 @@ const TextBlockCta = (props) => {
     var _a, _b;
     if (!isContainerBg) return null;
     return /* @__PURE__ */ jsxs("div", { className: "mt-12 md:mt-18 lg:mt-20", children: [
-      isBgImage && /* @__PURE__ */ jsx(CompoundImage, { src: (_a = images == null ? void 0 : images[0]) == null ? void 0 : _a.src, className: "w-full object-cover", alt: (_b = images == null ? void 0 : images[0]) == null ? void 0 : _b.alt }),
+      isBgImage && /* @__PURE__ */ jsx(CompoundMedia, { src: (_a = medias == null ? void 0 : medias[0]) == null ? void 0 : _a.src, className: "w-full object-cover", alt: (_b = medias == null ? void 0 : medias[0]) == null ? void 0 : _b.alt }),
       isBgVideo && /* @__PURE__ */ jsx("video", { className: "w-full object-cover", autoPlay: true, loop: true, muted: true, children: /* @__PURE__ */ jsx("source", { src: video, type: "video/mp4" }) })
     ] });
   };
@@ -127,7 +127,7 @@ const TextBlockCtaDefaults = {
   heading: "Medium length heading goes here",
   description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.",
   buttons: [{ label: "Button" }, { label: "Button", variant: "secondary" }],
-  images: [
+  medias: [
     {
       src: "https://picsum.photos/seed/cta-bg/1920/1080",
       alt: "Placeholder image"

package/dist/components/puck-block/faq-sections/icon-card-faq/icon-card-faq.d.ts

@@ -1,6 +1,6 @@
-import type { FaqComponentProps, BaseImage } from "../props";
+import type { FaqComponentProps, BaseMedia } from "../props";
 type IconQuestion = {
-    icon: BaseImage;
+    icon: BaseMedia;
     question: string;
     answer: string;
 };

package/dist/components/puck-block/faq-sections/icon-card-faq/icon-card-faq.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "../../../shadcn/button.js";
-import { CompoundImage } from "../../../puck-base/image.js";
+import { CompoundMedia } from "../../../puck-base/media.js";
 import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
 import { cn } from "../../../../utils/css-utils.js";
 const IconCardFaq = (props) => {
@@ -23,7 +23,7 @@ const IconCardFaq = (props) => {
       /* @__PURE__ */ jsx("p", { className: "md:text-md", children: description })
     ] }),
     /* @__PURE__ */ jsx("div", { className: "container grid grid-cols-1 items-start justify-center gap-y-12 md:grid-cols-3 md:gap-x-8 md:gap-y-16 lg:gap-x-12 lg:gap-y-16", children: (iconQuestions ?? []).map((q, index) => /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-center text-center", children: [
-      /* @__PURE__ */ jsx("div", { className: "rb-5 mb-5 md:mb-6", children: /* @__PURE__ */ jsx(CompoundImage, { src: q.icon.src, alt: q.icon.alt, className: "size-12" }) }),
+      /* @__PURE__ */ jsx("div", { className: "rb-5 mb-5 md:mb-6", children: /* @__PURE__ */ jsx(CompoundMedia, { src: q.icon.src, alt: q.icon.alt, className: "size-12" }) }),
       /* @__PURE__ */ jsx("h3", { className: "mb-3 font-bold md:mb-4 md:text-md", children: q.question }),
       /* @__PURE__ */ jsx("p", { children: q.answer })
     ] }, index)) }),

package/dist/components/puck-block/faq-sections/icon-card-faq/index.js

@@ -1,7 +1,7 @@
 import { IconCardFaq, IconCardFaqDefaults } from "./icon-card-faq.js";
 import { descriptionField, headingField } from "../../../puck-core/core/props/content.js";
 import { buttonField } from "../../../puck-core/core/props/interactive.js";
-import { imageField } from "../../../puck-core/core/props/media.js";
+import { mediaField } from "../../../puck-core/core/props/media.js";
 const conf = {
   fields: {
     heading: headingField,
@@ -11,7 +11,7 @@ const conf = {
       max: 12,
       getItemSummary: (item, index = 0) => item.question || `Question ${index + 1}`,
       arrayFields: {
-        icon: imageField,
+        icon: mediaField,
         question: { type: "text", contentEditable: true },
         answer: { type: "textarea", contentEditable: true }
       }

package/dist/components/puck-block/faq-sections/props.d.ts

@@ -4,9 +4,9 @@
  * 基础类型引用自 ../props/（全局共享）
  * FaqSectionStyles 为 FAQ 特有的样式字段
  */
-import type { BaseImage } from "@/components/puck-core/core/props/media";
+import type { BaseMedia } from "@/components/puck-core/core/props/media";
 import type { BaseButton } from "@/components/puck-core/core/props/interactive";
-export type { BaseImage, BaseButton };
+export type { BaseMedia, BaseButton };
 export interface FaqSectionStyles {
     className?: string;
     style?: React.CSSProperties;
@@ -21,7 +21,7 @@ export interface FaqQuestion {
     answer: string;
 }
 export interface FaqQuestionWithIcon {
-    icon: BaseImage;
+    icon: BaseMedia;
     question: string;
     answer: string;
 }

package/dist/components/puck-block/feature-sections/feature-cards-grid/component.d.ts

@@ -1,6 +1,6 @@
-import type { FeatureComponentProps, BaseImage, BaseButton } from "../props";
+import type { FeatureComponentProps, BaseMedia, BaseButton } from "../props";
 type FeatureCard = {
-    icon: BaseImage;
+    icon: BaseMedia;
     heading: string;
     description: string;
     buttons?: BaseButton[];

package/dist/components/puck-block/feature-sections/feature-cards-grid/component.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Dialog, DialogTrigger, DialogContent } from "../../../shadcn/dialog.js";
 import { CompoundButton } from "../../../puck-base/button.js";
-import { CompoundImage } from "../../../puck-base/image.js";
+import { CompoundMedia } from "../../../puck-base/media.js";
 import { FaCirclePlay } from "../../../../node_modules/.pnpm/react-icons@5.6.0_react@19.2.4/node_modules/react-icons/fa6/index.js";
 import { CgSpinner } from "../../../../node_modules/.pnpm/react-icons@5.6.0_react@19.2.4/node_modules/react-icons/cg/index.js";
 import { cn } from "../../../../utils/css-utils.js";
@@ -11,7 +11,7 @@ import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
 const FeatureCardsGrid = (props) => {
   const {
     features = [],
-    image = { src: "", alt: "" },
+    media = { src: "", alt: "" },
     video,
     buttons = [],
     styles
@@ -31,7 +31,7 @@ const FeatureCardsGrid = (props) => {
     if (mediaType === "play") {
       return /* @__PURE__ */ jsxs(Dialog, { children: [
         /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: "relative flex w-full items-center justify-center", children: [
-          /* @__PURE__ */ jsx(CompoundImage, { src: image.src, alt: image.alt, className: "size-full object-cover" }),
+          /* @__PURE__ */ jsx(CompoundMedia, { src: media.src, alt: media.alt, className: "size-full object-cover" }),
           /* @__PURE__ */ jsx("span", { className: "absolute inset-0 z-10 bg-black/50" }),
           /* @__PURE__ */ jsx(FaCirclePlay, { className: "absolute z-20 size-16 text-white" })
         ] }) }),
@@ -56,12 +56,12 @@ const FeatureCardsGrid = (props) => {
     if (mediaType === "video") {
       return /* @__PURE__ */ jsx("video", { className: "w-full object-cover", autoPlay: true, loop: true, muted: true, children: /* @__PURE__ */ jsx("source", { src: video, type: "video/mp4" }) });
     }
-    return /* @__PURE__ */ jsx(CompoundImage, { src: image.src, className: "size-full object-cover", alt: image.alt });
+    return /* @__PURE__ */ jsx(CompoundMedia, { src: media.src, className: "size-full object-cover", alt: media.alt });
   };
   return /* @__PURE__ */ jsx(SectionWrapper, { className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName), style: sectionStyle, css, children: /* @__PURE__ */ jsx("div", { className: "container", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-center gap-y-12 md:grid-cols-2 md:gap-x-12 lg:gap-x-20", children: [
     /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-x-6 gap-y-8 py-2 sm:grid-cols-2", children: features.map((feature, index) => /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("div", { className: "mb-3 md:mb-4", children: /* @__PURE__ */ jsx(CompoundImage, { src: feature.icon.src, className: "size-12", alt: feature.icon.alt }) }),
+        /* @__PURE__ */ jsx("div", { className: "mb-3 md:mb-4", children: /* @__PURE__ */ jsx(CompoundMedia, { src: feature.icon.src, className: "size-12", alt: feature.icon.alt }) }),
         /* @__PURE__ */ jsx("h3", { className: "mb-3 text-xl font-bold md:mb-4 md:text-2xl", children: feature.heading }),
         /* @__PURE__ */ jsx("p", { children: feature.description }),
         feature.buttons && feature.buttons.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-4 flex flex-wrap items-center gap-4", children: feature.buttons.map((button, bIndex) => /* @__PURE__ */ jsx(CompoundButton, { label: button.label, variant: button.variant, size: button.size, action: button.action, icon: button.icon }, bIndex)) })
@@ -94,7 +94,7 @@ const FeatureCardsGridDefaults = {
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros."
     }
   ],
-  image: {
+  media: {
     src: "https://picsum.photos/seed/feature-cards/800/600",
     alt: "Placeholder image"
   },

package/dist/components/puck-block/feature-sections/feature-cards-grid/index.d.ts

@@ -185,7 +185,7 @@ declare const conf: {
                 readonly instructions: "Buttons must use the same size";
             };
         };
-        image: {
+        media: {
             type: "object";
             objectFields: {
                 src: import("@puckeditor/core").Field<string>;

package/dist/components/puck-block/feature-sections/feature-cards-grid/index.js

@@ -1,6 +1,6 @@
 import { FeatureCardsGrid, FeatureCardsGridDefaults } from "./component.js";
 import { buttonsField } from "../../../puck-core/core/props/interactive.js";
-import { imageField } from "../../../puck-core/core/props/media.js";
+import { mediaField } from "../../../puck-core/core/props/media.js";
 import { featureStyleFields } from "../props.js";
 import { sectionWrapperFields } from "../../../puck-core/section-wrapper.js";
 const conf = {
@@ -9,14 +9,14 @@ const conf = {
       type: "array",
       getItemSummary: (item, index = 0) => item.heading || `Feature ${index + 1}`,
       arrayFields: {
-        icon: imageField,
+        icon: mediaField,
         heading: { type: "text" },
         description: { type: "textarea" },
         buttons: buttonsField
       }
     },
     buttons: buttonsField,
-    image: imageField,
+    media: mediaField,
     video: { type: "text" },
     styles: {
       type: "object",

package/dist/components/puck-block/feature-sections/feature-list-split/component.d.ts

@@ -1,6 +1,6 @@
-import type { FeatureComponentProps, BaseImage, BaseButton } from "../props";
+import type { FeatureComponentProps, BaseMedia, BaseButton } from "../props";
 type FeatureListItem = {
-    icon: BaseImage;
+    icon: BaseMedia;
     heading: string;
     description: string;
     buttons?: BaseButton[];

package/dist/components/puck-block/feature-sections/feature-list-split/component.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Dialog, DialogTrigger, DialogContent } from "../../../shadcn/dialog.js";
 import { CompoundButton } from "../../../puck-base/button.js";
-import { CompoundImage } from "../../../puck-base/image.js";
+import { CompoundMedia } from "../../../puck-base/media.js";
 import { FaCirclePlay } from "../../../../node_modules/.pnpm/react-icons@5.6.0_react@19.2.4/node_modules/react-icons/fa6/index.js";
 import { CgSpinner } from "../../../../node_modules/.pnpm/react-icons@5.6.0_react@19.2.4/node_modules/react-icons/cg/index.js";
 import { cn } from "../../../../utils/css-utils.js";
@@ -11,7 +11,7 @@ import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
 const FeatureListSplit = (props) => {
   const {
     featureSections = [],
-    image = { src: "", alt: "" },
+    media = { src: "", alt: "" },
     video,
     buttons = [],
     styles
@@ -31,7 +31,7 @@ const FeatureListSplit = (props) => {
     if (mediaType === "play") {
       return /* @__PURE__ */ jsxs(Dialog, { children: [
         /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: "relative flex w-full items-center justify-center", children: [
-          /* @__PURE__ */ jsx(CompoundImage, { src: image.src, alt: image.alt, className: "size-full object-cover" }),
+          /* @__PURE__ */ jsx(CompoundMedia, { src: media.src, alt: media.alt, className: "size-full object-cover" }),
           /* @__PURE__ */ jsx("span", { className: "absolute inset-0 z-10 bg-black/50" }),
           /* @__PURE__ */ jsx(FaCirclePlay, { className: "absolute z-20 size-16 text-white" })
         ] }) }),
@@ -56,12 +56,12 @@ const FeatureListSplit = (props) => {
     if (mediaType === "video") {
       return /* @__PURE__ */ jsx("video", { className: "w-full object-cover", autoPlay: true, loop: true, muted: true, children: /* @__PURE__ */ jsx("source", { src: video, type: "video/mp4" }) });
     }
-    return /* @__PURE__ */ jsx(CompoundImage, { src: image.src, className: "w-full object-cover", alt: image.alt });
+    return /* @__PURE__ */ jsx(CompoundMedia, { src: media.src, className: "w-full object-cover", alt: media.alt });
   };
   return /* @__PURE__ */ jsx(SectionWrapper, { className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName), style: sectionStyle, css, children: /* @__PURE__ */ jsx("div", { className: "container", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-center gap-y-12 md:grid-cols-2 md:gap-x-12 lg:gap-x-20", children: [
     /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-x-6 gap-y-8 py-2", children: featureSections.map((section, index) => /* @__PURE__ */ jsxs("div", { className: "flex self-start", children: [
-        /* @__PURE__ */ jsx("div", { className: "mr-6 flex-none self-start", children: /* @__PURE__ */ jsx(CompoundImage, { src: section.icon.src, className: "size-12", alt: section.icon.alt }) }),
+        /* @__PURE__ */ jsx("div", { className: "mr-6 flex-none self-start", children: /* @__PURE__ */ jsx(CompoundMedia, { src: section.icon.src, className: "size-12", alt: section.icon.alt }) }),
         /* @__PURE__ */ jsxs("div", { children: [
           /* @__PURE__ */ jsx("h3", { className: "mb-3 text-xl font-bold md:mb-4 md:text-2xl", children: section.heading }),
           /* @__PURE__ */ jsx("p", { children: section.description }),
@@ -91,7 +91,7 @@ const FeatureListSplitDefaults = {
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique."
     }
   ],
-  image: {
+  media: {
     src: "https://picsum.photos/seed/feature-list/800/600",
     alt: "Placeholder image"
   },

package/dist/components/puck-block/feature-sections/feature-list-split/index.d.ts

@@ -185,7 +185,7 @@ declare const conf: {
                 readonly instructions: "Buttons must use the same size";
             };
         };
-        image: {
+        media: {
             type: "object";
             objectFields: {
                 src: import("@puckeditor/core").Field<string>;

package/dist/components/puck-block/feature-sections/feature-list-split/index.js

@@ -1,6 +1,6 @@
 import { FeatureListSplit, FeatureListSplitDefaults } from "./component.js";
 import { buttonsField } from "../../../puck-core/core/props/interactive.js";
-import { imageField } from "../../../puck-core/core/props/media.js";
+import { mediaField } from "../../../puck-core/core/props/media.js";
 import { featureStyleFields } from "../props.js";
 import { sectionWrapperFields } from "../../../puck-core/section-wrapper.js";
 const conf = {
@@ -9,14 +9,14 @@ const conf = {
       type: "array",
       getItemSummary: (item, index = 0) => item.heading || `Feature ${index + 1}`,
       arrayFields: {
-        icon: imageField,
+        icon: mediaField,
         heading: { type: "text" },
         description: { type: "textarea" },
         buttons: buttonsField
       }
     },
     buttons: buttonsField,
-    image: imageField,
+    media: mediaField,
     video: { type: "text" },
     styles: {
       type: "object",

package/dist/components/puck-block/feature-sections/props.d.ts

@@ -4,9 +4,9 @@
  * 基础类型引用自 ../props/（全局共享）
  * FeatureSectionStyles 为 feature 特有的样式字段
  */
-import type { BaseImage } from "@/components/puck-core/core/props/media";
+import type { BaseMedia } from "@/components/puck-core/core/props/media";
 import type { BaseButton } from "@/components/puck-core/core/props/interactive";
-export type { BaseImage, BaseButton };
+export type { BaseMedia, BaseButton };
 export interface FeatureSectionStyles {
     className?: string;
     style?: React.CSSProperties;
@@ -25,7 +25,7 @@ export interface FeatureSectionBaseProps {
     heading: string;
     description: string;
     buttons: BaseButton[];
-    image: BaseImage;
+    media: BaseMedia;
     video: string;
     styles: FeatureSectionStyles;
 }

package/dist/components/puck-block/feature-sections/tab-feature/component.d.ts

@@ -1,9 +1,9 @@
-import type { FeatureComponentProps, BaseImage } from "../props";
+import type { FeatureComponentProps, BaseMedia } from "../props";
 type TabItem = {
     value: string;
     heading: string;
     description: string;
-    image?: BaseImage;
+    media?: BaseMedia;
     videoUrl?: string;
 };
 type TabFeatureExtra = {

package/dist/components/puck-block/feature-sections/tab-feature/component.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Dialog, DialogTrigger, DialogContent } from "../../../shadcn/dialog.js";
 import { Tabs, TabsList, TabsTrigger, TabsContent } from "../../../shadcn/tabs.js";
-import { CompoundImage } from "../../../puck-base/image.js";
+import { CompoundMedia } from "../../../puck-base/media.js";
 import { FaCirclePlay } from "../../../../node_modules/.pnpm/react-icons@5.6.0_react@19.2.4/node_modules/react-icons/fa6/index.js";
 import { CgSpinner } from "../../../../node_modules/.pnpm/react-icons@5.6.0_react@19.2.4/node_modules/react-icons/cg/index.js";
 import { cn } from "../../../../utils/css-utils.js";
@@ -53,21 +53,21 @@ const TabFeature = (props) => {
                 value: tab.value,
                 className: "animate-tabs",
                 children: [
-                  tab.image && !tab.videoUrl && /* @__PURE__ */ jsx(
-                    CompoundImage,
+                  tab.media && !tab.videoUrl && /* @__PURE__ */ jsx(
+                    CompoundMedia,
                     {
-                      src: tab.image.src,
-                      alt: tab.image.alt,
+                      src: tab.media.src,
+                      alt: tab.media.alt,
                       className: "size-full object-cover"
                     }
                   ),
-                  tab.videoUrl && tab.image && /* @__PURE__ */ jsxs(Dialog, { children: [
+                  tab.videoUrl && tab.media && /* @__PURE__ */ jsxs(Dialog, { children: [
                     /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: "relative flex w-full items-center justify-center", children: [
                       /* @__PURE__ */ jsx(
-                        CompoundImage,
+                        CompoundMedia,
                         {
-                          src: tab.image.src,
-                          alt: tab.image.alt,
+                          src: tab.media.src,
+                          alt: tab.media.alt,
                           className: "size-full object-cover"
                         }
                       ),
@@ -108,7 +108,7 @@ const TabFeatureDefaults = {
       value: "tab-1",
       heading: "Short heading goes here",
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.",
-      image: {
+      media: {
         src: "https://picsum.photos/seed/tab-feature1/800/600",
         alt: "Placeholder image 1"
       }
@@ -117,7 +117,7 @@ const TabFeatureDefaults = {
       value: "tab-2",
       heading: "Short heading goes here",
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.",
-      image: {
+      media: {
         src: "https://picsum.photos/seed/tab-feature2/800/600",
         alt: "Placeholder image 2"
       }
@@ -126,7 +126,7 @@ const TabFeatureDefaults = {
       value: "tab-3",
       heading: "Short heading goes here",
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.",
-      image: {
+      media: {
         src: "https://picsum.photos/seed/tab-feature3/800/600",
         alt: "Placeholder image 3"
       }

package/dist/components/puck-block/feature-sections/tab-feature/index.d.ts

@@ -22,7 +22,7 @@ declare const conf: {
                 description: {
                     type: string;
                 };
-                image: {
+                media: {
                     type: "object";
                     objectFields: {
                         src: import("@puckeditor/core").Field<string>;

package/dist/components/puck-block/feature-sections/tab-feature/index.js

@@ -1,5 +1,5 @@
 import { TabFeature, TabFeatureDefaults } from "./component.js";
-import { imageField } from "../../../puck-core/core/props/media.js";
+import { mediaField } from "../../../puck-core/core/props/media.js";
 const conf = {
   fields: {
     defaultTabValue: { type: "text" },
@@ -10,7 +10,7 @@ const conf = {
         value: { type: "text" },
         heading: { type: "text" },
         description: { type: "textarea" },
-        image: imageField,
+        media: mediaField,
         videoUrl: { type: "text" }
       }
     }

package/dist/components/puck-block/feature-sections/text-media-split/component.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Dialog, DialogTrigger, DialogContent } from "../../../shadcn/dialog.js";
 import { CompoundButton } from "../../../puck-base/button.js";
-import { CompoundImage } from "../../../puck-base/image.js";
+import { CompoundMedia } from "../../../puck-base/media.js";
 import { FaCirclePlay } from "../../../../node_modules/.pnpm/react-icons@5.6.0_react@19.2.4/node_modules/react-icons/fa6/index.js";
 import { CgSpinner } from "../../../../node_modules/.pnpm/react-icons@5.6.0_react@19.2.4/node_modules/react-icons/cg/index.js";
 import { cn } from "../../../../utils/css-utils.js";
@@ -14,7 +14,7 @@ const TextMediaSplit = (props) => {
     heading,
     description,
     buttons = [],
-    image = { src: "", alt: "" },
+    media = { src: "", alt: "" },
     video,
     styles
   } = {
@@ -34,7 +34,7 @@ const TextMediaSplit = (props) => {
     if (mediaType === "play") {
       return /* @__PURE__ */ jsxs(Dialog, { children: [
         /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: "relative flex w-full items-center justify-center", children: [
-          /* @__PURE__ */ jsx(CompoundImage, { src: image.src, alt: image.alt, className: "size-full object-cover" }),
+          /* @__PURE__ */ jsx(CompoundMedia, { src: media.src, alt: media.alt, className: "size-full object-cover" }),
           /* @__PURE__ */ jsx("span", { className: "absolute inset-0 z-10 bg-black/50" }),
           /* @__PURE__ */ jsx(FaCirclePlay, { className: "absolute z-20 size-16 text-white" })
         ] }) }),
@@ -59,7 +59,7 @@ const TextMediaSplit = (props) => {
     if (mediaType === "video") {
       return /* @__PURE__ */ jsx("video", { className: "w-full object-cover", autoPlay: true, loop: true, muted: true, children: /* @__PURE__ */ jsx("source", { src: video, type: "video/mp4" }) });
     }
-    return /* @__PURE__ */ jsx(CompoundImage, { src: image.src, className: "w-full object-cover", alt: image.alt });
+    return /* @__PURE__ */ jsx(CompoundMedia, { src: media.src, className: "w-full object-cover", alt: media.alt });
   };
   return /* @__PURE__ */ jsx(SectionWrapper, { className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName), style: sectionStyle, css, children: /* @__PURE__ */ jsx("div", { className: "container", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-y-12 md:grid-cols-2 md:items-center md:gap-x-12 lg:gap-x-20", children: [
     /* @__PURE__ */ jsxs("div", { children: [
@@ -76,7 +76,7 @@ const TextMediaSplitDefaults = {
   heading: "Medium length section heading goes here",
   description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.",
   buttons: [{ label: "Button" }, { label: "Button", variant: "secondary" }],
-  image: {
+  media: {
     src: "https://picsum.photos/seed/feature-split/800/600",
     alt: "Placeholder image"
   },

package/dist/components/puck-block/feature-sections/text-media-split/index.d.ts

@@ -94,7 +94,7 @@ declare const conf: {
                 readonly instructions: "Buttons must use the same size";
             };
         };
-        image: {
+        media: {
             type: "object";
             objectFields: {
                 src: import("@puckeditor/core").Field<string>;