@spark-ui/cli-utils 2.2.7 → 2.4.0

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.4.0](https://github.com/adevinta/spark/compare/@spark-ui/cli-utils@2.3.0...@spark-ui/cli-utils@2.4.0) (2023-03-03)
+
+### Features
+
+- **cli-utils:** handle overlooked edge cases ([d5c1ae3](https://github.com/adevinta/spark/commit/d5c1ae3d1eb41aa7c7c8a265d63e74dd7c416531))
+
+# [2.3.0](https://github.com/adevinta/spark/compare/@spark-ui/cli-utils@2.2.7...@spark-ui/cli-utils@2.3.0) (2023-03-02)
+
+### Features
+
+- **cli-utils:** update toTailwindConfig mapper to handle edge cases ([2af919a](https://github.com/adevinta/spark/commit/2af919a3dd7bbab02d00cd9892c1e9a7971aec38))
+
 ## [2.2.7](https://github.com/adevinta/spark/compare/@spark-ui/cli-utils@2.2.6...@spark-ui/cli-utils@2.2.7) (2023-03-02)
 
 **Note:** Version bump only for package @spark-ui/cli-utils

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spark-ui/cli-utils",
-  "version": "2.2.7",
+  "version": "2.4.0",
   "description": "Spark CLI utils",
   "publishConfig": {
     "access": "public"
@@ -13,7 +13,7 @@
   "type": "module",
   "dependencies": {
     "@clack/prompts": "0.2.2",
-    "@spark-ui/theme-utils": "^2.6.0",
+    "@spark-ui/theme-utils": "^2.6.1",
     "camel-case": "4.1.2",
     "chalk": "5.2.0",
     "commander": "10.0.0",
@@ -29,5 +29,5 @@
     "url": "git@github.com:adevinta/spark.git",
     "directory": "packages/utils/cli"
   },
-  "gitHead": "84648617bfcf9bd9feac25d86c2d9a68a2a9cc72"
+  "gitHead": "8592733ad239e8ebdda108387df3dd8997e1353c"
 }

package/src/setup-themes/utils/constants.js

@@ -3,3 +3,11 @@ export const tailwindKeys = {
   fontSize: 'fontSize',
   screens: 'screens',
 }
+
+export const DEFAULT_KEY = 'DEFAULT'
+
+export const defaultColors = {
+  inherit: 'inherit',
+  current: 'currentColor',
+  transparent: 'transparent',
+}

package/src/setup-themes/utils/createCSSTokenfile.js

@@ -3,6 +3,7 @@ import { join } from 'node:path'
 
 import hexRgb from 'hex-rgb'
 
+import { DEFAULT_KEY } from './constants.js'
 import { doubleHyphensRegex, isHex, isObject, isStringOrNumber, toKebabCase } from './utils.js'
 
 function toCSSVars(_theme, className) {
@@ -26,7 +27,10 @@ function toCSSVars(_theme, className) {
         }
 
         flattenedTheme[
-          `--${[...paths, key].map(toKebabCase).join('-').replace(doubleHyphensRegex, '-')}`
+          `--${[...paths, key === DEFAULT_KEY ? key.toLowerCase() : key]
+            .map(toKebabCase)
+            .join('-')
+            .replace(doubleHyphensRegex, '-')}`
         ] = getFormattedValue()
       }
     })

package/src/setup-themes/utils/createTailwindThemeConfigFile.js

@@ -3,7 +3,7 @@ import { join } from 'node:path'
 
 import { defaultTheme } from '@spark-ui/theme-utils'
 
-import { tailwindKeys } from './constants.js'
+import { DEFAULT_KEY, defaultColors, tailwindKeys } from './constants.js'
 import {
   doubleHyphensRegex,
   hasNumber,
@@ -60,6 +60,10 @@ function toTailwindConfig(_theme) {
 
       if (isObject(value)) {
         Object.keys(value).forEach(k => {
+          if (k === DEFAULT_KEY) {
+            return
+          }
+
           if (!isObject(value[k]) && !isCamelCase(k)) {
             return
           }
@@ -85,7 +89,7 @@ function toTailwindConfig(_theme) {
             return String(value).toLowerCase()
           }
 
-          return `var(--${paths.join('-')}-${key})`
+          return `var(--${paths.join('-')}-${key.toLowerCase()})`
         })()
 
         theme[key] = isScreenValue
@@ -97,7 +101,7 @@ function toTailwindConfig(_theme) {
 
   traverse(themeCpy)
 
-  return themeCpy
+  return { ...themeCpy, colors: { ...themeCpy.colors, ...defaultColors } }
 }
 
 /**