scu-web-components 0.0.74 → 0.0.75

package/dist/docs/components/manifest.json

@@ -17,18 +17,18 @@
     "tagName": "scw-button",
     "category": "interactive"
   },
-  {
-    "name": "ScwCard",
-    "fileName": "ScwCard.json",
-    "tagName": "scw-card",
-    "category": "interactive"
-  },
   {
     "name": "ScwAlert",
     "fileName": "ScwAlert.json",
     "tagName": "scw-alert",
     "category": "interactive"
   },
+  {
+    "name": "ScwCard",
+    "fileName": "ScwCard.json",
+    "tagName": "scw-card",
+    "category": "interactive"
+  },
   {
     "name": "ScwCenterComponent",
     "fileName": "ScwCenterComponent.json",
@@ -113,18 +113,18 @@
     "tagName": "scw-layout-component",
     "category": "layouts"
   },
-  {
-    "name": "ScwMenu",
-    "fileName": "ScwMenu.json",
-    "tagName": "scw-menu",
-    "category": "interactive"
-  },
   {
     "name": "ScwLinkBase",
     "fileName": "ScwLinkBase.json",
     "tagName": "scw-link-base",
     "category": "interactive"
   },
+  {
+    "name": "ScwMenu",
+    "fileName": "ScwMenu.json",
+    "tagName": "scw-menu",
+    "category": "interactive"
+  },
   {
     "name": "ScwPageAlert",
     "fileName": "ScwPageAlert.json",
@@ -149,6 +149,12 @@
     "tagName": "scw-select",
     "category": "form"
   },
+  {
+    "name": "ScwSingleInput",
+    "fileName": "ScwSingleInput.json",
+    "tagName": "scw-single-input",
+    "category": "form"
+  },
   {
     "name": "ScwSingleInputLayout",
     "fileName": "ScwSingleInputLayout.json",
@@ -173,12 +179,6 @@
     "tagName": "scw-stepper",
     "category": "interactive"
   },
-  {
-    "name": "ScwSingleInput",
-    "fileName": "ScwSingleInput.json",
-    "tagName": "scw-single-input",
-    "category": "form"
-  },
   {
     "name": "ScwTest",
     "fileName": "ScwTest.json",
@@ -203,18 +203,18 @@
     "tagName": "scw-validation",
     "category": "form"
   },
-  {
-    "name": "ScwIcon",
-    "fileName": "ScwIcon.json",
-    "tagName": "scw-icon",
-    "category": "interactive"
-  },
   {
     "name": "ScwHeading",
     "fileName": "ScwHeading.json",
     "tagName": "scw-heading",
     "category": "interactive"
   },
