@onewelcome/react-lib-components 8.3.0 → 8.5.0

package/dist/esm/Notifications/BaseModal/BaseModal.esm.js

@@ -41,7 +41,7 @@ const useSetBodyScroll = (open) => {
         }
     }, [open]);
 };
-const BaseModalComponent = ({ id, children, open, onClose, className = "", containerProps, backdropProps, labelledby, describedby, disableEscapeKeyDown = false, disableBackdrop = false, forceContainerOpen = false, zIndex, domRoot, ...rest }, ref) => {
+const BaseModalComponent = ({ id, children, open, onClose, className = "", containerProps, backdropProps, labelledby, describedby, disableEscapeKeyDown = false, disableBackdrop = false, hideBackdrop = false, forceContainerOpen = false, zIndex, domRoot, ...rest }, ref) => {
     var _a, _b, _c;
     useSetBodyScroll(open);
     const wrappingDivRef = useRef(null);
@@ -71,7 +71,7 @@ const BaseModalComponent = ({ id, children, open, onClose, className = "", conta
         return child;
     });
     return (React.createElement("div", { ref: wrappingDivRef }, createPortal(React.createElement("div", { ...rest, ref: modalRef, id: id, className: `${classes["modal"]} ${open ? classes["visible"] : ""} ${className}`, role: "dialog", "aria-modal": "true", "aria-labelledby": labelledby !== null && labelledby !== void 0 ? labelledby : labelId(id), "aria-describedby": describedby !== null && describedby !== void 0 ? describedby : descriptionId(id), "aria-hidden": !open, tabIndex: -1, "data-hidden": !open, onKeyDown: handleEscKeyPress, style: { zIndex } },
-        React.createElement("div", { ...backdropProps, "aria-hidden": true, className: `${classes["backdrop"]} ${(_a = backdropProps === null || backdropProps === void 0 ? void 0 : backdropProps.className) !== null && _a !== void 0 ? _a : ""}`, onClick: handleBackdropClick }),
+        !hideBackdrop ? (React.createElement("div", { ...backdropProps, "aria-hidden": true, className: `${classes["backdrop"]} ${(_a = backdropProps === null || backdropProps === void 0 ? void 0 : backdropProps.className) !== null && _a !== void 0 ? _a : ""}`, onClick: handleBackdropClick })) : null,
         forceContainerOpen ? (React.createElement("div", { ...containerProps, "aria-hidden": !open, "data-element": "dialog", hidden: !open, style: { zIndex: zIndex && zIndex + 1 }, className: `${classes["container"]} ${(_b = containerProps === null || containerProps === void 0 ? void 0 : containerProps.className) !== null && _b !== void 0 ? _b : ""}` }, renderChildren())) : (open && (React.createElement("div", { ...containerProps, "data-element": "dialog", style: { zIndex: zIndex && zIndex + 1 }, className: `${classes["container"]} ${(_c = containerProps === null || containerProps === void 0 ? void 0 : containerProps.className) !== null && _c !== void 0 ? _c : ""}` }, renderChildren())))), root)));
 };
 const BaseModal = React.forwardRef(BaseModalComponent);

package/dist/esm/Notifications/BaseModal/BaseModal.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseModal.esm.js","sources":["../../../../../../src/components/Notifications/BaseModal/BaseModal.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, {\n  ForwardRefRenderFunction,\n  ComponentPropsWithRef,\n  useEffect,\n  useRef,\n  ReactElement,\n  RefObject,\n  createRef\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useGetDomRoot } from \"../../../hooks/useGetDomRoot\";\nimport classes from \"./BaseModal.module.scss\";\nimport { labelId, descriptionId } from \"./BaseModalContext\";\nimport { useRepeatFocus } from \"../../../hooks/useRepeatFocus\";\n\nconst SCROLL_PROPERTY_NAME = \"overflow\";\nconst SCROLL_PROPERTY_VALUE = \"hidden\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  id: string;\n  children: React.ReactNode;\n  open: boolean;\n  onClose?: (event?: React.MouseEvent<HTMLElement>) => unknown;\n  className?: string;\n  containerProps?: ComponentPropsWithRef<\"div\">;\n  backdropProps?: ComponentPropsWithRef<\"div\">;\n  labelledby?: string;\n  describedby?: string;\n  disableEscapeKeyDown?: boolean;\n  disableBackdrop?: boolean;\n  forceContainerOpen?: boolean;\n  zIndex?: number;\n  domRoot?: HTMLElement;\n}\n\nexport const useSetBodyScroll = (open: boolean) => {\n  const hideBodyScroll = () => {\n    document.body.style[SCROLL_PROPERTY_NAME] = SCROLL_PROPERTY_VALUE;\n  };\n\n  const showBodyScroll = () => {\n    const allModalsClosed =\n      document.querySelectorAll(\"[role=dialog][data-hidden=false]\").length === 0;\n    if (allModalsClosed) {\n      document.body.style.removeProperty(SCROLL_PROPERTY_NAME);\n    }\n  };\n\n  useEffect(() => {\n    if (open) {\n      hideBodyScroll();\n    } else {\n      showBodyScroll();\n    }\n  }, [open]);\n};\n\nconst BaseModalComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    id,\n    children,\n    open,\n    onClose,\n    className = \"\",\n    containerProps,\n    backdropProps,\n    labelledby,\n    describedby,\n    disableEscapeKeyDown = false,\n    disableBackdrop = false,\n    forceContainerOpen = false,\n    zIndex,\n    domRoot,\n    ...rest\n  }: Props,\n  ref\n) => {\n  useSetBodyScroll(open);\n  const wrappingDivRef = useRef<HTMLDivElement>(null);\n  const modalRef = (ref as RefObject<HTMLDivElement>) || createRef<HTMLDivElement>();\n  const { root } = useGetDomRoot(domRoot, wrappingDivRef);\n\n  const handleEscKeyPress = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (!disableEscapeKeyDown && event.key === \"Escape\") {\n      event.stopPropagation();\n      onClose?.();\n    }\n  };\n\n  useRepeatFocus(modalRef);\n\n  useEffect(() => {\n    if (open) {\n      modalRef.current?.focus();\n    }\n  }, [open]);\n\n  const handleBackdropClick = () => !disableBackdrop && onClose && onClose();\n\n  const renderChildren = () =>\n    React.Children.map(children, child => {\n      if (React.isValidElement(child)) {\n        return React.cloneElement(child as ReactElement, {\n          onClose: child.props.onClose ?? onClose\n        });\n      }\n      return child;\n    });\n\n  return (\n    <div ref={wrappingDivRef}>\n      {createPortal(\n        <div\n          {...rest}\n          ref={modalRef}\n          id={id}\n          className={`${classes[\"modal\"]} ${open ? classes[\"visible\"] : \"\"} ${className}`}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={labelledby ?? labelId(id)}\n          aria-describedby={describedby ?? descriptionId(id)}\n          aria-hidden={!open}\n          tabIndex={-1}\n          data-hidden={!open}\n          onKeyDown={handleEscKeyPress}\n          style={{ zIndex }}\n        >\n          <div\n            {...backdropProps}\n            aria-hidden={true}\n            className={`${classes[\"backdrop\"]} ${backdropProps?.className ?? \"\"}`}\n            onClick={handleBackdropClick}\n          ></div>\n          {forceContainerOpen ? (\n            <div\n              {...containerProps}\n              aria-hidden={!open}\n              data-element=\"dialog\"\n              hidden={!open}\n              style={{ zIndex: zIndex && zIndex + 1 }}\n              className={`${classes[\"container\"]} ${containerProps?.className ?? \"\"}`}\n            >\n              {renderChildren()}\n            </div>\n          ) : (\n            open && (\n              <div\n                {...containerProps}\n                data-element=\"dialog\"\n                style={{ zIndex: zIndex && zIndex + 1 }}\n                className={`${classes[\"container\"]} ${containerProps?.className ?? \"\"}`}\n              >\n                {renderChildren()}\n              </div>\n            )\n          )}\n        </div>,\n        root\n      )}\n    </div>\n  );\n};\n\nexport const BaseModal = React.forwardRef(BaseModalComponent);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"BaseModal.esm.js","sources":["../../../../../../src/components/Notifications/BaseModal/BaseModal.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, {\n  ForwardRefRenderFunction,\n  ComponentPropsWithRef,\n  useEffect,\n  useRef,\n  ReactElement,\n  RefObject,\n  createRef\n} from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useGetDomRoot } from \"../../../hooks/useGetDomRoot\";\nimport classes from \"./BaseModal.module.scss\";\nimport { labelId, descriptionId } from \"./BaseModalContext\";\nimport { useRepeatFocus } from \"../../../hooks/useRepeatFocus\";\n\nconst SCROLL_PROPERTY_NAME = \"overflow\";\nconst SCROLL_PROPERTY_VALUE = \"hidden\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  id: string;\n  children: React.ReactNode;\n  open: boolean;\n  onClose?: (event?: React.MouseEvent<HTMLElement>) => unknown;\n  className?: string;\n  containerProps?: ComponentPropsWithRef<\"div\">;\n  backdropProps?: ComponentPropsWithRef<\"div\">;\n  labelledby?: string;\n  describedby?: string;\n  disableEscapeKeyDown?: boolean;\n  disableBackdrop?: boolean;\n  hideBackdrop?: boolean;\n  forceContainerOpen?: boolean;\n  zIndex?: number;\n  domRoot?: HTMLElement;\n}\n\nexport const useSetBodyScroll = (open: boolean) => {\n  const hideBodyScroll = () => {\n    document.body.style[SCROLL_PROPERTY_NAME] = SCROLL_PROPERTY_VALUE;\n  };\n\n  const showBodyScroll = () => {\n    const allModalsClosed =\n      document.querySelectorAll(\"[role=dialog][data-hidden=false]\").length === 0;\n    if (allModalsClosed) {\n      document.body.style.removeProperty(SCROLL_PROPERTY_NAME);\n    }\n  };\n\n  useEffect(() => {\n    if (open) {\n      hideBodyScroll();\n    } else {\n      showBodyScroll();\n    }\n  }, [open]);\n};\n\nconst BaseModalComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    id,\n    children,\n    open,\n    onClose,\n    className = \"\",\n    containerProps,\n    backdropProps,\n    labelledby,\n    describedby,\n    disableEscapeKeyDown = false,\n    disableBackdrop = false,\n    hideBackdrop = false,\n    forceContainerOpen = false,\n    zIndex,\n    domRoot,\n    ...rest\n  }: Props,\n  ref\n) => {\n  useSetBodyScroll(open);\n  const wrappingDivRef = useRef<HTMLDivElement>(null);\n  const modalRef = (ref as RefObject<HTMLDivElement>) || createRef<HTMLDivElement>();\n  const { root } = useGetDomRoot(domRoot, wrappingDivRef);\n\n  const handleEscKeyPress = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (!disableEscapeKeyDown && event.key === \"Escape\") {\n      event.stopPropagation();\n      onClose?.();\n    }\n  };\n\n  useRepeatFocus(modalRef);\n\n  useEffect(() => {\n    if (open) {\n      modalRef.current?.focus();\n    }\n  }, [open]);\n\n  const handleBackdropClick = () => !disableBackdrop && onClose && onClose();\n\n  const renderChildren = () =>\n    React.Children.map(children, child => {\n      if (React.isValidElement(child)) {\n        return React.cloneElement(child as ReactElement, {\n          onClose: child.props.onClose ?? onClose\n        });\n      }\n      return child;\n    });\n\n  return (\n    <div ref={wrappingDivRef}>\n      {createPortal(\n        <div\n          {...rest}\n          ref={modalRef}\n          id={id}\n          className={`${classes[\"modal\"]} ${open ? classes[\"visible\"] : \"\"} ${className}`}\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={labelledby ?? labelId(id)}\n          aria-describedby={describedby ?? descriptionId(id)}\n          aria-hidden={!open}\n          tabIndex={-1}\n          data-hidden={!open}\n          onKeyDown={handleEscKeyPress}\n          style={{ zIndex }}\n        >\n          {!hideBackdrop ? (\n            <div\n              {...backdropProps}\n              aria-hidden={true}\n              className={`${classes[\"backdrop\"]} ${backdropProps?.className ?? \"\"}`}\n              onClick={handleBackdropClick}\n            ></div>\n          ) : null}\n          {forceContainerOpen ? (\n            <div\n              {...containerProps}\n              aria-hidden={!open}\n              data-element=\"dialog\"\n              hidden={!open}\n              style={{ zIndex: zIndex && zIndex + 1 }}\n              className={`${classes[\"container\"]} ${containerProps?.className ?? \"\"}`}\n            >\n              {renderChildren()}\n            </div>\n          ) : (\n            open && (\n              <div\n                {...containerProps}\n                data-element=\"dialog\"\n                style={{ zIndex: zIndex && zIndex + 1 }}\n                className={`${classes[\"container\"]} ${containerProps?.className ?? \"\"}`}\n              >\n                {renderChildren()}\n              </div>\n            )\n          )}\n        </div>,\n        root\n      )}\n    </div>\n  );\n};\n\nexport const BaseModal = React.forwardRef(BaseModalComponent);\n"],"names":[],"mappings":"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"}

