Interfaces

FetchPagesType

interface FetchPagesType {
  <T extends boolean>(
    apiKey: string,
    {
      type,
      types,
      tag,
      language,
      page,
      pageSize,
      sort,
      filterBy,
      usePagination,
    }: {
      type?: string
      types?: string[]
      tag?: string
      language?: string
      page?: number
      pageSize?: number
      sort?: string
      filterBy?: { [key: string]: any }
      usePagination: T
    }
  ): Promise<T extends true ? PagesFromListWithPagination : PageFromList[]>
  (
    apiKey: string,
    {
      type,
      types,
      tag,
      language,
      page,
      pageSize,
      sort,
      filterBy,
    }: {
      type?: string
      types?: string[]
      tag?: string
      language?: string
      page?: number
      pageSize?: number
      sort?: string
      filterBy?: { [key: string]: any }
    }
  ): Promise<PageFromList[]>
  (apiKey: string): Promise<PageFromList[]>
}

IBlockType

interface IBlockType<T = Props> {
  name: string
  label: string
  getDefaultProps?: () => Partial<T>
  hideFromAddMenu?: boolean
  sideEditProps?: Array<ISideEditProp<T> | ISideGroup<T>>
  repeaterItems?: IRepeaterItem[]
  newItemMenuOpen?: boolean
  groupByRepeater?: boolean
  mapExternalDataToProps?: (externalData: Props, brickProps?: T) => Partial<T>
  getData?: (page: Page, brickProps?: T, args?: any) => Promise<Partial<T>>
  getExternalData?: (
    page: Page,
    brickProps?: T,
    args?: any
  ) => Promise<Partial<T>>
  playgroundLinkUrl?: string
  playgroundLinkLabel?: string
  theme?: string
  category?: string
  tags?: string[]
  previewImageUrl?: string
  previewIcon?: React.ReactElement
  stories?: BrickStory<Partial<T>>[]
}

IBrickStory

interface IBrickStory {
  brickName: string
  storyName: string
  locked?: boolean
  canAddAfter?: boolean
  canAddBefore?: boolean
}

ICategory

interface ICategory {
  category?: string
}

ICleanBlocks

interface ICleanBlocks {
  blocks: IContentBlock[]
  invalidBlocksTypes: string[]
}

IColor

interface IColor {
  color: string
  [propName: string]: any
}

IContentBlock

interface IContentBlock {
  id: string
  type: string
  props: Props
  locked?: boolean
  canAddAfter?: boolean
  canAddBefore?: boolean
  canEditContent?: boolean
}

ICustomKnobProps

interface ICustomKnobProps {
  id: string
  value: any
  onChange: any
  isValid: boolean
  errorMessage?: string
}

IFileSource

interface IFileSource {
  name: string
  url: string
  size: number
  extension: string
  pagesNum: number
  title?: string | undefined
  alt?: string | undefined
  copyright?: string | undefined
  source?: string | undefined
}

IImageSource

interface IImageSource {
  src: string
  srcSet?: string
  type?: string
  fallbackSrc?: string
  fallbackSrcSet?: string
  fallbackType?: string
  placeholderSrc?: string
  alt?: string
  seoName?: string
  width?: number
  height?: number
  highPriority?: boolean
  hashId?: string
  crop?: ICrop
  transform?: ITransform
}

ITransform

interface ITransform {
  rotate?: number
  flip?: {
    horizontal: boolean
    vertical: boolean
  }
}

ICrop

interface ITransform {
  rotate?: number
  flip?: {
    horizontal: boolean
    vertical: boolean
  }
}

IMenuItem

interface IMenuItem {
  label: string
  path?: string
}

IMeta

interface IMeta extends MetaData {
  language?: string
  openGraph?: OpenGraphData
  twitterCard?: TwitterCardData
  schemaOrg?: SchemaOrgData
}

IOption

interface IOption {
  value: any
  label: string
}

IPageType

