spoko-design-system 1.24.0 → 1.24.1

package/CHANGELOG.md

@@ -1,3 +1,9 @@
+## [1.24.1](https://github.com/polo-blue/sds/compare/v1.24.0...v1.24.1) (2025-12-22)
+
+### Bug Fixes
+
+* **uno-config:** add circle-flags to safelist and Vue :class extractor ([672086a](https://github.com/polo-blue/sds/commit/672086a55b021eaa1ef30807068f7e1f645d39f2))
+
 ## [1.24.0](https://github.com/polo-blue/sds/compare/v1.23.2...v1.24.0) (2025-12-16)
 
 ### Features

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "spoko-design-system",
-  "version": "1.24.0",
+  "version": "1.24.1",
   "type": "module",
   "private": false,
   "main": "./index.ts",

package/uno-config/index.ts

@@ -162,8 +162,15 @@ export function createSdsConfig(customConfig: CustomConfig = {}) {
       'i-simple-icons-youtube',
       'i-simple-icons-vimeo',
 
+      // Language flags for Translations component (dynamic Vue classes)
+      'i-circle-flags:en',
+      'i-circle-flags:pl',
+
       // All peer selectors from the list (needed for floating labels)
       ...peerSelectorClasses,
+
+      // Custom safelist from consumer config
+      ...(customConfig.safelist || []),
     ],
     // Optimized extractors for static Astro builds
     extractors: [
@@ -197,6 +204,31 @@ export function createSdsConfig(customConfig: CustomConfig = {}) {
             }
           }
 
+          // For .vue files, extract from :class bindings (dynamic classes)
+          if (id && id.endsWith('.vue')) {
+            // Match :class="[...]" or :class="{...}" or :class="'...'"
+            const vueClassRegex = /:class=["'`]([^"'`]+)["'`]/g;
+            while ((match = vueClassRegex.exec(code)) !== null) {
+              // Extract class names from ternary expressions and string literals
+              const classContent = match[1];
+              // Match quoted strings inside the expression (e.g., 'i-circle-flags:en')
+              const quotedStrings = classContent.match(/['"]([^'"]+)['"]/g);
+              if (quotedStrings) {
+                quotedStrings.forEach(quoted => {
+                  const cls = quoted.replace(/['"]/g, '').trim();
+                  if (cls && !cls.includes('?') && !cls.includes(':') || cls.startsWith('i-')) {
+                    // Split by spaces in case multiple classes
+                    cls.split(/\s+/).forEach(c => {
+                      if (c && c.length > 1) {
+                        result.add(c);
+                      }
+                    });
+                  }
+                });
+              }
+            }
+          }
+
           return result;
         },
       },