diff --git a/package.json b/package.json
index 2e5867c4..3b1f6662 100644
--- a/package.json
+++ b/package.json
@@ -30,6 +30,7 @@
     "polished": "^4.1.3",
     "react-dropzone": "^11.3.2",
     "react-table": "^7.7.0",
+    "react-use": "^17.3.2",
     "rifm": "^0.12.0",
     "web-vitals": "^0.2.4"
   },
diff --git a/src/components/Tabs/Tabs.stories.tsx b/src/components/Tabs/Tabs.stories.tsx
index 76270598..42e5f386 100644
--- a/src/components/Tabs/Tabs.stories.tsx
+++ b/src/components/Tabs/Tabs.stories.tsx
@@ -16,24 +16,20 @@ export default {
 } as Meta
 
 const Template: Story<TabsProps> = (props) => (
-  <Tabs {...props} initialOpenIndex={1} />
+  <Tabs initialOpenIndex={1} {...props}>
+    <Tabs.Tab key={0} title="Tab 1" />,
+    <Tabs.Tab key={1} title="Tab 2" />,
+    <Tabs.Tab key={2} title="Tab 3" />,
+    <Tabs.Panel index={0}>Stuff Goes here</Tabs.Panel>,
+    <Tabs.Panel index={1}>Other Goes here</Tabs.Panel>,
+    <Tabs.Panel index={2}>More Stuff Goes here</Tabs.Panel>,
+  </Tabs>
 )
 
 // Each story then reuses that template
 export const Default = Template.bind({})
-Default.args = {
-  children: [
-    <Tabs.Tab title="Tab 1" />,
-    <Tabs.Tab title="Tab 2" />,
-    <Tabs.Tab title="Tab 3" />,
-    <Tabs.Panel index={0}>Stuff Goes here</Tabs.Panel>,
-    <Tabs.Panel index={1}>Other Goes here</Tabs.Panel>,
-    <Tabs.Panel index={2}>More Stuff Goes here</Tabs.Panel>,
-  ],
-}
 
 export const WithInitialOpen = Template.bind({})
 WithInitialOpen.args = {
-  ...Default.args,
   initialOpenIndex: 0,
 }
diff --git a/src/components/Tabs/Tabs.tsx b/src/components/Tabs/Tabs.tsx
index 73d99929..a321a0b0 100644
--- a/src/components/Tabs/Tabs.tsx
+++ b/src/components/Tabs/Tabs.tsx
@@ -1,7 +1,9 @@
 /** @jsxImportSource theme-ui */
-import React, { useCallback, useState } from "react"
+import React, { useCallback, useMemo, useState } from "react"
+import { useThemeUI } from "theme-ui"
 import { useTabContext } from "./context"
 import { TabContext } from "./context"
