Fix: Update plugin import using require() (#95)

Co-authored-by: Jeff <rustyangel@gmail.com>

Author: DylanVann

.changeset/wild-sheep-tan.md

@@ -0,0 +1,10 @@
+---
+'tailwindcss-capsize': patch
+---
+
+Fix usage when `require`ing plugin
+
+```diff
+- require('tailwindcss-capsize').default
++ require('tailwindcss-capsize')
+```

__tests__/plugin.test.ts

@@ -3,7 +3,9 @@ import postcss from 'postcss'
 import { format } from 'prettier'
 import tailwindcss from 'tailwindcss'
 
-import capsizePlugin from '../dist'
+// Need to test this how consumers will use it, using `require()`.
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const capsizePlugin = require('../dist')
 
 const THEME_CONFIG = {
     fontFamily: {

src/index.ts

@@ -1,59 +1,3 @@
-import { createStyleObject } from '@capsizecss/core'
-import type { FontMetrics } from '@capsizecss/core'
-import type { NestedObject } from '@navith/tailwindcss-plugin-author-types'
-import plugin from 'tailwindcss/plugin'
+import plugin from './plugin'
 
-import { makeCssSelectors, normalizeValue } from './utils'
-
-export interface PluginOptions {
-    /** The root font-size, in pixels */
-    rootSize: number
-}
-
-export default plugin.withOptions<Partial<PluginOptions>>(
-    ({ rootSize = 16 } = {}) => {
-        return function ({ addUtilities, theme }) {
-            /** @todo Improve these types maybe? */
-            let fontMetrics = theme('fontMetrics', {}) as Record<
-                string,
-                FontMetrics
-            >
-            let lineHeight = theme('lineHeight', {}) as Record<string, string>
-            let fontSize = theme('fontSize', {}) as Record<string, string>
-            let utilities: NestedObject = {}
-
-            Object.keys(fontMetrics).forEach((fontFamily) => {
-                let fontConfig = fontMetrics[fontFamily]
-
-                Object.keys(fontSize).forEach((sizeName) => {
-                    Object.keys(lineHeight).forEach((leading) => {
-                        let fs = normalizeValue(fontSize[sizeName], rootSize)
-                        let lh = normalizeValue(
-                            lineHeight[leading],
-                            rootSize,
-                            fs,
-                        )
-
-                        let {
-                            '::after': after,
-                            '::before': before,
-                        } = createStyleObject({
-                            fontMetrics: fontConfig,
-                            fontSize: fs,
-                            leading: lh,
-                        })
-
-                        utilities[
-                            makeCssSelectors(fontFamily, sizeName, leading)
-                        ] = {
-                            '&::before': before,
-                            '&::after': after,
-                        }
-                    })
-                })
-            })
-
-            addUtilities(utilities, {})
-        }
-    },
-)
+module.exports = plugin

src/plugin.ts

@@ -0,0 +1,58 @@
+import { createStyleObject } from '@capsizecss/core'
+import type { FontMetrics } from '@capsizecss/core'
+import type { NestedObject } from '@navith/tailwindcss-plugin-author-types'
+import plugin from 'tailwindcss/plugin'
+
+import { makeCssSelectors, normalizeValue } from './utils'
+
+export interface PluginOptions {
+    /** The root font-size, in pixels */
+    rootSize: number
+}
+
+export default plugin.withOptions<Partial<PluginOptions>>(
+    ({ rootSize = 16 } = {}) => {
+        return function ({ addUtilities, theme }) {
+            let fontMetrics = theme('fontMetrics', {}) as Record<
+                string,
+                FontMetrics
+            >
+            let lineHeight = theme('lineHeight', {}) as Record<string, string>
+            let fontSize = theme('fontSize', {}) as Record<string, string>
+            let utilities: NestedObject = {}
+
+            Object.keys(fontMetrics).forEach((fontFamily) => {
+                let fontConfig = fontMetrics[fontFamily]
+
+                Object.keys(fontSize).forEach((sizeName) => {
+                    Object.keys(lineHeight).forEach((leading) => {
+                        let fs = normalizeValue(fontSize[sizeName], rootSize)
+                        let lh = normalizeValue(
+                            lineHeight[leading],
+                            rootSize,
+                            fs,
+                        )
+
+                        let {
+                            '::after': after,
+                            '::before': before,
+                        } = createStyleObject({
+                            fontMetrics: fontConfig,
+                            fontSize: fs,
+                            leading: lh,
+                        })
+
+                        utilities[
+                            makeCssSelectors(fontFamily, sizeName, leading)
+                        ] = {
+                            '&::before': before,
+                            '&::after': after,
+                        }
+                    })
+                })
+            })
+
+            addUtilities(utilities, {})
+        }
+    },
+)