Reorganize exports

Author: openscript

README.md

@@ -12,7 +12,7 @@ Add the package with the package manager of choice to your project:
 
 ### TypeScript
 ```
-import { DSVImport, ColumnsType, TablePreview, TextareaInput } from 'react-dsv-import';
+import { DSVImport, ColumnsType } from 'react-dsv-import';
 
 type BasicType = { forename: string; surname: string; email: string };
 
@@ -23,14 +23,14 @@ const columns: ColumnsType<BasicType> = [
 ];
 
 <DSVImport<BasicType> columns={columns}>
-  <TextareaInput />
-  <TablePreview />
+  <DSVImport.TextareaInput />
+  <DSVImport.TablePreview />
 </DSVImport>
 ```
 
 ### JavaScript
 ```
-import { DSVImport, TablePreview, TextareaInput } from 'react-dsv-import';
+import { DSVImport } from 'react-dsv-import';
 
 const columns = [
   { key: 'forename', label: 'Forename' },
@@ -39,8 +39,8 @@ const columns = [
 ];
 
 <DSVImport columns={columns}>
-  <TextareaInput />
-  <TablePreview />
+  <DSVImport.TextareaInput />
+  <DSVImport.TablePreview />
 </DSVImport>
 ```
 
@@ -53,6 +53,7 @@ The most important features of this component are:
  - ✅ Type definitions and type safety
  - ✅ DSV format detection
  - ✅ Fully compositable
+ - ❌ Automatic testing with >90% coverage
  - ❌ Input validation
  - ❌ [Material UI](https://material-ui.com/) integration
  - ❌ [ant.design](https://ant.design/) integration

package.json

@@ -7,7 +7,7 @@
     "react"
   ],
   "homepage": "https://openscript.github.io/react-dsv-import/",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "main": "dist/index.js",
   "module": "dist/es/index.js",
   "types": "dist/index.d.ts",

src/DSVImport.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { DSVImport, ColumnsType, TablePreview, TextareaInput } from './';
+import { DSVImport, ColumnsType } from './';
 import { action } from '@storybook/addon-actions';
 
 export default { title: 'Usage' };
@@ -17,8 +17,8 @@ const onChangeAction = action('Parsed value has changed');
 export const BasicUsage = () => {
   return (
     <DSVImport<BasicType> columns={columns} onChange={onChangeAction}>
-      <TextareaInput />
-      <TablePreview />
+      <DSVImport.TextareaInput />
+      <DSVImport.TablePreview />
     </DSVImport>
   );
 };

src/index.tsx

@@ -1,12 +1,20 @@
-// composite
-export * from './DSVImport';
+import { TextareaInput } from './components/inputs/TextareaInput';
+import { TablePreview } from './components/previews/TablePreview';
+import { DSVImport as Import } from './DSVImport';
 
-// components
-export * from './components/inputs/TextareaInput';
-export * from './components/previews/TablePreview';
+import { ColumnsType } from './models/column';
+import { PropsWithChildren } from 'react';
 
-// features
-export { useDSVImport } from './features/context';
+interface Props<T> {
+  onChange?: (value: T[]) => void;
+  columns: ColumnsType<T>;
+}
 
-// models
-export * from './models/column';
+export function DSVImport<T extends { [key: string]: string }>(props: PropsWithChildren<Props<T>>) {
+  return Import<T>(props);
+}
+
+DSVImport.TextareaInput = TextareaInput;
+DSVImport.TablePreview = TablePreview;
+
+export { ColumnsType } from './models/column';