@gov-design-system-ce/components 4.2.7 → 4.2.9

package/dist/collection/pages/ControlGroup.js

@@ -57,7 +57,7 @@ class ControlGroupPage extends HTMLElement {
 			<gov-button color="primary" type="outlined" size="s">
 				<gov-icon slot="icon-start" name="chevron-down"></gov-icon>
 			</gov-button>
-			<gov-button color="primary" type="outlined" size="s">
+			<gov-button color="primary" type="solid" size="s">
 				<gov-icon slot="icon-start" name="x-lg"></gov-icon>
 			</gov-button>
 			<gov-dropdown position="right">
@@ -94,9 +94,12 @@ class ControlGroupPage extends HTMLElement {
 			<gov-button color="primary" type="solid" size="m">
 				<gov-icon slot="icon-start" name="x-lg"></gov-icon>
 			</gov-button>
+			<gov-button color="primary" type="solid" size="m">
+				<gov-icon slot="icon-start" name="search"></gov-icon>
+			</gov-button>
 		</gov-control-group>
 		<br />
-		<gov-control-group fit-content no-border>
+		<gov-control-group color="primary" fit-content no-inner-border>
 			<gov-button color="primary" type="outlined" size="l">
 				<gov-icon slot="icon-start" name="gear"></gov-icon>
 			</gov-button>
@@ -110,7 +113,7 @@ class ControlGroupPage extends HTMLElement {
 			</gov-button>
 		</gov-control-group>
 		<br><br>
-		<gov-control-group color="primary" no-border>
+		<gov-control-group color="neutral" no-inner-border>
 			<gov-button color="primary" type="outlined" size="xl">
 				<gov-icon slot="icon-start" name="chevron-up"></gov-icon>
 			</gov-button>
@@ -127,6 +130,94 @@ class ControlGroupPage extends HTMLElement {
 				<gov-icon slot="icon-start" name="x-lg"></gov-icon>
 			</gov-button>
 		</gov-control-group>
+
+		<br /><br />
+		<h3>Neutral</h3>
+		<gov-control-group color="neutral" fit-content>
+			<gov-button color="primary" type="base" size="m">
+				Button
+			</gov-button>
+			<gov-button color="primary" type="base" size="m">
+				<gov-icon slot="icon-start" name="info-circle"></gov-icon>
+			</gov-button>
+		</gov-control-group>
+
+		<br />
+		<h3>Primary</h3>
+		<gov-control-group color="primary" fit-content>
+			<gov-button color="primary" type="outlined" size="m">
+				Button
+			</gov-button>
+			<gov-dropdown position="left">
+				<gov-button color="primary" type="outlined" size="m">
+					<gov-icon slot="icon-start" name="chevron-down"></gov-icon>
+				</gov-button>
+				<ul slot="list" role="menu">
+					<li role="presentation">
+						<gov-button color="primary" type="base" size="l" expanded role="menuitem">
+							A další nabídka
+							<gov-icon slot="icon-end" name="search"></gov-icon>
+						</gov-button>
+					</li>
+					<li role="presentation">
+						<gov-button color="primary" type="base" size="l" expanded role="menuitem">
+							A další dlouhá nabídka
+							<gov-icon slot="icon-end" name="search"></gov-icon>
+						</gov-button>
+					</li>
+					<li role="presentation">
+						<gov-button color="primary" type="base" size="l" expanded role="menuitem">
+							A další
+							<gov-icon slot="icon-end" name="search"></gov-icon>
+						</gov-button>
+					</li>
+				</ul>
+			</gov-dropdown>
+		</gov-control-group>
+
+		<br />
+		<h3>Error</h3>
+		<gov-control-group color="error" fit-content>
+			<gov-button color="error" type="outlined" size="m">
+				Button
+			</gov-button>
+			<gov-button color="error" type="outlined" size="m">
+				<gov-icon slot="icon-start" name="gear"></gov-icon>
+			</gov-button>
+		</gov-control-group>
+
+		<br /><br />
+		<h3>No border</h3>
+		<gov-control-group no-border fit-content>
+			<gov-button color="primary" type="solid" size="m">
+				Button
+			</gov-button>
+			<gov-button color="primary" type="solid" size="m">
+				<gov-icon slot="icon-start" name="search"></gov-icon>
+			</gov-button>
+		</gov-control-group>
+
+		<br />
+		<h3>No inner border</h3>
+		<gov-control-group no-inner-border fit-content>
+			<gov-button color="warning" type="solid" size="m">
+				Button
+			</gov-button>
+			<gov-button color="warning" type="solid" size="m">
+				<gov-icon slot="icon-start" name="bookmarks"></gov-icon>
+			</gov-button>
+		</gov-control-group>
+
+		<br />
+		<h3>No border - No inner border</h3>
+		<gov-control-group no-border no-inner-border fit-content>
+			<gov-button color="warning" type="solid" size="m">
+				Button
+			</gov-button>
+			<gov-button color="warning" type="solid" size="m">
+				<gov-icon slot="icon-start" name="bookmarks"></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=\"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"]}
+{"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0NhB,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=\"solid\" 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\t<gov-button color=\"primary\" type=\"solid\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"search\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\t\t<br />\n\t\t<gov-control-group color=\"primary\" fit-content no-inner-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=\"neutral\" no-inner-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\n\t\t<br /><br />\n\t\t<h3>Neutral</h3>\n\t\t<gov-control-group color=\"neutral\" fit-content>\n\t\t\t<gov-button color=\"primary\" type=\"base\" size=\"m\">\n\t\t\t\tButton\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"base\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"info-circle\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\n\t\t<br />\n\t\t<h3>Primary</h3>\n\t\t<gov-control-group color=\"primary\" fit-content>\n\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"m\">\n\t\t\t\tButton\n\t\t\t</gov-button>\n\t\t\t<gov-dropdown position=\"left\">\n\t\t\t\t<gov-button color=\"primary\" type=\"outlined\" size=\"m\">\n\t\t\t\t\t<gov-icon slot=\"icon-start\" name=\"chevron-down\"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<ul slot=\"list\" role=\"menu\">\n\t\t\t\t\t<li role=\"presentation\">\n\t\t\t\t\t\t<gov-button color=\"primary\" type=\"base\" size=\"l\" expanded role=\"menuitem\">\n\t\t\t\t\t\t\tA další nabídka\n\t\t\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"search\"></gov-icon>\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</li>\n\t\t\t\t\t<li role=\"presentation\">\n\t\t\t\t\t\t<gov-button color=\"primary\" type=\"base\" size=\"l\" expanded role=\"menuitem\">\n\t\t\t\t\t\t\tA další dlouhá nabídka\n\t\t\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"search\"></gov-icon>\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</li>\n\t\t\t\t\t<li role=\"presentation\">\n\t\t\t\t\t\t<gov-button color=\"primary\" type=\"base\" size=\"l\" expanded role=\"menuitem\">\n\t\t\t\t\t\t\tA další\n\t\t\t\t\t\t\t<gov-icon slot=\"icon-end\" name=\"search\"></gov-icon>\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\n\t\t<br />\n\t\t<h3>Error</h3>\n\t\t<gov-control-group color=\"error\" fit-content>\n\t\t\t<gov-button color=\"error\" type=\"outlined\" size=\"m\">\n\t\t\t\tButton\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"error\" type=\"outlined\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"gear\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\n\t\t<br /><br />\n\t\t<h3>No border</h3>\n\t\t<gov-control-group no-border fit-content>\n\t\t\t<gov-button color=\"primary\" type=\"solid\" size=\"m\">\n\t\t\t\tButton\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"primary\" type=\"solid\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"search\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\n\t\t<br />\n\t\t<h3>No inner border</h3>\n\t\t<gov-control-group no-inner-border fit-content>\n\t\t\t<gov-button color=\"warning\" type=\"solid\" size=\"m\">\n\t\t\t\tButton\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"warning\" type=\"solid\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"bookmarks\"></gov-icon>\n\t\t\t</gov-button>\n\t\t</gov-control-group>\n\n\t\t<br />\n\t\t<h3>No border - No inner border</h3>\n\t\t<gov-control-group no-border no-inner-border fit-content>\n\t\t\t<gov-button color=\"warning\" type=\"solid\" size=\"m\">\n\t\t\t\tButton\n\t\t\t</gov-button>\n\t\t\t<gov-button color=\"warning\" type=\"solid\" size=\"m\">\n\t\t\t\t<gov-icon slot=\"icon-start\" name=\"bookmarks\"></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/Forms.js

@@ -653,6 +653,17 @@ class FormsPage extends HTMLElement {
 	</gov-form-group>
 </gov-form-control>
 <br>
+<gov-form-search name="test-me-d" checked size="m" color="neutral">
+	<gov-form-control>
+		<gov-form-group>
+			<gov-form-input slot="input" size="m" name="test-me-d" placeholder="Co hledáte"></gov-form-input>
+		</gov-form-group>
+	</gov-form-control>
+	<gov-button slot="button" color="primary" size="s" type="solid">
+		<gov-icon slot="icon-start" name="search"></gov-icon>
+	</gov-button>
+</gov-form-search>
+<br>
 <gov-form-control>
 	<gov-form-group>
 		<gov-form-search name="test-me-c" value="me" size="l" color="neutral">
@@ -730,7 +741,7 @@ class FormsPage extends HTMLElement {
 <gov-form-control>
 	<gov-form-label size="s" slot="top">Přidat přílohu</gov-form-label>
 	<gov-form-group>
-		<gov-form-file size="m" id="test-me-ujo" display-attachments="false" multiple accept=".pdf,.jpg,.png,.jpeg" max-file-size="616448" required="true">
+		<gov-form-file size="m" id="test-me-ujo" display-attachments="true" multiple accept=".pdf,.jpg,.png,.jpeg" max-file-size="616448" required="true">
 			<p>
 				<gov-button color="primary" type="outlined" size="m" tabindex="-1">
 					<gov-icon type="components" name="search"></gov-icon>