@zohodesk/svg 1.0.0-beta.4 → 1.0.0-beta.42

package/es/svg/images/EmptyCustomDomain.svg

@@ -0,0 +1,85 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.1.3, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 298 123.5" style="enable-background:new 0 0 298 123.5;" xml:space="preserve">
+<style type="text/css">
+	.st0{opacity:0.35;fill:#E5E5E5;enable-background:new    ;}
+	.st1{opacity:0.7;fill:none;stroke:#DADADA;stroke-width:0.75;stroke-miterlimit:10;enable-background:new    ;}
+	.st2{opacity:0.7;}
+	.st3{fill:none;stroke:#DADADA;stroke-width:0.75;stroke-miterlimit:10;stroke-dasharray:0.97,0.97;}
+	.st4{fill:none;stroke:#DADADA;stroke-width:0.75;stroke-miterlimit:10;stroke-dasharray:1.03,1.03;}
+	.st5{fill:none;stroke:#DADADA;stroke-width:0.75;stroke-miterlimit:10;stroke-dasharray:1.01,1.01;}
+	.st6{opacity:0.5;fill:#DCF6FF;enable-background:new    ;}
+	.st7{opacity:0.2;enable-background:new    ;}
+	.st8{fill:#FFFFFF;}
+	.st9{fill:#BBEAFF;}
+	.st10{fill:none;stroke:#5A5C5D;stroke-miterlimit:10;}
+	.st11{fill:#5A5C5D;}
+	.st12{opacity:5.000000e-02;enable-background:new    ;}
+	.st13{fill:#EB4A62;}
+</style>
+<g id="Layer_2_1_">
+	<g id="Layer_1-2">
+		<path class="st0" d="M288.2,78.1h-75.1c-1.5,0-2.9-1-3.4-2.4c-0.2-0.5-0.3-1-0.3-1.5c-0.1-2,1.4-3.7,3.4-3.7c0.1,0,0.1,0,0.2,0
+			h41.3c5.3,0,9.6-4.3,9.6-9.6l0,0c0-5.3-4.3-9.6-9.6-9.6l0,0H137.1c-1.8,0-3.3-1.3-3.6-3.1c-0.1-0.8,0-1.7,0.2-2.5
+			c0.5-1.5,1.9-2.6,3.5-2.5h38.5c5.3,0,9.6-4.3,9.6-9.6v0l0,0c0-5.3-4.3-9.6-9.6-9.6l0,0H9.6c-5.3,0-9.6,4.3-9.6,9.6l0,0
+			C0,38.7,4.3,43,9.6,43c0,0,0,0,0,0h57.3c1.8,0,3.3,1.3,3.6,3c0.1,0.6,0.1,1.3,0.1,1.9c-0.2,1.8-1.8,3.2-3.6,3.2H34.7
+			c-5.3,0-9.6,4.3-9.6,9.6c0,0,0,0,0,0l0,0c0,5.3,4.3,9.6,9.6,9.6H143c2,0,3.6,1.6,3.6,3.6c0,0.1,0,0.1,0,0.2c0,0.4-0.1,0.7-0.1,1.1
+			c-0.3,1.7-1.8,2.9-3.5,2.9H63c-5.3,0-9.6,4.3-9.6,9.6l0,0c0,5.3,4.3,9.6,9.6,9.6h69.2c2,0,3.6,1.5,3.6,3.5v0.1
+			c-0.1,2-1.7,3.5-3.6,3.5h-29.5c-5.1-0.1-9.5,3.8-9.9,8.9c-0.4,5.3,3.7,9.9,8.9,10.2c0.2,0,0.4,0,0.6,0h114.2
+			c5.2,0.1,9.5-3.9,9.9-9c0.3-5.3-3.7-9.9-9-10.2c-0.2,0-0.4,0-0.6,0h-14.6c-2,0-3.6-1.5-3.6-3.5v-0.1c0.1-1.9,1.7-3.5,3.6-3.4h86.1
+			c5.3,0,9.6-4.3,9.6-9.6c0,0,0,0,0,0l0,0C297.9,82.3,293.5,78,288.2,78.1z"/>
+		<polygon class="st1" points="76.5,70.5 79.3,70.8 77.4,72.8 77.9,75.5 75.4,74.3 73,75.7 73.4,73 71.4,71.1 74.1,70.6 75.2,68.1 
+					"/>
+		<g class="st2">
+			<circle class="st3" cx="66.6" cy="22.8" r="4.3"/>
+		</g>
+		<g class="st2">
+			<circle class="st4" cx="192.3" cy="117.8" r="4.3"/>
+		</g>
+		<polygon class="st1" points="139.2,17.3 141.2,17.5 139.8,18.9 140.2,20.9 138.5,20 136.7,21 137,19 135.6,17.7 137.5,17.4 
+			138.3,15.6 		"/>
+		<polygon class="st1" points="215.1,2.6 217.1,2.9 215.7,4.3 216.1,6.2 214.4,5.4 212.6,6.3 212.9,4.4 211.5,3 213.4,2.7 
+			214.2,0.9 		"/>
+		<g class="st2">
+			<circle class="st5" cx="260.9" cy="54.3" r="8"/>
+		</g>
+		<circle class="st6" cx="140.3" cy="72.2" r="45.1"/>
+		<path class="st7" d="M182.2,64.4L168,57.2c1.1-10.5-0.9-19.3-5.5-24.6c10.5,7.1,17.4,18.3,19.2,30.8c0,0.3,0.3,0.3,0.4,0.3
+			s0.3-0.3,0.3-0.4C178.9,38.4,155.9,21,131,24.5c-5.8,0.8-11.4,2.7-16.5,5.7c-0.1,0-0.1,0.1-0.1,0.1c-7.6,4.4-13.7,10.9-17.6,18.7
+			c-3.9,7.8-5.5,16.5-4.6,25.2v0.3c2.4,23.1,21.9,40.6,45.1,40.6h0.4c0.2,0,0.4-0.2,0.4-0.4s-0.2-0.4-0.4-0.4l0,0
+			c-5.2,0.1-10.4-0.8-15.3-2.6c0.6,0.1,1.1,0.2,1.7,0.2c2.2,0,4.3-0.3,6.3-1c0.1-0.1,0.3-0.3,0.3-0.4s-0.3-0.3-0.4-0.3
+			c-4.8,1.4-9.1,1.3-12.7-0.4l8.9-17.7l1,0.4c0.1,0,0.1,0.1,0.1,0.1c0,0,0,0,0,0c0.2,0,0.3-0.1,0.3-0.3c0.1-0.1,0.1-0.3,0-0.4
+			c0,0-0.1,0-0.1,0l-1-0.4l4.9-9.5c0.1-0.1,0.1-0.3-0.1-0.4c0,0,0,0-0.1,0c-0.1-0.1-0.4,0-0.4,0.1l-4.9,9.5l-18.6-9.5
+			c1-8,3.5-15.7,7.2-22.9l16,8.1c0.1,0,0.1,0.1,0.1,0.1c0.2,0,0.3-0.1,0.3-0.3c0.1-0.1,0.1-0.3-0.1-0.4c0,0-0.1,0-0.1,0l-16-8.1
+			c3.6-7.2,8.4-13.8,14.3-19.5l18.6,9.3l-3,5.9c-0.1,0.1-0.1,0.3,0.1,0.4c0,0,0.1,0,0.1,0c0.1,0,0.1,0.1,0.1,0.1
+			c0.2,0,0.3-0.1,0.3-0.3l3-5.9l18.6,9.4c-0.3,1.9-0.6,3.7-1,5.8c-0.1,0.3,0.1,0.4,0.3,0.4c0.3,0.2,0.4-0.1,0.4-0.3
+			c0.4-1.9,0.7-3.8,1-5.5l14,7.1c0.1,0,0.1,0.1,0.1,0.1c0,0,0,0,0,0c0.2,0,0.3-0.1,0.3-0.3C182.5,64.7,182.4,64.4,182.2,64.4z
+			 M93,75l13.8,6.9c-0.3,2.6-0.4,5.3-0.3,7.9c0.3,7.1,2.3,12.8,5.8,16.7C101.6,99.3,94.6,87.8,93,75z M125.8,91.7l-9.1,17.6
+			c-5.8-3.2-9.2-9.9-9.7-19.4c-0.1-2.6,0-5.1,0.3-7.6L125.8,91.7z M106.8,81.3l-14-7.1c-0.8-8.4,0.7-16.8,4.4-24.4l16.7,8.5
+			C110.4,65.6,108,73.4,106.8,81.3L106.8,81.3z M114.5,57.7l-16.7-8.5c3.9-7.5,9.8-13.7,17-18l4.9,2.5c0.1,0,0.1,0.1,0.1,0.1
+			c0.2,0,0.3-0.1,0.3-0.3c0.1-0.2,0-0.4-0.1-0.4l-4.5-2.3c11.2-6.4,24.6-7.5,36.7-3.2c-5.1-0.4-10.8,1.3-16.7,5.3
+			c-2.2,1.5-4.2,3.1-6.2,4.9l-3.3-1.6c-0.2-0.1-0.4,0-0.4,0.1c-0.1,0.2,0,0.4,0.1,0.4l2.9,1.6C122.8,44,118.1,50.5,114.5,57.7
+			L114.5,57.7z M130,38.1c1.8-1.7,3.8-3.3,6-4.6c7.9-5.3,15.4-6.5,21.3-3.8l-8.9,17.6L130,38.1z M149,47.6l9-17.6
+			c7.2,3.9,10.8,14.1,9.4,26.9L149,47.6z"/>
+		<path class="st7" d="M143.8,57.1c-0.1-0.1-0.3-0.1-0.4,0c0,0,0,0.1-0.1,0.1l-3,5.9c-0.1,0.2,0,0.4,0.1,0.4c0.1,0,0.1,0.1,0.1,0.1
+			c0,0,0,0,0,0c0.2,0,0.3-0.1,0.3-0.3l3-5.9C144,57.5,143.9,57.2,143.8,57.1z"/>
+		<rect x="134.2" y="74.7" class="st8" width="62.5" height="38.3"/>
+		<rect x="134.5" y="65.3" class="st9" width="62.2" height="8.4"/>
+		<polyline class="st10" points="195.5,106.1 195.5,65.8 132.5,65.8 132.5,114.7 195.5,114.7 195.5,112.1 		"/>
+		<line class="st10" x1="132.5" y1="74.7" x2="195.5" y2="74.7"/>
+		<circle class="st11" cx="137.8" cy="70.4" r="1.1"/>
+		<circle class="st11" cx="141.9" cy="70.4" r="1.1"/>
+		<path class="st12" d="M134.5,75.3L134.5,75.3V77l0.9-1.7L134.5,75.3z M134.1,108.8v0.9c4.4-2,8.5-4.8,12-8.2l9.6,4.9
+			c0.1,0,0.1,0.1,0.1,0.2c0.2,0,0.3-0.1,0.3-0.3c0.1-0.1,0.1-0.3-0.1-0.4c0,0-0.1,0-0.1,0l-9.4-4.8c5.7-5.6,10.4-12.1,14-19.2
+			l16.7,8.4c-5.8,11.3-16.1,19.5-28.4,22.8h2.6c11.5-3.8,21-12,26.5-22.8c2.4-4.7,4-9.9,4.6-15.1l-0.6,0.2l0,0
+			c-0.6,5-2.1,9.9-4.3,14.4L161,81.2c1-1.9,1.9-3.9,2.6-5.9h-0.9c-0.9,1.9-1.6,3.7-2.6,5.6l-10.9-5.6h-1.7l12.4,6.2
+			c-3.6,7.1-8.3,13.5-14,19l-11.7-5.9v0.9l11.2,5.6 M134.5,75.2L134.5,75.2V77l0.9-1.7L134.5,75.2z M134.5,75.2L134.5,75.2V77
+			l0.9-1.7L134.5,75.2z"/>
+		<path class="st13" d="M154.1,98.8l7.8-13.5c0.7-1.1,2.1-1.5,3.2-0.9c0.4,0.2,0.7,0.5,0.9,0.9l7.8,13.5c0.7,1.1,0.3,2.6-0.9,3.2
+			c-0.3,0.2-0.7,0.3-1.1,0.3h-15.6c-1.3,0-2.4-1-2.4-2.3C153.8,99.6,153.9,99.2,154.1,98.8z"/>
+		<path class="st8" d="M163.2,99.6c0-0.5,0.4-0.9,0.9-0.9s0.9,0.4,0.9,0.9s-0.4,0.9-0.9,0.9S163.2,100.1,163.2,99.6z M165,91
+			c0,0.6-0.2,2-0.4,4l-0.2,2.1h-0.5l-0.2-2.1c-0.2-2.1-0.4-3.5-0.4-4s0.3-0.9,0.8-0.9S165,90.4,165,91z"/>
+	</g>
+</g>
+</svg>

package/es/svg/images/EmptySkills.svg

@@ -1,75 +1,83 @@
 <?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 23.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!-- Generator: Adobe Illustrator 24.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 194.4 139.3" style="enable-background:new 0 0 194.4 139.3;" xml:space="preserve">
+	 viewBox="0 0 200 200" style="enable-background:new 0 0 200 200;" xml:space="preserve">
 <style type="text/css">
-	.st0{opacity:3.000000e-02;fill:#1E2633;enable-background:new    ;}
-	.st1{fill:#CED5DE;}
-	.st2{fill:#E7E9EC;}
-	.st3{fill:#788190;}
-	.st4{opacity:0.5;}
-	.st5{opacity:0.4;fill:#E7E9EC;enable-background:new    ;}
-	.st6{fill:#FFFFFF;}
+	.st0{opacity:5.000000e-02;fill:#3F70B7;enable-background:new    ;}
+	.st1{fill:none;stroke:#E56471;stroke-miterlimit:10;}
+	.st2{fill:none;stroke:#5CC1A5;stroke-miterlimit:10;}
+	.st3{fill:none;stroke:#3F70B7;stroke-linecap:round;stroke-linejoin:round;}
+	.st4{fill:none;stroke:#010101;stroke-linecap:round;stroke-linejoin:round;}
+	.st5{fill:none;stroke:#000000;stroke-miterlimit:10;}
+	.st6{opacity:0.25;fill:#3F70B7;enable-background:new    ;}
+	.st7{opacity:0.25;}
+	.st8{clip-path:url(#SVGID_2_);}
+	.st9{fill:none;stroke:#3F70B7;stroke-width:0.5;stroke-miterlimit:10;}
+	.st10{clip-path:url(#SVGID_4_);}
 </style>
-<title>skills</title>
-<g>
-	<g id="Layer_1-2">
-		<circle class="st0" cx="113.1" cy="68.8" r="68.8"/>
-		<circle class="st0" cx="42.7" cy="56.4" r="42.7"/>
-		<circle class="st0" cx="35.9" cy="123.6" r="15.6"/>
-		<circle class="st1" cx="46.2" cy="68.8" r="5.1"/>
-		<path class="st1" d="M43.5,62c-11.4-20.5-13.8-39.3-4.5-48.7c3.9-3.9,9.5-5.8,16.1-5.8c10.5,0,23.6,4.6,37.2,12.9
-			c-9.2,6-17.7,12.9-25.4,20.7c-6.5,6.5-12.4,13.5-17.7,21c0.7,0.3,1.4,0.8,2,1.3c5.2-7.4,11-14.3,17.4-20.6
-			c7.9-7.9,16.6-15,25.9-21.1c9.4,6.1,18.1,13.1,25.9,21.1c6.4,6.4,12.2,13.2,17.4,20.6c0.6-0.6,1.3-1,2-1.3
-			c-5.3-7.5-11.2-14.5-17.7-20.9c-7.7-7.8-16.3-14.7-25.4-20.7c13.6-8.3,26.7-12.9,37.2-12.9c6.6,0,12.2,1.9,16.1,5.8
-			c9.3,9.3,6.9,28.2-4.4,48.7c0.7,0.3,1.4,0.7,2,1.2c11.8-21.5,14.2-41.5,4.1-51.5c-11-10.9-33.6-7.2-57.2,7.5
-			C71,4.4,48.3,0.7,37.4,11.6c-10.1,10-7.7,30.1,4.2,51.6C42.1,62.7,42.8,62.3,43.5,62z"/>
-		<path class="st1" d="M154.5,89.3c-1.9-5.2-4.2-10.2-6.8-14.9c-0.6,0.5-1.3,0.9-2.1,1.2c2.6,4.7,4.8,9.5,6.6,14.5
-			c5.4,15.2,4.7,27.4-2.1,34.2c-10.1,10-31.1,6.5-53.3-7.2c9.2-6,17.7-12.9,25.4-20.7c6.5-6.5,12.4-13.5,17.7-21
-			c-0.7-0.3-1.4-0.8-2-1.3c-5.2,7.3-11,14.2-17.4,20.6c-7.9,7.9-16.6,14.9-25.9,21c-9.4-6.1-18.1-13.1-25.9-21
-			c-6.4-6.4-12.2-13.3-17.4-20.6c-0.6,0.6-1.3,1-2,1.3c5.3,7.5,11.2,14.5,17.7,21c7.7,7.8,16.2,14.7,25.4,20.7
-			c-22.2,13.6-43.2,17.2-53.3,7.2c-6.8-6.8-7.6-19-2.2-34.2c1.8-5,4-9.8,6.6-14.5c-0.8-0.3-1.5-0.7-2.1-1.2c-2.7,4.8-5,9.8-6.8,14.9
-			c-5.8,16.2-4.8,29.2,2.7,36.7c4.3,4.3,10.4,6.3,17.6,6.3c11.2,0,25.2-4.9,39.6-13.8c14.3,8.9,28.3,13.8,39.6,13.8
-			c7.2,0,13.3-2,17.6-6.3C159.3,118.5,160.2,105.5,154.5,89.3z"/>
-		<circle class="st1" cx="142.9" cy="68.8" r="5.1"/>
-		<path class="st1" d="M98.9,45c-0.1,0-0.2,0.1-0.2,0.2l0,0L98.9,45z"/>
-		<path class="st2" d="M69,82.1c-3.2,0-3.9-2.6-3.9-5.7s0.7-5.7,3.9-5.7V82.1z M118.7,82.9c3.2,0,3.9-2.6,3.9-5.7s-0.7-5.7-3.9-5.7
-			V82.9z"/>
-		<path class="st2" d="M113.1,65.8v18.4c0,10.1-7.8,18.5-17.9,19.3c-0.5,0-1,0.1-1.4,0.1c-10.7,0-19.3-8.7-19.3-19.3V65.8H113.1z"/>
-		<circle class="st3" cx="86" cy="81.4" r="1.6"/>
-		<circle class="st3" cx="99.9" cy="81.4" r="1.6"/>
-		<path class="st3" d="M97.8,88.1c0,2.8-2.2,5-5,5s-5-2.2-5-5"/>
-		<path class="st1" d="M116.4,83.9c0-0.3-0.2-0.5-0.5-0.5c-0.2,0-0.5,0.2-0.5,0.4c0,0,0,0,0,0c-0.1,5.2-2.4,8.9-6.8,11
-			c-2,0.9-4.1,1.5-6.3,1.6c-0.3-2.1-2.2-3.6-4.3-3.4s-3.6,2.2-3.4,4.3s2.2,3.6,4.3,3.4c1.8-0.2,3.2-1.6,3.4-3.4
-			C104.7,97.3,116.2,96,116.4,83.9z"/>
-		<g class="st4">
-			<path class="st3" d="M113.1,73.9v8.9c0,0.8,0.6,1.4,1.4,1.4h2.7c0.8,0,1.4-0.6,1.4-1.4v-9.9"/>
-			<path class="st3" d="M70.4,68.5L70.4,68.5c-0.8,0-1.4,0.7-1.4,1.5v12.7c0,0.8,0.6,1.4,1.4,1.4h2.7c0.8,0,1.4-0.6,1.4-1.4V68.5
-				H70.4z"/>
+<title>ReactEmpty</title>
+<path class="st0" d="M86.5,62.5c0,0,46.9-30.9,70.7-21.5s40,87.4-26.1,122.4S35.2,122.2,35,108.7C34.7,95.6,35,64.4,86.5,62.5z"/>
+<ellipse class="st1" cx="156" cy="31.7" rx="3.5" ry="3.5"/>
+<ellipse class="st2" cx="79.6" cy="29.6" rx="2.1" ry="2.1"/>
+<line class="st3" x1="23.3" y1="100.9" x2="22.9" y2="107"/>
+<line class="st3" x1="20" y1="103.8" x2="26.2" y2="104.1"/>
+<ellipse class="st4" cx="165.9" cy="154.1" rx="2.4" ry="2.4"/>
+<line class="st2" x1="175.6" y1="117.2" x2="179.8" y2="121.8"/>
+<line class="st2" x1="175.4" y1="121.6" x2="180" y2="117.4"/>
+<path class="st5" d="M25.9,124.2c0,0,28.6-2.9,35.8-25.2s29.5-22.8,35.6-24.2l0.7-0.2c6.6-2.4,11.3-8.9,11.3-16.3
+	c0-9.5-7.7-17.2-17.2-17.2s-17.1,7.7-17.1,17.2c0,8.2,5.7,15,13.4,16.7l0,0c2.1,0.7,4.5,1.6,7.3,1.9c2.2,0.2,4.5,0.3,6.8,0.2
+	c5.3-0.2,18.5,2.2,23.3,13.8c6.3,15.4,16.9,30.2,36.4,30.2c0,0-44.3,6.3-51.1-23c0,0,3.2,1.1,0,15.1s-18.7,28.8-44.6,14.8
+	s-30.6,18.7-5,22.3s58.3-18.4,72.7-22s24.1,5,24.1,12.2c0,20.2-79.2,33.1-83.2-42.5"/>
+<circle class="st6" cx="97.2" cy="58.1" r="17.1"/>
+<g class="st7">
+	<g>
+		<defs>
+			<circle id="SVGID_1_" cx="147.6" cy="58.7" r="12.7"/>
+		</defs>
+		<clipPath id="SVGID_2_">
+			<use xlink:href="#SVGID_1_"  style="overflow:visible;"/>
+		</clipPath>
+		<g class="st8">
+			<line class="st9" x1="162.5" y1="47.7" x2="158.4" y2="73.7"/>
+			<line class="st9" x1="160.9" y1="47.5" x2="156.8" y2="73.5"/>
+			<line class="st9" x1="159.3" y1="47.2" x2="155.2" y2="73.2"/>
+			<line class="st9" x1="157.7" y1="47" x2="153.6" y2="73"/>
+			<line class="st9" x1="156.1" y1="46.7" x2="151.9" y2="72.7"/>
+			<line class="st9" x1="154.5" y1="46.5" x2="150.4" y2="72.4"/>
+			<line class="st9" x1="152.9" y1="46.2" x2="148.7" y2="72.2"/>
+			<line class="st9" x1="151.3" y1="45.9" x2="147.1" y2="71.9"/>
+			<line class="st9" x1="149.7" y1="45.7" x2="145.5" y2="71.7"/>
+			<line class="st9" x1="148.1" y1="45.4" x2="143.9" y2="71.4"/>
+			<line class="st9" x1="146.5" y1="45.2" x2="142.3" y2="71.2"/>
+			<line class="st9" x1="144.9" y1="44.9" x2="140.7" y2="70.9"/>
+			<line class="st9" x1="143.2" y1="44.7" x2="139.1" y2="70.7"/>
+			<line class="st9" x1="141.6" y1="44.4" x2="137.5" y2="70.4"/>
+			<line class="st9" x1="140" y1="44.2" x2="135.9" y2="70.2"/>
+			<line class="st9" x1="138.4" y1="43.9" x2="134.3" y2="69.9"/>
+			<line class="st9" x1="136.8" y1="43.6" x2="132.7" y2="69.6"/>
 		</g>
-		<path class="st1" d="M126.5,69.5C126.5,69.5,126.5,69.5,126.5,69.5c-0.6,3.9-4.2,6.6-8,6c-0.3,0-0.5-0.1-0.8-0.2
-			c-1.5,1.4-3.6,2.1-5.7,1.8c-3.3-0.5-5.8-3.4-5.9-6.7c-2.7,3.8-8.1,4.7-11.9,2c-1-0.7-1.9-1.7-2.5-2.8c-1.6,1.3-4,1.1-5.4-0.5
-			c-0.6-0.8-0.9-1.8-0.8-2.8c-1.9,2.9-5.4,4.5-8.9,4c-5.1-0.8-8.5-5.6-7.7-10.6c0.5-3.1,2.5-5.7,5.3-7c-0.8-3.3,1.2-6.7,4.5-7.5
-			c0.7-0.2,1.5-0.2,2.3-0.1c0.5,0.1,1,0.2,1.5,0.4c0.4-0.8,0.8-1.5,1.4-2.2c3.2-3.8,8.9-4.3,12.7-1.1c0.4,0.4,0.8,0.8,1.2,1.2
-			c0.7-0.9,1.5-1.8,2.4-2.4c1.9-1.3,4.1-1.8,6.4-1.5c5,0.8,8.4,5.5,7.7,10.5c0,0.1,0,0.2,0,0.2c0.6-0.1,1.2-0.1,1.9,0
-			c3.8,0.6,6.5,4.1,5.9,8c0,0,0,0,0,0c-0.1,0.4-0.2,0.8-0.3,1.2c-0.2,0.7-0.6,1.4-1,2C124.7,62.2,127.1,65.7,126.5,69.5z"/>
-		<path class="st5" d="M122.2,58.3c-0.1,0.4-0.2,0.8-0.3,1.2c-9.7-2.4-17.7-9.2-21.4-18.5c1.9-1.3,4.1-1.8,6.4-1.5
-			c5,0.8,8.4,5.5,7.7,10.5c0,0.1,0,0.2,0,0.2c0.6-0.1,1.2-0.1,1.9,0C120.2,50.9,122.8,54.4,122.2,58.3
-			C122.2,58.3,122.2,58.3,122.2,58.3z"/>
-		<path class="st1" d="M20.3,3c-4.2,0-7.5,3.4-7.6,7.6c0,0.6,0.1,1.2,0.2,1.8v0.1c0.9,3.8,7.3,11.9,7.3,11.9l0,0
-			c0,0,6.5-8.1,7.3-11.9v-0.1c0.1-0.6,0.2-1.2,0.2-1.8C27.8,6.4,24.4,3,20.3,3z M20.3,13c-1.5,0-2.8-1.2-2.8-2.8
-			c0-1.5,1.2-2.8,2.8-2.8c1.5,0,2.8,1.2,2.8,2.8c0,0,0,0,0,0c0.1,1.5-1.1,2.8-2.7,2.9C20.3,13.1,20.3,13.1,20.3,13L20.3,13z"/>
-		<path class="st1" d="M193.7,58h-14.8c-0.4,0-0.7,0.3-0.7,0.7v9.4h-9.4c-0.4,0-0.7,0.3-0.7,0.7v14.8c0,0.4,0.3,0.7,0.7,0.7h14.8
-			c0.4,0,0.7-0.3,0.7-0.7l0,0v-9.3h9.4c0.4,0,0.7-0.3,0.7-0.7l0,0V58.8C194.4,58.3,194.1,58,193.7,58C193.7,58,193.7,58,193.7,58z
-			 M193,72.8h-13.4V59.5H193V72.8z"/>
-		<path class="st6" d="M176,71L176,71c-0.3,0-0.6,0.2-0.7,0.5l-2.3,5.7l0,0l-1.4,3.5c-0.1,0.4,0,0.8,0.4,0.9c0.4,0.1,0.8,0,0.9-0.4
-			c0,0,0,0,0,0l1.2-3h3.3l1.1,3c0.1,0.3,0.4,0.5,0.7,0.5c0.1,0,0.2,0,0.2,0c0.4-0.1,0.6-0.5,0.4-0.9l-3.3-9.2
-			C176.5,71.2,176.3,71,176,71z M174.8,76.7l1.2-3l1.1,3H174.8z"/>
-		<path class="st1" d="M181.8,63.5h0.6c0.5,1.7,1.3,3.2,2.5,4.4c-0.6,0.3-1.2,0.6-1.9,0.8c-0.4,0.1-0.6,0.5-0.5,0.9
-			c0.1,0.3,0.4,0.5,0.7,0.5c0.1,0,0.1,0,0.2,0c0.9-0.3,1.7-0.7,2.5-1.1c1.3,1.1,2.7,2,4.2,2.6c0.1,0,0.2,0,0.3,0
-			c0.3,0,0.6-0.2,0.7-0.4c0.1-0.4,0-0.8-0.4-0.9c-1.3-0.5-2.5-1.2-3.5-2c1.1-0.8,2-1.9,2.6-3.2c0.1-0.4-0.1-0.8-0.4-0.9
-			c-0.4-0.1-0.8,0-0.9,0.4c0,0,0,0,0,0c-0.5,1.1-1.3,2-2.3,2.7c-1-1.1-1.8-2.3-2.2-3.7h6.9c0.4,0,0.7-0.3,0.7-0.7
-			c0-0.4-0.3-0.7-0.7-0.7h-9.1c-0.4,0-0.7,0.3-0.7,0.7C181,63.2,181.4,63.5,181.8,63.5L181.8,63.5z"/>
 	</g>
+	<circle class="st9" cx="147.6" cy="58.7" r="12.7"/>
+</g>
+<g class="st7">
+	<g>
+		<defs>
+			<circle id="SVGID_3_" cx="34.3" cy="61.8" r="12.7"/>
+		</defs>
+		<clipPath id="SVGID_4_">
+			<use xlink:href="#SVGID_3_"  style="overflow:visible;"/>
+		</clipPath>
+		<g class="st10">
+			<line class="st9" x1="47.7" y1="50.6" x2="43.5" y2="76.6"/>
+			<line class="st9" x1="44.5" y1="50.1" x2="40.3" y2="76.1"/>
+			<line class="st9" x1="41.2" y1="49.6" x2="37.1" y2="75.6"/>
+			<line class="st9" x1="38" y1="49" x2="33.9" y2="75.1"/>
+			<line class="st9" x1="34.8" y1="48.5" x2="30.7" y2="74.5"/>
+			<line class="st9" x1="31.6" y1="48" x2="27.5" y2="74"/>
+			<line class="st9" x1="28.4" y1="47.5" x2="24.2" y2="73.5"/>
+			<line class="st9" x1="25.2" y1="47" x2="21" y2="73"/>
+		</g>
+	</g>
+	<circle class="st9" cx="34.3" cy="61.8" r="12.7"/>
 </g>
 </svg>

package/es/svg/utils.js

@@ -0,0 +1,14 @@
+import PropTypes from 'prop-types';
+export const emptyStatePropTypes = {
+  size: PropTypes.oneOf(['small', 'large']),
+  className: PropTypes.string,
+  alignHorizontal: PropTypes.bool,
+  dataId: PropTypes.string,
+  isRender: PropTypes.bool
+};
+export const emptyStateDefaultProps = {
+  size: 'large',
+  alignHorizontal: true,
+  isRender: true,
+  className: ''
+};

package/lib/Provider.js

@@ -0,0 +1,213 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _AppContainer = _interopRequireDefault(require("@zohodesk/components/lib/AppContainer/AppContainer"));
+
+var _Layout = require("@zohodesk/components/lib/Layout");
+
+var _Switch = _interopRequireDefault(require("@zohodesk/components/lib/Switch/Switch"));
+
+require("@zohodesk/components/assets/Appearance/default/mode/defaultMode.module.css");
+
+require("@zohodesk/components/assets/Appearance/dark/mode/darkMode.module.css");
+
+require("../assets/Appearance/default/themes/blue/blueDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/themes/green/greenDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/themes/red/redDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/mode/defaultEmptyStates.module.css");
+
+require("../assets/Appearance/dark/themes/blue/blueDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/themes/green/greenDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/themes/red/redDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/mode/darkEmptyStates.module.css");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var Provider = /*#__PURE__*/function (_React$Component) {
+  _inherits(Provider, _React$Component);
+
+  var _super = _createSuper(Provider);
+
+  function Provider(props) {
+    var _this;
+
+    _classCallCheck(this, Provider);
+
+    _this = _super.call(this, props);
+    _this.state = {
+      appearanceName: 'default',
+      themeName: 'blue'
+    };
+    _this.switchMode = _this.switchMode.bind(_assertThisInitialized(_this));
+    _this.setTheme = _this.setTheme.bind(_assertThisInitialized(_this));
+    return _this;
+  }
+
+  _createClass(Provider, [{
+    key: "switchMode",
+    value: function switchMode() {
+      var appearanceName = this.state.appearanceName;
+
+      if (appearanceName == 'default') {
+        this.setState({
+          appearanceName: 'dark'
+        });
+      } else {
+        this.setState({
+          appearanceName: 'default'
+        });
+      }
+    }
+  }, {
+    key: "setTheme",
+    value: function setTheme(theme) {
+      this.setState({
+        themeName: theme
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$state = this.state,
+          appearanceName = _this$state.appearanceName,
+          themeName = _this$state.themeName;
+      var themeClass = {
+        width: '20px',
+        height: '20px',
+        borderRadius: '3px',
+        display: 'flex',
+        border: '1px solid #ccc',
+        margin: '0 5px',
+        cursor: 'pointer',
+        backgroundColor: '#0a73eb'
+      };
+      var green = {
+        backgroundColor: '#26a942'
+      };
+      var red = {
+        backgroundColor: '#de3535'
+      };
+      var orange = {
+        backgroundColor: '#e57717'
+      };
+      var yellow = {
+        backgroundColor: '#e8b923'
+      };
+      return /*#__PURE__*/_react["default"].createElement(_AppContainer["default"], {
+        customProps: {
+          ExtraProps: {
+            'data-mode': appearanceName,
+            'data-theme': themeName
+          }
+        }
+      }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
+        scroll: "vertical"
+      }, this.props.children), /*#__PURE__*/_react["default"].createElement("div", {
+        style: {
+          position: 'fixed',
+          bottom: '0',
+          backgroundColor: '#272727',
+          padding: '10px',
+          borderRadius: '15px 15px 0 0',
+          minWidth: '100px',
+          textAlign: 'center',
+          left: '50%',
+          transform: 'translate(-50%)',
+          boxShadow: '0 0 3px #000',
+          fontSize: '12px',
+          zIndex: '3',
+          display: 'flex',
+          alignItems: 'center'
+        }
+      }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Switch["default"], {
+        id: "switchMode",
+        text: "Light/Night Mode",
+        labelSize: "small",
+        onChange: this.switchMode,
+        checked: appearanceName == 'dark'
+      })), /*#__PURE__*/_react["default"].createElement("div", {
+        style: {
+          display: 'flex'
+        }
+      }, /*#__PURE__*/_react["default"].createElement("span", {
+        title: "Blue Theme",
+        style: themeClass,
+        onClick: function onClick() {
+          return _this2.setTheme('blue');
+        }
+      }), /*#__PURE__*/_react["default"].createElement("span", {
+        title: "Green Theme",
+        style: Object.assign({}, themeClass, green),
+        onClick: function onClick() {
+          return _this2.setTheme('green');
+        }
+      }), /*#__PURE__*/_react["default"].createElement("span", {
+        title: "Red Theme",
+        style: Object.assign({}, themeClass, red),
+        onClick: function onClick() {
+          return _this2.setTheme('red');
+        }
+      }), /*#__PURE__*/_react["default"].createElement("span", {
+        title: "Orange Theme",
+        style: Object.assign({}, themeClass, orange),
+        onClick: function onClick() {
+          return _this2.setTheme('orange');
+        }
+      }), /*#__PURE__*/_react["default"].createElement("span", {
+        title: "Yellow Theme",
+        style: Object.assign({}, themeClass, yellow),
+        onClick: function onClick() {
+          return _this2.setTheme('yellow');
+        }
+      }))));
+    }
+  }]);
+
+  return Provider;
+}(_react["default"].Component);
+
+exports["default"] = Provider;

package/lib/index.js

@@ -1,52 +1,73 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _react = require('react');
-
-Object.defineProperty(exports, 'React', {
+Object.defineProperty(exports, "React", {
   enumerable: true,
   get: function get() {
-    return _interopRequireDefault(_react).default;
+    return _react["default"];
   }
 });
-
-var _reactDom = require('react-dom');
-
-Object.defineProperty(exports, 'ReactDOM', {
+Object.defineProperty(exports, "ReactDOM", {
   enumerable: true,
   get: function get() {
-    return _interopRequireDefault(_reactDom).default;
+    return _reactDom["default"];
   }
 });
-
-var _server = require('react-dom/server');
-
-Object.defineProperty(exports, 'renderToStaticMarkup', {
+Object.defineProperty(exports, "SVG", {
   enumerable: true,
   get: function get() {
-    return _server.renderToStaticMarkup;
+    return _SVG["default"];
   }
 });
-
-var _SVG = require('./svg/SVG');
-
-Object.defineProperty(exports, 'SVG', {
+Object.defineProperty(exports, "SVG__common", {
   enumerable: true,
   get: function get() {
-    return _interopRequireDefault(_SVG).default;
+    return _SVG__common["default"];
   }
 });
-
-var _SVG__default = require('./svg/docs/SVG__default.docs');
-
-Object.defineProperty(exports, 'SVG__default', {
+Object.defineProperty(exports, "SVG__emptystate", {
+  enumerable: true,
+  get: function get() {
+    return _SVG__default["default"];
+  }
+});
+Object.defineProperty(exports, "SVG__errorstate", {
   enumerable: true,
   get: function get() {
-    return _interopRequireDefault(_SVG__default).default;
+    return _SVG__errorstate["default"];
   }
 });
+Object.defineProperty(exports, "_provider", {
+  enumerable: true,
+  get: function get() {
+    return _Provider["default"];
+  }
+});
+Object.defineProperty(exports, "renderToStaticMarkup", {
+  enumerable: true,
+  get: function get() {
+    return _server.renderToStaticMarkup;
+  }
+});
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactDom = _interopRequireDefault(require("react-dom"));
+
+var _server = require("react-dom/server");
+
+require("@zohodesk/variables/assets/sizeVariables.module.css");
+
+var _Provider = _interopRequireDefault(require("./Provider"));
+
+var _SVG = _interopRequireDefault(require("./svg/SVG"));
+
+var _SVG__default = _interopRequireDefault(require("./svg/docs/SVG__default.docs"));
+
+var _SVG__common = _interopRequireDefault(require("./svg/docs/SVG__common.docs"));
+
+var _SVG__errorstate = _interopRequireDefault(require("./svg/docs/SVG__errorstate.docs"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }