import { listCollapseIcon } from '@keystar/ui/icon/icons/listCollapseIcon';
import { repeating, wrapper } from '@keystatic/core/content-components';
import { fields } from '@keystatic/core';

const accordionComponents = {
  Accordion: repeating({
    label: 'Accordion',
    icon: listCollapseIcon,
    children: ['AccordionItem'],
    schema: {},
  }),
  AccordionItem: wrapper({
    label: 'Accordion Item',
    forSpecificLocations: true,
    schema: {
      title: fields.text({
        label: 'Title',
        validation: {
          length: {
            min: 1,
          },
        },
      }),
      defaultOpen: fields.checkbox({
        label: 'Open by default',
        defaultValue: false,
      }),
    },
  }),
};

export default accordionComponents;