diff --git a/package.json b/package.json
index f21c6e3..b000e8a 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
     "react-dom": "^16.11.0",
     "react-h5-audio-player": "^3.4.1",
     "react-helmet": "^5.2.1",
+    "react-rnd": "^10.2.4",
     "react-transition-group": "^4.4.1",
     "remark-html": "^13.0.1",
     "remark-parse": "^9.0.0",
diff --git a/src/components/bigBell.tsx b/src/components/bigBell.tsx
new file mode 100644
index 0000000..0bd9b08
--- /dev/null
+++ b/src/components/bigBell.tsx
@@ -0,0 +1,215 @@
+import React, { useRef, useState } from 'react';
+import { useStaticQuery, graphql } from 'gatsby';
+import Img from 'gatsby-image';
+import styled from 'styled-components';
+import { Rnd } from 'react-rnd';
+import UseWindowDimensions from './useWindowDimensions';
+import Omikuji from './omikuji';
+
+const BigBellContainer = styled.div`
+  position: absolute;
+  pointer-events: none;
+  display: ${(props) => (props.display ? 'flex' : 'none')};
+  justify-content: center;
+  width: 100%;
+  align-items: flex-end;
+  height: 100%;
+  z-index: 2;
+  > div {
+    text-align: center;
+    width: 50%;
+    display: flex;
+  }
+`;
+const BigBellImg = styled((props) => <Img {...props} />)`
+  flex: 1 1 auto;
+  align-items: flex-end;
+`;
+
+const StickImg = styled((props) => <Img {...props} />)`
+  pointer-events: none;
+  display: ${(props) => (props.display ? 'flex' : 'none')};
+`;
+
+const StickContainer = styled.div`
+  position: relative;
+  height: 50%;
+`;
+
+const Counter = styled.p`
+  margin-bottom: ${(props) => props.margin}px;
+  font-size: ${(props) => props.fontSize}px;
+`;
+
+const NumberText = styled.span`
+  color: #ebff00;
+  background-color: #000000;
+  padding: 2px 3px 2px 5px;
+  margin: 0 2px;
+  box-sizing: border-box;
+`;
+
+const style = {
+  'pointer-events': 'auto',
+  alignItems: 'center',
+  justifyContent: 'center',
+  border: 'solid 0px',
+  background: 'transparent',
+  cursor: 'ew-resize',
+};
+
+const BigBell = () => {
+  const data = useStaticQuery(
+    graphql`
+      query {
+        bigBell: file(
+          relativePath: { eq: "big_bell.png" }
+        ) {
+          childImageSharp {
+            fluid {
+              ...GatsbyImageSharpFluid
+            }
+          }
+        }
+        stick1: file(
+          relativePath: { eq: "kanetukibou_1.png" }
+        ) {
+          childImageSharp {
+            fluid {
+              ...GatsbyImageSharpFluid
+            }
+          }
+        }
+        stick2: file(
+          relativePath: { eq: "kanetukibou_2.png" }
+        ) {
+          childImageSharp {
+            fluid {
+              ...GatsbyImageSharpFluid
+            }
+          }
+        }
+      }
+    `,
+  );
+  const el = useRef(null);
+  const special = useRef(null);
+  const stick1Img = useRef(null);
+  const stick2Img = useRef(null);
+  const windowWidth =
+    UseWindowDimensions().width > 1080
+      ? 1080
+      : UseWindowDimensions().width;
+  const BONNOU_COUNT = 108;
+  const [count, setCount] = useState(BONNOU_COUNT);
+  const [isSeparated, separate] = useState(true);
+  const [isWoundUp, windUp] = useState(false);
+  const [
+    isSpecialContentOpened,
+    openSpecialContent,
+  ] = useState(false);
+
+  return (
+    <>
+      <BigBellContainer display="true">
+        <StickContainer>
+          <Rnd
+            style={style}
+            size={{
+              width: windowWidth / 12,
+              height: windowWidth / 12,
+            }}
+            position={{
+              x: windowWidth / 4 + windowWidth / 10,
+              y: ((windowWidth / 2) * (180 / 328)) / 2,
+            }}
+            dragAxis="x"
+            enableResizing={false}
+            onDrag={(_e, d) => {
+              if (d.x <= windowWidth / 3.5) {
+                if (isSeparated) {
+                  try {
+                    if (!el.current.paused) {
+                      el.current.pause();
+                      el.current.currentTime = 0;
+                    }
+                    el.current.play();
+                    windUp(false);
+                  } catch (e) {}
+                  setCount(count - 1);
+                  if (count <= 1) {
+                    openSpecialContent(true);
+                    setCount(BONNOU_COUNT);
+                    special.current.play();
+                  }
+                  console.log('PLAY');
+                  separate(false);
+                }
+              } else {
+                separate(true);
+                openSpecialContent(false);
+                if (d.deltaX < -2) {
+                  windUp(true);
+                } else if (d.deltaX > 0) {
+                  windUp(false);
+                }
+              }
+            }}
+          >
+            <StickImg
+              ref={stick1Img}
+              display={!isWoundUp}
+              fluid={data.stick1.childImageSharp.fluid}
+              alt="鐘付き棒"
+            />
+            <StickImg
+              ref={stick2Img}
+              display={isWoundUp}
+              fluid={data.stick2.childImageSharp.fluid}
+              alt="振りかぶった鐘付き棒"
+            />
+          </Rnd>
+          <audio ref={el}>
+            <source
+              src="/mp3/bell03.mp3"
+              type="audio/mp3"
+            />
+          </audio>
+          <audio ref={special}>
+            <source
+              src="/mp3/bonnou_taisan.mp3"
+              type="audio/mp3"
+            />
+          </audio>
+        </StickContainer>
+      </BigBellContainer>
+      <BigBellContainer display="true">
+        <div>
+          <BigBellImg
+            fluid={data.bigBell.childImageSharp.fluid}
+            alt="除夜の鐘"
+          />
+        </div>
+      </BigBellContainer>
+      <BigBellContainer display="true">
+        <Counter
+          margin={windowWidth / 5}
+          fontSize={windowWidth / 50}
+        >
+          {[...count.toString()].map((str, index) => {
+            return (
+              <NumberText key={str + String(index)}>
+                {str}
+              </NumberText>
+            );
+          })}
+        </Counter>
+      </BigBellContainer>
+      <BigBellContainer display={isSpecialContentOpened}>
+        <Omikuji />
+      </BigBellContainer>
+    </>
+  );
+};
+
+export default BigBell;
diff --git a/src/components/hero.tsx b/src/components/hero.tsx
index 20bcb75..5a166d4 100644
--- a/src/components/hero.tsx
+++ b/src/components/hero.tsx
@@ -5,6 +5,7 @@ import styled from 'styled-components';
 import moment from 'moment';
 import SunCalc from 'suncalc';
 import Mochimaki from './mochimaki';
