Template
24 lines
1.3 KiB
TypeScript
24 lines
1.3 KiB
TypeScript
import type { ComponentConfig } from '@reacteditor/core';
|
|
import { ChartNoAxesColumnIncreasing } from 'lucide-react';
|
|
import Stats, { type StatsProps } from './stats';
|
|
|
|
const statsConfig: ComponentConfig<StatsProps> = {
|
|
label: 'Stats', icon: <ChartNoAxesColumnIncreasing size={16} />, category: 'social-proof',
|
|
defaultProps: {
|
|
heading: 'Use a few clear numbers to build confidence.',
|
|
stats: [
|
|
{ value: '10k+', label: 'Customers', description: 'A short note about this result.' },
|
|
{ value: '42%', label: 'Growth', description: 'A short note about this result.' },
|
|
{ value: '24/7', label: 'Availability', description: 'A short note about this result.' },
|
|
{ value: '98%', label: 'Satisfaction', description: 'A short note about this result.' },
|
|
],
|
|
},
|
|
fields: {
|
|
heading: { label: 'Heading', type: 'textarea', contentEditable: true },
|
|
stats: { label: 'Stats', type: 'array', defaultItemProps: { value: '100+', label: 'Stat label', description: '' }, getItemSummary: (item) => item?.label || 'Stat', arrayFields: { value: { label: 'Value', type: 'text', contentEditable: true }, label: { label: 'Label', type: 'text', contentEditable: true }, description: { label: 'Description', type: 'textarea', contentEditable: true } } },
|
|
},
|
|
render: (props) => <Stats {...props} />,
|
|
};
|
|
|
|
export default statsConfig;
|