import figma from '@figma/code-connect';

figma.connect(
  'https://www.figma.com/design/Zyh9RyabNaqkjbuFWP9Aqj/%E2%9C%A8-Components--ADS2---Stable-version-?node-id=5-6454',
  {
    imports: ["import { Carousel, Tile } from '@mozaic-ds/web-components/svelte';"],
    props: {
      breakpoint: figma.enum('Breakpoint', {
        'L to XXL (1024 and up)': 'desktop',
        'S to M (320 to 1023px)': 'mobile',
      }),
    },
    example: () => (
      <Carousel>
        <div slot="header">Title</div>
        <Tile>Slide 1</Tile>
        <Tile>Slide 2</Tile>
        <Tile>Slide 3</Tile>
      </Carousel>
    ),
  },
);