+import BigBell from './bigBell';
 
 const HeroContainer = styled.div`
   position: relative;
@@ -59,7 +60,7 @@ const TempleContainer = styled.div`
   align-items: flex-end;
   height: 100%;
   z-index: 2;
-  div {
+  > div {
     text-align: center;
     width: 50%;
     display: flex;
@@ -141,6 +142,10 @@ const Hero = () => {
     times.sunriseEnd,
     times.night,
   );
+  const isLastDay = currentTime.isSame(
+    moment().endOf('year'),
+    'day',
+  );
 
   return (
     <HeroContainer>
@@ -161,19 +166,26 @@ const Hero = () => {
           />
         </div>
       </LogoContainer>
-      <Mochimaki />
-      <TempleContainer>
-        <div>
-          <TempleImg
-            fluid={
-              isDayTime
-                ? data.templedDay.childImageSharp.fluid
-                : data.templedNight.childImageSharp.fluid
-            }
-            alt="本堂"
-          />
-        </div>
-      </TempleContainer>
+      {isLastDay ? (
+        <BigBell />
+      ) : (
+        <>
+          <Mochimaki />
+          <TempleContainer>
+            <div>
+              <TempleImg
+                fluid={
+                  isDayTime
+                    ? data.templedDay.childImageSharp.fluid
+                    : data.templedNight.childImageSharp
+                        .fluid
+                }
+                alt="本堂"
+              />
+            </div>
+          </TempleContainer>
+        </>
+      )}
       <ScaffoldContainer>
         <div>
           {isUnderConstruction && (
diff --git a/src/components/omikuji.tsx b/src/components/omikuji.tsx
new file mode 100644
index 0000000..4532576
--- /dev/null
+++ b/src/components/omikuji.tsx
@@ -0,0 +1,70 @@
+import React from 'react';
+import { useStaticQuery, graphql } from 'gatsby';
+import Img from 'gatsby-image';
+import styled from 'styled-components';
+
+const OmikujiStyle = styled.div`
+  display: inline-block !important;
+  margin: auto;
+`;
+
+const Omikuji = () => {
+  const data = useStaticQuery(
+    graphql`
+      query {
+        nenga1: file(relativePath: { eq: "nenga1.png" }) {
+          childImageSharp {
+            fluid {
+              ...GatsbyImageSharpFluid
+            }
+          }
+        }
+        nenga2: file(relativePath: { eq: "nenga2.png" }) {
+          childImageSharp {
+            fluid {
+              ...GatsbyImageSharpFluid
+            }
+          }
+        }
+        nenga3: file(relativePath: { eq: "nenga3.png" }) {
+          childImageSharp {
+            fluid {
+              ...GatsbyImageSharpFluid
+            }
+          }
+        }
+        nenga4: file(relativePath: { eq: "nenga4.png" }) {
+          childImageSharp {
+            fluid {
+              ...GatsbyImageSharpFluid
+            }
+          }
+        }
+        nenga5: file(relativePath: { eq: "nenga5.png" }) {
+          childImageSharp {
+            fluid {
+              ...GatsbyImageSharpFluid
+            }
+          }
+        }
+      }
+    `,
+  );
+  const omikujiList = [
+    data.nenga1.childImageSharp.fluid,
+    data.nenga2.childImageSharp.fluid,
+    data.nenga3.childImageSharp.fluid,
+    data.nenga4.childImageSharp.fluid,
+    data.nenga5.childImageSharp.fluid,
+  ];
+  const selectList = () => {
+    return Math.floor(Math.random() * omikujiList.length);
+  };
+  return (
+    <OmikujiStyle>
+      <Img fluid={omikujiList[selectList()]} />
+    </OmikujiStyle>
+  );
+};
+
+export default Omikuji;
diff --git a/src/components/useWindowDimensions.tsx b/src/components/useWindowDimensions.tsx
new file mode 100644
index 0000000..a516830
--- /dev/null
+++ b/src/components/useWindowDimensions.tsx
@@ -0,0 +1,28 @@
+import { useState, useEffect } from 'react';
+
+const UseWindowDimensions = () => {
+  const getWindowDimensions = () => {
+    const {
+      innerWidth: width,
+      innerHeight: height,
+    } = window;
+    return {
+      width,
+      height,
+    };
+  };
+  const [windowDimensions, setWindowDimensions] = useState(
+    getWindowDimensions(),
+  );
+  useEffect(() => {
+    const onResize = () => {
+      setWindowDimensions(getWindowDimensions());
+    };
+    window.addEventListener('resize', onResize);
+    return () =>
+      window.removeEventListener('resize', onResize);
+  }, []);
+  return windowDimensions;
+};
+
+export default UseWindowDimensions;
diff --git a/src/contents/images/big_bell.png b/src/contents/images/big_bell.png
new file mode 100644
index 0000000..92e600c
Binary files /dev/null and b/src/contents/images/big_bell.png differ
diff --git a/src/contents/images/kanetukibou_1.png b/src/contents/images/kanetukibou_1.png
new file mode 100644
index 0000000..05de530
Binary files /dev/null and b/src/contents/images/kanetukibou_1.png differ
diff --git a/src/contents/images/kanetukibou_2.png b/src/contents/images/kanetukibou_2.png
new file mode 100644
index 0000000..58c3edf
Binary files /dev/null and b/src/contents/images/kanetukibou_2.png differ
diff --git a/static/mp3/bell03.mp3 b/static/mp3/bell03.mp3
new file mode 100644
index 0000000..4000038
Binary files /dev/null and b/static/mp3/bell03.mp3 differ
diff --git a/static/mp3/bonnou_taisan.mp3 b/static/mp3/bonnou_taisan.mp3
new file mode 100644
index 0000000..36ed277
Binary files /dev/null and b/static/mp3/bonnou_taisan.mp3 differ
diff --git a/types/graphql-types.d.ts b/types/graphql-types.d.ts
index 9a607b3..49e79e5 100644
--- a/types/graphql-types.d.ts
+++ b/types/graphql-types.d.ts
@@ -3986,52 +3986,62 @@ export type Unnamed_1_Query = { orin?: Maybe<{ childImageSharp?: Maybe<{ fixed?:
 export type Unnamed_2_QueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type Unnamed_2_Query = { bgImg?: Maybe<Pick<File, 'publicURL'>> };
+export type Unnamed_2_Query = { bigBell?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, stick1?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, stick2?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }> };
 
 export type Unnamed_3_QueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type Unnamed_3_Query = { red?: Maybe<Pick<File, 'publicURL'>>, white?: Maybe<Pick<File, 'publicURL'>> };
+export type Unnamed_3_Query = { bgImg?: Maybe<Pick<File, 'publicURL'>> };
 
 export type Unnamed_4_QueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type Unnamed_4_Query = { temple?: Maybe<{ childImageSharp?: Maybe<{ fixed?: Maybe<GatsbyImageSharpFixedFragment> }> }>, wordart?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }> };
+export type Unnamed_4_Query = { red?: Maybe<Pick<File, 'publicURL'>>, white?: Maybe<Pick<File, 'publicURL'>> };
 
-export type HeadQueryVariables = Exact<{ [key: string]: never; }>;
+export type Unnamed_5_QueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type HeadQuery = { site?: Maybe<{ siteMetadata?: Maybe<Pick<SiteSiteMetadata, 'title' | 'siteName' | 'siteUrl' | 'description' | 'keywords' | 'type'>> }>, file?: Maybe<{ childImageSharp?: Maybe<{ resize?: Maybe<Pick<ImageSharpResize, 'src'>> }> }> };
+export type Unnamed_5_Query = { temple?: Maybe<{ childImageSharp?: Maybe<{ fixed?: Maybe<GatsbyImageSharpFixedFragment> }> }>, wordart?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }> };
 
-export type Unnamed_5_QueryVariables = Exact<{ [key: string]: never; }>;
+export type HeadQueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type Unnamed_5_Query = { site?: Maybe<{ siteMetadata?: Maybe<Pick<SiteSiteMetadata, 'title'>> }>, github?: Maybe<Pick<File, 'publicURL'>> };
+export type HeadQuery = { site?: Maybe<{ siteMetadata?: Maybe<Pick<SiteSiteMetadata, 'title' | 'siteName' | 'siteUrl' | 'description' | 'keywords' | 'type'>> }>, file?: Maybe<{ childImageSharp?: Maybe<{ resize?: Maybe<Pick<ImageSharpResize, 'src'>> }> }> };
 
 export type Unnamed_6_QueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type Unnamed_6_Query = { logo?: Maybe<Pick<File, 'publicURL'>>, scaffold?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, backgroundNight?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, backgroundDay?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, templedDay?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, templedNight?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }> };
+export type Unnamed_6_Query = { site?: Maybe<{ siteMetadata?: Maybe<Pick<SiteSiteMetadata, 'title'>> }>, github?: Maybe<Pick<File, 'publicURL'>> };
 
 export type Unnamed_7_QueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type Unnamed_7_Query = { allInformationCsv: { nodes: Array<Pick<InformationCsv, 'date' | 'text' | 'url'>> } };
+export type Unnamed_7_Query = { logo?: Maybe<Pick<File, 'publicURL'>>, scaffold?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, backgroundNight?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, backgroundDay?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, templedDay?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, templedNight?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }> };
 
 export type Unnamed_8_QueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type Unnamed_8_Query = { mochi_red?: Maybe<Pick<File, 'publicURL'>>, mochi_white?: Maybe<Pick<File, 'publicURL'>> };
+export type Unnamed_8_Query = { allInformationCsv: { nodes: Array<Pick<InformationCsv, 'date' | 'text' | 'url'>> } };
 
 export type Unnamed_9_QueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type Unnamed_9_Query = { jushoku?: Maybe<Pick<File, 'publicURL'>> };
+export type Unnamed_9_Query = { mochi_red?: Maybe<Pick<File, 'publicURL'>>, mochi_white?: Maybe<Pick<File, 'publicURL'>> };
 
 export type Unnamed_10_QueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type Unnamed_10_Query = { allHitokotoCsv: { nodes: Array<Pick<HitokotoCsv, 'word'>> }, file?: Maybe<Pick<File, 'publicURL'>> };
+export type Unnamed_10_Query = { jushoku?: Maybe<Pick<File, 'publicURL'>> };
+
+export type Unnamed_11_QueryVariables = Exact<{ [key: string]: never; }>;
+
+
+export type Unnamed_11_Query = { nenga1?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, nenga2?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, nenga3?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, nenga4?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }>, nenga5?: Maybe<{ childImageSharp?: Maybe<{ fluid?: Maybe<GatsbyImageSharpFluidFragment> }> }> };
+
+export type Unnamed_12_QueryVariables = Exact<{ [key: string]: never; }>;
+
+
+export type Unnamed_12_Query = { allHitokotoCsv: { nodes: Array<Pick<HitokotoCsv, 'word'>> }, file?: Maybe<Pick<File, 'publicURL'>> };
 
 export type ListOfContentsQueryQueryVariables = Exact<{ [key: string]: never; }>;
 
diff --git a/yarn.lock b/yarn.lock
index de41d17..b34e89b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4006,7 +4006,7 @@ class-utils@^0.3.5:
     isobject "^3.0.0"
     static-extend "^0.1.1"
 
-classnames@^2.2.6:
+classnames@^2.2.5, classnames@^2.2.6:
   version "2.2.6"
   resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.2.6.tgz#43935bffdd291f326dad0a205309b38d00f650ce"
   integrity sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==
@@ -6365,6 +6365,11 @@ 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-memoize@^2.5.1:
+  version "2.5.2"
+  resolved "https://registry.yarnpkg.com/fast-memoize/-/fast-memoize-2.5.2.tgz#79e3bb6a4ec867ea40ba0e7146816f6cdce9b57e"
+  integrity sha512-Ue0LwpDYErFbmNnZSF0UH6eImUwDmogUO1jyE+JbN2gsQz/jICm1Ve7t9QT0rNSsfJt+Hs4/S3GnsDVjL4HVrw==
+
 fastest-levenshtein@^1.0.12:
   version "1.0.12"
   resolved "https://registry.yarnpkg.com/fastest-levenshtein/-/fastest-levenshtein-1.0.12.tgz#9990f7d3a88cc5a9ffd1f1745745251700d497e2"
@@ -12064,7 +12069,7 @@ prompts@^2.3.2:
     kleur "^3.0.3"
     sisteransi "^1.0.5"
 
-prop-types@^15.5.4, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
+prop-types@^15.5.4, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
   version "15.7.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
   integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@@ -12304,6 +12309,13 @@ rc@^1.2.7, rc@^1.2.8:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
+re-resizable@6.9.0:
+  version "6.9.0"
+  resolved "https://registry.yarnpkg.com/re-resizable/-/re-resizable-6.9.0.tgz#9c3059b389ced6ade602234cc5bb1e12d231cd47"
+  integrity sha512-3cUDG81ylyqI0Pdgle/RHwwRYq0ORZzsUaySOCO8IbEtNyaRtrIHYm/jMQ5pjcNiKCxR3vsSymIQZHwJq4gg2Q==
+  dependencies:
+    fast-memoize "^2.5.1"
+
 react-dev-utils@^4.2.3:
   version "4.2.3"
   resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-4.2.3.tgz#5b42d9ea58d5e9e017a2f57a40a8af408a3a46fb"
@@ -12338,6 +12350,14 @@ react-dom@^16.11.0:
     prop-types "^15.6.2"
     scheduler "^0.19.1"
 
+react-draggable@4.4.3:
+  version "4.4.3"
+  resolved "https://registry.yarnpkg.com/react-draggable/-/react-draggable-4.4.3.tgz#0727f2cae5813e36b0e4962bf11b2f9ef2b406f3"
+  integrity sha512-jV4TE59MBuWm7gb6Ns3Q1mxX8Azffb7oTtDtBgFkxRvhDp38YAARmRplrj0+XGkhOJB5XziArX+4HUUABtyZ0w==
+  dependencies:
+    classnames "^2.2.5"
+    prop-types "^15.6.0"
+
 react-error-overlay@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-3.0.0.tgz#c2bc8f4d91f1375b3dad6d75265d51cd5eeaf655"
@@ -12396,6 +12416,15 @@ react-refresh@^0.8.3:
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f"
   integrity sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg==
 
+react-rnd@^10.2.4:
+  version "10.2.4"
+  resolved "https://registry.yarnpkg.com/react-rnd/-/react-rnd-10.2.4.tgz#542c28fa9cfcb3ad1521694dfa2799217832818f"
+  integrity sha512-wseACIsxa1wuZz9XatO3/JAZR748Sddehh0NtJz1Yj3X5BQm5pwRShiadfnWrUajJATurHbN0NVTUn+jEkHkPw==
+  dependencies:
+    re-resizable "6.9.0"
+    react-draggable "4.4.3"
+    tslib "2.0.3"
+
 react-side-effect@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/react-side-effect/-/react-side-effect-1.2.0.tgz#0e940c78faba0c73b9b0eba9cd3dda8dfb7e7dae"
@@ -14597,16 +14626,16 @@ tslib@1.11.2:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.11.2.tgz#9c79d83272c9a7aaf166f73915c9667ecdde3cc9"
   integrity sha512-tTSkux6IGPnUGUd1XAZHcpu85MOkIl5zX49pO+jfsie3eP0B6pyhOlLXm3cAC6T7s+euSDDUUV+Acop5WmtkVg==
 
+tslib@2.0.3, tslib@^2, tslib@^2.0.0, tslib@~2.0.1:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.0.3.tgz#8e0741ac45fc0c226e58a17bfc3e64b9bc6ca61c"
+  integrity sha512-uZtkfKblCEQtZKBF6EBXVZeQNl82yqtDQdv+eck8u7tdPxjLu2/lp5/uPW+um2tpuxINHWy3GhiccY7QgEaVHQ==
+
 tslib@^1.10.0, tslib@^1.11.1, tslib@^1.8.1, tslib@^1.9.0, tslib@^1.9.3:
   version "1.14.1"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
 
-tslib@^2, tslib@^2.0.0, tslib@~2.0.1:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.0.3.tgz#8e0741ac45fc0c226e58a17bfc3e64b9bc6ca61c"
-  integrity sha512-uZtkfKblCEQtZKBF6EBXVZeQNl82yqtDQdv+eck8u7tdPxjLu2/lp5/uPW+um2tpuxINHWy3GhiccY7QgEaVHQ==
-
 tsutils@^3.17.1:
   version "3.17.1"
   resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.17.1.tgz#ed719917f11ca0dee586272b2ac49e015a2dd759"