+  {
+    "name": "ScwIcon",
+    "fileName": "ScwIcon.json",
+    "tagName": "scw-icon",
+    "category": "interactive"
+  },
   {
     "name": "ScwLink",
     "fileName": "ScwLink.json",

package/dist/docs/config.json

@@ -1,20 +1,20 @@
 {
   "title": "Summit Credit Union Web Design System (SCW)",
-  "version": "0.0.74",
+  "version": "0.0.75",
   "navigation": [
     {
       "id": "tokens",
       "title": "Component SASS",
-      "url": "../tokens/tokens.html?0.0.74"
+      "url": "../tokens/tokens.html?0.0.75"
     },
     {
       "id": "css",
       "title": "CSS",
-      "url": "../tokens/css.html?clipboardType=classes&0.0.74"
+      "url": "../tokens/css.html?clipboardType=classes&0.0.75"
     }
   ],
-  "moduleEmbed": "const scw = await import('../scw.js?1685981969738'); scw.defineComponents();",
-  "cssLink": "../scw.css?1685981969738",
+  "moduleEmbed": "const scw = await import('../scw.js?1686084808993'); scw.defineComponents();",
+  "cssLink": "../scw.css?1686084808993",
   "documents": [
     {
       "title": "Install",

package/dist/scw-components.js

@@ -1 +1 @@
-import{a as l}from"./chunks/chunk.EPY7GU3Z.js";import{a as u}from"./chunks/chunk.37WNLP33.js";import{a as S}from"./chunks/chunk.V3M2C74P.js";import{a as E}from"./chunks/chunk.UN2IDDPP.js";import{a}from"./chunks/chunk.UE6M5KO4.js";import{a as c}from"./chunks/chunk.NKX3QEFM.js";import{a as s}from"./chunks/chunk.FDITIBCN.js";import{a as n}from"./chunks/chunk.23XEXN7U.js";import{a as p}from"./chunks/chunk.WAC7UC5L.js";import"./chunks/chunk.J7MVPCLQ.js";import{a as f}from"./chunks/chunk.QF4C577S.js";import{a as w}from"./chunks/chunk.RVIZTHRG.js";import{a as d}from"./chunks/chunk.XWBEVA2H.js";import{a as i}from"./chunks/chunk.Z5WIO7ZE.js";import{a as o}from"./chunks/chunk.XDTBALK3.js";import"./chunks/chunk.HUTZFHRM.js";import"./chunks/chunk.Z6P446BB.js";import"./chunks/chunk.YBPGY7E7.js";import{a as t}from"./chunks/chunk.AUPS6LVZ.js";import{a as r}from"./chunks/chunk.6ODXCBTX.js";import"./chunks/chunk.4XDXIPYP.js";import"./chunks/chunk.ZZNNPPOA.js";import"./chunks/chunk.2AIO4VQU.js";import"./chunks/chunk.GJQNUSH4.js";import"./chunks/chunk.FNZZPMTC.js";import"./chunks/chunk.RBJQRJ4P.js";import"./chunks/chunk.URPWXPJO.js";import"./chunks/chunk.VIF6YT55.js";import"./chunks/chunk.TFHSDTGG.js";import"./chunks/chunk.FGCJFJBA.js";import{a as e}from"./chunks/chunk.CNHRIY7W.js";import"./chunks/chunk.XXXFJWSX.js";import"./chunks/chunk.QHUZYUAT.js";import"./chunks/chunk.DGDMEIOX.js";import"./chunks/chunk.I6WOAP7J.js";import"./chunks/chunk.LVI6GYGO.js";import"./chunks/chunk.EFINAF4P.js";import"./chunks/chunk.542LCHMN.js";import"./chunks/chunk.W4CRIA2R.js";import"./chunks/chunk.NBAHMDHF.js";import"./chunks/chunk.K5LAHA72.js";import"./chunks/chunk.XKUXW432.js";import"./chunks/chunk.UXNK7KZZ.js";import"./chunks/chunk.WKH73SBC.js";import{e as m}from"./chunks/chunk.Z3Y57KL7.js";import"./chunks/chunk.G2G2TPJK.js";import"./chunks/chunk.PE5ZEEQ2.js";customElements.define("scw-component",m);customElements.define("scw-card",e);customElements.define("scw-link",o);customElements.define("scw-button",i);customElements.define("scw-menu",r);customElements.define("scw-menu-item",c);customElements.define("scw-icon",s);customElements.define("scw-heading",n);customElements.define("scw-image",p);customElements.define("scw-link-base",t);customElements.define("scw-alert",f);customElements.define("scw-stepper",w);customElements.define("scw-rich-text",d);customElements.define("scw-slider",l);customElements.define("scw-slider-item",u);customElements.define("scw-block",S);customElements.define("scw-icon-feature",E);customElements.define("scw-accordion",a);
+import{a as l}from"./chunks/chunk.EPY7GU3Z.js";import{a as u}from"./chunks/chunk.37WNLP33.js";import{a as S}from"./chunks/chunk.V3M2C74P.js";import{a as E}from"./chunks/chunk.UN2IDDPP.js";import{a}from"./chunks/chunk.UE6M5KO4.js";import{a as c}from"./chunks/chunk.NKX3QEFM.js";import{a as s}from"./chunks/chunk.FDITIBCN.js";import{a as n}from"./chunks/chunk.23XEXN7U.js";import{a as p}from"./chunks/chunk.WAC7UC5L.js";import"./chunks/chunk.J7MVPCLQ.js";import{a as f}from"./chunks/chunk.QF4C577S.js";import{a as w}from"./chunks/chunk.RVIZTHRG.js";import{a as d}from"./chunks/chunk.KIJ5H2AV.js";import{a as i}from"./chunks/chunk.Z5WIO7ZE.js";import{a as o}from"./chunks/chunk.XDTBALK3.js";import"./chunks/chunk.HUTZFHRM.js";import"./chunks/chunk.Z6P446BB.js";import"./chunks/chunk.YBPGY7E7.js";import{a as t}from"./chunks/chunk.AUPS6LVZ.js";import{a as r}from"./chunks/chunk.6ODXCBTX.js";import"./chunks/chunk.RP34AXHG.js";import"./chunks/chunk.ZZNNPPOA.js";import"./chunks/chunk.2AIO4VQU.js";import"./chunks/chunk.GJQNUSH4.js";import"./chunks/chunk.FNZZPMTC.js";import"./chunks/chunk.RBJQRJ4P.js";import"./chunks/chunk.URPWXPJO.js";import"./chunks/chunk.VIF6YT55.js";import"./chunks/chunk.VT4PMRHO.js";import"./chunks/chunk.CZ5UYOQC.js";import{a as e}from"./chunks/chunk.CNHRIY7W.js";import"./chunks/chunk.XXXFJWSX.js";import"./chunks/chunk.QHUZYUAT.js";import"./chunks/chunk.DGDMEIOX.js";import"./chunks/chunk.P5ESZPS2.js";import"./chunks/chunk.AYSS3H27.js";import"./chunks/chunk.EFINAF4P.js";import"./chunks/chunk.Z5LFK5L4.js";import"./chunks/chunk.W4CRIA2R.js";import"./chunks/chunk.NBAHMDHF.js";import"./chunks/chunk.K5LAHA72.js";import"./chunks/chunk.XKUXW432.js";import"./chunks/chunk.UXNK7KZZ.js";import"./chunks/chunk.WKH73SBC.js";import{e as m}from"./chunks/chunk.Z3Y57KL7.js";import"./chunks/chunk.G2G2TPJK.js";import"./chunks/chunk.PE5ZEEQ2.js";customElements.define("scw-component",m);customElements.define("scw-card",e);customElements.define("scw-link",o);customElements.define("scw-button",i);customElements.define("scw-menu",r);customElements.define("scw-menu-item",c);customElements.define("scw-icon",s);customElements.define("scw-heading",n);customElements.define("scw-image",p);customElements.define("scw-link-base",t);customElements.define("scw-alert",f);customElements.define("scw-stepper",w);customElements.define("scw-rich-text",d);customElements.define("scw-slider",l);customElements.define("scw-slider-item",u);customElements.define("scw-block",S);customElements.define("scw-icon-feature",E);customElements.define("scw-accordion",a);

package/dist/scw.js

@@ -1 +1 @@
-import{a,b}from"./chunks/chunk.542LCHMN.js";import"./chunks/chunk.W4CRIA2R.js";import"./chunks/chunk.NBAHMDHF.js";import"./chunks/chunk.G2G2TPJK.js";import"./chunks/chunk.PE5ZEEQ2.js";export{a as config,b as defineComponents};
+import{a,b}from"./chunks/chunk.Z5LFK5L4.js";import"./chunks/chunk.W4CRIA2R.js";import"./chunks/chunk.NBAHMDHF.js";import"./chunks/chunk.G2G2TPJK.js";import"./chunks/chunk.PE5ZEEQ2.js";export{a as config,b as defineComponents};

package/dist/tokens/segments/comp-scw-stepper/_default-scw-stepper-item-02-mixins.scss

@@ -0,0 +1,57 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(255,255,255,1) );
+  } @else {
+    background-color: rgba(255,255,255,1);
+  } 
+}
+
+@mixin sizing {
+  width: 10px;
+  height: 10px;
+}
+
+@mixin width {
+  width: 10px;
+}
+
+@mixin height {
+  height: 10px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+   
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 4.8 );
+  margin-right: calc( var( --scw-spacing-1 ) * 9.6 );
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 4.8 );
+  padding-right: calc( var( --scw-spacing-1 ) * 9.6 );
+  padding-top: 0px;
+  padding-bottom: 0px;
+}

