scu-web-components 0.0.25 → 0.0.26

package/dist/tokens/source/jsCssGeneratorSansAssets.js

@@ -1,4 +1,4 @@
-export default class JsCssGenerator{constructor(e){this.tokens={"COLORS|color":{primary:{"01":["rgba(28,74,5,1)"],"02":["rgba(41,95,14,1)"],"03":["rgba(52,110,6,1)"],"04":["rgba(63,121,15,1)"],"05":["rgba(75,132,29,1)"],"":["rgba(75,132,29,1)"],"06":["rgba(99,166,10,1)"],"07":["rgba(158,201,101,1)"],"08":["rgba(200,230,160,1)"],"09":["rgba(232,247,212,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(246,255,237,1)"]},grey:{10:["rgba(255,255,255,1)"],"00":["rgba(0,0,0,1)"],"01":["rgba(29,30,32,1)"],"02":["rgba(62,65,67,1)"],"03":["rgba(87,90,93,1)"],"04":["rgba(114,118,122,1)"],"05":["rgba(134,137,140,1)"],"":["rgba(134,137,140,1)"],"06":["rgba(154,158,160,1)"],"07":["rgba(177,180,183,1)"],"08":["rgba(194,197,200,1)"],"09":["rgba(218,220,223,1)"],"092":["rgba(235,238,240,1)"],"095":["rgba(246,247,249,1)"]},error:{"":["rgba(228,109,114,1)"],light:["rgba(249,230,230,1)"],dark:["rgba(158,0,0,1)"]},warning:{"":["rgba(255,134,66,1)"],light:["rgba(255,214,191,1)"],dark:["rgba(128,46,0,1)"]},success:{"":["rgba(123,209,8,1)"],light:["rgba(213,233,187,1)"],dark:["rgba(72,121,6,1)"]},information:{"":["rgba(252,231,40,1)"],light:["rgba(255,250,208,1)"],dark:["rgba(170,153,0,1)"]},icon:{"":["rgba(1,1,1,1)"]},secondary:{"":["rgba(87,90,93,1)"]},mortgage:{"01":["rgba(74,2,57,1)"],"02":["rgba(92,1,75,1)"],"03":["rgba(107,4,83,1)"],"04":["rgba(136,6,105,1)"],"05":["rgba(162,0,125,1)"],"":["rgba(162,0,125,1)"],"06":["rgba(193,64,164,1)"],"07":["rgba(214,121,192,1)"],"08":["rgba(235,169,220,1)"],"09":["rgba(247,220,242,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(253,240,250,1)"]},investments:{"01":["rgba(15,14,88,1)"],"02":["rgba(37,37,124,1)"],"03":["rgba(52,52,145,1)"],"04":["rgba(65,64,157,1)"],"05":["rgba(85,84,177,1)"],"":["rgba(85,84,177,1)"],"06":["rgba(117,116,195,1)"],"07":["rgba(160,159,219,1)"],"08":["rgba(200,199,237,1)"],"09":["rgba(227,226,248,1)"],"092":["rgba(232,231,249,1)"],"095":["rgba(244,244,255,1)"]},"credit-cards":{"01":["rgba(1,51,77,1)"],"02":["rgba(1,70,106,1)"],"03":["rgba(1,88,132,1)"],"04":["rgba(1,104,157,1)"],"05":["rgba(0,122,185,1)"],"":["rgba(0,122,185,1)"],"06":["rgba(46,147,199,1)"],"07":["rgba(94,173,213,1)"],"08":["rgba(140,197,227,1)"],"09":["rgba(189,224,242,1)"],"092":["rgba(227,241,249,1)"],"095":["rgba(236,249,255,1)"]},student:{"01":["rgba(1,56,49,1)"],"02":["rgba(0,75,67,1)"],"03":["rgba(0,94,83,1)"],"04":["rgba(0,113,100,1)"],"05":["rgba(0,131,116,1)"],"":["rgba(0,131,116,1)"],"06":["rgba(46,156,143,1)"],"07":["rgba(105,185,176,1)"],"08":["rgba(157,217,211,1)"],"09":["rgba(209,240,237,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(237,253,252,1)"]},savings:{"01":["rgba(119,33,0,1)"],"02":["rgba(149,41,0,1)"],"03":["rgba(163,46,2,1)"],"04":["rgba(178,51,3,1)"],"05":["rgba(195,75,0,1)"],"":["rgba(195,75,0,1)"],"06":["rgba(230,118,47,1)"],"07":["rgba(242,165,109,1)"],"08":["rgba(250,209,167,1)"],"09":["rgba(255,235,211,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(253,247,239,1)"]},checking:{"01":["rgba(49,6,67,1)"],"02":["rgba(64,21,83,1)"],"03":["rgba(92,40,114,1)"],"04":["rgba(119,57,145,1)"],"05":["rgba(148,77,178,1)"],"":["rgba(148,77,178,1)"],"06":["rgba(168,108,193,1)"],"07":["rgba(198,151,217,1)"],"08":["rgba(218,187,232,1)"],"09":["rgba(233,213,240,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(249,237,252,1)"]},"red-shoes":{"01":["rgba(90,7,9,1)"],"02":["rgba(117,15,18,1)"],"03":["rgba(143,23,27,1)"],"04":["rgba(171,31,36,1)"],"05":["rgba(201,40,45,1)"],"":["rgba(201,40,45,1)"],"06":["rgba(214,80,84,1)"],"07":["rgba(226,119,121,1)"],"08":["rgba(240,162,164,1)"],"09":["rgba(255,219,220,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(255,240,241,1)"]},business:{"01":["rgba(83,72,1,1)"],"02":["rgba(111,96,1,1)"],"03":["rgba(141,122,1,1)"],"04":["rgba(168,145,1,1)"],"05":["rgba(199,172,0,1)"],"":["rgba(199,172,0,1)"],"06":["rgba(212,190,46,1)"],"07":["rgba(227,209,98,1)"],"08":["rgba(241,229,149,1)"],"09":["rgba(255,247,197,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(255,251,224,1)"]},personal:{"01":["rgba(1,40,60,1)"],"02":["rgba(1,59,90,1)"],"03":["rgba(1,80,121,1)"],"04":["rgba(1,99,150,1)"],"05":["rgba(0,122,185,1)"],"":["rgba(0,122,185,1)"],"06":["rgba(48,149,202,1)"],"07":["rgba(100,179,220,1)"],"08":["rgba(154,210,238,1)"],"09":["rgba(202,237,255,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(226,245,255,1)"]},heloc:{"01":["rgba(41,17,75,1)"],"02":["rgba(56,28,92,1)"],"03":["rgba(76,44,118,1)"],"04":["rgba(101,63,149,1)"],"05":["rgba(128,91,177,1)"],"":["rgba(128,91,177,1)"],"06":["rgba(159,126,201,1)"],"07":["rgba(189,164,221,1)"],"08":["rgba(207,191,229,1)"],"09":["rgba(229,219,244,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(243,239,252,1)"]}},"TYPOGRAPHY|type":{text:{10:["2.5rem","'Proxima Nova'","400","2.93rem","0rem","none"],"09":["1.875rem","'Proxima Nova'","400","2.197rem","0rem","none"],"08":["1.5rem","'Proxima Nova'","400","1.758rem","0rem","none"],"07":["1.25rem","'Proxima Nova'","400","1.465rem","0rem","none"],"06":["1.125rem","'Proxima Nova'","400","1.318rem","0rem","none"],"05":["1rem","'Proxima Nova'","400","1.172rem","0rem","none"],"":["1rem","'Proxima Nova'","400","1.172rem","0rem","none"],"04":["0.875rem","'Proxima Nova'","400","1.025rem","0rem","none"],"03":["0.75rem","'Proxima Nova'","400","0.879rem","0rem","none"],"02":["0.6875rem","'Proxima Nova'","400","0.806rem","0rem","none"],"01":["0.5625rem","'Proxima Nova'","400","0.659rem","0rem","none"]},"text-bold-condensed":{10:["2.5rem","'Proxima Nova Condensed'","700","2.93rem","0rem","none"],"09":["1.875rem","'Proxima Nova Condensed'","700","2.197rem","0rem","none"],"08":["1.5rem","'Proxima Nova Condensed'","700","1.758rem","0rem","none"],"07":["1.25rem","'Proxima Nova Condensed'","700","1.465rem","0rem","none"],"06":["1.125rem","'Proxima Nova Condensed'","700","1.318rem","0rem","none"],"05":["1rem","'Proxima Nova Condensed'","700","1.172rem","0rem","none"],"":["1rem","'Proxima Nova Condensed'","700","1.172rem","0rem","none"],"04":["0.875rem","'Proxima Nova Condensed'","700","1.025rem","0rem","none"],"03":["0.75rem","'Proxima Nova Condensed'","700","0.879rem","0rem","none"],"02":["0.6875rem","'Proxima Nova Condensed'","700","0.806rem","0rem","none"],"01":["0.5625rem","'Proxima Nova Condensed'","700","0.659rem","0rem","none"]},"text-bold":{10:["2.5rem","'Proxima Nova'","700","2.93rem","0rem","none"],"09":["1.875rem","'Proxima Nova'","700","2.197rem","0rem","none"],"08":["1.5rem","'Proxima Nova'","700","1.758rem","0rem","none"],"07":["1.25rem","'Proxima Nova'","700","1.465rem","0rem","none"],"06":["1.125rem","'Proxima Nova'","700","1.318rem","0rem","none"],"05":["1rem","'Proxima Nova'","700","1.172rem","0rem","none"],"":["1rem","'Proxima Nova'","700","1.172rem","0rem","none"],"04":["0.875rem","'Proxima Nova'","700","1.025rem","0rem","none"],"03":["0.75rem","'Proxima Nova'","700","0.879rem","0rem","none"],"02":["0.6875rem","'Proxima Nova'","700","0.806rem","0rem","none"],"01":["0.5625rem","'Proxima Nova'","700","0.659rem","0rem","none"]}},"EFFECTS|effect":{shadow:{"":["0px 0px 8px 0px rgba(0,0,0,0.27)"]},focus:{"":["0px 0px 0px 2px rgba(53,155,249,1)"]}},"ICONS|icon":{placeholder:{svg:[""]},clear:{svg:[""]},location:{svg:[""]},checkbox:{svg:[""]},radio:{svg:[""]},"checkbox-selected":{svg:[""]},"radio-selected":{svg:[""]},search:{svg:[""]},"checkbox-hover":{svg:[""]},"radio-hover":{svg:[""]},"checkbox-selected-hover":{svg:[""]},"radio-selected-hover":{svg:[""]},visible:{svg:[""]},hidden:{svg:[""]},"checkbox-disabled":{svg:[""]},"radio-disabled":{svg:[""]},"checkbox-selected-disabled":{svg:[""]},"radio-selected-disabled":{svg:[""]},"chevron-up":{svg:[""]},"chevron-down":{svg:[""]},"chevron-left":{svg:[""]},"chevron-right":{svg:[""]},"color-test":{svg:[""]}},"GRAPHICS|graphic":{},"LAYOUTS|":{spacing:{1:["0.625rem"]},col:{1:["8.3333%"]},colvw:{1:["8.3333vw"]}},"FONTS|font":{"proxima_nova condensed-700-normal":{"":["Proxima Nova Condensed","font-proxima_nova condensed-700-normal.otf","700","normal"]},"proxima_nova-700-normal":{"":["Proxima Nova","font-proxima_nova-700-normal.otf","700","normal"]},"proxima_nova-300-normal":{"":["Proxima Nova","font-proxima_nova-300-normal.otf","300","normal"]}},"BREAKPOINTS|breakpoint":{}},this.prefix="scw",this.uuid="004170dd-edc1-44df-9226-0cb36e53c34a",this.initialized=!1,this.lookup,this.css_classes_root="",this.css_comp_suffix="",this.units=[0,1,2,3,4,5,6,7,8,9,10,11,12],this.subUnits=[0,3,4,6,8,9],this.subUnitAttachments=[0,1,2,3],this.config=e||{},this.version=this.config.version||!1,this.extraCssPromise=this.config.extraCssPromise||!1,this.assetsUrl=this.config.assetsUrl||!1,this.attributes=this.config.attributes||!0,this.classes=this.config.classes||!0,this.variablesOnly=this.config.variablesOnly||!1}async buildCss(){this.version&&(this.css_comp_suffix="-"+this.version),this.lookup={};let t=`/*
+export default class JsCssGenerator{constructor(e){this.tokens={"COLORS|color":{primary:{"01":["rgba(28,74,5,1)"],"02":["rgba(41,95,14,1)"],"03":["rgba(52,110,6,1)"],"04":["rgba(63,121,15,1)"],"05":["rgba(75,132,29,1)"],"":["rgba(75,132,29,1)"],"06":["rgba(99,166,10,1)"],"07":["rgba(158,201,101,1)"],"08":["rgba(200,230,160,1)"],"09":["rgba(232,247,212,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(246,255,237,1)"]},grey:{10:["rgba(255,255,255,1)"],"00":["rgba(0,0,0,1)"],"01":["rgba(29,30,32,1)"],"02":["rgba(62,65,67,1)"],"03":["rgba(87,90,93,1)"],"04":["rgba(114,118,122,1)"],"05":["rgba(134,137,140,1)"],"":["rgba(134,137,140,1)"],"06":["rgba(154,158,160,1)"],"07":["rgba(177,180,183,1)"],"08":["rgba(194,197,200,1)"],"09":["rgba(218,220,223,1)"],"092":["rgba(235,238,240,1)"],"095":["rgba(246,247,249,1)"]},error:{"":["rgba(228,109,114,1)"],light:["rgba(249,230,230,1)"],dark:["rgba(158,0,0,1)"]},warning:{"":["rgba(255,134,66,1)"],light:["rgba(255,214,191,1)"],dark:["rgba(128,46,0,1)"]},success:{"":["rgba(123,209,8,1)"],light:["rgba(213,233,187,1)"],dark:["rgba(72,121,6,1)"]},information:{"":["rgba(252,231,40,1)"],light:["rgba(255,250,208,1)"],dark:["rgba(170,153,0,1)"]},icon:{"":["rgba(1,1,1,1)"]},secondary:{"":["rgba(87,90,93,1)"]},mortgage:{"01":["rgba(74,2,57,1)"],"02":["rgba(92,1,75,1)"],"03":["rgba(107,4,83,1)"],"04":["rgba(136,6,105,1)"],"05":["rgba(162,0,125,1)"],"":["rgba(162,0,125,1)"],"06":["rgba(193,64,164,1)"],"07":["rgba(214,121,192,1)"],"08":["rgba(235,169,220,1)"],"09":["rgba(247,220,242,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(253,240,250,1)"]},investments:{"01":["rgba(15,14,88,1)"],"02":["rgba(37,37,124,1)"],"03":["rgba(52,52,145,1)"],"04":["rgba(65,64,157,1)"],"05":["rgba(85,84,177,1)"],"":["rgba(85,84,177,1)"],"06":["rgba(117,116,195,1)"],"07":["rgba(160,159,219,1)"],"08":["rgba(200,199,237,1)"],"09":["rgba(227,226,248,1)"],"092":["rgba(232,231,249,1)"],"095":["rgba(244,244,255,1)"]},"credit-cards":{"01":["rgba(1,51,77,1)"],"02":["rgba(1,70,106,1)"],"03":["rgba(1,88,132,1)"],"04":["rgba(1,104,157,1)"],"05":["rgba(0,122,185,1)"],"":["rgba(0,122,185,1)"],"06":["rgba(46,147,199,1)"],"07":["rgba(94,173,213,1)"],"08":["rgba(140,197,227,1)"],"09":["rgba(189,224,242,1)"],"092":["rgba(227,241,249,1)"],"095":["rgba(236,249,255,1)"]},student:{"01":["rgba(1,56,49,1)"],"02":["rgba(0,75,67,1)"],"03":["rgba(0,94,83,1)"],"04":["rgba(0,113,100,1)"],"05":["rgba(0,131,116,1)"],"":["rgba(0,131,116,1)"],"06":["rgba(46,156,143,1)"],"07":["rgba(105,185,176,1)"],"08":["rgba(157,217,211,1)"],"09":["rgba(209,240,237,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(237,253,252,1)"]},savings:{"01":["rgba(119,33,0,1)"],"02":["rgba(149,41,0,1)"],"03":["rgba(163,46,2,1)"],"04":["rgba(178,51,3,1)"],"05":["rgba(195,75,0,1)"],"":["rgba(195,75,0,1)"],"06":["rgba(230,118,47,1)"],"07":["rgba(242,165,109,1)"],"08":["rgba(250,209,167,1)"],"09":["rgba(255,235,211,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(253,247,239,1)"]},checking:{"01":["rgba(49,6,67,1)"],"02":["rgba(64,21,83,1)"],"03":["rgba(92,40,114,1)"],"04":["rgba(119,57,145,1)"],"05":["rgba(148,77,178,1)"],"":["rgba(148,77,178,1)"],"06":["rgba(168,108,193,1)"],"07":["rgba(198,151,217,1)"],"08":["rgba(218,187,232,1)"],"09":["rgba(233,213,240,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(249,237,252,1)"]},"red-shoes":{"01":["rgba(90,7,9,1)"],"02":["rgba(117,15,18,1)"],"03":["rgba(143,23,27,1)"],"04":["rgba(171,31,36,1)"],"05":["rgba(201,40,45,1)"],"":["rgba(201,40,45,1)"],"06":["rgba(214,80,84,1)"],"07":["rgba(226,119,121,1)"],"08":["rgba(240,162,164,1)"],"09":["rgba(255,219,220,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(255,240,241,1)"]},business:{"01":["rgba(83,72,1,1)"],"02":["rgba(111,96,1,1)"],"03":["rgba(141,122,1,1)"],"04":["rgba(168,145,1,1)"],"05":["rgba(199,172,0,1)"],"":["rgba(199,172,0,1)"],"06":["rgba(212,190,46,1)"],"07":["rgba(227,209,98,1)"],"08":["rgba(241,229,149,1)"],"09":["rgba(255,247,197,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(255,251,224,1)"]},personal:{"01":["rgba(1,40,60,1)"],"02":["rgba(1,59,90,1)"],"03":["rgba(1,80,121,1)"],"04":["rgba(1,99,150,1)"],"05":["rgba(0,122,185,1)"],"":["rgba(0,122,185,1)"],"06":["rgba(48,149,202,1)"],"07":["rgba(100,179,220,1)"],"08":["rgba(154,210,238,1)"],"09":["rgba(202,237,255,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(226,245,255,1)"]},heloc:{"01":["rgba(41,17,75,1)"],"02":["rgba(56,28,92,1)"],"03":["rgba(76,44,118,1)"],"04":["rgba(101,63,149,1)"],"05":["rgba(128,91,177,1)"],"":["rgba(128,91,177,1)"],"06":["rgba(159,126,201,1)"],"07":["rgba(189,164,221,1)"],"08":["rgba(207,191,229,1)"],"09":["rgba(229,219,244,1)"],"092":["rgba(204,218,222,1)"],"095":["rgba(243,239,252,1)"]}},"TYPOGRAPHY|type":{text:{10:["2.5rem","'Proxima Nova'","400","2.93rem","0rem","none"],"09":["1.875rem","'Proxima Nova'","400","2.197rem","0rem","none"],"08":["1.5rem","'Proxima Nova'","400","1.758rem","0rem","none"],"07":["1.25rem","'Proxima Nova'","400","1.465rem","0rem","none"],"06":["1.125rem","'Proxima Nova'","400","1.318rem","0rem","none"],"05":["1rem","'Proxima Nova'","400","1.172rem","0rem","none"],"":["1rem","'Proxima Nova'","400","1.172rem","0rem","none"],"04":["0.875rem","'Proxima Nova'","400","1.025rem","0rem","none"],"03":["0.75rem","'Proxima Nova'","400","0.879rem","0rem","none"],"02":["0.6875rem","'Proxima Nova'","400","0.806rem","0rem","none"],"01":["0.5625rem","'Proxima Nova'","400","0.659rem","0rem","none"]},"text-bold-condensed":{10:["2.5rem","'Proxima Nova Condensed'","700","2.93rem","0rem","none"],"09":["1.875rem","'Proxima Nova Condensed'","700","2.197rem","0rem","none"],"08":["1.5rem","'Proxima Nova Condensed'","700","1.758rem","0rem","none"],"07":["1.25rem","'Proxima Nova Condensed'","700","1.465rem","0rem","none"],"06":["1.125rem","'Proxima Nova Condensed'","700","1.318rem","0rem","none"],"05":["1rem","'Proxima Nova Condensed'","700","1.172rem","0rem","none"],"":["1rem","'Proxima Nova Condensed'","700","1.172rem","0rem","none"],"04":["0.875rem","'Proxima Nova Condensed'","700","1.025rem","0rem","none"],"03":["0.75rem","'Proxima Nova Condensed'","700","0.879rem","0rem","none"],"02":["0.6875rem","'Proxima Nova Condensed'","700","0.806rem","0rem","none"],"01":["0.5625rem","'Proxima Nova Condensed'","700","0.659rem","0rem","none"]},"text-bold":{10:["2.5rem","'Proxima Nova'","700","2.93rem","0rem","none"],"09":["1.875rem","'Proxima Nova'","700","2.197rem","0rem","none"],"08":["1.5rem","'Proxima Nova'","700","1.758rem","0rem","none"],"07":["1.25rem","'Proxima Nova'","700","1.465rem","0rem","none"],"06":["1.125rem","'Proxima Nova'","700","1.318rem","0rem","none"],"05":["1rem","'Proxima Nova'","700","1.172rem","0rem","none"],"":["1rem","'Proxima Nova'","700","1.172rem","0rem","none"],"04":["0.875rem","'Proxima Nova'","700","1.025rem","0rem","none"],"03":["0.75rem","'Proxima Nova'","700","0.879rem","0rem","none"],"02":["0.6875rem","'Proxima Nova'","700","0.806rem","0rem","none"],"01":["0.5625rem","'Proxima Nova'","700","0.659rem","0rem","none"]}},"EFFECTS|effect":{shadow:{"":["0px 0px 8px 0px rgba(0,0,0,0.27)"]},focus:{"":["0px 0px 0px 2px rgba(53,155,249,1)"]}},"ICONS|icon":{placeholder:{svg:[""]},clear:{svg:[""]},location:{svg:[""]},checkbox:{svg:[""]},radio:{svg:[""]},"checkbox-selected":{svg:[""]},"radio-selected":{svg:[""]},search:{svg:[""]},"checkbox-hover":{svg:[""]},"radio-hover":{svg:[""]},"checkbox-selected-hover":{svg:[""]},"radio-selected-hover":{svg:[""]},visible:{svg:[""]},hidden:{svg:[""]},"checkbox-disabled":{svg:[""]},"radio-disabled":{svg:[""]},"checkbox-selected-disabled":{svg:[""]},"radio-selected-disabled":{svg:[""]},"chevron-up":{svg:[""]},"chevron-down":{svg:[""]},"chevron-left":{svg:[""]},"chevron-right":{svg:[""]},"color-test":{svg:[""]}},"GRAPHICS|graphic":{},"LAYOUTS|":{spacing:{1:["0.625rem"]},col:{1:["8.3333%"]},colvw:{1:["8.3333vw"]}},"FONTS|font":{"proxima_nova condensed-700-normal":{"":["Proxima Nova Condensed","font-proxima_nova condensed-700-normal.otf","700","normal"]},"proxima_nova-700-normal":{"":["Proxima Nova","font-proxima_nova-700-normal.otf","700","normal"]},"proxima_nova-300-normal":{"":["Proxima Nova","font-proxima_nova-300-normal.otf","300","normal"]}},"BREAKPOINTS|breakpoint":{}},this.prefix="scw",this.uuid="1c7e032b-b4a6-4456-a078-ef9976b3d778",this.initialized=!1,this.lookup,this.css_classes_root="",this.css_comp_suffix="",this.units=[0,1,2,3,4,5,6,7,8,9,10,11,12],this.subUnits=[0,3,4,6,8,9],this.subUnitAttachments=[0,1,2,3],this.config=e||{},this.version=this.config.version||!1,this.extraCssPromise=this.config.extraCssPromise||!1,this.assetsUrl=this.config.assetsUrl||!1,this.attributes=this.config.attributes||!0,this.classes=this.config.classes||!0,this.variablesOnly=this.config.variablesOnly||!1}async buildCss(){this.version&&(this.css_comp_suffix="-"+this.version),this.lookup={};let t=`/*
 `,e="";return t=(t=(t=(t=(t=(t+=`* CREATED: ${new Date}
 `)+`* VERSION: ${this.version}
 `)+`* UUID: ${this.uuid}

package/dist/utils/suffix.js

@@ -1,2 +1,2 @@
-import{a}from"../chunks/chunk.NAXVDSZN.js";import"../chunks/chunk.ASPERYN6.js";import"../chunks/chunk.5HZ4WTGH.js";import"../chunks/chunk.ZS4C3T6Z.js";import"../chunks/chunk.5YJY6NT6.js";export{a as default};
+import{a}from"../chunks/chunk.5VL7CZDE.js";import"../chunks/chunk.EUOMSMKB.js";import"../chunks/chunk.5HZ4WTGH.js";import"../chunks/chunk.ZS4C3T6Z.js";import"../chunks/chunk.5YJY6NT6.js";export{a as default};
 //# sourceMappingURL=suffix.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "scu-web-components",
-  "version": "0.0.25",
+  "version": "0.0.26",
   "description": "Summit Credit Union Design System components for use on member facing apps and websites",
   "author": "srouse",
   "license": "MIT",
@@ -10,7 +10,8 @@
   },
   "files": [
     "dist",
-    "src/utils/responsive/breakpoints.mjs"
+    "src/utils/responsive/breakpoints.mjs",
+    "scripts"
   ],
   "module": "dist/index.js",
   "type": "module",
@@ -33,10 +34,12 @@
   },
   "dependencies": {
     "@custom-elements-manifest/analyzer": "^0.5.7",
+    "@lit-labs/ssr": "^2.1.0",
     "@open-wc/testing": "^2.5.33",
     "@web/dev-server-esbuild": "^0.2.12",
     "@web/test-runner": "^0.13.15",
     "@web/test-runner-commands": "^0.5.8",
+    "@webcomponents/template-shadowroot": "^0.1.0",
     "browser-sync": "^2.27.5",
     "chalk": "^4.1.2",
     "command-line-args": "^5.2.0",
@@ -45,12 +48,16 @@
     "esbuild-sass-plugin": "^1.4.11",
     "fs-extra": "^10.0.0",
     "get-port": "^5.1.1",
+    "glob": "^8.0.1",
     "glob-promise": "^4.2.0",
+    "gzipme": "^1.0.0",
     "lit": "^2.2.0",
+    "readable-stream": "^3.6.0",
     "rgb-hex": "^4.0.0",
     "scu-tokenizer": "0.7.16",
     "sinon": "^11.1.2",
-    "static-params": "^0.2.1"
+    "static-params": "^0.2.1",
+    "yargs": "^17.4.1"
   },
   "devDependencies": {
     "@typescript-eslint/eslint-plugin": "^4.29.1",

package/scripts/lib/readStream.mjs

@@ -0,0 +1,17 @@
+/**
+ * readStream
+ * @param {_Readable<string>} stream
+ * @param {string} encoding
+ * @return {object}
+ */
+export const readStream = (stream, encoding = 'utf8') => {
+  stream.setEncoding(encoding);
+  return new Promise((resolve, reject) => {
+    let data = '';
+    stream.on('data', (chunk) => {
+      data += chunk;
+    });
+    stream.on('end', () => resolve(data));
+    stream.on('error', (error) => reject(error));
+  });
+};

package/scripts/ssr.mjs

@@ -0,0 +1,66 @@
+import {render} from '@lit-labs/ssr/lib/render-with-global-dom-shim.js';
+import {html} from 'lit';
+import {unsafeHTML} from 'lit/directives/unsafe-html.js';
+import {Readable} from 'readable-stream';
+import {readStream} from './lib/readStream.mjs';
+import fs from 'fs-extra';
+import {readFile, writeFile} from 'fs/promises';
+import glob from 'glob';
+import '../dist/scw-components.js';// include all comps
+
+/**
+ * ssr
+ * !!!!!!!CAUSES ERROR WHEN USED VIA CLI, USE VM!!!!!!!!!!
+ * @param {string} htmlContent
+ * @return {string}
+ */
+export async function ssr(htmlContent) {
+  return readStream(
+    Readable.from(
+      render(
+        html`${unsafeHTML(htmlContent)}`, // whole thing is a string
+      ),
+    ),
+  );
+}
+
+/**
+ * ssrFile
+ * @param {string} fileUrl
+ */
+export async function ssrFile(fileUrl) {
+  if (fs.existsSync(fileUrl)) {
+    const fileUrlStripped = fileUrl.replace('.html', '');
+    const ssrJsUrl = `${fileUrlStripped}.ssr.js`;
+    const ssrJsHtmlUrl = `${fileUrlStripped}.ssr.html`;
+    // delete files incase this doesn't work...
+    if (fs.existsSync(ssrJsUrl)) {
+      fs.unlink(ssrJsUrl);
+    }
+    if (fs.existsSync(ssrJsHtmlUrl)) {
+      fs.unlink(ssrJsHtmlUrl);
+    }
+
+    const htmlContent = await readFile(fileUrl, 'utf8');
+    const ssrContent = await ssr(htmlContent);
+
+    await writeFile(ssrJsUrl, `export default {
+  source: \`${htmlContent}\`,
+  ssr: \`${ssrContent}\`
+}`);
+    await writeFile(ssrJsHtmlUrl, ssrContent);
+  }
+}
+
+/**
+ * ssrData
+ * @param {string} globStr
+ */
+export async function ssrData (globStr = './src/**/ssr/*[!.ssr].html') {
+  glob(globStr, {}, (err, files)=>{
+    files.map((file) => {
+      ssrFile(file);
+    });
+  });
+}
+

package/scripts/vm/render-template.js

@@ -0,0 +1,16 @@
+// Example: render-template.js
+
+import {render} from '@lit-labs/ssr/lib/render-lit-html.js';
+import {unsafeHTML} from 'lit/directives/unsafe-html.js';
+import {html} from 'lit';
+import 'scu-web-components/dist/scw-components.js';
+
+/**
+ * renderTemplate
+ * @param {object} info
+ * @return {string}
+ */
+export function renderTemplate(info) {
+  const results = render(html`${unsafeHTML(info.content)}`);
+  return results;
+};

package/scripts/vm/ssr.mjs

@@ -0,0 +1,78 @@
+import {renderModule} from '@lit-labs/ssr/lib/render-module.js';
+import {Readable} from 'readable-stream';
+import {readStream} from '../lib/readStream.mjs';
+import fs from 'fs-extra';
+import {readFile, writeFile} from 'fs/promises';
+import glob from 'glob';
+import chalk from 'chalk';
+import {fileURLToPath} from 'url';
+import gzipme from 'gzipme';
+const __dirname = fileURLToPath(new URL('.', import.meta.url));
+
+/**
+ * ssr
+ * Execute the above `renderTemplate` in a
+ * separate VM context with a minimal DOM shim
+ * @param {string} content
+ * @return {string}
+ */
+export async function ssr(content) {
+  const ssrResult = await (renderModule(
+    `${__dirname}render-template.js`, // Module to load in VM context
+    import.meta.url, // Referrer URL for module
+    'renderTemplate', // Function to call
+    [{content}], // Arguments to function
+  ));
+  return readStream(
+    Readable.from(ssrResult),
+  );
+}
+
+/**
+ * ssrFile
+ * @param {string} fileUrl
+ */
+export async function ssrFile(fileUrl) {
+  if (fs.existsSync(fileUrl)) {
+    const fileUrlStripped = fileUrl.replace('.html', '');
+    const ssrJsUrl = `${fileUrlStripped}.ssr.js`;
+    const ssrJsHtmlUrl = `${fileUrlStripped}.ssr.html`;
+    // delete files incase this doesn't work...
+    if (fs.existsSync(ssrJsUrl)) {
+      fs.unlink(ssrJsUrl);
+    }
+    if (fs.existsSync(ssrJsHtmlUrl)) {
+      fs.unlink(ssrJsHtmlUrl);
+    }
+    const htmlContent = await readFile(fileUrl, 'utf8');
+    const ssrContent = await ssr(htmlContent);
+    await writeFile(ssrJsUrl, `export default {
+  source: \`${htmlContent}\`,
+  ssr: \`${ssrContent}\`
+}`);
+    await writeFile(ssrJsHtmlUrl, ssrContent);
+
+    // gzip
+    gzipme(ssrJsHtmlUrl, {mode: 'best'});
+  }
+}
+
+/**
+ * ssrData
+ * @param {string} source
+ * @return {Promise<string>}
+ */
+export async function ssrData(
+  source = 'src',
+) {
+  console.log(`ssr data [source=${source}]`);
+  const promiseArr = [];
+  glob.sync(`./${source}/**/ssr/*[!.ssr].html`, {}).map((file) => {
+    promiseArr.push(ssrFile(file));
+  });
+  return Promise.all(promiseArr).then(() => {
+    console.log(chalk.cyan(
+      `done building ssr data (total: ${promiseArr.length})`
+    ));
+  });
+}

package/scripts/vm/ssrData.mjs

@@ -0,0 +1,5 @@
+import {ssrData} from './ssr.mjs';
+import yargs from 'yargs';
+
+const argv = yargs(process.argv.slice(2)).argv;
+ssrData(argv.source);

package/scripts/vm/ssrDataSpawn.mjs

@@ -0,0 +1,26 @@
+import {exec} from 'child_process';
+import {fileURLToPath} from 'url';
+const __dirname = fileURLToPath(new URL('.', import.meta.url));
+
+/**
+ * ssrData
+ * @param {object} config
+ * @return {string}
+ */
+export async function ssrData(config = {}) {
+  return new Promise((resolve, reject) => {
+    exec(`NODE_OPTIONS=--experimental-vm-modules node ${__dirname}ssrData.mjs ${
+      config.ssr && config.ssr.source ? `--source=${config.ssr.source}` : ''
+    }`,
+      (err, stdout, stderr) => {
+        if (err) {
+          console.error(`exec error: ${err} ${stderr}`);
+          reject(err);
+          return;
+        }
+        console.log(stdout);
+        resolve();
+      },
+    );
+  });
+}

package/dist/chunks/chunk.243BTICY.js

@@ -1,2 +0,0 @@
-import{a as c}from"./chunk.O6CQNIHX.js";customElements.define("scw-card",c);
-//# sourceMappingURL=chunk.243BTICY.js.map

package/dist/chunks/chunk.24NBMK6U.js

@@ -1,209 +0,0 @@
-import{a as n}from"./chunk.MOWV5A2M.js";import{a}from"./chunk.EFY6AEW3.js";import{a as i,b as s}from"./chunk.HCMPRDIX.js";import{a as o}from"./chunk.ZS4C3T6Z.js";import{g as r}from"./chunk.5YJY6NT6.js";var c=i`
-:host([design=main]) {
-  outline: none;
-  background-color: rgba(0, 0, 0, 0);
-  padding-left: var(--scw-spacing-1);
-  padding-right: var(--scw-spacing-1);
-  padding-top: calc(var(--scw-spacing-1) * 0.8);
-  padding-bottom: var(--scw-spacing-1);
-  display: inline-flex;
-}
-:host([design=main]) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-07-font);
-  color: var(--scw-color-grey-02);
-}
-
-:host([design=main]:focus-visible) {
-  background-color: var(--scw-color-grey-10);
-  border-radius: 4px 4px 4px 4px;
-  box-shadow: var(--scw-effect-focus-shadow);
-  padding-left: var(--scw-spacing-1);
-  padding-right: var(--scw-spacing-1);
-  padding-top: calc(var(--scw-spacing-1) * 0.8);
-  padding-bottom: var(--scw-spacing-1);
-}
-:host([design=main]:focus-visible) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-07-font);
-  color: var(--scw-color-grey-02);
-}
-
-:host([design=main]:hover) {
-  background-color: rgba(0, 0, 0, 0);
-  padding-left: var(--scw-spacing-1);
-  padding-right: var(--scw-spacing-1);
-  padding-top: calc(var(--scw-spacing-1) * 0.8);
-  padding-bottom: var(--scw-spacing-1);
-  cursor: pointer;
-}
-:host([design=main]:hover) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-07-font);
-  color: var(--scw-color-03, var(--scw-color-primary-03));
-}
-
-:host([design=main][aria-selected=true]) {
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: var(--scw-spacing-1);
-  padding-right: var(--scw-spacing-1);
-  padding-top: calc(var(--scw-spacing-1) * 0.8);
-  padding-bottom: 0px;
-}
-:host([design=main][aria-selected=true]) > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.8);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );
-}
-:host([design=main][aria-selected=true]) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-07-font);
-  color: var(--scw-color-grey-02);
-  align-self: stretch;
-  flex: 1;
-}
-:host([design=main][aria-selected=true]) .selected {
-  background-color: var(--scw-color-03, var(--scw-color-primary-03));
-  align-self: stretch;
-  height: 2px;
-}
-
-:host([design=main][aria-disabled=true]) {
-  background-color: rgba(0, 0, 0, 0);
-  padding-left: var(--scw-spacing-1);
-  padding-right: var(--scw-spacing-1);
-  padding-top: calc(var(--scw-spacing-1) * 0.8);
-  padding-bottom: var(--scw-spacing-1);
-  cursor: auto;
-  pointer-events: none;
-}
-:host([design=main][aria-disabled=true]) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-07-font);
-  color: var(--scw-color-grey-08);
-}
-:host([design=main][aria-disabled=true]) .icon svg {
-  fill: var(--scw-color-grey-08);
-}
-:host([design=main][aria-disabled=true]) .icon svg * {
-  fill: var(--scw-color-grey-08);
-}
-
-:host([design=utility]) {
-  outline: none;
-  user-select: none;
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: center;
-  padding-left: var(--scw-spacing-1);
-  padding-right: var(--scw-spacing-1);
-  padding-top: 0px;
-  padding-bottom: 0px;
-  display: inline-flex;
-}
-:host([design=utility]) > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.4);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-:host([design=utility]) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-font);
-  color: var(--scw-color-grey-02);
-  min-height: 19px;
-}
-:host([design=utility]) .icon {
-  width: 24px;
-  height: 24px;
-}
-:host([design=utility]) .icon svg {
-  box-sizing: border-box;
-  vertical-align: top;
-  width: 100%;
-  height: 100%;
-  fill: var(--scw-color-grey-02);
-}
-:host([design=utility]) .icon svg * {
-  fill: var(--scw-color-grey-02);
-}
-
-:host([design=utility]:focus-visible) {
-  background-color: var(--scw-color-grey-10);
-  border-radius: 4px 4px 4px 4px;
-  box-shadow: var(--scw-effect-focus-shadow);
-}
-:host([design=utility]:focus-visible) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-font);
-  color: var(--scw-color-grey-02);
-}
-:host([design=utility]:focus-visible) .icon svg {
-  fill: var(--scw-color-grey-02);
-}
-:host([design=utility]:focus-visible) .icon svg * {
-  fill: var(--scw-color-grey-02);
-}
-
-:host([design=utility]:hover) {
-  background-color: rgba(0, 0, 0, 0);
-  cursor: pointer;
-}
-:host([design=utility]:hover) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-font);
-  color: var(--scw-color-03, var(--scw-color-primary-03));
-}
-:host([design=utility]:hover) .icon svg {
-  fill: var(--scw-color-primary-03);
-}
-:host([design=utility]:hover) .icon svg * {
-  fill: var(--scw-color-primary-03);
-}
-
-:host([design=utility][aria-selected=true]) {
-  background-color: rgba(0, 0, 0, 0);
-  cursor: pointer;
-}
-:host([design=utility][aria-selected=true]) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-font);
-  color: var(--scw-color-03, var(--scw-color-primary-03));
-}
-:host([design=utility][aria-selected=true]) .icon svg {
-  fill: var(--scw-color-primary-03);
-}
-:host([design=utility][aria-selected=true]) .icon svg * {
-  fill: var(--scw-color-primary-03);
-}
-
-:host([design=utility][aria-disabled=true]) {
-  cursor: auto;
-  pointer-events: none;
-  background-color: rgba(0, 0, 0, 0);
-}
-:host([design=utility][aria-disabled=true]) .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-font);
-  color: var(--scw-color-grey-07);
-}
-:host([design=utility][aria-disabled=true]) .icon svg {
-  fill: var(--scw-color-grey-07);
-}
-:host([design=utility][aria-disabled=true]) .icon svg * {
-  fill: var(--scw-color-grey-07);
-}
-
-:host {
-  white-space: nowrap;
-}
-:host .label {
-  white-space: nowrap;
-}`;var t=class extends a{constructor(){super();this.ariaSelected="false";this.element="menu-item",this.setAttribute("role","menuitem")}static get styles(){return[super.styles,c]}hasPopup(){let e=this.nextElementSibling;return!!(e&&e.nodeName.indexOf("SCW-MENU")===0)}doShowIcon(){return!!(super.doShowIcon()&&this.design!=="main")}validDesigns(){return{...super.validDesigns(),...n}}connectedCallback(){super.connectedCallback(),this.hasPopup()&&this.setAttribute("aria-haspopup","true")}renderContent(){return this.design==="main"&&this.ariaSelected==="true"?(this.setAttribute("aria-current","page"),o`
-          <div>${super.renderContent()}</div>
-          <div class="selected"></div>
-        `):(this.removeAttribute("aria-current"),super.renderContent())}render(){return this.renderLink(this.renderContent())}};r([s({type:String,attribute:"aria-selected"})],t.prototype,"ariaSelected",2);export{t as a};
-//# sourceMappingURL=chunk.24NBMK6U.js.map

package/dist/chunks/chunk.24NBMK6U.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["sass-plugin-0:/Users/scottrouse/Workspace/scu-design-system-mono/scu-web-components/src/scw-menu-item/scss/scw-menu-item.scss", "../../src/scw-menu-item/ScwMenuItem.ts"],
-  "sourcesContent": ["import {css} from \"lit-element/lit-element.js\";\nexport default css`\n:host([design=main]) {\n  outline: none;\n  background-color: rgba(0, 0, 0, 0);\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: var(--scw-spacing-1);\n  display: inline-flex;\n}\n:host([design=main]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-grey-02);\n}\n\n:host([design=main]:focus-visible) {\n  background-color: var(--scw-color-grey-10);\n  border-radius: 4px 4px 4px 4px;\n  box-shadow: var(--scw-effect-focus-shadow);\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: var(--scw-spacing-1);\n}\n:host([design=main]:focus-visible) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-grey-02);\n}\n\n:host([design=main]:hover) {\n  background-color: rgba(0, 0, 0, 0);\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: var(--scw-spacing-1);\n  cursor: pointer;\n}\n:host([design=main]:hover) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n}\n\n:host([design=main][aria-selected=true]) {\n  background-color: rgba(0, 0, 0, 0);\n  display: flex;\n  flex-flow: column nowrap;\n  justify-content: flex-start;\n  align-items: flex-start;\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: 0px;\n}\n:host([design=main][aria-selected=true]) > *:not(:last-child) {\n  margin-bottom: calc(var(--scw-spacing-1) * 0.8);\n  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );\n}\n:host([design=main][aria-selected=true]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-grey-02);\n  align-self: stretch;\n  flex: 1;\n}\n:host([design=main][aria-selected=true]) .selected {\n  background-color: var(--scw-color-03, var(--scw-color-primary-03));\n  align-self: stretch;\n  height: 2px;\n}\n\n:host([design=main][aria-disabled=true]) {\n  background-color: rgba(0, 0, 0, 0);\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: calc(var(--scw-spacing-1) * 0.8);\n  padding-bottom: var(--scw-spacing-1);\n  cursor: auto;\n  pointer-events: none;\n}\n:host([design=main][aria-disabled=true]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-bold-condensed-07-font);\n  color: var(--scw-color-grey-08);\n}\n:host([design=main][aria-disabled=true]) .icon svg {\n  fill: var(--scw-color-grey-08);\n}\n:host([design=main][aria-disabled=true]) .icon svg * {\n  fill: var(--scw-color-grey-08);\n}\n\n:host([design=utility]) {\n  outline: none;\n  user-select: none;\n  background-color: rgba(0, 0, 0, 0);\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: flex-start;\n  align-items: center;\n  padding-left: var(--scw-spacing-1);\n  padding-right: var(--scw-spacing-1);\n  padding-top: 0px;\n  padding-bottom: 0px;\n  display: inline-flex;\n}\n:host([design=utility]) > *:not(:last-child) {\n  margin-right: calc(var(--scw-spacing-1) * 0.4);\n  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );\n}\n:host([design=utility]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-grey-02);\n  min-height: 19px;\n}\n:host([design=utility]) .icon {\n  width: 24px;\n  height: 24px;\n}\n:host([design=utility]) .icon svg {\n  box-sizing: border-box;\n  vertical-align: top;\n  width: 100%;\n  height: 100%;\n  fill: var(--scw-color-grey-02);\n}\n:host([design=utility]) .icon svg * {\n  fill: var(--scw-color-grey-02);\n}\n\n:host([design=utility]:focus-visible) {\n  background-color: var(--scw-color-grey-10);\n  border-radius: 4px 4px 4px 4px;\n  box-shadow: var(--scw-effect-focus-shadow);\n}\n:host([design=utility]:focus-visible) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-grey-02);\n}\n:host([design=utility]:focus-visible) .icon svg {\n  fill: var(--scw-color-grey-02);\n}\n:host([design=utility]:focus-visible) .icon svg * {\n  fill: var(--scw-color-grey-02);\n}\n\n:host([design=utility]:hover) {\n  background-color: rgba(0, 0, 0, 0);\n  cursor: pointer;\n}\n:host([design=utility]:hover) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n}\n:host([design=utility]:hover) .icon svg {\n  fill: var(--scw-color-primary-03);\n}\n:host([design=utility]:hover) .icon svg * {\n  fill: var(--scw-color-primary-03);\n}\n\n:host([design=utility][aria-selected=true]) {\n  background-color: rgba(0, 0, 0, 0);\n  cursor: pointer;\n}\n:host([design=utility][aria-selected=true]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-03, var(--scw-color-primary-03));\n}\n:host([design=utility][aria-selected=true]) .icon svg {\n  fill: var(--scw-color-primary-03);\n}\n:host([design=utility][aria-selected=true]) .icon svg * {\n  fill: var(--scw-color-primary-03);\n}\n\n:host([design=utility][aria-disabled=true]) {\n  cursor: auto;\n  pointer-events: none;\n  background-color: rgba(0, 0, 0, 0);\n}\n:host([design=utility][aria-disabled=true]) .label {\n  text-align: LEFT;\n  font: var(--scw-type-text-font);\n  color: var(--scw-color-grey-07);\n}\n:host([design=utility][aria-disabled=true]) .icon svg {\n  fill: var(--scw-color-grey-07);\n}\n:host([design=utility][aria-disabled=true]) .icon svg * {\n  fill: var(--scw-color-grey-07);\n}\n\n:host {\n  white-space: nowrap;\n}\n:host .label {\n  white-space: nowrap;\n}`;\n", "import {html} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport ScwLink from '../scw-link/ScwLink';\nimport styles from './scss/scw-menu-item.scss';\nimport {ScwMenuItemDesigns} from './scw-menu-item-enums';\nimport {Components} from '../utils/enums/Components';\n\n/**\n * ScwMenuItem\n * @class\n * @tag scw-menu-item\n *\n * @slot [default=\"<a href target />\"]\n    (OPTIONAL) anchor (for SEO) will determine the label, href, and target.\n * @slot [default=\"<... />\"]\n    (OPTIONAL) random content (paired with design=\"plain\") will wrap that\n    content with a link.\n */\nexport default class ScwMenuItem extends ScwLink {\n  // ============== ScwMenuItem ================================================\n  /**\n  * (ScwMenuItem) selected state\n  * @type {Boolean}\n  */\n  @property({type: String, attribute: 'aria-selected'})\n    ariaSelected = 'false';\n\n  /**\n  * extending styles from ScwLink\n  * https://stackoverflow.com/questions/60266303/\n  *  how-to-extend-and-style-existing-litelements\n  */\n   static get styles() {\n     return [\n       super.styles,\n       styles,\n     ];\n   }\n\n  /**\n  * Constructor\n  */\n   constructor() {\n     super();\n     this.element = Components.menuItem;\n     this.setAttribute('role', 'menuitem');\n   }\n\n  /**\n   * determines if this menu item has a sub menu\n   * @return {boolean}\n   */\n  hasPopup() {\n    const next = this.nextElementSibling;\n    // if (next && next['element'] === Components.menu ) {\n    // the component may not be initialized yet...\n    if (next && next.nodeName.indexOf('SCW-MENU') === 0 ) {\n      return true;\n    }\n    return false;\n  }\n\n  /**\n  * Way to extend valid design icon types...\n  * @return {boolean}\n  */\n  doShowIcon() : boolean {\n    const superDoShowIcon = super.doShowIcon();\n    if ( superDoShowIcon &&\n    this.design !== ScwMenuItemDesigns.main\n    ) {\n      return true;\n    }\n    return false;\n  }\n\n  /**\n  * Way to extend valid design types...\n  * @return {object} object of valid designs relative to this object\n  */\n  validDesigns() : object {\n    return {\n      ...super.validDesigns(),\n      ...ScwMenuItemDesigns,\n    };\n  }\n\n  /** connectedCallback */\n  connectedCallback(): void {\n    super.connectedCallback();\n    if (this.hasPopup() ) {\n      this.setAttribute( 'aria-haspopup', 'true' );\n    }\n  }\n\n  /**\n   * renderContent\n   * @return {object}\n   */\n  renderContent() {\n    if (\n      this.design === ScwMenuItemDesigns.main &&\n      this.ariaSelected === 'true'\n    ) {\n       this.setAttribute( 'aria-current', 'page' );\n       // protect initial flex-v...a link with icons is flex-h\n       return html`\n          <div>${super.renderContent()}</div>\n          <div class=\"selected\"></div>\n        `;\n    } else {\n        this.removeAttribute( 'aria-current' );\n       return super.renderContent();\n    }\n  }\n\n  /**\n  *\n  * @return {object}\n  */\n  render(): object {\n    return this.renderLink(\n      this.renderContent(),\n    );\n  }\n}\n"],
-  "mappings": "0MACA,GAAO,GAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;GCiBf,mBAAyC,EAAQ,CAwB9C,aAAc,CACZ,MAAM,EAlBP,kBAAe,QAmBd,KAAK,QAAU,YACf,KAAK,aAAa,OAAQ,UAAU,CACtC,WAdW,SAAS,CAClB,MAAO,CACL,MAAM,OACN,CACF,CACF,CAeD,UAAW,CACT,GAAM,GAAO,KAAK,mBAGlB,MAAI,MAAQ,EAAK,SAAS,QAAQ,UAAU,IAAM,EAIpD,CAMA,YAAuB,CAErB,MAAK,GADmB,MAAM,WAAW,GAEzC,KAAK,SAAW,OAKlB,CAMA,cAAwB,CACtB,MAAO,IACF,MAAM,aAAa,KACnB,CACL,CACF,CAGA,mBAA0B,CACxB,MAAM,kBAAkB,EACpB,KAAK,SAAS,GAChB,KAAK,aAAc,gBAAiB,MAAO,CAE/C,CAMA,eAAgB,CACd,MACE,MAAK,SAAW,QAChB,KAAK,eAAiB,OAErB,MAAK,aAAc,eAAgB,MAAO,EAEnC;AAAA,iBACG,MAAM,cAAc;AAAA;AAAA,WAI7B,MAAK,gBAAiB,cAAe,EAC/B,MAAM,cAAc,EAEhC,CAMA,QAAiB,CACf,MAAO,MAAK,WACV,KAAK,cAAc,CACrB,CACF,CACF,EApGI,GADF,AAAC,EAAS,CAAC,KAAM,OAAQ,UAAW,eAAe,CAAC,GAClD,AAPJ,EAOI",
-  "names": []
-}

package/dist/chunks/chunk.25CFFZIW.js

@@ -1,2 +0,0 @@
-import{a as c}from"./chunk.BXQ2YYTJ.js";customElements.define("scw-card",c);
-//# sourceMappingURL=chunk.25CFFZIW.js.map

package/dist/chunks/chunk.25CFFZIW.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/scw-card/scw-card.ts"],
-  "sourcesContent": ["import ScwCard from './ScwCard';\ncustomElements.define('scw-card', ScwCard );\n"],
-  "mappings": "wCACA,eAAe,OAAO,WAAY,CAAQ",
-  "names": []
-}