package/dist/esm/Notifications/BaseModal/BaseModalHeader/BaseModalHeader.esm.js

@@ -19,11 +19,12 @@ import { Typography } from '../../../Typography/Typography.esm.js';
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
-const BaseModalHeaderComponent = ({ id, title, children, onClose, ...rest }, ref) => {
-    return (React.createElement("div", { ...rest, ref: ref, className: classes["header"] },
+const BaseModalHeaderComponent = ({ id, title, children, onClose, description, className, ...rest }, ref) => {
+    return (React.createElement("div", { ...rest, ref: ref, className: `${classes["header"]} ${className}` },
         React.createElement("div", { className: classes["headline"] },
             React.createElement("div", { className: classes["title-wrapper"] },
-                React.createElement(Typography, { id: id, className: classes["title"], tag: "h1", spacing: { marginBottom: 0 }, variant: "h4" }, title)),
+                React.createElement(Typography, { id: id, className: classes["title"], tag: "h1", spacing: { marginBottom: 0 }, variant: "h4" }, title),
+                description && (React.createElement(Typography, { id: id, className: classes["title"], tag: "span", spacing: { marginBottom: 0 }, variant: "body" }, description))),
             React.createElement(IconButton, { onClick: onClose, className: classes["closeBtn"], title: "close modal" },
                 React.createElement(Icon, { icon: Icons.Times }))),
         children));

package/dist/esm/Notifications/BaseModal/BaseModalHeader/BaseModalHeader.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseModalHeader.esm.js","sources":["../../../../../../../src/components/Notifications/BaseModal/BaseModalHeader/BaseModalHeader.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, { ForwardRefRenderFunction, ComponentPropsWithRef } from \"react\";\nimport classes from \"./BaseModalHeader.module.scss\";\nimport { IconButton } from \"../../../Button/IconButton\";\nimport { Icon, Icons } from \"../../../Icon/Icon\";\nimport { Typography } from \"../../../Typography/Typography\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  id: string;\n  title: string;\n  children?: React.ReactNode;\n  onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nconst BaseModalHeaderComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { id, title, children, onClose, ...rest }: Props,\n  ref\n) => {\n  return (\n    <div {...rest} ref={ref} className={classes[\"header\"]}>\n      <div className={classes[\"headline\"]}>\n        <div className={classes[\"title-wrapper\"]}>\n          <Typography\n            id={id}\n            className={classes[\"title\"]}\n            tag=\"h1\"\n            spacing={{ marginBottom: 0 }}\n            variant=\"h4\"\n          >\n            {title}\n          </Typography>\n        </div>\n        <IconButton onClick={onClose} className={classes[\"closeBtn\"]} title=\"close modal\">\n          <Icon icon={Icons.Times} />\n        </IconButton>\n      </div>\n      {children}\n    </div>\n  );\n};\n\nexport const BaseModalHeader = React.forwardRef(BaseModalHeaderComponent);\n"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAeH,MAAM,wBAAwB,GAAoD,CAChF,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,IAAI,EAAS,EAChD,GAAG,KACD;AACF,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAS,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,CAAC,QAAQ,CAAC,EAAA;AACnD,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,UAAU,CAAC,EAAA;AACjC,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,eAAe,CAAC,EAAA;AACtC,gBAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EACT,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,OAAO,CAAC,OAAO,CAAC,EAC3B,GAAG,EAAC,IAAI,EACR,OAAO,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,EAC5B,OAAO,EAAC,IAAI,EAEX,EAAA,KAAK,CACK,CACT;AACN,YAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,CAAC,UAAU,CAAC,EAAE,KAAK,EAAC,aAAa,EAAA;gBAC/E,KAAC,CAAA,aAAA,CAAA,IAAI,IAAC,IAAI,EAAE,KAAK,CAAC,KAAK,EAAI,CAAA,CAChB,CACT;QACL,QAAQ,CACL,EACN;AACJ,CAAC,CAAC;AAEW,MAAA,eAAe,GAAG,KAAK,CAAC,UAAU,CAAC,wBAAwB;;;;"}
+{"version":3,"file":"BaseModalHeader.esm.js","sources":["../../../../../../../src/components/Notifications/BaseModal/BaseModalHeader/BaseModalHeader.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, { ForwardRefRenderFunction, ComponentPropsWithRef } from \"react\";\nimport classes from \"./BaseModalHeader.module.scss\";\nimport { IconButton } from \"../../../Button/IconButton\";\nimport { Icon, Icons } from \"../../../Icon/Icon\";\nimport { Typography } from \"../../../Typography/Typography\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  id: string;\n  title: string;\n  description?: string;\n  children?: React.ReactNode;\n  onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nconst BaseModalHeaderComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { id, title, children, onClose, description, className, ...rest }: Props,\n  ref\n) => {\n  return (\n    <div {...rest} ref={ref} className={`${classes[\"header\"]} ${className}`}>\n      <div className={classes[\"headline\"]}>\n        <div className={classes[\"title-wrapper\"]}>\n          <Typography\n            id={id}\n            className={classes[\"title\"]}\n            tag=\"h1\"\n            spacing={{ marginBottom: 0 }}\n            variant=\"h4\"\n          >\n            {title}\n          </Typography>\n          {description && (\n            <Typography\n              id={id}\n              className={classes[\"title\"]}\n              tag=\"span\"\n              spacing={{ marginBottom: 0 }}\n              variant=\"body\"\n            >\n              {description}\n            </Typography>\n          )}\n        </div>\n        <IconButton onClick={onClose} className={classes[\"closeBtn\"]} title=\"close modal\">\n          <Icon icon={Icons.Times} />\n        </IconButton>\n      </div>\n      {children}\n    </div>\n  );\n};\n\nexport const BaseModalHeader = React.forwardRef(BaseModalHeaderComponent);\n"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAgBH,MAAM,wBAAwB,GAAoD,CAChF,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,IAAI,EAAS,EACxE,GAAG,KACD;AACF,IAAA,QACE,KAAS,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAA,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,OAAO,CAAC,QAAQ,CAAC,CAAA,CAAA,EAAI,SAAS,CAAE,CAAA,EAAA;AACrE,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,UAAU,CAAC,EAAA;AACjC,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,eAAe,CAAC,EAAA;AACtC,gBAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EACT,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,OAAO,CAAC,OAAO,CAAC,EAC3B,GAAG,EAAC,IAAI,EACR,OAAO,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,EAC5B,OAAO,EAAC,IAAI,EAAA,EAEX,KAAK,CACK;AACZ,gBAAA,WAAW,KACV,KAAC,CAAA,aAAA,CAAA,UAAU,IACT,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,OAAO,CAAC,OAAO,CAAC,EAC3B,GAAG,EAAC,MAAM,EACV,OAAO,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,EAC5B,OAAO,EAAC,MAAM,EAAA,EAEb,WAAW,CACD,CACd,CACG;AACN,YAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,CAAC,UAAU,CAAC,EAAE,KAAK,EAAC,aAAa,EAAA;gBAC/E,KAAC,CAAA,aAAA,CAAA,IAAI,IAAC,IAAI,EAAE,KAAK,CAAC,KAAK,EAAI,CAAA,CAChB,CACT;QACL,QAAQ,CACL,EACN;AACJ,CAAC,CAAC;AAEW,MAAA,eAAe,GAAG,KAAK,CAAC,UAAU,CAAC,wBAAwB;;;;"}

package/dist/esm/Notifications/SideSheet/SideSheet.esm.js

@@ -0,0 +1,59 @@
+import React, { useState, useRef, useCallback, useEffect } from 'react';
+import { BaseModal } from '../BaseModal/BaseModal.esm.js';
+import classes from './SideSheet.module.scss.esm.js';
+import { IconButton } from '../../Button/IconButton.esm.js';
+import { Icon, Icons } from '../../Icon/Icon.esm.js';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const SideSheetComponent = ({ children, id, open, handleButtonProps, ...rest }, ref) => {
+    var _a;
+    const [classHideOnTransition, setClassHideOnTransition] = useState("hide");
+    const [controlledOpen, setControlledOpen] = useState(false);
+    const containerRef = useRef(null);
+    const handleTitle = (_a = handleButtonProps === null || handleButtonProps === void 0 ? void 0 : handleButtonProps.title) !== null && _a !== void 0 ? _a : "Side sheet handle";
+    const handleButtonStyle = {
+        width: "1.5rem",
+        height: "3.5rem",
+        borderTopLeftRadius: "4px",
+        borderBottomLeftRadius: "4px"
+    };
+    const onTransitionEnd = useCallback(e => {
+        if (e.target === containerRef.current) {
+            setClassHideOnTransition(prev => (prev ? "" : "hide"));
+            if (!open && controlledOpen) {
+                setControlledOpen(false);
+            }
+        }
+    }, [open]);
+    useEffect(() => {
+        open && setControlledOpen(open);
+    }, [open]);
+    return (React.createElement(React.Fragment, null,
+        handleButtonProps && !open && (React.createElement("div", { className: classes["collapsed-sheet"] },
+            React.createElement("div", { className: classes["handle"] },
+                React.createElement(IconButton, { style: handleButtonStyle, className: classes["handle-button"], onClick: handleButtonProps.onOpen, title: handleTitle },
+                    React.createElement(Icon, { size: "0.9rem", icon: Icons.SideSheetHandle }))))),
+        React.createElement(BaseModal, { ...rest, id: id, open: controlledOpen, className: `${classes["slide-in-modal"]} ${open ? classes["visible"] : ""} ${!open ? classes[classHideOnTransition] : ""}`, containerProps: { className: classes["container"] }, hideBackdrop: true, onTransitionEnd: onTransitionEnd, ref: ref !== null && ref !== void 0 ? ref : containerRef },
+            handleButtonProps && (React.createElement("div", { className: classes["handle"] },
+                React.createElement(IconButton, { style: handleButtonStyle, title: handleTitle, onClick: handleButtonProps.onClose },
+                    React.createElement(Icon, { size: "0.9rem", icon: Icons.SideSheetHandle })))),
+            children)));
+};
+const SideSheet = React.forwardRef(SideSheetComponent);
+
+export { SideSheet };
+//# sourceMappingURL=SideSheet.esm.js.map

package/dist/esm/Notifications/SideSheet/SideSheet.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheet.esm.js","sources":["../../../../../../src/components/Notifications/SideSheet/SideSheet.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, {\n  ForwardRefRenderFunction,\n  TransitionEventHandler,\n  useState,\n  useRef,\n  useCallback,\n  useEffect\n} from \"react\";\nimport { Props as ModalProps, Modal } from \"../Modal/Modal\";\nimport classes from \"./SideSheet.module.scss\";\nimport { IconButton } from \"../../Button/IconButton\";\nimport { Icon, Icons } from \"../../Icon/Icon\";\n\nexport interface Props extends Omit<ModalProps, \"hideBackdrop\" | \"disableBackdrop\"> {\n  handleButtonProps?: {\n    onOpen: () => void;\n    onClose: () => void;\n    title?: string;\n  };\n}\n\nconst SideSheetComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { children, id, open, handleButtonProps, ...rest }: Props,\n  ref\n) => {\n  const [classHideOnTransition, setClassHideOnTransition] = useState<string>(\"hide\");\n  const [controlledOpen, setControlledOpen] = useState(false);\n  const containerRef = useRef(null);\n  const handleTitle = handleButtonProps?.title ?? \"Side sheet handle\";\n  const handleButtonStyle = {\n    width: \"1.5rem\",\n    height: \"3.5rem\",\n    borderTopLeftRadius: \"4px\",\n    borderBottomLeftRadius: \"4px\"\n  };\n\n  const onTransitionEnd: TransitionEventHandler<HTMLDivElement> = useCallback(\n    e => {\n      if (e.target === containerRef.current) {\n        setClassHideOnTransition(prev => (prev ? \"\" : \"hide\"));\n        if (!open && controlledOpen) {\n          setControlledOpen(false);\n        }\n      }\n    },\n    [open]\n  );\n\n  useEffect(() => {\n    open && setControlledOpen(open);\n  }, [open]);\n\n  return (\n    <>\n      {handleButtonProps && !open && (\n        <div className={classes[\"collapsed-sheet\"]}>\n          <div className={classes[\"handle\"]}>\n            <IconButton\n              style={handleButtonStyle}\n              className={classes[\"handle-button\"]}\n              onClick={handleButtonProps.onOpen}\n              title={handleTitle}\n            >\n              <Icon size=\"0.9rem\" icon={Icons.SideSheetHandle} />\n            </IconButton>\n          </div>\n        </div>\n      )}\n      <Modal\n        {...rest}\n        id={id}\n        open={controlledOpen}\n        className={`${classes[\"slide-in-modal\"]} ${open ? classes[\"visible\"] : \"\"} ${\n          !open ? classes[classHideOnTransition] : \"\"\n        }`}\n        containerProps={{ className: classes[\"container\"] }}\n        hideBackdrop={true}\n        onTransitionEnd={onTransitionEnd}\n        ref={ref ?? containerRef}\n      >\n        {handleButtonProps && (\n          <div className={classes[\"handle\"]}>\n            <IconButton\n              style={handleButtonStyle}\n              title={handleTitle}\n              onClick={handleButtonProps.onClose}\n            >\n              <Icon size=\"0.9rem\" icon={Icons.SideSheetHandle} />\n            </IconButton>\n          </div>\n        )}\n        {children}\n      </Modal>\n    </>\n  );\n};\n\nexport const SideSheet = React.forwardRef(SideSheetComponent);\n"],"names":["Modal"],"mappings":"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"}

package/dist/esm/Notifications/SideSheet/SideSheet.module.scss.esm.js

@@ -0,0 +1,8 @@
+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 */\n/*!\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/*!\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 */.SideSheet-module_sr-only__g1eWv{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.SideSheet-module_hidden__22TNN{display:none}.SideSheet-module_slide-in__oQik5{animation:SideSheet-module_slide-in__oQik5 .5s forwards}@media (prefers-reduced-motion:reduce){.SideSheet-module_slide-in__oQik5{animation-duration:.1ms}}.SideSheet-module_slide-out__MjR3w{animation:SideSheet-module_slide-out__MjR3w .5s forwards}@media (prefers-reduced-motion:reduce){.SideSheet-module_slide-out__MjR3w{animation-duration:.1ms}}@keyframes SideSheet-module_slide-in__oQik5{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes SideSheet-module_slide-out__MjR3w{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.SideSheet-module_slide-in-modal__6HbfR{justify-content:flex-end;left:auto;max-width:40rem;min-width:25rem;right:0;transform:translate(calc(100% - .5rem));transition-duration:.5s;transition-property:transform;transition-timing-function:ease-in-out;visibility:visible;width:33vw}@media (prefers-reduced-motion:reduce){.SideSheet-module_slide-in-modal__6HbfR{transition-duration:.1ms}}.SideSheet-module_slide-in-modal__6HbfR.SideSheet-module_hide__nrheG{visibility:hidden}.SideSheet-module_slide-in-modal__6HbfR.SideSheet-module_visible__FF6LY{transform:translate(0);visibility:visible}.SideSheet-module_slide-in-modal__6HbfR.SideSheet-module_visible__FF6LY #SideSheet-module_backdrop-slide__dyJFY{background-color:initial}.SideSheet-module_handle__-odle{align-items:center;background-color:var(--modal-background-color);border-bottom-left-radius:4px;border-top-left-radius:4px;box-shadow:-4px 4px 5px 0 var(--side-sheet-shadow-color-one),-4px 3px 14px 0 var(--side-sheet-shadow-color-two),-4px 8px 10px 0 var(--side-sheet-shadow-color-two);display:flex;height:2.5rem;justify-content:center;left:-1.5rem;padding:.5rem 0;position:absolute;top:13.25rem;width:1.5rem}.SideSheet-module_handle-button__hoQ-B{transform:rotateY(180deg)}.SideSheet-module_collapsed-sheet__7IEWg{background-color:var(--modal-background-color);height:100vh;position:absolute;right:0;top:0;width:.5rem}.SideSheet-module_collapsed-sheet__7IEWg,.SideSheet-module_container__3vMJn{box-shadow:0 4px 5px 0 var(--side-sheet-shadow-color-one),0 3px 14px 0 var(--side-sheet-shadow-color-two),0 8px 10px 0 var(--side-sheet-shadow-color-two)}.SideSheet-module_container__3vMJn{border-radius:0;height:100%;margin-top:0;max-height:unset;width:50rem}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNpZGVTaGVldC5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRTtBQUNGOzs7Ozs7Ozs7Ozs7OztFQWNFO0FBQ0Y7Ozs7Ozs7Ozs7Ozs7O0VBY0UsQ0FDRixpQ0FPRSxrQkFBc0IsQ0FDdEIsUUFBUyxDQUxULFVBQVcsQ0FFWCxXQUFZLENBQ1osZUFBZ0IsQ0FGaEIsU0FBVSxDQUhWLGlCQUFrQixDQUNsQixTQU9GLENBRUEsZ0NBQ0UsWUFDRixDQUVBLGtDQUNFLHVEQUNGLENBQ0EsdUNBQ0Usa0NBQ0UsdUJBQ0YsQ0FDRixDQUVBLG1DQUNFLHdEQUNGLENBQ0EsdUNBQ0UsbUNBQ0UsdUJBQ0YsQ0FDRixDQUVBLDRDQUNFLEdBQ0UsMkJBQ0YsQ0FDQSxHQUNFLHVCQUNGLENBQ0YsQ0FDQSw2Q0FDRSxHQUNFLHVCQUNGLENBQ0EsR0FDRSwyQkFDRixDQUNGLENBQ0Esd0NBR0Usd0JBQXlCLENBRHpCLFNBQVUsQ0FJVixlQUFnQixDQUZoQixlQUFnQixDQUhoQixPQUFRLENBT1IsdUNBQXlDLENBRXpDLHVCQUF5QixDQUR6Qiw2QkFBOEIsQ0FFOUIsc0NBQXVDLENBSnZDLGtCQUFtQixDQUZuQixVQU9GLENBQ0EsdUNBQ0Usd0NBQ0Usd0JBQ0YsQ0FDRixDQUNBLHFFQUNFLGlCQUNGLENBQ0Esd0VBRUUsc0JBQXdCLENBRHhCLGtCQUVGLENBQ0EsZ0hBQ0Usd0JBQ0YsQ0FFQSxnQ0FLRSxrQkFBbUIsQ0FPbkIsOENBQStDLENBRC9DLDZCQUE4QixDQUQ5QiwwQkFBMkIsQ0FHM0Isa0tBQTJLLENBVDNLLFlBQWEsQ0FJYixhQUFjLENBRmQsc0JBQXVCLENBSHZCLFlBQWEsQ0FNYixlQUFpQixDQVJqQixpQkFBa0IsQ0FDbEIsWUFBYSxDQUtiLFlBT0YsQ0FFQSx1Q0FDRSx5QkFDRixDQUVBLHlDQU1FLDhDQUErQyxDQUQvQyxZQUFhLENBSmIsaUJBQWtCLENBRWxCLE9BQVEsQ0FEUixLQUFNLENBRU4sV0FJRixDQUVBLDRFQUhFLHlKQVVGLENBUEEsbUNBS0UsZUFBZ0IsQ0FGaEIsV0FBWSxDQUZaLFlBQWEsQ0FHYixnQkFBaUIsQ0FGakIsV0FLRiIsImZpbGUiOiJTaWRlU2hlZXQubW9kdWxlLnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4uc3Itb25seSB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgd2lkdGg6IDFweDtcbiAgaGVpZ2h0OiAxcHg7XG4gIHBhZGRpbmc6IDA7XG4gIG1hcmdpbjogLTFweDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgY2xpcDogcmVjdCgwLCAwLCAwLCAwKTtcbiAgYm9yZGVyOiAwO1xufVxuXG4uaGlkZGVuIHtcbiAgZGlzcGxheTogbm9uZTtcbn1cblxuLnNsaWRlLWluIHtcbiAgYW5pbWF0aW9uOiBzbGlkZS1pbiAwLjVzIGZvcndhcmRzO1xufVxuQG1lZGlhIChwcmVmZXJzLXJlZHVjZWQtbW90aW9uOiByZWR1Y2UpIHtcbiAgLnNsaWRlLWluIHtcbiAgICBhbmltYXRpb24tZHVyYXRpb246IDAuMW1zO1xuICB9XG59XG5cbi5zbGlkZS1vdXQge1xuICBhbmltYXRpb246IHNsaWRlLW91dCAwLjVzIGZvcndhcmRzO1xufVxuQG1lZGlhIChwcmVmZXJzLXJlZHVjZWQtbW90aW9uOiByZWR1Y2UpIHtcbiAgLnNsaWRlLW91dCB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuXG5Aa2V5ZnJhbWVzIHNsaWRlLWluIHtcbiAgMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxMDB2aCk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDAlKTtcbiAgfVxufVxuQGtleWZyYW1lcyBzbGlkZS1vdXQge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDAlKTtcbiAgfVxuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwdmgpO1xuICB9XG59XG4uc2xpZGUtaW4tbW9kYWwge1xuICByaWdodDogMDtcbiAgbGVmdDogYXV0bztcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LWVuZDtcbiAgbWluLXdpZHRoOiAyNXJlbTtcbiAgd2lkdGg6IDMzdnc7XG4gIG1heC13aWR0aDogNDByZW07XG4gIHZpc2liaWxpdHk6IHZpc2libGU7XG4gIHRyYW5zZm9ybTogdHJhbnNsYXRlKGNhbGMoMTAwJSAtIDAuNXJlbSkpO1xuICB0cmFuc2l0aW9uLXByb3BlcnR5OiB0cmFuc2Zvcm07XG4gIHRyYW5zaXRpb24tZHVyYXRpb246IDAuNXM7XG4gIHRyYW5zaXRpb24tdGltaW5nLWZ1bmN0aW9uOiBlYXNlLWluLW91dDtcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1pbi1tb2RhbCB7XG4gICAgdHJhbnNpdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cbi5zbGlkZS1pbi1tb2RhbC5oaWRlIHtcbiAgdmlzaWJpbGl0eTogaGlkZGVuO1xufVxuLnNsaWRlLWluLW1vZGFsLnZpc2libGUge1xuICB2aXNpYmlsaXR5OiB2aXNpYmxlO1xuICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgwJSk7XG59XG4uc2xpZGUtaW4tbW9kYWwudmlzaWJsZSAjYmFja2Ryb3Atc2xpZGUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbn1cblxuLmhhbmRsZSB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxMy4yNXJlbTtcbiAgbGVmdDogLTEuNXJlbTtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIHdpZHRoOiAxLjVyZW07XG4gIGhlaWdodDogMi41cmVtO1xuICBwYWRkaW5nOiAwLjVyZW0gMDtcbiAgYm9yZGVyLXRvcC1sZWZ0LXJhZGl1czogNHB4O1xuICBib3JkZXItYm90dG9tLWxlZnQtcmFkaXVzOiA0cHg7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLW1vZGFsLWJhY2tncm91bmQtY29sb3IpO1xuICBib3gtc2hhZG93OiAtNHB4IDRweCA1cHggMHB4IHZhcigtLXNpZGUtc2hlZXQtc2hhZG93LWNvbG9yLW9uZSksIC00cHggM3B4IDE0cHggMHB4IHZhcigtLXNpZGUtc2hlZXQtc2hhZG93LWNvbG9yLXR3byksIC00cHggOHB4IDEwcHggMHB4IHZhcigtLXNpZGUtc2hlZXQtc2hhZG93LWNvbG9yLXR3byk7XG59XG5cbi5oYW5kbGUtYnV0dG9uIHtcbiAgdHJhbnNmb3JtOiByb3RhdGVZKDE4MGRlZyk7XG59XG5cbi5jb2xsYXBzZWQtc2hlZXQge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogMDtcbiAgcmlnaHQ6IDA7XG4gIHdpZHRoOiAwLjVyZW07XG4gIGhlaWdodDogMTAwdmg7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLW1vZGFsLWJhY2tncm91bmQtY29sb3IpO1xuICBib3gtc2hhZG93OiAwcHggNHB4IDVweCAwcHggdmFyKC0tc2lkZS1zaGVldC1zaGFkb3ctY29sb3Itb25lKSwgMHB4IDNweCAxNHB4IDBweCB2YXIoLS1zaWRlLXNoZWV0LXNoYWRvdy1jb2xvci10d28pLCAwcHggOHB4IDEwcHggMHB4IHZhcigtLXNpZGUtc2hlZXQtc2hhZG93LWNvbG9yLXR3byk7XG59XG5cbi5jb250YWluZXIge1xuICBtYXJnaW4tdG9wOiAwO1xuICB3aWR0aDogNTByZW07XG4gIGhlaWdodDogMTAwJTtcbiAgbWF4LWhlaWdodDogdW5zZXQ7XG4gIGJvcmRlci1yYWRpdXM6IDA7XG4gIGJveC1zaGFkb3c6IDBweCA0cHggNXB4IDBweCB2YXIoLS1zaWRlLXNoZWV0LXNoYWRvdy1jb2xvci1vbmUpLCAwcHggM3B4IDE0cHggMHB4IHZhcigtLXNpZGUtc2hlZXQtc2hhZG93LWNvbG9yLXR3byksIDBweCA4cHggMTBweCAwcHggdmFyKC0tc2lkZS1zaGVldC1zaGFkb3ctY29sb3ItdHdvKTtcbn0iXX0= */";
+var classes = {"sr-only":"SideSheet-module_sr-only__g1eWv","hidden":"SideSheet-module_hidden__22TNN","slide-in":"SideSheet-module_slide-in__oQik5","slide-out":"SideSheet-module_slide-out__MjR3w","slide-in-modal":"SideSheet-module_slide-in-modal__6HbfR","hide":"SideSheet-module_hide__nrheG","visible":"SideSheet-module_visible__FF6LY","backdrop-slide":"SideSheet-module_backdrop-slide__dyJFY","handle":"SideSheet-module_handle__-odle","handle-button":"SideSheet-module_handle-button__hoQ-B","collapsed-sheet":"SideSheet-module_collapsed-sheet__7IEWg","container":"SideSheet-module_container__3vMJn"};
+styleInject(css_248z);
+
+export { classes as default };
+//# sourceMappingURL=SideSheet.module.scss.esm.js.map

package/dist/esm/Notifications/SideSheet/SideSheet.module.scss.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheet.module.scss.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/esm/Notifications/SideSheet/SideSheetContent/SideSheetContent.esm.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { BaseModalContent } from '../../BaseModal/BaseModalContent/BaseModalContent.esm.js';
+import classes from './SideSheetContent.module.scss.esm.js';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const SideSheetContent = ({ className, ...rest }) => (React.createElement(BaseModalContent, { ...rest, className: `${classes["side-sheet-content"]} ${className}` }));
+
+export { SideSheetContent };
+//# sourceMappingURL=SideSheetContent.esm.js.map

package/dist/esm/Notifications/SideSheet/SideSheetContent/SideSheetContent.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheetContent.esm.js","sources":["../../../../../../../src/components/Notifications/SideSheet/SideSheetContent/SideSheetContent.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\";\nimport { BaseModalContent, Props } from \"../../BaseModal/BaseModalContent/BaseModalContent\";\nimport classes from \"./SideSheetContent.module.scss\";\n\nexport const SideSheetContent: React.FC<Props> = ({ className, ...rest }) => (\n  <BaseModalContent {...rest} className={`${classes[\"side-sheet-content\"]} ${className}`} />\n);\n\nexport { Props } from \"../../BaseModal/BaseModalContent/BaseModalContent\";\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAMI,MAAM,gBAAgB,GAAoB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,MACtE,KAAA,CAAA,aAAA,CAAC,gBAAgB,EAAA,EAAA,GAAK,IAAI,EAAE,SAAS,EAAE,GAAG,OAAO,CAAC,oBAAoB,CAAC,CAAI,CAAA,EAAA,SAAS,CAAE,CAAA,EAAA,CAAI;;;;"}

package/dist/esm/Notifications/SideSheet/SideSheetContent/SideSheetContent.module.scss.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = ".SideSheetContent-module_side-sheet-content__uJwNY{padding:1.5rem}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNpZGVTaGVldENvbnRlbnQubW9kdWxlLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZUEsbURBQ0UsY0FDRiIsImZpbGUiOiJTaWRlU2hlZXRDb250ZW50Lm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLnNpZGUtc2hlZXQtY29udGVudCB7XG4gIHBhZGRpbmc6IDEuNXJlbTtcbn0iXX0= */";
+var classes = {"side-sheet-content":"SideSheetContent-module_side-sheet-content__uJwNY"};
+styleInject(css_248z);
+
+export { classes as default };
+//# sourceMappingURL=SideSheetContent.module.scss.esm.js.map

package/dist/esm/Notifications/SideSheet/SideSheetContent/SideSheetContent.module.scss.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheetContent.module.scss.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/esm/Notifications/SideSheet/SideSheetHeader/SideSheetHeader.esm.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { BaseModalHeader } from '../../BaseModal/BaseModalHeader/BaseModalHeader.esm.js';
+import classes from './SideSheetHeader.module.scss.esm.js';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const SideSheetHeader = ({ className, ...rest }) => (React.createElement(BaseModalHeader, { ...rest, className: `${classes["side-sheet-header"]} ${className}` }));
+
+export { SideSheetHeader };
+//# sourceMappingURL=SideSheetHeader.esm.js.map

package/dist/esm/Notifications/SideSheet/SideSheetHeader/SideSheetHeader.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheetHeader.esm.js","sources":["../../../../../../../src/components/Notifications/SideSheet/SideSheetHeader/SideSheetHeader.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\";\nimport { BaseModalHeader, Props } from \"../../BaseModal/BaseModalHeader/BaseModalHeader\";\nimport classes from \"./SideSheetHeader.module.scss\";\n\nexport const SideSheetHeader: React.FC<Props> = ({ className, ...rest }) => (\n  <BaseModalHeader {...rest} className={`${classes[\"side-sheet-header\"]} ${className}`} />\n);\n\nexport { Props } from \"../../BaseModal/BaseModalHeader/BaseModalHeader\";\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAMI,MAAM,eAAe,GAAoB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,MACrE,KAAA,CAAA,aAAA,CAAC,eAAe,EAAA,EAAA,GAAK,IAAI,EAAE,SAAS,EAAE,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAI,CAAA,EAAA,SAAS,CAAE,CAAA,EAAA,CAAI;;;;"}

package/dist/esm/Notifications/SideSheet/SideSheetHeader/SideSheetHeader.module.scss.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = ".SideSheetHeader-module_side-sheet-header__x4ote{padding:1rem 1.5rem}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNpZGVTaGVldEhlYWRlci5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFlQSxpREFDRSxtQkFDRiIsImZpbGUiOiJTaWRlU2hlZXRIZWFkZXIubW9kdWxlLnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4uc2lkZS1zaGVldC1oZWFkZXIge1xuICBwYWRkaW5nOiAxcmVtIDEuNXJlbTtcbn0iXX0= */";
+var classes = {"side-sheet-header":"SideSheetHeader-module_side-sheet-header__x4ote"};
+styleInject(css_248z);
+
+export { classes as default };
+//# sourceMappingURL=SideSheetHeader.module.scss.esm.js.map

package/dist/esm/Notifications/SideSheet/SideSheetHeader/SideSheetHeader.module.scss.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheetHeader.module.scss.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/esm/Notifications/SlideInModal/SlideInModal.esm.js

@@ -17,6 +17,9 @@ import classes from './SlideInModal.module.scss.esm.js';
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
+/**
+ * @deprecated use the new `SideSheet` component
+ */
 const SlideInModalComponent = ({ children, id, open, ...rest }, ref) => {
     const [classHideOnTransition, setClassHideOnTransition] = useState("hide");
     const [controlledOpen, setControlledOpen] = useState(false);

package/dist/esm/Notifications/SlideInModal/SlideInModal.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SlideInModal.esm.js","sources":["../../../../../../src/components/Notifications/SlideInModal/SlideInModal.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, {\n  ForwardRefRenderFunction,\n  TransitionEventHandler,\n  useState,\n  useRef,\n  useCallback,\n  useEffect\n} from \"react\";\nimport { Props as ModalProps, Modal } from \"../Modal/Modal\";\nimport classes from \"./SlideInModal.module.scss\";\n\nconst SlideInModalComponent: ForwardRefRenderFunction<HTMLDivElement, ModalProps> = (\n  { children, id, open, ...rest }: ModalProps,\n  ref\n) => {\n  const [classHideOnTransition, setClassHideOnTransition] = useState<string>(\"hide\");\n  const [controlledOpen, setControlledOpen] = useState(false);\n  const containerRef = useRef(null);\n\n  const onTransitionEnd: TransitionEventHandler<HTMLDivElement> = useCallback(\n    e => {\n      if (e.target === containerRef.current) {\n        setClassHideOnTransition(prev => (prev ? \"\" : \"hide\"));\n        if (!open && controlledOpen) {\n          setControlledOpen(false);\n        }\n      }\n    },\n    [open]\n  );\n\n  useEffect(() => {\n    open && setControlledOpen(open);\n  }, [open]);\n\n  return (\n    <Modal\n      {...rest}\n      id={id}\n      open={controlledOpen}\n      className={`${classes[\"slide-in-modal\"]} ${open ? classes[\"visible\"] : \"\"} ${\n        !open ? classes[classHideOnTransition] : \"\"\n      }`}\n      containerProps={{ className: classes[\"container\"] }}\n      backdropProps={{ id: classes[\"backdrop-slide\"] }}\n      onTransitionEnd={onTransitionEnd}\n      ref={ref ?? containerRef}\n    >\n      {children}\n    </Modal>\n  );\n};\n\nexport type { Props } from \"../Modal/Modal\";\n\nexport const SlideInModal = React.forwardRef(SlideInModalComponent);\n"],"names":["Modal"],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAaH,MAAM,qBAAqB,GAAyD,CAClF,EAAE,QAAQ,EAAE,EAAE,EAAE,IAAI,EAAE,GAAG,IAAI,EAAc,EAC3C,GAAG,KACD;IACF,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAS,MAAM,CAAC,CAAC;IACnF,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAC5D,IAAA,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AAElC,IAAA,MAAM,eAAe,GAA2C,WAAW,CACzE,CAAC,IAAG;QACF,IAAI,CAAC,CAAC,MAAM,KAAK,YAAY,CAAC,OAAO,EAAE;AACrC,YAAA,wBAAwB,CAAC,IAAI,KAAK,IAAI,GAAG,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC;AACvD,YAAA,IAAI,CAAC,IAAI,IAAI,cAAc,EAAE;gBAC3B,iBAAiB,CAAC,KAAK,CAAC,CAAC;aAC1B;SACF;AACH,KAAC,EACD,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,IAAI,iBAAiB,CAAC,IAAI,CAAC,CAAC;AAClC,KAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;AAEX,IAAA,QACE,KAAC,CAAA,aAAA,CAAAA,SAAK,OACA,IAAI,EACR,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,cAAc,EACpB,SAAS,EAAE,CAAG,EAAA,OAAO,CAAC,gBAAgB,CAAC,CAAI,CAAA,EAAA,IAAI,GAAG,OAAO,CAAC,SAAS,CAAC,GAAG,EAAE,CAAA,CAAA,EACvE,CAAC,IAAI,GAAG,OAAO,CAAC,qBAAqB,CAAC,GAAG,EAC3C,CAAA,CAAE,EACF,cAAc,EAAE,EAAE,SAAS,EAAE,OAAO,CAAC,WAAW,CAAC,EAAE,EACnD,aAAa,EAAE,EAAE,EAAE,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAAE,EAChD,eAAe,EAAE,eAAe,EAChC,GAAG,EAAE,GAAG,aAAH,GAAG,KAAA,KAAA,CAAA,GAAH,GAAG,GAAI,YAAY,IAEvB,QAAQ,CACH,EACR;AACJ,CAAC,CAAC;AAIW,MAAA,YAAY,GAAG,KAAK,CAAC,UAAU,CAAC,qBAAqB;;;;"}
+{"version":3,"file":"SlideInModal.esm.js","sources":["../../../../../../src/components/Notifications/SlideInModal/SlideInModal.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, {\n  ForwardRefRenderFunction,\n  TransitionEventHandler,\n  useState,\n  useRef,\n  useCallback,\n  useEffect\n} from \"react\";\nimport { Props as ModalProps, Modal } from \"../Modal/Modal\";\nimport classes from \"./SlideInModal.module.scss\";\n\n/**\n * @deprecated use the new `SideSheet` component\n */\nconst SlideInModalComponent: ForwardRefRenderFunction<HTMLDivElement, ModalProps> = (\n  { children, id, open, ...rest }: ModalProps,\n  ref\n) => {\n  const [classHideOnTransition, setClassHideOnTransition] = useState<string>(\"hide\");\n  const [controlledOpen, setControlledOpen] = useState(false);\n  const containerRef = useRef(null);\n\n  const onTransitionEnd: TransitionEventHandler<HTMLDivElement> = useCallback(\n    e => {\n      if (e.target === containerRef.current) {\n        setClassHideOnTransition(prev => (prev ? \"\" : \"hide\"));\n        if (!open && controlledOpen) {\n          setControlledOpen(false);\n        }\n      }\n    },\n    [open]\n  );\n\n  useEffect(() => {\n    open && setControlledOpen(open);\n  }, [open]);\n\n  return (\n    <Modal\n      {...rest}\n      id={id}\n      open={controlledOpen}\n      className={`${classes[\"slide-in-modal\"]} ${open ? classes[\"visible\"] : \"\"} ${\n        !open ? classes[classHideOnTransition] : \"\"\n      }`}\n      containerProps={{ className: classes[\"container\"] }}\n      backdropProps={{ id: classes[\"backdrop-slide\"] }}\n      onTransitionEnd={onTransitionEnd}\n      ref={ref ?? containerRef}\n    >\n      {children}\n    </Modal>\n  );\n};\n\nexport type { Props } from \"../Modal/Modal\";\n\nexport const SlideInModal = React.forwardRef(SlideInModalComponent);\n"],"names":["Modal"],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAaH;;AAEG;AACH,MAAM,qBAAqB,GAAyD,CAClF,EAAE,QAAQ,EAAE,EAAE,EAAE,IAAI,EAAE,GAAG,IAAI,EAAc,EAC3C,GAAG,KACD;IACF,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAS,MAAM,CAAC,CAAC;IACnF,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAC5D,IAAA,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AAElC,IAAA,MAAM,eAAe,GAA2C,WAAW,CACzE,CAAC,IAAG;QACF,IAAI,CAAC,CAAC,MAAM,KAAK,YAAY,CAAC,OAAO,EAAE;AACrC,YAAA,wBAAwB,CAAC,IAAI,KAAK,IAAI,GAAG,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC;AACvD,YAAA,IAAI,CAAC,IAAI,IAAI,cAAc,EAAE;gBAC3B,iBAAiB,CAAC,KAAK,CAAC,CAAC;aAC1B;SACF;AACH,KAAC,EACD,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,IAAI,iBAAiB,CAAC,IAAI,CAAC,CAAC;AAClC,KAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;AAEX,IAAA,QACE,KAAC,CAAA,aAAA,CAAAA,SAAK,OACA,IAAI,EACR,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,cAAc,EACpB,SAAS,EAAE,CAAG,EAAA,OAAO,CAAC,gBAAgB,CAAC,CAAI,CAAA,EAAA,IAAI,GAAG,OAAO,CAAC,SAAS,CAAC,GAAG,EAAE,CAAA,CAAA,EACvE,CAAC,IAAI,GAAG,OAAO,CAAC,qBAAqB,CAAC,GAAG,EAC3C,CAAA,CAAE,EACF,cAAc,EAAE,EAAE,SAAS,EAAE,OAAO,CAAC,WAAW,CAAC,EAAE,EACnD,aAAa,EAAE,EAAE,EAAE,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAAE,EAChD,eAAe,EAAE,eAAe,EAChC,GAAG,EAAE,GAAG,aAAH,GAAG,KAAA,KAAA,CAAA,GAAH,GAAG,GAAI,YAAY,IAEvB,QAAQ,CACH,EACR;AACJ,CAAC,CAAC;AAIW,MAAA,YAAY,GAAG,KAAK,CAAC,UAAU,CAAC,qBAAqB;;;;"}

package/dist/esm/Spinner/Spinner.esm.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import classes from './Spinner.module.scss.esm.js';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const Spinner = ({ size = 32, thickness, ...props }) => {
+    if (!thickness) {
+        thickness = size / 16;
+    }
+    return (React.createElement("svg", { ...props, className: classes["spinner"], width: size, height: size, viewBox: `0 0 ${size} ${size}`, fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("circle", { cx: size / 2, cy: size / 2, r: (size - thickness) / 2, stroke: "var(--orbit-color)", strokeWidth: thickness, fill: "none" }),
+        React.createElement("circle", { className: classes["arch"], cx: size / 2, cy: size / 2, r: (size - thickness) / 2, stroke: "var(--arch-color)", strokeWidth: thickness, strokeLinecap: "round", fill: "none", strokeDasharray: `${size}`, transform: "rotate(-90 25 25)" })));
+};
+
+export { Spinner };
+//# sourceMappingURL=Spinner.esm.js.map

package/dist/esm/Spinner/Spinner.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.esm.js","sources":["../../../../../src/components/Spinner/Spinner.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\";\nimport classes from \"./Spinner.module.scss\";\n\nexport interface SpinnerProps extends React.SVGProps<SVGSVGElement> {\n  size?: number;\n  thickness?: number;\n}\n\nexport const Spinner: React.FC<SpinnerProps> = ({ size = 32, thickness, ...props }) => {\n  if (!thickness) {\n    thickness = size / 16;\n  }\n  return (\n    <svg\n      {...props}\n      className={classes[\"spinner\"]}\n      width={size}\n      height={size}\n      viewBox={`0 0 ${size} ${size}`}\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <circle\n        cx={size / 2}\n        cy={size / 2}\n        r={(size - thickness) / 2}\n        stroke=\"var(--orbit-color)\"\n        strokeWidth={thickness}\n        fill=\"none\"\n      ></circle>\n      <circle\n        className={classes[\"arch\"]}\n        cx={size / 2}\n        cy={size / 2}\n        r={(size - thickness) / 2}\n        stroke=\"var(--arch-color)\"\n        strokeWidth={thickness}\n        strokeLinecap=\"round\"\n        fill=\"none\"\n        strokeDasharray={`${size}`}\n        transform=\"rotate(-90 25 25)\"\n      />\n    </svg>\n  );\n};\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;AAUU,MAAA,OAAO,GAA2B,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,KAAI;IACpF,IAAI,CAAC,SAAS,EAAE;AACd,QAAA,SAAS,GAAG,IAAI,GAAG,EAAE,CAAC;KACvB;AACD,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GACM,KAAK,EACT,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAC7B,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,CAAA,IAAA,EAAO,IAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,EAC9B,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAAA;AAElC,QAAA,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,EAAE,EAAE,IAAI,GAAG,CAAC,EACZ,EAAE,EAAE,IAAI,GAAG,CAAC,EACZ,CAAC,EAAE,CAAC,IAAI,GAAG,SAAS,IAAI,CAAC,EACzB,MAAM,EAAC,oBAAoB,EAC3B,WAAW,EAAE,SAAS,EACtB,IAAI,EAAC,MAAM,EACH,CAAA;QACV,KACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,MAAM,CAAC,EAC1B,EAAE,EAAE,IAAI,GAAG,CAAC,EACZ,EAAE,EAAE,IAAI,GAAG,CAAC,EACZ,CAAC,EAAE,CAAC,IAAI,GAAG,SAAS,IAAI,CAAC,EACzB,MAAM,EAAC,mBAAmB,EAC1B,WAAW,EAAE,SAAS,EACtB,aAAa,EAAC,OAAO,EACrB,IAAI,EAAC,MAAM,EACX,eAAe,EAAE,CAAG,EAAA,IAAI,CAAE,CAAA,EAC1B,SAAS,EAAC,mBAAmB,EAAA,CAC7B,CACE,EACN;AACJ;;;;"}

package/dist/esm/Spinner/Spinner.module.scss.esm.js

@@ -0,0 +1,8 @@
+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 */\n/*!\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 */.Spinner-module_sr-only__xhjJ8{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.Spinner-module_hidden__Oy9-U{display:none}.Spinner-module_slide-in__APLCs{animation:Spinner-module_slide-in__APLCs .5s forwards}@media (prefers-reduced-motion:reduce){.Spinner-module_slide-in__APLCs{animation-duration:.1ms}}.Spinner-module_slide-out__G8udv{animation:Spinner-module_slide-out__G8udv .5s forwards}@media (prefers-reduced-motion:reduce){.Spinner-module_slide-out__G8udv{animation-duration:.1ms}}@keyframes Spinner-module_slide-in__APLCs{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes Spinner-module_slide-out__G8udv{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.Spinner-module_spinner__SZoUP{--orbit-color:var(--color-blue-grey100);--arch-color:var(--color-blue-grey900)}@keyframes Spinner-module_rotate__ZJ5Dg{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.Spinner-module_spinner__SZoUP .Spinner-module_arch__tNBgF{animation:Spinner-module_rotate__ZJ5Dg 1s linear infinite;transform-origin:center}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNwaW5uZXIubW9kdWxlLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7Ozs7Ozs7Ozs7Ozs7O0VBY0U7QUFDRjs7Ozs7Ozs7Ozs7Ozs7RUFjRSxDQUNGLCtCQU9FLGtCQUFzQixDQUN0QixRQUFTLENBTFQsVUFBVyxDQUVYLFdBQVksQ0FDWixlQUFnQixDQUZoQixTQUFVLENBSFYsaUJBQWtCLENBQ2xCLFNBT0YsQ0FFQSw4QkFDRSxZQUNGLENBRUEsZ0NBQ0UscURBQ0YsQ0FFQSx1Q0FDRSxnQ0FDRSx1QkFDRixDQUNGLENBQ0EsaUNBQ0Usc0RBQ0YsQ0FFQSx1Q0FDRSxpQ0FDRSx1QkFDRixDQUNGLENBQ0EsMENBQ0UsR0FDRSwyQkFDRixDQUNBLEdBQ0UsdUJBQ0YsQ0FDRixDQUNBLDJDQUNFLEdBQ0UsdUJBQ0YsQ0FDQSxHQUNFLDJCQUNGLENBQ0YsQ0FDQSwrQkFDRSx1Q0FBd0MsQ0FDeEMsc0NBQ0YsQ0FDQSx3Q0FDRSxHQUNFLHNCQUNGLENBQ0EsR0FDRSx1QkFDRixDQUNGLENBQ0EsMkRBQ0UseURBQW9DLENBQ3BDLHVCQUNGIiwiZmlsZSI6IlNwaW5uZXIubW9kdWxlLnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi5zci1vbmx5IHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMXB4O1xuICBoZWlnaHQ6IDFweDtcbiAgcGFkZGluZzogMDtcbiAgbWFyZ2luOiAtMXB4O1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBjbGlwOiByZWN0KDAsIDAsIDAsIDApO1xuICBib3JkZXI6IDA7XG59XG5cbi5oaWRkZW4ge1xuICBkaXNwbGF5OiBub25lO1xufVxuXG4uc2xpZGUtaW4ge1xuICBhbmltYXRpb246IHNsaWRlLWluIDAuNXMgZm9yd2FyZHM7XG59XG5cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1pbiB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuLnNsaWRlLW91dCB7XG4gIGFuaW1hdGlvbjogc2xpZGUtb3V0IDAuNXMgZm9yd2FyZHM7XG59XG5cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1vdXQge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cbkBrZXlmcmFtZXMgc2xpZGUtaW4ge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG59XG5Aa2V5ZnJhbWVzIHNsaWRlLW91dCB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxMDB2aCk7XG4gIH1cbn1cbi5zcGlubmVyIHtcbiAgLS1vcmJpdC1jb2xvcjogdmFyKC0tY29sb3ItYmx1ZS1ncmV5MTAwKTtcbiAgLS1hcmNoLWNvbG9yOiB2YXIoLS1jb2xvci1ibHVlLWdyZXk5MDApO1xufVxuQGtleWZyYW1lcyByb3RhdGUge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiByb3RhdGUoMzYwZGVnKTtcbiAgfVxufVxuLnNwaW5uZXIgLmFyY2gge1xuICBhbmltYXRpb246IHJvdGF0ZSAxcyBsaW5lYXIgaW5maW5pdGU7XG4gIHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlcjtcbn0iXX0= */";
+var classes = {"sr-only":"Spinner-module_sr-only__xhjJ8","hidden":"Spinner-module_hidden__Oy9-U","slide-in":"Spinner-module_slide-in__APLCs","slide-out":"Spinner-module_slide-out__G8udv","spinner":"Spinner-module_spinner__SZoUP","arch":"Spinner-module_arch__tNBgF","rotate":"Spinner-module_rotate__ZJ5Dg"};
+styleInject(css_248z);
+
+export { classes as default };
+//# sourceMappingURL=Spinner.module.scss.esm.js.map

package/dist/esm/Spinner/Spinner.module.scss.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.module.scss.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/esm/_BaseStyling_/BaseStyling.esm.js

@@ -116,6 +116,8 @@ const BaseStyling = ({ children, properties = {} }) => {
         modalShadowColor: "rgba(0, 0, 0, 0.16)",
         modalBackgroundColor: "var(--light)",
         modalBackdropColor: "var(--default)",
+        sideSheetShadowColorOne: "#01053214",
+        sideSheetShadowColorTwo: "#0105320a",
         skeletonBackgroundColor: "var(--disabled)",
         skeletonAnimationColorRgb: "255, 255, 255",
         alertTextColor: "var(--default)",

package/dist/esm/_BaseStyling_/BaseStyling.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseStyling.esm.js","sources":["../../../../../src/components/_BaseStyling_/BaseStyling.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\n/**\n * If you add more CSS variables, and they are a color, make sure to go into /.storybook/addon/src/components/PanelContent.tsx\n * and make sure to add it to the shouldBeColorPicker array!\n */\n\nimport React, { HTMLAttributes, ReactElement, useEffect, useRef, useState } from \"react\";\n\ninterface CSSProperties {\n  colorFocus?: string;\n  colorPrimary?: string;\n  colorSuccess?: string;\n  colorWarning?: string;\n  colorDanger?: string;\n  colorPrimary100?: string;\n  colorPrimary300?: string;\n  colorPrimary500?: string;\n  colorPrimary600?: string;\n  colorPrimary700?: string;\n  colorPrimary900?: string;\n  colorPrimary50?: string;\n  colorBlueGrey100?: string;\n  colorBlueGrey200?: string;\n  colorBlueGrey300?: string;\n  colorBlueGrey400?: string;\n  colorBlueGrey25?: string;\n  colorBlueGrey50?: string;\n  colorBlueGrey500?: string;\n  colorBlueGrey700?: string;\n  colorBlueGrey800?: string;\n  colorBlueGrey900?: string;\n  colorGreen100?: string;\n  colorGreen200?: string;\n  colorGreen500?: string;\n  colorGreen600?: string;\n  colorGreen700?: string;\n  colorOrange100?: string;\n  colorOrange500?: string;\n  colorOrange600?: string;\n  colorOrange700?: string;\n  colorRed100?: string;\n  colorRed200?: string;\n  colorRed500?: string;\n  colorRed600?: string;\n  colorRed700?: string;\n  colorWhite?: string;\n  colorBlack100?: string;\n  colorBlack20?: string;\n  colorBlack10?: string;\n  defaultPressedColor?: string;\n  defaultHoverColor?: string;\n  defaultLineHeight?: string;\n  dataGridLineHeight?: string;\n  focusBorderRadius?: string;\n  buttonBorderRadius?: string;\n  buttonBorderWidth?: string;\n  buttonFontSize?: string;\n  buttonBorderStyle?: string;\n  buttonPrimaryDefaultColor?: string;\n  buttonPrimaryPressedColor?: string;\n  buttonFillTextColor?: string;\n  buttonPrimaryHoverColor?: string;\n  buttonPrimaryFocusedColor?: string;\n  buttonOutlineHoverTextColor?: string;\n  buttonSuccessDefaultColor?: string;\n  buttonSuccessHoverColor?: string;\n  buttonSuccessFocusedColor?: string;\n  buttonSuccessPressedColor?: string;\n  buttonDangerDefaultColor?: string;\n  buttonDangerHoverColor?: string;\n  buttonDangerFocusedColor?: string;\n  buttonDangerPressedColor?: string;\n  buttonWarningDefaultColor?: string;\n  buttonWarningHoverColor?: string;\n  buttonWarningFocusedColor?: string;\n  buttonWarningPressedColor?: string;\n  buttonDefaultColor?: string;\n  buttonDefaultHoverColor?: string;\n  buttonDefaultFocusedColor?: string;\n  buttonDefaultPressedColor?: string;\n  buttonOutlineActiveTextColor?: string;\n  checkboxUncheckedHoverColor?: string;\n  checkboxUncheckedPressedColor?: string;\n  checkboxCheckedHoverColor?: string;\n  checkboxCheckedPressedColor?: string;\n  radioHoverBackgroundColor?: string;\n  radioPressedBackgroundColor?: string;\n  radioHoverColor?: string;\n  radioPressedColor?: string;\n  defaultBorderRadius?: string;\n  inputBorderRadius?: string;\n  inputBorderWidth?: string;\n  inputBorderWidthFocus?: string;\n  inputBorderStyle?: string;\n  inputBorderColor?: string;\n  inputBackgroundColor?: string;\n  inputHelperTextColor?: string;\n  inputHoverBackgroundColor?: string;\n  inputDisabledBackgroundColor?: string;\n  dragBorderStyle?: string;\n  modalShadowColor?: string;\n  modalBackgroundColor?: string;\n  modalBackdropColor?: string;\n  skeletonBackgroundColor?: string;\n  skeletonAnimationColorRgb?: string;\n\n  alertTextColor?: string;\n  alertTextInvertedColor?: string;\n\n  alertNeutralBackgroundColor?: string;\n  alertInfoBackgroundColor?: string;\n  alertSuccessBackgroundColor?: string;\n  alertErrorBackgroundColor?: string;\n  alertWarningBackgroundColor?: string;\n\n  alertNeutralInvertedColor?: string;\n  alertInfoInvertedColor?: string;\n  alertSuccessInvertedColor?: string;\n  alertErrorInvertedColor?: string;\n  alertWarningInvertedColor?: string;\n\n  alertBorderWidth?: string;\n  alertBorderRadius?: string;\n\n  stepperWaitingColor?: string;\n  stepperWaitingHoverColor?: string;\n  stepperWaitingActiveColor?: string;\n  stepperWaitingDisabledColor?: string;\n  stepperCurrentColor?: string;\n  stepperCurrentHoverColor?: string;\n  stepperCurrentActiveColor?: string;\n  stepperCurrentDisabledColor?: string;\n  stepperDoneColor?: string;\n  stepperDoneHoverColor?: string;\n  stepperDoneActiveColor?: string;\n  stepperDoneDisabledColor?: string;\n  stepperErrorColor?: string;\n  stepperErrorHoverColor?: string;\n  stepperErrorActiveColor?: string;\n  stepperErrorDisabledColor?: string;\n  stepperDefaultTextColor?: string;\n  stepperLineColor?: string;\n  stepperLineBoldColor?: string;\n  stepperLineDisabledColor?: string;\n  stepperLineBoldDisabledColor?: string;\n  stepperLabelColor?: string;\n  stepperCaptionColor?: string;\n  stepperCaptionErrorColor?: string;\n  stepperLabelDisabledColor?: string;\n  stepperCaptionDisabledColor?: string;\n  stepperCaptionErrorDisabledColor?: string;\n  bannerBorderRadius?: string;\n  bannerBorderWidth?: string;\n  dataGridRowBackgroundColor?: string;\n  dataGridRowHoverBackgroundColor?: string;\n  progressBarBackgroundColor?: string;\n  tabsBackgroundColor?: string;\n  tabActiveBorderHeight?: string;\n  tabActiveBorderColor?: string;\n  tabActiveTextColor?: string;\n  tablistBorderWidth?: string;\n  tablistBorderStyle?: string;\n  tablistBorderColor?: string;\n  tabTextColor?: string;\n  tabHoverColor?: string;\n  tabPressedColor?: string;\n  toggleBackgroundColor?: string;\n  tooltipBackgroundColor?: string;\n  contextMenuHoverColor?: string;\n  contextMenuPressedColor?: string;\n  default?: string;\n  success?: string;\n  error?: string;\n  info?: string;\n  disabled?: string;\n  greyedOut?: string;\n  lightGreyBorder?: string;\n  warning?: string;\n  light?: string;\n  fontFamily?: string;\n  fontFamilyCode?: string;\n  fontSizeFormLabel?: string;\n  fontSize?: string;\n  fontSizeH1?: string;\n  fontSizeH2?: string;\n  fontSizeH3?: string;\n  fontSizeH4?: string;\n  fontSizeSub?: string;\n  fontSizeCode?: string;\n  formControlFontSize?: string;\n  fileUploadBorderWidth?: string;\n  dragDropBorderStyle?: string;\n  fontSizeDataGrid?: string;\n}\n\nexport interface Props extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactElement[] | ReactElement | string[] | string | number[] | number;\n  properties?: CSSProperties;\n}\n\nexport const BaseStyling = ({ children, properties = {} }: Props) => {\n  const defaultProperties: CSSProperties = {\n    colorPrimary50: \"#E6E7F4\",\n    colorPrimary100: \"#CDD0EA\",\n    colorPrimary300: \"#6871BF\",\n    colorPrimary500: \"#041295\",\n    colorPrimary600: \"#030F77\",\n    colorPrimary700: \"#020B59\",\n    colorPrimary900: \"#01041E\",\n    colorBlueGrey25: \"#F7F7F9\",\n    colorBlueGrey50: \"#EEEFF3\",\n    colorBlueGrey100: \"#DEDEE6\",\n    colorBlueGrey200: \"#BCBECE\",\n    colorBlueGrey300: \"#9A9DB5\",\n    colorBlueGrey400: \"#797D9C\",\n    colorBlueGrey500: \"#5D607E\",\n    colorBlueGrey700: \"#383A4B\",\n    colorBlueGrey800: \"#252733\",\n    colorBlueGrey900: \"#131319\",\n    colorGreen100: \"#D1E6DA\",\n    colorGreen200: \"#A2CDB4\",\n    colorGreen500: \"#178244\",\n    colorGreen600: \"#126836\",\n    colorGreen700: \"#0E4E29\",\n    colorOrange100: \"#FFE0B2\",\n    colorOrange500: \"#E07900\",\n    colorOrange600: \"#B36100\",\n    colorOrange700: \"#864900\",\n    colorRed100: \"#FFCDD2\",\n    colorRed200: \"#F3A599\",\n    colorRed500: \"#E01E00\",\n    colorRed600: \"#B31800\",\n    colorRed700: \"#861200\",\n    colorBlack100: \"#000000\",\n    colorBlack20: \"rgba(0, 0, 0, 0.2)\",\n    colorBlack10: \"rgba(0, 0, 0, 0.1)\",\n    colorWhite: \"#FFFFFF\",\n    colorFocus: \"var(--color-primary300)\",\n    colorPrimary: \"var(--color-primary500)\",\n    colorSuccess: \"var(--color-green500)\",\n    colorWarning: \"var(--color-orange500)\",\n    colorDanger: \"var(--color-red500)\",\n    defaultPressedColor: \"var(--color-blue-grey100)\",\n    defaultHoverColor: \"var(--color-blue-grey25)\",\n    defaultLineHeight: \"1.5\", //FIXME: UCL-395\n    dataGridLineHeight: \"1.25\",\n    defaultBorderRadius: \"0.25rem\",\n    focusBorderRadius: \"0.125rem\",\n    buttonBorderRadius: \"0.125rem\",\n    buttonBorderWidth: \"2px\",\n    buttonFontSize: \"0.875rem\",\n    buttonBorderStyle: \"solid\",\n    buttonFillTextColor: \"var(--light)\",\n    buttonPrimaryDefaultColor: \"var(--color-primary500)\",\n    buttonPrimaryHoverColor: \"var(--color-primary600)\",\n    buttonPrimaryFocusedColor: \"var(--color-primary500)\",\n    buttonPrimaryPressedColor: \"var(--color-primary700)\",\n    buttonSuccessDefaultColor: \"var(--color-green500)\",\n    buttonSuccessHoverColor: \"var(--color-green600)\",\n    buttonSuccessFocusedColor: \"var(--color-green500)\",\n    buttonSuccessPressedColor: \"var(--color-green700)\",\n    buttonDangerDefaultColor: \"var(--color-red500)\",\n    buttonDangerHoverColor: \"var(--color-red600)\",\n    buttonDangerFocusedColor: \"var(--color-red500)\",\n    buttonDangerPressedColor: \"var(--color-red700)\",\n    buttonWarningDefaultColor: \"var(--color-orange500)\",\n    buttonWarningHoverColor: \"var(--color-orange600)\",\n    buttonWarningFocusedColor: \"var(--color-orange500)\",\n    buttonWarningPressedColor: \"var(--color-orange700)\",\n    buttonDefaultColor: \"var(--color-blue-grey700)\",\n    buttonDefaultHoverColor: \"var(--color-blue-grey800)\",\n    buttonDefaultFocusedColor: \"var(--color-blue-grey700)\",\n    buttonDefaultPressedColor: \"var(--color-blue-grey800)\",\n    buttonOutlineHoverTextColor: \"var(--color-primary600)\",\n    checkboxUncheckedHoverColor: \"var(--color-blue-grey50)\",\n    checkboxUncheckedPressedColor: \"var(--default-pressed-color)\",\n    checkboxCheckedHoverColor: \"var(--color-primary600)\",\n    checkboxCheckedPressedColor: \"var(--color-primary700)\",\n    radioHoverBackgroundColor: \"var(--color-blue-grey50)\",\n    radioPressedBackgroundColor: \"var(--default-pressed-color)\",\n    radioHoverColor: \"var(--color-primary600)\",\n    radioPressedColor: \"var(--color-primary700)\",\n    inputBorderRadius: \"2px\",\n    inputBorderWidth: \"1px\",\n    inputBorderWidthFocus: \"1px\",\n    inputBorderStyle: \"solid\",\n    fileUploadBorderWidth: \"1px\",\n    dragDropBorderStyle: \"dashed\",\n    inputBorderColor: \"var(--color-blue-grey500)\",\n    inputBackgroundColor: \"var(--light)\",\n    inputHelperTextColor: \"var(--color-blue-grey500)\",\n    inputHoverBackgroundColor: \"var(--default-hover-color)\",\n    inputDisabledBackgroundColor: \"var(--input-hover-background-color)\",\n    dragBorderStyle: \"solid\",\n    modalShadowColor: \"rgba(0, 0, 0, 0.16)\",\n    modalBackgroundColor: \"var(--light)\",\n    modalBackdropColor: \"var(--default)\",\n    skeletonBackgroundColor: \"var(--disabled)\",\n    skeletonAnimationColorRgb: \"255, 255, 255\",\n\n    alertTextColor: \"var(--default)\",\n    alertTextInvertedColor: \"var(--light)\",\n\n    alertNeutralBackgroundColor: \"var(--color-blue-grey50)\",\n    alertNeutralInvertedColor: \"var(--color-blue-grey500)\",\n\n    alertInfoBackgroundColor: \"var(--color-primary100)\",\n    alertInfoInvertedColor: \"var(--color-primary500)\",\n\n    alertSuccessBackgroundColor: \"var(--color-green100)\",\n    alertSuccessInvertedColor: \"var(--color-green500)\",\n\n    alertErrorBackgroundColor: \"var(--color-red100)\",\n    alertErrorInvertedColor: \"var(--color-red500)\",\n\n    alertWarningBackgroundColor: \"var(--color-orange100)\",\n    alertWarningInvertedColor: \"var(--color-orange500)\",\n\n    alertBorderWidth: \"4px\",\n    alertBorderRadius: \"2px\",\n\n    stepperWaitingColor: \"var(--color-blue-grey200)\",\n    stepperWaitingHoverColor: \"var(--color-blue-grey300)\",\n    stepperWaitingActiveColor: \"var(--color-blue-grey400)\",\n    stepperWaitingDisabledColor: \"var(--color-blue-grey100)\",\n    stepperCurrentColor: \"var(--color-primary500)\",\n    stepperCurrentHoverColor: \"var(--color-primary600)\",\n    stepperCurrentActiveColor: \"var(--color-primary700)\",\n    stepperCurrentDisabledColor: \"var(--color-primary100)\",\n    stepperDoneColor: \"var(--color-green500)\",\n    stepperDoneHoverColor: \"var(--color-green600)\",\n    stepperDoneActiveColor: \"var(--color-green700)\",\n    stepperDoneDisabledColor: \"var(--color-green200)\",\n    stepperErrorColor: \"var(--color-red500)\",\n    stepperErrorHoverColor: \"var(--color-red600)\",\n    stepperErrorActiveColor: \"var(--color-red700)\",\n    stepperErrorDisabledColor: \"var(--color-red200)\",\n    stepperDefaultTextColor: \"var(--color-white)\",\n    stepperLineColor: \"var(--color-blue-grey300)\",\n    stepperLineBoldColor: \"var(--color-blue-grey700)\",\n    stepperLineDisabledColor: \"var(--color-blue-grey100)\",\n    stepperLineBoldDisabledColor: \"var(--color-blue-grey300)\",\n    stepperLabelColor: \"var(--color-blue-grey900)\",\n    stepperCaptionColor: \"var(--color-blue-grey500)\",\n    stepperCaptionErrorColor: \"var(--color-red500)\",\n    stepperLabelDisabledColor: \"var(--color-blue-grey400)\",\n    stepperCaptionDisabledColor: \"var(--color-blue-grey400)\",\n    stepperCaptionErrorDisabledColor: \"var(--color-red200)\",\n    bannerBorderRadius: \"2px\",\n    bannerBorderWidth: \"0 0 0 4px\",\n    dataGridRowBackgroundColor: \"transparent\",\n    dataGridRowHoverBackgroundColor: \"var(--default-hover-color)\",\n    progressBarBackgroundColor: \"var(--disabled)\",\n    tabsBackgroundColor: \"var(--light)\",\n    tabActiveBorderHeight: \"0.25rem\",\n    tabActiveBorderColor: \"var(--color-primary)\",\n    tabActiveTextColor: \"var(--color-primary)\",\n    tablistBorderWidth: \"0.0625rem\",\n    tablistBorderStyle: \"solid\",\n    tablistBorderColor: \"var(--color-blue-grey100)\",\n    tabTextColor: \"var(--color-blue-grey900)\",\n    tabHoverColor: \"var(--default-hover-color)\",\n    tabPressedColor: \"var(--default-pressed-color)\",\n    toggleBackgroundColor: \"var(--color-blue-grey100)\",\n    tooltipBackgroundColor: \"var(--default)\",\n    contextMenuHoverColor: \"var(--default-hover-color)\",\n    contextMenuPressedColor: \"var(--default-pressed-color)\",\n    default: \"var(--color-blue-grey900)\",\n    success: \"var(--color-green500)\",\n    error: \"var(--color-red500)\",\n    info: \"var(--color-primary500)\",\n    disabled: \"var(--color-blue-grey100)\",\n    greyedOut: \"var(--color-blue-grey400)\",\n    lightGreyBorder: \"var(--color-blue-grey100)\",\n    warning: \"var(--color-orange500)\",\n    light: \"var(--color-white)\",\n    fontFamily: \"Roboto, sans-serif\",\n    fontFamilyCode: \"'Roboto Mono', monospace\",\n    fontSizeFormLabel: \"0.875rem\", //FIXME: UCL-395\n    fontSize: \"1rem\", //FIXME: UCL-395\n    fontSizeH1: \"2.5rem\",\n    fontSizeH2: \"1.625rem\",\n    fontSizeH3: \"1.5rem\",\n    fontSizeH4: \"1.25rem\",\n    fontSizeSub: \".75rem\",\n    fontSizeCode: \"1rem\",\n    formControlFontSize: \"0.875rem\", //FIXME: UCL-395\n    fontSizeDataGrid: \"0.875rem\" //FIXME: UCL-395\n  };\n\n  /** We need a loading state, because otherwise you see the colors flash from the default to the possible overridden ones. */\n  const [isLoading, setIsLoading] = useState(true);\n  const baseStylingWrapper = useRef(null);\n\n  const setCSSProperties = (CSSPropertiesObject: CSSProperties) => {\n    for (const [key, value] of Object.entries(CSSPropertiesObject)) {\n      const formattedPropertyName = key.replace(/([A-Z])/g, val => `-${val.toLowerCase()}`);\n      (baseStylingWrapper.current! as HTMLElement).style.setProperty(\n        `--${formattedPropertyName}`,\n        value\n      );\n    }\n  };\n\n  useEffect(() => {\n    if (Object.keys(properties).length !== 0 && baseStylingWrapper.current) {\n      const mergedState = { ...defaultProperties, ...properties };\n      setCSSProperties(mergedState);\n    } else if (baseStylingWrapper.current) {\n      setCSSProperties(defaultProperties);\n    }\n    setIsLoading(false);\n  }, [properties, baseStylingWrapper.current]);\n\n  return (\n    <div className=\"basestyling-wrapper\" ref={baseStylingWrapper}>\n      {!isLoading ? children : null}\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"BaseStyling.esm.js","sources":["../../../../../src/components/_BaseStyling_/BaseStyling.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\n/**\n * If you add more CSS variables, and they are a color, make sure to go into /.storybook/addon/src/components/PanelContent.tsx\n * and make sure to add it to the shouldBeColorPicker array!\n */\n\nimport React, { HTMLAttributes, ReactElement, useEffect, useRef, useState } from \"react\";\n\ninterface CSSProperties {\n  colorFocus?: string;\n  colorPrimary?: string;\n  colorSuccess?: string;\n  colorWarning?: string;\n  colorDanger?: string;\n  colorPrimary100?: string;\n  colorPrimary300?: string;\n  colorPrimary500?: string;\n  colorPrimary600?: string;\n  colorPrimary700?: string;\n  colorPrimary900?: string;\n  colorPrimary50?: string;\n  colorBlueGrey100?: string;\n  colorBlueGrey200?: string;\n  colorBlueGrey300?: string;\n  colorBlueGrey400?: string;\n  colorBlueGrey25?: string;\n  colorBlueGrey50?: string;\n  colorBlueGrey500?: string;\n  colorBlueGrey700?: string;\n  colorBlueGrey800?: string;\n  colorBlueGrey900?: string;\n  colorGreen100?: string;\n  colorGreen200?: string;\n  colorGreen500?: string;\n  colorGreen600?: string;\n  colorGreen700?: string;\n  colorOrange100?: string;\n  colorOrange500?: string;\n  colorOrange600?: string;\n  colorOrange700?: string;\n  colorRed100?: string;\n  colorRed200?: string;\n  colorRed500?: string;\n  colorRed600?: string;\n  colorRed700?: string;\n  colorWhite?: string;\n  colorBlack100?: string;\n  colorBlack20?: string;\n  colorBlack10?: string;\n  defaultPressedColor?: string;\n  defaultHoverColor?: string;\n  defaultLineHeight?: string;\n  dataGridLineHeight?: string;\n  focusBorderRadius?: string;\n  buttonBorderRadius?: string;\n  buttonBorderWidth?: string;\n  buttonFontSize?: string;\n  buttonBorderStyle?: string;\n  buttonPrimaryDefaultColor?: string;\n  buttonPrimaryPressedColor?: string;\n  buttonFillTextColor?: string;\n  buttonPrimaryHoverColor?: string;\n  buttonPrimaryFocusedColor?: string;\n  buttonOutlineHoverTextColor?: string;\n  buttonSuccessDefaultColor?: string;\n  buttonSuccessHoverColor?: string;\n  buttonSuccessFocusedColor?: string;\n  buttonSuccessPressedColor?: string;\n  buttonDangerDefaultColor?: string;\n  buttonDangerHoverColor?: string;\n  buttonDangerFocusedColor?: string;\n  buttonDangerPressedColor?: string;\n  buttonWarningDefaultColor?: string;\n  buttonWarningHoverColor?: string;\n  buttonWarningFocusedColor?: string;\n  buttonWarningPressedColor?: string;\n  buttonDefaultColor?: string;\n  buttonDefaultHoverColor?: string;\n  buttonDefaultFocusedColor?: string;\n  buttonDefaultPressedColor?: string;\n  buttonOutlineActiveTextColor?: string;\n  checkboxUncheckedHoverColor?: string;\n  checkboxUncheckedPressedColor?: string;\n  checkboxCheckedHoverColor?: string;\n  checkboxCheckedPressedColor?: string;\n  radioHoverBackgroundColor?: string;\n  radioPressedBackgroundColor?: string;\n  radioHoverColor?: string;\n  radioPressedColor?: string;\n  defaultBorderRadius?: string;\n  inputBorderRadius?: string;\n  inputBorderWidth?: string;\n  inputBorderWidthFocus?: string;\n  inputBorderStyle?: string;\n  inputBorderColor?: string;\n  inputBackgroundColor?: string;\n  inputHelperTextColor?: string;\n  inputHoverBackgroundColor?: string;\n  inputDisabledBackgroundColor?: string;\n  dragBorderStyle?: string;\n  modalShadowColor?: string;\n  modalBackgroundColor?: string;\n  modalBackdropColor?: string;\n  sideSheetShadowColorOne?: string;\n  sideSheetShadowColorTwo?: string;\n  skeletonBackgroundColor?: string;\n  skeletonAnimationColorRgb?: string;\n\n  alertTextColor?: string;\n  alertTextInvertedColor?: string;\n\n  alertNeutralBackgroundColor?: string;\n  alertInfoBackgroundColor?: string;\n  alertSuccessBackgroundColor?: string;\n  alertErrorBackgroundColor?: string;\n  alertWarningBackgroundColor?: string;\n\n  alertNeutralInvertedColor?: string;\n  alertInfoInvertedColor?: string;\n  alertSuccessInvertedColor?: string;\n  alertErrorInvertedColor?: string;\n  alertWarningInvertedColor?: string;\n\n  alertBorderWidth?: string;\n  alertBorderRadius?: string;\n\n  stepperWaitingColor?: string;\n  stepperWaitingHoverColor?: string;\n  stepperWaitingActiveColor?: string;\n  stepperWaitingDisabledColor?: string;\n  stepperCurrentColor?: string;\n  stepperCurrentHoverColor?: string;\n  stepperCurrentActiveColor?: string;\n  stepperCurrentDisabledColor?: string;\n  stepperDoneColor?: string;\n  stepperDoneHoverColor?: string;\n  stepperDoneActiveColor?: string;\n  stepperDoneDisabledColor?: string;\n  stepperErrorColor?: string;\n  stepperErrorHoverColor?: string;\n  stepperErrorActiveColor?: string;\n  stepperErrorDisabledColor?: string;\n  stepperDefaultTextColor?: string;\n  stepperLineColor?: string;\n  stepperLineBoldColor?: string;\n  stepperLineDisabledColor?: string;\n  stepperLineBoldDisabledColor?: string;\n  stepperLabelColor?: string;\n  stepperCaptionColor?: string;\n  stepperCaptionErrorColor?: string;\n  stepperLabelDisabledColor?: string;\n  stepperCaptionDisabledColor?: string;\n  stepperCaptionErrorDisabledColor?: string;\n  bannerBorderRadius?: string;\n  bannerBorderWidth?: string;\n  dataGridRowBackgroundColor?: string;\n  dataGridRowHoverBackgroundColor?: string;\n  progressBarBackgroundColor?: string;\n  tabsBackgroundColor?: string;\n  tabActiveBorderHeight?: string;\n  tabActiveBorderColor?: string;\n  tabActiveTextColor?: string;\n  tablistBorderWidth?: string;\n  tablistBorderStyle?: string;\n  tablistBorderColor?: string;\n  tabTextColor?: string;\n  tabHoverColor?: string;\n  tabPressedColor?: string;\n  toggleBackgroundColor?: string;\n  tooltipBackgroundColor?: string;\n  contextMenuHoverColor?: string;\n  contextMenuPressedColor?: string;\n  default?: string;\n  success?: string;\n  error?: string;\n  info?: string;\n  disabled?: string;\n  greyedOut?: string;\n  lightGreyBorder?: string;\n  warning?: string;\n  light?: string;\n  fontFamily?: string;\n  fontFamilyCode?: string;\n  fontSizeFormLabel?: string;\n  fontSize?: string;\n  fontSizeH1?: string;\n  fontSizeH2?: string;\n  fontSizeH3?: string;\n  fontSizeH4?: string;\n  fontSizeSub?: string;\n  fontSizeCode?: string;\n  formControlFontSize?: string;\n  fileUploadBorderWidth?: string;\n  dragDropBorderStyle?: string;\n  fontSizeDataGrid?: string;\n}\n\nexport interface Props extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactElement[] | ReactElement | string[] | string | number[] | number;\n  properties?: CSSProperties;\n}\n\nexport const BaseStyling = ({ children, properties = {} }: Props) => {\n  const defaultProperties: CSSProperties = {\n    colorPrimary50: \"#E6E7F4\",\n    colorPrimary100: \"#CDD0EA\",\n    colorPrimary300: \"#6871BF\",\n    colorPrimary500: \"#041295\",\n    colorPrimary600: \"#030F77\",\n    colorPrimary700: \"#020B59\",\n    colorPrimary900: \"#01041E\",\n    colorBlueGrey25: \"#F7F7F9\",\n    colorBlueGrey50: \"#EEEFF3\",\n    colorBlueGrey100: \"#DEDEE6\",\n    colorBlueGrey200: \"#BCBECE\",\n    colorBlueGrey300: \"#9A9DB5\",\n    colorBlueGrey400: \"#797D9C\",\n    colorBlueGrey500: \"#5D607E\",\n    colorBlueGrey700: \"#383A4B\",\n    colorBlueGrey800: \"#252733\",\n    colorBlueGrey900: \"#131319\",\n    colorGreen100: \"#D1E6DA\",\n    colorGreen200: \"#A2CDB4\",\n    colorGreen500: \"#178244\",\n    colorGreen600: \"#126836\",\n    colorGreen700: \"#0E4E29\",\n    colorOrange100: \"#FFE0B2\",\n    colorOrange500: \"#E07900\",\n    colorOrange600: \"#B36100\",\n    colorOrange700: \"#864900\",\n    colorRed100: \"#FFCDD2\",\n    colorRed200: \"#F3A599\",\n    colorRed500: \"#E01E00\",\n    colorRed600: \"#B31800\",\n    colorRed700: \"#861200\",\n    colorBlack100: \"#000000\",\n    colorBlack20: \"rgba(0, 0, 0, 0.2)\",\n    colorBlack10: \"rgba(0, 0, 0, 0.1)\",\n    colorWhite: \"#FFFFFF\",\n    colorFocus: \"var(--color-primary300)\",\n    colorPrimary: \"var(--color-primary500)\",\n    colorSuccess: \"var(--color-green500)\",\n    colorWarning: \"var(--color-orange500)\",\n    colorDanger: \"var(--color-red500)\",\n    defaultPressedColor: \"var(--color-blue-grey100)\",\n    defaultHoverColor: \"var(--color-blue-grey25)\",\n    defaultLineHeight: \"1.5\", //FIXME: UCL-395\n    dataGridLineHeight: \"1.25\",\n    defaultBorderRadius: \"0.25rem\",\n    focusBorderRadius: \"0.125rem\",\n    buttonBorderRadius: \"0.125rem\",\n    buttonBorderWidth: \"2px\",\n    buttonFontSize: \"0.875rem\",\n    buttonBorderStyle: \"solid\",\n    buttonFillTextColor: \"var(--light)\",\n    buttonPrimaryDefaultColor: \"var(--color-primary500)\",\n    buttonPrimaryHoverColor: \"var(--color-primary600)\",\n    buttonPrimaryFocusedColor: \"var(--color-primary500)\",\n    buttonPrimaryPressedColor: \"var(--color-primary700)\",\n    buttonSuccessDefaultColor: \"var(--color-green500)\",\n    buttonSuccessHoverColor: \"var(--color-green600)\",\n    buttonSuccessFocusedColor: \"var(--color-green500)\",\n    buttonSuccessPressedColor: \"var(--color-green700)\",\n    buttonDangerDefaultColor: \"var(--color-red500)\",\n    buttonDangerHoverColor: \"var(--color-red600)\",\n    buttonDangerFocusedColor: \"var(--color-red500)\",\n    buttonDangerPressedColor: \"var(--color-red700)\",\n    buttonWarningDefaultColor: \"var(--color-orange500)\",\n    buttonWarningHoverColor: \"var(--color-orange600)\",\n    buttonWarningFocusedColor: \"var(--color-orange500)\",\n    buttonWarningPressedColor: \"var(--color-orange700)\",\n    buttonDefaultColor: \"var(--color-blue-grey700)\",\n    buttonDefaultHoverColor: \"var(--color-blue-grey800)\",\n    buttonDefaultFocusedColor: \"var(--color-blue-grey700)\",\n    buttonDefaultPressedColor: \"var(--color-blue-grey800)\",\n    buttonOutlineHoverTextColor: \"var(--color-primary600)\",\n    checkboxUncheckedHoverColor: \"var(--color-blue-grey50)\",\n    checkboxUncheckedPressedColor: \"var(--default-pressed-color)\",\n    checkboxCheckedHoverColor: \"var(--color-primary600)\",\n    checkboxCheckedPressedColor: \"var(--color-primary700)\",\n    radioHoverBackgroundColor: \"var(--color-blue-grey50)\",\n    radioPressedBackgroundColor: \"var(--default-pressed-color)\",\n    radioHoverColor: \"var(--color-primary600)\",\n    radioPressedColor: \"var(--color-primary700)\",\n    inputBorderRadius: \"2px\",\n    inputBorderWidth: \"1px\",\n    inputBorderWidthFocus: \"1px\",\n    inputBorderStyle: \"solid\",\n    fileUploadBorderWidth: \"1px\",\n    dragDropBorderStyle: \"dashed\",\n    inputBorderColor: \"var(--color-blue-grey500)\",\n    inputBackgroundColor: \"var(--light)\",\n    inputHelperTextColor: \"var(--color-blue-grey500)\",\n    inputHoverBackgroundColor: \"var(--default-hover-color)\",\n    inputDisabledBackgroundColor: \"var(--input-hover-background-color)\",\n    dragBorderStyle: \"solid\",\n    modalShadowColor: \"rgba(0, 0, 0, 0.16)\",\n    modalBackgroundColor: \"var(--light)\",\n    modalBackdropColor: \"var(--default)\",\n    sideSheetShadowColorOne: \"#01053214\",\n    sideSheetShadowColorTwo: \"#0105320a\",\n    skeletonBackgroundColor: \"var(--disabled)\",\n    skeletonAnimationColorRgb: \"255, 255, 255\",\n\n    alertTextColor: \"var(--default)\",\n    alertTextInvertedColor: \"var(--light)\",\n\n    alertNeutralBackgroundColor: \"var(--color-blue-grey50)\",\n    alertNeutralInvertedColor: \"var(--color-blue-grey500)\",\n\n    alertInfoBackgroundColor: \"var(--color-primary100)\",\n    alertInfoInvertedColor: \"var(--color-primary500)\",\n\n    alertSuccessBackgroundColor: \"var(--color-green100)\",\n    alertSuccessInvertedColor: \"var(--color-green500)\",\n\n    alertErrorBackgroundColor: \"var(--color-red100)\",\n    alertErrorInvertedColor: \"var(--color-red500)\",\n\n    alertWarningBackgroundColor: \"var(--color-orange100)\",\n    alertWarningInvertedColor: \"var(--color-orange500)\",\n\n    alertBorderWidth: \"4px\",\n    alertBorderRadius: \"2px\",\n\n    stepperWaitingColor: \"var(--color-blue-grey200)\",\n    stepperWaitingHoverColor: \"var(--color-blue-grey300)\",\n    stepperWaitingActiveColor: \"var(--color-blue-grey400)\",\n    stepperWaitingDisabledColor: \"var(--color-blue-grey100)\",\n    stepperCurrentColor: \"var(--color-primary500)\",\n    stepperCurrentHoverColor: \"var(--color-primary600)\",\n    stepperCurrentActiveColor: \"var(--color-primary700)\",\n    stepperCurrentDisabledColor: \"var(--color-primary100)\",\n    stepperDoneColor: \"var(--color-green500)\",\n    stepperDoneHoverColor: \"var(--color-green600)\",\n    stepperDoneActiveColor: \"var(--color-green700)\",\n    stepperDoneDisabledColor: \"var(--color-green200)\",\n    stepperErrorColor: \"var(--color-red500)\",\n    stepperErrorHoverColor: \"var(--color-red600)\",\n    stepperErrorActiveColor: \"var(--color-red700)\",\n    stepperErrorDisabledColor: \"var(--color-red200)\",\n    stepperDefaultTextColor: \"var(--color-white)\",\n    stepperLineColor: \"var(--color-blue-grey300)\",\n    stepperLineBoldColor: \"var(--color-blue-grey700)\",\n    stepperLineDisabledColor: \"var(--color-blue-grey100)\",\n    stepperLineBoldDisabledColor: \"var(--color-blue-grey300)\",\n    stepperLabelColor: \"var(--color-blue-grey900)\",\n    stepperCaptionColor: \"var(--color-blue-grey500)\",\n    stepperCaptionErrorColor: \"var(--color-red500)\",\n    stepperLabelDisabledColor: \"var(--color-blue-grey400)\",\n    stepperCaptionDisabledColor: \"var(--color-blue-grey400)\",\n    stepperCaptionErrorDisabledColor: \"var(--color-red200)\",\n    bannerBorderRadius: \"2px\",\n    bannerBorderWidth: \"0 0 0 4px\",\n    dataGridRowBackgroundColor: \"transparent\",\n    dataGridRowHoverBackgroundColor: \"var(--default-hover-color)\",\n    progressBarBackgroundColor: \"var(--disabled)\",\n    tabsBackgroundColor: \"var(--light)\",\n    tabActiveBorderHeight: \"0.25rem\",\n    tabActiveBorderColor: \"var(--color-primary)\",\n    tabActiveTextColor: \"var(--color-primary)\",\n    tablistBorderWidth: \"0.0625rem\",\n    tablistBorderStyle: \"solid\",\n    tablistBorderColor: \"var(--color-blue-grey100)\",\n    tabTextColor: \"var(--color-blue-grey900)\",\n    tabHoverColor: \"var(--default-hover-color)\",\n    tabPressedColor: \"var(--default-pressed-color)\",\n    toggleBackgroundColor: \"var(--color-blue-grey100)\",\n    tooltipBackgroundColor: \"var(--default)\",\n    contextMenuHoverColor: \"var(--default-hover-color)\",\n    contextMenuPressedColor: \"var(--default-pressed-color)\",\n    default: \"var(--color-blue-grey900)\",\n    success: \"var(--color-green500)\",\n    error: \"var(--color-red500)\",\n    info: \"var(--color-primary500)\",\n    disabled: \"var(--color-blue-grey100)\",\n    greyedOut: \"var(--color-blue-grey400)\",\n    lightGreyBorder: \"var(--color-blue-grey100)\",\n    warning: \"var(--color-orange500)\",\n    light: \"var(--color-white)\",\n    fontFamily: \"Roboto, sans-serif\",\n    fontFamilyCode: \"'Roboto Mono', monospace\",\n    fontSizeFormLabel: \"0.875rem\", //FIXME: UCL-395\n    fontSize: \"1rem\", //FIXME: UCL-395\n    fontSizeH1: \"2.5rem\",\n    fontSizeH2: \"1.625rem\",\n    fontSizeH3: \"1.5rem\",\n    fontSizeH4: \"1.25rem\",\n    fontSizeSub: \".75rem\",\n    fontSizeCode: \"1rem\",\n    formControlFontSize: \"0.875rem\", //FIXME: UCL-395\n    fontSizeDataGrid: \"0.875rem\" //FIXME: UCL-395\n  };\n\n  /** We need a loading state, because otherwise you see the colors flash from the default to the possible overridden ones. */\n  const [isLoading, setIsLoading] = useState(true);\n  const baseStylingWrapper = useRef(null);\n\n  const setCSSProperties = (CSSPropertiesObject: CSSProperties) => {\n    for (const [key, value] of Object.entries(CSSPropertiesObject)) {\n      const formattedPropertyName = key.replace(/([A-Z])/g, val => `-${val.toLowerCase()}`);\n      (baseStylingWrapper.current! as HTMLElement).style.setProperty(\n        `--${formattedPropertyName}`,\n        value\n      );\n    }\n  };\n\n  useEffect(() => {\n    if (Object.keys(properties).length !== 0 && baseStylingWrapper.current) {\n      const mergedState = { ...defaultProperties, ...properties };\n      setCSSProperties(mergedState);\n    } else if (baseStylingWrapper.current) {\n      setCSSProperties(defaultProperties);\n    }\n    setIsLoading(false);\n  }, [properties, baseStylingWrapper.current]);\n\n  return (\n    <div className=\"basestyling-wrapper\" ref={baseStylingWrapper}>\n      {!isLoading ? children : null}\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/src/components/Button/Spinner.d.ts

@@ -1,2 +1,2 @@
 import React from "react";
-export declare const Spinner: React.FC<React.SVGProps<SVGSVGElement>>;
+export declare const ButtonSpinner: React.FC<React.SVGProps<SVGSVGElement>>;

package/dist/esm/src/components/DataGrid/DataGridFilters/DataGridFilters.interfaces.d.ts

@@ -56,3 +56,7 @@ export interface FiltersTranslations {
     tag?: TagTranslations;
     popover?: PopoverTranslations;
 }
+export interface KeyValuePair<TKey = string, TValue = string> {
+    key: TKey;
+    value: TValue;
+}

package/dist/esm/src/components/DataGrid/DataGridFilters/DataGridSearchbar.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { InputWrapperProps } from "../../..";
+import { Props as InputWrapperProps } from "../../Form/Wrapper/InputWrapper/InputWrapper";
 export interface DataGridSearchbarProps {
     onSearch: (value: string) => void;
     initialSearchValue?: string;

package/dist/esm/src/components/DataGrid/DataGridFilters/FilterKeyMapper.d.ts

@@ -0,0 +1,14 @@
+import { KeyValuePair } from "./DataGridFilters.interfaces";
+export declare class FilterKeyMapper {
+    columnKvPairs: Map<string, {
+        key: string;
+        value: string;
+    }[]>;
+    setColumnKvPairs(columnName: string, kvPairs: {
+        key: string;
+        value: string;
+    }[]): void;
+    getValues(columnName: string): string[];
+    getKeysForValues(columnName: string, values: string[]): string[];
+    getKvPairs(columnName: string): KeyValuePair[];
+}