package/dist/tokens/segments/comp-scw-stepper/_default-scw-stepper-item-02-vars.scss

@@ -0,0 +1,27 @@
+
+
+$background-color: rgba(255,255,255,1);
+$blend-mode: NORMAL;
+$width: 10px;
+$height: 10px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: NONE;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: INHERIT;
+$layout-grow: 0;
+$top: 0px;
+$top-percent: 50%;
+$bottom: 0px;
+$left: calc( var( --scw-spacing-1 ) * 4.8 );
+$left-percent: 34.42%;
+$right: calc( var( --scw-spacing-1 ) * 9.6 );
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;
+$margin-right: 0px;

package/dist/tokens/segments/comp-scw-stepper/_default-scw-stepper-item-03-mixins.scss

@@ -0,0 +1,57 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(255,255,255,1) );
+  } @else {
+    background-color: rgba(255,255,255,1);
+  } 
+}
+
+@mixin sizing {
+  width: 10px;
+  height: 10px;
+}
+
+@mixin width {
+  width: 10px;
+}
+
+@mixin height {
+  height: 10px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+   
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 9.6 );
+  margin-right: calc( var( --scw-spacing-1 ) * 4.8 );
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 9.6 );
+  padding-right: calc( var( --scw-spacing-1 ) * 4.8 );
+  padding-top: 0px;
+  padding-bottom: 0px;
+}

