Options
All
  • Public
  • Public/Protected
  • All
Menu

react-schematic

Index

Type aliases

Variables

Functions

Type aliases

Breakpoints

Breakpoints: { lg: number; md: number; sm: number; xl: number; xs: number }

Type declaration

  • lg: number
  • md: number
  • sm: number
  • xl: number
  • xs: number

ContainerResponsiveType

ContainerResponsiveType: Responsive<ContainerType> & Responsive<Spacing>

ContainerType

ContainerType: { maxWidth?: keyof MaxWidths }

Type declaration

FlexItemResponsiveType

FlexItemResponsiveType: Responsive<FlexItemType> & Responsive<Spacing>

FlexItemType

FlexItemType: { alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "stretch" | "baseline"; flex?: string; flexBasis?: string; flexGrow?: number; flexShrink?: number; order?: number }

FLEX ITEM

Type declaration

  • Optional alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "stretch" | "baseline"
  • Optional flex?: string
  • Optional flexBasis?: string
  • Optional flexGrow?: number
  • Optional flexShrink?: number
  • Optional order?: number

FlexResponsiveType

FlexResponsiveType: Responsive<FlexType> & Responsive<Spacing>

FlexType

FlexType: { alignContent?: "normal" | "flex-start" | "flex-end" | "center" | "stretch" | "baseline" | "space-around" | "space-evenly" | "space-between"; alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline"; columnGap?: string; display?: "flex" | "inline-flex"; flexDirection?: "row" | "column" | "row-reverse" | "column-reverse"; flexFlow?: string; flexWrap?: "wrap" | "nowrap" | "wrap-reverse"; gap?: string; justifyContent?: "flex-start" | "flex-end" | "center" | "space-around" | "space-between" | "space-evenly"; rowGap?: string }

Type declaration

  • Optional alignContent?: "normal" | "flex-start" | "flex-end" | "center" | "stretch" | "baseline" | "space-around" | "space-evenly" | "space-between"
  • Optional alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline"
  • Optional columnGap?: string
  • Optional display?: "flex" | "inline-flex"
  • Optional flexDirection?: "row" | "column" | "row-reverse" | "column-reverse"
  • Optional flexFlow?: string
  • Optional flexWrap?: "wrap" | "nowrap" | "wrap-reverse"
  • Optional gap?: string
  • Optional justifyContent?: "flex-start" | "flex-end" | "center" | "space-around" | "space-between" | "space-evenly"
  • Optional rowGap?: string

GridItemResponsiveType

GridItemResponsiveType: Responsive<GridItemType> & Responsive<Spacing>

GridItemType

GridItemType: { alignSelf?: "start" | "end" | "center" | "stretch"; gridArea?: string; gridColumn?: string; gridColumnEnd?: string; gridColumnStart?: string; gridRow?: string; gridRowEnd?: string; gridRowStart?: string; justifySelf?: "start" | "end" | "center" | "stretch"; placeSelf?: string }

Type declaration

  • Optional alignSelf?: "start" | "end" | "center" | "stretch"
  • Optional gridArea?: string
  • Optional gridColumn?: string
  • Optional gridColumnEnd?: string
  • Optional gridColumnStart?: string
  • Optional gridRow?: string
  • Optional gridRowEnd?: string
  • Optional gridRowStart?: string
  • Optional justifySelf?: "start" | "end" | "center" | "stretch"
  • Optional placeSelf?: string

GridResponsiveType

GridResponsiveType: Responsive<GridType> & Responsive<Spacing>

GridType

GridType: { alignContent?: "start" | "end" | "center" | "stretch" | "space-around" | "space-between" | "space-evenly"; alignItems?: "start" | "end" | "center" | "stretch"; columnGap?: string; display?: "grid" | "inline-grid"; gap?: string; grid?: string; gridAutoColumns?: string; gridAutoFlow?: "row" | "column" | "row dense" | "column dense"; gridAutoRows?: string; gridTemplate?: string; gridTemplateAreas?: string; gridTemplateColumns?: string; gridTemplateRows?: string; justifyContent?: "start" | "end" | "center" | "stretch" | "space-around" | "space-between" | "space-evenly"; justifyItems?: "start" | "end" | "center" | "stretch"; placeContent?: string; placeItems?: string; rowGap?: string }

Type declaration

  • Optional alignContent?: "start" | "end" | "center" | "stretch" | "space-around" | "space-between" | "space-evenly"
  • Optional alignItems?: "start" | "end" | "center" | "stretch"
  • Optional columnGap?: string
  • Optional display?: "grid" | "inline-grid"
  • Optional gap?: string
  • Optional grid?: string
  • Optional gridAutoColumns?: string
  • Optional gridAutoFlow?: "row" | "column" | "row dense" | "column dense"
  • Optional gridAutoRows?: string
  • Optional gridTemplate?: string
  • Optional gridTemplateAreas?: string
  • Optional gridTemplateColumns?: string
  • Optional gridTemplateRows?: string
  • Optional justifyContent?: "start" | "end" | "center" | "stretch" | "space-around" | "space-between" | "space-evenly"
  • Optional justifyItems?: "start" | "end" | "center" | "stretch"
  • Optional placeContent?: string
  • Optional placeItems?: string
  • Optional rowGap?: string

MaxWidths

MaxWidths: { lg: number; md: number; sm: number; xl: number }

Type declaration

  • lg: number
  • md: number
  • sm: number
  • xl: number

Media

Media<T>: { [ key in keyof Breakpoints]?: T }

Type parameters

  • T

Responsive

Responsive<T>: { [ key in keyof T]?: T[key] | Media<T[key]> }

Type parameters

Spacing

Spacing: { margin?: string; mb?: string; ml?: string; mr?: string; mt?: string; mx?: string; my?: string; padding?: string; pb?: string; pl?: string; pr?: string; pt?: string; px?: string; py?: string }

Type declaration

  • Optional margin?: string
  • Optional mb?: string
  • Optional ml?: string
  • Optional mr?: string
  • Optional mt?: string
  • Optional mx?: string
  • Optional my?: string
  • Optional padding?: string
  • Optional pb?: string
  • Optional pl?: string
  • Optional pr?: string
  • Optional pt?: string
  • Optional px?: string
  • Optional py?: string

ValidComponents

ValidComponents: GridType | GridItemType | ContainerType | FlexType | FlexItemType

Variables

breakpoints

breakpoints: Breakpoints = ...

Functions

Const reactSchematic

Generated using TypeDoc