@gov-design-system-ce/components 4.1.0-rc04 → 4.1.0

package/dist/collection/pages/Chip.js

@@ -4,43 +4,43 @@ class ChipPage extends HTMLElement {
 			<h1>Chips</h1>
 			<h4>Chips close</h4>
 			<div class="container-view">
-				<gov-chip color="primary" size="xs" type="solid" icon-left="basic/star">
-				<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+				<gov-chip color="primary" size="xs" type="solid" icon-start="basic/star">
+				<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 				Not clickable XS
 				<gov-button slot="right" color="primary" type="solid" accessible-label="Zavřít vše" size="xs">
-					<gov-icon slot="right-icon" name="x-lg"></gov-icon>
+					<gov-icon slot="icon-end" name="x-lg"></gov-icon>
 				</gov-button>
 			</gov-chip>
 			<gov-chip color="primary" size="s" type="solid">
 				Not clickable S
 				<gov-button slot="right" color="primary" type="solid" accessible-label="Zavřít vše" size="s">
-					<gov-icon slot="right-icon" name="x-lg"></gov-icon>
+					<gov-icon slot="icon-end" name="x-lg"></gov-icon>
 				</gov-button>
 			</gov-chip>
 			<gov-chip color="primary" size="m" type="solid">
 				<gov-button slot="left" color="primary" type="solid" accessible-label="Zavřít vše" size="m">
-					<gov-icon slot="right-icon" name="x-lg"></gov-icon>
+					<gov-icon slot="icon-end" name="x-lg"></gov-icon>
 				</gov-button>
 				Not clickable M
 			</gov-chip>
 			</div>
 			<h4>Primary</h4>
 			<div class="container-view">
-				<gov-chip color="primary" size="xs" type="solid"  icon-right="basic/star">
+				<gov-chip color="primary" size="xs" type="solid" icon-end="basic/star">
 					Chip
 				</gov-chip>
-				<gov-chip color="primary" size="s" type="solid" tag="button">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+				<gov-chip color="primary" size="s" type="solid">
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Not clickable
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip color="primary" size="s" type="solid">
 					Not clickable
 				</gov-chip>
 				<gov-chip color="primary" type="solid" size="m" href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Normal href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip color="primary" type="solid" size="m" disabled href="http://www.example.com/" target="_blank">
 					Disabled with href
@@ -51,11 +51,11 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="primary" tag="a" type="outlined" size="s">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Small Primary
 				</gov-chip>
 				<gov-chip color="primary" tag="button" type="outlined" size="m" disabled>
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Normal Primary
 				</gov-chip>
 			</div>
@@ -70,19 +70,19 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="secondary" size="s" type="solid">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Not clickable
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip tag="button" color="secondary" type="solid" size="m" href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Normal href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip color="secondary" type="solid" size="m" disabled href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Disabled with href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 			</div>
 			<div class="container-view">
@@ -90,11 +90,11 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="secondary" tag="a" type="outlined" size="s">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Small secondary
 				</gov-chip>
 				<gov-chip color="secondary" tag="button" type="outlined" size="m" disabled>
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Normal secondary
 				</gov-chip>
 			</div>
@@ -109,19 +109,19 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="neutral" size="s" type="solid">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Not clickable
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip tag="button" color="neutral" type="solid" size="m" href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Normal href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip color="neutral" type="solid" size="m" disabled href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Disabled with href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 			</div>
 			<div class="container-view">
@@ -129,11 +129,11 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="neutral" tag="a" type="outlined" size="s">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Small neutral
 				</gov-chip>
 				<gov-chip color="neutral" tag="button" type="outlined" size="m" disabled>
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Normal neutral
 				</gov-chip>
 			</div>
@@ -148,19 +148,19 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="error" size="s" type="solid">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Not clickable
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip tag="button" color="error" type="solid" size="m" href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Normal href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip color="error" type="solid" size="m" disabled href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Disabled with href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 			</div>
 			<div class="container-view">
@@ -168,11 +168,11 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="error" tag="a" type="outlined" size="s">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Small error
 				</gov-chip>
 				<gov-chip color="error" tag="button" type="outlined" size="m" disabled>
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Normal error
 				</gov-chip>
 			</div>
@@ -186,19 +186,19 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="success" size="s" type="solid">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Not clickable
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip tag="button" color="success" type="solid" size="m" href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Normal href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip color="success" type="solid" size="m" disabled href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Disabled with href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 			</div>
 			<div class="container-view">
@@ -206,11 +206,11 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="success" tag="a" type="outlined" size="s">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Small success
 				</gov-chip>
 				<gov-chip color="success" tag="button" type="outlined" size="m" disabled>
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Normal success
 				</gov-chip>
 			</div>
@@ -225,19 +225,19 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="warning" size="s" type="solid">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Not clickable
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip tag="button" color="warning" type="solid" size="m" href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Normal href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 				<gov-chip color="warning" type="solid" size="m" disabled href="http://www.example.com/">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 						Disabled with href
-					<gov-icon slot="right-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-end" name="star-fill"></gov-icon>
 				</gov-chip>
 			</div>
 			<div class="container-view">
@@ -245,11 +245,11 @@ class ChipPage extends HTMLElement {
 					Chip
 				</gov-chip>
 				<gov-chip color="warning" tag="a" type="outlined" size="s">
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Small warning
 				</gov-chip>
 				<gov-chip color="warning" tag="button" type="outlined" size="m" disabled>
-					<gov-icon slot="left-icon" name="star-fill"></gov-icon>
+					<gov-icon slot="icon-start" name="star-fill"></gov-icon>
 					Normal warning
 				</gov-chip>
 			</div>

package/dist/collection/pages/Chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../../../src/pages/Chip.ts"],"names":[],"mappings":"AAAA,MAAM,QAAS,SAAQ,WAAW;IACjC,iBAAiB;QAChB,IAAI,CAAC,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6PhB,CAAA;IACF,CAAC;CACD;AAED,IAAI,cAAc,CAAC,GAAG,CAAC,WAAW,CAAC,KAAK,SAAS,EAAE,CAAC;IACnD,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAA;AAC7C,CAAC","sourcesContent":["class ChipPage extends HTMLElement {\n\tconnectedCallback() {\n\t\tthis.innerHTML = `\n\t\t\t<h1>Chips</h1>\n\t\t\t<h4>Chips close</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"primary\" size=\"xs\" type=\"solid\" icon-left=\"basic/star\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\tNot clickable XS\n\t\t\t\t<gov-button slot=\"right\" color=\"primary\" type=\"solid\" accessible-label=\"Zavřít vše\" size=\"xs\">\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</gov-chip>\n\t\t\t<gov-chip color=\"primary\" size=\"s\" type=\"solid\">\n\t\t\t\tNot clickable S\n\t\t\t\t<gov-button slot=\"right\" color=\"primary\" type=\"solid\" accessible-label=\"Zavřít vše\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</gov-chip>\n\t\t\t<gov-chip color=\"primary\" size=\"m\" type=\"solid\">\n\t\t\t\t<gov-button slot=\"left\" color=\"primary\" type=\"solid\" accessible-label=\"Zavřít vše\" size=\"m\">\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\tNot clickable M\n\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<h4>Primary</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"primary\" size=\"xs\" type=\"solid\"  icon-right=\"basic/star\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" size=\"s\" type=\"solid\" tag=\"button\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" size=\"s\" type=\"solid\">\n\t\t\t\t\tNot clickable\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\" target=\"_blank\">\n\t\t\t\t\tDisabled with href\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"primary\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall Primary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal Primary\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<br>\n\n\t\t\t<h4>Secondary</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"secondary\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"secondary\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"secondary\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall secondary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal secondary\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<br>\n\n\t\t\t<h4>Neutral</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"neutral\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"neutral\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"neutral\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall neutral\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal neutral\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<br>\n\n\t\t\t<h4>Error</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"error\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"error\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"error\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall error\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal error\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\n\t\t\t<h4>Success</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"success\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"success\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"success\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall success\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal success\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<br>\n\n\t\t\t<h4>Warning</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"warning\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"warning\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"right-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"warning\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall warning\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal warning\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\nif (customElements.get('chip-page') === undefined) {\n\tcustomElements.define('chip-page', ChipPage)\n}\n"]}
+{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../../../src/pages/Chip.ts"],"names":[],"mappings":"AAAA,MAAM,QAAS,SAAQ,WAAW;IACjC,iBAAiB;QAChB,IAAI,CAAC,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6PhB,CAAA;IACF,CAAC;CACD;AAED,IAAI,cAAc,CAAC,GAAG,CAAC,WAAW,CAAC,KAAK,SAAS,EAAE,CAAC;IACnD,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAA;AAC7C,CAAC","sourcesContent":["class ChipPage extends HTMLElement {\n\tconnectedCallback() {\n\t\tthis.innerHTML = `\n\t\t\t<h1>Chips</h1>\n\t\t\t<h4>Chips close</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"primary\" size=\"xs\" type=\"solid\" icon-start=\"basic/star\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\tNot clickable XS\n\t\t\t\t<gov-button slot=\"right\" color=\"primary\" type=\"solid\" accessible-label=\"Zavřít vše\" size=\"xs\">\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"x-lg\"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</gov-chip>\n\t\t\t<gov-chip color=\"primary\" size=\"s\" type=\"solid\">\n\t\t\t\tNot clickable S\n\t\t\t\t<gov-button slot=\"right\" color=\"primary\" type=\"solid\" accessible-label=\"Zavřít vše\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"x-lg\"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</gov-chip>\n\t\t\t<gov-chip color=\"primary\" size=\"m\" type=\"solid\">\n\t\t\t\t<gov-button slot=\"left\" color=\"primary\" type=\"solid\" accessible-label=\"Zavřít vše\" size=\"m\">\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"x-lg\"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\tNot clickable M\n\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<h4>Primary</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"primary\" size=\"xs\" type=\"solid\" icon-end=\"basic/star\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" size=\"s\" type=\"solid\">\n\t\t\t\t\tNot clickable\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\" target=\"_blank\">\n\t\t\t\t\tDisabled with href\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"primary\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall Primary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"primary\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal Primary\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<br>\n\n\t\t\t<h4>Secondary</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"secondary\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"secondary\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"secondary\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall secondary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"secondary\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal secondary\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<br>\n\n\t\t\t<h4>Neutral</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"neutral\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"neutral\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"neutral\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall neutral\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"neutral\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal neutral\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<br>\n\n\t\t\t<h4>Error</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"error\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"error\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"error\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall error\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"error\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal error\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\n\t\t\t<h4>Success</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"success\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"success\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"success\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall success\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"success\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal success\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<br>\n\n\t\t\t<h4>Warning</h4>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"warning\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" size=\"xs\" type=\"solid\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" size=\"s\" type=\"solid\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag=\"button\" color=\"warning\" type=\"solid\" size=\"m\" href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" type=\"solid\" size=\"m\" disabled href=\"http://www.example.com/\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"star-fill\"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<div class=\"container-view\">\n\t\t\t\t<gov-chip color=\"warning\" tag=\"a\" type=\"outlined\" size=\"xs\">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" tag=\"a\" type=\"outlined\" size=\"s\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tSmall warning\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip color=\"warning\" tag=\"button\" type=\"outlined\" size=\"m\" disabled>\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"star-fill\"></gov-icon>\n\t\t\t\t\tNormal warning\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\nif (customElements.get('chip-page') === undefined) {\n\tcustomElements.define('chip-page', ChipPage)\n}\n"]}

package/dist/collection/pages/ControlGroup.js

@@ -5,10 +5,10 @@ class ControlGroupPage extends HTMLElement {
 
 		<gov-control-group>
 			<gov-button color="primary" type="outlined" size="m">
-				<gov-icon slot="left-icon" name="chevron-up"></gov-icon>
+				<gov-icon slot="icon-start" name="chevron-up"></gov-icon>
 			</gov-button>
 			<gov-button color="primary" type="outlined" size="m">
-				<gov-icon slot="left-icon" name="chevron-down"></gov-icon>
+				<gov-icon slot="icon-start" name="chevron-down"></gov-icon>
 			</gov-button>
 			<gov-form-select name="test-me" color="primary" size="m">
 				<option value="" selected>Placeholder</option>
@@ -17,7 +17,7 @@ class ControlGroupPage extends HTMLElement {
 				<option value="d">Value D</option>
 			</gov-form-select>
 			<gov-button color="primary" type="solid" size="m">
-				<gov-icon slot="left-icon" name="x-lg"></gov-icon>
+				<gov-icon slot="icon-start" name="x-lg"></gov-icon>
 			</gov-button>
 		</gov-control-group>
 
@@ -30,12 +30,12 @@ class ControlGroupPage extends HTMLElement {
 				<option value="d">Value D</option>
 			</gov-form-select>
 			<gov-button color="neutral" type="solid" size="m" disabled>
-				<gov-icon slot="left-icon" name="x-lg"></gov-icon>
+				<gov-icon slot="icon-start" name="x-lg"></gov-icon>
 			</gov-button>
 		</gov-control-group>
 
 		<br><br>
-		<gov-control-group invalid>
+		<gov-control-group invalid fit-content>
 			<gov-form-select name="test-me" color="error" size="m" invalid>
 				<option value="" selected>Placeholder</option>
 				<option value="b">Value B</option>
@@ -52,31 +52,31 @@ class ControlGroupPage extends HTMLElement {
 		<gov-control-group>
 			<gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" size="s"></gov-form-input>
 			<gov-button color="primary" type="outlined" size="s">
-				<gov-icon slot="left-icon" name="chevron-up"></gov-icon>
+				<gov-icon slot="icon-start" name="chevron-up"></gov-icon>
 			</gov-button>
 			<gov-button color="primary" type="outlined" size="s">
-				<gov-icon slot="left-icon" name="chevron-down"></gov-icon>
+				<gov-icon slot="icon-start" name="chevron-down"></gov-icon>
 			</gov-button>
 			<gov-button color="primary" type="outlined" size="s">
-				<gov-icon slot="left-icon" name="x-lg"></gov-icon>
+				<gov-icon slot="icon-start" name="x-lg"></gov-icon>
 			</gov-button>
 			<gov-dropdown position="right">
-				<gov-button color="primary" size="s">
+				<gov-button color="primary" type="solid" size="s">
 					Více
 				</gov-button>
 				<ul slot="list">
 					<li>
-						<gov-button color="primary" type="subtle" size="s">
+						<gov-button color="primary" type="base" size="s" expanded>
 							A další nabídka
 						</gov-button>
 					</li>
 					<li>
-						<gov-button color="primary" type="subtle" size="s">
+						<gov-button color="primary" type="base" size="s" expanded>
 							A další nabídka
 						</gov-button>
 					</li>
 					<li>
-						<gov-button color="primary" type="subtle" size="s">
+						<gov-button color="primary" type="base" size="s" expanded>
 							A další nabídka
 						</gov-button>
 					</li>
@@ -92,13 +92,13 @@ class ControlGroupPage extends HTMLElement {
 				<option value="d">Value D</option>
 			</gov-form-select>
 			<gov-button color="primary" type="solid" size="m">
-				<gov-icon slot="left-icon" name="x-lg"></gov-icon>
+				<gov-icon slot="icon-start" name="x-lg"></gov-icon>
 			</gov-button>
 		</gov-control-group>
 		<br />
 		<gov-control-group fit-content no-border>
 			<gov-button color="primary" type="outlined" size="l">
-				<gov-icon slot="left-icon" name="gear"></gov-icon>
+				<gov-icon slot="icon-start" name="gear"></gov-icon>
 			</gov-button>
 			<gov-form-file name="test-me-c" accept="image/*" max-file-size="1024">
 				<gov-button color="primary" type="outlined" size="l" tabindex="-1">
@@ -106,16 +106,16 @@ class ControlGroupPage extends HTMLElement {
 				</gov-button>
 			</gov-form-file>
 			<gov-button color="primary" type="outlined" size="l">
-				<gov-icon slot="left-icon" name="x-lg"></gov-icon>
+				<gov-icon slot="icon-start" name="x-lg"></gov-icon>
 			</gov-button>
 		</gov-control-group>
 		<br><br>
 		<gov-control-group color="primary" no-border>
 			<gov-button color="primary" type="outlined" size="xl">
-				<gov-icon slot="left-icon" name="chevron-up"></gov-icon>
+				<gov-icon slot="icon-start" name="chevron-up"></gov-icon>
 			</gov-button>
 			<gov-button color="primary" type="outlined" size="xl">
-				<gov-icon slot="left-icon" name="chevron-down"></gov-icon>
+				<gov-icon slot="icon-start" name="chevron-down"></gov-icon>
 			</gov-button>
 			<gov-form-select name="test-me" size="xl">
 				<option value="" selected>Placeholder</option>
@@ -124,7 +124,7 @@ class ControlGroupPage extends HTMLElement {
 				<option value="d">Value D</option>
 			</gov-form-select>
 			<gov-button color="primary" type="outlined" size="xl">
-				<gov-icon slot="left-icon" name="x-lg"></gov-icon>
+				<gov-icon slot="icon-start" name="x-lg"></gov-icon>
 			</gov-button>
 		</gov-control-group>
 		`;

package/dist/collection/pages/ControlGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ControlGroup.js","sourceRoot":"","sources":["../../../../../src/pages/ControlGroup.ts"],"names":[],"mappings":"AAAA,MAAM,gBAAiB,SAAQ,WAAW;IACzC,iBAAiB;QAChB,IAAI,CAAC,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+HhB,CAAA;IACF,CAAC;CACD;AAED,IAAI,cAAc,CAAC,GAAG,CAAC,oBAAoB,CAAC,KAAK,SAAS,EAAE,CAAC;IAC5D,cAAc,CAAC,MAAM,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAA;AAC9D,CAAC","sourcesContent":["class ControlGroupPage extends HTMLElement {\n\tconnectedCallback() {\n\t\tthis.innerHTML = `\n\t\t<h2>Control Group</h2>\n\n\t\t<gov-control-group>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"chevron-up\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"chevron-down\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-form-select name=\"test-me\" color=\"primary\" size=\"m\">\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-button color=\"primary\" type=\"solid\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\n\t\t<br />\n\t\t<gov-control-group disabled fit-content>\n\t\t\t<gov-form-select name=\"test-me\" color=\"neutral\" size=\"m\" disabled>\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-button color=\"neutral\" type=\"solid\" size=\"m\" disabled>\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\n\t\t<br><br>\n\t\t<gov-control-group invalid>\n\t\t\t<gov-form-select name=\"test-me\" color=\"error\" size=\"m\" invalid>\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-form-input type=\"number\" id=\"kapr\" name=\"test-me\" placeholder=\"Placeholder\" size=\"m\"></gov-form-input>\n\t\t\t<gov-button color=\"error\" type=\"solid\" size=\"m\">\n\t\t\t\tOdeslat\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\t\t<br><br>\n\n\t\t<gov-control-group>\n\t\t\t<gov-form-input type=\"number\" id=\"kapr\" name=\"test-me\" placeholder=\"Placeholder\" size=\"s\"></gov-form-input>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"s\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"chevron-up\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"s\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"chevron-down\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"s\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-dropdown position=\"right\">\n\t\t\t\t<gov-button color=\"primary\" size=\"s\">\n\t\t\t\t\tVíce\n\t\t\t\t</gov-button>\n\t\t\t\t<ul slot=\"list\">\n\t\t\t\t\t<li>\n\t\t\t\t\t\t<gov-button color=\"primary\" type=\"subtle\" size=\"s\">\n\t\t\t\t\t\t\tA další nabídka\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</li>\n\t\t\t\t\t<li>\n\t\t\t\t\t\t<gov-button color=\"primary\" type=\"subtle\" size=\"s\">\n\t\t\t\t\t\t\tA další nabídka\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</li>\n\t\t\t\t\t<li>\n\t\t\t\t\t\t<gov-button color=\"primary\" type=\"subtle\" size=\"s\">\n\t\t\t\t\t\t\tA další nabídka\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</li>\n\t\t\t\t</ul>\n\t\t\t</gov-dropdown>\n\t\t</gov-control-group>\n\t\t<br />\n\t\t<gov-control-group color=\"primary\" no-border>\n\t\t\t<gov-form-select name=\"test-me\" size=\"m\">\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-button color=\"primary\" type=\"solid\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\t\t<br />\n\t\t<gov-control-group fit-content no-border>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"l\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"gear\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-form-file name=\"test-me-c\" accept=\"image/*\" max-file-size=\"1024\">\n\t\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"l\" tabindex=\"-1\">\n\t\t\t\t\tNahrát soubor ze zařízení\n\t\t\t\t</gov-button>\n\t\t\t</gov-form-file>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"l\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\t\t<br><br>\n\t\t<gov-control-group color=\"primary\" no-border>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"xl\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"chevron-up\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"xl\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"chevron-down\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-form-select name=\"test-me\" size=\"xl\">\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"xl\">\n\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\t\t`\n\t}\n}\n\nif (customElements.get('control-group-page') === undefined) {\n\tcustomElements.define('control-group-page', ControlGroupPage)\n}\n"]}
+{"version":3,"file":"ControlGroup.js","sourceRoot":"","sources":["../../../../../src/pages/ControlGroup.ts"],"names":[],"mappings":"AAAA,MAAM,gBAAiB,SAAQ,WAAW;IACzC,iBAAiB;QAChB,IAAI,CAAC,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+HhB,CAAA;IACF,CAAC;CACD;AAED,IAAI,cAAc,CAAC,GAAG,CAAC,oBAAoB,CAAC,KAAK,SAAS,EAAE,CAAC;IAC5D,cAAc,CAAC,MAAM,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAA;AAC9D,CAAC","sourcesContent":["class ControlGroupPage extends HTMLElement {\n\tconnectedCallback() {\n\t\tthis.innerHTML = `\n\t\t<h2>Control Group</h2>\n\n\t\t<gov-control-group>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"chevron-up\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"chevron-down\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-form-select name=\"test-me\" color=\"primary\" size=\"m\">\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-button color=\"primary\" type=\"solid\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\n\t\t<br />\n\t\t<gov-control-group disabled fit-content>\n\t\t\t<gov-form-select name=\"test-me\" color=\"neutral\" size=\"m\" disabled>\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-button color=\"neutral\" type=\"solid\" size=\"m\" disabled>\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\n\t\t<br><br>\n\t\t<gov-control-group invalid fit-content>\n\t\t\t<gov-form-select name=\"test-me\" color=\"error\" size=\"m\" invalid>\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-form-input type=\"number\" id=\"kapr\" name=\"test-me\" placeholder=\"Placeholder\" size=\"m\"></gov-form-input>\n\t\t\t<gov-button color=\"error\" type=\"solid\" size=\"m\">\n\t\t\t\tOdeslat\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\t\t<br><br>\n\n\t\t<gov-control-group>\n\t\t\t<gov-form-input type=\"number\" id=\"kapr\" name=\"test-me\" placeholder=\"Placeholder\" size=\"s\"></gov-form-input>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"s\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"chevron-up\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"s\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"chevron-down\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"s\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-dropdown position=\"right\">\n\t\t\t\t<gov-button color=\"primary\" type=\"solid\" size=\"s\">\n\t\t\t\t\tVíce\n\t\t\t\t</gov-button>\n\t\t\t\t<ul slot=\"list\">\n\t\t\t\t\t<li>\n\t\t\t\t\t\t<gov-button color=\"primary\" type=\"base\" size=\"s\" expanded>\n\t\t\t\t\t\t\tA další nabídka\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</li>\n\t\t\t\t\t<li>\n\t\t\t\t\t\t<gov-button color=\"primary\" type=\"base\" size=\"s\" expanded>\n\t\t\t\t\t\t\tA další nabídka\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</li>\n\t\t\t\t\t<li>\n\t\t\t\t\t\t<gov-button color=\"primary\" type=\"base\" size=\"s\" expanded>\n\t\t\t\t\t\t\tA další nabídka\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</li>\n\t\t\t\t</ul>\n\t\t\t</gov-dropdown>\n\t\t</gov-control-group>\n\t\t<br />\n\t\t<gov-control-group color=\"primary\" no-border>\n\t\t\t<gov-form-select name=\"test-me\" size=\"m\">\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-button color=\"primary\" type=\"solid\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\t\t<br />\n\t\t<gov-control-group fit-content no-border>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"l\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"gear\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-form-file name=\"test-me-c\" accept=\"image/*\" max-file-size=\"1024\">\n\t\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"l\" tabindex=\"-1\">\n\t\t\t\t\tNahrát soubor ze zařízení\n\t\t\t\t</gov-button>\n\t\t\t</gov-form-file>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"l\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\t\t<br><br>\n\t\t<gov-control-group color=\"primary\" no-border>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"xl\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"chevron-up\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"xl\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"chevron-down\"></gov-icon>\n\t\t\t</gov-button>\n\t\t\t<gov-form-select name=\"test-me\" size=\"xl\">\n\t\t\t\t<option value=\"\" selected>Placeholder</option>\n\t\t\t\t<option value=\"b\">Value B</option>\n\t\t\t\t<option value=\"c\">Value C</option>\n\t\t\t\t<option value=\"d\">Value D</option>\n\t\t\t</gov-form-select>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"xl\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"x-lg\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\t\t`\n\t}\n}\n\nif (customElements.get('control-group-page') === undefined) {\n\tcustomElements.define('control-group-page', ControlGroupPage)\n}\n"]}

package/dist/collection/pages/Dialog.js

@@ -33,7 +33,7 @@ class DialogPage extends HTMLElement {
 			<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>
 
 			<gov-dialog id="dialog" accessible-close-label="Zavřít modal žádosti o dávku">
-				<gov-icon slot="icon" name="info" class="gov-color--primary-600"></gov-icon>
+				<gov-icon slot="icon" name="info-circle" class="gov-color--primary-600"></gov-icon>
 				<h3 slot="title">Podání daňového přiznání</h3>
 				<h3>Obsah dialogového okna</h3>
 				<p>Bude tvořen libovolnými komponentami</p>

package/dist/collection/pages/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../../src/pages/Dialog.ts"],"names":[],"mappings":"AAAA,MAAM,UAAW,SAAQ,WAAW;IACnC,iBAAiB;QAChB,UAAU,CAAC;YACV,QAAQ,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,gBAAgB,CAAC,WAAW,EAAE;gBAC5D,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;YAC/D,CAAC,CAAC,CAAA;QACH,CAAC,EAAE,GAAG,CAAC,CAAA;QACP,IAAI,CAAC,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0ChB,CAAA;IACF,CAAC;CACD;AAED,IAAI,cAAc,CAAC,GAAG,CAAC,aAAa,CAAC,KAAK,SAAS,EAAE,CAAC;IACrD,cAAc,CAAC,MAAM,CAAC,aAAa,EAAE,UAAU,CAAC,CAAA;AACjD,CAAC","sourcesContent":["class DialogPage extends HTMLElement {\n\tconnectedCallback() {\n\t\tsetTimeout(function () {\n\t\t\tdocument.getElementById('btn').addEventListener('gov-click', function () {\n\t\t\t\tdocument.getElementById('dialog').setAttribute('open', 'true')\n\t\t\t})\n\t\t}, 500)\n\t\tthis.innerHTML = `\n\t\t\t<h2>Dialog</h2>\n\t\t\t<gov-button color=\"primary\" size=\"m\" type=\"solid\" id=\"btn\" wcag-label=\"Zobrazit formulář o výši dávky\">Vyplnit formulář</gov-button>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\n\t\t\t<gov-dialog id=\"dialog\" accessible-close-label=\"Zavřít modal žádosti o dávku\">\n\t\t\t\t<gov-icon slot=\"icon\" name=\"info\" class=\"gov-color--primary-600\"></gov-icon>\n\t\t\t\t<h3 slot=\"title\">Podání daňového přiznání</h3>\n\t\t\t\t<h3>Obsah dialogového okna</h3>\n\t\t\t\t<p>Bude tvořen libovolnými komponentami</p>\n\t\t\t\t<br>\n\t\t\t\t<p>\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis eros libero, pulvinar vitae tempor at, laoreet quis mi. Vivamus vitae orci mi. Sed eget nisi convallis, condimentum diam a, fermentum risus. Proin vulputate pretium nisi sit amet commodo. Fusce ac magna velit. Maecenas sit amet sem quis arcu lobortis varius a non urna. Morbi ex neque, tempor bibendum sagittis vitae, vulputate ut nibh. Vestibulum sit amet pretium metus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut molestie varius nisi, sed mattis quam mollis vulputate. Morbi semper, purus sed ornare sodales, risus tellus porta massa, et eleifend erat diam vitae ex.\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\tSuspendisse quis justo nibh. Aenean id purus mattis, posuere urna a, blandit magna. Aenean a ante eleifend, ornare ipsum quis, bibendum mauris. Integer eget posuere sem, in tincidunt quam. Phasellus massa erat, sodales vel hendrerit vitae, ultrices quis dolor. Fusce id vestibulum sem, eu pretium sem. Praesent lacinia, odio non aliquam cursus, arcu ipsum ornare diam, vitae pharetra erat dui non velit. Quisque eu tempus mi. Nam a diam mauris.\n\t\t\t\t</p>\n\t\t\t\t<gov-button slot=\"footer\" size=\"l\" color=\"primary\" type=\"base\">Zrušit</gov-button>\n                <gov-button slot=\"footer\" size=\"l\" color=\"primary\" type=\"solid\">Pokračovat</gov-button>\n\t\t\t</gov-dialog>\n\t\t`\n\t}\n}\n\nif (customElements.get('dialog-page') === undefined) {\n\tcustomElements.define('dialog-page', DialogPage)\n}\n"]}
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../../src/pages/Dialog.ts"],"names":[],"mappings":"AAAA,MAAM,UAAW,SAAQ,WAAW;IACnC,iBAAiB;QAChB,UAAU,CAAC;YACV,QAAQ,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,gBAAgB,CAAC,WAAW,EAAE;gBAC5D,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;YAC/D,CAAC,CAAC,CAAA;QACH,CAAC,EAAE,GAAG,CAAC,CAAA;QACP,IAAI,CAAC,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0ChB,CAAA;IACF,CAAC;CACD;AAED,IAAI,cAAc,CAAC,GAAG,CAAC,aAAa,CAAC,KAAK,SAAS,EAAE,CAAC;IACrD,cAAc,CAAC,MAAM,CAAC,aAAa,EAAE,UAAU,CAAC,CAAA;AACjD,CAAC","sourcesContent":["class DialogPage extends HTMLElement {\n\tconnectedCallback() {\n\t\tsetTimeout(function () {\n\t\t\tdocument.getElementById('btn').addEventListener('gov-click', function () {\n\t\t\t\tdocument.getElementById('dialog').setAttribute('open', 'true')\n\t\t\t})\n\t\t}, 500)\n\t\tthis.innerHTML = `\n\t\t\t<h2>Dialog</h2>\n\t\t\t<gov-button color=\"primary\" size=\"m\" type=\"solid\" id=\"btn\" wcag-label=\"Zobrazit formulář o výši dávky\">Vyplnit formulář</gov-button>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\t\t\t<p>aspo idapo diopad siaspo dasipo dsaiopds iaposa ipodsai dpsoa isapdsoai pdso posadd</p>\n\n\t\t\t<gov-dialog id=\"dialog\" accessible-close-label=\"Zavřít modal žádosti o dávku\">\n\t\t\t\t<gov-icon slot=\"icon\" name=\"info-circle\" class=\"gov-color--primary-600\"></gov-icon>\n\t\t\t\t<h3 slot=\"title\">Podání daňového přiznání</h3>\n\t\t\t\t<h3>Obsah dialogového okna</h3>\n\t\t\t\t<p>Bude tvořen libovolnými komponentami</p>\n\t\t\t\t<br>\n\t\t\t\t<p>\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Duis eros libero, pulvinar vitae tempor at, laoreet quis mi. Vivamus vitae orci mi. Sed eget nisi convallis, condimentum diam a, fermentum risus. Proin vulputate pretium nisi sit amet commodo. Fusce ac magna velit. Maecenas sit amet sem quis arcu lobortis varius a non urna. Morbi ex neque, tempor bibendum sagittis vitae, vulputate ut nibh. Vestibulum sit amet pretium metus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut molestie varius nisi, sed mattis quam mollis vulputate. Morbi semper, purus sed ornare sodales, risus tellus porta massa, et eleifend erat diam vitae ex.\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\tSuspendisse quis justo nibh. Aenean id purus mattis, posuere urna a, blandit magna. Aenean a ante eleifend, ornare ipsum quis, bibendum mauris. Integer eget posuere sem, in tincidunt quam. Phasellus massa erat, sodales vel hendrerit vitae, ultrices quis dolor. Fusce id vestibulum sem, eu pretium sem. Praesent lacinia, odio non aliquam cursus, arcu ipsum ornare diam, vitae pharetra erat dui non velit. Quisque eu tempus mi. Nam a diam mauris.\n\t\t\t\t</p>\n\t\t\t\t<gov-button slot=\"footer\" size=\"l\" color=\"primary\" type=\"base\">Zrušit</gov-button>\n                <gov-button slot=\"footer\" size=\"l\" color=\"primary\" type=\"solid\">Pokračovat</gov-button>\n\t\t\t</gov-dialog>\n\t\t`\n\t}\n}\n\nif (customElements.get('dialog-page') === undefined) {\n\tcustomElements.define('dialog-page', DialogPage)\n}\n"]}