Options
All
  • Public
  • Public/Protected
  • All
Menu

JSON Forms Vanilla Renderers

Index

Classes

Interfaces

Variables

Functions

Object literals

Variables

Const GroupLayoutRendererComponent

GroupLayoutRendererComponent: FunctionComponent<LayoutProps & VanillaRendererProps> = React.memo(function GroupLayoutRendererComponent({schema,uischema,path,enabled,visible,label,getStyle,getStyleAsClassName,}: LayoutProps & VanillaRendererProps) {const group = uischema as GroupLayout;const elementsSize = group.elements ? group.elements.length : 0;const classNames = getStyleAsClassName('group.layout');const childClassNames = ['group-layout-item'].concat(getStyle('group.layout.item', elementsSize)).join(' ');return (<fieldsetclassName={classNames}hidden={visible === undefined || visible === null ? false : !visible}>{!isEmpty(label) ? (<legend className={getStyleAsClassName('group.label')}>{label}</legend>) : ('')}{renderChildren(group, schema, childClassNames, path, enabled)}</fieldset>);})

Const HorizontalLayoutRendererComponent

HorizontalLayoutRendererComponent: FunctionComponent<RendererProps & VanillaRendererProps> = React.memo(function HorizontalLayoutRendererComponent({schema,uischema,getStyle,getStyleAsClassName,enabled,visible,path,}: RendererProps & VanillaRendererProps) {const horizontalLayout = uischema as HorizontalLayout;const elementsSize = horizontalLayout.elements? horizontalLayout.elements.length: 0;const layoutClassName = getStyleAsClassName('horizontal.layout');const childClassNames = ['horizontal-layout-item'].concat(getStyle('horizontal.layout.item', elementsSize)).join(' ');return (<JsonFormsLayoutclassName={layoutClassName}visible={visible}enabled={enabled}path={path}uischema={uischema}schema={schema}getStyle={getStyle}getStyleAsClassName={getStyleAsClassName}>{renderChildren(horizontalLayout, schema, childClassNames, path, enabled)}</JsonFormsLayout>);})

Const JsonFormsStyleContext

JsonFormsStyleContext: Context<StyleContext> = React.createContext(defaultContext)

Const REGISTER_STYLE

REGISTER_STYLE: "REGISTER_STYLE" = "REGISTER_STYLE"

Const REGISTER_STYLES

REGISTER_STYLES: "REGISTER_STYLES" = "REGISTER_STYLES"

Const UNREGISTER_STYLE

UNREGISTER_STYLE: "UNREGISTER_STYLE" = "UNREGISTER_STYLE"

Const VerticalLayoutRendererComponent

VerticalLayoutRendererComponent: FunctionComponent<RendererProps & VanillaRendererProps> = React.memo(function VerticalLayoutRendererComponent({schema,uischema,path,visible,enabled,getStyle,getStyleAsClassName,}: RendererProps & VanillaRendererProps) {const verticalLayout = uischema as VerticalLayout;const elementsSize = verticalLayout.elements? verticalLayout.elements.length: 0;const layoutClassName = getStyleAsClassName('vertical.layout');const childClassNames = ['vertical-layout-item'].concat(getStyle('vertical.layout.item', elementsSize)).join(' ');return (<JsonFormsLayoutclassName={layoutClassName}uischema={uischema}schema={schema}visible={visible}enabled={enabled}path={path}getStyle={getStyle}getStyleAsClassName={getStyleAsClassName}>{renderChildren(verticalLayout, schema, childClassNames, path, enabled)}</JsonFormsLayout>);})

Const arrayControlTester

arrayControlTester: RankedTester = rankWith(4,isObjectArrayWithNesting)

Const booleanCellTester

booleanCellTester: RankedTester = rankWith(2, isBooleanControl)

Default tester for boolean controls.

Const categorizationTester

categorizationTester: RankedTester = rankWith(1,and(uiTypeIs('Categorization'), (uischema) => {const hasCategory = (element: Categorization): boolean => {if (isEmpty(element.elements)) {return false;}return element.elements.map((elem) =>isCategorization(elem) ? hasCategory(elem) : elem.type === 'Category').reduce((prev, curr) => prev && curr, true);};return hasCategory(uischema as Categorization);}))

