@codeleap/styles 6.2.3 → 6.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codeleap/styles",
-  "version": "6.2.3",
+  "version": "6.3.0",
   "main": "src/index.ts",
   "license": "UNLICENSED",
   "repository": {
@@ -9,7 +9,7 @@
     "directory": "packages/styles"
   },
   "devDependencies": {
-    "@codeleap/config": "6.2.3",
+    "@codeleap/config": "6.3.0",
     "ts-node-dev": "^1.1.8"
   },
   "scripts": {

package/package.json.bak

@@ -1,6 +1,6 @@
 {
   "name": "@codeleap/styles",
-  "version": "6.2.3",
+  "version": "6.3.0",
   "main": "src/index.ts",
   "license": "UNLICENSED",
   "repository": {

package/src/theme/tests/themeStore.spec.ts

@@ -14,7 +14,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
     it('should handle theme management', () => {
       const mockTheme = {
         colors: { primary: '#007bff' },
-        spacing: { small: '8px' }
+        spacing: { small: '8px' },
       }
 
       store.setTheme(mockTheme)
@@ -39,21 +39,21 @@ describe('ThemeStore - Heavy Load Tests', () => {
             secondary: `#${(i * 2).toString(16).padStart(6, '0')}`,
             background: `#${(i * 3).toString(16).padStart(6, '0')}`,
             surface: `#${(i * 4).toString(16).padStart(6, '0')}`,
-            text: `#${(i * 5).toString(16).padStart(6, '0')}`
+            text: `#${(i * 5).toString(16).padStart(6, '0')}`,
           },
           spacing: {
             xs: `${i}px`,
             sm: `${i * 2}px`,
             md: `${i * 4}px`,
             lg: `${i * 8}px`,
-            xl: `${i * 16}px`
+            xl: `${i * 16}px`,
           },
           typography: {
             fontSize: `${i}px`,
             fontWeight: i % 900,
-            lineHeight: i / 100
+            lineHeight: i / 100,
           },
-          iteration: i
+          iteration: i,
         }
 
         store.setTheme(theme)
@@ -88,14 +88,14 @@ describe('ThemeStore - Heavy Load Tests', () => {
             variants: {
               light: `#${(scheme * color + 100000).toString(16).padStart(6, '0')}`,
               dark: `#${(scheme * color + 200000).toString(16).padStart(6, '0')}`,
-              medium: `#${(scheme * color + 300000).toString(16).padStart(6, '0')}`
+              medium: `#${(scheme * color + 300000).toString(16).padStart(6, '0')}`,
             },
             states: {
               hover: `#${(scheme * color + 400000).toString(16).padStart(6, '0')}`,
               active: `#${(scheme * color + 500000).toString(16).padStart(6, '0')}`,
               disabled: `#${(scheme * color + 600000).toString(16).padStart(6, '0')}`,
-              focus: `#${(scheme * color + 700000).toString(16).padStart(6, '0')}`
-            }
+              focus: `#${(scheme * color + 700000).toString(16).padStart(6, '0')}`,
+            },
           }
         }
         colorSchemes[`scheme_${scheme}`] = colors
@@ -120,8 +120,8 @@ describe('ThemeStore - Heavy Load Tests', () => {
         base: {
           primary: '#000000',
           secondary: '#111111',
-          tertiary: '#222222'
-        }
+          tertiary: '#222222',
+        },
       })
 
       for (let i = 0; i < operations; i++) {
@@ -130,7 +130,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
           primary: `#${i.toString(16).padStart(6, '0')}`,
           accent: `#${(i * 2).toString(16).padStart(6, '0')}`,
           background: `#${(i * 3).toString(16).padStart(6, '0')}`,
-          customColor: `#${(i * 4).toString(16).padStart(6, '0')}`
+          customColor: `#${(i * 4).toString(16).padStart(6, '0')}`,
         }
 
         // Inject scheme
@@ -150,7 +150,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
       const endTime = performance.now()
       const executionTime = endTime - startTime
 
-      expect(executionTime).toBeLessThan(3000) // Should be fast
+      expect(executionTime).toBeLessThan(3500) // Should be fast
       console.log(`Color scheme operations: ${operations} inject/eject operations in ${executionTime.toFixed(2)}ms`)
     })
 
@@ -172,14 +172,14 @@ describe('ThemeStore - Heavy Load Tests', () => {
               margin: `${comp * variant}px`,
               borderRadius: `${variant / 2}px`,
               transform: `rotate(${variant}deg) scale(${1 + comp / 100})`,
-              boxShadow: `${variant}px ${comp}px ${comp + variant}px rgba(${comp}, ${variant}, ${comp + variant}, 0.${variant})`
+              boxShadow: `${variant}px ${comp}px ${comp + variant}px rgba(${comp}, ${variant}, ${comp + variant}, 0.${variant})`,
             },
             states: {
               hover: { opacity: 0.8 + (variant / 100) },
               active: { transform: `scale(${1 + variant / 1000})` },
               disabled: { opacity: 0.5 },
-              focus: { outline: `${variant}px solid #${comp.toString(16).padStart(6, '0')}` }
-            }
+              focus: { outline: `${variant}px solid #${comp.toString(16).padStart(6, '0')}` },
+            },
           }
         }
         variants[`component_${comp}`] = componentVariants
@@ -206,7 +206,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
         // Simultaneous updates
         store.setTheme({
           colors: { primary: `#${i.toString(16).padStart(6, '0')}` },
-          iteration: i
+          iteration: i,
         })
 
         store.setColorScheme(`scheme_${i % 50}`)
