vueless 0.0.670 → 0.0.672

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.670",
+  "version": "0.0.672",
   "license": "MIT",
   "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
   "keywords": [

package/ui.other-theme-color-toggle/UThemeColorToggle.vue

@@ -102,7 +102,11 @@ const { listAttrs, colorButtonAttrs, circleAttrs, colorDividerAttrs } =
       <div :class="brandColorClass" v-bind="circleAttrs" />
     </UButton>
 
-    <UDivider size="xs" v-bind="colorDividerAttrs" />
+    <UDivider
+      v-if="Object.keys(brandColors).length && Object.keys(grayColors).length"
+      size="xs"
+      v-bind="colorDividerAttrs"
+    />
 
     <UButton
       v-for="(grayColorClass, color) in grayColors"

package/ui.other-theme-color-toggle/config.ts

@@ -12,7 +12,16 @@ export default /*tw*/ {
       ],
     },
   },
-  circle: "size-5 rounded-full",
+  circle: {
+    base: "rounded-full",
+    variants: {
+      size: {
+        sm: "size-4",
+        md: "size-5",
+        lg: "size-6",
+      },
+    },
+  },
   colorDivider: "{UDivider}",
   defaults: {
     size: "md",

package/utils/node/loaderIcon.js

@@ -178,7 +178,8 @@ async function findAndCopyIcons(files) {
 
     /* Vueless components props */
     const iconPropsPattern = `\\b\\w*(name|icon)\\w*\\s*=\\s*(['"])(.*?)\\2`;
-    const uComponentIconNamePattern = /<U\w+\s+.*?\b\w*(name|icon)\w*\s*[:=]\s*(['"])(.*?)\2.*?>/;
+    const uComponentIconNamePattern =
+      /<U\w+\b[^>]*?\b\w*(name|icon)\w*\s*[:=]\s*(['"])(.*?)\2[^>]*?>/;
     const uComponentIconNameArray = fileContents.match(new RegExp(uComponentIconNamePattern, "g"));
 
     if (!uComponentIconNameArray) return;

package/utils/ui.ts

@@ -129,13 +129,10 @@ export function getDefaults<Props, Config>(defaultConfig: Config, name: Componen
  * Otherwise return given color.
  */
 export function getColor(color: string) {
-  const isBrandColorGrayscale = vuelessConfig.brand === GRAYSCALE_COLOR;
-  const isSelectedColorGrayscale = getSelectedBrandColor() === GRAYSCALE_COLOR;
   const isComponentColorBrand = color === BRAND_COLOR;
+  const isSelectedColorGrayscale = getSelectedBrandColor() === GRAYSCALE_COLOR;
 
-  return (isBrandColorGrayscale || isSelectedColorGrayscale) && isComponentColorBrand
-    ? GRAYSCALE_COLOR
-    : color;
+  return isComponentColorBrand && isSelectedColorGrayscale ? GRAYSCALE_COLOR : color;
 }
 
 /**