+import { useMeasure } from "react-use"
 
 export interface TabsProps {
   initialOpenIndex?: number
@@ -39,7 +41,7 @@ const Tabs = ({ children, initialOpenIndex }: TabsProps) => {
   )
   return (
     <>
-      <div sx={{ display: "flex", flexDirection: "row" }}>
+      <div sx={{ display: "flex", flexDirection: "row", flexWrap: "nowrap" }}>
         {tabButton.map((item) => item)}
       </div>
       <div>{tabPanel.map((item) => item)}</div>
@@ -51,46 +53,130 @@ export interface TabButtonProps {
   title: string
 }
 
+const OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH = 18.53
+const ORANGE_RECT_LINES_WIDTH_DIFF = 8.12
+const LEFT_RIGHT_ORANGE_RECT_TO_BORDER_DISTANCE = 6.5
+const TEXT_PADDING = 6
+
+const SVG_HEIGHT = 36
+
 const TabButton = ({ title }: TabButtonProps) => {
   const { index, toggleOpen, openIndex } = useTabContext()
-  const isOpen = openIndex === index
+  const isFirstTab = useMemo(() => index === 0, [index])
+  const isOpen = useMemo(() => openIndex === index, [index, openIndex])
+  const { theme } = useThemeUI()
+  const [textRef, { width }] = useMeasure<HTMLSpanElement>()
+
+  const containerWidth = useMemo(() => {
+    if (isFirstTab)
+      return (
+        width +
+        TEXT_PADDING * 2 +
+        OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH +
+        LEFT_RIGHT_ORANGE_RECT_TO_BORDER_DISTANCE
+      )
+    return width + OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH * 2 + TEXT_PADDING * 2
+  }, [isFirstTab, width])
+
+  const borderPath = useMemo(() => {
+    if (isFirstTab) {
+      return `m 0.5 36 l 0 -27 c 0 -4 2 -8 6.53 -8 l ${
+        containerWidth -
+        OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH -
+        LEFT_RIGHT_ORANGE_RECT_TO_BORDER_DISTANCE
+      } 0 c 4.47 0 6.47 4 6.47 8 l 0 17 c 0 5 5 10 12 10`
+    }
+    return `m 0 36 c 8 -1 12 -6 12 -12 l 0 -15 c 0 -4 2 -8 6.53 -8 l ${
+      containerWidth - OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH * 2
+    } 0 c 4.47 0 6.47 4 6.47 8 l 0 17 c 0 5 5 10 12 10`
+  }, [containerWidth, isFirstTab])
+
+  const orangeRectPath = useMemo(() => {
+    if (isFirstTab) {
+      return `m 2.97 3.3 l ${
+        containerWidth -
+        OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH -
+        LEFT_RIGHT_ORANGE_RECT_TO_BORDER_DISTANCE +
+        ORANGE_RECT_LINES_WIDTH_DIFF
+      } 0 c 0 -1 -2.59 -2 -4.06 -2 l -${
+        containerWidth -
+        OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH -
+        LEFT_RIGHT_ORANGE_RECT_TO_BORDER_DISTANCE
+      } 0 c -1.53 0 -3.53 1 -4.06 2 z`
+    }
+    return `m 14.47 3.3 l ${
+      containerWidth -
+      OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH * 2 +
+      ORANGE_RECT_LINES_WIDTH_DIFF
+    } 0 c 0 -1 -2.59 -2 -4.06 -2 l -${
+      containerWidth - OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH * 2
+    } 0 c -1.53 0 -3.53 1 -4.06 2 z`
+  }, [containerWidth, isFirstTab])
+
+  const tabToggler = useCallback(() => {
+    if (openIndex !== index) toggleOpen(index)
+  }, [index, openIndex, toggleOpen])
+
   return (
     <div
-      role="button"
-      aria-disabled="false"
-      aria-expanded={isOpen}
+      onClick={tabToggler}
       sx={{
-        px: 6,
-        py: 2,
         cursor: "pointer",
-        position: "relative",
-        overflow: "hidden",
-        borderRadius: 2,
-        height: "36px",
-        borderBottomLeftRadius: 0,
-        borderBottomRightRadius: 0,
-        border: "1px solid",
-        borderColor: isOpen ? "text.90" : "transparent",
-        borderBottom: "none",
-        boxSizing: "border-box",
-        backgroundColor: isOpen ? "white" : "transparent",
-        transition: "background-color 150ms linear",
-        boxShadow: isOpen ? "0px 1px 12px rgba(0, 0, 0, 0.04)" : "none",
+        display: "grid",
+        height: SVG_HEIGHT,
+        mb: "-1px",
       }}
-      onClick={() => toggleOpen(index)}
     >
-      <span
+      <svg
+        aria-disabled="false"
+        aria-expanded={isOpen}
+        height={SVG_HEIGHT}
+        role="button"
         sx={{
-          position: "absolute",
-          top: 0,
-          left: 0,
-          height: "2px",
-          width: "100%",
-          backgroundColor: isOpen ? "primary" : "transparent",
+          cursor: "pointer",
+          mb: "-0.8px",
+          gridColumn: 1,
+          gridRow: 1,
+          zIndex: 1,
         }}
-      />
+        width={containerWidth}
+      >
+        <path
+          d={borderPath}
+          fill={isOpen ? "#ffffff" : "transparent"}
+          stroke={isOpen ? theme.colors?.text?.[90] : "transparent"}
+          strokeWidth={1}
+          sx={{
+            transition: "all 0.15s cubic-bezier(0.16, 1, 0.3, 1)",
+            transitionProperty: "fill, stroke",
+          }}
+        />
+        <path
+          d={orangeRectPath}
+          fill={isOpen ? theme.colors?.primary?.[0] : "transparent"}
+          sx={{
+            transition: "all 0.15s cubic-bezier(0.16, 1, 0.3, 1)",
+            transitionProperty: "fill, stroke",
+          }}
+        />
+      </svg>
       <span
-        sx={{ variant: "text.heading4", color: isOpen ? "text" : "text.40" }}
+        ref={textRef}
+        sx={{
+          alignSelf: "center",
+          color: isOpen ? "text" : "text.40",
+          gridColumn: 1,
+          gridRow: 1,
+          justifySelf: "center",
+          mr:
+            index === 0
+              ? OUTSIDE_BOTTOM_TO_TOP_CURVE_WIDTH -
+                LEFT_RIGHT_ORANGE_RECT_TO_BORDER_DISTANCE
+              : undefined,
+          variant: "text.heading4",
+          width: "fit-content",
+          zIndex: 2,
+        }}
       >
         {title}
       </span>
diff --git a/tests/images/Design System/Tab/Default/chrome.png b/tests/images/Design System/Tab/Default/chrome.png
index 41091806..fc8243c5 100644
Binary files a/tests/images/Design System/Tab/Default/chrome.png and b/tests/images/Design System/Tab/Default/chrome.png differ
diff --git a/tests/images/Design System/Tab/Default/firefox.png b/tests/images/Design System/Tab/Default/firefox.png
index 32452b1b..d26331f9 100644
Binary files a/tests/images/Design System/Tab/Default/firefox.png and b/tests/images/Design System/Tab/Default/firefox.png differ
diff --git a/tests/images/Design System/Tab/With Initial Open/chrome.png b/tests/images/Design System/Tab/With Initial Open/chrome.png
index 41091806..b8007997 100644
Binary files a/tests/images/Design System/Tab/With Initial Open/chrome.png and b/tests/images/Design System/Tab/With Initial Open/chrome.png differ
diff --git a/tests/images/Design System/Tab/With Initial Open/firefox.png b/tests/images/Design System/Tab/With Initial Open/firefox.png
index 32452b1b..eca6c59c 100644
Binary files a/tests/images/Design System/Tab/With Initial Open/firefox.png and b/tests/images/Design System/Tab/With Initial Open/firefox.png differ
diff --git a/yarn.lock b/yarn.lock
index fe19a822..bd4ce517 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4631,6 +4631,11 @@
     jest-diff "^26.0.0"
     pretty-format "^26.0.0"
 
+"@types/js-cookie@^2.2.6":
+  version "2.2.7"
+  resolved "https://registry.yarnpkg.com/@types/js-cookie/-/js-cookie-2.2.7.tgz#226a9e31680835a6188e887f3988e60c04d3f6a3"
+  integrity sha512-aLkWa0C0vO5b4Sr798E26QgOkss68Un0bLjs7u9qxzPT5CG+8DuNTffWES58YzJs3hrVAOs1wonycqEBqNJubA==
+
 "@types/json-schema@*", "@types/json-schema@^7.0.3", "@types/json-schema@^7.0.4", "@types/json-schema@^7.0.5", "@types/json-schema@^7.0.7", "@types/json-schema@^7.0.8":
   version "7.0.9"
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.9.tgz#97edc9037ea0c38585320b28964dde3b39e4660d"
@@ -5232,6 +5237,11 @@
     "@webassemblyjs/wast-parser" "1.9.0"
     "@xtuc/long" "4.2.2"
 
+"@xobotyi/scrollbar-width@^1.9.5":
+  version "1.9.5"
+  resolved "https://registry.yarnpkg.com/@xobotyi/scrollbar-width/-/scrollbar-width-1.9.5.tgz#80224a6919272f405b87913ca13b92929bdf3c4d"
+  integrity sha512-N8tkAACJx2ww8vFMneJmaAgmjAG1tnVBZJRLRcx061tmsLRZHSEZSLuGWnwPtunsSLvSqXQ2wfp7Mgqg1I+2dQ==
+
 "@xtuc/ieee754@^1.2.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@xtuc/ieee754/-/ieee754-1.2.0.tgz#eef014a3145ae477a1cbc00cd1e552336dceb790"
@@ -7781,6 +7791,14 @@ css-has-pseudo@^0.10.0:
     postcss "^7.0.6"
     postcss-selector-parser "^5.0.0-rc.4"
 
+css-in-js-utils@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/css-in-js-utils/-/css-in-js-utils-2.0.1.tgz#3b472b398787291b47cfe3e44fecfdd9e914ba99"
+  integrity sha512-PJF0SpJT+WdbVVt0AOYp9C8GnuruRlL/UFW7932nLWmFLQTaWEzTBQEx7/hn4BuV+WON75iAViSUJLiU3PKbpA==
+  dependencies:
+    hyphenate-style-name "^1.0.2"
+    isobject "^3.0.1"
+
 css-initials@^0.3.1:
   version "0.3.1"
   resolved "https://registry.yarnpkg.com/css-initials/-/css-initials-0.3.1.tgz#0406d78e586fd12b9984a3f7d8a87fcbb2073208"
@@ -8023,6 +8041,11 @@ csstype@^3.0.2, csstype@^3.0.5:
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.9.tgz#6410af31b26bd0520933d02cbc64fce9ce3fbf0b"
   integrity sha512-rpw6JPxK6Rfg1zLOYCSwle2GFOOsnjmDYDaBwEcwoOg4qlsIVCN789VkBZDJAGi4T07gI4YSutR43t9Zz4Lzuw==
 
+csstype@^3.0.6:
+  version "3.0.10"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.10.tgz#2ad3a7bed70f35b965707c092e5f30b327c290e5"
+  integrity sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==
+
 cyclist@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-1.0.1.tgz#596e9698fd0c80e12038c2b82d6eb1b35b6224d9"
@@ -9778,11 +9801,21 @@ fast-levenshtein@^2.0.6, fast-levenshtein@~2.0.6:
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
   integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=
 
+fast-shallow-equal@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/fast-shallow-equal/-/fast-shallow-equal-1.0.0.tgz#d4dcaf6472440dcefa6f88b98e3251e27f25628b"
+  integrity sha512-HPtaa38cPgWvaCFmRNhlc6NG7pv6NUHqjPgVAkWGoB9mQMwYB27/K0CvOM5Czy+qpT3e8XJ6Q4aPAnzpNpzNaw==
+
 fastest-levenshtein@^1.0.9:
   version "1.0.12"
   resolved "https://registry.yarnpkg.com/fastest-levenshtein/-/fastest-levenshtein-1.0.12.tgz#9990f7d3a88cc5a9ffd1f1745745251700d497e2"
   integrity sha512-On2N+BpYJ15xIC974QNVuYGMOlEVt4s0EOI3wwMqOmK1fdDY+FN/zltPV8vosq4ad4c/gJ1KHScUn/6AWIgiow==
 
+fastest-stable-stringify@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/fastest-stable-stringify/-/fastest-stable-stringify-2.0.2.tgz#3757a6774f6ec8de40c4e86ec28ea02417214c76"
+  integrity sha512-bijHueCGd0LqqNK9b5oCMHc0MluJAx0cwqASgbWMvkO01lCYgIhacVRLcaDz3QnyYIRNJRDwMb41VuT6pHJ91Q==
+
 fastq@^1.6.0:
   version "1.13.0"
   resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.13.0.tgz#616760f88a7526bdfc596b7cab8c18938c36b98c"
@@ -11284,7 +11317,7 @@ husky@^4.3.8:
     slash "^3.0.0"
     which-pm-runs "^1.0.0"
 
-hyphenate-style-name@^1.0.3:
+hyphenate-style-name@^1.0.2, hyphenate-style-name@^1.0.3:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/hyphenate-style-name/-/hyphenate-style-name-1.0.4.tgz#691879af8e220aea5750e8827db4ef62a54e361d"
   integrity sha512-ygGZLjmXfPHj+ZWh6LwbC37l43MhfztxetbFCoYTM2VjkIUpeHgSNn7QIyVFj7YQ1Wl9Cbw5sholVJPzWvC2MQ==
@@ -11473,6 +11506,13 @@ inline-style-parser@0.1.1:
   resolved "https://registry.yarnpkg.com/inline-style-parser/-/inline-style-parser-0.1.1.tgz#ec8a3b429274e9c0a1f1c4ffa9453a7fef72cea1"
   integrity sha512-7NXolsK4CAS5+xvdj5OMMbI962hU/wvwoxk+LWR9Ek9bVtyuuYScDN6eS0rUm6TxApFpw7CX1o4uJzcd4AyD3Q==
 
+inline-style-prefixer@^6.0.0:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/inline-style-prefixer/-/inline-style-prefixer-6.0.1.tgz#c5c0e43ba8831707afc5f5bbfd97edf45c1fa7ae"
+  integrity sha512-AsqazZ8KcRzJ9YPN1wMH2aNM7lkWQ8tSPrW5uDk1ziYwiAPWSZnUsC7lfZq+BDqLqz0B4Pho5wscWcJzVvRzDQ==
+  dependencies:
+    css-in-js-utils "^2.0.0"
+
 inquirer@8.1.5:
   version "8.1.5"
   resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-8.1.5.tgz#2dc5159203c826d654915b5fe6990fd17f54a150"
@@ -12736,6 +12776,11 @@ jest@26.6.0:
     import-local "^3.0.2"
     jest-cli "^26.6.0"
 
+js-cookie@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-2.2.1.tgz#69e106dc5d5806894562902aa5baec3744e9b2b8"
+  integrity sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ==
+
 js-string-escape@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/js-string-escape/-/js-string-escape-1.0.1.tgz#e2625badbc0d67c7533e9edc1068c587ae4137ef"
@@ -14157,6 +14202,20 @@ nan@^2.12.1, nan@^2.14.1, nan@^2.15.0:
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.15.0.tgz#3f34a473ff18e15c1b5626b62903b5ad6e665fee"
   integrity sha512-8ZtvEnA2c5aYCZYd1cvgdnU6cqwixRoYg70xPLWUws5ORTa/lnw+u4amixRS/Ac5U5mQVgp9pnlSUnbNWFaWZQ==
 
+nano-css@^5.3.1:
+  version "5.3.4"
+  resolved "https://registry.yarnpkg.com/nano-css/-/nano-css-5.3.4.tgz#40af6a83a76f84204f346e8ccaa9169cdae9167b"
+  integrity sha512-wfcviJB6NOxDIDfr7RFn/GlaN7I/Bhe4d39ZRCJ3xvZX60LVe2qZ+rDqM49nm4YT81gAjzS+ZklhKP/Gnfnubg==
+  dependencies:
+    css-tree "^1.1.2"
+    csstype "^3.0.6"
+    fastest-stable-stringify "^2.0.2"
+    inline-style-prefixer "^6.0.0"
+    rtl-css-js "^1.14.0"
+    sourcemap-codec "^1.4.8"
+    stacktrace-js "^2.0.2"
+    stylis "^4.0.6"
+
 nanocolors@^0.2.12, nanocolors@^0.2.2, nanocolors@^0.2.8:
   version "0.2.12"
   resolved "https://registry.yarnpkg.com/nanocolors/-/nanocolors-0.2.12.tgz#4d05932e70116078673ea4cc6699a1c56cc77777"
@@ -16937,6 +16996,31 @@ react-textarea-autosize@^8.3.0:
     use-composed-ref "^1.0.0"
     use-latest "^1.0.0"
 
+react-universal-interface@^0.6.2:
+  version "0.6.2"
+  resolved "https://registry.yarnpkg.com/react-universal-interface/-/react-universal-interface-0.6.2.tgz#5e8d438a01729a4dbbcbeeceb0b86be146fe2b3b"
+  integrity sha512-dg8yXdcQmvgR13RIlZbTRQOoUrDciFVoSBZILwjE2LFISxZZ8loVJKAkuzswl5js8BHda79bIb2b84ehU8IjXw==
+
+react-use@^17.3.2:
+  version "17.3.2"
+  resolved "https://registry.yarnpkg.com/react-use/-/react-use-17.3.2.tgz#448abf515f47c41c32455024db28167cb6e53be8"
+  integrity sha512-bj7OD0/1wL03KyWmzFXAFe425zziuTf7q8olwCYBfOeFHY1qfO1FAMjROQLsLZYwG4Rx63xAfb7XAbBrJsZmEw==
+  dependencies:
+    "@types/js-cookie" "^2.2.6"
+    "@xobotyi/scrollbar-width" "^1.9.5"
+    copy-to-clipboard "^3.3.1"
+    fast-deep-equal "^3.1.3"
+    fast-shallow-equal "^1.0.0"
+    js-cookie "^2.2.1"
+    nano-css "^5.3.1"
+    react-universal-interface "^0.6.2"
+    resize-observer-polyfill "^1.5.1"
+    screenfull "^5.1.0"
+    set-harmonic-interval "^1.0.1"
+    throttle-debounce "^3.0.1"
+    ts-easing "^0.2.0"
+    tslib "^2.1.0"
+
 react@^17.0.2:
   version "17.0.2"
   resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
@@ -17399,6 +17483,11 @@ reserved-words@^0.1.2:
   resolved "https://registry.yarnpkg.com/reserved-words/-/reserved-words-0.1.2.tgz#00a0940f98cd501aeaaac316411d9adc52b31ab1"
   integrity sha1-AKCUD5jNUBrqqsMWQR2a3FKzGrE=
 
+resize-observer-polyfill@^1.5.1:
+  version "1.5.1"
+  resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz#0e9020dd3d21024458d4ebd27e23e40269810464"
+  integrity sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg==
+
 resolve-alpn@^1.0.0:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/resolve-alpn/-/resolve-alpn-1.2.1.tgz#b7adbdac3546aaaec20b45e7d8265927072726f9"
@@ -17687,6 +17776,13 @@ rsvp@^4.8.4:
   resolved "https://registry.yarnpkg.com/rsvp/-/rsvp-4.8.5.tgz#c8f155311d167f68f21e168df71ec5b083113734"
   integrity sha512-nfMOlASu9OnRJo1mbEk2cz0D56a1MBNrJ7orjRZQG10XDyuvwksKbuXNp6qa+kbn839HwjwhBzhFmdsaEAfauA==
 
+rtl-css-js@^1.14.0:
+  version "1.15.0"
+  resolved "https://registry.yarnpkg.com/rtl-css-js/-/rtl-css-js-1.15.0.tgz#680ed816e570a9ebccba9e1cd0f202c6a8bb2dc0"
+  integrity sha512-99Cu4wNNIhrI10xxUaABHsdDqzalrSRTie4GeCmbGVuehm4oj+fIy8fTzB+16pmKe8Bv9rl+hxIBez6KxExTew==
+  dependencies:
+    "@babel/runtime" "^7.1.2"
+
 run-async@^2.4.0:
   version "2.4.1"
   resolved "https://registry.yarnpkg.com/run-async/-/run-async-2.4.1.tgz#8440eccf99ea3e70bd409d49aab88e10c189a455"
@@ -17841,6 +17937,11 @@ schema-utils@^3.0.0:
     ajv "^6.12.5"
     ajv-keywords "^3.5.2"
 
+screenfull@^5.1.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/screenfull/-/screenfull-5.2.0.tgz#6533d524d30621fc1283b9692146f3f13a93d1ba"
+  integrity sha512-9BakfsO2aUQN2K9Fdbj87RJIEZ82Q9IGim7FqM5OsebfoFC6ZHXgDq/KvniuLTPdeM8wY2o6Dj3WQ7KeQCj3cA==
+
 select-hose@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/select-hose/-/select-hose-2.0.0.tgz#625d8658f865af43ec962bfc376a37359a4994ca"
@@ -17994,6 +18095,11 @@ set-blocking@^2.0.0, set-blocking@~2.0.0:
   resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7"
   integrity sha1-BF+XgtARrppoA93TgrJDkrPYkPc=
 
+set-harmonic-interval@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/set-harmonic-interval/-/set-harmonic-interval-1.0.1.tgz#e1773705539cdfb80ce1c3d99e7f298bb3995249"
+  integrity sha512-AhICkFV84tBP1aWqPwLZqFvAwqEoVA9kxNMniGEUvzOlm4vLmOFLiTT3UZ6bziJTy4bOVpzWGTfSCbmaayGx8g==
+
 set-immediate-shim@~1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz#4b2b1b27eb808a9f8dcc481a58e5e56f599f3f61"
@@ -18264,6 +18370,11 @@ source-map-url@^0.4.0:
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.1.tgz#0af66605a745a5a2f91cf1bbf8a7afbc283dec56"
   integrity sha512-cPiFOTLUKvJFIg4SKVScy4ilPPW6rFgMgfuZJPNoDuMs3nC1HbMUycBoJw77xFIp6z1UJQJOfx6C9GMH80DiTw==
 
+source-map@0.5.6:
+  version "0.5.6"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.6.tgz#75ce38f52bf0733c5a7f0c118d81334a2bb5f412"
+  integrity sha1-dc449SvwczxafwwRjYEzSiu19BI=
+
 source-map@0.6.1, source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
@@ -18279,7 +18390,7 @@ source-map@^0.7.3, source-map@~0.7.2:
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383"
   integrity sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==
 
-sourcemap-codec@^1.4.4:
+sourcemap-codec@^1.4.4, sourcemap-codec@^1.4.8:
   version "1.4.8"
   resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"
   integrity sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==
@@ -18415,6 +18526,13 @@ stable@^0.1.8:
   resolved "https://registry.yarnpkg.com/stable/-/stable-0.1.8.tgz#836eb3c8382fe2936feaf544631017ce7d47a3cf"
   integrity sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w==
 
+stack-generator@^2.0.5:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/stack-generator/-/stack-generator-2.0.5.tgz#fb00e5b4ee97de603e0773ea78ce944d81596c36"
+  integrity sha512-/t1ebrbHkrLrDuNMdeAcsvynWgoH/i4o8EGGfX7dEYDoTXOYVAkEpFdtshlvabzc6JlJ8Kf9YdFEoz7JkzGN9Q==
+  dependencies:
+    stackframe "^1.1.1"
+
 stack-utils@^2.0.2:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-2.0.5.tgz#d25265fca995154659dbbfba3b49254778d2fdd5"
@@ -18427,6 +18545,23 @@ stackframe@^1.1.1:
   resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.2.0.tgz#52429492d63c62eb989804c11552e3d22e779303"
   integrity sha512-GrdeshiRmS1YLMYgzF16olf2jJ/IzxXY9lhKOskuVziubpTYcYqyOwYeJKzQkwy7uN0fYSsbsC4RQaXf9LCrYA==
 
+stacktrace-gps@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/stacktrace-gps/-/stacktrace-gps-3.0.4.tgz#7688dc2fc09ffb3a13165ebe0dbcaf41bcf0c69a"
+  integrity sha512-qIr8x41yZVSldqdqe6jciXEaSCKw1U8XTXpjDuy0ki/apyTn/r3w9hDAAQOhZdxvsC93H+WwwEu5cq5VemzYeg==
+  dependencies:
+    source-map "0.5.6"
+    stackframe "^1.1.1"
+
+stacktrace-js@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/stacktrace-js/-/stacktrace-js-2.0.2.tgz#4ca93ea9f494752d55709a081d400fdaebee897b"
+  integrity sha512-Je5vBeY4S1r/RnLydLl0TBTi3F2qdfWmYsGvtfZgEI+SCprPppaIhQf5nGcal4gI4cGpCV/duLcAzT1np6sQqg==
+  dependencies:
+    error-stack-parser "^2.0.6"
+    stack-generator "^2.0.5"
+    stacktrace-gps "^3.0.4"
+
 state-toggle@^1.0.0:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/state-toggle/-/state-toggle-1.0.3.tgz#e123b16a88e143139b09c6852221bc9815917dfe"
@@ -18789,6 +18924,11 @@ stylis@^4.0.3:
   resolved "https://registry.yarnpkg.com/stylis/-/stylis-4.0.10.tgz#446512d1097197ab3f02fb3c258358c3f7a14240"
   integrity sha512-m3k+dk7QeJw660eIKRRn3xPF6uuvHs/FFzjX3HQ5ove0qYsiygoAhwn5a3IYKaZPo5LrYD0rfVmtv1gNY1uYwg==
 
+stylis@^4.0.6:
+  version "4.0.13"
+  resolved "https://registry.yarnpkg.com/stylis/-/stylis-4.0.13.tgz#f5db332e376d13cc84ecfe5dace9a2a51d954c91"
+  integrity sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==
+
 supports-color@8.1.1:
   version "8.1.1"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-8.1.1.tgz#cd6fc17e28500cff56c1b86c0a7fd4a54a73005c"
@@ -19268,6 +19408,11 @@ ts-dedent@^2.0.0, ts-dedent@^2.1.1:
   resolved "https://registry.yarnpkg.com/ts-dedent/-/ts-dedent-2.2.0.tgz#39e4bd297cd036292ae2394eb3412be63f563bb5"
   integrity sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==
 
+ts-easing@^0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/ts-easing/-/ts-easing-0.2.0.tgz#c8a8a35025105566588d87dbda05dd7fbfa5a4ec"
+  integrity sha512-Z86EW+fFFh/IFB1fqQ3/+7Zpf9t2ebOAxNI/V6Wo7r5gqiqtxmgTlQ1qbqQcjLKYeSHPTsEmvlJUDg/EuL0uHQ==
+
 ts-essentials@^2.0.3:
   version "2.0.12"
   resolved "https://registry.yarnpkg.com/ts-essentials/-/ts-essentials-2.0.12.tgz#c9303f3d74f75fa7528c3d49b80e089ab09d8745"