11import * as React from "react" ;
22import { useState } from "@hookstate/core" ;
33import { useSchemaState , defaultSchema } from "./state" ;
4- import { SchemaEditorProps } from "./JsonSchemaEditor.types" ;
4+ import { SchemaEditorProps } from ".. /JsonSchemaEditor.types" ;
55import { Flex , ChakraProvider , theme } from "@chakra-ui/react" ;
66
77import { SchemaRoot } from "./schema-root" ;
88import { Whoops } from "./whoops" ;
99import { SchemaObject } from "./schema-object" ;
1010import { SchemaArray } from "./schema-array" ;
1111
12- export * from "./JsonSchemaEditor.types" ;
12+ export * from ".. /JsonSchemaEditor.types" ;
1313
1414export const JsonSchemaEditor = ( props : SchemaEditorProps ) => {
15- const { onSchemaChange, readOnly, data } = props ;
15+ const { onSchemaChange, readOnly, data } = props ;
1616
17- const schemaState = useSchemaState ( {
18- jsonSchema : data ?? defaultSchema ( ) ,
19- isReadOnly : readOnly ?? false ,
20- fieldId : 0 ,
21- } ) ;
17+ const schemaState = useSchemaState ( {
18+ jsonSchema : data ?? defaultSchema ( ) ,
19+ isReadOnly : readOnly ?? false ,
20+ fieldId : 0 ,
21+ } ) ;
2222
23- const jsonSchemaState = useState ( schemaState . jsonSchema ) ;
23+ const jsonSchemaState = useState ( schemaState . jsonSchema ) ;
2424
25- return (
26- < ChakraProvider theme = { theme } >
27- { schemaState . isValidSchema ? (
28- < Flex m = { 2 } direction = "column" >
29- < SchemaRoot
30- onSchemaChange = { onSchemaChange }
31- schemaState = { schemaState . jsonSchema }
32- isReadOnly = { schemaState . isReadOnly }
33- />
25+ return (
26+ < ChakraProvider theme = { theme } >
27+ { schemaState . isValidSchema ? (
28+ < Flex m = { 2 } direction = "column" >
29+ < SchemaRoot
30+ onSchemaChange = { onSchemaChange }
31+ schemaState = { schemaState . jsonSchema }
32+ isReadOnly = { schemaState . isReadOnly }
33+ />
3434
35- { jsonSchemaState . type . value === "object" && (
36- < SchemaObject
37- schemaState = { jsonSchemaState }
38- isReadOnly = { schemaState . isReadOnly ?? false }
39- />
40- ) }
35+ { jsonSchemaState . type . value === "object" && (
36+ < SchemaObject
37+ schemaState = { jsonSchemaState }
38+ isReadOnly = { schemaState . isReadOnly ?? false }
39+ />
40+ ) }
4141
42- { jsonSchemaState . type . value === "array" && (
43- < SchemaArray
44- schemaState = { jsonSchemaState }
45- isReadOnly = { schemaState . isReadOnly ?? false }
46- />
47- ) }
48- </ Flex >
49- ) : (
50- < Flex alignContent = "center" justifyContent = "center" >
51- < Whoops />
52- </ Flex >
53- ) }
54- { /* <Modal
42+ { jsonSchemaState . type . value === "array" && (
43+ < SchemaArray
44+ schemaState = { jsonSchemaState }
45+ isReadOnly = { schemaState . isReadOnly ?? false }
46+ />
47+ ) }
48+ </ Flex >
49+ ) : (
50+ < Flex alignContent = "center" justifyContent = "center" >
51+ < Whoops />
52+ </ Flex >
53+ ) }
54+ { /* <Modal
5555 isOpen={localState.isAdvancedOpen.get()}
5656 finalFocusRef={focusRef}
5757 size="lg"
@@ -77,6 +77,6 @@ export const JsonSchemaEditor = (props: SchemaEditorProps) => {
7777 </ModalFooter>
7878 </ModalContent>
7979 </Modal> */ }
80- </ ChakraProvider >
81- ) ;
80+ </ ChakraProvider >
81+ ) ;
8282} ;
0 commit comments