@onewelcome/react-lib-components 8.3.0 → 8.5.0

package/dist/cjs/Notifications/BaseModal/BaseModal.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react"),l=require("react-dom"),a=require("../../src/hooks/useGetDomRoot.cjs.js"),o=require("./BaseModal.module.scss.cjs.js"),d=require("./BaseModalContext.cjs.js"),r=require("../../src/hooks/useRepeatFocus.cjs.js");const s="overflow",t=l=>{e.useEffect((()=>{l?document.body.style[s]="hidden":0===document.querySelectorAll("[role=dialog][data-hidden=false]").length&&document.body.style.removeProperty(s)}),[l])},n=e.forwardRef((({id:s,children:n,open:i,onClose:c,className:u="",containerProps:m,backdropProps:p,labelledby:v,describedby:f,disableEscapeKeyDown:b=!1,disableBackdrop:y=!1,forceContainerOpen:h=!1,zIndex:E,domRoot:$,...j},x)=>{var N,R,k;t(i);const q=e.useRef(null),C=x||e.createRef(),{root:I}=a.useGetDomRoot($,q);r.useRepeatFocus(C),e.useEffect((()=>{var e;i&&(null===(e=C.current)||void 0===e||e.focus())}),[i]);const g=()=>e.Children.map(n,(l=>{var a;return e.isValidElement(l)?e.cloneElement(l,{onClose:null!==(a=l.props.onClose)&&void 0!==a?a:c}):l}));return e.createElement("div",{ref:q},l.createPortal(e.createElement("div",{...j,ref:C,id:s,className:`${o.default.modal} ${i?o.default.visible:""} ${u}`,role:"dialog","aria-modal":"true","aria-labelledby":null!=v?v:d.labelId(s),"aria-describedby":null!=f?f:d.descriptionId(s),"aria-hidden":!i,tabIndex:-1,"data-hidden":!i,onKeyDown:e=>{b||"Escape"!==e.key||(e.stopPropagation(),null==c||c())},style:{zIndex:E}},e.createElement("div",{...p,"aria-hidden":!0,className:`${o.default.backdrop} ${null!==(N=null==p?void 0:p.className)&&void 0!==N?N:""}`,onClick:()=>!y&&c&&c()}),h?e.createElement("div",{...m,"aria-hidden":!i,"data-element":"dialog",hidden:!i,style:{zIndex:E&&E+1},className:`${o.default.container} ${null!==(R=null==m?void 0:m.className)&&void 0!==R?R:""}`},g()):i&&e.createElement("div",{...m,"data-element":"dialog",style:{zIndex:E&&E+1},className:`${o.default.container} ${null!==(k=null==m?void 0:m.className)&&void 0!==k?k:""}`},g())),I))}));exports.BaseModal=n,exports.useSetBodyScroll=t;
+"use strict";var e=require("react"),l=require("react-dom"),a=require("../../src/hooks/useGetDomRoot.cjs.js"),o=require("./BaseModal.module.scss.cjs.js"),d=require("./BaseModalContext.cjs.js"),r=require("../../src/hooks/useRepeatFocus.cjs.js");const s="overflow",t=l=>{e.useEffect((()=>{l?document.body.style[s]="hidden":0===document.querySelectorAll("[role=dialog][data-hidden=false]").length&&document.body.style.removeProperty(s)}),[l])},n=e.forwardRef((({id:s,children:n,open:i,onClose:c,className:u="",containerProps:m,backdropProps:p,labelledby:v,describedby:f,disableEscapeKeyDown:b=!1,disableBackdrop:y=!1,hideBackdrop:h=!1,forceContainerOpen:E=!1,zIndex:$,domRoot:j,...k},x)=>{var N,R,q;t(i);const C=e.useRef(null),I=x||e.createRef(),{root:g}=a.useGetDomRoot(j,C);r.useRepeatFocus(I),e.useEffect((()=>{var e;i&&(null===(e=I.current)||void 0===e||e.focus())}),[i]);const B=()=>e.Children.map(n,(l=>{var a;return e.isValidElement(l)?e.cloneElement(l,{onClose:null!==(a=l.props.onClose)&&void 0!==a?a:c}):l}));return e.createElement("div",{ref:C},l.createPortal(e.createElement("div",{...k,ref:I,id:s,className:`${o.default.modal} ${i?o.default.visible:""} ${u}`,role:"dialog","aria-modal":"true","aria-labelledby":null!=v?v:d.labelId(s),"aria-describedby":null!=f?f:d.descriptionId(s),"aria-hidden":!i,tabIndex:-1,"data-hidden":!i,onKeyDown:e=>{b||"Escape"!==e.key||(e.stopPropagation(),null==c||c())},style:{zIndex:$}},h?null:e.createElement("div",{...p,"aria-hidden":!0,className:`${o.default.backdrop} ${null!==(N=null==p?void 0:p.className)&&void 0!==N?N:""}`,onClick:()=>!y&&c&&c()}),E?e.createElement("div",{...m,"aria-hidden":!i,"data-element":"dialog",hidden:!i,style:{zIndex:$&&$+1},className:`${o.default.container} ${null!==(R=null==m?void 0:m.className)&&void 0!==R?R:""}`},B()):i&&e.createElement("div",{...m,"data-element":"dialog",style:{zIndex:$&&$+1},className:`${o.default.container} ${null!==(q=null==m?void 0:m.className)&&void 0!==q?q:""}`},B())),g))}));exports.BaseModal=n,exports.useSetBodyScroll=t;
 //# sourceMappingURL=BaseModal.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BaseModal.cjs.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":["SCROLL_PROPERTY_NAME","useSetBodyScroll","open","useEffect","document","body","style","querySelectorAll","length","removeProperty","BaseModal","React","forwardRef","id","children","onClose","className","containerProps","backdropProps","labelledby","describedby","disableEscapeKeyDown","disableBackdrop","forceContainerOpen","zIndex","domRoot","rest","ref","wrappingDivRef","useRef","modalRef","createRef","root","useGetDomRoot","useRepeatFocus","_a","current","focus","renderChildren","Children","map","child","isValidElement","cloneElement","props","createElement","createPortal","classes","default","role","labelId","descriptionId","tabIndex","onKeyDown","event","key","stopPropagation","onClick","hidden","_b","_c"],"mappings":"mPA+BA,MAAMA,EAAuB,WAoBhBC,EAAoBC,IAa/BC,EAAAA,WAAU,KACJD,EAZJE,SAASC,KAAKC,MAAMN,GArBM,SA0BiD,IAAzEI,SAASG,iBAAiB,oCAAoCC,QAE9DJ,SAASC,KAAKC,MAAMG,eAAeT,EASpC,GACA,CAACE,GAAM,EA6GCQ,EAAYC,EAAMC,YA1G6C,EAExEC,KACAC,WACAZ,OACAa,UACAC,YAAY,GACZC,iBACAC,gBACAC,aACAC,cACAC,wBAAuB,EACvBC,mBAAkB,EAClBC,sBAAqB,EACrBC,SACAC,aACGC,GAELC,eAEA1B,EAAiBC,GACjB,MAAM0B,EAAiBC,SAAuB,MACxCC,EAAYH,GAAqCI,EAAAA,aACjDC,KAAEA,GAASC,EAAaA,cAACR,EAASG,GASxCM,EAAcA,eAACJ,GAEf3B,EAAAA,WAAU,WACJD,IACgB,QAAlBiC,EAAAL,EAASM,eAAS,IAAAD,GAAAA,EAAAE,QACnB,GACA,CAACnC,IAEJ,MAEMoC,EAAiB,IACrB3B,EAAM4B,SAASC,IAAI1B,GAAU2B,UAC3B,OAAI9B,EAAM+B,eAAeD,GAChB9B,EAAMgC,aAAaF,EAAuB,CAC/C1B,kBAAS0B,EAAMG,MAAM7B,uBAAWA,IAG7B0B,CAAK,IAGhB,OACE9B,EAAKkC,cAAA,MAAA,CAAAlB,IAAKC,GACPkB,EAAAA,aACCnC,EAAAkC,cAAA,MAAA,IACMnB,EACJC,IAAKG,EACLjB,GAAIA,EACJG,UAAW,GAAG+B,EAAAA,QAAe,SAAK7C,EAAO6C,EAAOC,QAAU,QAAI,MAAMhC,IACpEiC,KAAK,SAAQ,aACF,OACM,kBAAA9B,QAAAA,EAAc+B,EAAAA,QAAQrC,sBACrBO,QAAAA,EAAe+B,EAAaA,cAACtC,GAAG,eACpCX,EACdkD,UAAW,EACE,eAAClD,EACdmD,UA1CmBC,IACpBjC,GAAsC,WAAdiC,EAAMC,MACjCD,EAAME,kBACNzC,SAAAA,IACD,EAuCKT,MAAO,CAAEkB,WAETb,EACMkC,cAAA,MAAA,IAAA3B,EACS,eAAA,EACbF,UAAW,GAAG+B,EAAOC,QAAW,YAA6B,QAAxBb,EAAAjB,aAAa,EAAbA,EAAeF,iBAAS,IAAAmB,EAAAA,EAAI,KACjEsB,QAlCkB,KAAOnC,GAAmBP,GAAWA,MAoCxDQ,EACCZ,EAAAkC,cAAA,MAAA,IACM5B,EACS,eAACf,EAAI,eACL,SACbwD,QAASxD,EACTI,MAAO,CAAEkB,OAAQA,GAAUA,EAAS,GACpCR,UAAW,GAAG+B,EAAAA,QAAmB,aAAkC,QAA7BY,EAAA1C,aAAA,EAAAA,EAAgBD,iBAAa,IAAA2C,EAAAA,EAAA,MAElErB,KAGHpC,GACES,EAAAkC,cAAA,MAAA,IACM5B,EACS,eAAA,SACbX,MAAO,CAAEkB,OAAQA,GAAUA,EAAS,GACpCR,UAAW,GAAG+B,UAAmB,aAA8B,QAAzBa,EAAA3C,eAAAA,EAAgBD,iBAAS,IAAA4C,EAAAA,EAAI,MAElEtB,MAKTN,GAGJ"}
