export default {
  name: "Repeater",
  acceptsChildren: true,
  category: "Container",
  props: [
    {
      label: "Type",
      name: "type",
      required: true,
      type: { kind: "appType", isList: true },
      default: { kind: "null", isList: true },
      placeholder: "",
      help: "The type for the items in the repeater",
    },
    {
      label: "Data",
      name: "data",
      required: true,
      type: { kind: "dynamic", template: "type", isList: true },
      default: null,
      placeholder: "",
      help: "The data for the items in the repeater",
    },
    {
      label: "Preview items",
      name: "__length",
      type: { kind: "number", isDynamic: false },
      required: false,
      isDefault: true,
      default: 5,
      placeholder: "",
      help: "The number of items to show in preview",
    },
  ],
  defaultStyles: {
    "": {},
  },
  sources: [
    {
      id: "data",
      name: "{{= it.component.name }}'s current data",
      description: "The current data of the list",
      template: "${{= it.component.id }}_data",
      instanceTemplate: `{{= it.component.name }}'s current data`,
      outputType: { kind: "dynamic", template: "type", isList: false },
      source: "Parent",
    },
    {
      id: "index",
      name: "{{= it.component.name }}'s current index",
      description: "The current index of the list",
      template: "${{= it.component.id }}_index",
      instanceTemplate: `{{= it.component.name }}'s current index`,
      outputType: { kind: "number" },
      source: "Parent",
    },
  ],
} as const;