@alfalab/core-components-steps 2.0.0 → 2.1.0-snapshot-92b8690

package/modern/components/step/index.css

@@ -24,30 +24,30 @@
 } :root {
     --steps-option-svg-color: var(--color-light-status-positive);
     --steps-dash-border: 2px solid var(--color-light-status-positive);
-} .steps__step_1exzg {
+} .steps__step_116b4 {
     display: flex;
     outline: none
-} .steps__step_1exzg.steps__horizontal_1exzg {
+} .steps__step_116b4.steps__horizontal_116b4 {
         flex-grow: 1;
-    } .steps__step_1exzg:not(.steps__vertical_1exzg) {
+    } .steps__step_116b4:not(.steps__vertical_116b4) {
         align-items: center;
-    } .steps__step_1exzg:last-of-type .steps__textWrapper_1exzg.steps__vertical_1exzg {
+    } .steps__step_116b4:last-of-type .steps__textWrapper_116b4.steps__vertical_116b4 {
         margin-bottom: var(--gap-0);
-    } .steps__step_1exzg.steps__interactive_1exzg:not(.steps__disabled_1exzg):hover {
+    } .steps__step_116b4.steps__interactive_116b4:not(.steps__disabled_116b4):hover {
     cursor: pointer;
-} .steps__step_1exzg.steps__disabled_1exzg:hover .steps__text_1exzg {
+} .steps__step_116b4.steps__disabled_116b4:hover .steps__text_116b4 {
         background: unset;
-    } .steps__step_1exzg.steps__disabled_1exzg .steps__indicator_1exzg {
+    } .steps__step_116b4.steps__disabled_116b4 .steps__indicator_116b4 {
         cursor: unset;
-    } .steps__indicator_1exzg {
+    } .steps__indicator_116b4 {
     cursor: pointer;
     display: flex;
     align-items: center;
     margin-right: var(--gap-4)
-} .steps__indicator_1exzg.steps__vertical_1exzg {
+} .steps__indicator_116b4.steps__vertical_116b4 {
         flex-direction: column;
         margin-right: var(--gap-8);
-    } .steps__option_1exzg {
+    } .steps__option_116b4 {
     font-size: 14px;
     line-height: 20px;
     font-weight: 700;
@@ -60,31 +60,31 @@
     min-width: 24px;
     height: 24px;
     border-radius: var(--border-radius-circle)
-} .steps__option_1exzg.steps__vertical_1exzg {
+} .steps__option_116b4.steps__vertical_116b4 {
         margin-top: var(--gap-8);
-    } .steps__dash_1exzg {
+    } .steps__dash_116b4 {
     flex: 1 1 auto;
     min-width: 24px;
     border-top: 2px solid var(--color-light-neutral-translucent-300);
     margin-right: var(--gap-8)
-} .steps__dash_1exzg.steps__completed_1exzg {
+} .steps__dash_116b4.steps__completed_116b4 {
         border-top: var(--steps-dash-border);
-    } .steps__dash_1exzg.steps__vertical_1exzg {
+    } .steps__dash_116b4.steps__vertical_116b4 {
         min-width: unset;
         min-height: 8px;
         margin-right: var(--gap-0);
         margin-top: var(--gap-8);
         border-left: 2px solid var(--color-light-neutral-translucent-300);
         border-top: none;
-    } .steps__dash_1exzg.steps__completed_1exzg.steps__vertical_1exzg {
+    } .steps__dash_116b4.steps__completed_116b4.steps__vertical_116b4 {
         border-left: var(--steps-dash-border);
-    } .steps__textWrapper_1exzg.steps__vertical_1exzg {
+    } .steps__textWrapper_116b4.steps__vertical_116b4 {
         min-height: 48px
-    } .steps__textWrapper_1exzg.steps__vertical_1exzg.steps__gap-24_1exzg {
+    } .steps__textWrapper_116b4.steps__vertical_116b4.steps__gap-24_116b4 {
             margin-bottom: var(--gap-8);
-        } .steps__textWrapper_1exzg.steps__vertical_1exzg.steps__gap-32_1exzg {
+        } .steps__textWrapper_116b4.steps__vertical_116b4.steps__gap-32_116b4 {
             margin-bottom: var(--gap-16);
-        } .steps__text_1exzg {
+        } .steps__text_116b4 {
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
@@ -95,19 +95,19 @@
     border-radius: var(--gap-8);
     height: -moz-min-content;
     height: min-content
-} .steps__text_1exzg.steps__interactive_1exzg:not(.steps__disabled_1exzg):hover {
+} .steps__text_116b4.steps__interactive_116b4:not(.steps__disabled_116b4):hover {
             background: var(--color-light-transparent-default-hover);
-        } .steps__text_1exzg.steps__interactive_1exzg:not(.steps__disabled_1exzg):active {
+        } .steps__text_116b4.steps__interactive_116b4:not(.steps__disabled_116b4):active {
             background: var(--color-light-transparent-default-press);
-        } .steps__focused_1exzg {
+        } .steps__focused_116b4 {
     outline: var(--gap-2) solid var(--focus-color);
     outline-offset: var(--gap-2);
-} .steps__selected_1exzg .steps__text_1exzg {
+} .steps__selected_116b4 .steps__text_116b4 {
         color: var(--color-light-text-primary);
-    } .steps__selected_1exzg .steps__option_1exzg {
+    } .steps__selected_116b4 .steps__option_116b4 {
         color: var(--color-light-text-primary-inverted);
         background: var(--color-light-neutral-translucent-1300);
-    } .steps__checkbox_1exzg {
+    } .steps__checkbox_116b4 {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -115,20 +115,20 @@
     width: 20px;
     height: 20px;
     border: 2px solid var(--color-light-neutral-translucent-300);
-} .steps__dot_1exzg {
+} .steps__dot_116b4 {
     width: 10px;
     height: 10px;
     border-radius: var(--border-radius-circle);
     background: var(--color-light-neutral-translucent-300);
-} .steps__selected_1exzg .steps__checkbox_1exzg {
+} .steps__selected_116b4 .steps__checkbox_116b4 {
     border: 2px solid var(--color-light-neutral-translucent-1300)
-} .steps__selected_1exzg .steps__checkbox_1exzg .steps__dot_1exzg {
+} .steps__selected_116b4 .steps__checkbox_116b4 .steps__dot_116b4 {
         background: var(--color-light-neutral-translucent-1300);
-    } .steps__option_1exzg:not(.steps__error_1exzg).steps__unordered_1exzg {
+    } .steps__option_116b4:not(.steps__error_116b4).steps__unordered_116b4 {
     background: unset;
-} .steps__completedIndicator_1exzg > [class*='positive'] {
+} .steps__completedIndicator_116b4 > [class*='positive'] {
     color: var(--steps-option-svg-color);
     background-color: var(--steps-option-svg-color);
-} .steps__fullWidth_1exzg {
+} .steps__fullWidth_116b4 {
     width: 100%;
 }