package/dist/tokens/segments/comp-scw-stepper/_default-scw-stepper-item-03-vars.scss

@@ -0,0 +1,27 @@
+
+
+$background-color: rgba(255,255,255,1);
+$blend-mode: NORMAL;
+$width: 10px;
+$height: 10px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: NONE;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: INHERIT;
+$layout-grow: 0;
+$top: 0px;
+$top-percent: 50%;
+$bottom: 0px;
+$left: calc( var( --scw-spacing-1 ) * 9.6 );
+$left-percent: 65.58%;
+$right: calc( var( --scw-spacing-1 ) * 4.8 );
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;
+$margin-right: 0px;

package/dist/tokens/segments/comp-scw-stepper/_default-scw-stepper-item-04-mixins.scss

@@ -0,0 +1,57 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(255,255,255,1) );
+  } @else {
+    background-color: rgba(255,255,255,1);
+  } 
+}
+
+@mixin sizing {
+  width: 10px;
+  height: 10px;
+}
+
+@mixin width {
+  width: 10px;
+}
+
+@mixin height {
+  height: 10px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+   
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 14.4 );
+  margin-right: 0px;
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 14.4 );
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}

package/dist/tokens/segments/comp-scw-stepper/_default-scw-stepper-item-04-vars.scss

@@ -0,0 +1,26 @@
+
+
+$background-color: rgba(255,255,255,1);
+$blend-mode: NORMAL;
+$width: 10px;
+$height: 10px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: NONE;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: INHERIT;
+$layout-grow: 0;
+$top: 0px;
+$top-percent: 50%;
+$bottom: 0px;
+$left: calc( var( --scw-spacing-1 ) * 14.4 );
+$left-percent: 96.75%;
+$right: 0px;
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;

package/dist/tokens/segments/comp-scw-stepper/_focused-page-2-scw-stepper-item-01-circle-mixins.scss

@@ -0,0 +1,62 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-092 , var( --scw-color-grey-092 ) );
+  } @else {
+    background-color: var( --scw-color-grey-092 );
+  }
+  border-radius: 50% 50% 50% 50%; 
+}
+
+@mixin sizing {
+  width: 10px;
+  height: 10px;
+}
+
+@mixin width {
+  width: 10px;
+}
+
+@mixin height {
+  height: 10px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+   
+}
+
+@mixin absolute-layout {
+  position: absolute;
+  left: 0px;
+  right: 0px;
+  top: 0px;
+  bottom: 0px; 
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}

