From bbe645a3a42f3f97db4d58b06c2139e5cf68effe Mon Sep 17 00:00:00 2001 From: Qingqi Shi Date: Wed, 29 Jan 2020 21:41:41 +0000 Subject: [PATCH] [react-jsonschema-form] Update types to support 1.7 (#41956) https://github.com/rjsf-team/react-jsonschema-form/releases/tag/v1.7.0 --- types/react-jsonschema-form/index.d.ts | 12 +++++- .../react-jsonschema-form-tests.tsx | 40 ++++++++++++++++++- 2 files changed, 49 insertions(+), 3 deletions(-) diff --git a/types/react-jsonschema-form/index.d.ts b/types/react-jsonschema-form/index.d.ts index 56b9e21cfc..c2dfa0871d 100644 --- a/types/react-jsonschema-form/index.d.ts +++ b/types/react-jsonschema-form/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for react-jsonschema-form 1.6.1 +// Type definitions for react-jsonschema-form 1.7.0 // Project: https://github.com/mozilla-services/react-jsonschema-form // Definitions by: Dan Fox // Ivan Jiang @@ -12,6 +12,7 @@ // Chancellor Clark // BenoƮt Sepe // Andre Nguyen +// Qingqi Shi // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 3.5 @@ -59,6 +60,9 @@ declare module 'react-jsonschema-form' { autocomplete?: string; enctype?: string; acceptcharset?: string; + omitExtraData?: boolean; + liveOmit?: boolean; + tagName?: keyof JSX.IntrinsicElements | React.ComponentType; } export default class Form extends React.Component> { @@ -78,6 +82,9 @@ declare module 'react-jsonschema-form' { 'ui:widget'?: Widget | string; 'ui:options'?: { [key: string]: boolean | number | string | object | any[] | null }; 'ui:order'?: string[]; + 'ui:FieldTemplate'?: React.StatelessComponent; + 'ui:ArrayFieldTemplate'?: React.StatelessComponent; + 'ui:ObjectFieldTemplate'?: React.StatelessComponent; [name: string]: any; }; @@ -178,6 +185,7 @@ declare module 'react-jsonschema-form' { onDropIndexClick: (index: number) => (event: any) => void; onReorderClick: (index: number, newIndex: number) => (event: any) => void; readonly: boolean; + key: string; }[]; onAddClick: (event: any) => (event: any) => void; readonly: boolean; @@ -272,7 +280,7 @@ declare module 'react-jsonschema-form/lib/components/fields/SchemaField' { export type SchemaFieldProps = Pick< FieldProps, - 'schema' | 'uiSchema' | 'idSchema' | 'formData' | 'errorSchema' | 'registry' + 'schema' | 'uiSchema' | 'idSchema' | 'formData' | 'errorSchema' | 'registry' | 'formContext' >; export default class SchemaField extends React.Component {} diff --git a/types/react-jsonschema-form/react-jsonschema-form-tests.tsx b/types/react-jsonschema-form/react-jsonschema-form-tests.tsx index 784b0c5dc0..96ae90fa2e 100644 --- a/types/react-jsonschema-form/react-jsonschema-form-tests.tsx +++ b/types/react-jsonschema-form/react-jsonschema-form-tests.tsx @@ -1,5 +1,15 @@ import * as React from 'react'; -import Form, { UiSchema, ErrorListProps, FieldProps, WidgetProps, ErrorSchema, withTheme } from 'react-jsonschema-form'; +import Form, { + UiSchema, + ErrorListProps, + FieldProps, + WidgetProps, + ErrorSchema, + withTheme, + FieldTemplateProps, + ArrayFieldTemplateProps, + ObjectFieldTemplateProps, +} from 'react-jsonschema-form'; import SchemaField, { SchemaFieldProps } from 'react-jsonschema-form/lib/components/fields/SchemaField'; import { JSONSchema6 } from 'json-schema'; @@ -44,6 +54,18 @@ const schema: JSONSchema6 = { }, }; +const ExampleFieldTemplate = (_props: FieldTemplateProps) => null; + +const ExampleArrayFieldTemplate = ({ items }: ArrayFieldTemplateProps) => ( +
+ {items.map(element => ( +
{element.children}
+ ))} +
+); + +const ExampleObjectFieldTemplate = (_props: ObjectFieldTemplateProps) => null; + const uiSchema: UiSchema = { age: { 'ui:widget': 'updown', @@ -58,6 +80,9 @@ const uiSchema: UiSchema = { date: { 'ui:widget': 'alt-datetime', }, + 'ui:FieldTemplate': ExampleFieldTemplate, + 'ui:ArrayFieldTemplate': ExampleArrayFieldTemplate, + 'ui:ObjectFieldTemplate': ExampleObjectFieldTemplate, }; interface IExampleState { @@ -232,3 +257,16 @@ export const customFieldExample = (props: FieldProps) => { }; return ; }; + +export const omitExtraDataExample = (schema: JSONSchema6) => { + return
; +}; + +export const customTagName = (schema: JSONSchema6) => { + return ; +}; + +const TestForm = (props: React.ComponentProps<'form'>) => ; +export const customTagNameUsingComponent = (schema: JSONSchema6) => { + return ; +};