chore: fix compatibility errors

Author: ChrisUser

package.json

@@ -1,8 +1,7 @@
 {
   "name": "react-usage-bar",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "Usage bar, graphic component for React",
-  "type": "module",
   "main": "build/index.js",
   "typings": "build/index.d.ts",
   "files": [
@@ -38,30 +37,30 @@
   "homepage": "http://ChrisUser.github.io/react-usage-bar",
   "license": "MIT",
   "devDependencies": {
-    "@babel/core": "^7.23.3",
-    "@babel/preset-env": "^7.23.3",
+    "@babel/core": "^7.23.5",
+    "@babel/preset-env": "^7.23.5",
     "@babel/preset-react": "^7.23.3",
     "@babel/preset-typescript": "^7.23.3",
-    "@storybook/addon-a11y": "^7.5.3",
-    "@storybook/addon-docs": "^7.5.3",
-    "@storybook/addon-viewport": "^7.5.3",
-    "@storybook/react": "^7.5.3",
-    "@storybook/react-webpack5": "^7.5.3",
-    "@testing-library/jest-dom": "^6.1.4",
+    "@storybook/addon-a11y": "^7.6.2",
+    "@storybook/addon-docs": "^7.6.2",
+    "@storybook/addon-viewport": "^7.6.2",
+    "@storybook/react": "^7.6.2",
+    "@storybook/react-webpack5": "^7.6.2",
+    "@testing-library/jest-dom": "^6.1.5",
     "@testing-library/react": "^14.1.2",
     "@types/jest": "^29.5.10",
-    "@types/react": "^18.2.38",
+    "@types/react": "^18.2.39",
     "@types/react-dom": "^18.2.17",
     "awesome-typescript-loader": "^5.2.1",
     "babel-loader": "^9.1.3",
-    "esbuild": "^0.19.7",
+    "esbuild": "^0.19.8",
     "jest": "^29.7.0",
     "postcss": "^8.4.24",
     "prettier-standard": "^16.3.0",
     "react": "^18.2.0",
     "react-docgen-typescript-loader": "^3.7.2",
     "react-dom": "^18.2.0",
-    "rollup": "^4.5.2",
+    "rollup": "^4.6.1",
     "rollup-plugin-commonjs": "^10.1.0",
     "rollup-plugin-dts": "^6.1.0",
     "rollup-plugin-esbuild": "^6.1.0",
@@ -72,18 +71,18 @@
     "rollup-plugin-typescript2": "^0.36.0",
     "standard": "^17.1.0",
     "standard-prettier": "^1.0.1",
-    "storybook": "7.5.3",
+    "storybook": "7.6.2",
     "ts-jest": "^29.1.1",
     "ts-loader": "^9.5.1",
     "typescript": "^5.3.2"
   },
   "peerDependencies": {
-    "react": "^17",
-    "react-dom": "^17"
+    "react": "^16",
+    "react-dom": "^16"
   },
   "resolutions": {
-    "minimist": "1.2.8",
-    "semver": "7.5.4"
+    "minimist": "1.2.6",
+    "semver": "7.5.2"
   },
   "jest": {
     "preset": "ts-jest",
@@ -105,5 +104,9 @@
       "afterAll",
       "jest"
     ]
+  },
+  "dependencies": {
+    "minimist": "1.2.8",
+    "semver": "7.5.4"
   }
 }

src/UsageBar.stories.tsx

@@ -32,7 +32,7 @@ const items = [
 ]
 
 const compactContainerStyle = { maxWidth: 500, margin: "0 auto" }
-const normalContainerStyle = { margin: 16 }
+const normalContainerStyle = { margin: 24 }
 
 export const lightMode = () => (
   <div style={normalContainerStyle}>