+{"version":3,"file":"BaseModal.cjs.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":["SCROLL_PROPERTY_NAME","useSetBodyScroll","open","useEffect","document","body","style","querySelectorAll","length","removeProperty","BaseModal","React","forwardRef","id","children","onClose","className","containerProps","backdropProps","labelledby","describedby","disableEscapeKeyDown","disableBackdrop","hideBackdrop","forceContainerOpen","zIndex","domRoot","rest","ref","wrappingDivRef","useRef","modalRef","createRef","root","useGetDomRoot","useRepeatFocus","_a","current","focus","renderChildren","Children","map","child","isValidElement","cloneElement","props","createElement","createPortal","classes","default","role","labelId","descriptionId","tabIndex","onKeyDown","event","key","stopPropagation","onClick","hidden","_b","_c"],"mappings":"mPA+BA,MAAMA,EAAuB,WAqBhBC,EAAoBC,IAa/BC,EAAAA,WAAU,KACJD,EAZJE,SAASC,KAAKC,MAAMN,GAtBM,SA2BiD,IAAzEI,SAASG,iBAAiB,oCAAoCC,QAE9DJ,SAASC,KAAKC,MAAMG,eAAeT,EASpC,GACA,CAACE,GAAM,EAgHCQ,EAAYC,EAAMC,YA7G6C,EAExEC,KACAC,WACAZ,OACAa,UACAC,YAAY,GACZC,iBACAC,gBACAC,aACAC,cACAC,wBAAuB,EACvBC,mBAAkB,EAClBC,gBAAe,EACfC,sBAAqB,EACrBC,SACAC,aACGC,GAELC,eAEA3B,EAAiBC,GACjB,MAAM2B,EAAiBC,SAAuB,MACxCC,EAAYH,GAAqCI,EAAAA,aACjDC,KAAEA,GAASC,EAAaA,cAACR,EAASG,GASxCM,EAAcA,eAACJ,GAEf5B,EAAAA,WAAU,WACJD,IACgB,QAAlBkC,EAAAL,EAASM,eAAS,IAAAD,GAAAA,EAAAE,QACnB,GACA,CAACpC,IAEJ,MAEMqC,EAAiB,IACrB5B,EAAM6B,SAASC,IAAI3B,GAAU4B,UAC3B,OAAI/B,EAAMgC,eAAeD,GAChB/B,EAAMiC,aAAaF,EAAuB,CAC/C3B,kBAAS2B,EAAMG,MAAM9B,uBAAWA,IAG7B2B,CAAK,IAGhB,OACE/B,EAAKmC,cAAA,MAAA,CAAAlB,IAAKC,GACPkB,EAAAA,aACCpC,EAAAmC,cAAA,MAAA,IACMnB,EACJC,IAAKG,EACLlB,GAAIA,EACJG,UAAW,GAAGgC,EAAAA,QAAe,SAAK9C,EAAO8C,EAAOC,QAAU,QAAI,MAAMjC,IACpEkC,KAAK,SAAQ,aACF,OACM,kBAAA/B,QAAAA,EAAcgC,EAAAA,QAAQtC,sBACrBO,QAAAA,EAAegC,EAAaA,cAACvC,GAAG,eACpCX,EACdmD,UAAW,EACE,eAACnD,EACdoD,UA1CmBC,IACpBlC,GAAsC,WAAdkC,EAAMC,MACjCD,EAAME,kBACN1C,SAAAA,IACD,EAuCKT,MAAO,CAAEmB,WAEPF,EAOE,KANFZ,0BACMO,EAAa,eACJ,EACbF,UAAW,GAAGgC,UAAkB,oBAAKZ,EAAAlB,aAAA,EAAAA,EAAeF,yBAAa,KACjE0C,QAnCgB,KAAOpC,GAAmBP,GAAWA,MAsCxDS,EACCb,EAAAmC,cAAA,MAAA,IACM7B,EACS,eAACf,EAAI,eACL,SACbyD,QAASzD,EACTI,MAAO,CAAEmB,OAAQA,GAAUA,EAAS,GACpCT,UAAW,GAAGgC,EAAAA,QAAmB,aAAkC,QAA7BY,EAAA3C,aAAA,EAAAA,EAAgBD,iBAAa,IAAA4C,EAAAA,EAAA,MAElErB,KAGHrC,GACES,EAAAmC,cAAA,MAAA,IACM7B,EACS,eAAA,SACbX,MAAO,CAAEmB,OAAQA,GAAUA,EAAS,GACpCT,UAAW,GAAGgC,UAAmB,aAA8B,QAAzBa,EAAA5C,eAAAA,EAAgBD,iBAAS,IAAA6C,EAAAA,EAAI,MAElEtB,MAKTN,GAGJ"}

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

@@ -1,2 +1,2 @@
-"use strict";var e=require("react"),a=require("./BaseModalHeader.module.scss.cjs.js"),t=require("../../../Button/IconButton.cjs.js"),r=require("../../../Icon/Icon.cjs.js"),s=require("../../../Typography/Typography.cjs.js");const c=e.forwardRef((({id:c,title:l,children:o,onClose:n,...i},d)=>e.createElement("div",{...i,ref:d,className:a.default.header},e.createElement("div",{className:a.default.headline},e.createElement("div",{className:a.default["title-wrapper"]},e.createElement(s.Typography,{id:c,className:a.default.title,tag:"h1",spacing:{marginBottom:0},variant:"h4"},l)),e.createElement(t.IconButton,{onClick:n,className:a.default.closeBtn,title:"close modal"},e.createElement(r.Icon,{icon:r.Icons.Times}))),o)));exports.BaseModalHeader=c;
+"use strict";var e=require("react"),a=require("./BaseModalHeader.module.scss.cjs.js"),t=require("../../../Button/IconButton.cjs.js"),s=require("../../../Icon/Icon.cjs.js"),r=require("../../../Typography/Typography.cjs.js");const c=e.forwardRef((({id:c,title:l,children:o,onClose:n,description:i,className:d,...m},u)=>e.createElement("div",{...m,ref:u,className:`${a.default.header} ${d}`},e.createElement("div",{className:a.default.headline},e.createElement("div",{className:a.default["title-wrapper"]},e.createElement(r.Typography,{id:c,className:a.default.title,tag:"h1",spacing:{marginBottom:0},variant:"h4"},l),i&&e.createElement(r.Typography,{id:c,className:a.default.title,tag:"span",spacing:{marginBottom:0},variant:"body"},i)),e.createElement(t.IconButton,{onClick:n,className:a.default.closeBtn,title:"close modal"},e.createElement(s.Icon,{icon:s.Icons.Times}))),o)));exports.BaseModalHeader=c;
 //# sourceMappingURL=BaseModalHeader.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BaseModalHeader.cjs.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":["BaseModalHeader","React","forwardRef","id","title","children","onClose","rest","ref","createElement","className","classes","default","Typography","tag","spacing","marginBottom","variant","IconButton","onClick","Icon","icon","Icons","Times"],"mappings":"+NA6BA,MA2BaA,EAAkBC,EAAMC,YA3B6C,EAC9EC,KAAIC,QAAOC,WAAUC,aAAYC,GACnCC,IAGEP,EAAAQ,cAAA,MAAA,IAASF,EAAMC,IAAKA,EAAKE,UAAWC,EAAOC,QAAS,QAClDX,EAAAQ,cAAA,MAAA,CAAKC,UAAWC,EAAAA,QAAkB,UAChCV,EAAAQ,cAAA,MAAA,CAAKC,UAAWC,EAAAA,QAAQ,kBACtBV,EAAAQ,cAACI,EAAAA,WAAU,CACTV,GAAIA,EACJO,UAAWC,EAAOC,QAAQ,MAC1BE,IAAI,KACJC,QAAS,CAAEC,aAAc,GACzBC,QAAQ,MAEPb,IAGLH,EAAAQ,cAACS,aAAU,CAACC,QAASb,EAASI,UAAWC,UAAkB,SAAGP,MAAM,eAClEH,EAACQ,cAAAW,QAAKC,KAAMC,QAAMC,UAGrBlB"}