interface IPageType {
  name: string
  pluralName: string
  isEntity?: boolean
  headlessView?: boolean
  allowedBlockTypes?: string[]
  excludedBlockTypes?: string[]
  defaultLocked?: boolean
  defaultStatus?: PageStatus
  defaultFeaturedImage?: string
  getDefaultContent?: () => (string | IBrickStory | IContentBlock)[]
  customFields?: Array<ISideEditPropPage | ISideGroup>
  getExternalData?: (page: Page, args?: any) => Promise<Props>
  getDefaultMeta?: (page: PageFromList, externalData: Props) => Partial<IMeta>
  metaImageAspectRatio?: number
  categories?: ICategory[]
  slugPrefix?: ISlugPrefix
  template?: Array<TemplateSlot>
}

IReactBricksContext

interface IReactBricksContext {
  version: string
  appId: string
  apiKey: string
  environment?: string
  bricks: Bricks
  themes: types.Theme[]
  pageTypes: IPageType[]
  logo: string
  loginUI: LoginUI
  contentClassName: string
  defaultTheme: string
  renderLocalLink: RenderLocalLink
  navigate: (path: string) => void
  loginPath: string
  editorPath: string
  mediaLibraryPath: string
  playgroundPath: string
  appSettingsPath: string
  previewPath: string
  getAdminMenu?: (args: { isAdmin: boolean }) => IMenuItem[]
  isDarkColorMode?: boolean
  toggleColorMode?: () => void
  useCssInJs?: boolean
  appRootElement: string | HTMLElement
  clickToEditSide?: ClickToEditSide
  customFields?: Array<ISideEditPropPage | ISideGroup>
  responsiveBreakpoints: ResponsiveBreakpoint[]
  enableAutoSave: boolean
  disableSaveIfInvalidProps: boolean
  enablePreview: boolean
  browserSupport: { webP: boolean; lazyLoading: boolean }
  blockIconsPosition: BlockIconsPosition
  enablePreviewImage: boolean
  enablePreviewIcon: boolean
  enableUnsplash: boolean
  unsplashApiKey?: string
  enableDefaultEmbedBrick: boolean
  permissions?: Permissions
  allowAccentsInSlugs: boolean
}

IReadAdminContext

interface IReadAdminContext {
  isAdmin: boolean
  previewMode: boolean
  currentPage: ICurrentPage
  showRichTextModal: ShowRichTextModal
}

IRepeaterItem

interface IRepeaterItem {
  name: string
  label?: string
  itemType?: string
  itemLabel?: string
  defaultOpen?: boolean
  min?: number
  max?: number
  positionLabel?: string // DEPRECATED => Now use "label"
  getDefaultProps?: () => Props
  items?: {
    type: string
    label?: string
    min?: number
    max?: number
    getDefaultProps?: () => Props
  }[]
}

ISideEditProp

interface ISideEditPropPage<T = Props> {
  name: string
  label: string
  type: SideEditPropType
  component?: React.FC<ICustomKnobProps>
  validate?: (value: any, props?: T) => boolean | string
  show?: (props: T, page?: Page, user?: User) => boolean
  helperText?: string

  textareaOptions?: {
    height?: number
  }
  imageOptions?: {
    maxWidth?: number
    quality?: number
    aspectRatio?: number
  }
  rangeOptions?: {
    min?: number
    max?: number
    step?: number
  }
  selectOptions?: {
    options?: IOption[]
    getOptions?: (props: Props) => IOption[] | Promise<IOption[]>
    display: OptionsDisplay
  }
  autocompleteOptions?: {
    placeholder?: string
    getOptions: (input: string, props: Props) => any[] | Promise<any[]>
    getKey: (option: any) => string | number
    getLabel: (option: any) => string
    renderOption?: ({
      option,
      selected,
      focus,
    }: {
      option: any
      selected: boolean
      focus: boolean
    }) => React.ReactElement
    debounceTime?: number
    getNoOptionsMessage?: (input?: string) => string
  }
  iconSelectorOptions?: {
    iconSets?: IconSets[]
  }
  relationshipOptions?: {
    label?: string
    references: string
    multiple: boolean
    embedValues?: boolean
  }
}