package/dist/chunks/chunk.26QZNZ5O.js

@@ -1,4 +0,0 @@
-import{a as u}from"./chunk.AAMAYL7H.js";import{b as n,c as r,e as f}from"./chunk.6ITKITRF.js";import{a as o}from"./chunk.ZS4C3T6Z.js";import{g as a}from"./chunk.5YJY6NT6.js";var c=(e=>(e.text="text",e.boolean="boolean",e.submit="submit",e))(c||{}),h=(i=>(i.submit="submit",i.cancel="cancel",i))(h||{}),t=class extends f{constructor(){super(...arguments);this.formType="text";this.value="";this.placeholder="";this.selected=!1;this.readOnly=!1;this.required=!1;this.requiredLabel=" *";this.focused=!1;this.invalid=!1}connectedCallback(){super.connectedCallback(),this.required&&this.createAndAddValidationRule("required",this.requiredFeedback)}decorateValues(i){if(!this.name){this.warn(`${this.element} didn't find a name`);return}this.formType==="boolean"?i[this.name]=this.selected:i[this.name]=this.value}findIfRequired(){let i=this.findValidationRules();return i?i.isRequired():!1}findValidationRules(){return Array.from(this.children).find(l=>l.nodeName.indexOf("SCW-VALIDATION")===0)}validate(){let i=this.findValidationRules(),e=[];return i&&(e=i.validate(this.value)),this.invalid=e.length>0,this.invalid?this.feedback=e[0].feedback:this.feedback="",e}createValidateRule(){return document.createElement(`scw-${"validate"}${u()}`)}addValidationRule(i){let e=this.findValidationRules();e||(e=document.createElement(`scw-${"validation"}${u()}`),this.prepend(e)),Array.from(e.children).find(s=>s.getAttribute("type")===i.type)||e.appendChild(i)}createAndAddValidationRule(i,e){let l=this.createValidateRule();l.setAttribute("type",i),e&&l.setAttribute("feedback",e),this.addValidationRule(l)}removeValidationRule(i){let e=this.findValidationRules();if(!e)return;let d=Array.from(e.children).find(s=>s.type===i);d&&d.parentNode&&d.parentNode.removeChild(d)}render(){return o`
-      scw-form-component
-    `}};a([n({type:c,reflect:!0,attribute:"form-type"})],t.prototype,"formType",2),a([n({type:String})],t.prototype,"name",2),a([n({type:String})],t.prototype,"value",2),a([n({type:String})],t.prototype,"placeholder",2),a([n({type:String})],t.prototype,"selected",2),a([n({type:Boolean,attribute:"read-only"})],t.prototype,"readOnly",2),a([n({type:Boolean})],t.prototype,"required",2),a([n({type:String,attribute:"required-label"})],t.prototype,"requiredLabel",2),a([n({type:String,attribute:"required-feedback"})],t.prototype,"requiredFeedback",2),a([r()],t.prototype,"feedback",2),a([r()],t.prototype,"focused",2),a([r()],t.prototype,"invalid",2);export{c as a,h as b,t as c};
-//# sourceMappingURL=chunk.26QZNZ5O.js.map

