@onewelcome/react-lib-components 8.12.0 → 8.12.2

package/dist/esm/src/components/admin/layout/LeftNav/LeftNav.d.ts

@@ -4,7 +4,7 @@ export interface Props extends ComponentPropsWithRef<"nav"> {
     isSideMenuOpen?: boolean;
     items: MenuItem[];
     navigate: (path: string) => void;
-    onItemClick: (path?: string, button?: boolean) => void;
+    onItemClick?: (path?: string, button?: boolean) => void;
     marginTop?: string;
 }
 export declare const LeftNav: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLElement>>;

package/dist/esm/src/components/admin/layout/LeftNav/LeftNavItem/ButtonLeftNavItem.d.ts

@@ -5,7 +5,7 @@ import { LeftNavItemProps } from "./LeftNavItem.interface";
 export interface Props extends HTMLProps<HTMLElement> {
     item: MenuItem;
     navigate: (path: string) => void;
-    onItemClick: (path?: string, button?: boolean) => void;
+    onItemClick?: (path?: string, button?: boolean) => void;
     refItems: UseRefItemsReturnType;
     NestedComponent: ForwardRefExoticComponent<LeftNavItemProps>;
     closeParentList?: () => void;

package/dist/esm/src/components/admin/layout/LeftNav/LeftNavItem/LeftNavItem.interface.d.ts

@@ -4,7 +4,7 @@ import { UseRefItemsReturnType } from "../useRefItems";
 export interface LeftNavItemProps extends HTMLProps<HTMLElement> {
     item: MenuItem;
     navigate: (path: string) => void;
-    onItemClick: (path?: string, button?: boolean) => void;
+    onItemClick?: (path?: string, button?: boolean) => void;
     refItems: UseRefItemsReturnType;
     closeParentList?: () => void;
 }

package/dist/esm/src/components/admin/layout/LeftNav/LeftNavItem/LinkLeftNavItem.d.ts

@@ -3,7 +3,8 @@ import { MenuItem } from "../LeftNav.interfaces";
 import { UseRefItemsReturnType } from "../useRefItems";
 export interface Props extends HTMLProps<HTMLElement> {
     item: MenuItem;
-    onItemClick: (path?: string, button?: boolean) => void;
+    navigate: (path: string) => void;
+    onItemClick?: (path?: string, button?: boolean) => void;
     refItems: UseRefItemsReturnType;
     closeParentList?: () => void;
 }

package/dist/esm/src/hooks/useDebouncedCallback.esm.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import React from 'react';
 
 /*
  * Copyright 2022 OneWelcome B.V.
@@ -17,10 +17,10 @@ import React__default from 'react';
  */
 /* eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types */
 const useDebouncedCallback = (callback, delay, dependencies) => {
-    const timeout = React__default.useRef();
+    const timeout = React.useRef();
     const comboDeps = dependencies ? [callback, delay, ...dependencies] : [callback, delay];
     /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
-    return React__default.useCallback((...args) => {
+    return React.useCallback((...args) => {
         if (timeout.current != null) {
             clearTimeout(timeout.current);
         }

package/dist/esm/src/hooks/useDebouncedCallback.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDebouncedCallback.esm.js","sources":["../../../../../../src/hooks/useDebouncedCallback.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React from \"react\";\n\n/* eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types */\nexport const useDebouncedCallback = (callback: Function, delay: number, dependencies?: any[]) => {\n  const timeout = React.useRef<ReturnType<typeof setTimeout>>();\n  const comboDeps = dependencies ? [callback, delay, ...dependencies] : [callback, delay];\n\n  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n  return React.useCallback((...args: any[]) => {\n    if (timeout.current != null) {\n      clearTimeout(timeout.current);\n    }\n\n    timeout.current = setTimeout(() => {\n      callback(...args);\n    }, delay);\n  }, comboDeps);\n};\n"],"names":["React"],"mappings":";;AAAA;;;;;;;;;;;;;;AAcG;AAIH;AACa,MAAA,oBAAoB,GAAG,CAAC,QAAkB,EAAE,KAAa,EAAE,YAAoB,KAAI;AAC9F,IAAA,MAAM,OAAO,GAAGA,cAAK,CAAC,MAAM,EAAiC,CAAC;IAC9D,MAAM,SAAS,GAAG,YAAY,GAAG,CAAC,QAAQ,EAAE,KAAK,EAAE,GAAG,YAAY,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;;IAGxF,OAAOA,cAAK,CAAC,WAAW,CAAC,CAAC,GAAG,IAAW,KAAI;AAC1C,QAAA,IAAI,OAAO,CAAC,OAAO,IAAI,IAAI,EAAE;AAC3B,YAAA,YAAY,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;SAC/B;AAED,QAAA,OAAO,CAAC,OAAO,GAAG,UAAU,CAAC,MAAK;AAChC,YAAA,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAC;SACnB,EAAE,KAAK,CAAC,CAAC;KACX,EAAE,SAAS,CAAC,CAAC;AAChB;;;;"}
+{"version":3,"file":"useDebouncedCallback.esm.js","sources":["../../../../../../src/hooks/useDebouncedCallback.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React from \"react\";\n\n/* eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types */\nexport const useDebouncedCallback = (callback: Function, delay: number, dependencies?: any[]) => {\n  const timeout = React.useRef<ReturnType<typeof setTimeout>>();\n  const comboDeps = dependencies ? [callback, delay, ...dependencies] : [callback, delay];\n\n  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n  return React.useCallback((...args: any[]) => {\n    if (timeout.current != null) {\n      clearTimeout(timeout.current);\n    }\n\n    timeout.current = setTimeout(() => {\n      callback(...args);\n    }, delay);\n  }, comboDeps);\n};\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;AAcG;AAIH;AACa,MAAA,oBAAoB,GAAG,CAAC,QAAkB,EAAE,KAAa,EAAE,YAAoB,KAAI;AAC9F,IAAA,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,EAAiC,CAAC;IAC9D,MAAM,SAAS,GAAG,YAAY,GAAG,CAAC,QAAQ,EAAE,KAAK,EAAE,GAAG,YAAY,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;;IAGxF,OAAO,KAAK,CAAC,WAAW,CAAC,CAAC,GAAG,IAAW,KAAI;AAC1C,QAAA,IAAI,OAAO,CAAC,OAAO,IAAI,IAAI,EAAE;AAC3B,YAAA,YAAY,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;SAC/B;AAED,QAAA,OAAO,CAAC,OAAO,GAAG,UAAU,CAAC,MAAK;AAChC,YAAA,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAC;SACnB,EAAE,KAAK,CAAC,CAAC;KACX,EAAE,SAAS,CAAC,CAAC;AAChB;;;;"}

package/dist/esm/src/hooks/useDetermineStatusIcon.esm.js

@@ -1,4 +1,4 @@
-import React__default, { useRef } from 'react';
+import React, { useRef } from 'react';
 import { Icon, Icons } from '../../Icon/Icon.esm.js';
 
 /*
@@ -22,10 +22,10 @@ const useDetermineStatusIcon = (params) => {
     const errorRef = useRef(null);
     const successRef = useRef(null);
     if (error) {
-        icon = React__default.createElement(Icon, { ref: errorRef, "data-icon-status": "error", icon: Icons.Error });
+        icon = React.createElement(Icon, { ref: errorRef, "data-icon-status": "error", icon: Icons.Error });
     }
     else if (success) {
-        icon = React__default.createElement(Icon, { ref: successRef, "data-icon-status": "success", icon: Icons.CheckmarkCircleAlt });
+        icon = React.createElement(Icon, { ref: successRef, "data-icon-status": "success", icon: Icons.CheckmarkCircleAlt });
     }
     return icon;
 };

package/dist/esm/src/hooks/useDetermineStatusIcon.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDetermineStatusIcon.esm.js","sources":["../../../../../../src/hooks/useDetermineStatusIcon.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport { FormElement } from \"../components/Form/form.interfaces\";\nimport React, { ReactElement, useRef } from \"react\";\nimport { Icon, Icons } from \"../components/Icon/Icon\";\nexport const useDetermineStatusIcon = (params: Partial<FormElement>): ReactElement | null => {\n  const { error, success } = params || false;\n  let icon = null;\n  const errorRef = useRef(null);\n  const successRef = useRef(null);\n\n  if (error) {\n    icon = <Icon ref={errorRef} data-icon-status=\"error\" icon={Icons.Error} />;\n  } else if (success) {\n    icon = <Icon ref={successRef} data-icon-status=\"success\" icon={Icons.CheckmarkCircleAlt} />;\n  }\n\n  return icon;\n};\n"],"names":["React"],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;AAKU,MAAA,sBAAsB,GAAG,CAAC,MAA4B,KAAyB;IAC1F,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,MAAM,IAAI,KAAK,CAAC;IAC3C,IAAI,IAAI,GAAG,IAAI,CAAC;AAChB,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AAC9B,IAAA,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAEhC,IAAI,KAAK,EAAE;AACT,QAAA,IAAI,GAAGA,cAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,GAAG,EAAE,QAAQ,EAAA,kBAAA,EAAmB,OAAO,EAAC,IAAI,EAAE,KAAK,CAAC,KAAK,GAAI,CAAC;KAC5E;SAAM,IAAI,OAAO,EAAE;AAClB,QAAA,IAAI,GAAGA,cAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,GAAG,EAAE,UAAU,EAAA,kBAAA,EAAmB,SAAS,EAAC,IAAI,EAAE,KAAK,CAAC,kBAAkB,GAAI,CAAC;KAC7F;AAED,IAAA,OAAO,IAAI,CAAC;AACd;;;;"}
+{"version":3,"file":"useDetermineStatusIcon.esm.js","sources":["../../../../../../src/hooks/useDetermineStatusIcon.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport { FormElement } from \"../components/Form/form.interfaces\";\nimport React, { ReactElement, useRef } from \"react\";\nimport { Icon, Icons } from \"../components/Icon/Icon\";\nexport const useDetermineStatusIcon = (params: Partial<FormElement>): ReactElement | null => {\n  const { error, success } = params || false;\n  let icon = null;\n  const errorRef = useRef(null);\n  const successRef = useRef(null);\n\n  if (error) {\n    icon = <Icon ref={errorRef} data-icon-status=\"error\" icon={Icons.Error} />;\n  } else if (success) {\n    icon = <Icon ref={successRef} data-icon-status=\"success\" icon={Icons.CheckmarkCircleAlt} />;\n  }\n\n  return icon;\n};\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;AAKU,MAAA,sBAAsB,GAAG,CAAC,MAA4B,KAAyB;IAC1F,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,MAAM,IAAI,KAAK,CAAC;IAC3C,IAAI,IAAI,GAAG,IAAI,CAAC;AAChB,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AAC9B,IAAA,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAEhC,IAAI,KAAK,EAAE;AACT,QAAA,IAAI,GAAG,KAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,GAAG,EAAE,QAAQ,EAAA,kBAAA,EAAmB,OAAO,EAAC,IAAI,EAAE,KAAK,CAAC,KAAK,GAAI,CAAC;KAC5E;SAAM,IAAI,OAAO,EAAE;AAClB,QAAA,IAAI,GAAG,KAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,GAAG,EAAE,UAAU,EAAA,kBAAA,EAAmB,SAAS,EAAC,IAAI,EAAE,KAAK,CAAC,kBAAkB,GAAI,CAAC;KAC7F;AAED,IAAA,OAAO,IAAI,CAAC;AACd;;;;"}

package/dist/esm/src/hooks/useRepeater.esm.js

@@ -1,4 +1,4 @@
-import React__default, { useState, useEffect } from 'react';
+import React, { useState, useEffect } from 'react';
 import { generateID } from '../util/helper.esm.js';
 
 /*
@@ -22,7 +22,7 @@ const useRepeater = ({ componentToRepeat }) => {
         repeat();
     }, []);
     const repeat = () => {
-        const clonedComponent = React__default.cloneElement(componentToRepeat, { key: generateID(20) });
+        const clonedComponent = React.cloneElement(componentToRepeat, { key: generateID(20) });
         setRepeatedComponents(prevState => [...prevState, clonedComponent]);
     };
     const remove = (componentToRemove) => {

package/dist/esm/src/hooks/useRepeater.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRepeater.esm.js","sources":["../../../../../../src/hooks/useRepeater.ts"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { useEffect, useState, JSX } from \"react\";\nimport { generateID } from \"../util/helper\";\n\ninterface Arguments {\n  componentToRepeat: React.ReactElement;\n}\n\nexport const useRepeater = <T>({ componentToRepeat }: Arguments) => {\n  const [repeatedComponents, setRepeatedComponents] = useState<JSX.Element[]>([]);\n\n  useEffect(() => {\n    repeat();\n  }, []);\n\n  const repeat = () => {\n    const clonedComponent = React.cloneElement(componentToRepeat, { key: generateID(20) });\n\n    setRepeatedComponents(prevState => [...prevState, clonedComponent]);\n  };\n\n  const remove = (componentToRemove: React.ReactElement<T>) => {\n    const newRepeatedComponents = repeatedComponents.filter(\n      component => component !== componentToRemove\n    );\n\n    setRepeatedComponents(newRepeatedComponents);\n  };\n\n  return {\n    repeatedComponents,\n    repeat,\n    remove\n  };\n};\n"],"names":["React"],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;MASU,WAAW,GAAG,CAAI,EAAE,iBAAiB,EAAa,KAAI;IACjE,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAgB,EAAE,CAAC,CAAC;IAEhF,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,EAAE,CAAC;KACV,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,MAAM,GAAG,MAAK;AAClB,QAAA,MAAM,eAAe,GAAGA,cAAK,CAAC,YAAY,CAAC,iBAAiB,EAAE,EAAE,GAAG,EAAE,UAAU,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;AAEvF,QAAA,qBAAqB,CAAC,SAAS,IAAI,CAAC,GAAG,SAAS,EAAE,eAAe,CAAC,CAAC,CAAC;AACtE,KAAC,CAAC;AAEF,IAAA,MAAM,MAAM,GAAG,CAAC,iBAAwC,KAAI;AAC1D,QAAA,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,MAAM,CACrD,SAAS,IAAI,SAAS,KAAK,iBAAiB,CAC7C,CAAC;QAEF,qBAAqB,CAAC,qBAAqB,CAAC,CAAC;AAC/C,KAAC,CAAC;IAEF,OAAO;QACL,kBAAkB;QAClB,MAAM;QACN,MAAM;KACP,CAAC;AACJ;;;;"}
+{"version":3,"file":"useRepeater.esm.js","sources":["../../../../../../src/hooks/useRepeater.ts"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { useEffect, useState, JSX } from \"react\";\nimport { generateID } from \"../util/helper\";\n\ninterface Arguments {\n  componentToRepeat: React.ReactElement;\n}\n\nexport const useRepeater = <T>({ componentToRepeat }: Arguments) => {\n  const [repeatedComponents, setRepeatedComponents] = useState<JSX.Element[]>([]);\n\n  useEffect(() => {\n    repeat();\n  }, []);\n\n  const repeat = () => {\n    const clonedComponent = React.cloneElement(componentToRepeat, { key: generateID(20) });\n\n    setRepeatedComponents(prevState => [...prevState, clonedComponent]);\n  };\n\n  const remove = (componentToRemove: React.ReactElement<T>) => {\n    const newRepeatedComponents = repeatedComponents.filter(\n      component => component !== componentToRemove\n    );\n\n    setRepeatedComponents(newRepeatedComponents);\n  };\n\n  return {\n    repeatedComponents,\n    repeat,\n    remove\n  };\n};\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;MASU,WAAW,GAAG,CAAI,EAAE,iBAAiB,EAAa,KAAI;IACjE,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAgB,EAAE,CAAC,CAAC;IAEhF,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,EAAE,CAAC;KACV,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,MAAM,GAAG,MAAK;AAClB,QAAA,MAAM,eAAe,GAAG,KAAK,CAAC,YAAY,CAAC,iBAAiB,EAAE,EAAE,GAAG,EAAE,UAAU,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;AAEvF,QAAA,qBAAqB,CAAC,SAAS,IAAI,CAAC,GAAG,SAAS,EAAE,eAAe,CAAC,CAAC,CAAC;AACtE,KAAC,CAAC;AAEF,IAAA,MAAM,MAAM,GAAG,CAAC,iBAAwC,KAAI;AAC1D,QAAA,MAAM,qBAAqB,GAAG,kBAAkB,CAAC,MAAM,CACrD,SAAS,IAAI,SAAS,KAAK,iBAAiB,CAC7C,CAAC;QAEF,qBAAqB,CAAC,qBAAqB,CAAC,CAAC;AAC/C,KAAC,CAAC;IAEF,OAAO;QACL,kBAAkB;QAClB,MAAM;QACN,MAAM;KACP,CAAC;AACJ;;;;"}

package/dist/esm/src/hooks/useUploadFile.esm.js

@@ -67,7 +67,7 @@ const useUploadFile = (files, request, callbacks) => {
             const updatedList = getUpdatedList(fileName, fileStatus, undefined, error);
             setUpdatedFiles(updatedList);
             const response = { fileList: updatedList, status, responseJson };
-            setUploadingFiles(prevState => prevState.filter(selected => selected.name === fileName));
+            setUploadingFiles(prevState => prevState.filter(selected => selected.name !== fileName));
             onComplete === null || onComplete === void 0 ? void 0 : onComplete(response);
         }
     };

package/dist/esm/src/hooks/useUploadFile.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUploadFile.esm.js","sources":["../../../../../../src/hooks/useUploadFile.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport { FileType } from \"../components/Form/FileUpload/FileUpload\";\nimport { useEffect, useState } from \"react\";\nimport { isJsonString } from \"../util/helper\";\n\nexport type UploadResponseStatus = XMLHttpRequest[\"status\"];\nexport type UploadResponseJson = Record<string, unknown>;\nexport interface UploadResponseType {\n  fileList: FileType[];\n  status: UploadResponseStatus;\n  responseJson: UploadResponseJson;\n}\nexport interface OnErrorMessageMapperType {\n  responseStatus: UploadResponseStatus;\n  responseJson: UploadResponseJson;\n}\nexport interface UseUploadFileCallback {\n  onComplete?: (response: UploadResponseType) => void;\n  onProgress?: (fileName: string, progress: number) => void;\n  onErrorMessageMapper?: (args: OnErrorMessageMapperType) => string | undefined;\n}\nexport interface UploadFileRequestParams {\n  url: string;\n  headers?: Headers;\n  withCredentials?: boolean;\n}\n\nexport const useUploadFile = (\n  files: FileType[],\n  request: UploadFileRequestParams,\n  callbacks?: UseUploadFileCallback\n) => {\n  const { url, headers, withCredentials } = request;\n\n  const { onComplete, onProgress, onErrorMessageMapper } = callbacks ?? {};\n\n  const [uploadingFiles, setUploadingFiles] = useState<FileType[]>([]);\n  const [updatedFiles, setUpdatedFiles] = useState<FileType[]>([...files]);\n\n  const getUpdatedList = (\n    fileName: string,\n    fileStatus: FileType[\"status\"],\n    progress?: number,\n    error?: string\n  ) => {\n    return files.map(file => {\n      if (file.name === fileName) {\n        file.progress = progress;\n        file.error = error;\n        file.status = fileStatus;\n      }\n      return { ...file };\n    });\n  };\n\n  const recordProgress = (e: ProgressEvent<XMLHttpRequestEventTarget>, fileName: string) => {\n    const progress = (e.loaded / e.total) * 100;\n    const updatedData = getUpdatedList(fileName, \"uploading\", progress);\n    setUpdatedFiles(updatedData);\n    onProgress?.(fileName, progress);\n  };\n\n  const getFileStatus = (\n    responseStatus: UploadResponseStatus,\n    responseJson: UploadResponseJson\n  ) => {\n    let fileStatus: FileType[\"status\"] = undefined;\n    let error = \"\";\n    if (responseStatus >= 200 && responseStatus < 400) {\n      fileStatus = \"completed\";\n    } else if (responseStatus === 0) {\n      fileStatus = \"retry\";\n      error =\n        onErrorMessageMapper?.({ responseStatus, responseJson }) ??\n        \"Network error. Check internet connection and retry uploading the file\";\n    } else if (responseStatus >= 400 && responseStatus < 500) {\n      fileStatus = \"error\";\n      error = onErrorMessageMapper?.({ responseStatus, responseJson }) ?? \"Bad request\";\n    } else if (responseStatus >= 500) {\n      fileStatus = \"error\";\n      error = onErrorMessageMapper?.({ responseStatus, responseJson }) ?? \"Server Error\";\n    }\n    return { fileStatus, error };\n  };\n\n  const handleOnComplete = (xhr: XMLHttpRequest, fileName: string) => {\n    const { status, readyState, responseText } = xhr;\n    if (readyState === xhr.DONE) {\n      const responseJson = responseText && isJsonString(responseText) && JSON.parse(responseText);\n      const { fileStatus, error } = getFileStatus(status, responseJson);\n      const updatedList = getUpdatedList(fileName, fileStatus, undefined, error);\n      setUpdatedFiles(updatedList);\n      const response = { fileList: updatedList, status, responseJson };\n      setUploadingFiles(prevState => prevState.filter(selected => selected.name === fileName));\n      onComplete?.(response);\n    }\n  };\n\n  const uploadFile = (file: FileType) => {\n    const xhr = new XMLHttpRequest();\n    xhr.upload.addEventListener(\"progress\", e => recordProgress(e, file.name));\n    xhr.addEventListener(\"readystatechange\", () => handleOnComplete(xhr, file.name));\n    withCredentials && (xhr.withCredentials = true);\n    xhr.open(\"POST\", url, true);\n    headers?.forEach((value, key) => xhr.setRequestHeader(key, value));\n    const formData = new FormData();\n    formData.append(\"file\", file.data as File);\n    formData.append(\"name\", file.name);\n    xhr.send(formData);\n  };\n\n  useEffect(() => {\n    if (!url || !files.length) {\n      return;\n    }\n\n    files.forEach(file => {\n      if (!file.status && !uploadingFiles.find(selected => selected.name === file.name)) {\n        setUploadingFiles(prevState => [...prevState, file]);\n        uploadFile(file);\n      }\n    });\n  }, [url, files]);\n\n  return { updatedFiles, setUpdatedFiles, uploadingFiles };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useUploadFile.esm.js","sources":["../../../../../../src/hooks/useUploadFile.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport { FileType } from \"../components/Form/FileUpload/FileUpload\";\nimport { useEffect, useState } from \"react\";\nimport { isJsonString } from \"../util/helper\";\n\nexport type UploadResponseStatus = XMLHttpRequest[\"status\"];\nexport type UploadResponseJson = Record<string, unknown>;\nexport interface UploadResponseType {\n  fileList: FileType[];\n  status: UploadResponseStatus;\n  responseJson: UploadResponseJson;\n}\nexport interface OnErrorMessageMapperType {\n  responseStatus: UploadResponseStatus;\n  responseJson: UploadResponseJson;\n}\nexport interface UseUploadFileCallback {\n  onComplete?: (response: UploadResponseType) => void;\n  onProgress?: (fileName: string, progress: number) => void;\n  onErrorMessageMapper?: (args: OnErrorMessageMapperType) => string | undefined;\n}\nexport interface UploadFileRequestParams {\n  url: string;\n  headers?: Headers;\n  withCredentials?: boolean;\n}\n\nexport const useUploadFile = (\n  files: FileType[],\n  request: UploadFileRequestParams,\n  callbacks?: UseUploadFileCallback\n) => {\n  const { url, headers, withCredentials } = request;\n\n  const { onComplete, onProgress, onErrorMessageMapper } = callbacks ?? {};\n\n  const [uploadingFiles, setUploadingFiles] = useState<FileType[]>([]);\n  const [updatedFiles, setUpdatedFiles] = useState<FileType[]>([...files]);\n\n  const getUpdatedList = (\n    fileName: string,\n    fileStatus: FileType[\"status\"],\n    progress?: number,\n    error?: string\n  ) => {\n    return files.map(file => {\n      if (file.name === fileName) {\n        file.progress = progress;\n        file.error = error;\n        file.status = fileStatus;\n      }\n      return { ...file };\n    });\n  };\n\n  const recordProgress = (e: ProgressEvent<XMLHttpRequestEventTarget>, fileName: string) => {\n    const progress = (e.loaded / e.total) * 100;\n    const updatedData = getUpdatedList(fileName, \"uploading\", progress);\n    setUpdatedFiles(updatedData);\n    onProgress?.(fileName, progress);\n  };\n\n  const getFileStatus = (\n    responseStatus: UploadResponseStatus,\n    responseJson: UploadResponseJson\n  ) => {\n    let fileStatus: FileType[\"status\"] = undefined;\n    let error = \"\";\n    if (responseStatus >= 200 && responseStatus < 400) {\n      fileStatus = \"completed\";\n    } else if (responseStatus === 0) {\n      fileStatus = \"retry\";\n      error =\n        onErrorMessageMapper?.({ responseStatus, responseJson }) ??\n        \"Network error. Check internet connection and retry uploading the file\";\n    } else if (responseStatus >= 400 && responseStatus < 500) {\n      fileStatus = \"error\";\n      error = onErrorMessageMapper?.({ responseStatus, responseJson }) ?? \"Bad request\";\n    } else if (responseStatus >= 500) {\n      fileStatus = \"error\";\n      error = onErrorMessageMapper?.({ responseStatus, responseJson }) ?? \"Server Error\";\n    }\n    return { fileStatus, error };\n  };\n\n  const handleOnComplete = (xhr: XMLHttpRequest, fileName: string) => {\n    const { status, readyState, responseText } = xhr;\n    if (readyState === xhr.DONE) {\n      const responseJson = responseText && isJsonString(responseText) && JSON.parse(responseText);\n      const { fileStatus, error } = getFileStatus(status, responseJson);\n      const updatedList = getUpdatedList(fileName, fileStatus, undefined, error);\n      setUpdatedFiles(updatedList);\n      const response = { fileList: updatedList, status, responseJson };\n      setUploadingFiles(prevState => prevState.filter(selected => selected.name !== fileName));\n      onComplete?.(response);\n    }\n  };\n\n  const uploadFile = (file: FileType) => {\n    const xhr = new XMLHttpRequest();\n    xhr.upload.addEventListener(\"progress\", e => recordProgress(e, file.name));\n    xhr.addEventListener(\"readystatechange\", () => handleOnComplete(xhr, file.name));\n    withCredentials && (xhr.withCredentials = true);\n    xhr.open(\"POST\", url, true);\n    headers?.forEach((value, key) => xhr.setRequestHeader(key, value));\n    const formData = new FormData();\n    formData.append(\"file\", file.data as File);\n    formData.append(\"name\", file.name);\n    xhr.send(formData);\n  };\n\n  useEffect(() => {\n    if (!url || !files.length) {\n      return;\n    }\n\n    files.forEach(file => {\n      if (!file.status && !uploadingFiles.find(selected => selected.name === file.name)) {\n        setUploadingFiles(prevState => [...prevState, file]);\n        uploadFile(file);\n      }\n    });\n  }, [url, files]);\n\n  return { updatedFiles, setUpdatedFiles, uploadingFiles };\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/src/index.d.ts

@@ -158,6 +158,7 @@ export { MicrofrontendContainer } from "./components/admin/layout/MicrofrontendC
 export type { Props as MicrofrontendContainerProps } from "./components/admin/layout/MicrofrontendContainer/MicrofrontendContainer";
 export { LeftNav } from "./components/admin/layout/LeftNav/LeftNav";
 export type { Props as LeftNavProps } from "./components/admin/layout/LeftNav/LeftNav";
+export type { MenuItem as LeftNavMenuItem } from "./components/admin/layout/LeftNav/LeftNav.interfaces";
 /**
  * Miscellaneous
  */

package/dist/esm/src/readyclasses.module.scss.esm.js

@@ -1,7 +1,7 @@
 import styleInject from '../node_modules/style-inject/dist/style-inject.es.esm.js';
 
-var css_248z = "/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.readyclasses_sr-only_NlMre{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.readyclasses_hidden_NlMre{display:none}.readyclasses_slide-in_NlMre{animation:readyclasses_slide-in_NlMre .5s forwards}@media (prefers-reduced-motion:reduce){.readyclasses_slide-in_NlMre{animation-duration:.1ms}}.readyclasses_slide-out_NlMre{animation:readyclasses_slide-out_NlMre .5s forwards}@media (prefers-reduced-motion:reduce){.readyclasses_slide-out_NlMre{animation-duration:.1ms}}@keyframes readyclasses_slide-in_NlMre{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes readyclasses_slide-out_NlMre{0%{transform:translateY(0)}to{transform:translateY(100vh)}}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInJlYWR5Y2xhc3Nlcy5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRSxDQUNGLDRCQU9FLGtCQUFzQixDQUN0QixRQUFTLENBTFQsVUFBVyxDQUVYLFdBQVksQ0FDWixlQUFnQixDQUZoQixTQUFVLENBSFYsaUJBQWtCLENBQ2xCLFNBT0YsQ0FFQSwyQkFDRSxZQUNGLENBRUEsNkJBQ0Usa0RBQ0YsQ0FDQSx1Q0FDRSw2QkFDRSx1QkFDRixDQUNGLENBRUEsOEJBQ0UsbURBQ0YsQ0FDQSx1Q0FDRSw4QkFDRSx1QkFDRixDQUNGLENBRUEsdUNBQ0UsR0FDRSwyQkFDRixDQUNBLEdBQ0UsdUJBQ0YsQ0FDRixDQUNBLHdDQUNFLEdBQ0UsdUJBQ0YsQ0FDQSxHQUNFLDJCQUNGLENBQ0YiLCJmaWxlIjoicmVhZHljbGFzc2VzLm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi5zci1vbmx5IHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMXB4O1xuICBoZWlnaHQ6IDFweDtcbiAgcGFkZGluZzogMDtcbiAgbWFyZ2luOiAtMXB4O1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBjbGlwOiByZWN0KDAsIDAsIDAsIDApO1xuICBib3JkZXI6IDA7XG59XG5cbi5oaWRkZW4ge1xuICBkaXNwbGF5OiBub25lO1xufVxuXG4uc2xpZGUtaW4ge1xuICBhbmltYXRpb246IHNsaWRlLWluIDAuNXMgZm9yd2FyZHM7XG59XG5AbWVkaWEgKHByZWZlcnMtcmVkdWNlZC1tb3Rpb246IHJlZHVjZSkge1xuICAuc2xpZGUtaW4ge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuLnNsaWRlLW91dCB7XG4gIGFuaW1hdGlvbjogc2xpZGUtb3V0IDAuNXMgZm9yd2FyZHM7XG59XG5AbWVkaWEgKHByZWZlcnMtcmVkdWNlZC1tb3Rpb246IHJlZHVjZSkge1xuICAuc2xpZGUtb3V0IHtcbiAgICBhbmltYXRpb24tZHVyYXRpb246IDAuMW1zO1xuICB9XG59XG5cbkBrZXlmcmFtZXMgc2xpZGUtaW4ge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG59XG5Aa2V5ZnJhbWVzIHNsaWRlLW91dCB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxMDB2aCk7XG4gIH1cbn0iXX0= */";
-var readyclasses = {"sr-only":"readyclasses_sr-only_NlMre","hidden":"readyclasses_hidden_NlMre","slide-in":"readyclasses_slide-in_NlMre","slide-out":"readyclasses_slide-out_NlMre"};
+var css_248z = "/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.readyclasses_sr-only_rE09l{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.readyclasses_hidden_rE09l{display:none}.readyclasses_slide-in_rE09l{animation:readyclasses_slide-in_rE09l .5s forwards}@media (prefers-reduced-motion:reduce){.readyclasses_slide-in_rE09l{animation-duration:.1ms}}.readyclasses_slide-out_rE09l{animation:readyclasses_slide-out_rE09l .5s forwards}@media (prefers-reduced-motion:reduce){.readyclasses_slide-out_rE09l{animation-duration:.1ms}}@keyframes readyclasses_slide-in_rE09l{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes readyclasses_slide-out_rE09l{0%{transform:translateY(0)}to{transform:translateY(100vh)}}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInJlYWR5Y2xhc3Nlcy5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRSxDQUNGLDRCQU9FLGtCQUFzQixDQUN0QixRQUFTLENBTFQsVUFBVyxDQUVYLFdBQVksQ0FDWixlQUFnQixDQUZoQixTQUFVLENBSFYsaUJBQWtCLENBQ2xCLFNBT0YsQ0FFQSwyQkFDRSxZQUNGLENBRUEsNkJBQ0Usa0RBQ0YsQ0FDQSx1Q0FDRSw2QkFDRSx1QkFDRixDQUNGLENBRUEsOEJBQ0UsbURBQ0YsQ0FDQSx1Q0FDRSw4QkFDRSx1QkFDRixDQUNGLENBRUEsdUNBQ0UsR0FDRSwyQkFDRixDQUNBLEdBQ0UsdUJBQ0YsQ0FDRixDQUNBLHdDQUNFLEdBQ0UsdUJBQ0YsQ0FDQSxHQUNFLDJCQUNGLENBQ0YiLCJmaWxlIjoicmVhZHljbGFzc2VzLm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi5zci1vbmx5IHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMXB4O1xuICBoZWlnaHQ6IDFweDtcbiAgcGFkZGluZzogMDtcbiAgbWFyZ2luOiAtMXB4O1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBjbGlwOiByZWN0KDAsIDAsIDAsIDApO1xuICBib3JkZXI6IDA7XG59XG5cbi5oaWRkZW4ge1xuICBkaXNwbGF5OiBub25lO1xufVxuXG4uc2xpZGUtaW4ge1xuICBhbmltYXRpb246IHNsaWRlLWluIDAuNXMgZm9yd2FyZHM7XG59XG5AbWVkaWEgKHByZWZlcnMtcmVkdWNlZC1tb3Rpb246IHJlZHVjZSkge1xuICAuc2xpZGUtaW4ge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuLnNsaWRlLW91dCB7XG4gIGFuaW1hdGlvbjogc2xpZGUtb3V0IDAuNXMgZm9yd2FyZHM7XG59XG5AbWVkaWEgKHByZWZlcnMtcmVkdWNlZC1tb3Rpb246IHJlZHVjZSkge1xuICAuc2xpZGUtb3V0IHtcbiAgICBhbmltYXRpb24tZHVyYXRpb246IDAuMW1zO1xuICB9XG59XG5cbkBrZXlmcmFtZXMgc2xpZGUtaW4ge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG59XG5Aa2V5ZnJhbWVzIHNsaWRlLW91dCB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxMDB2aCk7XG4gIH1cbn0iXX0= */";
+var readyclasses = {"sr-only":"readyclasses_sr-only_rE09l","hidden":"readyclasses_hidden_rE09l","slide-in":"readyclasses_slide-in_rE09l","slide-out":"readyclasses_slide-out_rE09l"};
 styleInject(css_248z);
 
 export { readyclasses as default };

package/dist/esm/withReadOnly.esm.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import React from 'react';
 
 /*
  * Copyright 2022 OneWelcome B.V.
@@ -58,9 +58,9 @@ const withReadOnly = (WrappedComponent) => {
         }
         return {};
     };
-    const WithReadOnlyComponent = React__default.forwardRef((props, ref) => {
+    const WithReadOnlyComponent = React.forwardRef((props, ref) => {
         const { readOnlyView = false, required, children, helperText, type = "", ...restProps } = props;
-        return (React__default.createElement(WrappedComponent, { ref: ref, ...restProps, "data-readonlyview": readOnlyView, "aria-readonly": readOnlyView, required: readOnlyView ? false : required, ...getConditionalProps(readOnlyView, type, helperText), ...preventKeyUpAndKeyDownHandlerForSpecificComponents(readOnlyView) }, children));
+        return (React.createElement(WrappedComponent, { ref: ref, ...restProps, "data-readonlyview": readOnlyView, "aria-readonly": readOnlyView, required: readOnlyView ? false : required, ...getConditionalProps(readOnlyView, type, helperText), ...preventKeyUpAndKeyDownHandlerForSpecificComponents(readOnlyView) }, children));
     });
     WithReadOnlyComponent.displayName = `withReadOnly_${getDisplayName(WrappedComponent)}`;
     return WithReadOnlyComponent;

package/dist/esm/withReadOnly.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"withReadOnly.esm.js","sources":["../../../../src/components/withReadOnly.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ComponentType, ForwardedRef, PropsWithChildren } from \"react\";\n\nexport interface WithReadOnlyProps {\n  readOnlyView?: boolean;\n  required?: boolean;\n  helperText?: string;\n  type?: string;\n}\n\nconst componentsWithKeyEventsToPrevent: string[] = [\"CheckboxWrapper\"];\n\nconst getDisplayName = <P,>(WrappedComponent: ComponentType<P>) => {\n  return WrappedComponent.displayName ?? WrappedComponent.name ?? \"Component\";\n};\n\nconst getConditionalProps = (readOnlyView: boolean, type: string, helperText?: string) => {\n  const props: Record<string, unknown> = {};\n\n  if (readOnlyView) {\n    props.style = { pointerEvents: \"none\", userSelect: \"text\" };\n    if (helperText) {\n      props.helperText = \"\";\n    }\n  } else {\n    props.helperText = helperText;\n  }\n\n  if (type) {\n    props.type = type;\n  }\n\n  return props;\n};\n\nexport const withReadOnly = <P extends object>(WrappedComponent: ComponentType<P>) => {\n  const preventKeyUpAndKeyDownHandlerForSpecificComponents = (readOnlyView: boolean) => {\n    const preventSubmissionKeys = (e: KeyboardEvent) => {\n      const isEnterOrSpace = (e: KeyboardEvent) => e.key === \"Enter\" || e.key === \" \";\n      if (isEnterOrSpace(e)) {\n        e.stopPropagation();\n        e.preventDefault();\n      }\n    };\n\n    if (\n      readOnlyView &&\n      componentsWithKeyEventsToPrevent.includes(\n        WrappedComponent.displayName || WrappedComponent.name\n      )\n    ) {\n      const props: Record<string, unknown> = {};\n\n      props.onKeyUp = (e: KeyboardEvent) => {\n        preventSubmissionKeys(e);\n      };\n\n      props.onKeyDown = (e: KeyboardEvent) => {\n        preventSubmissionKeys(e);\n      };\n\n      return props;\n    }\n\n    return {};\n  };\n\n  const WithReadOnlyComponent = React.forwardRef(\n    (props: PropsWithChildren<P & WithReadOnlyProps>, ref: ForwardedRef<unknown>) => {\n      const {\n        readOnlyView = false,\n        required,\n        children,\n        helperText,\n        type = \"\",\n        ...restProps\n      } = props;\n\n      return (\n        <WrappedComponent\n          ref={ref}\n          {...(restProps as P)}\n          data-readonlyview={readOnlyView}\n          aria-readonly={readOnlyView}\n          required={readOnlyView ? false : required}\n          {...getConditionalProps(readOnlyView, type, helperText)}\n          {...preventKeyUpAndKeyDownHandlerForSpecificComponents(readOnlyView)}\n        >\n          {children}\n        </WrappedComponent>\n      );\n    }\n  );\n\n  WithReadOnlyComponent.displayName = `withReadOnly_${getDisplayName(WrappedComponent)}`;\n  return WithReadOnlyComponent;\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"withReadOnly.esm.js","sources":["../../../../src/components/withReadOnly.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ComponentType, ForwardedRef, PropsWithChildren } from \"react\";\n\nexport interface WithReadOnlyProps {\n  readOnlyView?: boolean;\n  required?: boolean;\n  helperText?: string;\n  type?: string;\n}\n\nconst componentsWithKeyEventsToPrevent: string[] = [\"CheckboxWrapper\"];\n\nconst getDisplayName = <P,>(WrappedComponent: ComponentType<P>) => {\n  return WrappedComponent.displayName ?? WrappedComponent.name ?? \"Component\";\n};\n\nconst getConditionalProps = (readOnlyView: boolean, type: string, helperText?: string) => {\n  const props: Record<string, unknown> = {};\n\n  if (readOnlyView) {\n    props.style = { pointerEvents: \"none\", userSelect: \"text\" };\n    if (helperText) {\n      props.helperText = \"\";\n    }\n  } else {\n    props.helperText = helperText;\n  }\n\n  if (type) {\n    props.type = type;\n  }\n\n  return props;\n};\n\nexport const withReadOnly = <P extends object>(WrappedComponent: ComponentType<P>) => {\n  const preventKeyUpAndKeyDownHandlerForSpecificComponents = (readOnlyView: boolean) => {\n    const preventSubmissionKeys = (e: KeyboardEvent) => {\n      const isEnterOrSpace = (e: KeyboardEvent) => e.key === \"Enter\" || e.key === \" \";\n      if (isEnterOrSpace(e)) {\n        e.stopPropagation();\n        e.preventDefault();\n      }\n    };\n\n    if (\n      readOnlyView &&\n      componentsWithKeyEventsToPrevent.includes(\n        WrappedComponent.displayName || WrappedComponent.name\n      )\n    ) {\n      const props: Record<string, unknown> = {};\n\n      props.onKeyUp = (e: KeyboardEvent) => {\n        preventSubmissionKeys(e);\n      };\n\n      props.onKeyDown = (e: KeyboardEvent) => {\n        preventSubmissionKeys(e);\n      };\n\n      return props;\n    }\n\n    return {};\n  };\n\n  const WithReadOnlyComponent = React.forwardRef(\n    (props: PropsWithChildren<P & WithReadOnlyProps>, ref: ForwardedRef<unknown>) => {\n      const {\n        readOnlyView = false,\n        required,\n        children,\n        helperText,\n        type = \"\",\n        ...restProps\n      } = props;\n\n      return (\n        <WrappedComponent\n          ref={ref}\n          {...(restProps as P)}\n          data-readonlyview={readOnlyView}\n          aria-readonly={readOnlyView}\n          required={readOnlyView ? false : required}\n          {...getConditionalProps(readOnlyView, type, helperText)}\n          {...preventKeyUpAndKeyDownHandlerForSpecificComponents(readOnlyView)}\n        >\n          {children}\n        </WrappedComponent>\n      );\n    }\n  );\n\n  WithReadOnlyComponent.displayName = `withReadOnly_${getDisplayName(WrappedComponent)}`;\n  return WithReadOnlyComponent;\n};\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "homepage": "http://onewelcome.github.io/react-lib-components",
   "name": "@onewelcome/react-lib-components",
-  "version": "8.12.0",
+  "version": "8.12.2",
   "license": "Apache-2.0",
   "author": "OneWelcome B.V.",
   "main": "dist/cjs/src/index.cjs.js",
@@ -91,8 +91,6 @@
     "@types/mdx": "^2.0.13",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
-    "@types/react-router": "^5.1.20",
-    "@types/react-router-dom": "^5.3.3",
     "@typescript-eslint/eslint-plugin": "^7.15.0",
     "@typescript-eslint/parser": "^7.15.0",
     "babel-loader": "^9.1.3",

package/src/components/DataGrid/DataGrid.module.scss

@@ -20,6 +20,7 @@
 
 .table-wrapper {
   overflow-x: auto;
+  overflow-y: hidden; // hides additional vertical scroll which can be seen when using nested rows
 }
 
 .table {

package/src/components/Form/Checkbox/Checkbox.module.scss

@@ -137,7 +137,7 @@
   color: var(--color-primary);
 }
 
-[data-readonlyview="true"] {
+[data-readonlyview="true"] .checkbox-wrapper {
   & label {
     border-color: var(--read-only-border-color);
     color: var(--read-only-text-color);
@@ -145,19 +145,17 @@
     user-select: text;
   }
 
-  & .checkbox-wrapper {
-    & span {
-      color: var(--color-blue-grey100);
+  & span {
+    color: var(--color-blue-grey100);
 
-      &.checkmark {
-        background-color: var(--color-blue-grey900);
-        color: var(--color-white);
+    &.checkmark {
+      background-color: var(--color-blue-grey900);
+      color: var(--color-white);
+      border-radius: 2px;
+      &:before {
+        outline: 1px solid var(--read-only-border-color);
         border-radius: 2px;
-        &:before {
-          outline: 1px solid var(--read-only-border-color);
-          border-radius: 2px;
-          outline-offset: -1px;
-        }
+        outline-offset: -1px;
       }
     }
   }
@@ -167,7 +165,7 @@
   }
 }
 
-input[type="checkbox"] {
+.checkbox-container input[type="checkbox"] {
   &[data-readonlyview="true"] {
     & ~ span {
       &:before {

package/src/components/Form/FileUpload/FileUpload.tsx

@@ -151,10 +151,12 @@ const FileUploadComponent: ForwardRefRenderFunction<HTMLInputElement, Props> = (
     e.stopPropagation();
     const files = getFileList(e.target.files);
     const isFileValid = files.length && verifyExtensionValidity(files[files.length - 1]);
+
     if (isFileValid) {
       setErrorMsg("");
+      e.target.value = "";
+      onChange?.(files);
     }
-    isFileValid && onChange?.(files);
   };
 
   const verifyExtensionValidity = (file: FileType) => {

package/src/components/Form/Radio/Radio.module.scss

@@ -146,19 +146,17 @@
   pointer-events: none;
 }
 
-[data-readonlyview="true"] {
-  & .radio-wrapper {
-    color: var(--read-only-text-color);
+[data-readonlyview="true"] .radio-wrapper {
+  color: var(--read-only-text-color);
 
-    & span.input {
-      color: var(--read-only-text-color);
-      cursor: not-allowed;
+  & span.input {
+    color: var(--read-only-text-color);
+    cursor: not-allowed;
 
-      &:before {
-        outline: 1px solid var(--read-only-border-color);
-        outline-offset: -1px;
-        border-radius: 50%;
-      }
+    &:before {
+      outline: 1px solid var(--read-only-border-color);
+      outline-offset: -1px;
+      border-radius: 50%;
     }
   }
 
@@ -167,7 +165,7 @@
   }
 }
 
-input[type="radio"] {
+.radio-container input[type="radio"] {
   &[data-readonlyview="true"] {
     & ~ span.input {
       color: var(--read-only-text-color);

package/src/components/Form/Select/SingleSelect/Select.module.scss

@@ -302,7 +302,7 @@ $listItemHeight: 2.5rem;
   }
 }
 
-[data-readonlyview="true"] {
+[data-readonlyview="true"] .root {
   [data-readonlyview] {
     & button {
       border-color: var(--read-only-border-color);

package/src/components/Form/Select/SingleSelect/Select.tsx

@@ -223,7 +223,7 @@ const SelectComponent: ForwardRefRenderFunction<HTMLSelectElement, SingleSelectP
 
   /** The native select is purely for external form libraries. We use it to emit an onChange with native select event object so they know exactly what's happening. */
   return (
-    <div ref={myElementRef}>
+    <div ref={myElementRef} className={classes["root"]}>
       <select
         {...filterProps(rest, /^data-/, false)}
         tabIndex={-1}

package/src/components/Form/Wrapper/TextareaWrapper/TextareaWrapper.module.scss

@@ -55,11 +55,7 @@
   }
 }
 
-.textarea-helper-text {
-  margin-top: 0.14rem;
-}
-
-[data-readonlyview="true"] {
+.wrapper[data-readonlyview="true"] {
   & ~ span.error {
     background-color: var(--color-white);
   }
@@ -97,3 +93,7 @@
     }
   }
 }
+
+.textarea-helper-text {
+  margin-top: 0.14rem;
+}

package/src/components/Form/Wrapper/TextareaWrapper/TextareaWrapper.tsx

@@ -56,6 +56,7 @@ const TextareaWrapperComponent: ForwardRefRenderFunction<HTMLDivElement, Props>
     onMouseLeave,
     disabled,
     success,
+    className,
     ...rest
   }: Props,
   ref
@@ -127,6 +128,7 @@ const TextareaWrapperComponent: ForwardRefRenderFunction<HTMLDivElement, Props>
     <Wrapper
       {...rest}
       ref={ref}
+      className={`${classes["wrapper"]} ${className ?? ""}`}
       disabled={disabled}
       labelProps={{
         id: labelId,

package/src/components/Form/Wrapper/Wrapper/Wrapper.module.scss

@@ -67,7 +67,7 @@
   }
 }
 
-[data-readonlyview="true"] {
+.wrapper[data-readonlyview="true"] {
   & label {
     color: var(--read-only-text-color);
   }

package/src/components/admin/layout/LeftNav/LeftNav.tsx

@@ -29,7 +29,7 @@ export interface Props extends ComponentPropsWithRef<"nav"> {
   isSideMenuOpen?: boolean;
   items: MenuItem[];
   navigate: (path: string) => void;
-  onItemClick: (path?: string, button?: boolean) => void;
+  onItemClick?: (path?: string, button?: boolean) => void;
   marginTop?: string;
 }
 

package/src/components/admin/layout/LeftNav/LeftNavItem/ButtonLeftNavItem.tsx

@@ -24,7 +24,6 @@ import React, {
   useState
 } from "react";
 import classes from "./LeftNavItem.module.scss";
-import { Link as RouterLink } from "react-router-dom";
 import { MenuItem } from "../LeftNav.interfaces";
 import { Icon, Icons } from "../../../../Icon/Icon";
 import { useKeyboardNavigation } from "./useKeyboardNavigation";
@@ -34,7 +33,7 @@ import { LeftNavItemProps } from "./LeftNavItem.interface";
 export interface Props extends HTMLProps<HTMLElement> {
   item: MenuItem;
   navigate: (path: string) => void;
-  onItemClick: (path?: string, button?: boolean) => void;
+  onItemClick?: (path?: string, button?: boolean) => void;
   refItems: UseRefItemsReturnType;
   NestedComponent: ForwardRefExoticComponent<LeftNavItemProps>;
   closeParentList?: () => void;
@@ -55,10 +54,14 @@ const ButtonLeftNavItemComponent: ForwardRefRenderFunction<HTMLElement, Props> =
     if (!isChevronIcon && item.path && !item.disabled) {
       event.preventDefault();
       navigate(item.path);
-      onItemClick(item.path, true);
+      onItemClick?.(item.path, true);
     }
   };
 
+  const onLinkClickHandler = (event: MouseEvent<HTMLAnchorElement>) => {
+    event.preventDefault();
+  };
+
   const onExpandIconClickHandler = () => {
     setExpanded(expanded => !expanded);
   };
@@ -93,7 +96,7 @@ const ButtonLeftNavItemComponent: ForwardRefRenderFunction<HTMLElement, Props> =
     <li className={buttonWrapperClasses.join(" ")} data-testid={item.key}>
       <button
         aria-controls={item.key}
-        data-testid={`tab-btn-${item.key}`}
+        data-testid={`left-nav-item-${item.key}`}
         aria-expanded={expanded}
         ref={ref as Ref<HTMLButtonElement>}
         onKeyDown={onKeyPressNavigation}
@@ -106,14 +109,15 @@ const ButtonLeftNavItemComponent: ForwardRefRenderFunction<HTMLElement, Props> =
           {item.iconComponent &&
             React.cloneElement(item.iconComponent, { className: classes["menu-item-icon"] })}
           {item.path ? (
-            <RouterLink
-              to={item.path}
+            <a
+              href={item.path}
               aria-current={item.active ? "page" : false}
               className={classes["menu-item-text"]}
+              onClick={onLinkClickHandler}
               tabIndex={-1}
             >
               {item.title}
-            </RouterLink>
+            </a>
           ) : (
             <span className={classes["menu-item-text"]}>{item.title}</span>
           )}

package/src/components/admin/layout/LeftNav/LeftNavItem/LeftNavItem.interface.ts

@@ -21,7 +21,7 @@ import { UseRefItemsReturnType } from "../useRefItems";
 export interface LeftNavItemProps extends HTMLProps<HTMLElement> {
   item: MenuItem;
   navigate: (path: string) => void;
-  onItemClick: (path?: string, button?: boolean) => void;
+  onItemClick?: (path?: string, button?: boolean) => void;
   refItems: UseRefItemsReturnType;
   closeParentList?: () => void;
 }