package/modern/components/step/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-const styles = {"step":"steps__step_1exzg","horizontal":"steps__horizontal_1exzg","vertical":"steps__vertical_1exzg","textWrapper":"steps__textWrapper_1exzg","interactive":"steps__interactive_1exzg","disabled":"steps__disabled_1exzg","text":"steps__text_1exzg","indicator":"steps__indicator_1exzg","option":"steps__option_1exzg","dash":"steps__dash_1exzg","completed":"steps__completed_1exzg","gap-24":"steps__gap-24_1exzg","gap-32":"steps__gap-32_1exzg","focused":"steps__focused_1exzg","selected":"steps__selected_1exzg","checkbox":"steps__checkbox_1exzg","dot":"steps__dot_1exzg","error":"steps__error_1exzg","unordered":"steps__unordered_1exzg","completedIndicator":"steps__completedIndicator_1exzg","fullWidth":"steps__fullWidth_1exzg"};
+const styles = {"step":"steps__step_116b4","horizontal":"steps__horizontal_116b4","vertical":"steps__vertical_116b4","textWrapper":"steps__textWrapper_116b4","interactive":"steps__interactive_116b4","disabled":"steps__disabled_116b4","text":"steps__text_116b4","indicator":"steps__indicator_116b4","option":"steps__option_116b4","dash":"steps__dash_116b4","completed":"steps__completed_116b4","gap-24":"steps__gap-24_116b4","gap-32":"steps__gap-32_116b4","focused":"steps__focused_116b4","selected":"steps__selected_116b4","checkbox":"steps__checkbox_116b4","dot":"steps__dot_116b4","error":"steps__error_116b4","unordered":"steps__unordered_116b4","completedIndicator":"steps__completedIndicator_116b4","fullWidth":"steps__fullWidth_116b4"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/modern/components/step/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/step/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n:root {\n    --steps-option-svg-color: var(--color-light-status-positive);\n    --steps-dash-border: 2px solid var(--color-light-status-positive);\n}\n\n.step {\n    display: flex;\n    outline: none;\n\n    &.horizontal {\n        flex-grow: 1;\n    }\n\n    &:not(.vertical) {\n        align-items: center;\n    }\n\n    &:last-of-type .textWrapper.vertical {\n        margin-bottom: var(--gap-0);\n    }\n}\n\n.step.interactive:not(.disabled):hover {\n    cursor: pointer;\n}\n\n.step.disabled:hover {\n    & .text {\n        background: unset;\n    }\n}\n\n.step.disabled {\n    & .indicator {\n        cursor: unset;\n    }\n}\n\n.indicator {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    margin-right: var(--gap-4);\n\n    &.vertical {\n        flex-direction: column;\n        margin-right: var(--gap-8);\n    }\n}\n\n.option {\n    @mixin accent_primary_small;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--color-light-text-primary);\n    background: var(--color-light-neutral-translucent-300);\n    min-width: 24px;\n    height: 24px;\n    border-radius: var(--border-radius-circle);\n\n    &.vertical {\n        margin-top: var(--gap-8);\n    }\n}\n\n.dash {\n    flex: 1 1 auto;\n    min-width: 24px;\n    border-top: 2px solid var(--color-light-neutral-translucent-300);\n    margin-right: var(--gap-8);\n\n    &.completed {\n        border-top: var(--steps-dash-border);\n    }\n\n    &.vertical {\n        min-width: unset;\n        min-height: 8px;\n        margin-right: var(--gap-0);\n        margin-top: var(--gap-8);\n        border-left: 2px solid var(--color-light-neutral-translucent-300);\n        border-top: none;\n    }\n\n    &.completed.vertical {\n        border-left: var(--steps-dash-border);\n    }\n}\n\n.textWrapper {\n    &.vertical {\n        min-height: 48px;\n\n        &.gap-24 {\n            margin-bottom: var(--gap-8);\n        }\n\n        &.gap-32 {\n            margin-bottom: var(--gap-16);\n        }\n    }\n}\n\n.text {\n    @mixin paragraph_primary_medium;\n\n    transition: background 0.2s;\n    padding: var(--gap-8);\n    color: var(--color-light-text-primary);\n    border-radius: var(--gap-8);\n    height: min-content;\n\n    &.interactive:not(.disabled) {\n        &:hover {\n            background: var(--color-light-transparent-default-hover);\n        }\n\n        &:active {\n            background: var(--color-light-transparent-default-press);\n        }\n    }\n}\n\n.focused {\n    outline: var(--gap-2) solid var(--focus-color);\n    outline-offset: var(--gap-2);\n}\n\n.selected {\n    & .text {\n        color: var(--color-light-text-primary);\n    }\n\n    & .option {\n        color: var(--color-light-text-primary-inverted);\n        background: var(--color-light-neutral-translucent-1300);\n    }\n}\n\n.checkbox {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: var(--border-radius-circle);\n    width: 20px;\n    height: 20px;\n    border: 2px solid var(--color-light-neutral-translucent-300);\n}\n\n.dot {\n    width: 10px;\n    height: 10px;\n    border-radius: var(--border-radius-circle);\n    background: var(--color-light-neutral-translucent-300);\n}\n\n.selected .checkbox {\n    border: 2px solid var(--color-light-neutral-translucent-1300);\n\n    & .dot {\n        background: var(--color-light-neutral-translucent-1300);\n    }\n}\n\n.option:not(.error).unordered {\n    background: unset;\n}\n\n.completedIndicator > [class*='positive'] {\n    color: var(--steps-option-svg-color);\n    background-color: var(--steps-option-svg-color);\n}\n\n.fullWidth {\n    width: 100%;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,MAAM,CAAC,mBAAmB,CAAC,YAAY,CAAC,yBAAyB,CAAC,UAAU,CAAC,uBAAuB,CAAC,aAAa,CAAC,0BAA0B,CAAC,aAAa,CAAC,0BAA0B,CAAC,UAAU,CAAC,uBAAuB,CAAC,MAAM,CAAC,mBAAmB,CAAC,WAAW,CAAC,wBAAwB,CAAC,QAAQ,CAAC,qBAAqB,CAAC,MAAM,CAAC,mBAAmB,CAAC,WAAW,CAAC,wBAAwB,CAAC,QAAQ,CAAC,qBAAqB,CAAC,QAAQ,CAAC,qBAAqB,CAAC,SAAS,CAAC,sBAAsB,CAAC,UAAU,CAAC,uBAAuB,CAAC,UAAU,CAAC,uBAAuB,CAAC,KAAK,CAAC,kBAAkB,CAAC,OAAO,CAAC,oBAAoB,CAAC,WAAW,CAAC,wBAAwB,CAAC,oBAAoB,CAAC,iCAAiC,CAAC,WAAW,CAAC,wBAAwB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/step/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n\n:root {\n    --steps-option-svg-color: var(--color-light-status-positive);\n    --steps-dash-border: 2px solid var(--color-light-status-positive);\n}\n\n.step {\n    display: flex;\n    outline: none;\n\n    &.horizontal {\n        flex-grow: 1;\n    }\n\n    &:not(.vertical) {\n        align-items: center;\n    }\n\n    &:last-of-type .textWrapper.vertical {\n        margin-bottom: var(--gap-0);\n    }\n}\n\n.step.interactive:not(.disabled):hover {\n    cursor: pointer;\n}\n\n.step.disabled:hover {\n    & .text {\n        background: unset;\n    }\n}\n\n.step.disabled {\n    & .indicator {\n        cursor: unset;\n    }\n}\n\n.indicator {\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    margin-right: var(--gap-4);\n\n    &.vertical {\n        flex-direction: column;\n        margin-right: var(--gap-8);\n    }\n}\n\n.option {\n    @mixin accent_primary_small;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--color-light-text-primary);\n    background: var(--color-light-neutral-translucent-300);\n    min-width: 24px;\n    height: 24px;\n    border-radius: var(--border-radius-circle);\n\n    &.vertical {\n        margin-top: var(--gap-8);\n    }\n}\n\n.dash {\n    flex: 1 1 auto;\n    min-width: 24px;\n    border-top: 2px solid var(--color-light-neutral-translucent-300);\n    margin-right: var(--gap-8);\n\n    &.completed {\n        border-top: var(--steps-dash-border);\n    }\n\n    &.vertical {\n        min-width: unset;\n        min-height: 8px;\n        margin-right: var(--gap-0);\n        margin-top: var(--gap-8);\n        border-left: 2px solid var(--color-light-neutral-translucent-300);\n        border-top: none;\n    }\n\n    &.completed.vertical {\n        border-left: var(--steps-dash-border);\n    }\n}\n\n.textWrapper {\n    &.vertical {\n        min-height: 48px;\n\n        &.gap-24 {\n            margin-bottom: var(--gap-8);\n        }\n\n        &.gap-32 {\n            margin-bottom: var(--gap-16);\n        }\n    }\n}\n\n.text {\n    @mixin paragraph_primary_medium;\n\n    transition: background 0.2s;\n    padding: var(--gap-8);\n    color: var(--color-light-text-primary);\n    border-radius: var(--gap-8);\n    height: min-content;\n\n    &.interactive:not(.disabled) {\n        &:hover {\n            background: var(--color-light-transparent-default-hover);\n        }\n\n        &:active {\n            background: var(--color-light-transparent-default-press);\n        }\n    }\n}\n\n.focused {\n    outline: var(--gap-2) solid var(--focus-color);\n    outline-offset: var(--gap-2);\n}\n\n.selected {\n    & .text {\n        color: var(--color-light-text-primary);\n    }\n\n    & .option {\n        color: var(--color-light-text-primary-inverted);\n        background: var(--color-light-neutral-translucent-1300);\n    }\n}\n\n.checkbox {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: var(--border-radius-circle);\n    width: 20px;\n    height: 20px;\n    border: 2px solid var(--color-light-neutral-translucent-300);\n}\n\n.dot {\n    width: 10px;\n    height: 10px;\n    border-radius: var(--border-radius-circle);\n    background: var(--color-light-neutral-translucent-300);\n}\n\n.selected .checkbox {\n    border: 2px solid var(--color-light-neutral-translucent-1300);\n\n    & .dot {\n        background: var(--color-light-neutral-translucent-1300);\n    }\n}\n\n.option:not(.error).unordered {\n    background: unset;\n}\n\n.completedIndicator > [class*='positive'] {\n    color: var(--steps-option-svg-color);\n    background-color: var(--steps-option-svg-color);\n}\n\n.fullWidth {\n    width: 100%;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,MAAM,CAAC,mBAAmB,CAAC,YAAY,CAAC,yBAAyB,CAAC,UAAU,CAAC,uBAAuB,CAAC,aAAa,CAAC,0BAA0B,CAAC,aAAa,CAAC,0BAA0B,CAAC,UAAU,CAAC,uBAAuB,CAAC,MAAM,CAAC,mBAAmB,CAAC,WAAW,CAAC,wBAAwB,CAAC,QAAQ,CAAC,qBAAqB,CAAC,MAAM,CAAC,mBAAmB,CAAC,WAAW,CAAC,wBAAwB,CAAC,QAAQ,CAAC,qBAAqB,CAAC,QAAQ,CAAC,qBAAqB,CAAC,SAAS,CAAC,sBAAsB,CAAC,UAAU,CAAC,uBAAuB,CAAC,UAAU,CAAC,uBAAuB,CAAC,KAAK,CAAC,kBAAkB,CAAC,OAAO,CAAC,oBAAoB,CAAC,WAAW,CAAC,wBAAwB,CAAC,oBAAoB,CAAC,iCAAiC,CAAC,WAAW,CAAC,wBAAwB,CAAC;;;;"}

package/modern/components/step-indicator/index.css

@@ -1,5 +1,5 @@
 :root {
     --gap-0: 0px;
-} .steps__component_1r6i2.steps__component_1r6i2 {
+} .steps__component_qrkzb.steps__component_qrkzb {
     padding: var(--gap-0);
 }

package/modern/components/step-indicator/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-const styles = {"component":"steps__component_1r6i2"};
+const styles = {"component":"steps__component_qrkzb"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/modern/components/step-indicator/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["../../src/components/step-indicator/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component.component {\n    padding: var(--gap-0);\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,wBAAwB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/step-indicator/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n\n.component.component {\n    padding: var(--gap-0);\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,wBAAwB,CAAC;;;;"}

package/modern/index.css

@@ -1,8 +1,8 @@
-.steps__component_q5f3b {
+.steps__component_nap52 {
     display: flex;
     align-items: center;
     flex-direction: row
-} .steps__component_q5f3b.steps__vertical_q5f3b {
+} .steps__component_nap52.steps__vertical_nap52 {
         flex-direction: column;
         align-items: flex-start;
     }

package/modern/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-const styles = {"component":"steps__component_q5f3b","vertical":"steps__vertical_q5f3b"};
+const styles = {"component":"steps__component_nap52","vertical":"steps__vertical_nap52"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/modern/index.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n    display: flex;\n    align-items: center;\n    flex-direction: row;\n\n    &.vertical {\n        flex-direction: column;\n        align-items: flex-start;\n    }\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,wBAAwB,CAAC,UAAU,CAAC,uBAAuB,CAAC;;;;"}
+{"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';\n\n.component {\n    display: flex;\n    align-items: center;\n    flex-direction: row;\n\n    &.vertical {\n        flex-direction: column;\n        align-items: flex-start;\n    }\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,wBAAwB,CAAC,UAAU,CAAC,uBAAuB,CAAC;;;;"}

package/moderncssm/components/step/index.module.css

@@ -1,3 +1,5 @@
+
+
 :root {
     --steps-option-svg-color: var(--color-light-status-positive);
     --steps-dash-border: 2px solid var(--color-light-status-positive);

package/moderncssm/components/step-indicator/index.module.css

@@ -1,3 +1,5 @@
+
+
 .component.component {
     padding: var(--gap-0);
 }

package/moderncssm/index.module.css

@@ -1,9 +1,10 @@
+
+
 .component {
     display: flex;
     align-items: center;
     flex-direction: row
 }
-
 .component.vertical {
         flex-direction: column;
         align-items: flex-start;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-steps",
-    "version": "2.0.0",
+    "version": "2.1.0-snapshot-92b8690",
     "description": "",
     "keywords": [],
     "license": "MIT",
@@ -10,8 +10,8 @@
     "main": "index.js",
     "module": "./esm/index.js",
     "dependencies": {
-        "@alfalab/core-components-badge": "^6.0.0",
-        "@alfalab/core-components-shared": "^1.0.0",
+        "@alfalab/core-components-badge": "6.1.0-snapshot-92b8690",
+        "@alfalab/core-components-shared": "1.1.0-snapshot-92b8690",
         "@alfalab/hooks": "^1.13.1",
         "@alfalab/icons-glyph": "^2.210.0",
         "classnames": "^2.5.1",
@@ -25,6 +25,6 @@
         "access": "public",
         "directory": "dist"
     },
-    "themesVersion": "14.0.0",
-    "varsVersion": "10.0.0"
+    "themesVersion": "14.1.0-snapshot-92b8690",
+    "varsVersion": "10.1.0-snapshot-92b8690"
 }

package/src/components/step/index.module.css

@@ -1,4 +1,4 @@
-@import '@alfalab/core-components-vars/src/index.css';
+@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';
 
 :root {
     --steps-option-svg-color: var(--color-light-status-positive);

package/src/components/step-indicator/index.module.css

@@ -1,4 +1,4 @@
-@import '@alfalab/core-components-vars/src/index.css';
+@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';
 
 .component.component {
     padding: var(--gap-0);

package/src/index.module.css

@@ -1,4 +1,4 @@
-@import '@alfalab/core-components-vars/src/index.css';
+@import '@alfalab/core-components-vars/src/no-dynamic-mixins-index.css';
 
 .component {
     display: flex;