+{"version":3,"file":"BaseModalHeader.cjs.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":["BaseModalHeader","React","forwardRef","id","title","children","onClose","description","className","rest","ref","createElement","classes","Typography","default","tag","spacing","marginBottom","variant","IconButton","onClick","Icon","icon","Icons","Times"],"mappings":"+NA8BA,MAsCaA,EAAkBC,EAAMC,YAtC6C,EAC9EC,KAAIC,QAAOC,WAAUC,UAASC,cAAaC,eAAcC,GAC3DC,IAGET,EAASU,cAAA,MAAA,IAAAF,EAAMC,IAAKA,EAAKF,UAAW,GAAGI,EAAAA,QAAgB,UAAKJ,KAC1DP,EAAAU,cAAA,MAAA,CAAKH,UAAWI,EAAAA,QAAkB,UAChCX,EAAAU,cAAA,MAAA,CAAKH,UAAWI,EAAAA,QAAQ,kBACtBX,EAAAU,cAACE,EAAAA,WAAU,CACTV,GAAIA,EACJK,UAAWI,EAAOE,QAAQ,MAC1BC,IAAI,KACJC,QAAS,CAAEC,aAAc,GACzBC,QAAQ,MAEPd,GAEFG,GACCN,EAACU,cAAAE,cACCV,GAAIA,EACJK,UAAWI,EAAOE,QAAQ,MAC1BC,IAAI,OACJC,QAAS,CAAEC,aAAc,GACzBC,QAAQ,QAEPX,IAIPN,EAAAU,cAACQ,aAAU,CAACC,QAASd,EAASE,UAAWI,UAAkB,SAAGR,MAAM,eAClEH,EAACU,cAAAU,QAAKC,KAAMC,QAAMC,UAGrBnB"}

