Don't use default exports.

.eslintrc.js

@@ -27,14 +27,19 @@ module.exports = {
         "react/prop-types": "warn",
         "react/no-array-index-key": "warn",
         "react/button-has-type": "warn",
+        "import/prefer-default-export": "off",
         "import/no-unresolved": [
             "error",
             // Ignore imports used only in tests
-            {ignore: ["mockWS", "customTestRender"]}
+            { ignore: ["mockWS", "customTestRender"] }
         ],
         "import/no-cycle": "warn",
         "no-console": "error",
-        "no-use-before-define": ["error", {functions: false, classes: true, variables: true}],
+        "no-use-before-define": ["error", {
+            functions: false,
+            classes: true,
+            variables: true
+        }],
         "no-restricted-syntax": "warn",
         // Should be enabled in the future
         "camelcase": "off",

babel.config.js

@@ -1,15 +1,10 @@
 module.exports = {
     presets: [
-        ["@babel/preset-env", {
-            targets: {
-                esmodules: true,
-            },
-        }],
+        "@babel/preset-env",
         "@babel/preset-react",
     ],
     plugins: [
         "@babel/plugin-transform-runtime",
-        "@babel/plugin-syntax-export-namespace-from",
         "@babel/plugin-syntax-export-default-from",
     ],
 };

package-lock.json

@@ -123,20 +123,6 @@
         "@babel/types": "^7.4.4"
       }
     },
-    "@babel/helper-create-class-features-plugin": {
-      "version": "7.5.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.5.5.tgz",
-      "integrity": "sha512-ZsxkyYiRA7Bg+ZTRpPvB6AbOFKTFFK4LrvTet8lInm0V468MWCaSYJE+I7v2z2r8KNLtYiV+K5kTCnR7dvyZjg==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-function-name": "^7.1.0",
-        "@babel/helper-member-expression-to-functions": "^7.5.5",
-        "@babel/helper-optimise-call-expression": "^7.0.0",
-        "@babel/helper-plugin-utils": "^7.0.0",
-        "@babel/helper-replace-supers": "^7.5.5",
-        "@babel/helper-split-export-declaration": "^7.4.4"
-      }
-    },
     "@babel/helper-define-map": {
       "version": "7.5.5",
       "resolved": "https://registry.npmjs.org/@babel/helper-define-map/-/helper-define-map-7.5.5.tgz",
@@ -338,16 +324,6 @@
         "@babel/plugin-syntax-async-generators": "^7.2.0"
       }
     },
-    "@babel/plugin-proposal-class-properties": {
-      "version": "7.5.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.5.5.tgz",
-      "integrity": "sha512-AF79FsnWFxjlaosgdi421vmYG6/jg79bVD0dpD44QdgobzHKuLZ6S3vl8la9qIeSwGi8i1fS0O1mfuDAAdo1/A==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-create-class-features-plugin": "^7.5.5",
-        "@babel/helper-plugin-utils": "^7.0.0"
-      }
-    },
     "@babel/plugin-proposal-dynamic-import": {
       "version": "7.5.0",
       "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.5.0.tgz",
@@ -426,15 +402,6 @@
         "@babel/helper-plugin-utils": "^7.0.0"
       }
     },
-    "@babel/plugin-syntax-export-namespace-from": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-export-namespace-from/-/plugin-syntax-export-namespace-from-7.2.0.tgz",
-      "integrity": "sha512-1zGA3UNch6A+A11nIzBVEaE3DDJbjfB+eLIcf0GGOh/BJr/8NxL3546MGhV/r0RhH4xADFIEso39TKCfEMlsGA==",
-      "dev": true,
-      "requires": {
-        "@babel/helper-plugin-utils": "^7.0.0"
-      }
-    },
     "@babel/plugin-syntax-json-strings": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.2.0.tgz",

package.json