package/dist/chunks/chunk.26WRWOQA.js

@@ -1,4 +0,0 @@
-import{a as u}from"./chunk.5SYXTJPM.js";import{b as n,c as r,e as f}from"./chunk.XICCWDLO.js";import{a as o}from"./chunk.ZS4C3T6Z.js";import{g as a}from"./chunk.5YJY6NT6.js";var c=(e=>(e.text="text",e.boolean="boolean",e.submit="submit",e))(c||{}),h=(i=>(i.submit="submit",i.cancel="cancel",i))(h||{}),t=class extends f{constructor(){super(...arguments);this.formType="text";this.value="";this.placeholder="";this.selected=!1;this.readOnly=!1;this.required=!1;this.requiredLabel=" *";this.focused=!1;this.invalid=!1}connectedCallback(){super.connectedCallback(),this.required&&this.createAndAddValidationRule("required",this.requiredFeedback)}decorateValues(i){if(!this.name){this.warn(`${this.element} didn't find a name`);return}this.formType==="boolean"?i[this.name]=this.selected:i[this.name]=this.value}findIfRequired(){let i=this.findValidationRules();return i?i.isRequired():!1}findValidationRules(){return Array.from(this.children).find(l=>l.nodeName.indexOf("SCW-VALIDATION")===0)}validate(){let i=this.findValidationRules(),e=[];return i&&(e=i.validate(this.value)),this.invalid=e.length>0,this.invalid?this.feedback=e[0].feedback:this.feedback="",e}createValidateRule(){return document.createElement(`scw-${"validate"}${u()}`)}addValidationRule(i){let e=this.findValidationRules();e||(e=document.createElement(`scw-${"validation"}${u()}`),this.prepend(e)),Array.from(e.children).find(s=>s.getAttribute("type")===i.type)||e.appendChild(i)}createAndAddValidationRule(i,e){let l=this.createValidateRule();l.setAttribute("type",i),e&&l.setAttribute("feedback",e),this.addValidationRule(l)}removeValidationRule(i){let e=this.findValidationRules();if(!e)return;let d=Array.from(e.children).find(s=>s.type===i);d&&d.parentNode&&d.parentNode.removeChild(d)}render(){return o`
-      scw-form-component
-    `}};a([n({type:c,reflect:!0,attribute:"form-type"})],t.prototype,"formType",2),a([n({type:String})],t.prototype,"name",2),a([n({type:String})],t.prototype,"value",2),a([n({type:String})],t.prototype,"placeholder",2),a([n({type:String})],t.prototype,"selected",2),a([n({type:Boolean,attribute:"read-only"})],t.prototype,"readOnly",2),a([n({type:Boolean})],t.prototype,"required",2),a([n({type:String,attribute:"required-label"})],t.prototype,"requiredLabel",2),a([n({type:String,attribute:"required-feedback"})],t.prototype,"requiredFeedback",2),a([r()],t.prototype,"feedback",2),a([r()],t.prototype,"focused",2),a([r()],t.prototype,"invalid",2);export{c as a,h as b,t as c};
-//# sourceMappingURL=chunk.26WRWOQA.js.map