convertToValidClassName

convertToValidClassName: convertToValidClassName

Const dateCellTester

dateCellTester: RankedTester = rankWith(2, isDateControl)

Default tester for date controls.

Const dateTimeCellTester

dateTimeCellTester: RankedTester = rankWith(2, isDateTimeControl)

Default tester for datetime controls.

Const enumCellTester

enumCellTester: RankedTester = rankWith(2, isEnumControl)

Default tester for enum controls.

Const groupTester

groupTester: RankedTester = rankWith(1, uiTypeIs('Group'))

Default tester for a group layout.

Const horizontalLayoutTester

horizontalLayoutTester: RankedTester = rankWith(1,uiTypeIs('HorizontalLayout'))

Default tester for a horizontal layout.

Const inputControlTester

inputControlTester: RankedTester = rankWith(1, isControl)

Const integerCellTester

integerCellTester: RankedTester = rankWith(2, isIntegerControl)

Default tester for integer controls.

isObjectArrayControl

isObjectArrayControl: Tester

isPrimitiveArrayControl

isPrimitiveArrayControl: Tester

Const labelRendererTester

labelRendererTester: RankedTester = rankWith(1, uiTypeIs('Label'))

Default tester for a label.

Const numberCellTester

numberCellTester: RankedTester = rankWith(2, isNumberControl)

Default tester for number controls.

Const numberFormatCellTester

numberFormatCellTester: RankedTester = rankWith(4,isNumberFormatControl)

Default tester for text-based/string controls.

Const oneOfRadioGroupControlTester

oneOfRadioGroupControlTester: RankedTester = rankWith(3,and(isOneOfEnumControl, optionIs('format', 'radio')))

or

or: (...testers: Tester[]) => Tester

Type declaration

    • (...testers: Tester[]): Tester
    • Parameters

      • Rest ...testers: Tester[]

      Returns Tester

Const radioGroupControlTester

radioGroupControlTester: RankedTester = rankWith(3,and(isEnumControl, optionIs('format', 'radio')))

rankWith

rankWith: (rank: number, tester: Tester) => (uischema: UISchemaElement, schema: JsonSchema, context: TesterContext) => number

Type declaration

    • (rank: number, tester: Tester): (uischema: UISchemaElement, schema: JsonSchema, context: TesterContext) => number
    • Parameters

      • rank: number
      • tester: Tester

      Returns (uischema: UISchemaElement, schema: JsonSchema, context: TesterContext) => number

        • (uischema: UISchemaElement, schema: JsonSchema, context: TesterContext): number
        • Parameters

          • uischema: UISchemaElement
          • schema: JsonSchema
          • context: TesterContext

          Returns number

Const sliderCellTester

sliderCellTester: RankedTester = rankWith(4, isRangeControl)

Const tableArrayControlTester

tableArrayControlTester: RankedTester = rankWith(3,or(isObjectArrayControl, isPrimitiveArrayControl))

Alternative tester for an array that also checks whether the 'table' option is set.

Const textAreaCellTester

textAreaCellTester: RankedTester = rankWith(2, isMultiLineControl)

Tester for a multi-line string control.

Const textCellTester

textCellTester: RankedTester = rankWith(1, isStringControl)

Default tester for text-based/string controls.

Const timeCellTester

timeCellTester: RankedTester = rankWith(2, isTimeControl)

Default tester for date controls.

Const vanillaCells

vanillaCells: { cell: any; tester: RankedTester }[] = [{ tester: booleanCellTester, cell: BooleanCell },{ tester: dateCellTester, cell: DateCell },{ tester: dateTimeCellTester, cell: DateTimeCell },{ tester: enumCellTester, cell: EnumCell },{ tester: integerCellTester, cell: IntegerCell },{ tester: numberCellTester, cell: NumberCell },{ tester: sliderCellTester, cell: SliderCell },{ tester: textAreaCellTester, cell: TextAreaCell },{ tester: textCellTester, cell: TextCell },{ tester: timeCellTester, cell: TimeCell },]