@@ -30,9 +30,7 @@
   "devDependencies": {
     "@babel/cli": "^7.4.4",
     "@babel/core": "^7.4.5",
-    "@babel/plugin-proposal-class-properties": "^7.4.4",
     "@babel/plugin-syntax-export-default-from": "^7.2.0",
-    "@babel/plugin-syntax-export-namespace-from": "^7.2.0",
     "@babel/plugin-transform-runtime": "^7.4.4",
     "@babel/preset-env": "^7.4.5",
     "@babel/preset-react": "^7.0.0",

src/bootstrap/Alert.js

@@ -22,7 +22,7 @@ Alert.propTypes = {
     onDismiss: PropTypes.func,
 };
 
-export default function Alert({
+export function Alert({
     type, message, onDismiss, children,
 }) {
     return (

src/bootstrap/Button.js

@@ -29,7 +29,7 @@ Button.propTypes = {
     ]).isRequired,
 };
 
-export default function Button({
+export function Button({
     className, loading, forisFormSize, children, ...props
 }) {
     className = className ? `btn ${className}` : "btn btn-primary ";

src/bootstrap/Checkbox.js

@@ -27,7 +27,7 @@ CheckBox.defaultProps = {
     disabled: false,
 };
 
-export default function CheckBox({
+export function CheckBox({
     label, helpText, useDefaultSize, disabled, ...props
 }) {
     const uid = useUID();

src/bootstrap/DataTimeInput.js

@@ -10,7 +10,7 @@ import PropTypes from "prop-types";
 import Datetime from "react-datetime/DateTime";
 import moment from "moment/moment";
 
-import Input from "./Input";
+import { Input } from "./Input";
 
 DataTimeInput.propTypes = {
     /** Field label. */
@@ -35,7 +35,7 @@ DataTimeInput.propTypes = {
 const DEFAULT_DATE_FORMAT = "YYYY-MM-DD";
 const DEFAULT_TIME_FORMAT = "HH:mm:ss";
 
-export default function DataTimeInput({
+export function DataTimeInput({
     value, onChange, isValidDate, dateFormat, timeFormat, children, ...props
 }) {
     function renderInput(datetimeProps) {

src/bootstrap/EmailInput.js

@@ -8,9 +8,9 @@
 import React from "react";
 
 import PropTypes from "prop-types";
-import Input from "./Input";
+import { Input } from "./Input";
 
-const EmailInput = ({ ...props }) => <Input type="email" {...props} />;
+export const EmailInput = ({ ...props }) => <Input type="email" {...props} />;
 
 
 EmailInput.propTypes = {
@@ -23,5 +23,3 @@ EmailInput.propTypes = {
     /** Email value. */
     value: PropTypes.string,
 };
-
-export default EmailInput;

src/bootstrap/Input.js

@@ -8,6 +8,7 @@
 import React from "react";
 import { useUID } from "react-uid/dist/es5/index";
 import PropTypes from "prop-types";
+
 import { formFieldsSize } from "./constants";
 
 Input.propTypes = {
@@ -23,7 +24,7 @@ Input.propTypes = {
 };
 
 /** Base bootstrap input component. */
-export default function Input({
+export function Input({
     type, label, helpText, error, className, children, ...props
 }) {
     const uid = useUID();

src/bootstrap/Modal.js

@@ -7,7 +7,8 @@
 
 import React, { useEffect, useRef } from "react";
 import PropTypes from "prop-types";
-import Portal from "utils/Portal";
+
+import { Portal } from "utils/Portal";
 
 Modal.propTypes = {
     /** Is modal shown value */

src/bootstrap/NumberInput.js

@@ -8,9 +8,9 @@
 import React from "react";
 
 import PropTypes from "prop-types";
-import Input from "./Input";
+import { Input } from "./Input";
 
-const NumberInput = ({ ...props }) => <Input type="number" {...props} />;
+export const NumberInput = ({ ...props }) => <Input type="number" {...props} />;
 
 NumberInput.propTypes = {
     /** Field label. */
@@ -25,5 +25,3 @@ NumberInput.propTypes = {
         PropTypes.number,
     ]),
 };
-
-export default NumberInput;

src/bootstrap/PasswordInput.js

@@ -8,7 +8,7 @@
 import React, { useState } from "react";
 import PropTypes from "prop-types";
 
-import Input from "./Input";
+import { Input } from "./Input";
 
 PasswordInput.propTypes = {
     /** Field label. */
@@ -23,7 +23,7 @@ PasswordInput.propTypes = {
     withEye: PropTypes.bool,
 };
 
-export default function PasswordInput({ withEye, ...props }) {
+export function PasswordInput({ withEye, ...props }) {
     const [isHidden, setHidden] = useState(true);
     return (
         <Input

src/bootstrap/RadioSet.js

@@ -30,7 +30,7 @@ RadioSet.propTypes = {
     helpText: PropTypes.string,
 };
 
-export default function RadioSet({
+export function RadioSet({
     name, label, choices, value, helpText, ...props
 }) {
     const uid = useUID();

src/bootstrap/Select.js

@@ -24,7 +24,7 @@ Select.propTypes = {
     helpText: PropTypes.string,
 };
 
-export default function Select({
+export function Select({
     label, choices, helpText, ...props
 }) {
     const uid = useUID();

src/bootstrap/TextInput.js

@@ -8,10 +8,10 @@
 import React from "react";
 import PropTypes from "prop-types";
 
-import Input from "./Input";
+import { Input } from "./Input";
 
 
-const TextInput = ({ ...props }) => <Input type="text" {...props} />;
+export const TextInput = ({ ...props }) => <Input type="text" {...props} />;
 
 
 TextInput.propTypes = {
@@ -22,5 +22,3 @@ TextInput.propTypes = {
     /** Help text message. */
     helpText: PropTypes.string,
 };
-
-export default TextInput;

src/bootstrap/__tests__/Button.test.js

@@ -5,25 +5,28 @@
  * See /LICENSE for more information.
  */
 
-import React from 'react';
+import React from "react";
 
-import {render} from 'customTestRender';
+import { render } from "customTestRender";
 
-import Button from '../Button'
+import { Button } from "../Button";
 
-describe('<Button />', () => {
-    it('Render button correctly', () => {
-        const {container} = render(<Button>Test Button</Button>);
-        expect(container.firstChild).toMatchSnapshot()
+describe("<Button />", () => {
+    it("Render button correctly", () => {
+        const { container } = render(<Button>Test Button</Button>);
+        expect(container.firstChild)
+            .toMatchSnapshot();
     });
 
-    it('Render button with custom classes', () => {
-        const {container} = render(<Button className="one two three">Test Button</Button>)
-        expect(container.firstChild).toMatchSnapshot()
+    it("Render button with custom classes", () => {
+        const { container } = render(<Button className="one two three">Test Button</Button>);
+        expect(container.firstChild)
+            .toMatchSnapshot();
     });
 
-    it('Render button with spinner', () => {
-        const {container} = render(<Button loading={true}>Test Button</Button>)
-        expect(container.firstChild).toMatchSnapshot()
+    it("Render button with spinner", () => {
+        const { container } = render(<Button loading={true}>Test Button</Button>);
+        expect(container.firstChild)
+            .toMatchSnapshot();
     });
 });

src/bootstrap/__tests__/Checkbox.test.js

@@ -5,32 +5,35 @@
  * See /LICENSE for more information.
  */
 
-import React from 'react';
+import React from "react";
 
-import {render} from 'customTestRender';
+import { render } from "customTestRender";
 
-import CheckBox from '../Checkbox'
+import { CheckBox } from "../Checkbox";
 
-describe('<Checkbox/>', () => {
-    it('Render checkbox', () => {
-        const {container} = render(
+describe("<Checkbox/>", () => {
+    it("Render checkbox", () => {
+        const { container } = render(
             <CheckBox
                 label="Test label"
                 checked
                 helpText="Some help text"
-                onChange={()=>{}}
+                onChange={() => {
+                }}
             />
         );
-        expect(container.firstChild).toMatchSnapshot();
+        expect(container.firstChild)
+            .toMatchSnapshot();
     });
 
-    it('Render uncheked checkbox', () => {
-        const {container} = render(
+    it("Render uncheked checkbox", () => {
+        const { container } = render(
             <CheckBox
                 label="Test label"
                 helpText="Some help text"
             />
         );
-        expect(container.firstChild).toMatchSnapshot();
+        expect(container.firstChild)
+            .toMatchSnapshot();
     });
 });

src/bootstrap/__tests__/NumberInput.test.js

@@ -5,16 +5,16 @@
  * See /LICENSE for more information.
  */
 
-import React from 'react';
+import React from "react";
 
-import {render} from 'customTestRender';
+import { render } from "customTestRender";
 
-import NumberInput from '../NumberInput';
+import { NumberInput } from "../NumberInput";
 
 
-describe('<NumberInput/>', () => {
-    it('Render number input', () => {
-        const {container} = render(
+describe("<NumberInput/>", () => {
+    it("Render number input", () => {
+        const { container } = render(
             <NumberInput
                 label="Test label"
                 helpText="Some help text"
@@ -23,6 +23,7 @@ describe('<NumberInput/>', () => {
                 }}
             />
         );
-        expect(container.firstChild).toMatchSnapshot();
+        expect(container.firstChild)
+            .toMatchSnapshot();
     });
 });

src/bootstrap/__tests__/PasswordInput.test.js

@@ -5,15 +5,15 @@
  * See /LICENSE for more information.
  */
 
-import React from 'react';
+import React from "react";
 
-import {render} from 'customTestRender';
+import { render } from "customTestRender";
 
-import PasswordInput from '../PasswordInput';
+import { PasswordInput } from "../PasswordInput";
 
-describe('<PasswordInput/>', () => {
-    it('Render password input', () => {
-        const {container} = render(
+describe("<PasswordInput/>", () => {
+    it("Render password input", () => {
+        const { container } = render(
             <PasswordInput
                 label="Test label"
                 helpText="Some help text"
@@ -22,6 +22,7 @@ describe('<PasswordInput/>', () => {
                 }}
             />
         );
-        expect(container.firstChild).toMatchSnapshot();
+        expect(container.firstChild)
+            .toMatchSnapshot();
     });
 });

src/bootstrap/__tests__/RadioSet.test.js

@@ -5,31 +5,41 @@
  * See /LICENSE for more information.
  */
 
-import React from 'react';
+import React from "react";
 
-import {render} from 'customTestRender';
+import { render } from "customTestRender";
 
-import RadioSet from '../RadioSet';
+import { RadioSet } from "../RadioSet";
 
 const TEST_CHOICES = [
-    {label: 'label', value: 'value'},
-    {label: 'another label', value: 'another value'},
-    {label: 'another one  label', value: 'another on value'}
+    {
+        label: "label",
+        value: "value"
+    },
+    {
+        label: "another label",
+        value: "another value"
+    },
+    {
+        label: "another one  label",
+        value: "another on value"
+    }
 ];
 
-describe('<RadioSet/>', () => {
-    it('Render radio set', () => {
-        const {container} = render(
+describe("<RadioSet/>", () => {
+    it("Render radio set", () => {
+        const { container } = render(
             <RadioSet
-                name={'test_name'}
+                name={"test_name"}
                 label='Radios set label'
                 value='value'
                 choices={TEST_CHOICES}
-                helpText={'Some help text'}
+                helpText={"Some help text"}
                 onChange={() => {
                 }}
             />
         );
-        expect(container.firstChild).toMatchSnapshot();
+        expect(container.firstChild)
+            .toMatchSnapshot();
     });
 });

src/bootstrap/__tests__/Select.test.js

@@ -5,23 +5,23 @@
  * See /LICENSE for more information.
  */
 
-import React from 'react';
+import React from "react";
 
-import {fireEvent, getByDisplayValue, getByText, render} from 'customTestRender';
+import { fireEvent, getByDisplayValue, getByText, render } from "customTestRender";
 
-import Select from '../Select';
+import { Select } from "../Select";
 
 const TEST_CHOICES = {
-    '1': 'one',
-    '2': 'two',
-    '3': 'three',
+    "1": "one",
+    "2": "two",
+    "3": "three",
 };
 
-describe('<Select/>', () => {
+describe("<Select/>", () => {
     var selectContainer;
     const onChangeHandler = jest.fn();
     beforeEach(() => {
-        const {container} = render(
+        const { container } = render(
             <Select
                 label='Test label'
                 value='1'
@@ -34,18 +34,22 @@ describe('<Select/>', () => {
         selectContainer = container;
     });
 
-    it('Test with snapshot.', () => {
-        expect(selectContainer).toMatchSnapshot();
+    it("Test with snapshot.", () => {
+        expect(selectContainer)
+            .toMatchSnapshot();
     });
 
-    it('Test onChange handling.', () => {
-        const select = getByDisplayValue(selectContainer, 'one');
-        expect(select.value).toBe('1');
-        fireEvent.change(select, {target: {value: '2'}});
+    it("Test onChange handling.", () => {
+        const select = getByDisplayValue(selectContainer, "one");
+        expect(select.value)
+            .toBe("1");
+        fireEvent.change(select, { target: { value: "2" } });
 
-        const option = getByText(selectContainer, 'two');
-        expect(onChangeHandler).toBeCalled();
+        const option = getByText(selectContainer, "two");
+        expect(onChangeHandler)
+            .toBeCalled();
 
-        expect(option.value).toBe('2');
-    })
+        expect(option.value)
+            .toBe("2");
+    });
 });

src/bootstrap/__tests__/TextInput.test.js

@@ -5,15 +5,15 @@
  * See /LICENSE for more information.
  */
 
-import React from 'react';
+import React from "react";
 
-import {render} from 'customTestRender';
+import { render } from "customTestRender";
 
-import TextInput from '../TextInput';
+import { TextInput } from "../TextInput";
 
-describe('<TextInput/>', () => {
-    it('Render text input', () => {
-        const {container} = render(
+describe("<TextInput/>", () => {
+    it("Render text input", () => {
+        const { container } = render(
             <TextInput
                 label="Test label"
                 helpText="Some help text"
@@ -22,6 +22,7 @@ describe('<TextInput/>', () => {
                 }}
             />
         );
-        expect(container.firstChild).toMatchSnapshot();
+        expect(container.firstChild)
+            .toMatchSnapshot();
     });
 });

src/form/__tests__/hooks.test.js

@@ -7,9 +7,9 @@
 
 import React from 'react';
 
-import {act, fireEvent, render, waitForElement} from 'customTestRender';
+import { act, fireEvent, render, waitForElement } from 'customTestRender';
 import mockAxios from 'jest-mock-axios';
-import ForisForm from "../components/ForisForm";
+import { ForisForm } from "../components/ForisForm";
 
 
 // It's possible to unittest each hooks via react-hooks-testing-library.

src/form/__tests__/validation.test.js

@@ -10,75 +10,129 @@ import {
     validateDUID,
     validateIPv4Address,
     validateIPv6Address,
-    validateIPv6Prefix, validateMAC
-} from 'validations';
+    validateIPv6Prefix,
+    validateMAC
+} from "validations";
 
-describe('Validation functions', () => {
-    it('validateIPv4Address valid', () => {
-        expect(validateIPv4Address('192.168.1.1')).toBe(undefined);
-        expect(validateIPv4Address('1.1.1.1')).toBe(undefined);
-        expect(validateIPv4Address('0.0.0.0')).toBe(undefined);
+describe("Validation functions", () => {
+    it("validateIPv4Address valid", () => {
+        expect(validateIPv4Address("192.168.1.1"))
+            .toBe(undefined);
+        expect(validateIPv4Address("1.1.1.1"))
+            .toBe(undefined);
+        expect(validateIPv4Address("0.0.0.0"))
+            .toBe(undefined);
     });
-    it('validateIPv4Address invalid', () => {
-        expect(validateIPv4Address('invalid')).not.toBe(undefined);
-        expect(validateIPv4Address('192.256.1.1')).not.toBe(undefined);
-        expect(validateIPv4Address('192.168.256.1')).not.toBe(undefined);
-        expect(validateIPv4Address('192.168.1.256')).not.toBe(undefined);
-        expect(validateIPv4Address('192.168.1.256')).not.toBe(undefined);
+    it("validateIPv4Address invalid", () => {
+        expect(validateIPv4Address("invalid"))
+            .not
+            .toBe(undefined);
+        expect(validateIPv4Address("192.256.1.1"))
+            .not
+            .toBe(undefined);
+        expect(validateIPv4Address("192.168.256.1"))
+            .not
+            .toBe(undefined);
+        expect(validateIPv4Address("192.168.1.256"))
+            .not
+            .toBe(undefined);
+        expect(validateIPv4Address("192.168.1.256"))
+            .not
+            .toBe(undefined);
     });
 
-    it('validateIPv6Address valid', () => {
-        expect(validateIPv6Address('2001:0db8:85a3:0000:0000:8a2e:0370:7334')).toBe(undefined);
-        expect(validateIPv6Address('0:0:0:0:0:0:0:1')).toBe(undefined);
-        expect(validateIPv6Address('::1')).toBe(undefined);
-        expect(validateIPv6Address('::')).toBe(undefined);
+    it("validateIPv6Address valid", () => {
+        expect(validateIPv6Address("2001:0db8:85a3:0000:0000:8a2e:0370:7334"))
+            .toBe(undefined);
+        expect(validateIPv6Address("0:0:0:0:0:0:0:1"))
+            .toBe(undefined);
+        expect(validateIPv6Address("::1"))
+            .toBe(undefined);
+        expect(validateIPv6Address("::"))
+            .toBe(undefined);
 
     });
-    it('validateIPv6Address invalid', () => {
-        expect(validateIPv6Address('invalid')).not.toBe(undefined);
-        expect(validateIPv6Address('1.1.1.1')).not.toBe(undefined);
-        expect(validateIPv6Address('1200::AB00:1234::2552:7777:1313')).not.toBe(undefined);
-        expect(validateIPv6Address('1200:0000:AB00:1234:O000:2552:7777:1313')).not.toBe(undefined);
+    it("validateIPv6Address invalid", () => {
+        expect(validateIPv6Address("invalid"))
+            .not
+            .toBe(undefined);
+        expect(validateIPv6Address("1.1.1.1"))
+            .not
+            .toBe(undefined);
+        expect(validateIPv6Address("1200::AB00:1234::2552:7777:1313"))
+            .not
+            .toBe(undefined);
+        expect(validateIPv6Address("1200:0000:AB00:1234:O000:2552:7777:1313"))
+            .not
+            .toBe(undefined);
     });
 
-    it('validateIPv6Prefix valid', () => {
-        expect(validateIPv6Prefix('2002:0000::/16')).toBe(undefined);
-        expect(validateIPv6Prefix('0::/0')).toBe(undefined);
+    it("validateIPv6Prefix valid", () => {
+        expect(validateIPv6Prefix("2002:0000::/16"))
+            .toBe(undefined);
+        expect(validateIPv6Prefix("0::/0"))
+            .toBe(undefined);
     });
-    it('validateIPv6Prefix invalid', () => {
-        expect(validateIPv6Prefix('2001:0db8:85a3:0000:0000:8a2e:0370:7334')).not.toBe(undefined);
-        expect(validateIPv6Prefix('::1')).not.toBe(undefined);
-        expect(validateIPv6Prefix('2002:0000::/999')).not.toBe(undefined);
+    it("validateIPv6Prefix invalid", () => {
+        expect(validateIPv6Prefix("2001:0db8:85a3:0000:0000:8a2e:0370:7334"))
+            .not
+            .toBe(undefined);
+        expect(validateIPv6Prefix("::1"))
+            .not
+            .toBe(undefined);
+        expect(validateIPv6Prefix("2002:0000::/999"))
+            .not
+            .toBe(undefined);
     });
 
 
-    it('validateDomain valid', () => {
-        expect(validateDomain('example.com')).toBe(undefined);
-        expect(validateDomain('one.two.three')).toBe(undefined);
+    it("validateDomain valid", () => {
+        expect(validateDomain("example.com"))
+            .toBe(undefined);
+        expect(validateDomain("one.two.three"))
+            .toBe(undefined);
     });
-    it('validateDomain invalid', () => {
-        expect(validateDomain('test/')).not.toBe(undefined);
-        expect(validateDomain('.')).not.toBe(undefined);
+    it("validateDomain invalid", () => {
+        expect(validateDomain("test/"))
+            .not
+            .toBe(undefined);
+        expect(validateDomain("."))
+            .not
+            .toBe(undefined);
     });
 
-    it('validateDUID valid', () => {
-        expect(validateDUID('abcdefAB')).toBe(undefined);
-        expect(validateDUID('ABCDEF12')).toBe(undefined);
-        expect(validateDUID('ABCDEF12AB')).toBe(undefined);
+    it("validateDUID valid", () => {
+        expect(validateDUID("abcdefAB"))
+            .toBe(undefined);
+        expect(validateDUID("ABCDEF12"))
+            .toBe(undefined);
+        expect(validateDUID("ABCDEF12AB"))
+            .toBe(undefined);
 
     });
-    it('validateDUID invalid', () => {
-        expect(validateDUID('gggggggg')).not.toBe(undefined);
-        expect(validateDUID('abcdefABa')).not.toBe(undefined);
+    it("validateDUID invalid", () => {
+        expect(validateDUID("gggggggg"))
+            .not
+            .toBe(undefined);
+        expect(validateDUID("abcdefABa"))
+            .not
+            .toBe(undefined);
     });
 
-    it('validateMAC valid', () => {
-        expect(validateMAC('00:D0:56:F2:B5:12')).toBe(undefined);
-        expect(validateMAC('00:26:DD:14:C4:EE')).toBe(undefined);
-        expect(validateMAC('06:00:00:00:00:00')).toBe(undefined);
+    it("validateMAC valid", () => {
+        expect(validateMAC("00:D0:56:F2:B5:12"))
+            .toBe(undefined);
+        expect(validateMAC("00:26:DD:14:C4:EE"))
+            .toBe(undefined);
+        expect(validateMAC("06:00:00:00:00:00"))
+            .toBe(undefined);
     });
-    it('validateMAC invalid', () => {
-        expect(validateMAC('00:00:00:00:00:0G')).not.toBe(undefined);
-        expect(validateMAC('06:00:00:00:00:00:00')).not.toBe(undefined);
+    it("validateMAC invalid", () => {
+        expect(validateMAC("00:00:00:00:00:0G"))
+            .not
+            .toBe(undefined);
+        expect(validateMAC("06:00:00:00:00:00:00"))
+            .not
+            .toBe(undefined);
     });
 });

src/form/components/ForisForm.js

@@ -57,7 +57,7 @@ ForisForm.defaultProps = {
 };
 
 /** Serves as HOC for all foris forms components. */
-export default function ForisForm({
+export function ForisForm({
     ws,
     forisConfig,
     prepData,

src/form/components/SubmitButton.js

@@ -8,7 +8,7 @@
 import React from "react";
 import PropTypes from "prop-types";
 
-import Button from "bootstrap/Button";
+import { Button } from "bootstrap/Button";
 
 export const STATES = {
     READY: 1,
@@ -18,7 +18,8 @@ export const STATES = {
 
 SubmitButton.propTypes = {
     disabled: PropTypes.bool,
-    state: PropTypes.oneOf(Object.keys(STATES).map((key) => STATES[key])),
+    state: PropTypes.oneOf(Object.keys(STATES)
+        .map((key) => STATES[key])),
 };
 
 export function SubmitButton({ disabled, state, ...props }) {

src/form/components/alerts.js

@@ -8,8 +8,8 @@
 import React from "react";
 import PropTypes from "prop-types";
 
-import Alert from "bootstrap/Alert";
-import Portal from "utils/Portal";
+import { Alert } from "bootstrap/Alert";
+import { Portal } from "utils/Portal";
 
 SuccessAlert.propTypes = {
     onDismiss: PropTypes.func.isRequired,

src/form/hooks.js

@@ -9,7 +9,7 @@ import { useCallback, useEffect, useReducer } from "react";
 import update from "immutability-helper";
 
 import { useAPIGet } from "api/hooks";
-import useWSForisModule from "webSockets/hooks";
+import { useWSForisModule } from "webSockets/hooks";
 
 
 const FORM_ACTIONS = {

src/index.js

@@ -1,40 +1,20 @@
-import * as Alert from "bootstrap/Alert";
-import * as Button from "bootstrap/Button";
-import * as CheckBox from "bootstrap/Checkbox";
-import * as formFieldsSize from "bootstrap/constants";
-import * as DataTimeInput from "bootstrap/DataTimeInput";
-import * as EmailInput from "bootstrap/EmailInput";
-import * as Input from "bootstrap/Input";
-import * as NumberInput from "bootstrap/NumberInput";
-import * as PasswordInput from "bootstrap/PasswordInput";
-import * as RadioSet from "bootstrap/RadioSet";
-import * as Select from "bootstrap/Select";
-import * as TextInput from "bootstrap/TextInput";
-
-import * as useWSForisModule from "webSockets/hooks";
-import * as WebSockets from "webSockets/WebSockets";
-import * as Portal from "utils/Portal";
-
-import ForisForm from "form/components/ForisForm";
-
 // API
 export { useAPIGet, useAPIPost } from "./api/hooks";
 
 // Bootstrap
-export {
-    Alert,
-    Button,
-    CheckBox,
-    formFieldsSize,
-    DataTimeInput,
-    EmailInput,
-    Input,
-    NumberInput,
-    PasswordInput,
-    RadioSet,
-    Select,
-    TextInput,
-};
+export { Alert } from "bootstrap/Alert";
+export { Button } from "bootstrap/Button";
+export { CheckBox } from "bootstrap/Checkbox";
+export { formFieldsSize } from "bootstrap/constants";
+export { DataTimeInput } from "bootstrap/DataTimeInput";
+export { EmailInput } from "bootstrap/EmailInput";
+export { Input } from "bootstrap/Input";
+export { NumberInput } from "bootstrap/NumberInput";
+export { PasswordInput } from "bootstrap/PasswordInput";
+export { RadioSet } from "bootstrap/RadioSet";
+export { Select } from "bootstrap/Select";
+export { TextInput } from "bootstrap/TextInput";
+
 export {
     Spinner,
     SpinnerElement,
@@ -48,7 +28,7 @@ export {
 
 
 // Form
-export { ForisForm };
+export { ForisForm } from "form/components/ForisForm";
 export { SubmitButton, STATES as SUBMIT_BUTTON_STATES } from "form/components/SubmitButton";
 export { useForisModule, useForm } from "form/hooks";
 
@@ -57,10 +37,11 @@ export { useForisModule, useForm } from "form/hooks";
 export { mockedWS } from "testUtils/mockWS";
 
 // WebSockets
-export { useWSForisModule, WebSockets };
+export { useWSForisModule } from "webSockets/hooks";
+export { WebSockets } from "webSockets/WebSockets";
 
 // Utils
-export { Portal };
+export { Portal } from "utils/Portal";
 
 // Foris URL
 export { ForisURLs, REFORIS_URL_PREFIX } from "./forisUrls";

src/utils/Portal.js

@@ -7,7 +7,7 @@
 
 import ReactDOM from "react-dom";
 
-export default function Portal({ containerId, children }) {
+export function Portal({ containerId, children }) {
     const container = document.getElementById(containerId);
     if (container) return ReactDOM.createPortal(children, container);
     return null;

src/webSockets/WebSockets.js

@@ -17,7 +17,7 @@ const URL = process.env.LIGHTTPD
 
 const WAITING_FOR_CONNECTION_TIMEOUT = 500;
 
-export default class WebSockets {
+export class WebSockets {
     constructor() {
         this.ws = new WebSocket(URL);
         this.ws.onerror = (e) => {

src/webSockets/hooks.js

@@ -7,7 +7,7 @@
 
 import { useEffect, useState } from "react";
 
-export default function useWSForisModule(ws, module, action = "update_settings") {
+export function useWSForisModule(ws, module, action = "update_settings") {
     const [data, setData] = useState(null);
 
     useEffect(() => {