Components:Types - bettyblocks/cli GitHub Wiki

// Prefab

type Prefab = () => PrefabStructure;

interface PrefabStructure {
  category: string;
  icon: string;
  name: string;
  structure: ComponentConfiguration[];
}

// Prefab: Component Configuration

interface ComponentConfiguration {
  descendants: ComponentConfiguration[];
  name: string;
  options: Option[];
}

// Prefab: Component Configuration: Component Option

type Option = CustomOption | GenericOption | TextOption;

// Prefab: Component Configuration: Component Option: Custom Option

interface CustomOption {
  configuration?: CustomOptionConfiguration;
  key: string;
  label: string;
  type: "CUSTOM";
  value: any;
}

interface CustomOptionConfiguration {
  as: CustomOptionAs;
  dataType: DataType;
  allowedInput: AllowedInput;
}

interface AllowedInput {
  name: string;
  value: any;
}

type DataType =
  | "boolean"
  | "number"
  | "string"
  | "uuid"
  | "boolean_list"
  | "number_list"
  | "string_list"
  | "uuid_list";

type CustomOptionAs = "BUTTONGROUP" | "DROPDOWN";

// Prefab: Component Configuration: Component Option: Text Option

interface TextOption {
  configuration?: TextOptionConfiguration;
  key: string;
  label: string;
  type: "TEXT";
  value: any;
}

interface TextOptionConfiguration {
  as: "MULTILINE";
  dataType: "string";
}

// Prefab: Component Configuration: Component Option: Generic Option

interface GenericOption {
  key: string;
  label: string;
  type: GenericOptionType;
  value: any;
}

type GenericOptionType =
  | "COLOR"
  | "ENDPOINT"
  | "FILTER"
  | "FONT"
  | "MODEL"
  | "NUMBER"
  | "SIZE"
  | "SIZES"
  | "TOGGLE";

// Component

type Component = () => ComponentStructure;

interface ComponentStructure {
  allowedTypes: string[];
  jsx: JSX.Element;
  name: string;
  orientation: Orientation;
  styles: (B: object) => (Theme: object) => object;
  type: string;
}

type Category = CustomCategory | DefaultCategory;

type CustomCategory = string;

type DefaultCategory =
  | "LAYOUT"
  | "CONTENT"
  | "DATA"
  | "TABLE"
  | "NAVIGATION"
  | "FORM";

type Orientation = "HORIZONTAL" | "VERTICAL";

type Icon =
  | "AccordionIcon"
  | "AccordionItemIcon"
  | "AlertIcon"
  | "AutoCompleteIcon"
  | "BreadcrumbIcon"
  | "BreadcrumbItemIcon"
  | "ButtonGroupIcon"
  | "ButtonIcon"
  | "CheckboxIcon"
  | "Column2Icon"
  | "Column3Icon"
  | "ColumnIcon"
  | "ContainerIcon"
  | "DataContainer"
  | "DataTable"
  | "DataTableBody"
  | "DataTableColumn"
  | "DataTableHead"
  | "DataTableRow"
  | "DatePickerIcon"
  | "DateTimePickerIcon"
  | "DefinitionListIcon"
  | "DynamicFormIcon"
  | "DynamicTableIcon"
  | "DynamicTilesIcon"
  | "EmailInputIcon"
  | "FileInputIcon"
  | "FormIcon"
  | "GridIcon"
  | "HiddenInputIcon"
  | "HorizontalRuleIcon"
  | "HtmlIcon"
  | "IbanInputIcon"
  | "IconIcon"
  | "ImageIcon"
  | "ImageInputIcon"
  | "IncludeIcon"
  | "LabelIcon"
  | "Layout1Icon"
  | "Layout2Icon"
  | "Layout3333Icon"
  | "Layout363Icon"
  | "Layout444Icon"
  | "Layout48Icon"
  | "Layout66Icon"
  | "Layout84Icon"
  | "ListItemIcon"
  | "MultiLineIcon"
  | "MultiSelectIcon"
  | "NavItemIcon"
  | "NavSidebarIcon"
  | "NavbarIcon"
  | "NumberInputIcon"
  | "OrderedListIcon"
  | "PanelIcon"
  | "ParagraphIcon"
  | "PasswordInputIcon"
  | "PhoneInputIcon"
  | "PriceInputIcon"
  | "ProgressBarIcon"
  | "RadioButtonIcon"
  | "RowColumnIcon"
  | "RowIcon"
  | "SelectIcon"
  | "SubmitButtonIcon"
  | "TabGroupIcon"
  | "Table"
  | "TextInputIcon"
  | "TextareaIcon"
  | "TimePickerIcon"
  | "TitleIcon"
  | "UnorderedListIcon"
  | "UrlInputIcon";