package/dist/cjs/Notifications/SideSheet/SideSheet.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),t=require("../BaseModal/BaseModal.cjs.js"),a=require("./SideSheet.module.scss.cjs.js"),l=require("../../Button/IconButton.cjs.js"),n=require("../../Icon/Icon.cjs.js");const s=e.forwardRef((({children:s,id:o,open:r,handleButtonProps:d,...c},i)=>{var u;const[m,h]=e.useState("hide"),[f,p]=e.useState(!1),E=e.useRef(null),S=null!==(u=null==d?void 0:d.title)&&void 0!==u?u:"Side sheet handle",B={width:"1.5rem",height:"3.5rem",borderTopLeftRadius:"4px",borderBottomLeftRadius:"4px"},I=e.useCallback((e=>{e.target===E.current&&(h((e=>e?"":"hide")),!r&&f&&p(!1))}),[r]);return e.useEffect((()=>{r&&p(r)}),[r]),e.createElement(e.Fragment,null,d&&!r&&e.createElement("div",{className:a.default["collapsed-sheet"]},e.createElement("div",{className:a.default.handle},e.createElement(l.IconButton,{style:B,className:a.default["handle-button"],onClick:d.onOpen,title:S},e.createElement(n.Icon,{size:"0.9rem",icon:n.Icons.SideSheetHandle})))),e.createElement(t.BaseModal,{...c,id:o,open:f,className:`${a.default["slide-in-modal"]} ${r?a.default.visible:""} ${r?"":a.default[m]}`,containerProps:{className:a.default.container},hideBackdrop:!0,onTransitionEnd:I,ref:null!=i?i:E},d&&e.createElement("div",{className:a.default.handle},e.createElement(l.IconButton,{style:B,title:S,onClick:d.onClose},e.createElement(n.Icon,{size:"0.9rem",icon:n.Icons.SideSheetHandle}))),s))}));exports.SideSheet=s;
+//# sourceMappingURL=SideSheet.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheet.cjs.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":["SideSheet","React","forwardRef","children","id","open","handleButtonProps","rest","ref","classHideOnTransition","setClassHideOnTransition","useState","controlledOpen","setControlledOpen","containerRef","useRef","handleTitle","_a","title","handleButtonStyle","width","height","borderTopLeftRadius","borderBottomLeftRadius","onTransitionEnd","useCallback","e","target","current","prev","useEffect","createElement","Fragment","className","classes","IconButton","style","default","onClick","onOpen","Icon","size","icon","Icons","SideSheetHandle","Modal","BaseModal","containerProps","hideBackdrop","onClose"],"mappings":"2MAqCA,MA4EaA,EAAYC,EAAMC,YA5E6C,EACxEC,WAAUC,KAAIC,OAAMC,uBAAsBC,GAC5CC,WAEA,MAAOC,EAAuBC,GAA4BC,EAAQA,SAAS,SACpEC,EAAgBC,GAAqBF,EAAQA,UAAC,GAC/CG,EAAeC,SAAO,MACtBC,EAA0C,QAA5BC,EAAAX,aAAA,EAAAA,EAAmBY,aAAS,IAAAD,EAAAA,EAAA,oBAC1CE,EAAoB,CACxBC,MAAO,SACPC,OAAQ,SACRC,oBAAqB,MACrBC,uBAAwB,OAGpBC,EAA0DC,EAAWA,aACzEC,IACMA,EAAEC,SAAWb,EAAac,UAC5BlB,GAAyBmB,GAASA,EAAO,GAAK,UACzCxB,GAAQO,GACXC,GAAkB,GAErB,GAEH,CAACR,IAOH,OAJAyB,EAAAA,WAAU,KACRzB,GAAQQ,EAAkBR,EAAK,GAC9B,CAACA,IAGFJ,EAAA8B,cAAA9B,EAAA+B,SAAA,KACG1B,IAAsBD,GACrBJ,EAAK8B,cAAA,MAAA,CAAAE,UAAWC,UAAQ,oBACtBjC,EAAA8B,cAAA,MAAA,CAAKE,UAAWC,EAAAA,QAAgB,QAC9BjC,EAAC8B,cAAAI,EAAAA,YACCC,MAAOjB,EACPc,UAAWC,EAAOG,QAAC,iBACnBC,QAAShC,EAAkBiC,OAC3BrB,MAAOF,GAEPf,EAAA8B,cAACS,OAAI,CAACC,KAAK,SAASC,KAAMC,QAAMC,qBAKxC3C,EAAA8B,cAACc,EAAKC,UAAA,IACAvC,EACJH,GAAIA,EACJC,KAAMO,EACNqB,UAAW,GAAGC,UAAQ,qBAAqB7B,EAAO6B,EAAOG,QAAU,QAAI,MACpEhC,EAAwC,GAAjC6B,EAAAA,QAAQzB,KAElBsC,eAAgB,CAAEd,UAAWC,EAAAA,QAAmB,WAChDc,cAAc,EACdxB,gBAAiBA,EACjBhB,IAAKA,QAAAA,EAAOM,GAEXR,GACCL,EAAK8B,cAAA,MAAA,CAAAE,UAAWC,EAAAA,QAAgB,QAC9BjC,EAAA8B,cAACI,aAAU,CACTC,MAAOjB,EACPD,MAAOF,EACPsB,QAAShC,EAAkB2C,SAE3BhD,EAAA8B,cAACS,OAAI,CAACC,KAAK,SAASC,KAAMC,QAAMC,oBAIrCzC,GAGL"}

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

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});require("../../node_modules/style-inject/dist/style-inject.es.cjs.js").default('/*!\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= */'),exports.default={"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"};
+//# sourceMappingURL=SideSheet.module.scss.cjs.js.map

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

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

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

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),t=require("../../BaseModal/BaseModalContent/BaseModalContent.cjs.js"),s=require("./SideSheetContent.module.scss.cjs.js");exports.SideSheetContent=({className:a,...n})=>e.createElement(t.BaseModalContent,{...n,className:`${s.default["side-sheet-content"]} ${a}`});
+//# sourceMappingURL=SideSheetContent.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheetContent.cjs.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":["className","rest","React","createElement","BaseModalContent","classes"],"mappings":"sLAoBiD,EAAGA,eAAcC,KAChEC,EAAAC,cAACC,mBAAgB,IAAKH,EAAMD,UAAW,GAAGK,UAAQ,yBAAyBL"}

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

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});require("../../../node_modules/style-inject/dist/style-inject.es.cjs.js").default(".SideSheetContent-module_side-sheet-content__uJwNY{padding:1.5rem}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNpZGVTaGVldENvbnRlbnQubW9kdWxlLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZUEsbURBQ0UsY0FDRiIsImZpbGUiOiJTaWRlU2hlZXRDb250ZW50Lm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLnNpZGUtc2hlZXQtY29udGVudCB7XG4gIHBhZGRpbmc6IDEuNXJlbTtcbn0iXX0= */"),exports.default={"side-sheet-content":"SideSheetContent-module_side-sheet-content__uJwNY"};
+//# sourceMappingURL=SideSheetContent.module.scss.cjs.js.map

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

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

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

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),a=require("../../BaseModal/BaseModalHeader/BaseModalHeader.cjs.js"),s=require("./SideSheetHeader.module.scss.cjs.js");exports.SideSheetHeader=({className:r,...d})=>e.createElement(a.BaseModalHeader,{...d,className:`${s.default["side-sheet-header"]} ${r}`});
+//# sourceMappingURL=SideSheetHeader.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheetHeader.cjs.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":["className","rest","React","createElement","BaseModalHeader","classes"],"mappings":"kLAoBgD,EAAGA,eAAcC,KAC/DC,EAAAC,cAACC,kBAAe,IAAKH,EAAMD,UAAW,GAAGK,UAAQ,wBAAwBL"}

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

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});require("../../../node_modules/style-inject/dist/style-inject.es.cjs.js").default(".SideSheetHeader-module_side-sheet-header__x4ote{padding:1rem 1.5rem}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNpZGVTaGVldEhlYWRlci5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFlQSxpREFDRSxtQkFDRiIsImZpbGUiOiJTaWRlU2hlZXRIZWFkZXIubW9kdWxlLnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4uc2lkZS1zaGVldC1oZWFkZXIge1xuICBwYWRkaW5nOiAxcmVtIDEuNXJlbTtcbn0iXX0= */"),exports.default={"side-sheet-header":"SideSheetHeader-module_side-sheet-header__x4ote"};
+//# sourceMappingURL=SideSheetHeader.module.scss.cjs.js.map

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"SlideInModal.cjs.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":["SlideInModal","React","forwardRef","children","id","open","rest","ref","classHideOnTransition","setClassHideOnTransition","useState","controlledOpen","setControlledOpen","containerRef","useRef","onTransitionEnd","useCallback","e","target","current","prev","useEffect","createElement","Modal","BaseModal","className","classes","default","containerProps","backdropProps"],"mappings":"8HA2BA,MA4CaA,EAAeC,EAAMC,YA5CkD,EAChFC,WAAUC,KAAIC,UAASC,GACzBC,KAEA,MAAOC,EAAuBC,GAA4BC,EAAQA,SAAS,SACpEC,EAAgBC,GAAqBF,EAAQA,UAAC,GAC/CG,EAAeC,SAAO,MAEtBC,EAA0DC,EAAWA,aACzEC,IACMA,EAAEC,SAAWL,EAAaM,UAC5BV,GAAyBW,GAASA,EAAO,GAAK,UACzCf,GAAQM,GACXC,GAAkB,GAErB,GAEH,CAACP,IAOH,OAJAgB,EAAAA,WAAU,KACRhB,GAAQO,EAAkBP,EAAK,GAC9B,CAACA,IAGFJ,EAACqB,cAAAC,EAAKC,cACAlB,EACJF,GAAIA,EACJC,KAAMM,EACNc,UAAW,GAAGC,UAAQ,qBAAqBrB,EAAOqB,UAAiB,QAAI,MACpErB,EAAwC,GAAjCqB,EAAOC,QAACnB,KAElBoB,eAAgB,CAAEH,UAAWC,EAAOC,QAAY,WAChDE,cAAe,CAAEzB,GAAIsB,EAAOC,QAAC,mBAC7BZ,gBAAiBA,EACjBR,IAAKA,QAAAA,EAAOM,GAEXV,EAEH"}
+{"version":3,"file":"SlideInModal.cjs.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":["SlideInModal","React","forwardRef","children","id","open","rest","ref","classHideOnTransition","setClassHideOnTransition","useState","controlledOpen","setControlledOpen","containerRef","useRef","onTransitionEnd","useCallback","e","target","current","prev","useEffect","createElement","Modal","BaseModal","className","classes","default","containerProps","backdropProps"],"mappings":"8HA8BA,MA4CaA,EAAeC,EAAMC,YA5CkD,EAChFC,WAAUC,KAAIC,UAASC,GACzBC,KAEA,MAAOC,EAAuBC,GAA4BC,EAAQA,SAAS,SACpEC,EAAgBC,GAAqBF,EAAQA,UAAC,GAC/CG,EAAeC,SAAO,MAEtBC,EAA0DC,EAAWA,aACzEC,IACMA,EAAEC,SAAWL,EAAaM,UAC5BV,GAAyBW,GAASA,EAAO,GAAK,UACzCf,GAAQM,GACXC,GAAkB,GAErB,GAEH,CAACP,IAOH,OAJAgB,EAAAA,WAAU,KACRhB,GAAQO,EAAkBP,EAAK,GAC9B,CAACA,IAGFJ,EAACqB,cAAAC,EAAKC,cACAlB,EACJF,GAAIA,EACJC,KAAMM,EACNc,UAAW,GAAGC,UAAQ,qBAAqBrB,EAAOqB,UAAiB,QAAI,MACpErB,EAAwC,GAAjCqB,EAAOC,QAACnB,KAElBoB,eAAgB,CAAEH,UAAWC,EAAOC,QAAY,WAChDE,cAAe,CAAEzB,GAAIsB,EAAOC,QAAC,mBAC7BZ,gBAAiBA,EACjBR,IAAKA,QAAAA,EAAOM,GAEXV,EAEH"}

package/dist/cjs/Spinner/Spinner.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),r=require("./Spinner.module.scss.cjs.js");exports.Spinner=({size:t=32,thickness:s,...c})=>(s||(s=t/16),e.createElement("svg",{...c,className:r.default.spinner,width:t,height:t,viewBox:`0 0 ${t} ${t}`,fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("circle",{cx:t/2,cy:t/2,r:(t-s)/2,stroke:"var(--orbit-color)",strokeWidth:s,fill:"none"}),e.createElement("circle",{className:r.default.arch,cx:t/2,cy:t/2,r:(t-s)/2,stroke:"var(--arch-color)",strokeWidth:s,strokeLinecap:"round",fill:"none",strokeDasharray:`${t}`,transform:"rotate(-90 25 25)"})));
+//# sourceMappingURL=Spinner.cjs.js.map

package/dist/cjs/Spinner/Spinner.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.cjs.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":["size","thickness","props","React","createElement","className","classes","width","height","viewBox","fill","xmlns","cx","cy","r","stroke","strokeWidth","strokeLinecap","strokeDasharray","transform"],"mappings":"8FAwB+C,EAAGA,OAAO,GAAIC,eAAcC,MACpED,IACHA,EAAYD,EAAO,IAGnBG,EAAAC,cAAA,MAAA,IACMF,EACJG,UAAWC,UAAiB,QAC5BC,MAAOP,EACPQ,OAAQR,EACRS,QAAS,OAAOT,KAAQA,IACxBU,KAAK,OACLC,MAAM,8BAENR,EAAAC,cAAA,SAAA,CACEQ,GAAIZ,EAAO,EACXa,GAAIb,EAAO,EACXc,GAAId,EAAOC,GAAa,EACxBc,OAAO,qBACPC,YAAaf,EACbS,KAAK,SAEPP,EACEC,cAAA,SAAA,CAAAC,UAAWC,EAAAA,QAAc,KACzBM,GAAIZ,EAAO,EACXa,GAAIb,EAAO,EACXc,GAAId,EAAOC,GAAa,EACxBc,OAAO,oBACPC,YAAaf,EACbgB,cAAc,QACdP,KAAK,OACLQ,gBAAiB,GAAGlB,IACpBmB,UAAU"}

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

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});require("../node_modules/style-inject/dist/style-inject.es.cjs.js").default('/*!\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= */'),exports.default={"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"};
+//# sourceMappingURL=Spinner.module.scss.cjs.js.map

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

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

