@tailwindcss/typography - npm Package Compare versions

Comparing version 0.0.0-1a51113 to 0.0.0-caa70b6

package.json

 {
   "name": "@tailwindcss/typography",
-  "version": "0.0.0-1a51113",
+  "version": "0.0.0-caa70b6",
   "description": "A Tailwind CSS plugin for automatically styling plain HTML content with beautiful typographic defaults.",
@@ -18,2 +18,3 @@ "main": "src/index.js",
   "scripts": {
+    "test": "jest",
     "dev": "next dev demo",
@@ -27,3 +28,3 @@ "build": "next build demo",
   "peerDependencies": {
-    "tailwindcss": "^1.5.0"
+    "tailwindcss": "2.0.0-alpha.4 || ^2.0.0"
   },
@@ -39,8 +40,11 @@ "devDependencies": {
     "highlight.js": "^9.15.6",
+    "jest": "^26.6.1",
     "next": "^9.4.4",
     "postcss": "^7.0.17",
+    "prettier": "^2.1.2",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
-    "tailwindcss": "^2.0.0-alpha.1"
+    "snapshot-diff": "^0.8.1",
+    "tailwindcss": "^2.0.0-alpha.4"
   }
 }

src/index.js

 const plugin = require('tailwindcss/plugin')
 const merge = require('lodash/merge')
 const castArray = require('lodash/castArray')
+const uniq = require('lodash/uniq')
 const styles = require('./styles')
@@ -11,4 +12,5 @@
 
-function configToCss(config) {
+function configToCss(config = {}) {
   return merge(
+    {},
     ...Object.keys(config)
@@ -21,27 +23,20 @@ .filter((key) => computed[key])
 
+const DEFAULT_MODIFIERS = ['DEFAULT', 'sm', 'lg', 'xl', '2xl']
 module.exports = plugin.withOptions(
-  ({ modifiers = ['sm', 'lg', 'xl', '2xl'], className = 'prose' } = {}) => {
+  ({ modifiers = DEFAULT_MODIFIERS, className = 'prose' } = {}) => {
     return function ({ addComponents, theme, variants }) {
-      const config = theme('typography', {})
+      const config = theme('typography')
 
+      const all = uniq([
+        'DEFAULT',
+        ...modifiers,
+        ...Object.keys(config).filter((modifier) => !DEFAULT_MODIFIERS.includes(modifier)),
+      ])
+
       addComponents(
-        [
-          {
-            [`.${className}`]: merge(
-              ...castArray(styles.default.css),
-              configToCss(config.default || {})
-            ),
-          },
-          ...modifiers.map((modifier) => ({
-            [`.${className}-${modifier}`]: merge(
-              ...castArray(styles[modifier].css),
-              configToCss(config[modifier] || {})
-            ),
-          })),
-          ...Object.keys(config)
-            .filter((key) => !['default', ...modifiers].includes(key))
-            .map((modifier) => ({
-              [`.${className}-${modifier}`]: configToCss(config[modifier]),
-            })),
-        ],
+        all.map((modifier) => ({
+          [modifier === 'DEFAULT' ? `.${className}` : `.${className}-${modifier}`]: configToCss(
+            config[modifier]
+          ),
+        })),
         variants('typography')
@@ -51,3 +46,3 @@ )
   },
-  () => ({ variants: { typography: ['responsive'] } })
+  () => ({ theme: { typography: styles }, variants: { typography: ['responsive'] } })
 )

src/styles.js

@@ -12,3 +12,3 @@ const defaultTheme = require('tailwindcss/defaultTheme')
 module.exports = {
-  default: {
+  DEFAULT: {
     css: [
@@ -15,0 +15,0 @@ {

New alerts

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

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

961680

219.05%

Number of package files

32

88.24%

Lines of code

24283

236.38%

Worsened metrics

Dev dependency count

16

23.08%

No dependency changes