From fc1d7eb44fcda10eaac0d8c1ba17ccc5ac0d6059 Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Thu, 25 Mar 2021 21:44:57 -0400
Subject: [PATCH] Fix divide-style not generating, and divide-width not
 handling '0' properly

---
 src/corePlugins/divideStyle.js | 38 +++++++++++++++++-----------------
 src/corePlugins/divideWidth.js |  4 ++++
 tests/01-basic-usage.test.css  | 23 ++++++++++++++++++++
 tests/01-basic-usage.test.html |  2 +-
 4 files changed, 47 insertions(+), 20 deletions(-)

diff --git a/src/corePlugins/divideStyle.js b/src/corePlugins/divideStyle.js
index b0088ce..ece35bc 100644
--- a/src/corePlugins/divideStyle.js
+++ b/src/corePlugins/divideStyle.js
@@ -1,19 +1,19 @@
-const { createSimpleStaticUtilityPlugin } = require('../pluginUtils')
-
-module.exports = createSimpleStaticUtilityPlugin({
-  '.divide-solid > :not([hidden]) ~ :not([hidden])': {
-    'border-style': 'solid',
-  },
-  '.divide-dashed > :not([hidden]) ~ :not([hidden])': {
-    'border-style': 'dashed',
-  },
-  '.divide-dotted > :not([hidden]) ~ :not([hidden])': {
-    'border-style': 'dotted',
-  },
-  '.divide-double > :not([hidden]) ~ :not([hidden])': {
-    'border-style': 'double',
-  },
-  '.divide-none > :not([hidden]) ~ :not([hidden])': {
-    'border-style': 'none',
-  },
-})
+module.exports = function ({ addUtilities }) {
+  addUtilities({
+    '.divide-solid > :not([hidden]) ~ :not([hidden])': {
+      'border-style': 'solid',
+    },
+    '.divide-dashed > :not([hidden]) ~ :not([hidden])': {
+      'border-style': 'dashed',
+    },
+    '.divide-dotted > :not([hidden]) ~ :not([hidden])': {
+      'border-style': 'dotted',
+    },
+    '.divide-double > :not([hidden]) ~ :not([hidden])': {
+      'border-style': 'double',
+    },
+    '.divide-none > :not([hidden]) ~ :not([hidden])': {
+      'border-style': 'none',
+    },
+  })
+}
diff --git a/src/corePlugins/divideWidth.js b/src/corePlugins/divideWidth.js
index 06dbe94..72a3772 100644
--- a/src/corePlugins/divideWidth.js
+++ b/src/corePlugins/divideWidth.js
@@ -9,6 +9,8 @@ module.exports = function ({ addUtilities, matchUtilities, jit: { theme } }) {
         return []
       }
 
+      value = value === '0' ? '0px' : value
+
       return {
         [`${nameClass('divide-x', modifier)} > :not([hidden]) ~ :not([hidden])`]: {
           '--tw-divide-x-reverse': '0',
@@ -24,6 +26,8 @@ module.exports = function ({ addUtilities, matchUtilities, jit: { theme } }) {
         return []
       }
 
+      value = value === '0' ? '0px' : value
+
       return {
         [`${nameClass('divide-y', modifier)} > :not([hidden]) ~ :not([hidden])`]: {
           '--tw-divide-y-reverse': '0',
diff --git a/tests/01-basic-usage.test.css b/tests/01-basic-usage.test.css
index c41a09f..5dbac18 100644
--- a/tests/01-basic-usage.test.css
+++ b/tests/01-basic-usage.test.css
@@ -330,6 +330,29 @@
 .space-x-reverse > :not([hidden]) ~ :not([hidden]) {
   --tw-space-x-reverse: 1;
 }
+.divide-x-2 > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-x-reverse: 0;
+  border-right-width: calc(2px * var(--tw-divide-x-reverse));
+  border-left-width: calc(2px * calc(1 - var(--tw-divide-x-reverse)));
+}
+.divide-y-4 > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-y-reverse: 0;
+  border-top-width: calc(4px * calc(1 - var(--tw-divide-y-reverse)));
+  border-bottom-width: calc(4px * var(--tw-divide-y-reverse));
+}
+.divide-x-0 > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-x-reverse: 0;
+  border-right-width: calc(0px * var(--tw-divide-x-reverse));
+  border-left-width: calc(0px * calc(1 - var(--tw-divide-x-reverse)));
+}
+.divide-y-0 > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-y-reverse: 0;
+  border-top-width: calc(0px * calc(1 - var(--tw-divide-y-reverse)));
+  border-bottom-width: calc(0px * var(--tw-divide-y-reverse));
+}
+.divide-dotted > :not([hidden]) ~ :not([hidden]) {
+  border-style: dotted;
+}
 .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
   --tw-divide-opacity: 1;
   border-color: rgba(229, 231, 235, var(--tw-divide-opacity));
diff --git a/tests/01-basic-usage.test.html b/tests/01-basic-usage.test.html
index b480db9..58ab9f8 100644
--- a/tests/01-basic-usage.test.html
+++ b/tests/01-basic-usage.test.html
@@ -40,7 +40,7 @@
     <div class="divide-gray-200"></div>
     <div class="divide-opacity-50"></div>
     <div class="divide-dotted"></div>
-    <div class="divide-4"></div>
+    <div class="divide-x-2 divide-y-4 divide-x-0 divide-y-0"></div>
     <div class="fill-current"></div>
     <div class="flex-1"></div>
     <div class="flex-row-reverse"></div>