package/dist/cjs/_BaseStyling_/BaseStyling.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var r=require("react");exports.BaseStyling=({children:o,properties:e={}})=>{const l={colorPrimary50:"#E6E7F4",colorPrimary100:"#CDD0EA",colorPrimary300:"#6871BF",colorPrimary500:"#041295",colorPrimary600:"#030F77",colorPrimary700:"#020B59",colorPrimary900:"#01041E",colorBlueGrey25:"#F7F7F9",colorBlueGrey50:"#EEEFF3",colorBlueGrey100:"#DEDEE6",colorBlueGrey200:"#BCBECE",colorBlueGrey300:"#9A9DB5",colorBlueGrey400:"#797D9C",colorBlueGrey500:"#5D607E",colorBlueGrey700:"#383A4B",colorBlueGrey800:"#252733",colorBlueGrey900:"#131319",colorGreen100:"#D1E6DA",colorGreen200:"#A2CDB4",colorGreen500:"#178244",colorGreen600:"#126836",colorGreen700:"#0E4E29",colorOrange100:"#FFE0B2",colorOrange500:"#E07900",colorOrange600:"#B36100",colorOrange700:"#864900",colorRed100:"#FFCDD2",colorRed200:"#F3A599",colorRed500:"#E01E00",colorRed600:"#B31800",colorRed700:"#861200",colorBlack100:"#000000",colorBlack20:"rgba(0, 0, 0, 0.2)",colorBlack10:"rgba(0, 0, 0, 0.1)",colorWhite:"#FFFFFF",colorFocus:"var(--color-primary300)",colorPrimary:"var(--color-primary500)",colorSuccess:"var(--color-green500)",colorWarning:"var(--color-orange500)",colorDanger:"var(--color-red500)",defaultPressedColor:"var(--color-blue-grey100)",defaultHoverColor:"var(--color-blue-grey25)",defaultLineHeight:"1.5",dataGridLineHeight:"1.25",defaultBorderRadius:"0.25rem",focusBorderRadius:"0.125rem",buttonBorderRadius:"0.125rem",buttonBorderWidth:"2px",buttonFontSize:"0.875rem",buttonBorderStyle:"solid",buttonFillTextColor:"var(--light)",buttonPrimaryDefaultColor:"var(--color-primary500)",buttonPrimaryHoverColor:"var(--color-primary600)",buttonPrimaryFocusedColor:"var(--color-primary500)",buttonPrimaryPressedColor:"var(--color-primary700)",buttonSuccessDefaultColor:"var(--color-green500)",buttonSuccessHoverColor:"var(--color-green600)",buttonSuccessFocusedColor:"var(--color-green500)",buttonSuccessPressedColor:"var(--color-green700)",buttonDangerDefaultColor:"var(--color-red500)",buttonDangerHoverColor:"var(--color-red600)",buttonDangerFocusedColor:"var(--color-red500)",buttonDangerPressedColor:"var(--color-red700)",buttonWarningDefaultColor:"var(--color-orange500)",buttonWarningHoverColor:"var(--color-orange600)",buttonWarningFocusedColor:"var(--color-orange500)",buttonWarningPressedColor:"var(--color-orange700)",buttonDefaultColor:"var(--color-blue-grey700)",buttonDefaultHoverColor:"var(--color-blue-grey800)",buttonDefaultFocusedColor:"var(--color-blue-grey700)",buttonDefaultPressedColor:"var(--color-blue-grey800)",buttonOutlineHoverTextColor:"var(--color-primary600)",checkboxUncheckedHoverColor:"var(--color-blue-grey50)",checkboxUncheckedPressedColor:"var(--default-pressed-color)",checkboxCheckedHoverColor:"var(--color-primary600)",checkboxCheckedPressedColor:"var(--color-primary700)",radioHoverBackgroundColor:"var(--color-blue-grey50)",radioPressedBackgroundColor:"var(--default-pressed-color)",radioHoverColor:"var(--color-primary600)",radioPressedColor:"var(--color-primary700)",inputBorderRadius:"2px",inputBorderWidth:"1px",inputBorderWidthFocus:"1px",inputBorderStyle:"solid",fileUploadBorderWidth:"1px",dragDropBorderStyle:"dashed",inputBorderColor:"var(--color-blue-grey500)",inputBackgroundColor:"var(--light)",inputHelperTextColor:"var(--color-blue-grey500)",inputHoverBackgroundColor:"var(--default-hover-color)",inputDisabledBackgroundColor:"var(--input-hover-background-color)",dragBorderStyle:"solid",modalShadowColor:"rgba(0, 0, 0, 0.16)",modalBackgroundColor:"var(--light)",modalBackdropColor:"var(--default)",skeletonBackgroundColor:"var(--disabled)",skeletonAnimationColorRgb:"255, 255, 255",alertTextColor:"var(--default)",alertTextInvertedColor:"var(--light)",alertNeutralBackgroundColor:"var(--color-blue-grey50)",alertNeutralInvertedColor:"var(--color-blue-grey500)",alertInfoBackgroundColor:"var(--color-primary100)",alertInfoInvertedColor:"var(--color-primary500)",alertSuccessBackgroundColor:"var(--color-green100)",alertSuccessInvertedColor:"var(--color-green500)",alertErrorBackgroundColor:"var(--color-red100)",alertErrorInvertedColor:"var(--color-red500)",alertWarningBackgroundColor:"var(--color-orange100)",alertWarningInvertedColor:"var(--color-orange500)",alertBorderWidth:"4px",alertBorderRadius:"2px",stepperWaitingColor:"var(--color-blue-grey200)",stepperWaitingHoverColor:"var(--color-blue-grey300)",stepperWaitingActiveColor:"var(--color-blue-grey400)",stepperWaitingDisabledColor:"var(--color-blue-grey100)",stepperCurrentColor:"var(--color-primary500)",stepperCurrentHoverColor:"var(--color-primary600)",stepperCurrentActiveColor:"var(--color-primary700)",stepperCurrentDisabledColor:"var(--color-primary100)",stepperDoneColor:"var(--color-green500)",stepperDoneHoverColor:"var(--color-green600)",stepperDoneActiveColor:"var(--color-green700)",stepperDoneDisabledColor:"var(--color-green200)",stepperErrorColor:"var(--color-red500)",stepperErrorHoverColor:"var(--color-red600)",stepperErrorActiveColor:"var(--color-red700)",stepperErrorDisabledColor:"var(--color-red200)",stepperDefaultTextColor:"var(--color-white)",stepperLineColor:"var(--color-blue-grey300)",stepperLineBoldColor:"var(--color-blue-grey700)",stepperLineDisabledColor:"var(--color-blue-grey100)",stepperLineBoldDisabledColor:"var(--color-blue-grey300)",stepperLabelColor:"var(--color-blue-grey900)",stepperCaptionColor:"var(--color-blue-grey500)",stepperCaptionErrorColor:"var(--color-red500)",stepperLabelDisabledColor:"var(--color-blue-grey400)",stepperCaptionDisabledColor:"var(--color-blue-grey400)",stepperCaptionErrorDisabledColor:"var(--color-red200)",bannerBorderRadius:"2px",bannerBorderWidth:"0 0 0 4px",dataGridRowBackgroundColor:"transparent",dataGridRowHoverBackgroundColor:"var(--default-hover-color)",progressBarBackgroundColor:"var(--disabled)",tabsBackgroundColor:"var(--light)",tabActiveBorderHeight:"0.25rem",tabActiveBorderColor:"var(--color-primary)",tabActiveTextColor:"var(--color-primary)",tablistBorderWidth:"0.0625rem",tablistBorderStyle:"solid",tablistBorderColor:"var(--color-blue-grey100)",tabTextColor:"var(--color-blue-grey900)",tabHoverColor:"var(--default-hover-color)",tabPressedColor:"var(--default-pressed-color)",toggleBackgroundColor:"var(--color-blue-grey100)",tooltipBackgroundColor:"var(--default)",contextMenuHoverColor:"var(--default-hover-color)",contextMenuPressedColor:"var(--default-pressed-color)",default:"var(--color-blue-grey900)",success:"var(--color-green500)",error:"var(--color-red500)",info:"var(--color-primary500)",disabled:"var(--color-blue-grey100)",greyedOut:"var(--color-blue-grey400)",lightGreyBorder:"var(--color-blue-grey100)",warning:"var(--color-orange500)",light:"var(--color-white)",fontFamily:"Roboto, sans-serif",fontFamilyCode:"'Roboto Mono', monospace",fontSizeFormLabel:"0.875rem",fontSize:"1rem",fontSizeH1:"2.5rem",fontSizeH2:"1.625rem",fontSizeH3:"1.5rem",fontSizeH4:"1.25rem",fontSizeSub:".75rem",fontSizeCode:"1rem",formControlFontSize:"0.875rem",fontSizeDataGrid:"0.875rem"},[a,t]=r.useState(!0),c=r.useRef(null),n=r=>{for(const[o,e]of Object.entries(r)){const r=o.replace(/([A-Z])/g,(r=>`-${r.toLowerCase()}`));c.current.style.setProperty(`--${r}`,e)}};return r.useEffect((()=>{if(0!==Object.keys(e).length&&c.current){const r={...l,...e};n(r)}else c.current&&n(l);t(!1)}),[e,c.current]),r.createElement("div",{className:"basestyling-wrapper",ref:c},a?null:o)};
+"use strict";var r=require("react");exports.BaseStyling=({children:o,properties:e={}})=>{const l={colorPrimary50:"#E6E7F4",colorPrimary100:"#CDD0EA",colorPrimary300:"#6871BF",colorPrimary500:"#041295",colorPrimary600:"#030F77",colorPrimary700:"#020B59",colorPrimary900:"#01041E",colorBlueGrey25:"#F7F7F9",colorBlueGrey50:"#EEEFF3",colorBlueGrey100:"#DEDEE6",colorBlueGrey200:"#BCBECE",colorBlueGrey300:"#9A9DB5",colorBlueGrey400:"#797D9C",colorBlueGrey500:"#5D607E",colorBlueGrey700:"#383A4B",colorBlueGrey800:"#252733",colorBlueGrey900:"#131319",colorGreen100:"#D1E6DA",colorGreen200:"#A2CDB4",colorGreen500:"#178244",colorGreen600:"#126836",colorGreen700:"#0E4E29",colorOrange100:"#FFE0B2",colorOrange500:"#E07900",colorOrange600:"#B36100",colorOrange700:"#864900",colorRed100:"#FFCDD2",colorRed200:"#F3A599",colorRed500:"#E01E00",colorRed600:"#B31800",colorRed700:"#861200",colorBlack100:"#000000",colorBlack20:"rgba(0, 0, 0, 0.2)",colorBlack10:"rgba(0, 0, 0, 0.1)",colorWhite:"#FFFFFF",colorFocus:"var(--color-primary300)",colorPrimary:"var(--color-primary500)",colorSuccess:"var(--color-green500)",colorWarning:"var(--color-orange500)",colorDanger:"var(--color-red500)",defaultPressedColor:"var(--color-blue-grey100)",defaultHoverColor:"var(--color-blue-grey25)",defaultLineHeight:"1.5",dataGridLineHeight:"1.25",defaultBorderRadius:"0.25rem",focusBorderRadius:"0.125rem",buttonBorderRadius:"0.125rem",buttonBorderWidth:"2px",buttonFontSize:"0.875rem",buttonBorderStyle:"solid",buttonFillTextColor:"var(--light)",buttonPrimaryDefaultColor:"var(--color-primary500)",buttonPrimaryHoverColor:"var(--color-primary600)",buttonPrimaryFocusedColor:"var(--color-primary500)",buttonPrimaryPressedColor:"var(--color-primary700)",buttonSuccessDefaultColor:"var(--color-green500)",buttonSuccessHoverColor:"var(--color-green600)",buttonSuccessFocusedColor:"var(--color-green500)",buttonSuccessPressedColor:"var(--color-green700)",buttonDangerDefaultColor:"var(--color-red500)",buttonDangerHoverColor:"var(--color-red600)",buttonDangerFocusedColor:"var(--color-red500)",buttonDangerPressedColor:"var(--color-red700)",buttonWarningDefaultColor:"var(--color-orange500)",buttonWarningHoverColor:"var(--color-orange600)",buttonWarningFocusedColor:"var(--color-orange500)",buttonWarningPressedColor:"var(--color-orange700)",buttonDefaultColor:"var(--color-blue-grey700)",buttonDefaultHoverColor:"var(--color-blue-grey800)",buttonDefaultFocusedColor:"var(--color-blue-grey700)",buttonDefaultPressedColor:"var(--color-blue-grey800)",buttonOutlineHoverTextColor:"var(--color-primary600)",checkboxUncheckedHoverColor:"var(--color-blue-grey50)",checkboxUncheckedPressedColor:"var(--default-pressed-color)",checkboxCheckedHoverColor:"var(--color-primary600)",checkboxCheckedPressedColor:"var(--color-primary700)",radioHoverBackgroundColor:"var(--color-blue-grey50)",radioPressedBackgroundColor:"var(--default-pressed-color)",radioHoverColor:"var(--color-primary600)",radioPressedColor:"var(--color-primary700)",inputBorderRadius:"2px",inputBorderWidth:"1px",inputBorderWidthFocus:"1px",inputBorderStyle:"solid",fileUploadBorderWidth:"1px",dragDropBorderStyle:"dashed",inputBorderColor:"var(--color-blue-grey500)",inputBackgroundColor:"var(--light)",inputHelperTextColor:"var(--color-blue-grey500)",inputHoverBackgroundColor:"var(--default-hover-color)",inputDisabledBackgroundColor:"var(--input-hover-background-color)",dragBorderStyle:"solid",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)",alertTextInvertedColor:"var(--light)",alertNeutralBackgroundColor:"var(--color-blue-grey50)",alertNeutralInvertedColor:"var(--color-blue-grey500)",alertInfoBackgroundColor:"var(--color-primary100)",alertInfoInvertedColor:"var(--color-primary500)",alertSuccessBackgroundColor:"var(--color-green100)",alertSuccessInvertedColor:"var(--color-green500)",alertErrorBackgroundColor:"var(--color-red100)",alertErrorInvertedColor:"var(--color-red500)",alertWarningBackgroundColor:"var(--color-orange100)",alertWarningInvertedColor:"var(--color-orange500)",alertBorderWidth:"4px",alertBorderRadius:"2px",stepperWaitingColor:"var(--color-blue-grey200)",stepperWaitingHoverColor:"var(--color-blue-grey300)",stepperWaitingActiveColor:"var(--color-blue-grey400)",stepperWaitingDisabledColor:"var(--color-blue-grey100)",stepperCurrentColor:"var(--color-primary500)",stepperCurrentHoverColor:"var(--color-primary600)",stepperCurrentActiveColor:"var(--color-primary700)",stepperCurrentDisabledColor:"var(--color-primary100)",stepperDoneColor:"var(--color-green500)",stepperDoneHoverColor:"var(--color-green600)",stepperDoneActiveColor:"var(--color-green700)",stepperDoneDisabledColor:"var(--color-green200)",stepperErrorColor:"var(--color-red500)",stepperErrorHoverColor:"var(--color-red600)",stepperErrorActiveColor:"var(--color-red700)",stepperErrorDisabledColor:"var(--color-red200)",stepperDefaultTextColor:"var(--color-white)",stepperLineColor:"var(--color-blue-grey300)",stepperLineBoldColor:"var(--color-blue-grey700)",stepperLineDisabledColor:"var(--color-blue-grey100)",stepperLineBoldDisabledColor:"var(--color-blue-grey300)",stepperLabelColor:"var(--color-blue-grey900)",stepperCaptionColor:"var(--color-blue-grey500)",stepperCaptionErrorColor:"var(--color-red500)",stepperLabelDisabledColor:"var(--color-blue-grey400)",stepperCaptionDisabledColor:"var(--color-blue-grey400)",stepperCaptionErrorDisabledColor:"var(--color-red200)",bannerBorderRadius:"2px",bannerBorderWidth:"0 0 0 4px",dataGridRowBackgroundColor:"transparent",dataGridRowHoverBackgroundColor:"var(--default-hover-color)",progressBarBackgroundColor:"var(--disabled)",tabsBackgroundColor:"var(--light)",tabActiveBorderHeight:"0.25rem",tabActiveBorderColor:"var(--color-primary)",tabActiveTextColor:"var(--color-primary)",tablistBorderWidth:"0.0625rem",tablistBorderStyle:"solid",tablistBorderColor:"var(--color-blue-grey100)",tabTextColor:"var(--color-blue-grey900)",tabHoverColor:"var(--default-hover-color)",tabPressedColor:"var(--default-pressed-color)",toggleBackgroundColor:"var(--color-blue-grey100)",tooltipBackgroundColor:"var(--default)",contextMenuHoverColor:"var(--default-hover-color)",contextMenuPressedColor:"var(--default-pressed-color)",default:"var(--color-blue-grey900)",success:"var(--color-green500)",error:"var(--color-red500)",info:"var(--color-primary500)",disabled:"var(--color-blue-grey100)",greyedOut:"var(--color-blue-grey400)",lightGreyBorder:"var(--color-blue-grey100)",warning:"var(--color-orange500)",light:"var(--color-white)",fontFamily:"Roboto, sans-serif",fontFamilyCode:"'Roboto Mono', monospace",fontSizeFormLabel:"0.875rem",fontSize:"1rem",fontSizeH1:"2.5rem",fontSizeH2:"1.625rem",fontSizeH3:"1.5rem",fontSizeH4:"1.25rem",fontSizeSub:".75rem",fontSizeCode:"1rem",formControlFontSize:"0.875rem",fontSizeDataGrid:"0.875rem"},[a,t]=r.useState(!0),c=r.useRef(null),n=r=>{for(const[o,e]of Object.entries(r)){const r=o.replace(/([A-Z])/g,(r=>`-${r.toLowerCase()}`));c.current.style.setProperty(`--${r}`,e)}};return r.useEffect((()=>{if(0!==Object.keys(e).length&&c.current){const r={...l,...e};n(r)}else c.current&&n(l);t(!1)}),[e,c.current]),r.createElement("div",{className:"basestyling-wrapper",ref:c},a?null:o)};
 //# sourceMappingURL=BaseStyling.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BaseStyling.cjs.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":["children","properties","defaultProperties","colorPrimary50","colorPrimary100","colorPrimary300","colorPrimary500","colorPrimary600","colorPrimary700","colorPrimary900","colorBlueGrey25","colorBlueGrey50","colorBlueGrey100","colorBlueGrey200","colorBlueGrey300","colorBlueGrey400","colorBlueGrey500","colorBlueGrey700","colorBlueGrey800","colorBlueGrey900","colorGreen100","colorGreen200","colorGreen500","colorGreen600","colorGreen700","colorOrange100","colorOrange500","colorOrange600","colorOrange700","colorRed100","colorRed200","colorRed500","colorRed600","colorRed700","colorBlack100","colorBlack20","colorBlack10","colorWhite","colorFocus","colorPrimary","colorSuccess","colorWarning","colorDanger","defaultPressedColor","defaultHoverColor","defaultLineHeight","dataGridLineHeight","defaultBorderRadius","focusBorderRadius","buttonBorderRadius","buttonBorderWidth","buttonFontSize","buttonBorderStyle","buttonFillTextColor","buttonPrimaryDefaultColor","buttonPrimaryHoverColor","buttonPrimaryFocusedColor","buttonPrimaryPressedColor","buttonSuccessDefaultColor","buttonSuccessHoverColor","buttonSuccessFocusedColor","buttonSuccessPressedColor","buttonDangerDefaultColor","buttonDangerHoverColor","buttonDangerFocusedColor","buttonDangerPressedColor","buttonWarningDefaultColor","buttonWarningHoverColor","buttonWarningFocusedColor","buttonWarningPressedColor","buttonDefaultColor","buttonDefaultHoverColor","buttonDefaultFocusedColor","buttonDefaultPressedColor","buttonOutlineHoverTextColor","checkboxUncheckedHoverColor","checkboxUncheckedPressedColor","checkboxCheckedHoverColor","checkboxCheckedPressedColor","radioHoverBackgroundColor","radioPressedBackgroundColor","radioHoverColor","radioPressedColor","inputBorderRadius","inputBorderWidth","inputBorderWidthFocus","inputBorderStyle","fileUploadBorderWidth","dragDropBorderStyle","inputBorderColor","inputBackgroundColor","inputHelperTextColor","inputHoverBackgroundColor","inputDisabledBackgroundColor","dragBorderStyle","modalShadowColor","modalBackgroundColor","modalBackdropColor","skeletonBackgroundColor","skeletonAnimationColorRgb","alertTextColor","alertTextInvertedColor","alertNeutralBackgroundColor","alertNeutralInvertedColor","alertInfoBackgroundColor","alertInfoInvertedColor","alertSuccessBackgroundColor","alertSuccessInvertedColor","alertErrorBackgroundColor","alertErrorInvertedColor","alertWarningBackgroundColor","alertWarningInvertedColor","alertBorderWidth","alertBorderRadius","stepperWaitingColor","stepperWaitingHoverColor","stepperWaitingActiveColor","stepperWaitingDisabledColor","stepperCurrentColor","stepperCurrentHoverColor","stepperCurrentActiveColor","stepperCurrentDisabledColor","stepperDoneColor","stepperDoneHoverColor","stepperDoneActiveColor","stepperDoneDisabledColor","stepperErrorColor","stepperErrorHoverColor","stepperErrorActiveColor","stepperErrorDisabledColor","stepperDefaultTextColor","stepperLineColor","stepperLineBoldColor","stepperLineDisabledColor","stepperLineBoldDisabledColor","stepperLabelColor","stepperCaptionColor","stepperCaptionErrorColor","stepperLabelDisabledColor","stepperCaptionDisabledColor","stepperCaptionErrorDisabledColor","bannerBorderRadius","bannerBorderWidth","dataGridRowBackgroundColor","dataGridRowHoverBackgroundColor","progressBarBackgroundColor","tabsBackgroundColor","tabActiveBorderHeight","tabActiveBorderColor","tabActiveTextColor","tablistBorderWidth","tablistBorderStyle","tablistBorderColor","tabTextColor","tabHoverColor","tabPressedColor","toggleBackgroundColor","tooltipBackgroundColor","contextMenuHoverColor","contextMenuPressedColor","default","success","error","info","disabled","greyedOut","lightGreyBorder","warning","light","fontFamily","fontFamilyCode","fontSizeFormLabel","fontSize","fontSizeH1","fontSizeH2","fontSizeH3","fontSizeH4","fontSizeSub","fontSizeCode","formControlFontSize","fontSizeDataGrid","isLoading","setIsLoading","useState","baseStylingWrapper","useRef","setCSSProperties","CSSPropertiesObject","key","value","Object","entries","formattedPropertyName","replace","val","toLowerCase","current","style","setProperty","useEffect","keys","length","mergedState","React","className","ref"],"mappings":"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"}
+{"version":3,"file":"BaseStyling.cjs.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":["children","properties","defaultProperties","colorPrimary50","colorPrimary100","colorPrimary300","colorPrimary500","colorPrimary600","colorPrimary700","colorPrimary900","colorBlueGrey25","colorBlueGrey50","colorBlueGrey100","colorBlueGrey200","colorBlueGrey300","colorBlueGrey400","colorBlueGrey500","colorBlueGrey700","colorBlueGrey800","colorBlueGrey900","colorGreen100","colorGreen200","colorGreen500","colorGreen600","colorGreen700","colorOrange100","colorOrange500","colorOrange600","colorOrange700","colorRed100","colorRed200","colorRed500","colorRed600","colorRed700","colorBlack100","colorBlack20","colorBlack10","colorWhite","colorFocus","colorPrimary","colorSuccess","colorWarning","colorDanger","defaultPressedColor","defaultHoverColor","defaultLineHeight","dataGridLineHeight","defaultBorderRadius","focusBorderRadius","buttonBorderRadius","buttonBorderWidth","buttonFontSize","buttonBorderStyle","buttonFillTextColor","buttonPrimaryDefaultColor","buttonPrimaryHoverColor","buttonPrimaryFocusedColor","buttonPrimaryPressedColor","buttonSuccessDefaultColor","buttonSuccessHoverColor","buttonSuccessFocusedColor","buttonSuccessPressedColor","buttonDangerDefaultColor","buttonDangerHoverColor","buttonDangerFocusedColor","buttonDangerPressedColor","buttonWarningDefaultColor","buttonWarningHoverColor","buttonWarningFocusedColor","buttonWarningPressedColor","buttonDefaultColor","buttonDefaultHoverColor","buttonDefaultFocusedColor","buttonDefaultPressedColor","buttonOutlineHoverTextColor","checkboxUncheckedHoverColor","checkboxUncheckedPressedColor","checkboxCheckedHoverColor","checkboxCheckedPressedColor","radioHoverBackgroundColor","radioPressedBackgroundColor","radioHoverColor","radioPressedColor","inputBorderRadius","inputBorderWidth","inputBorderWidthFocus","inputBorderStyle","fileUploadBorderWidth","dragDropBorderStyle","inputBorderColor","inputBackgroundColor","inputHelperTextColor","inputHoverBackgroundColor","inputDisabledBackgroundColor","dragBorderStyle","modalShadowColor","modalBackgroundColor","modalBackdropColor","sideSheetShadowColorOne","sideSheetShadowColorTwo","skeletonBackgroundColor","skeletonAnimationColorRgb","alertTextColor","alertTextInvertedColor","alertNeutralBackgroundColor","alertNeutralInvertedColor","alertInfoBackgroundColor","alertInfoInvertedColor","alertSuccessBackgroundColor","alertSuccessInvertedColor","alertErrorBackgroundColor","alertErrorInvertedColor","alertWarningBackgroundColor","alertWarningInvertedColor","alertBorderWidth","alertBorderRadius","stepperWaitingColor","stepperWaitingHoverColor","stepperWaitingActiveColor","stepperWaitingDisabledColor","stepperCurrentColor","stepperCurrentHoverColor","stepperCurrentActiveColor","stepperCurrentDisabledColor","stepperDoneColor","stepperDoneHoverColor","stepperDoneActiveColor","stepperDoneDisabledColor","stepperErrorColor","stepperErrorHoverColor","stepperErrorActiveColor","stepperErrorDisabledColor","stepperDefaultTextColor","stepperLineColor","stepperLineBoldColor","stepperLineDisabledColor","stepperLineBoldDisabledColor","stepperLabelColor","stepperCaptionColor","stepperCaptionErrorColor","stepperLabelDisabledColor","stepperCaptionDisabledColor","stepperCaptionErrorDisabledColor","bannerBorderRadius","bannerBorderWidth","dataGridRowBackgroundColor","dataGridRowHoverBackgroundColor","progressBarBackgroundColor","tabsBackgroundColor","tabActiveBorderHeight","tabActiveBorderColor","tabActiveTextColor","tablistBorderWidth","tablistBorderStyle","tablistBorderColor","tabTextColor","tabHoverColor","tabPressedColor","toggleBackgroundColor","tooltipBackgroundColor","contextMenuHoverColor","contextMenuPressedColor","default","success","error","info","disabled","greyedOut","lightGreyBorder","warning","light","fontFamily","fontFamilyCode","fontSizeFormLabel","fontSize","fontSizeH1","fontSizeH2","fontSizeH3","fontSizeH4","fontSizeSub","fontSizeCode","formControlFontSize","fontSizeDataGrid","isLoading","setIsLoading","useState","baseStylingWrapper","useRef","setCSSProperties","CSSPropertiesObject","key","value","Object","entries","formattedPropertyName","replace","val","toLowerCase","current","style","setProperty","useEffect","keys","length","mergedState","React","className","ref"],"mappings":"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"}

package/dist/cjs/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/cjs/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/cjs/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/cjs/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[];
+}

