chore(deps): update dependency styled-components to v5.3.1 (#445)

* chore(deps): update dependency styled-components to v5.3.1

* test:	update

Co-authored-by: Renovate Bot <[email protected]>
Co-authored-by: ryokosuge <[email protected]>

Author: 3 people

examples/create-react-app/package.json

@@ -6,12 +6,12 @@
     "@types/node": "14.17.14",
     "@types/react": "17.0.20",
     "@types/react-dom": "17.0.9",
-    "@types/styled-components": "5.1.5",
+    "@types/styled-components": "5.1.14",
     "ingred-ui": "7.33.0",
     "react": "16.14.0",
     "react-dom": "16.14.0",
     "react-scripts": "4.0.3",
-    "styled-components": "5.2.1",
+    "styled-components": "5.3.1",
     "typescript": "4.1.3"
   },
   "scripts": {

examples/create-react-app/yarn.lock

@@ -2533,13 +2533,6 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react-native@*":
-  version "0.63.37"
-  resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.63.37.tgz#c43df90c9d3cc082a97a49a53e989de26cb8ab45"
-  integrity sha512-xr9SZG7tQQBKT6840tAGaWEC65D2gjyxZtuZxz631UgeW1ofItuu9HMVhoyYqot2hRSa6Q4YC8FYkRVUpM53/w==
-  dependencies:
-    "@types/react" "*"
-
 "@types/react@*":
   version "17.0.0"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.0.tgz#5af3eb7fad2807092f0046a1302b7823e27919b8"
@@ -2579,14 +2572,13 @@
   resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-2.0.1.tgz#20f18294f797f2209b5f65c8e3b5c8e8261d127c"
   integrity sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==
 
-"@types/[email protected].5":
-  version "5.1.5"
-  resolved "https://registry.yarnpkg.com/@types/styled-components/-/styled-components-5.1.5.tgz#a98e2ead1a1c7660b966f3aade4df9c0ec8ed75a"
-  integrity sha512-VWwoKm39W783a75oILtdCjnNn+FSV8Yh3O9naIudtZCAkk+rRfwLWzuPjf5k/OilENgZqAkxJ9sukSOZTAD86g==
+"@types/[email protected].14":
+  version "5.1.14"
+  resolved "https://registry.yarnpkg.com/@types/styled-components/-/styled-components-5.1.14.tgz#e9cf8cdb5eef9d139628183a84c083f630635d67"
+  integrity sha512-d6P1/tyNytqKwam3cQXq7a9uPtovc/mdAs7dBiz1YbDdNIT3X4WmuFU78YdSYh84TXVuhOwezZ3EeKuNBhwsHQ==
   dependencies:
     "@types/hoist-non-react-statics" "*"
     "@types/react" "*"
-    "@types/react-native" "*"
     csstype "^3.0.2"
 
 "@types/tapable@^1", "@types/tapable@^1.0.5":
@@ -3446,10 +3438,10 @@ babel-plugin-polyfill-regenerator@^0.2.2:
   dependencies:
     "@babel/helper-define-polyfill-provider" "^0.2.2"
 
-"babel-plugin-styled-components@>= 1":
-  version "1.12.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.12.0.tgz#1dec1676512177de6b827211e9eda5a30db4f9b9"
-  integrity sha512-FEiD7l5ZABdJPpLssKXjBUJMYqzbcNzBowfXDCdJhOpbhWiewapUaY+LZGT8R4Jg2TwOjGjG4RKeyrO5p9sBkA==
+"babel-plugin-styled-components@>= 1.12.0":
+  version "1.13.2"
+  resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.13.2.tgz#ebe0e6deff51d7f93fceda1819e9b96aeb88278d"
+  integrity sha512-Vb1R3d4g+MUfPQPVDMCGjm3cDocJEUTR7Xq7QS95JWWeksN1wdFRYpD2kulDgI3Huuaf1CZd+NK4KQmqUFh5dA==
   dependencies:
     "@babel/helper-annotate-as-pure" "^7.0.0"
     "@babel/helper-module-imports" "^7.0.0"
@@ -11489,17 +11481,17 @@ [email protected]:
     loader-utils "^2.0.0"
     schema-utils "^2.7.0"
 
-styled-components@5.2.1:
-  version "5.2.1"
-  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.2.1.tgz#6ed7fad2dc233825f64c719ffbdedd84ad79101a"
-  integrity sha512-sBdgLWrCFTKtmZm/9x7jkIabjFNVzCUeKfoQsM6R3saImkUnjx0QYdLwJHBjY9ifEcmjDamJDVfknWm1yxZPxQ==
+styled-components@5.3.1:
+  version "5.3.1"
+  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.3.1.tgz#8a86dcd31bff7049c2ed408bae36fa23f03f071a"
+  integrity sha512-JThv2JRzyH0NOIURrk9iskdxMSAAtCfj/b2Sf1WJaCUsloQkblepy1jaCLX/bYE+mhYo3unmwVSI9I5d9ncSiQ==
   dependencies:
     "@babel/helper-module-imports" "^7.0.0"
     "@babel/traverse" "^7.4.5"
     "@emotion/is-prop-valid" "^0.8.8"
     "@emotion/stylis" "^0.8.4"
     "@emotion/unitless" "^0.7.4"
-    babel-plugin-styled-components ">= 1"
+    babel-plugin-styled-components ">= 1.12.0"
     css-to-react-native "^3.0.0"
     hoist-non-react-statics "^3.0.0"
     shallowequal "^1.1.0"

package.json

@@ -59,7 +59,7 @@
     "@types/react-select": "4.0.17",
     "@types/react-toast-notifications": "2.4.0",
     "@types/react-transition-group": "4.4.2",
-    "@types/styled-components": "5.1.12",
+    "@types/styled-components": "5.1.14",
     "@typescript-eslint/eslint-plugin": "4.31.0",
     "@typescript-eslint/parser": "4.31.0",
     "cross-env": "7.0.3",
@@ -81,7 +81,7 @@
     "rollup-plugin-peer-deps-external": "2.2.4",
     "rollup-plugin-postcss": "4.0.1",
     "scaffdog": "1.0.1",
-    "styled-components": "5.3.0",
+    "styled-components": "5.3.1",
     "ts-jest": "27.0.5",
     "typescript": "4.3.5"
   },