Const vanillaRenderers

vanillaRenderers: { renderer: any; tester: RankedTester }[] = [{ tester: inputControlTester, renderer: InputControl },{ tester: radioGroupControlTester, renderer: RadioGroupControl },{ tester: oneOfRadioGroupControlTester, renderer: OneOfRadioGroupControl },{ tester: arrayControlTester, renderer: ArrayControl },{ tester: labelRendererTester, renderer: LabelRenderer },{ tester: categorizationTester, renderer: Categorization },{ tester: tableArrayControlTester, renderer: TableArrayControl },{ tester: groupTester, renderer: GroupLayout },{ tester: verticalLayoutTester, renderer: VerticalLayout },{ tester: horizontalLayoutTester, renderer: HorizontalLayout },]

Const vanillaStyles

vanillaStyles: StyleDef[] = [{name: 'control',classNames: ['control'],},{name: 'control.trim',classNames: ['trim'],},{name: 'control.input',classNames: ['input'],},{name: 'control.select',classNames: ['select'],},{name: 'control.checkbox',classNames: ['checkbox'],},{name: 'control.radio',classNames: ['radio'],},{name: 'control.radio.option',classNames: ['radio-option'],},{name: 'control.radio.input',classNames: ['radio-input'],},{name: 'control.radio.label',classNames: ['radio-label'],},{name: 'control.validation.error',classNames: ['validation_error'],},{name: 'control.validation',classNames: ['validation'],},{name: 'categorization',classNames: ['categorization'],},{name: 'categorization.master',classNames: ['categorization-master'],},{name: 'categorization.detail',classNames: ['categorization-detail'],},{name: 'category.group',classNames: ['category-group'],},{name: 'category.subcategories',classNames: ['category-subcategories'],},{name: 'array.layout',classNames: ['array-layout'],},{name: 'array.children',classNames: ['children'],},{name: 'group.layout',classNames: ['group-layout'],},{name: 'horizontal.layout',classNames: ['horizontal-layout'],},{name: 'horizontal.layout.item',classNames: ([size]: number[]) => [`horizontal-layout-${size}`],},{name: 'vertical.layout',classNames: ['vertical-layout'],},{name: 'array.table.validation.error',classNames: ['validation_error'],},{name: 'array.table.validation',classNames: ['validation'],},{name: 'array.table',classNames: ['array-table-layout', 'control'],},{name: 'array.control.validation.error',classNames: ['validation_error'],},{name: 'array.control.validation',classNames: ['validation'],},{name: 'array.control.add',classNames: ['button-add'],},{name: 'array.child.controls',classNames: ['child-controls'],},{name: 'array.child.controls.up',classNames: ['button-up'],},{name: 'array.child.controls.down',classNames: ['button-down'],},{name: 'array.child.controls.delete',classNames: ['button-delete'],},{name: 'array.control',classNames: ['array-control-layout', 'control'],},{name: 'input.description',classNames: ['input-description'],},]

Pre-defined vanilla styles.

Const verticalLayoutTester

verticalLayoutTester: RankedTester = rankWith(1,uiTypeIs('VerticalLayout'))

Default tester for a vertical layout.

Const withVanillaBooleanCellProps

withVanillaBooleanCellProps: (Anonymous function) = withVanillaCellPropsForType('control.checkbox')

Const withVanillaCellProps

withVanillaCellProps: (Anonymous function) = withVanillaCellPropsForType('control.input')

Const withVanillaEnumCellProps

withVanillaEnumCellProps: (Anonymous function) = withVanillaCellPropsForType('control.select')

Functions

