export default `
### START: INTERFACES ###
import { GridBlockDto } from "../../shared/grid/GridBlockUtils";
export type FeaturesBlockDto = {
style: FeaturesBlockStyle;
headline: string;
subheadline: string;
topText?: string;
items: FeatureDto[];
grid?: GridBlockDto;
};
export interface FeatureDto {
name: string;
description: string;
img?: string; // SVG or image URL
link?: {
text: string;
href: string;
target?: string;
};
}
export const FeaturesBlockStyles = [
{ value: "list", name: "List" },
{ value: "cards", name: "Cards" },
] as const;
export type FeaturesBlockStyle = (typeof FeaturesBlockStyles)[number]["value"];
export const gridCols = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"] as const;
export const gaps = ["none", "xs", "sm", "md", "lg"] as const;
export interface GridBlockDto {
columns?: (typeof gridCols)[number];
gap?: (typeof gaps)[number];
}
### END: INTERFACES ###
### START: SAMPLE OUTPUT FORMAT ###
${"```json"}
{
"features": {
"style": "list",
"headline": "Features Headline",
"subheadline": "Features Subheadline",
"topText": "Top text",
"grid": {
"columns": "3",
"gap": "sm",
},
"items": [
{
"name": "Feature 1",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit sed do eiusmod tempor.",
"img": '',
"link": { text: "shared.learnMore", href: "#" },
},
{
"name": "Feature 2",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit sed do eiusmod tempor.",
"img": '',
"link": { text: "shared.learnMore", href: "#" },
},
{
"name": "Feature 3",
"description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit sed do eiusmod tempor.",
"img": '',
"link": { text: "shared.learnMore", href: "#" },
},
],
}
}
${"```"}
### END: SAMPLE OUTPUT FORMAT ###
`;