Skip to main content

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>
  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>>[]
}

ICategory​

interface ICategory {
  category?: string
}

IBrickStory​

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

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
}

ICustomKnobProps​

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

IImageSource​

interface IImageSource {
  src: string
  placeholderSrc?: string
  srcSet?: string
  alt?: string
  seoName?: string
}

IMenuItem​

interface IMenuItem {
  label: string
  path?: string
}

IMeta​

interface IMeta {
  title?: string
  description?: string
  language?: string
  featuredImage?: string
}

IOption​

interface IOption {
  value: any
  label: string
}

IPageType​

interface IPageType {
  name: string
  pluralName: string
  allowedBlockTypes?: string[]
  excludedBlockTypes?: string[]
  defaultLocked?: boolean
  defaultStatus?: PageStatus
  defaultLanguage?: string
  defaultFeaturedImage?: string
  getDefaultContent?: () => string[]
  customFields?: Array<ISideEditPropPage | ISideGroup>
  getExternalData?: (page: Page) => Promise<Props>
  metaImageAspectRatio?: number
  categories?: ICategory[] // from 3.3.0
}

IReactBricksContext​

interface IReactBricksContext {
  version: string // The running React Bricks version
  appId: string
  apiKey: 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
  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
}

IReadAdminContext​

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

IRepeaterItem​

interface IRepeaterItem {
  name: string
  itemType?: string
  itemLabel?: string
  min?: number
  max?: number
  positionLabel?: string
  getDefaultProps?: () => Props
  items?: {
    type: string
    label?: string
    min?: number
    max?: number
    getDefaultProps?: () => Props
  }[]
}

ISideEditProp​

interface ISideEditProp {
  name: string
  label: string
  type: SideEditPropType
  component?: React.FC<ICustomKnobProps>
  validate?: (value: any, props?: Props) => boolean | string
  show?: (props: Props) => boolean
  helperText?: string
  shouldRefreshStyles?: boolean
  textareaOptions?: {
    height?: number
  }
  imageOptions?: {
    maxWidth?: number
    quality?: number // default 80
    aspectRatio?: number
  }
  rangeOptions?: {
    min?: number
    max?: number
    step?: number
  }
  selectOptions?: {
    options?: IOption[]
    getOptions?: (props: Props) => IOption[] | Promise<IOption[]>
    display: OptionsDisplay
  }
}

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
    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
    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

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>
}