dune-react 0.0.19 → 0.0.20

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

@@ -0,0 +1,108 @@
+import { IconCardFaq, IconCardFaqDefaults } from "./icon-card-faq";
+import type { IconCardFaqProps } from "./icon-card-faq";
+export { IconCardFaq, IconCardFaqDefaults };
+export type { IconCardFaqProps };
+declare const conf: {
+    fields: {
+        heading: {
+            readonly type: "text";
+            readonly contentEditable: true;
+        };
+        description: {
+            readonly type: "textarea";
+            readonly contentEditable: true;
+        };
+        iconQuestions: {
+            type: string;
+            max: number;
+            getItemSummary: (item: {
+                question?: string;
+            }, index?: number) => string;
+            arrayFields: {
+                icon: {
+                    type: "object";
+                    objectFields: {
+                        src: import("@puckeditor/core").Field<string>;
+                        alt: {
+                            type: "text";
+                        };
+                    };
+                };
+                question: {
+                    type: string;
+                    contentEditable: boolean;
+                };
+                answer: {
+                    type: string;
+                    contentEditable: boolean;
+                };
+            };
+        };
+        footerHeading: {
+            readonly type: "text";
+            readonly contentEditable: true;
+        };
+        footerDescription: {
+            readonly type: "textarea";
+            readonly contentEditable: true;
+        };
+        button: {
+            readonly type: "object";
+            readonly objectFields: {
+                readonly label: {
+                    readonly type: "text";
+                };
+                readonly action: {
+                    type: "custom";
+                    label: string;
+                    render: typeof import("../../../puck-core").ActionField;
+                };
+                readonly variant: {
+                    readonly type: "select";
+                    readonly options: readonly [{
+                        readonly label: "primary";
+                        readonly value: "default";
+                    }, {
+                        readonly label: "secondary";
+                        readonly value: "secondary";
+                    }, {
+                        readonly label: "outline";
+                        readonly value: "outline";
+                    }, {
+                        readonly label: "ghost";
+                        readonly value: "ghost";
+                    }, {
+                        readonly label: "link";
+                        readonly value: "link";
+                    }, {
+                        readonly label: "destructive";
+                        readonly value: "destructive";
+                    }];
+                };
+                readonly size: {
+                    readonly type: "select";
+                    readonly options: readonly [{
+                        readonly label: "default";
+                        readonly value: "default";
+                    }, {
+                        readonly label: "sm";
+                        readonly value: "sm";
+                    }, {
+                        readonly label: "lg";
+                        readonly value: "lg";
+                    }, {
+                        readonly label: "icon";
+                        readonly value: "icon";
+                    }];
+                };
+                readonly icon: {
+                    type: "custom";
+                    render: typeof import("../../../puck-core/fields/icon-picker-field").IconPickerField;
+                };
+            };
+        };
+    };
+    defaultProps: IconCardFaqProps;
+    render: (props: IconCardFaqProps) => import("react/jsx-runtime").JSX.Element;
+};
+export default conf;

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

@@ -0,0 +1,30 @@
+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";
+const conf = {
+  fields: {
+    heading: headingField,
+    description: descriptionField,
+    iconQuestions: {
+      type: "array",
+      max: 12,
+      getItemSummary: (item, index = 0) => item.question || `Question ${index + 1}`,
+      arrayFields: {
+        icon: imageField,
+        question: { type: "text", contentEditable: true },
+        answer: { type: "textarea", contentEditable: true }
+      }
+    },
+    footerHeading: headingField,
+    footerDescription: descriptionField,
+    button: buttonField
+  },
+  defaultProps: IconCardFaqDefaults,
+  render: IconCardFaq
+};
+export {
+  IconCardFaq,
+  IconCardFaqDefaults,
+  conf as default
+};

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

@@ -0,0 +1,6 @@
+export { default as DualColumnAccordionFaqConf } from "./dual-column-accordion-faq";
+export { default as IconCardFaqConf } from "./icon-card-faq";
+export { default as StackedAccordionFaqConf } from "./stacked-accordion-faq";
+export { default as StackedStaticFaqConf } from "./stacked-static-faq";
+export { default as TwoColumnAccordionFaqConf } from "./two-column-accordion-faq";
+export { default as TwoColumnStaticFaqConf } from "./two-column-static-faq";

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

