Improved variable structure

1 files changed, 22 insertions, 18 deletions

diff --git a/src/objects/_field-label.scss b/src/objects/_field-label.scss
index d0bc6ad..144afad 100644
--- a/src/objects/_field-label.scss
+++ b/src/objects/_field-label.scss
@@ -1,34 +1,38 @@
 @use 'iro-sass/src/index' as iro;
+@use '../functions' as fn;
 
 @include iro.props-namespace('field-label') {
     @include iro.props-store((
         --dims: (
-            --spacing-x:       iro.props-get(--dims --spacing --x --sm, $global: true),
-            --spacing-y:       iro.props-get(--dims --spacing --y --xs, $global: true),
-            --label-font-size: iro.props-get(--dims --font-size --sm, $global: true),
-            --hint-font-size:  iro.props-get(--dims --font-size --sm, $global: true),
+            --spacing-x:       fn.dim(--spacing --x --sm, $global: true),
+            --spacing-y:       fn.dim(--spacing --y --xs, $global: true),
+            --label-font-size: fn.dim(--font-size --sm, $global: true),
+            --hint-font-size:  fn.dim(--font-size --sm, $global: true),
         ),
+    ), 'dims');
+
+    @include iro.props-store((
         --colors: (
-            --label:      iro.props-get(--colors --fg-hi, $global: true),
-            --hint:       iro.props-get(--colors --fg, $global: true),
-            --error-hint: iro.props-get(--colors --accent --error, $global: true),
-            --disabled:   iro.props-get(--colors --fg-hi3, $global: true),
+            --label:      fn.color(--fg-hi, $global: true),
+            --hint:       fn.color(--fg, $global: true),
+            --error-hint: fn.color(--accent --error, $global: true),
+            --disabled:   fn.color(--fg-hi3, $global: true),
         ),
-    ));
+    ), 'colors');
 
     @include iro.bem-object(iro.props-namespace()) {
         display: inline-block;
 
         @include iro.bem-elem('label') {
             display:       block;
-            padding-right: iro.props-get(--dims --spacing-x);
-            color:         iro.props-get(--colors --label);
-            font-size:     iro.props-get(--dims --label-font-size);
+            padding-right: fn.dim(--spacing-x);
+            color:         fn.color(--label);
+            font-size:     fn.dim(--label-font-size);
             font-weight:   400;
             line-height:   1.3;
     
             @include iro.bem-next-elem('content') {
-                margin-top: iro.props-get(--dims --spacing-y);
+                margin-top: fn.dim(--spacing-y);
             }
         }
     
@@ -38,20 +42,20 @@
     
         @include iro.bem-elem('hint') {
             display:    block;
-            margin-top: iro.props-get(--dims --spacing-y);
-            color:      iro.props-get(--colors --hint);
-            font-size:  iro.props-get(--dims --hint-font-size);
+            margin-top: fn.dim(--spacing-y);
+            color:      fn.color(--hint);
+            font-size:  fn.dim(--hint-font-size);
         }
     
         @include iro.bem-is('invalid') {
             @include iro.bem-elem('hint') {
-                color: iro.props-get(--colors --error-hint);
+                color: fn.color(--error-hint);
             }
         }
     
         @include iro.bem-is('disabled') {
             @include iro.bem-elem('label', 'hint') {
-                color: iro.props-get(--colors --disabled);
+                color: fn.color(--disabled);
             }
         }