@@ -215,14 +215,14 @@ describe('ThemeStore - Heavy Load Tests', () => {
           [`component_${i}`]: {
             [`variant_${i}`]: {
               className: `test-${i}`,
-              styles: { color: `#${i.toString(16).padStart(6, '0')}` }
-            }
-          }
+              styles: { color: `#${i.toString(16).padStart(6, '0')}` },
+            },
+          },
         })
 
         store.injectColorScheme(`dynamic_${i % 100}`, {
           primary: `#${(i * 2).toString(16).padStart(6, '0')}`,
-          secondary: `#${(i * 3).toString(16).padStart(6, '0')}`
+          secondary: `#${(i * 3).toString(16).padStart(6, '0')}`,
         })
 
         // Verify consistency every 200 iterations
@@ -251,7 +251,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
         spacing: {},
         calculators: {},
         transformers: {},
-        validators: {}
+        validators: {},
       }
 
       const startTime = performance.now()
@@ -268,14 +268,14 @@ describe('ThemeStore - Heavy Load Tests', () => {
             offset: input + (i * 3.14159),
             computed: Math.sin(input + i) * 100,
             conditional: input > i ? input * 2 : input / 2,
-            recursive: i > 0 ? theme.calculators[`calc_${i - 1}`]?.(input) || input : input
+            recursive: i > 0 ? theme.calculators[`calc_${i - 1}`]?.(input) || input : input,
           }
         }
 
         // Spacing functions
         theme.spacing[`space_${i}`] = (multiplier = 1) => `${i * 8 * multiplier}px`
 
-        // Color functions  
+        // Color functions
         theme.colors[`color_${i}`] = (opacity = 1) => {
           const r = (i * 37) % 256
           const g = (i * 73) % 256
@@ -324,7 +324,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
         // Test some complex chaining every 100 iterations
         if (i % 100 === 0) {
           const chainResult = getThemeStore()?.transformers[`transform_${i}`]?.(
-            getThemeStore()?.calculators[`calc_${i}`]?.(testValue) || 0
+            getThemeStore()?.calculators[`calc_${i}`]?.(testValue) || 0,
           )
           if (chainResult) executionResults++
         }
@@ -350,7 +350,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
         fibonacci: {},
         factorial: {},
         compose: {},
-        pipeline: {}
+        pipeline: {},
       }
 
       // Fibonacci functions
@@ -392,7 +392,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
             (x) => x + i,
             (x) => Math.pow(x, 1.5),
             (x) => x % 1000,
-            (x) => theme.compose[`comp_${Math.min(i, depth - 1)}`]?.(x) || x
+            (x) => theme.compose[`comp_${Math.min(i, depth - 1)}`]?.(x) || x,
           ]
           return steps.reduce((acc, fn) => fn(acc), input)
         }
@@ -427,7 +427,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
           // Test chained execution
           if (i % 50 === 0) {
             const chainedResult = getThemeStore()?.pipeline[`pipe_${i % depth}`]?.(
-              getThemeStore()?.compose[`comp_${i % depth}`]?.(testValue) || 0
+              getThemeStore()?.compose[`comp_${i % depth}`]?.(testValue) || 0,
             )
             if (typeof chainedResult === 'number') successfulExecutions++
           }
@@ -452,7 +452,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
       const theme = {
         factories: {},
         generated: {},
-        dynamicComputed: {}
+        dynamicComputed: {},
       }
 
       const startTime = performance.now()
@@ -467,9 +467,9 @@ describe('ThemeStore - Heavy Load Tests', () => {
               original: value,
               scaled: value * (config.scale || 1),
               formatted: `${config.prefix || ''}${value}${config.suffix || ''}`,
-              computed: Math.pow(value, config.power || 1)
+              computed: Math.pow(value, config.power || 1),
             }),
-            composer: (...fns) => (value) => fns.reduce((acc, fn) => fn(acc), value)
+            composer: (...fns) => (value) => fns.reduce((acc, fn) => fn(acc), value),
           }
         }
 
@@ -483,7 +483,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
             max: i * 100,
             prefix: `gen_${i}_`,
             suffix: `_${j}`,
-            power: 1 + (j / 5)
+            power: 1 + (j / 5),
           }
 
           const generatedFunctions = theme.factories[`factory_${i}`](config)
@@ -499,7 +499,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
               calculated: calc,
               isValid: valid,
               transformed: transform,
-              final: valid ? transform.computed : 0
+              final: valid ? transform.computed : 0,
             }
           }
         }
@@ -545,7 +545,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
                 const composed = generated.composer(
                   (x) => x * 2,
                   (x) => x + 10,
-                  generated.calculator
+                  generated.calculator,
                 )(testValue)
                 if (typeof composed === 'number') executionCount++
               }
@@ -581,7 +581,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
           colors: {},
           spacing: {},
           typography: {},
-          components: {}
+          components: {},
         }
 
         for (let i = 0; i < itemsPerSet; i++) {
@@ -590,7 +590,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
           hugeTheme.typography[`font_${i}`] = `${i}px`
           hugeTheme.components[`comp_${i}`] = {
             styles: { margin: `${i}px` },
-            variants: Array.from({ length: 10 }, (_, j) => `variant_${j}`)
+            variants: Array.from({ length: 10 }, (_, j) => `variant_${j}`),
           }
         }
 
@@ -630,7 +630,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
       for (let i = 0; i < updates; i++) {
         themeStore.setTheme({
           colors: { primary: `#${i.toString(16).padStart(6, '0')}` },
-          iteration: i
+          iteration: i,
         })
         themeStore.setColorScheme(`scheme_${i % 100}`)
 
@@ -681,7 +681,7 @@ describe('ThemeStore - Heavy Load Tests', () => {
       for (let i = 0; i < updates; i++) {
         themeStore.setTheme({
           colors: { primary: `#${i.toString(16).padStart(6, '0')}` },
-          iteration: i
+          iteration: i,
         })
       }