Const ArrayControl

  • ArrayControl(__namedParameters: { addItem: addItem; classNames: {}; data: any; errors: string; getStyleAsClassName: getStyleAsClassName; label: string; moveDown: moveDown; moveUp: moveUp; path: string; removeItems: removeItems; renderers: JsonFormsRendererRegistryEntry[]; rootSchema: JsonSchema; schema: JsonSchema; translations: ArrayTranslations; uischema: ControlElement; uischemas: JsonFormsUISchemaRegistryEntry[] }): Element
  • Parameters

    • __namedParameters: { addItem: addItem; classNames: {}; data: any; errors: string; getStyleAsClassName: getStyleAsClassName; label: string; moveDown: moveDown; moveUp: moveUp; path: string; removeItems: removeItems; renderers: JsonFormsRendererRegistryEntry[]; rootSchema: JsonSchema; schema: JsonSchema; translations: ArrayTranslations; uischema: ControlElement; uischemas: JsonFormsUISchemaRegistryEntry[] }
      • addItem: addItem
      • classNames: {}
        • [className: string]: string
      • data: any
      • errors: string
      • getStyleAsClassName: getStyleAsClassName
      • label: string
      • moveDown: moveDown
      • moveUp: moveUp
      • path: string
      • removeItems: removeItems
      • renderers: JsonFormsRendererRegistryEntry[]
      • rootSchema: JsonSchema
      • schema: JsonSchema
      • translations: ArrayTranslations
      • uischema: ControlElement
      • uischemas: JsonFormsUISchemaRegistryEntry[]

    Returns Element

Const ArrayControlRenderer

  • ArrayControlRenderer(__namedParameters: { addItem: addItem; data: any; enabled: boolean; errors: string; getStyle: getStyle; getStyleAsClassName: getStyleAsClassName; id: string; moveDown: moveDown; moveUp: moveUp; path: string; removeItems: removeItems; rootSchema: JsonSchema; schema: JsonSchema; translations: ArrayTranslations; uischema: ControlElement; uischemas: JsonFormsUISchemaRegistryEntry[]; visible: boolean }): Element
  • Parameters

    • __namedParameters: { addItem: addItem; data: any; enabled: boolean; errors: string; getStyle: getStyle; getStyleAsClassName: getStyleAsClassName; id: string; moveDown: moveDown; moveUp: moveUp; path: string; removeItems: removeItems; rootSchema: JsonSchema; schema: JsonSchema; translations: ArrayTranslations; uischema: ControlElement; uischemas: JsonFormsUISchemaRegistryEntry[]; visible: boolean }
      • addItem: addItem
      • data: any
      • enabled: boolean
      • errors: string
      • getStyle: getStyle
      • getStyleAsClassName: getStyleAsClassName
      • id: string
      • moveDown: moveDown
      • moveUp: moveUp
      • path: string
      • removeItems: removeItems
      • rootSchema: JsonSchema
      • schema: JsonSchema
      • translations: ArrayTranslations
      • uischema: ControlElement
      • uischemas: JsonFormsUISchemaRegistryEntry[]
      • visible: boolean

    Returns Element

Const BooleanCell

  • Parameters

    Returns Element

Const CategorizationList

  • CategorizationList(__namedParameters: { categorization: Categorization; depth: number; groupClassName: string; onSelect: any; selectedCategory: Category; subcategoriesClassName: string; t: Translator }): Element
  • Parameters

    • __namedParameters: { categorization: Categorization; depth: number; groupClassName: string; onSelect: any; selectedCategory: Category; subcategoriesClassName: string; t: Translator }
      • categorization: Categorization
      • depth: number
      • groupClassName: string
      • onSelect: any
      • selectedCategory: Category
      • subcategoriesClassName: string
      • t: Translator

    Returns Element

Const DateCell

  • Parameters

    Returns Element

Const DateTimeCell

  • Parameters

    Returns Element

Const EnumCell

  • Parameters

    Returns Element

Const GroupLayoutRenderer

  • Parameters

    Returns Element

Const HorizontalLayoutRenderer

  • Parameters

    Returns Element

Const IntegerCell

  • Parameters

    Returns Element

Const JsonFormsLayout

  • JsonFormsLayout(__namedParameters: { children: any; className: string; visible: boolean }): Element
  • Parameters

    • __namedParameters: { children: any; className: string; visible: boolean }
      • children: any
      • className: string
      • visible: boolean

    Returns Element