package/dist/cjs/src/components/DataGrid/DataGridFilters/FilterKeyMapper.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/src/components/DataGrid/testUtils.d.ts

@@ -3,7 +3,9 @@ import { Filter } from "./DataGridFilters/DataGridFilters.interfaces";
  * @scope .
  * @scopeException stories/DataGrid/DataGrid.stories.tsx
  */
-export declare const useMockFilteringLogic: <T>(data: T[], filterValues: Filter[] | undefined) => {
+export declare const useMockFilteringLogic: <T extends {
+    [k: string]: string;
+}>(data: T[], filterValues: Filter[] | undefined) => {
     onFilterAdd: (filter: Filter) => void;
     onFilterEdit: (filter: Filter) => void;
     onFilterDelete: (id: string) => void;

package/dist/cjs/src/components/Form/Select/MultiSelect/MultiSelect.test.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 import { MultiSelectProps } from "../Select.interfaces";
 export declare const createMultiSelect: (params?: (defaultParams: MultiSelectProps) => MultiSelectProps) => {
     select: HTMLElement;
@@ -7,7 +6,7 @@ export declare const createMultiSelect: (params?: (defaultParams: MultiSelectPro
     dropdownWrapper: Element | null;
     container: HTMLElement;
     baseElement: HTMLElement;
-    debug: (baseElement?: import("react-dom/client").Container | (Element | Document) | Array<import("react-dom/client").Container | (Element | Document)> | undefined, maxLength?: number | undefined, options?: import("pretty-format").OptionsReceived | undefined) => void;
+    debug: (baseElement?: import("react-dom/client").Container | (Element | Document) | Array<import("react-dom/client").Container | (Element | Document)>, maxLength?: number, options?: import("pretty-format").OptionsReceived) => void;
     rerender: (ui: React.ReactNode) => void;
     unmount: () => void;
     asFragment: () => DocumentFragment;

package/dist/cjs/src/components/Form/Select/SingleSelect/Select.test.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 import { SingleSelectProps } from "../Select.interfaces";
 export declare const defaultParams: SingleSelectProps;
 export declare const createSelect: (params?: (defaultParams: SingleSelectProps) => SingleSelectProps) => {
@@ -8,7 +7,7 @@ export declare const createSelect: (params?: (defaultParams: SingleSelectProps)
     dropdownWrapper: Element | null;
     container: HTMLElement;
     baseElement: HTMLElement;
-    debug: (baseElement?: import("react-dom/client").Container | (Element | Document) | Array<import("react-dom/client").Container | (Element | Document)> | undefined, maxLength?: number | undefined, options?: import("pretty-format").OptionsReceived | undefined) => void;
+    debug: (baseElement?: import("react-dom/client").Container | (Element | Document) | Array<import("react-dom/client").Container | (Element | Document)>, maxLength?: number, options?: import("pretty-format").OptionsReceived) => void;
     rerender: (ui: React.ReactNode) => void;
     unmount: () => void;
     asFragment: () => DocumentFragment;

package/dist/cjs/src/components/Icon/Icon.d.ts

@@ -82,7 +82,10 @@ export declare enum Icons {
     ZoomIn = "zoom-in",
     ZoomOut = "zoom-out",
     ArrowUp = "arrow-up",
-    ExternalLink = "external-link"
+    ExternalLink = "external-link",
+    SideSheetHandle = "sidesheet-handle",
+    PendingCircle = "pending-circle",
+    MinusCircle = "minus-circle"
 }
 type Tag = "span" | "div" | "i";
 export interface Props extends ComponentPropsWithRef<"div"> {

package/dist/cjs/src/components/Notifications/BaseModal/BaseModal.d.ts

@@ -11,6 +11,7 @@ export interface Props extends ComponentPropsWithRef<"div"> {
     describedby?: string;
     disableEscapeKeyDown?: boolean;
     disableBackdrop?: boolean;
+    hideBackdrop?: boolean;
     forceContainerOpen?: boolean;
     zIndex?: number;
     domRoot?: HTMLElement;

package/dist/cjs/src/components/Notifications/BaseModal/BaseModalHeader/BaseModalHeader.d.ts

@@ -2,6 +2,7 @@ import React, { ComponentPropsWithRef } from "react";
 export interface Props extends ComponentPropsWithRef<"div"> {
     id: string;
     title: string;
+    description?: string;
     children?: React.ReactNode;
     onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;
 }

package/dist/cjs/src/components/Notifications/SideSheet/SideSheet.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { Props as ModalProps } from "../Modal/Modal";
+export interface Props extends Omit<ModalProps, "hideBackdrop" | "disableBackdrop"> {
+    handleButtonProps?: {
+        onOpen: () => void;
+        onClose: () => void;
+        title?: string;
+    };
+}
+export declare const SideSheet: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/src/components/Notifications/SideSheet/SideSheet.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/src/components/Notifications/SideSheet/SideSheetActions/SideSheetActions.d.ts

@@ -0,0 +1,2 @@
+export { BaseModalActions as SideSheetActions } from "../../BaseModal/BaseModalActions/BaseModalActions";
+export type { Props } from "../../BaseModal/BaseModalActions/BaseModalActions";