@@ -1,30 +1,84 @@
-type FaqVariant = "accordion-1" | "faq-1" | "faq-2";
-type FaqPadding = {
-    top?: "none" | "small" | "medium" | "large";
-    bottom?: "none" | "small" | "medium" | "large";
-};
-type FaqSectionStyle = "default" | "dark" | "muted" | "inverted" | "custom";
-type FaqImage = {
-    src: string;
-    alt?: string;
-};
-type FaqItem = {
+/**
+ * FAQ Section 共享 Props
+ *
+ * 基础类型引用自 ../props/（全局共享）
+ * FaqSectionStyles 为 FAQ 特有的样式字段
+ */
+import type { BaseImage } from "@/components/puck-core/core/props/media";
+import type { BaseButton } from "@/components/puck-core/core/props/interactive";
+export type { BaseImage, BaseButton };
+export interface FaqSectionStyles {
+    textAlign?: "left" | "center";
+    gridColumns?: 1 | 2 | 3;
+    bordered?: boolean;
+    hasFooter?: boolean;
+}
+export interface FaqQuestion {
+    title: string;
+    answer: string;
+}
+export interface FaqQuestionWithIcon {
+    icon: BaseImage;
     question: string;
     answer: string;
-};
-type FaqSectionProps = {
-    variant?: FaqVariant;
-    heading?: string;
-    description?: string;
-    items?: FaqItem[];
-    layout?: "single-col" | "two-col";
-    expandMode?: "single" | "multiple";
-    collapsible?: boolean;
-    image?: FaqImage;
-    styles?: {
-        padding?: FaqPadding;
-        sectionStyle?: FaqSectionStyle;
-        backgroundColor?: string;
-        imagePosition?: "left" | "right";
+}
+export interface FaqSectionBaseProps {
+    heading: string;
+    description: string;
+    button: BaseButton;
+    questions: FaqQuestion[];
+    footerHeading: string;
+    footerDescription: string;
+    styles: FaqSectionStyles;
+}
+export declare const faqStyleFields: {
+    readonly textAlign: {
+        readonly type: "radio";
+        readonly label: "Text Align";
+        readonly options: readonly [{
+            readonly label: "Left";
+            readonly value: "left";
+        }, {
+            readonly label: "Center";
+            readonly value: "center";
+        }];
+    };
+    readonly gridColumns: {
+        readonly type: "radio";
+        readonly label: "Grid Columns";
+        readonly options: readonly [{
+            readonly label: "1";
+            readonly value: "1";
+        }, {
+            readonly label: "2";
+            readonly value: "2";
+        }, {
+            readonly label: "3";
+            readonly value: "3";
+        }];
+    };
+    readonly bordered: {
+        readonly type: "radio";
+        readonly label: "Bordered";
+        readonly options: readonly [{
+            readonly label: "Yes";
+            readonly value: "true";
+        }, {
+            readonly label: "No";
+            readonly value: "false";
+        }];
+    };
+    readonly hasFooter: {
+        readonly type: "radio";
+        readonly label: "Show Footer";
+        readonly options: readonly [{
+            readonly label: "Yes";
+            readonly value: "true";
+        }, {
+            readonly label: "No";
+            readonly value: "false";
+        }];
     };
 };
+/** 将 FaqSectionBaseProps 与组件特有字段合并，生成最终 Props */
+export type FaqComponentProps<T extends object = object> = React.ComponentPropsWithoutRef<"section"> & Partial<FaqSectionBaseProps> & Partial<T>;

package/dist/components/puck-block/faq-sections/props.js

@@ -0,0 +1,38 @@
+const faqStyleFields = {
+  textAlign: {
+    type: "radio",
+    label: "Text Align",
+    options: [
+      { label: "Left", value: "left" },
+      { label: "Center", value: "center" }
+    ]
+  },
+  gridColumns: {
+    type: "radio",
+    label: "Grid Columns",
+    options: [
+      { label: "1", value: "1" },
+      { label: "2", value: "2" },
+      { label: "3", value: "3" }
+    ]
+  },
+  bordered: {
+    type: "radio",
+    label: "Bordered",
+    options: [
+      { label: "Yes", value: "true" },
+      { label: "No", value: "false" }
+    ]
+  },
+  hasFooter: {
+    type: "radio",
+    label: "Show Footer",
+    options: [
+      { label: "Yes", value: "true" },
+      { label: "No", value: "false" }
+    ]
+  }
+};
+export {
+  faqStyleFields
+};

package/dist/components/puck-block/faq-sections/stacked-accordion-faq/index.d.ts

@@ -0,0 +1,138 @@
+import { StackedAccordionFaq, StackedAccordionFaqDefaults } from "./stacked-accordion-faq";
+import type { StackedAccordionFaqProps } from "./stacked-accordion-faq";
+export { StackedAccordionFaq, StackedAccordionFaqDefaults };
+export type { StackedAccordionFaqProps };
+declare const conf: {
+    fields: {
+        heading: {
+            readonly type: "text";
+            readonly contentEditable: true;
+        };
+        description: {
+            readonly type: "textarea";
+            readonly contentEditable: true;
+        };
+        questions: {
+            type: string;
+            max: number;
+            getItemSummary: (item: {
+                title?: string;
+            }, index?: number) => string;
+            arrayFields: {
+                title: {
+                    type: string;
+                    contentEditable: boolean;
+                };
+                answer: {
+                    type: string;
+                    contentEditable: boolean;
+                };
+            };
+        };
+        footerHeading: {
+            readonly type: "text";
+            readonly contentEditable: true;
+        };
+        footerDescription: {
+            readonly type: "textarea";
+            readonly contentEditable: true;
+        };
+        button: {
+            readonly type: "object";
+            readonly objectFields: {
+                readonly label: {
+                    readonly type: "text";
+                };
+                readonly action: {
+                    type: "custom";
+                    label: string;
+                    render: typeof import("../../../puck-core").ActionField;
+                };
+                readonly variant: {
+                    readonly type: "select";
+                    readonly options: readonly [{
+                        readonly label: "primary";
+                        readonly value: "default";
+                    }, {
+                        readonly label: "secondary";
+                        readonly value: "secondary";
+                    }, {
+                        readonly label: "outline";
+                        readonly value: "outline";
+                    }, {
+                        readonly label: "ghost";
+                        readonly value: "ghost";
+                    }, {
+                        readonly label: "link";
+                        readonly value: "link";
+                    }, {
+                        readonly label: "destructive";
+                        readonly value: "destructive";
+                    }];
+                };
+                readonly size: {
+                    readonly type: "select";
+                    readonly options: readonly [{
+                        readonly label: "default";
+                        readonly value: "default";
+                    }, {
+                        readonly label: "sm";
+                        readonly value: "sm";
+                    }, {
+                        readonly label: "lg";
+                        readonly value: "lg";
+                    }, {
+                        readonly label: "icon";
+                        readonly value: "icon";
+                    }];
+                };
+                readonly icon: {
+                    type: "custom";
+                    render: typeof import("../../../puck-core/fields/icon-picker-field").IconPickerField;
+                };
+            };
+        };
+        styles: {
+            type: string;
+            label: string;
+            objectFields: {
+                textAlign: {
+                    readonly type: "radio";
+                    readonly label: "Text Align";
+                    readonly options: readonly [{
+                        readonly label: "Left";
+                        readonly value: "left";
+                    }, {
+                        readonly label: "Center";
+                        readonly value: "center";
+                    }];
+                };
+                hasFooter: {
+                    readonly type: "radio";
+                    readonly label: "Show Footer";
+                    readonly options: readonly [{
+                        readonly label: "Yes";
+                        readonly value: "true";
+                    }, {
+                        readonly label: "No";
+                        readonly value: "false";
+                    }];
+                };
+                bordered: {
+                    readonly type: "radio";
+                    readonly label: "Bordered";
+                    readonly options: readonly [{
+                        readonly label: "Yes";
+                        readonly value: "true";
+                    }, {
+                        readonly label: "No";
+                        readonly value: "false";
+                    }];
+                };
+            };
+        };
+    };
+    defaultProps: import("../props").FaqSectionBaseProps;
+    render: (props: StackedAccordionFaqProps) => import("react/jsx-runtime").JSX.Element;
+};
+export default conf;

package/dist/components/puck-block/faq-sections/stacked-accordion-faq/index.js

@@ -0,0 +1,38 @@
+import { StackedAccordionFaq, StackedAccordionFaqDefaults } from "./stacked-accordion-faq.js";
+import { descriptionField, headingField } from "../../../puck-core/core/props/content.js";
+import { buttonField } from "../../../puck-core/core/props/interactive.js";
+import { faqStyleFields } from "../props.js";
+const conf = {
+  fields: {
+    heading: headingField,
+    description: descriptionField,
+    questions: {
+      type: "array",
+      max: 20,
+      getItemSummary: (item, index = 0) => item.title || `Question ${index + 1}`,
+      arrayFields: {
+        title: { type: "text", contentEditable: true },
+        answer: { type: "textarea", contentEditable: true }
+      }
+    },
+    footerHeading: headingField,
+    footerDescription: descriptionField,
+    button: buttonField,
+    styles: {
+      type: "object",
+      label: "Styles",
+      objectFields: {
+        textAlign: faqStyleFields.textAlign,
+        hasFooter: faqStyleFields.hasFooter,
+        bordered: faqStyleFields.bordered
+      }
+    }
+  },
+  defaultProps: StackedAccordionFaqDefaults,
+  render: StackedAccordionFaq
+};
+export {
+  StackedAccordionFaq,
+  StackedAccordionFaqDefaults,
+  conf as default
+};

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

@@ -0,0 +1,4 @@
+import type { FaqComponentProps, FaqSectionBaseProps } from "../props";
+export type StackedAccordionFaqProps = FaqComponentProps;
+export declare const StackedAccordionFaq: (props: StackedAccordionFaqProps) => import("react/jsx-runtime").JSX.Element;
+export declare const StackedAccordionFaqDefaults: FaqSectionBaseProps;

package/dist/components/puck-block/faq-sections/stacked-accordion-faq/stacked-accordion-faq.js

@@ -0,0 +1,80 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../../../../utils/css-utils.js";
+import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from "../../../shadcn/accordion.js";
+import { CompoundButton } from "../../../puck-base/button.js";
+const StackedAccordionFaq = (props) => {
+  const {
+    heading,
+    description,
+    questions,
+    footerHeading,
+    footerDescription,
+    button,
+    styles
+  } = {
+    ...StackedAccordionFaqDefaults,
+    ...props
+  };
+  const {
+    textAlign = "center",
+    hasFooter = true,
+    bordered = false
+  } = styles ?? {};
+  const isCenter = textAlign === "center";
+  return /* @__PURE__ */ jsx("section", { id: "relume", className: "px-[5%] py-16 md:py-24 lg:py-28", children: /* @__PURE__ */ jsxs("div", { className: "container max-w-lg", children: [
+    /* @__PURE__ */ jsxs("div", { className: cn("rb-12 mb-12 md:mb-18 lg:mb-20", { "text-center": isCenter }), children: [
+      /* @__PURE__ */ jsx("h2", { className: "rb-5 mb-5 text-5xl font-bold md:mb-6 md:text-7xl lg:text-8xl", children: heading }),
+      /* @__PURE__ */ jsx("p", { className: "md:text-md", children: description })
+    ] }),
+    /* @__PURE__ */ jsx(Accordion, { type: "multiple", children: questions.map((question, index) => /* @__PURE__ */ jsxs(
+      AccordionItem,
+      {
+        value: `item-${index}`,
+        className: cn({
+          "border border-border-primary px-5 md:px-6 first:rounded-t last:rounded-b": bordered
+        }),
+        children: [
+          /* @__PURE__ */ jsx(
+            AccordionTrigger,
+            {
+              className: cn("md:py-5 md:text-md", {
+                "[&>svg]:hidden": bordered
+              }),
+              children: question.title
+            }
+          ),
+          /* @__PURE__ */ jsx(AccordionContent, { className: "md:pb-6", children: question.answer })
+        ]
+      },
+      index
+    )) }),
+    hasFooter && /* @__PURE__ */ jsxs("div", { className: cn("mx-auto mt-12 max-w-md md:mt-18 lg:mt-20", { "text-center": isCenter }), children: [
+      /* @__PURE__ */ jsx("h4", { className: "mb-3 text-2xl font-bold md:mb-4 md:text-3xl md:leading-[1.3] lg:text-4xl", children: footerHeading }),
+      /* @__PURE__ */ jsx("p", { className: "md:text-md", children: footerDescription }),
+      /* @__PURE__ */ jsx("div", { className: "mt-6 md:mt-8", children: /* @__PURE__ */ jsx(CompoundButton, { label: button.label, variant: button.variant, size: button.size, action: button.action, icon: button.icon }) })
+    ] })
+  ] }) });
+};
+const StackedAccordionFaqDefaults = {
+  heading: "FAQs",
+  description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.",
+  questions: [
+    { title: "Question text goes here", answer: "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." },
+    { title: "Question text goes here", answer: "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." },
+    { title: "Question text goes here", answer: "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." },
+    { title: "Question text goes here", answer: "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." },
+    { title: "Question text goes here", answer: "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." }
+  ],
+  footerHeading: "Still have questions?",
+  footerDescription: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
+  button: { label: "Contact", variant: "secondary" },
+  styles: {
+    textAlign: "center",
+    hasFooter: true,
+    bordered: false
+  }
+};
+export {
+  StackedAccordionFaq,
+  StackedAccordionFaqDefaults
+};