@tailwindcss/aspect-ratio - npm Package Compare versions

Comparing version 0.0.0-insiders.a4d3d64 to 0.0.0-insiders.b2a9d02

CHANGELOG.md

@@ -10,5 +10,16 @@ # Changelog
 
+- Nothing yet!
+
+## [0.4.2] - 2022-09-02
+
+### Fixed
+
+- Update TypeScript types ([#34](https://github.com/tailwindlabs/tailwindcss-aspect-ratio/pull/34))
+
+## [0.4.1] - 2022-09-01
+
 ### Added
 
 - Remove `dist` folder and related dependencies ([#29](https://github.com/tailwindlabs/tailwindcss-aspect-ratio/pull/29))
+- Add typescript types ([#33](https://github.com/tailwindlabs/tailwindcss-aspect-ratio/pull/33))
 
@@ -73,3 +84,5 @@ ## [0.4.0] - 2021-12-09
 
-[unreleased]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.4.0...HEAD
+[unreleased]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.4.2...HEAD
+[0.4.2]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.4.1...v0.4.2
+[0.4.1]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.4.0...v0.4.1
 [0.4.0]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.3.0...v0.4.0
@@ -76,0 +89,0 @@ [0.3.0]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.2.2...v0.3.0

package.json

 {
   "name": "@tailwindcss/aspect-ratio",
-  "version": "0.0.0-insiders.a4d3d64",
+  "version": "0.0.0-insiders.b2a9d02",
   "main": "src/index.js",
+  "types": "src/index.d.ts",
   "license": "MIT",
@@ -6,0 +7,0 @@ "repository": "https://github.com/tailwindlabs/tailwindcss-aspect-ratio",

README.md

@@ -11,10 +11,6 @@ # @tailwindcss/aspect-ratio
 ```sh
-# Using npm
-npm install @tailwindcss/aspect-ratio
-
-# Using Yarn
-yarn add @tailwindcss/aspect-ratio
+npm install -D @tailwindcss/aspect-ratio
 ```
 
-Then add the plugin to your `tailwind.config.js` file:
+Then add the plugin to your `tailwind.config.js` file, and disable the `aspectRatio` core plugin to avoid conflicts with the native `aspect-ratio` utilities included in Tailwind CSS v3.0:
 
@@ -27,2 +23,5 @@ ```js
   },
+  corePlugins: {
+    aspectRatio: false,
+  },
   plugins: [
@@ -106,1 +105,40 @@ require('@tailwindcss/aspect-ratio'),
 ```
+
+## Compatibility with default aspect-ratio utilities
+
+Tailwind CSS v3.0 shipped with [native aspect-ratio](https://tailwindcss.com/docs/aspect-ratio) support, and while these new utilities are great, the `aspect-ratio` property isn't supported in Safari 14, which still has [significant global usage](https://caniuse.com/mdn-css_properties_aspect-ratio). If you need to support Safari 14, this plugin is still the best way to do that.
+
+While it's technically possible to use the new native `aspect-ratio` utilities as well as this plugin in the same project, it doesn't really make a lot of sense to do so. If you're able to use the new native aspect-ratio utilities, just use them instead of this plugin, as they are a lot simpler and work much better.
+
+However, if you do want to use both approaches in your project, maybe as a way of transitioning slowly from the plugin approach to the new native utilities, you'll need to add the following values to your `tailwind.config.js` file:
+
+```js
+module.exports = {
+  // ...
+  theme: {
+    aspectRatio: {
+      auto: 'auto',
+      square: '1 / 1',
+      video: '16 / 9',
+      1: '1',
+      2: '2',
+      3: '3',
+      4: '4',
+      5: '5',
+      6: '6',
+      7: '7',
+      8: '8',
+      9: '9',
+      10: '10',
+      11: '11',
+      12: '12',
+      13: '13',
+      14: '14',
+      15: '15',
+      16: '16',
+    },
+  },
+}
+```
+
+This is necessary, as the default `aspectRatio` values are overwritten by this plugin's values.

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

18119

increased by21.99%

Number of package files

10

increased by25%

Lines of code

261

increased by0.77%

Number of lines in readme file

142

increased by36.54%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes