@spark-ui/cli-utils 2.5.3 → 2.6.1

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.6.1](https://github.com/adevinta/spark/compare/@spark-ui/cli-utils@2.6.0...@spark-ui/cli-utils@2.6.1) (2023-03-14)
+
+**Note:** Version bump only for package @spark-ui/cli-utils
+
+# [2.6.0](https://github.com/adevinta/spark/compare/@spark-ui/cli-utils@2.5.3...@spark-ui/cli-utils@2.6.0) (2023-03-14)
+
+### Features
+
+- **cli-utils:** update setup-themes transformer functions ([5c9a305](https://github.com/adevinta/spark/commit/5c9a3056807758e3178f1ae183b7d5718f06f3b7))
+
 ## [2.5.3](https://github.com/adevinta/spark/compare/@spark-ui/cli-utils@2.5.2...@spark-ui/cli-utils@2.5.3) (2023-03-13)
 
 **Note:** Version bump only for package @spark-ui/cli-utils

package/README.md

@@ -0,0 +1 @@
+The documentation for this package is located within our Storybook at https://sparkui.vercel.app/?path=/docs/utils-cli--docs.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spark-ui/cli-utils",
-  "version": "2.5.3",
+  "version": "2.6.1",
   "description": "Spark CLI utils",
   "publishConfig": {
     "access": "public"
@@ -13,7 +13,7 @@
   "type": "module",
   "dependencies": {
     "@clack/prompts": "0.6.2",
-    "@spark-ui/theme-utils": "^2.7.3",
+    "@spark-ui/theme-utils": "^2.8.0",
     "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": "7b23b8cf3563efa3e4326b2470e38a1bb9fee60d"
+  "gitHead": "e6b95c3341e063481dbdec5c78b3b08a618c9fa1"
 }

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

@@ -7,6 +7,7 @@ import { DEFAULT_KEY, defaultColors, tailwindKeys } from './constants.js'
 import {
   doubleHyphensRegex,
   hasNumber,
+  isAlphanumericWithLeadingLetter,
   isCamelCase,
   isHex,
   isObject,
@@ -19,6 +20,7 @@ function toTailwindConfig(_theme) {
 
   const { fontSize, colors, screens } = tailwindKeys
 
+  /* eslint-disable complexity */
   function traverse(theme, paths = []) {
     Object.entries(theme).forEach(([key, value]) => {
       // 👀 see: https://tailwindcss.com/docs/font-size#providing-a-default-line-height
@@ -92,7 +94,13 @@ function toTailwindConfig(_theme) {
           return `var(--${paths.join('-')}-${key.toLowerCase()})`
         })()
 
-        theme[key] = isScreenValue
+        const formattedKey = isAlphanumericWithLeadingLetter(key) ? toKebabCase(key) : key
+
+        if (formattedKey !== key) {
+          delete theme[key]
+        }
+
+        theme[formattedKey] = isScreenValue
           ? formattedValue
           : toKebabCase(formattedValue).replace(doubleHyphensRegex, '-')
       }

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

@@ -1,5 +1,9 @@
 function toKebabCase(v) {
-  return v.replace(/[A-Z0-9]/g, e => `-${e.toLocaleLowerCase()}`)
+  return v.replace(/[A-Z]+(?=[a-z0-9])|\d+/g, match => '-' + match.toLowerCase())
+}
+
+function isAlphanumericWithLeadingLetter(v) {
+  return /^[a-zA-Z](?=.*\d)[a-zA-Z\d]*$/.test(v)
 }
 
 function isHex(value) {
@@ -43,6 +47,7 @@ export {
   isStringOrNumber,
   isObject,
   isCamelCase,
+  isAlphanumericWithLeadingLetter,
   hasNumber,
   getRemEquivalentValue,
   doubleHyphensRegex,