Merge branch 'bump-version-600' into 'dev'

Bump v6.0.0

See merge request turris/reforis/foris-js!219

jest.config.js

@@ -19,6 +19,7 @@ module.exports = {
     collectCoverageFrom: ["src/**/*.{js,jsx}"],
     coverageDirectory: "coverage",
     testPathIgnorePatterns: ["/node_modules/", "/__fixtures__/", "/dist/"],
+    testEnvironment: "jsdom",
     verbose: false,
     setupFilesAfterEnv: [
         "@testing-library/react/cleanup-after-each",

package.json

@@ -1,6 +1,6 @@
 {
     "name": "foris",
-    "version": "5.6.1",
+    "version": "6.0.0",
     "description": "Foris JS library is a set of components and utils for reForis application and plugins.",
     "author": "CZ.NIC, z.s.p.o.",
     "repository": {
@@ -14,12 +14,12 @@
     "license": "GPL-3.0",
     "main": "./src/index.js",
     "dependencies": {
-        "axios": "^0.21.1",
+        "axios": "^1.7.2",
-        "immutability-helper": "3.0.1",
+        "immutability-helper": "^3.1.1",
-        "moment": "^2.24.0",
+        "moment": "^2.30.1",
-        "qrcode.react": "^1.0.1",
+        "qrcode.react": "^3.1.0",
-        "react-datetime": "^3.1.1",
+        "react-datetime": "^3.2.0",
-        "react-uid": "^2.2.0"
+        "react-uid": "^2.3.3"
     },
     "peerDependencies": {
         "bootstrap": "^5.3.3",
@@ -29,34 +29,35 @@
         "react-router-dom": "^5.1.2"
     },
     "devDependencies": {
-        "@babel/cli": "^7.12.10",
+        "@babel/cli": "^7.24.7",
-        "@babel/core": "^7.9.0",
+        "@babel/core": "^7.24.7",
-        "@babel/plugin-transform-runtime": "^7.9.0",
+        "@babel/plugin-transform-runtime": "^7.24.7",
-        "@babel/preset-env": "^7.9.0",
+        "@babel/preset-env": "^7.24.7",
-        "@babel/preset-react": "^7.9.4",
+        "@babel/preset-react": "^7.24.7",
         "@fortawesome/fontawesome-free": "^6.5.2",
         "@testing-library/react": "^8.0.9",
         "babel-loader": "^8.1.0",
         "babel-polyfill": "^6.26.0",
         "bootstrap": "^5.3.3",
         "css-loader": "^5.2.4",
-        "eslint": "^6.8.0",
+        "eslint": "^8.57.0",
-        "eslint-config-prettier": "^6.11.0",
+        "eslint-config-prettier": "^9.1.0",
-        "eslint-config-reforis": "^1.0.0",
+        "eslint-config-reforis": "^2.1.1",
-        "eslint-plugin-prettier": "^3.1.4",
+        "eslint-plugin-prettier": "^5.1.3",
         "file-loader": "^6.0.0",
-        "jest": "^25.2.0",
+        "jest": "^29.7.0",
-        "jest-mock-axios": "^3.2.0",
+        "jest-environment-jsdom": "^29.7.0",
-        "moment-timezone": "^0.5.34",
+        "jest-mock-axios": "^4.7.3",
-        "prettier": "2.0.5",
+        "moment-timezone": "^0.5.45",
+        "prettier": "^3.3.1",
         "prop-types": "15.8.1",
         "react": "16.9.0",
         "react-dom": "16.9.0",
         "react-router-dom": "^5.1.2",
-        "react-styleguidist": "^11.2.0",
+        "react-styleguidist": "^12.0.1",
-        "snapshot-diff": "^0.7.0",
+        "snapshot-diff": "^0.10.0",
         "style-loader": "^1.2.1",
-        "webpack": "^5.68.0"
+        "webpack": "^5.91.0"
     },
     "scripts": {
         "lint": "eslint src",

src/api/hooks.js

@@ -111,9 +111,7 @@ const useAPIPatch = createAPIHook("PATCH");
 const useAPIPut = createAPIHook("PUT");
 const useAPIDelete = createAPIHook("DELETE");
 
-export { useAPIGet, useAPIPost, useAPIPatch, useAPIPut, useAPIDelete };
+function useAPIPolling(endpoint, until, delay = 1000) {
-
-export function useAPIPolling(endpoint, delay = 1000, until) {
     // delay ms
     const [state, setState] = useState({ state: API_STATE.INIT });
     const [getResponse, get] = useAPIGet(endpoint);
@@ -133,3 +131,12 @@ export function useAPIPolling(endpoint, delay = 1000, until) {
 
     return [state];
 }
+
+export {
+    useAPIGet,
+    useAPIPost,
+    useAPIPatch,
+    useAPIPut,
+    useAPIDelete,
+    useAPIPolling,
+};

src/bootstrap/Alert.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
 export const ALERT_TYPES = Object.freeze({

src/bootstrap/Button.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
 Button.propTypes = {

src/bootstrap/CheckBox.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 import { useUID } from "react-uid";
 

src/bootstrap/CopyInput.js

@@ -6,7 +6,9 @@
  */
 
 import React, { useState, useRef } from "react";
+
 import PropTypes from "prop-types";
+
 import { Input } from "./Input";
 
 CopyInput.propTypes = {

src/bootstrap/DataTimeInput.js

@@ -6,9 +6,10 @@
  */
 
 import React from "react";
+
+import moment from "moment/moment";
 import PropTypes from "prop-types";
 import Datetime from "react-datetime";
-import moment from "moment/moment";
 import "react-datetime/css/react-datetime.css";
 import "./DataTimeInput.css";
 
@@ -46,13 +47,13 @@ export function DataTimeInput({
     children,
     ...props
 }) {
-    function renderInput(datetimeProps) {
+    const renderInput = (datetimeProps) => {
         return (
             <Input {...props} {...datetimeProps}>
                 {children}
             </Input>
         );
-    }
+    };
 
     return (
         <Datetime

src/bootstrap/DownloadButton.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
 DownloadButton.propTypes = {

src/bootstrap/EmailInput.js

@@ -6,11 +6,14 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
 import { Input } from "./Input";
 
-export const EmailInput = ({ ...props }) => <Input type="email" {...props} />;
+export function EmailInput({ ...props }) {
+    return <Input type="email" {...props} />;
+}
 
 EmailInput.propTypes = {
     /** Field label. */

src/bootstrap/FileInput.js

@@ -8,6 +8,7 @@
 import React from "react";
 
 import PropTypes from "prop-types";
+
 import { Input } from "./Input";
 
 FileInput.propTypes = {

src/bootstrap/Input.js

@@ -6,11 +6,12 @@
  */
 
 import React, { forwardRef } from "react";
-import { useUID } from "react-uid";
+
 import PropTypes from "prop-types";
+import { useUID } from "react-uid";
 
 /** Base bootstrap input component. */
-export const Input = forwardRef(
+const Input = forwardRef(
     (
         {
             type,
@@ -73,3 +74,5 @@ Input.propTypes = {
     labelClassName: PropTypes.string,
     groupClassName: PropTypes.string,
 };
+
+export { Input };

src/bootstrap/Modal.js

@@ -6,10 +6,11 @@
  */
 
 import React, { useRef, useEffect } from "react";
+
 import PropTypes from "prop-types";
 
-import { Portal } from "../utils/Portal";
 import { useClickOutside } from "../utils/hooks";
+import { Portal } from "../utils/Portal";
 import "./Modal.css";
 
 Modal.propTypes = {

src/bootstrap/NumberInput.js

@@ -6,10 +6,11 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
-import { useConditionalTimeout } from "../utils/hooks";
 import { Input } from "./Input";
+import { useConditionalTimeout } from "../utils/hooks";
 import "./NumberInput.css";
 
 NumberInput.propTypes = {

src/bootstrap/PasswordInput.js

@@ -6,6 +6,7 @@
  */
 
 import React, { useState } from "react";
+
 import PropTypes from "prop-types";
 
 import { Input } from "./Input";

src/bootstrap/RadioSet.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 import { useUID } from "react-uid";
 
@@ -94,27 +95,25 @@ Radio.propTypes = {
 
 export function Radio({ label, id, helpText, inline, ...props }) {
     return (
-        <>
+        <div
-            <div
+            className={`mb-2 ${
-                className={`mb-2 ${
+                inline ? "form-check form-check-inline" : ""
-                    inline ? "form-check form-check-inline" : ""
+            }`.trim()}
-                }`.trim()}
+        >
-            >
+            <input
-                <input
+                id={id}
-                    id={id}
+                className="form-check-input me-2"
-                    className="form-check-input me-2"
+                type="radio"
-                    type="radio"
+                {...props}
-                    {...props}
+            />
-                />
+            <label className="form-check-label" htmlFor={id}>
-                <label className="form-check-label" htmlFor={id}>
+                {label}
-                    {label}
+                {helpText && (
-                    {helpText && (
+                    <div className="form-text">
-                        <div className="form-text">
+                        <small>{helpText}</small>
-                            <small>{helpText}</small>
+                    </div>
-                        </div>
+                )}
-                    )}
+            </label>
-                </label>
+        </div>
-            </div>
-        </>
     );
 }

src/bootstrap/Select.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 import { useUID } from "react-uid";
 

src/bootstrap/Spinner.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
 import "./Spinner.css";

src/bootstrap/Switch.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 import { useUID } from "react-uid";
 

src/bootstrap/TextInput.js

@@ -6,11 +6,14 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
 import { Input } from "./Input";
 
-export const TextInput = ({ ...props }) => <Input type="text" {...props} />;
+export function TextInput({ ...props }) {
+    return <Input type="text" {...props} />;
+}
 
 TextInput.propTypes = {
     /** Field label. */

src/common/RebootButton.js

@@ -6,15 +6,15 @@
  */
 
 import React, { useState, useEffect } from "react";
+
 import PropTypes from "prop-types";
 
 import { useAPIPost } from "../api/hooks";
 import { API_STATE } from "../api/utils";
-import { ForisURLs } from "../utils/forisUrls";
-
 import { Button } from "../bootstrap/Button";
 import { Modal, ModalHeader, ModalBody, ModalFooter } from "../bootstrap/Modal";
 import { useAlert } from "../context/alertContext/AlertContext";
+import { ForisURLs } from "../utils/forisUrls";
 
 export function RebootButton(props) {
     const [triggered, setTriggered] = useState(false);

src/common/WiFiSettings/ResetWiFiSettings.js

@@ -6,14 +6,15 @@
  */
 
 import React, { useEffect, useState } from "react";
+
 import PropTypes from "prop-types";
 
-import { Button } from "../../bootstrap/Button";
-import { useAlert } from "../../context/alertContext/AlertContext";
-import { ALERT_TYPES } from "../../bootstrap/Alert";
 import { useAPIPost } from "../../api/hooks";
 import { API_STATE } from "../../api/utils";
+import { ALERT_TYPES } from "../../bootstrap/Alert";
+import { Button } from "../../bootstrap/Button";
 import { formFieldsSize } from "../../bootstrap/constants";
+import { useAlert } from "../../context/alertContext/AlertContext";
 
 ResetWiFiSettings.propTypes = {
     ws: PropTypes.object.isRequired,

src/common/WiFiSettings/WiFiForm.js

@@ -6,15 +6,17 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
-import { Switch } from "../../bootstrap/Switch";
+
+import { HELP_TEXTS, HTMODES, HWMODES, ENCRYPTIONMODES } from "./constants";
+import WifiGuestForm from "./WiFiGuestForm";
+import WiFiQRCode from "./WiFiQRCode";
 import { PasswordInput } from "../../bootstrap/PasswordInput";
 import { RadioSet } from "../../bootstrap/RadioSet";
 import { Select } from "../../bootstrap/Select";
+import { Switch } from "../../bootstrap/Switch";
 import { TextInput } from "../../bootstrap/TextInput";
-import WiFiQRCode from "./WiFiQRCode";
-import WifiGuestForm from "./WiFiGuestForm";
-import { HELP_TEXTS, HTMODES, HWMODES, ENCRYPTIONMODES } from "./constants";
 
 WiFiForm.propTypes = {
     formData: PropTypes.shape({ devices: PropTypes.arrayOf(PropTypes.object) })
@@ -267,8 +269,8 @@ function getChannelChoices(device) {
             channelChoices[availableChannel.number.toString()] = `
                         ${availableChannel.number}
                         (${availableChannel.frequency} MHz ${
-                availableChannel.radar ? " ,DFS" : ""
+                            availableChannel.radar ? " ,DFS" : ""
-            })
+                        })
                     `;
         });
     });

src/common/WiFiSettings/WiFiGuestForm.js

@@ -6,13 +6,14 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
-import { TextInput } from "../../bootstrap/TextInput";
-import { Switch } from "../../bootstrap/Switch";
-import { PasswordInput } from "../../bootstrap/PasswordInput";
-import WiFiQRCode from "./WiFiQRCode";
 import { HELP_TEXTS } from "./constants";
+import WiFiQRCode from "./WiFiQRCode";
+import { PasswordInput } from "../../bootstrap/PasswordInput";
+import { Switch } from "../../bootstrap/Switch";
+import { TextInput } from "../../bootstrap/TextInput";
 
 WifiGuestForm.propTypes = {
     formData: PropTypes.shape({

src/common/WiFiSettings/WiFiQRCode.js

@@ -6,10 +6,11 @@
  */
 
 import React, { useState } from "react";
-import QRCode from "qrcode.react";
-import PropTypes from "prop-types";
 
-import { ForisURLs } from "../../utils/forisUrls";
+import PropTypes from "prop-types";
+import QRCode from "qrcode.react";
+
+import { createAndDownloadPdf, toQRCodeContent } from "./qrCodeHelpers";
 import { Button } from "../../bootstrap/Button";
 import {
     Modal,
@@ -17,7 +18,7 @@ import {
     ModalFooter,
     ModalHeader,
 } from "../../bootstrap/Modal";
-import { createAndDownloadPdf, toQRCodeContent } from "./qrCodeHelpers";
+import { ForisURLs } from "../../utils/forisUrls";
 
 WiFiQRCode.propTypes = {
     SSID: PropTypes.string.isRequired,

src/common/WiFiSettings/WiFiSettings.js

@@ -6,11 +6,12 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
-import { ForisForm } from "../../form/components/ForisForm";
-import WiFiForm from "./WiFiForm";
 import { ResetWiFiSettings } from "./ResetWiFiSettings";
+import WiFiForm from "./WiFiForm";
+import { ForisForm } from "../../form/components/ForisForm";
 
 WiFiSettings.propTypes = {
     ws: PropTypes.object.isRequired,

src/common/WiFiSettings/__tests__/__snapshots__/WiFiSettings.test.js.snap

@@ -6,13 +6,13 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 + Second value
 
 @@ -243,207 +243,95 @@
-              value=\\"0\\"
+              value="0"
             >
               auto
             </option>
             <option
--             value=\\"36\\"
+-             value="36"
-+             value=\\"1\\"
++             value="1"
             >
               
 -                         36
@@ -22,8 +22,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"40\\"
+-             value="40"
-+             value=\\"2\\"
++             value="2"
             >
               
 -                         40
@@ -33,8 +33,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"44\\"
+-             value="44"
-+             value=\\"3\\"
++             value="3"
             >
               
 -                         44
@@ -44,7 +44,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"48\\"
+-             value="48"
 -           >
 -             
 -                         48
@@ -52,7 +52,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"52\\"
+-             value="52"
 -           >
 -             
 -                         52
@@ -60,7 +60,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"56\\"
+-             value="56"
 -           >
 -             
 -                         56
@@ -68,8 +68,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"60\\"
+-             value="60"
-+             value=\\"4\\"
++             value="4"
             >
               
 -                         60
@@ -79,8 +79,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"64\\"
+-             value="64"
-+             value=\\"5\\"
++             value="5"
             >
               
 -                         64
@@ -90,8 +90,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"100\\"
+-             value="100"
-+             value=\\"6\\"
++             value="6"
             >
               
 -                         100
@@ -101,8 +101,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"104\\"
+-             value="104"
-+             value=\\"7\\"
++             value="7"
             >
               
 -                         104
@@ -112,8 +112,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"108\\"
+-             value="108"
-+             value=\\"8\\"
++             value="8"
             >
               
 -                         108
@@ -123,8 +123,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"112\\"
+-             value="112"
-+             value=\\"9\\"
++             value="9"
             >
               
 -                         112
@@ -134,8 +134,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"116\\"
+-             value="116"
-+             value=\\"10\\"
++             value="10"
             >
               
 -                         116
@@ -145,8 +145,8 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
                       
             </option>
             <option
--             value=\\"120\\"
+-             value="120"
-+             value=\\"11\\"
++             value="11"
             >
               
 -                         120
@@ -154,7 +154,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"124\\"
+-             value="124"
 -           >
 -             
 -                         124
@@ -162,7 +162,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"128\\"
+-             value="128"
 -           >
 -             
 -                         128
@@ -170,7 +170,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"132\\"
+-             value="132"
 -           >
 -             
 -                         132
@@ -178,7 +178,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"136\\"
+-             value="136"
 -           >
 -             
 -                         136
@@ -186,7 +186,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"140\\"
+-             value="140"
 -           >
 -             
 -                         140
@@ -194,7 +194,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"144\\"
+-             value="144"
 -           >
 -             
 -                         144
@@ -202,7 +202,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"149\\"
+-             value="149"
 -           >
 -             
 -                         149
@@ -210,7 +210,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"153\\"
+-             value="153"
 -           >
 -             
 -                         153
@@ -218,7 +218,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"157\\"
+-             value="157"
 -           >
 -             
 -                         157
@@ -226,7 +226,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"161\\"
+-             value="161"
 -           >
 -             
 -                         161
@@ -234,7 +234,7 @@ exports[`<WiFiSettings/> Snapshot 2.4 GHz 1`] = `
 -                     
 -           </option>
 -           <option
--             value=\\"165\\"
+-             value="165"
 -           >
 -             
 -                         165
@@ -346,41 +346,41 @@ exports[`<WiFiSettings/> Snapshot guest network. 1`] = `
           </div>
         </div>
 +       <div
-+         class=\\"mb-3\\"
++         class="mb-3"
 +       >
 +         <label
-+           class=\\"form-label\\"
++           class="form-label"
-+           for=\\"24\\"
++           for="12"
 +         >
 +           SSID
 +         </label>
 +         <div
-+           class=\\"input-group\\"
++           class="input-group"
 +         >
 +           <input
-+             class=\\"form-control\\"
++             class="form-control"
-+             id=\\"24\\"
++             id="12"
-+             type=\\"text\\"
++             type="text"
-+             value=\\"TestGuestSSID\\"
++             value="TestGuestSSID"
 +           />
 +           <div
-+             class=\\"input-group-append\\"
++             class="input-group-append"
 +           >
 +             <button
-+               class=\\"input-group-text\\"
++               class="input-group-text"
-+               type=\\"button\\"
++               type="button"
 +             >
 +               <img
-+                 alt=\\"QR\\"
++                 alt="QR"
-+                 src=\\"/reforis/static/reforis/imgs/QR_icon.svg\\"
++                 src="/reforis/static/reforis/imgs/QR_icon.svg"
-+                 style=\\"opacity: 0.67;\\"
++                 style="opacity: 0.67;"
-+                 width=\\"20\\"
++                 width="20"
 +               />
 +             </button>
 +           </div>
 +         </div>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             SSID which contains non-standard characters could cause problems on some devices.
@@ -388,41 +388,41 @@ exports[`<WiFiSettings/> Snapshot guest network. 1`] = `
 +         </div>
 +       </div>
 +       <div
-+         class=\\"mb-3\\"
++         class="mb-3"
 +       >
 +         <label
-+           class=\\"form-label\\"
++           class="form-label"
-+           for=\\"25\\"
++           for="13"
 +         >
 +           Password
 +         </label>
 +         <div
-+           class=\\"input-group\\"
++           class="input-group"
 +         >
 +           <input
-+             autocomplete=\\"current-password\\"
++             autocomplete="current-password"
-+             class=\\"form-control is-invalid\\"
++             class="form-control is-invalid"
-+             id=\\"25\\"
++             id="13"
-+             required=\\"\\"
++             required=""
-+             type=\\"password\\"
++             type="password"
-+             value=\\"\\"
++             value=""
 +           />
 +           <button
-+             class=\\"input-group-text\\"
++             class="input-group-text"
-+             type=\\"button\\"
++             type="button"
 +           >
 +             <i
-+               class=\\"fa fa-eye\\"
++               class="fa fa-eye"
 +             />
 +           </button>
 +         </div>
 +         <div
-+           class=\\"invalid-feedback\\"
++           class="invalid-feedback"
 +         >
 +           Password must contain at least 8 symbols
 +         </div>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             WPA2/3 pre-shared key, that is required to connect to the network.
@@ -431,17 +431,17 @@ exports[`<WiFiSettings/> Snapshot guest network. 1`] = `
 +       </div>
         <hr />
         <div
-          class=\\"form-check form-switch mb-3 d-flex align-items-center\\"
+          class="form-check form-switch mb-3 d-flex align-items-center"
         >
           <input
 @@ -553,10 +637,11 @@
         <div
-          class=\\"text-end\\"
+          class="text-end"
         >
           <button
-            class=\\"btn btn-primary col-12 col-md-3 col-lg-2 d-inline-flex justify-content-center align-items-center\\"
+            class="btn btn-primary col-12 col-md-3 col-lg-2 d-inline-flex justify-content-center align-items-center"
-+           disabled=\\"\\"
++           disabled=""
-            type=\\"submit\\"
+            type="submit"
           >
             <span>
               Save
@@ -460,38 +460,38 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
           </label>
         </div>
 +       <div
-+         class=\\"mb-3\\"
++         class="mb-3"
 +       >
 +         <label
-+           class=\\"form-label\\"
++           class="form-label"
-+           for=\\"4\\"
++           for="3"
 +         >
 +           SSID
 +         </label>
 +         <div
-+           class=\\"input-group\\"
++           class="input-group"
 +         >
 +           <input
-+             class=\\"form-control\\"
++             class="form-control"
-+             id=\\"4\\"
++             id="3"
-+             required=\\"\\"
++             required=""
-+             type=\\"text\\"
++             type="text"
-+             value=\\"TestSSID1\\"
++             value="TestSSID1"
 +           />
 +           <button
-+             class=\\"input-group-text\\"
++             class="input-group-text"
-+             type=\\"button\\"
++             type="button"
 +           >
 +             <img
-+               alt=\\"QR\\"
++               alt="QR"
-+               src=\\"/reforis/static/reforis/imgs/QR_icon.svg\\"
++               src="/reforis/static/reforis/imgs/QR_icon.svg"
-+               style=\\"opacity: 0.67;\\"
++               style="opacity: 0.67;"
-+               width=\\"20\\"
++               width="20"
 +             />
 +           </button>
 +         </div>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             SSID which contains non-standard characters could cause problems on some devices.
@@ -499,36 +499,36 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +         </div>
 +       </div>
 +       <div
-+         class=\\"mb-3\\"
++         class="mb-3"
 +       >
 +         <label
-+           class=\\"form-label\\"
++           class="form-label"
-+           for=\\"5\\"
++           for="4"
 +         >
 +           Password
 +         </label>
 +         <div
-+           class=\\"input-group\\"
++           class="input-group"
 +         >
 +           <input
-+             autocomplete=\\"current-password\\"
++             autocomplete="current-password"
-+             class=\\"form-control\\"
++             class="form-control"
-+             id=\\"5\\"
++             id="4"
-+             required=\\"\\"
++             required=""
-+             type=\\"password\\"
++             type="password"
-+             value=\\"TestPass\\"
++             value="TestPass"
 +           />
 +           <button
-+             class=\\"input-group-text\\"
++             class="input-group-text"
-+             type=\\"button\\"
++             type="button"
 +           >
 +             <i
-+               class=\\"fa fa-eye\\"
++               class="fa fa-eye"
 +             />
 +           </button>
 +         </div>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             WPA2/3 pre-shared key, that is required to connect to the network.
@@ -536,22 +536,22 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +         </div>
 +       </div>
 +       <div
-+         class=\\"form-check form-switch mb-3 null\\"
++         class="form-check form-switch mb-3 null"
 +       >
 +         <input
-+           class=\\"form-check-input\\"
++           class="form-check-input"
-+           id=\\"6\\"
++           id="5"
-+           role=\\"switch\\"
++           role="switch"
-+           type=\\"checkbox\\"
++           type="checkbox"
 +         />
 +         <label
-+           class=\\"form-check-label\\"
++           class="form-check-label"
-+           for=\\"6\\"
++           for="5"
 +         >
 +           Hide SSID
 +         </label>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             If set, network is not visible when scanning for available networks.
@@ -559,51 +559,51 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +         </div>
 +       </div>
 +       <div
-+         class=\\"mb-3\\"
++         class="mb-3"
 +       >
 +         <label
-+           class=\\"d-block\\"
++           class="d-block"
-+           for=\\"7\\"
++           for="6"
 +         >
 +           GHz
 +         </label>
 +         <div
-+           class=\\"mb-2 form-check form-check-inline\\"
++           class="mb-2 form-check form-check-inline"
 +         >
 +           <input
-+             class=\\"form-check-input me-2\\"
++             class="form-check-input me-2"
-+             id=\\"hwmode-0-0\\"
++             id="hwmode-0-0"
-+             name=\\"hwmode-0\\"
++             name="hwmode-0"
-+             type=\\"radio\\"
++             type="radio"
-+             value=\\"11g\\"
++             value="11g"
 +           />
 +           <label
-+             class=\\"form-check-label\\"
++             class="form-check-label"
-+             for=\\"hwmode-0-0\\"
++             for="hwmode-0-0"
 +           >
 +             2.4
 +           </label>
 +         </div>
 +         <div
-+           class=\\"mb-2 form-check form-check-inline\\"
++           class="mb-2 form-check form-check-inline"
 +         >
 +           <input
-+             checked=\\"\\"
++             checked=""
-+             class=\\"form-check-input me-2\\"
++             class="form-check-input me-2"
-+             id=\\"hwmode-0-1\\"
++             id="hwmode-0-1"
-+             name=\\"hwmode-0\\"
++             name="hwmode-0"
-+             type=\\"radio\\"
++             type="radio"
-+             value=\\"11a\\"
++             value="11a"
 +           />
 +           <label
-+             class=\\"form-check-label\\"
++             class="form-check-label"
-+             for=\\"hwmode-0-1\\"
++             for="hwmode-0-1"
 +           >
 +             5
 +           </label>
 +         </div>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             The 2.4 GHz band is more widely supported by clients, but tends to have more interference. The 5 GHz band is a newer standard and may not be supported by all your devices. It usually has less interference, but the signal does not carry so well indoors.
@@ -611,51 +611,51 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +         </div>
 +       </div>
 +       <div
-+         class=\\"mb-3\\"
++         class="mb-3"
 +       >
 +         <label
-+           class=\\"form-label\\"
++           class="form-label"
-+           for=\\"8\\"
++           for="7"
 +         >
 +           802.11n/ac/ax mode
 +         </label>
 +         <select
-+           class=\\"form-select\\"
++           class="form-select"
-+           id=\\"8\\"
++           id="7"
 +         >
 +           <option
-+             value=\\"NOHT\\"
++             value="NOHT"
 +           >
 +             Disabled
 +           </option>
 +           <option
-+             value=\\"HT20\\"
++             value="HT20"
 +           >
 +             802.11n - 20 MHz wide channel
 +           </option>
 +           <option
-+             value=\\"HT40\\"
++             value="HT40"
 +           >
 +             802.11n - 40 MHz wide channel
 +           </option>
 +           <option
-+             value=\\"VHT20\\"
++             value="VHT20"
 +           >
 +             802.11ac - 20 MHz wide channel
 +           </option>
 +           <option
-+             value=\\"VHT40\\"
++             value="VHT40"
 +           >
 +             802.11ac - 40 MHz wide channel
 +           </option>
 +           <option
-+             value=\\"VHT80\\"
++             value="VHT80"
 +           >
 +             802.11ac - 80 MHz wide channel
 +           </option>
 +         </select>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             Change this to adjust 802.11n/ac/ax mode of operation. 802.11n with 40 MHz wide channels can yield higher throughput but can cause more interference in the network. If you don't know what to choose, use the default option with 20 MHz wide channel.
@@ -663,25 +663,25 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +         </div>
 +       </div>
 +       <div
-+         class=\\"mb-3\\"
++         class="mb-3"
 +       >
 +         <label
-+           class=\\"form-label\\"
++           class="form-label"
-+           for=\\"9\\"
++           for="8"
 +         >
 +           Channel
 +         </label>
 +         <select
-+           class=\\"form-select\\"
++           class="form-select"
-+           id=\\"9\\"
++           id="8"
 +         >
 +           <option
-+             value=\\"0\\"
++             value="0"
 +           >
 +             auto
 +           </option>
 +           <option
-+             value=\\"36\\"
++             value="36"
 +           >
 +             
 +                         36
@@ -689,7 +689,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"40\\"
++             value="40"
 +           >
 +             
 +                         40
@@ -697,7 +697,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"44\\"
++             value="44"
 +           >
 +             
 +                         44
@@ -705,7 +705,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"48\\"
++             value="48"
 +           >
 +             
 +                         48
@@ -713,7 +713,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"52\\"
++             value="52"
 +           >
 +             
 +                         52
@@ -721,7 +721,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"56\\"
++             value="56"
 +           >
 +             
 +                         56
@@ -729,7 +729,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"60\\"
++             value="60"
 +           >
 +             
 +                         60
@@ -737,7 +737,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"64\\"
++             value="64"
 +           >
 +             
 +                         64
@@ -745,7 +745,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"100\\"
++             value="100"
 +           >
 +             
 +                         100
@@ -753,7 +753,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"104\\"
++             value="104"
 +           >
 +             
 +                         104
@@ -761,7 +761,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"108\\"
++             value="108"
 +           >
 +             
 +                         108
@@ -769,7 +769,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"112\\"
++             value="112"
 +           >
 +             
 +                         112
@@ -777,7 +777,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"116\\"
++             value="116"
 +           >
 +             
 +                         116
@@ -785,7 +785,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"120\\"
++             value="120"
 +           >
 +             
 +                         120
@@ -793,7 +793,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"124\\"
++             value="124"
 +           >
 +             
 +                         124
@@ -801,7 +801,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"128\\"
++             value="128"
 +           >
 +             
 +                         128
@@ -809,7 +809,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"132\\"
++             value="132"
 +           >
 +             
 +                         132
@@ -817,7 +817,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"136\\"
++             value="136"
 +           >
 +             
 +                         136
@@ -825,7 +825,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"140\\"
++             value="140"
 +           >
 +             
 +                         140
@@ -833,7 +833,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"144\\"
++             value="144"
 +           >
 +             
 +                         144
@@ -841,7 +841,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"149\\"
++             value="149"
 +           >
 +             
 +                         149
@@ -849,7 +849,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"153\\"
++             value="153"
 +           >
 +             
 +                         153
@@ -857,7 +857,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"157\\"
++             value="157"
 +           >
 +             
 +                         157
@@ -865,7 +865,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"161\\"
++             value="161"
 +           >
 +             
 +                         161
@@ -873,7 +873,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +                     
 +           </option>
 +           <option
-+             value=\\"165\\"
++             value="165"
 +           >
 +             
 +                         165
@@ -883,36 +883,36 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +         </select>
 +       </div>
 +       <div
-+         class=\\"mb-3\\"
++         class="mb-3"
 +       >
 +         <label
-+           class=\\"form-label\\"
++           class="form-label"
-+           for=\\"10\\"
++           for="9"
 +         >
 +           Encryption
 +         </label>
 +         <select
-+           class=\\"form-select\\"
++           class="form-select"
-+           id=\\"10\\"
++           id="9"
 +         >
 +           <option
-+             value=\\"WPA3\\"
++             value="WPA3"
 +           >
 +             WPA3 only
 +           </option>
 +           <option
-+             value=\\"WPA2/3\\"
++             value="WPA2/3"
 +           >
 +             WPA3 with WPA2 as fallback (default)
 +           </option>
 +           <option
-+             value=\\"WPA2\\"
++             value="WPA2"
 +           >
 +             WPA2 only
 +           </option>
 +         </select>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             The WPA3 standard is the new most secure encryption method that is suggested to be used with any device that supports it. The older devices without WPA3 support require older WPA2. If you experience issues with connecting older devices, try to enable WPA2.
@@ -920,22 +920,22 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +         </div>
 +       </div>
 +       <div
-+         class=\\"form-check form-switch mb-3 null\\"
++         class="form-check form-switch mb-3 null"
 +       >
 +         <input
-+           class=\\"form-check-input\\"
++           class="form-check-input"
-+           id=\\"11\\"
++           id="10"
-+           role=\\"switch\\"
++           role="switch"
-+           type=\\"checkbox\\"
++           type="checkbox"
 +         />
 +         <label
-+           class=\\"form-check-label\\"
++           class="form-check-label"
-+           for=\\"11\\"
++           for="10"
 +         >
 +           Disable Management Frame Protection
 +         </label>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             In case you have trouble connecting to WiFi Access Point, try disabling Management Frame Protection.
@@ -943,22 +943,22 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +         </div>
 +       </div>
 +       <div
-+         class=\\"form-check form-switch mb-3 null\\"
++         class="form-check form-switch mb-3 null"
 +       >
 +         <input
-+           class=\\"form-check-input\\"
++           class="form-check-input"
-+           id=\\"12\\"
++           id="11"
-+           role=\\"switch\\"
++           role="switch"
-+           type=\\"checkbox\\"
++           type="checkbox"
 +         />
 +         <label
-+           class=\\"form-check-label\\"
++           class="form-check-label"
-+           for=\\"12\\"
++           for="11"
 +         >
 +           Enable Guest Wi-Fi
 +         </label>
 +         <div
-+           class=\\"form-text\\"
++           class="form-text"
 +         >
 +           <small>
 +             Enables Wi-Fi for guests, which is separated from LAN network. Devices connected to this network are allowed to access the internet, but aren't allowed to access other devices and the configuration interface of the router. Parameters of the guest network can be set in the Guest network tab.
@@ -967,7 +967,7 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +       </div>
         <hr />
         <div
-          class=\\"form-check form-switch mb-3 d-flex align-items-center\\"
+          class="form-check form-switch mb-3 d-flex align-items-center"
         >
           <input"
 `;

src/context/alertContext/AlertContext.js

@@ -6,6 +6,7 @@
  */
 
 import React, { useState, useContext, useCallback } from "react";
+
 import PropTypes from "prop-types";
 
 import { Alert, ALERT_TYPES } from "../../bootstrap/Alert";

src/context/customizationContext/CustomizationContext.js

@@ -6,12 +6,12 @@
  */
 
 import React, { useContext, useEffect } from "react";
+
 import PropTypes from "prop-types";
 
 import { useAPIGet } from "../../api/hooks";
-import { ForisURLs } from "../../utils/forisUrls";
-
 import { Spinner } from "../../bootstrap/Spinner";
+import { ForisURLs } from "../../utils/forisUrls";
 
 CustomizationContextProvider.propTypes = {
     children: PropTypes.oneOfType([

src/form/components/ForisForm.js

@@ -6,19 +6,19 @@
  */
 
 import React, { useEffect } from "react";
+
 import PropTypes from "prop-types";
 import { Prompt } from "react-router-dom";
 
-import { ALERT_TYPES } from "../../bootstrap/Alert";
+import { STATES as SUBMIT_BUTTON_STATES, SubmitButton } from "./SubmitButton";
+import { useAPIPost } from "../../api/hooks";
 import { API_STATE } from "../../api/utils";
+import { ALERT_TYPES } from "../../bootstrap/Alert";
 import { formFieldsSize } from "../../bootstrap/constants";
 import { Spinner } from "../../bootstrap/Spinner";
 import { useAlert } from "../../context/alertContext/AlertContext";
-import { useAPIPost } from "../../api/hooks";
-
-import { useForisModule, useForm } from "../hooks";
-import { STATES as SUBMIT_BUTTON_STATES, SubmitButton } from "./SubmitButton";
 import { ErrorMessage } from "../../utils/ErrorMessage";
+import { useForisModule, useForm } from "../hooks";
 
 ForisForm.propTypes = {
     /** Optional WebSocket object. See `scr/common/WebSockets.js`.

src/form/components/SubmitButton.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
 import { Button } from "../../bootstrap/Button";

src/form/hooks.js

@@ -6,6 +6,7 @@
  */
 
 import { useCallback, useEffect, useReducer } from "react";
+
 import update from "immutability-helper";
 
 import { useAPIGet } from "../api/hooks";

src/utils/ErrorMessage.js

@@ -6,6 +6,7 @@
  */
 
 import React from "react";
+
 import PropTypes from "prop-types";
 
 ErrorMessage.propTypes = {

src/utils/conditionalHOCs.js

@@ -7,17 +7,18 @@
 
 import React from "react";
 
-import { Spinner } from "../bootstrap/Spinner";
-import { API_STATE } from "../api/utils";
 import { ErrorMessage } from "./ErrorMessage";
+import { API_STATE } from "../api/utils";
+import { Spinner } from "../bootstrap/Spinner";
 
 function withEither(conditionalFn, Either) {
-    return (Component) => (props) => {
+    return (Component) =>
-        if (conditionalFn(props)) {
+        function (props) {
-            return <Either {...props} />;
+            if (conditionalFn(props)) {
-        }
+                return <Either {...props} />;
-        return <Component {...props} />;
+            }
-    };
+            return <Component {...props} />;
+        };
 }
 
 // Loading

src/utils/validations.js

@@ -23,12 +23,15 @@ export const ERROR_MESSAGES = {
 const REs = {
     IPv4: /^((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/,
     IPv6: /^(([0-9a-fA-F]{1,4}:){7,7}[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,7}:|([0-9a-fA-F]{1,4}:){1,6}:[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,5}(:[0-9a-fA-F]{1,4}){1,2}|([0-9a-fA-F]{1,4}:){1,4}(:[0-9a-fA-F]{1,4}){1,3}|([0-9a-fA-F]{1,4}:){1,3}(:[0-9a-fA-F]{1,4}){1,4}|([0-9a-fA-F]{1,4}:){1,2}(:[0-9a-fA-F]{1,4}){1,5}|[0-9a-fA-F]{1,4}:((:[0-9a-fA-F]{1,4}){1,6})|:((:[0-9a-fA-F]{1,4}){1,7}|:)|fe80:(:[0-9a-fA-F]{0,4}){0,4}%[0-9a-zA-Z]{1,}|::(ffff(:0{1,4}){0,1}:){0,1}((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])|([0-9a-fA-F]{1,4}:){1,4}:((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9]))$/,
-    IPv6Prefix: /^s*((([0-9A-Fa-f]{1,4}:){7}([0-9A-Fa-f]{1,4}|:))|(([0-9A-Fa-f]{1,4}:){6}(:[0-9A-Fa-f]{1,4}|((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3})|:))|(([0-9A-Fa-f]{1,4}:){5}(((:[0-9A-Fa-f]{1,4}){1,2})|:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3})|:))|(([0-9A-Fa-f]{1,4}:){4}(((:[0-9A-Fa-f]{1,4}){1,3})|((:[0-9A-Fa-f]{1,4})?:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){3}(((:[0-9A-Fa-f]{1,4}){1,4})|((:[0-9A-Fa-f]{1,4}){0,2}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){2}(((:[0-9A-Fa-f]{1,4}){1,5})|((:[0-9A-Fa-f]{1,4}){0,3}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){1}(((:[0-9A-Fa-f]{1,4}){1,6})|((:[0-9A-Fa-f]{1,4}){0,4}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(:(((:[0-9A-Fa-f]{1,4}){1,7})|((:[0-9A-Fa-f]{1,4}){0,5}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:)))(%.+)?s*(\/([0-9]|[1-9][0-9]|1[0-1][0-9]|12[0-8]))$/,
+    IPv6Prefix:
+        /^s*((([0-9A-Fa-f]{1,4}:){7}([0-9A-Fa-f]{1,4}|:))|(([0-9A-Fa-f]{1,4}:){6}(:[0-9A-Fa-f]{1,4}|((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3})|:))|(([0-9A-Fa-f]{1,4}:){5}(((:[0-9A-Fa-f]{1,4}){1,2})|:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3})|:))|(([0-9A-Fa-f]{1,4}:){4}(((:[0-9A-Fa-f]{1,4}){1,3})|((:[0-9A-Fa-f]{1,4})?:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){3}(((:[0-9A-Fa-f]{1,4}){1,4})|((:[0-9A-Fa-f]{1,4}){0,2}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){2}(((:[0-9A-Fa-f]{1,4}){1,5})|((:[0-9A-Fa-f]{1,4}){0,3}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){1}(((:[0-9A-Fa-f]{1,4}){1,6})|((:[0-9A-Fa-f]{1,4}){0,4}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:))|(:(((:[0-9A-Fa-f]{1,4}){1,7})|((:[0-9A-Fa-f]{1,4}){0,5}:((25[0-5]|2[0-4]d|1dd|[1-9]?d)(.(25[0-5]|2[0-4]d|1dd|[1-9]?d)){3}))|:)))(%.+)?s*(\/([0-9]|[1-9][0-9]|1[0-1][0-9]|12[0-8]))$/,
     domain: /^([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{2,}$/,
-    hostname: /^[a-z\d]([a-z\d-]{0,61}[a-z\d])?(\.[a-z\d]([a-z\d-]{0,61}[a-z\d])?)*$/i,
+    hostname:
+        /^[a-z\d]([a-z\d-]{0,61}[a-z\d])?(\.[a-z\d]([a-z\d-]{0,61}[a-z\d])?)*$/i,
     DUID: /^([0-9a-fA-F]{2}){4}([0-9a-fA-F]{2})*$/,
     MAC: /^([a-fA-F0-9]{2}:){5}[a-fA-F0-9]{2}$/,
-    MultipleEmails: /^([a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+ *)( *, *[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+ *)*$/,
+    MultipleEmails:
+        /^([a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+ *)( *, *[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+ *)*$/,
 };
 
 const createValidator = (fieldType) => (value) => {

styleguide.config.js

@@ -105,8 +105,5 @@ module.exports = {
                 },
             ],
         },
-        devServer: {
-            publicPath: "/",
-        },
     },
 };