Const LabelRenderer

  • LabelRenderer(__namedParameters: { getStyleAsClassName: getStyleAsClassName; text: string; visible: boolean }): Element
  • Default renderer for a label.

    Parameters

    Returns Element

Const NumberCell

  • Parameters

    Returns Element

Const NumberFormatCell

  • NumberFormatCell(props: CellProps & VanillaRendererProps & Formatted<number | undefined>): Element
  • Parameters

    Returns Element

Const OneOfRadioGroupControl

  • Parameters

    Returns Element

Const RadioGroup

  • RadioGroup(__namedParameters: { classNames: {}; config: any; data: any; description: string; enabled: boolean; errors: string; handleChange: handleChange; id: string; label: string; options: EnumOption[]; path: string; required: boolean; uischema: ControlElement; visible: boolean }): Element
  • Parameters

    • __namedParameters: { classNames: {}; config: any; data: any; description: string; enabled: boolean; errors: string; handleChange: handleChange; id: string; label: string; options: EnumOption[]; path: string; required: boolean; uischema: ControlElement; visible: boolean }
      • classNames: {}
        • [className: string]: string
      • config: any
      • data: any
      • description: string
      • enabled: boolean
      • errors: string
      • handleChange: handleChange
      • id: string
      • label: string
      • options: EnumOption[]
      • path: string
      • required: boolean
      • uischema: ControlElement
      • visible: boolean

    Returns Element

Const RadioGroupControl

  • Parameters

    Returns Element

Const SingleCategory

  • SingleCategory(__namedParameters: { category: Category; path: string; schema: JsonSchema }): Element
  • Parameters

    • __namedParameters: { category: Category; path: string; schema: JsonSchema }
      • category: Category
      • path: string
      • schema: JsonSchema

    Returns Element

Const SliderCell

  • Parameters

    Returns Element

Const TextAreaCell

  • Parameters

    Returns Element

Const TextCell

  • Parameters

    Returns Element

Const TimeCell

  • Parameters

    Returns Element

Const VerticalLayoutRenderer

  • Parameters

    Returns Element

Const addVanillaCellProps

  • addVanillaCellProps(mapStateToCellsProps: (s: JsonFormsState, p: OwnPropsOfCell) => StatePropsOfCell): (Anonymous function)
  • Parameters

    • mapStateToCellsProps: (s: JsonFormsState, p: OwnPropsOfCell) => StatePropsOfCell
        • (s: JsonFormsState, p: OwnPropsOfCell): StatePropsOfCell
        • Parameters

          • s: JsonFormsState
          • p: OwnPropsOfCell

          Returns StatePropsOfCell

    Returns (Anonymous function)

Const addVanillaControlProps

  • addVanillaControlProps<P>(mapStateToProps: (s: JsonFormsState, p: OwnPropsOfControl) => P): (Anonymous function)
  • Add vanilla props to the return value of calling the given mapStateToProps function.

    Type parameters

    • P: StatePropsOfControl

    Parameters

    • mapStateToProps: (s: JsonFormsState, p: OwnPropsOfControl) => P

      existing mapStateToProps function

        • (s: JsonFormsState, p: OwnPropsOfControl): P
        • Parameters

          • s: JsonFormsState
          • p: OwnPropsOfControl

          Returns P

    Returns (Anonymous function)

    vanilla-specific control props

Const addVanillaLayoutProps

  • addVanillaLayoutProps(mapStateToProps: (s: JsonFormsState, p: OwnPropsOfRenderer) => RendererProps): (Anonymous function)
  • Add vanilla props to the return value of calling the given mapStateToProps function.

    Parameters

    • mapStateToProps: (s: JsonFormsState, p: OwnPropsOfRenderer) => RendererProps

      an existing mapStateToProps function for retrieving layout props

        • (s: JsonFormsState, p: OwnPropsOfRenderer): RendererProps
        • Parameters

          • s: JsonFormsState
          • p: OwnPropsOfRenderer

          Returns RendererProps

    Returns (Anonymous function)

    vanilla specific layout props

