Feature/include types (#8)

* bump version * refactor to include typescript.types exported
Optum · Jun 2, 2021 · a074508 · a074508
1 parent baec883
commit a074508
Show file tree

Hide file tree

Showing 18 changed files with 1,537 additions and 1,525 deletions.
diff --git a/package.json b/package.json
@@ -1,13 +1,13 @@
 {
 	"name": "@optum/json-schema-editor",
-	"version": "2.0.1",
+	"version": "2.0.3",
 	"description": "JsonSchema Editor React Control",
 	"repository": "https://github.com/optum/jsonschema-editor-react",
 	"license": "Apache 2.0",
 	"engines": {
 		"node": ">=10.18.0 <11 || >=12.14.0 <13 || >=13.5.0"
 	},
-	"source": "src/JsonSchemaEditor/index.ts",
+	"source": "src/index.ts",
 	"publishConfig": {
 		"access": "public",
 		"registry": "https://registry.npmjs.org"

diff --git a/src/JsonSchemaEditor.test.tsx b/src/JsonSchemaEditor.test.tsx
@@ -1,38 +1,38 @@
 import React from "react";
 import { render } from "@testing-library/react";
 
-import JsonSchemaEditor from "./JsonSchemaEditor";
-import { SchemaEditorProps } from "./JsonSchemaEditor/JsonSchemaEditor.types";
+import JsonSchemaEditor from ".";
+import { SchemaEditorProps } from "./JsonSchemaEditor.types";
 
 const printIt = (schema: string) => {
-  console.log(schema);
+	console.log(schema);
 };
 
 describe("JsonSchemaEditor", () => {
-  let props: SchemaEditorProps;
+	let props: SchemaEditorProps;
 
-  beforeEach(() => {
-    props = {
-      onSchemaChange: printIt,
-    };
-  });
+	beforeEach(() => {
+		props = {
+			onSchemaChange: printIt,
+		};
+	});
 
-  const renderComponent = () => render(<JsonSchemaEditor {...props} />);
+	const renderComponent = () => render(<JsonSchemaEditor {...props} />);
 
-  it("should have primary className with default props", () => {
-    renderComponent();
+	it("should have primary className with default props", () => {
+		renderComponent();
 
-    const { container } = renderComponent();
+		const { container } = renderComponent();
 
-    // const testComponent = getByTestId("jsonschema-editor");
-    console.log(container.innerHTML);
+		// const testComponent = getByTestId("jsonschema-editor");
+		console.log(container.innerHTML);
 
-    // expect(testComponent).toHaveClass("test-component-primary");
+		// expect(testComponent).toHaveClass("test-component-primary");
 
-    // console.log(result.asFragment.toString);
-    // // expect(screen.getByText("root")).toBeInTheDocument();
-    // expect(true).toBe(true);
-  });
+		// console.log(result.asFragment.toString);
+		// // expect(screen.getByText("root")).toBeInTheDocument();
+		// expect(true).toBe(true);
+	});
 });
 
 // test("renders learn react link", () => {

diff --git a/...sonSchemaEditor/JsonSchemaEditor.types.ts → src/JsonSchemaEditor.types.ts b/...sonSchemaEditor/JsonSchemaEditor.types.ts → src/JsonSchemaEditor.types.ts
diff --git a/src/JsonSchemaEditor/JsonSchemaEditor.tsx b/src/JsonSchemaEditor/JsonSchemaEditor.tsx
@@ -1,57 +1,57 @@
 import * as React from "react";
 import { useState } from "@hookstate/core";
 import { useSchemaState, defaultSchema } from "./state";
-import { SchemaEditorProps } from "./JsonSchemaEditor.types";
+import { SchemaEditorProps } from "../JsonSchemaEditor.types";
 import { Flex, ChakraProvider, theme } from "@chakra-ui/react";
 
 import { SchemaRoot } from "./schema-root";
 import { Whoops } from "./whoops";
 import { SchemaObject } from "./schema-object";
 import { SchemaArray } from "./schema-array";
 
-export * from "./JsonSchemaEditor.types";
+export * from "../JsonSchemaEditor.types";
 
 export const JsonSchemaEditor = (props: SchemaEditorProps) => {
-  const { onSchemaChange, readOnly, data } = props;
+	const { onSchemaChange, readOnly, data } = props;
 
-  const schemaState = useSchemaState({
-    jsonSchema: data ?? defaultSchema(),
-    isReadOnly: readOnly ?? false,
-    fieldId: 0,
-  });
+	const schemaState = useSchemaState({
+		jsonSchema: data ?? defaultSchema(),
+		isReadOnly: readOnly ?? false,
+		fieldId: 0,
+	});
 
-  const jsonSchemaState = useState(schemaState.jsonSchema);
+	const jsonSchemaState = useState(schemaState.jsonSchema);
 
-  return (
-    <ChakraProvider theme={theme}>
-      {schemaState.isValidSchema ? (
-        <Flex m={2} direction="column">
-          <SchemaRoot
-            onSchemaChange={onSchemaChange}
-            schemaState={schemaState.jsonSchema}
-            isReadOnly={schemaState.isReadOnly}
-          />
+	return (
+		<ChakraProvider theme={theme}>
+			{schemaState.isValidSchema ? (
+				<Flex m={2} direction="column">
+					<SchemaRoot
+						onSchemaChange={onSchemaChange}
+						schemaState={schemaState.jsonSchema}
+						isReadOnly={schemaState.isReadOnly}
+					/>
 
-          {jsonSchemaState.type.value === "object" && (
-            <SchemaObject
-              schemaState={jsonSchemaState}
-              isReadOnly={schemaState.isReadOnly ?? false}
-            />
-          )}
+					{jsonSchemaState.type.value === "object" && (
+						<SchemaObject
+							schemaState={jsonSchemaState}
+							isReadOnly={schemaState.isReadOnly ?? false}
+						/>
+					)}
 
-          {jsonSchemaState.type.value === "array" && (
-            <SchemaArray
-              schemaState={jsonSchemaState}
-              isReadOnly={schemaState.isReadOnly ?? false}
-            />
-          )}
-        </Flex>
-      ) : (
-        <Flex alignContent="center" justifyContent="center">
-          <Whoops />
-        </Flex>
-      )}
-      {/* <Modal
+					{jsonSchemaState.type.value === "array" && (
+						<SchemaArray
+							schemaState={jsonSchemaState}
+							isReadOnly={schemaState.isReadOnly ?? false}
+						/>
+					)}
+				</Flex>
+			) : (
+				<Flex alignContent="center" justifyContent="center">
+					<Whoops />
+				</Flex>
+			)}
+			{/* <Modal
         isOpen={localState.isAdvancedOpen.get()}
         finalFocusRef={focusRef}
         size="lg"
@@ -77,6 +77,6 @@ export const JsonSchemaEditor = (props: SchemaEditorProps) => {
           </ModalFooter>
         </ModalContent>
       </Modal> */}
-    </ChakraProvider>
-  );
+		</ChakraProvider>
+	);
 };
diff --git a/src/JsonSchemaEditor/advanced-boolean/index.tsx b/src/JsonSchemaEditor/advanced-boolean/index.tsx
@@ -1,46 +1,46 @@
 import * as React from "react";
 import { Flex, FormLabel, Stack, Select } from "@chakra-ui/react";
 
-import { AdvancedItemStateProps } from "../JsonSchemaEditor.types";
+import { AdvancedItemStateProps } from "../../JsonSchemaEditor.types";
 import { useState } from "@hookstate/core";
 
 export const AdvancedBoolean: React.FunctionComponent<AdvancedItemStateProps> = (
-  props: React.PropsWithChildren<AdvancedItemStateProps>
+	props: React.PropsWithChildren<AdvancedItemStateProps>
 ) => {
-  const { itemStateProp } = props;
+	const { itemStateProp } = props;
 
-  const item = useState(itemStateProp);
+	const item = useState(itemStateProp);
 
-  return (
-    <Flex direction="column" wrap="nowrap">
-      <Stack
-        isInline
-        alignItems="center"
-        justifyContent="center"
-        alignContent="center"
-        m={1}
-      >
-        <FormLabel mr={2} htmlFor="default">
-          Default:{" "}
-        </FormLabel>
-        <Select
-          variant="outline"
-          value={(item.default.value as string) ?? ""}
-          size="sm"
-          margin={2}
-          placeholder="Choose data type"
-          onChange={(evt: React.ChangeEvent<HTMLSelectElement>) => {
-            item.default.set(evt.target.value);
-          }}
-        >
-          <option key="true" value="true">
-            true
-          </option>
-          <option key="false" value="false">
-            false
-          </option>
-        </Select>
-      </Stack>
-    </Flex>
-  );
+	return (
+		<Flex direction="column" wrap="nowrap">
+			<Stack
+				isInline
+				alignItems="center"
+				justifyContent="center"
+				alignContent="center"
+				m={1}
+			>
+				<FormLabel mr={2} htmlFor="default">
+					Default:{" "}
+				</FormLabel>
+				<Select
+					variant="outline"
+					value={(item.default.value as string) ?? ""}
+					size="sm"
+					margin={2}
+					placeholder="Choose data type"
+					onChange={(evt: React.ChangeEvent<HTMLSelectElement>) => {
+						item.default.set(evt.target.value);
+					}}
+				>
+					<option key="true" value="true">
+						true
+					</option>
+					<option key="false" value="false">
+						false
+					</option>
+				</Select>
+			</Stack>
+		</Flex>
+	);
 };