react-resize-detector - npm Package Compare versions

Comparing version 8.0.4 to 8.0.5

package.json

 {
   "name": "react-resize-detector",
-  "version": "8.0.4",
+  "version": "8.0.5",
   "description": "React resize detector",
@@ -30,17 +30,17 @@ "main": "build/index.js",
     "@rollup/plugin-commonjs": "^24.0.1",
-    "@rollup/plugin-node-resolve": "^15.0.1",
-    "@rollup/plugin-typescript": "^11.0.0",
-    "@types/lodash": "^4.14.191",
-    "@types/react": "^18.0.28",
+    "@rollup/plugin-node-resolve": "^15.0.2",
+    "@rollup/plugin-typescript": "^11.1.0",
+    "@types/lodash": "^4.14.192",
+    "@types/react": "^18.0.33",
     "@types/react-dom": "^18.0.11",
-    "@typescript-eslint/eslint-plugin": "^5.52.0",
-    "@typescript-eslint/parser": "^5.52.0",
-    "eslint": "^8.34.0",
-    "eslint-config-prettier": "^8.6.0",
+    "@typescript-eslint/eslint-plugin": "^5.57.1",
+    "@typescript-eslint/parser": "^5.57.1",
+    "eslint": "^8.37.0",
+    "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-react": "^7.32.2",
-    "prettier": "^2.8.4",
-    "rollup": "^3.17.0",
+    "prettier": "^2.8.7",
+    "rollup": "^3.20.2",
     "rollup-plugin-node-externals": "^5.1.2",
-    "typescript": "^4.9.5"
+    "typescript": "^5.0.4"
   },
@@ -47,0 +47,0 @@ "peerDependencies": {

README.md

@@ -15,5 +15,5 @@ # Handle element resizes like it's 2023!
 
-🐠 Used by <a href="https://github.com/maslianok/react-resize-detector/network/dependents" target="__blank">75k repositories</a>
+🐠 Used by <a href="https://github.com/maslianok/react-resize-detector/network/dependents" target="__blank">90k repositories</a>
 
-🦄 Generating <a href="https://npmtrends.com/react-resize-detector" target="__blank">50M+ downloads/year</a>
+🦄 Generating <a href="https://npmtrends.com/react-resize-detector" target="__blank">70M+ downloads/year</a>
 
@@ -24,2 +24,37 @@ No `window.resize` listeners! No timeouts! No 👑 viruses! :)
 
+## Do you really need this library?
+
+Container queries now work in [all major browsers](https://caniuse.com/css-container-queries). It's very likely you can resolve your problem using [pure CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Container_Queries).
+
+<details><summary>Example</summary>
+
+```html
+<div class="post">
+  <div class="card">
+    <h2>Card title</h2>
+    <p>Card content</p>
+  </div>
+</div>
+```
+
+```css
+.post {
+  container-type: inline-size;
+}
+
+/* Default heading styles for the card title */
+.card h2 {
+  font-size: 1em;
+}
+
+/* If the container is larger than 700px */
+@container (min-width: 700px) {
+  .card h2 {
+    font-size: 2em;
+  }
+}
+```
+
+</details>
+
 ## Installation
@@ -26,0 +61,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

128927

increased by0.57%

Number of lines in readme file

347

increased by11.22%

No dependency changes