@onereach/styles 2.9.6-beta.666.0 → 2.9.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onereach/styles",
-  "version": "2.9.6-beta.666.0",
+  "version": "2.9.6",
   "description": "Styles for or-ui-next",
   "main": "./main.css",
   "unpkg": "./main.css",
@@ -41,5 +41,6 @@
     "postcss-preset-env": "^7.7.1",
     "sass": "^1.35.1",
     "tailwindcss": "^3.1.3"
-  }
+  },
+  "gitHead": "9e7c3a53eb4f45940e6c9a78a66548fb95cd2498"
 }

package/tailwind-utils.js

@@ -1,19 +1,19 @@
 module.exports = {
   parseColorTokens(designTokens, colorGroups) {
-    const isBackgroundColor = (name) => /\b(?:container|background|surface)\b/.test(name) && !isTextColor(name);
-    const isTextColor = (name) => /\b(?:on)\b/.test(name);
-    const isShadowColor = (name) => /\b(?:shadow)\b/.test(name);
+    const isBackground = (name) => /\b(?:container|background|surface)\b/.test(name) && !isText(name);
+    const isText = (name) => /\b(?:on)\b/.test(name);
+    const isShadow = (name) => /\b(?:shadow)\b/.test(name);
     const isOpacity = (name) => /\b(?:opacity)\b/.test(name);
 
     const defineColorGroup = (name) => {
       switch (true) {
-        case isBackgroundColor(name):
+        case isBackground(name):
           return 'background';
 
-        case isTextColor(name):
+        case isText(name):
           return 'text';
 
-        case isShadowColor(name):
+        case isShadow(name):
         case isOpacity(name):
           return null;
 
@@ -36,10 +36,7 @@ module.exports = {
       .filter(({ group }) => colorGroups.includes(group))
       .reduce((preset, { name, theme, value }) => ({
         ...preset,
-        [name]: !theme ? value : {
-          ...preset[name],
-          ...theme === 'light' ? { DEFAULT: value } : { [theme]: value },
-        },
+        [!theme || theme === 'light' ? name : `${name}-${theme}`]: value,
       }), {});
   },
 
@@ -69,10 +66,9 @@ module.exports = {
           .replace(/\b0px\b/g, '0')
           .replace(/rgba\((\d+),(\d+),(\d+),([\d.]+)\)/g, 'rgba($1 $2 $3 / $4)'),
       }))
-      .filter(({ theme }) => theme === 'light')
-      .reduce((preset, { name, value }) => ({
+      .reduce((preset, { name, theme, value }) => ({
         ...preset,
-        [name]: value,
+        [!theme || theme === 'light' ? name : `${name}-${theme}`]: value,
       }), {});
   },