src/components/ActionButton/__tests__/__snapshots__/ActionButton.test.tsx.snap

@@ -3,13 +3,13 @@
 exports[`ActionButton component testing ActionButton 1`] = `
 <DocumentFragment>
   <button
-    class="sc-bdnxRM JueWW"
+    class="sc-bdfBQB glIoNd"
   >
     <div
-      class="sc-gtsrHT TSXlJ"
+      class="sc-gsTEea iilViX"
     >
       <div
-        class="sc-dlnjwi dDeTRf"
+        class="sc-dlfnuX vUpMN"
         size="18"
       >
         <svg
@@ -29,7 +29,7 @@ exports[`ActionButton component testing ActionButton 1`] = `
       </div>
     </div>
     <p
-      class="sc-hKFxyN hFnlQN"
+      class="sc-hKgJUU dxOjkI"
       color="#0B82F4"
       font-size="14px"
     />

src/components/Backdrop/__tests__/__snapshots__/Backdrop.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`Backdrop component testing Backdrop 1`] = `
 <DocumentFragment>
   <div
-    class="sc-bdnxRM jsvPjb sc-gtsrHT cnAHHh fade-transition-appear fade-transition-appear-active"
+    class="sc-bdfBQB bLvRNE sc-gsTEea fcHBVP fade-transition-appear fade-transition-appear-active"
   />
 </DocumentFragment>
 `;

src/components/Badge/__tests__/__snapshots__/Badge.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`Badge component testing Badge normal 1`] = `
 <DocumentFragment>
   <span
-    class="sc-bdnxRM hBlYwA"
+    class="sc-bdfBQB jCizHj"
     color="#FFFFFF"
     font-size="0.65em"
     font-weight="bold"
@@ -17,7 +17,7 @@ exports[`Badge component testing Badge normal 1`] = `
 exports[`Badge component testing Badge pill 1`] = `
 <DocumentFragment>
   <span
-    class="sc-bdnxRM kfKuAr"
+    class="sc-bdfBQB kfcPDY"
     color="#FFFFFF"
     font-size="0.65em"
     font-weight="bold"

src/components/Button/__tests__/__snapshots__/Button.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`Button component testing Button 1`] = `
 <DocumentFragment>
   <button
