Upgrade stylelint

.storybook/main.ts

@@ -7,7 +7,7 @@ const config: StorybookConfig = {
     "@storybook/addon-essentials",
     "@storybook/addon-interactions",
     "@storybook/addon-webpack5-compiler-swc",
-    "@chromatic-com/storybook"
+    "@chromatic-com/storybook",
   ],
 
   framework: {
@@ -18,7 +18,7 @@ const config: StorybookConfig = {
   docs: {},
 
   typescript: {
-    reactDocgen: "react-docgen-typescript"
-  }
+    reactDocgen: "react-docgen-typescript",
+  },
 };
 export default config;

.stylelintrc.json

@@ -1,3 +1,6 @@
 {
-  "extends": "stylelint-config-standard"
+  "extends": "stylelint-config-standard",
+  "rules": {
+    "selector-class-pattern": null
+  }
 }

package.json

@@ -88,8 +88,8 @@
     "rollup-plugin-typescript2": "^0.35.0",
     "scheduler": "^0.20.0",
     "storybook": "^8.4.7",
-    "stylelint": "^13.13.1",
-    "stylelint-config-standard": "^22.0.0",
+    "stylelint": "^16.12.0",
+    "stylelint-config-standard": "36.0.1",
     "ts-jest": "^29.1.0",
     "tslib": "^2.3.1",
     "typedoc": "^0.23.28",

src/Spreadsheet.css

@@ -1,12 +1,12 @@
 .Spreadsheet {
   --background-color: white;
   --text-color: black;
-  --readonly-text-color: rgba(0, 0, 0, 0.4);
+  --readonly-text-color: rgb(0 0 0 / 40%);
   --outline-color: #4285f4;
-  --outline-background-color: rgba(160, 195, 255, 0.2);
-  --border-color: hsl(2deg, 0%, 91%);
-  --header-background-color: rgba(0, 0, 0, 0.04);
-  --elevation: 0 2px 5px rgba(0, 0, 0, 0.4);
+  --outline-background-color: rgb(160 195 255 / 20%);
+  --border-color: hsl(2deg 0% 91%);
+  --header-background-color: rgb(0 0 0 / 4%);
+  --elevation: 0 2px 5px rgb(0 0 0 / 40%);
 
   position: relative;
   overflow: visible;
@@ -18,9 +18,9 @@
 .Spreadsheet--dark-mode {
   --background-color: black;
   --text-color: white;
-  --readonly-text-color: rgba(255, 255, 255, 0.4);
-  --header-background-color: rgba(255, 255, 255, 0.04);
-  --border-color: hsl(2deg, 0%, 19%);
+  --readonly-text-color: rgb(255 255 255 / 40%);
+  --header-background-color: rgb(255 255 255 / 4%);
+  --border-color: hsl(2deg 0% 19%);
 }
 
 .Spreadsheet__active-cell {