ISideGroup

interface ISideGroup {
  groupName: string
  defaultOpen?: boolean
  show?: (props: Props) => boolean
  props: ISideEditProp[]
}

LoginUI

interface LoginUI {
  sideImage?: string
  logo?: string
  logoWidth?: number
  logoHeight?: number
  welcomeText?: string
  welcomeTextStyle?: React.CSSProperties
}

ReactBricksConfig

interface ReactBricksConfig {
  appId: string
  apiKey: string
  environment?: string
  bricks?: types.Brick<any>[] | types.Theme[]
  pageTypes?: types.IPageType[]
  logo?: string
  loginUI?: LoginUI
  contentClassName?: string
  defaultTheme?: string
  renderLocalLink: types.RenderLocalLink
  navigate: (path: string) => void
  loginPath?: string
  editorPath?: string
  mediaLibraryPath?: string
  playgroundPath?: string
  appSettingsPath?: string
  previewPath?: string
  getAdminMenu?: (args: { isAdmin: boolean }) => IMenuItem[]
  isDarkColorMode?: boolean
  toggleColorMode?: () => void
  useCssInJs?: boolean
  appRootElement: string | HTMLElement
  clickToEditSide?: ClickToEditSide
  customFields?: Array<ISideEditPropPage | ISideGroup>
  responsiveBreakpoints?: ResponsiveBreakpoint[]
  enableAutoSave?: boolean
  disableSaveIfInvalidProps?: boolean
  enablePreview?: boolean
  blockIconsPosition?: BlockIconsPosition
  enablePreviewImage?: boolean
  enablePreviewIcon?: boolean
  enableUnsplash?: boolean
  unsplashApiKey?: string
  enableDefaultEmbedBrick?: boolean
  permissions?: Permissions
  allowAccentsInSlugs?: boolean
}

ResponsiveBreakpoint

interface ResponsiveBreakpoint {
  type: DeviceType
  width: number | string
  label: string
}

UsePagesType

interface UsePagesType {
  <T extends boolean>({
    type,
    types,
    tag,
    language,
    page,
    pageSize,
    sort,
    filterBy,
    usePagination,
  }: {
    type?: string
    types?: string[]
    tag?: string
    language: string
    page?: number
    pageSize?: number
    sort?: string
    filterBy?: { [key: string]: any }
    usePagination: T
  }): UseQueryResult<
    T extends true ? types.PagesFromListWithPagination : types.PageFromList[],
    unknown
  >
  ({
    type,
    types,
    tag,
    language,
    page,
    pageSize,
    sort,
    filterBy,
  }: {
    type?: string
    types?: string[]
    language: string
    tag?: string
    page?: number
    pageSize?: number
    sort?: string
    filterBy?: { [key: string]: any }
  }): UseQueryResult<types.PageFromList[], unknown>
  (): UseQueryResult<types.PageFromList[], unknown>
}

UsePagesPublicType

interface UsePagesPublicType {
  <T extends boolean>({
    type,
    types,
    tag,
    language,
    page,
    pageSize,
    sort,
    filterBy,
    usePagination,
  }: {
    type?: string
    types?: string[]
    tag?: string
    language?: string
    page?: number
    pageSize?: number
    sort?: string
    filterBy?: { [key: string]: any }
    usePagination: T
  }): UseQueryResult<
    T extends true ? types.PagesFromListWithPagination : types.PageFromList[],
    unknown
  >
  ({
    type,
    types,
    tag,
    language,
    page,
    pageSize,
    sort,
    filterBy,
  }: {
    type?: string
    types?: string[]
    tag?: string
    language?: string
    page?: number
    pageSize?: number
    sort?: string
    filterBy?: { [key: string]: any }
  }): UseQueryResult<types.PageFromList[], unknown>
  (): UseQueryResult<types.PageFromList[], unknown>
}