Const appendSecondsIfNecessary

  • appendSecondsIfNecessary(value: unknown): unknown
  • AJV 'time' format expects HH:mm:ss while only returns HH:mm. Therefore we append ':00' when the seconds are missing.

    Parameters

    • value: unknown

    Returns unknown

Const findStyle

  • findStyle(styles: StyleDef[]): (Anonymous function)
  • Parameters

    Returns (Anonymous function)

Const findStyleAsClassName

  • findStyleAsClassName(styles: StyleDef[]): (Anonymous function)
  • Parameters

    Returns (Anonymous function)

Const getCategoryClassName

  • getCategoryClassName(category: Category, selectedCategory: Category): string
  • Parameters

    • category: Category
    • selectedCategory: Category

    Returns string

Const getStyle

  • getStyle(state: JsonFormsState): (Anonymous function)
  • Parameters

    • state: JsonFormsState

    Returns (Anonymous function)

Const getStyleAsClassName

  • getStyleAsClassName(state: JsonFormsState): (Anonymous function)
  • Parameters

    • state: JsonFormsState

    Returns (Anonymous function)

Const isCategorization

  • isCategorization(category: Category | Categorization): category is Categorization
  • Parameters

    • category: Category | Categorization

    Returns category is Categorization

Const registerStyle

  • registerStyle(styleName: string, classNames: string[]): { classNames: string[]; name: string; type: string }
  • registerStyle(styles: StyleDef[], __namedParameters: { classNames: string[] | ((...args: any[]) => string[]); name: string }): StyleDef[]
  • Parameters

    • styleName: string
    • classNames: string[]

    Returns { classNames: string[]; name: string; type: string }

    • classNames: string[]
    • name: string
    • type: string
  • Parameters

    • styles: StyleDef[]
    • __namedParameters: { classNames: string[] | ((...args: any[]) => string[]); name: string }
      • classNames: string[] | ((...args: any[]) => string[])
      • name: string

    Returns StyleDef[]

Const registerStyles

  • registerStyles(styleDefs: { classNames: string[]; name: string }[]): { styles: { classNames: string[]; name: string }[]; type: string }
  • Parameters

    • styleDefs: { classNames: string[]; name: string }[]

    Returns { styles: { classNames: string[]; name: string }[]; type: string }

    • styles: { classNames: string[]; name: string }[]
    • type: string

Const removeStyle

  • Parameters

    Returns StyleDef[]

Const renderChildren

  • renderChildren(layout: Layout, schema: JsonSchema, className: string, path: string, enabled: boolean): Element[]
  • Parameters

    • layout: Layout
    • schema: JsonSchema
    • className: string
    • path: string
    • enabled: boolean

    Returns Element[]

Const stylingReducer

  • stylingReducer(state?: StyleDef[], action: any): any
  • Parameters

    • Default value state: StyleDef[] = []
    • action: any

    Returns any

Const toNumber

  • toNumber(value: string): number
  • toNumber(value: string): number
  • Parameters

    • value: string

    Returns number

  • Parameters

    • value: string

    Returns number

Const unregisterStyle

  • unregisterStyle(styleName: string): { name: string; type: string }
  • Parameters

    • styleName: string

    Returns { name: string; type: string }

    • name: string
    • type: string

Const useStyleContext

  • Returns StyleContext

Const useStyles

  • Returns StyleDef[]

Const withVanillaCellPropsForType

  • withVanillaCellPropsForType(type: string): (Anonymous function)
  • Parameters

    • type: string

    Returns (Anonymous function)

Const withVanillaControlProps

  • withVanillaControlProps(Component: ComponentType<any>): WithVanillaControlProps
  • Parameters

    • Component: ComponentType<any>

    Returns WithVanillaControlProps

Object literals

Const defaultContext

defaultContext: object

styles

styles: StyleDef[] = vanillaStyles

Const i18nDefaults

i18nDefaults: object

enum.none

enum.none: string = "None"

Generated using TypeDoc