-    class="sc-gtsrHT sc-dlnjwi buBIgT ipgAki"
+    class="sc-gsTEea sc-dlfnuX bbwPaB cpprog"
     font-size="14px"
     font-weight="bold"
   />

src/components/ButtonGroup/__tests__/__snapshots__/ButtonGroup.test.tsx.snap

@@ -3,17 +3,17 @@
 exports[`Button component testing ButtonGroup 1`] = `
 <DocumentFragment>
   <div
-    class="sc-bdnxRM fSybpF"
+    class="sc-bdfBQB jluVTq"
   >
     <button
-      class="sc-dlnjwi sc-hKFxyN fQXHYb ifplX"
+      class="sc-dlfnuX sc-hKgJUU fxDDrJ dzkXLe"
       font-size="14px"
       font-weight="normal"
     >
       Edit
     </button>
     <button
-      class="sc-dlnjwi sc-hKFxyN fQXHYb ifplX"
+      class="sc-dlfnuX sc-hKgJUU fxDDrJ dzkXLe"
       font-size="14px"
       font-weight="normal"
     >

src/components/Card/__tests__/__snapshots__/Card.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`Card component testing Card 1`] = `
 <DocumentFragment>
   <div
-    class="sc-gtsrHT fBtrzu"
+    class="sc-gsTEea gIbObI"
   />
 </DocumentFragment>
 `;

src/components/Checkbox/__tests__/__snapshots__/Checkbox.test.tsx.snap

@@ -3,15 +3,15 @@
 exports[`Checkbox component testing Checkbox 1`] = `
 <DocumentFragment>
   <label
-    class="sc-gtsrHT kUxdTp"
+    class="sc-gsTEea dlRoDj"
   >
     <input
-      class="sc-bdnxRM iRmJea"
+      class="sc-bdfBQB hvAoBd"
       readonly=""
       type="checkbox"
     />
     <span
-      class="sc-dlnjwi gRDsrG"
+      class="sc-dlfnuX eLkQQm"
     />
   </label>
 </DocumentFragment>

src/components/ConfirmModal/__tests__/__snapshots__/ConfirmModal.test.tsx.snap

@@ -3,37 +3,37 @@
 exports[`ConfirmModal component testing ConfirmModal 1`] = `
 <DocumentFragment>
   <div
-    class="sc-fFSPTT diWwHn"
+    class="sc-fFucqa lpjfBz"
   >
     <div
-      class="sc-bkbkJK jzarPh sc-iemWCZ lanAcc fade-transition-appear fade-transition-appear-active"
+      class="sc-bkzYnD hIRPCl sc-idOiZg kYBNlg fade-transition-appear fade-transition-appear-active"
     />
     <div
-      class="sc-gtsrHT sc-hKFxyN kjWTCY cAVdk sc-iemWCZ lanAcc fade-transition-appear fade-transition-appear-active"
+      class="sc-gsTEea sc-hKgJUU keAjjo ioziAl sc-idOiZg kYBNlg fade-transition-appear fade-transition-appear-active"
     >
       <form>
         <div
-          class="sc-eCApnc Zhzag"
+          class="sc-eCstlR bgPhZM"
         >
           <div
-            class="sc-jSFjdj cfXHln"
+            class="sc-jSgvzq hZpAqa"
           >
             <p
-              class="sc-iqAclL eOiyyI"
+              class="sc-iqHYmW hVtSfg"
               color="#041C33"
               font-size="20px"
             >
               Title
             </p>
             <div
-              class="sc-dIsUp KOZUh"
+              class="sc-dQoVA IQjMW"
             />
           </div>
           <div
-            class="sc-fujyAs eDHmge"
+            class="sc-fubCzh cYKLrl"
           >
             <div
-              class="sc-crzoAE lgdJPF"
+              class="sc-crrszt dsUZIK"
               size="24"
             >
               <svg
@@ -59,10 +59,10 @@ exports[`ConfirmModal component testing ConfirmModal 1`] = `
           </div>
         </div>
         <div
