Template
Initial react editor website template
This commit is contained in:
@@ -0,0 +1,24 @@
|
||||
import type { ComponentConfig } from '@reacteditor/core';
|
||||
import { LayoutGrid } from 'lucide-react';
|
||||
import Features, { type FeaturesProps } from './features';
|
||||
|
||||
const featuresConfig: ComponentConfig<FeaturesProps> = {
|
||||
label: 'Features', icon: <LayoutGrid size={16} />, category: 'marketing',
|
||||
defaultProps: {
|
||||
heading: 'Explain the most important benefits of your business.', description: '',
|
||||
imageUrl: 'https://api.dicebear.com/10.x/glass/svg', imageAlt: 'Abstract glass avatar illustration', imagePosition: 'left',
|
||||
items: [
|
||||
{ title: 'First key benefit', description: 'Add a concise explanation of the value this benefit creates for your customers.', ctaLabel: '', ctaUrl: '#' },
|
||||
{ title: 'Second key benefit', description: 'Use a clear, outcome-focused description that is easy to scan.', ctaLabel: '', ctaUrl: '#' },
|
||||
{ title: 'Third key benefit', description: 'Give visitors one more reason to understand and trust your offer.', ctaLabel: '', ctaUrl: '#' },
|
||||
],
|
||||
},
|
||||
fields: {
|
||||
heading: { label: 'Heading', type: 'textarea', contentEditable: true }, description: { label: 'Description', type: 'textarea', contentEditable: true },
|
||||
imageUrl: { label: 'Image', type: 'image' }, imageAlt: { label: 'Image alt text', type: 'text' }, imagePosition: { label: 'Image position', type: 'radio', options: [{ label: 'Left', value: 'left' }, { label: 'Right', value: 'right' }] },
|
||||
items: { label: 'Features', type: 'array', defaultItemProps: { title: 'Feature', description: 'Describe the benefit.', ctaLabel: '', ctaUrl: '#' }, getItemSummary: (item) => item?.title || 'Feature', arrayFields: { title: { label: 'Title', type: 'text', contentEditable: true }, description: { label: 'Description', type: 'textarea', contentEditable: true }, ctaLabel: { label: 'Link label', type: 'text', contentEditable: true }, ctaUrl: { label: 'Link URL', type: 'text' } } },
|
||||
},
|
||||
render: (props) => <Features {...props} />,
|
||||
};
|
||||
|
||||
export default featuresConfig;
|
||||
Reference in New Issue
Block a user