diff --git a/libraries/core-react/src/Scrim/Scrim.jsx b/libraries/core-react/src/Scrim/Scrim.jsx
deleted file mode 100644
index b0eb1ea55f..0000000000
--- a/libraries/core-react/src/Scrim/Scrim.jsx
+++ /dev/null
@@ -1,87 +0,0 @@
-// @ts-nocheck
-import React, { forwardRef, useEffect } from 'react'
-import PropTypes from 'prop-types'
-import styled from 'styled-components'
-import { scrim as tokens } from './Scrim.tokens'
-
-const { height, width, background } = tokens
-
-const StyledScrim = styled.div`
-  width: ${width};
-  height: ${height};
-  background: ${background};
-  position: fixed;
-  z-index: 11;
-  top: 0;
-  left: 0;
-  align-items: center;
-  justify-content: center;
-  display: flex;
-`
-
-const ScrimContent = styled.div`
-  width: auto;
-  height: auto;
-`
-
-export const Scrim = forwardRef(function EdsScrim(
-  { children, onClose, isDismissable, ...rest },
-  ref,
-) {
-  const handleClose = (event) => {
-    if (event) {
-      if (event.key === 'Escape' && isDismissable) {
-        onClose(event, false)
-      } else if (event.type === 'click' && isDismissable) {
-        onClose(event, false)
-      }
-    }
-  }
-
-  const handleContentClick = (event) => {
-    // Avoid event bubbling inside dialog/content inside scrim
-    event.stopPropagation()
-  }
-
-  useEffect(() => {
-    if (isDismissable) {
-      document.addEventListener('keydown', handleClose, false)
-    }
-
-    return () => {
-      document.removeEventListener('keydown', handleClose, false)
-    }
-  }, [])
-
-  return (
-    <StyledScrim
-      onClose={handleClose}
-      onClick={handleClose}
-      isDismissable={isDismissable}
-      {...rest}
-      ref={ref}
-    >
-      <ScrimContent onClick={handleContentClick}>{children}</ScrimContent>
-    </StyledScrim>
-  )
-})
-
-Scrim.displayName = 'eds-scrim'
-
-Scrim.propTypes = {
-  /** @ignore */
-  className: PropTypes.string,
-  /** @ignore */
-  children: PropTypes.node,
-  /** Function to handle closing scrim */
-  onClose: PropTypes.func,
-  /** Whether scrim can be dismissed with esc key */
-  isDismissable: PropTypes.bool,
-}
-
-Scrim.defaultProps = {
-  className: '',
-  children: undefined,
-  onClose: () => {},
-  isDismissable: false,
-}
diff --git a/libraries/core-react/src/Scrim/Scrim.test.jsx b/libraries/core-react/src/Scrim/Scrim.test.tsx
similarity index 92%
rename from libraries/core-react/src/Scrim/Scrim.test.jsx
rename to libraries/core-react/src/Scrim/Scrim.test.tsx
index 3f622c4090..13e64b71c1 100644
--- a/libraries/core-react/src/Scrim/Scrim.test.jsx
+++ b/libraries/core-react/src/Scrim/Scrim.test.tsx
@@ -1,5 +1,5 @@
 /* eslint-disable no-undef */
-import React, { useState } from 'react'
+import React, { KeyboardEvent, useState } from 'react'
 import { render, cleanup, screen, fireEvent } from '@testing-library/react'
 import '@testing-library/jest-dom'
 import 'jest-styled-components'
@@ -27,8 +27,8 @@ const DismissableScrim = () => {
   }
 
   return visibleScrim ? (
-    <Scrim onKeyDown={handleClose}>
-      <button type="button" onClick={() => setVisibleScrim()}>
+    <Scrim onClose={handleClose} isDismissable>
+      <button type="button" onClick={() => setVisibleScrim(false)}>
         OK
       </button>
     </Scrim>
diff --git a/libraries/core-react/src/Scrim/Scrim.tokens.js b/libraries/core-react/src/Scrim/Scrim.tokens.ts
similarity index 93%
rename from libraries/core-react/src/Scrim/Scrim.tokens.js
rename to libraries/core-react/src/Scrim/Scrim.tokens.ts
index 7892caee09..ea9c26ed9f 100644
--- a/libraries/core-react/src/Scrim/Scrim.tokens.js
+++ b/libraries/core-react/src/Scrim/Scrim.tokens.ts
@@ -1,4 +1,3 @@
-// @ts-nocheck
 import { tokens } from '@equinor/eds-tokens'
 
 const {
diff --git a/libraries/core-react/src/Scrim/Scrim.tsx b/libraries/core-react/src/Scrim/Scrim.tsx
new file mode 100644
index 0000000000..bb20466ed1
--- /dev/null
+++ b/libraries/core-react/src/Scrim/Scrim.tsx
@@ -0,0 +1,79 @@
+import React, { forwardRef, useEffect, MouseEvent } from 'react'
+import styled from 'styled-components'
+import { scrim as tokens } from './Scrim.tokens'
+
+const { height, width, background } = tokens
+
+type Props = {
+  /** Whether scrim can be dismissed with esc key */
+  isDismissable?: boolean
+  /** function to handle closing scrim */
+  onClose?: (event: MouseEvent | KeyboardEvent, open: boolean) => void
+} & React.HTMLAttributes<HTMLElement>
+
+const StyledScrim = styled.div<Props>`
+  width: ${width};
+  height: ${height};
+  background: ${background};
+  position: fixed;
+  z-index: 11;
+  top: 0;
+  left: 0;
+  align-items: center;
+  justify-content: center;
+  display: flex;
+`
+
+const ScrimContent = styled.div`
+  width: auto;
+  height: auto;
+`
+
+export const Scrim = forwardRef<HTMLDivElement, Props>(function EdsScrim(
+  { children, onClose, isDismissable = false, ...rest },
+  ref,
+) {
+  const handleKeyboardClose = (event: KeyboardEvent) => {
+    if (event) {
+      if (event.key === 'Escape' && isDismissable) {
+        onClose && onClose(event, false)
+      }
+    }
+  }
+
+  const handleMouseClose = (event: MouseEvent) => {
+    if (event) {
+      if (event.type === 'click' && isDismissable) {
+        onClose && onClose(event, false)
+      }
+    }
+  }
+
+  const handleContentClick = (event: MouseEvent) => {
+    // Avoid event bubbling inside dialog/content inside scrim
+    event.stopPropagation()
+  }
+
+  useEffect(() => {
+    if (isDismissable) {
+      document.addEventListener('keydown', handleKeyboardClose, false)
+    }
+
+    return () => {
+      document.removeEventListener('keydown', handleKeyboardClose, false)
+    }
+  }, [])
+
+  return (
+    <StyledScrim
+      onClick={handleMouseClose}
+      isDismissable={isDismissable}
+      {...rest}
+      ref={ref}
+    >
+      <ScrimContent onClick={handleContentClick}>{children}</ScrimContent>
+    </StyledScrim>
+  )
+})
+
+Scrim.displayName = 'Scrim'
diff --git a/libraries/core-react/src/Scrim/index.jsx b/libraries/core-react/src/Scrim/index.ts
similarity index 68%
rename from libraries/core-react/src/Scrim/index.jsx
rename to libraries/core-react/src/Scrim/index.ts
index 2b07f1b424..71f1baff8d 100644
--- a/libraries/core-react/src/Scrim/index.jsx
+++ b/libraries/core-react/src/Scrim/index.ts
@@ -1,2 +1 @@
-// @ts-nocheck
 export { Scrim } from './Scrim'