package/dist/tokens/segments/comp-scw-stepper/_focused-page-2-scw-stepper-item-01-circle-vars.scss

@@ -0,0 +1,30 @@
+
+
+$background-color: var( --scw-color-grey-092 );
+$blend-mode: NORMAL;
+$corner-radius-top-left: 50%;
+$corner-radius-top-right: 50%;
+$corner-radius-bottom-right: 50%;
+$corner-radius-bottom-left: 50%;
+$width: 10px;
+$height: 10px;
+$constraint-horizontal: STRETCH;
+$constraint-vertical: STRETCH;
+$constrain-proportions: false;
+$layout-context: ABSOLUTE;
+$layout-mode: NONE;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: MIN;
+$layout-grow: 0;
+$top: 0px;
+$top-percent: 50%;
+$bottom: 0px;
+$left: 0px;
+$left-percent: 50%;
+$right: 0px;
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;

package/dist/tokens/segments/comp-scw-stepper/_focused-page-2-scw-stepper-item-02-circle-mixins.scss

@@ -0,0 +1,62 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-07 , var( --scw-color-grey-07 ) );
+  } @else {
+    background-color: var( --scw-color-grey-07 );
+  }
+  border-radius: 50% 50% 50% 50%; 
+}
+
+@mixin sizing {
+  width: 10px;
+  height: 10px;
+}
+
+@mixin width {
+  width: 10px;
+}
+
+@mixin height {
+  height: 10px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+   
+}
+
+@mixin absolute-layout {
+  position: absolute;
+  left: 0px;
+  right: 0px;
+  top: 0px;
+  bottom: 0px; 
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}

package/dist/tokens/segments/comp-scw-stepper/_focused-page-2-scw-stepper-item-02-circle-vars.scss

@@ -0,0 +1,30 @@
+
+
+$background-color: var( --scw-color-grey-07 );
+$blend-mode: NORMAL;
+$corner-radius-top-left: 50%;
+$corner-radius-top-right: 50%;
+$corner-radius-bottom-right: 50%;
+$corner-radius-bottom-left: 50%;
+$width: 10px;
+$height: 10px;
+$constraint-horizontal: STRETCH;
+$constraint-vertical: STRETCH;
+$constrain-proportions: false;
+$layout-context: ABSOLUTE;
+$layout-mode: NONE;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: MIN;
+$layout-grow: 0;
+$top: 0px;
+$top-percent: 50%;
+$bottom: 0px;
+$left: 0px;
+$left-percent: 50%;
+$right: 0px;
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;

package/dist/tokens/segments/comp-scw-stepper/_focused-page-2-scw-stepper-item-02-mixins.scss

@@ -0,0 +1,57 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(255,255,255,1) );
+  } @else {
+    background-color: rgba(255,255,255,1);
+  } 
+}
+
+@mixin sizing {
+  width: 10px;
+  height: 10px;
+}
+
+@mixin width {
+  width: 10px;
+}
+
+@mixin height {
+  height: 10px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+   
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 4.8 );
+  margin-right: calc( var( --scw-spacing-1 ) * 9.6 );
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 4.8 );
+  padding-right: calc( var( --scw-spacing-1 ) * 9.6 );
+  padding-top: 0px;
+  padding-bottom: 0px;
+}

package/dist/tokens/segments/comp-scw-stepper/_focused-page-2-scw-stepper-item-02-vars.scss

@@ -0,0 +1,27 @@
+
+
+$background-color: rgba(255,255,255,1);
+$blend-mode: NORMAL;
+$width: 10px;
+$height: 10px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: NONE;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: INHERIT;
+$layout-grow: 0;
+$top: 0px;
+$top-percent: 50%;
+$bottom: 0px;
+$left: calc( var( --scw-spacing-1 ) * 4.8 );
+$left-percent: 34.42%;
+$right: calc( var( --scw-spacing-1 ) * 9.6 );
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;
+$margin-right: 0px;