-          class="sc-gKAaRy dOrXpC"
+          class="sc-gKseQn gxLWJF"
         >
           <div
-            class="sc-dIsUp hdPXtI"
+            class="sc-dQoVA gIVOhn"
           />
         </div>
       </form>

src/components/ContextMenu/__tests__/__snapshots__/ContextMenu.test.tsx.snap

@@ -3,14 +3,14 @@
 exports[`ContextMenu component testing ContextMenu 1`] = `
 <DocumentFragment>
   <button
-    class="sc-bdnxRM JueWW sc-eCApnc jqprdR"
+    class="sc-bdfBQB glIoNd sc-eCstlR hZYdGd"
     data-testid="icon-wrapper"
   >
     <div
-      class="sc-gtsrHT TSXlJ"
+      class="sc-gsTEea iilViX"
     >
       <div
-        class="sc-dlnjwi dDeTRf"
+        class="sc-dlfnuX vUpMN"
         size="18"
       >
         <svg
@@ -30,75 +30,75 @@ exports[`ContextMenu component testing ContextMenu 1`] = `
       </div>
     </div>
     <p
-      class="sc-hKFxyN hFnlQN"
+      class="sc-hKgJUU dxOjkI"
       color="#0B82F4"
       font-size="14px"
     />
   </button>
   <div
-    class="sc-kEqXSa fVhvQF"
+    class="sc-kEjbQP coodEC"
   >
     <div
-      class="sc-iqAclL hEYiiP sc-crzoAE bYrIA-D fade-transition-enter fade-transition-enter-active"
+      class="sc-iqHYmW ErYFv sc-crrszt heRoyA fade-transition-enter fade-transition-enter-active"
     />
     <div
-      class="sc-jrsJWt kbooqu"
+      class="sc-jrAFXE cvhqDr"
       data-popper-escaped="true"
       data-popper-placement="bottom-start"
       data-popper-reference-hidden="true"
       style="position: absolute; left: 0px; top: 0px;"
     >
       <div
-        class="sc-jSFjdj fACWid"
+        class="sc-jSgvzq kZOucY"
       >
         <div
-          class="sc-fujyAs fxzMhx"
+          class="sc-fubCzh bbOhJQ"
         >
           <p
-            class="sc-hKFxyN PERmK sc-iCoGMd"
+            class="sc-hKgJUU BqvXD sc-iBPTik"
             color="#041C33"
             font-size="13px"
           >
             Save
           </p>
         </div>
         <hr
-          class="sc-pNWdM dabJeE"
+          class="sc-pGacB kNlCai"
           color="#E2E8EA"
           orientation="horizontal"
         />
         <div
-          class="sc-fujyAs fxzMhx"
+          class="sc-fubCzh bbOhJQ"
         >
           <p
-            class="sc-hKFxyN PERmK sc-iCoGMd"
+            class="sc-hKgJUU BqvXD sc-iBPTik"
             color="#041C33"
             font-size="13px"
           >
             Save and execute
           </p>
         </div>
         <div
-          class="sc-fujyAs fxzMhx"
+          class="sc-fubCzh bbOhJQ"
         >
           <p
-            class="sc-hKFxyN PERmK sc-iCoGMd"
+            class="sc-hKgJUU BqvXD sc-iBPTik"
             color="#041C33"
             font-size="13px"
           >
             Save as draft
           </p>
         </div>
         <hr
-          class="sc-pNWdM dabJeE"
+          class="sc-pGacB kNlCai"
           color="#E2E8EA"
           orientation="horizontal"
         />
         <div
-          class="sc-fujyAs fxzMhx"
+          class="sc-fubCzh bbOhJQ"
         >
           <p
-            class="sc-hKFxyN PERmK sc-iCoGMd"
+            class="sc-hKgJUU BqvXD sc-iBPTik"
             color="#041C33"
             font-size="13px"
           >