@gov-design-system-ce/components 0.0.66 → 0.0.67

package/dist/core/p-bf39d442.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as o,a as n}from"./p-5bc604a3.js";function e(t){t=t||[];return Array.isArray(t)?t:[t]}function i(t){return`[Vaadin.Router] ${t}`}function a(t){if(typeof t!=="object"){return String(t)}const o=Object.prototype.toString.call(t).match(/ (.*)\]$/)[1];if(o==="Object"||o==="Array"){return`${o} ${JSON.stringify(t)}`}else{return o}}const s="module";const r="nomodule";const l=[s,r];function v(t){if(!t.match(/.+\.[m]?js$/)){throw new Error(i(`Unsupported type for bundle "${t}": .js or .mjs expected.`))}}function c(t){if(!t||!f(t.path)){throw new Error(i(`Expected route config to be an object with a "path" string property, or an array of such objects`))}const o=t.bundle;const n=["component","redirect","bundle"];if(!b(t.action)&&!Array.isArray(t.children)&&!b(t.children)&&!d(o)&&!n.some((o=>f(t[o])))){throw new Error(i(`Expected route config "${t.path}" to include either "${n.join('", "')}" `+`or "action" function but none found.`))}if(o){if(f(o)){v(o)}else if(!l.some((t=>t in o))){throw new Error(i('Expected route bundle to include either "'+r+'" or "'+s+'" keys, or both'))}else{l.forEach((t=>t in o&&v(o[t])))}}if(t.redirect){["bundle","component"].forEach((o=>{if(o in t){console.warn(i(`Route config "${t.path}" has both "redirect" and "${o}" properties, `+`and "redirect" will always override the latter. Did you mean to only use "${o}"?`))}}))}}function u(t){e(t).forEach((t=>c(t)))}function p(t,o){let n=document.head.querySelector('script[src="'+t+'"][async]');if(!n){n=document.createElement("script");n.setAttribute("src",t);if(o===s){n.setAttribute("type",s)}else if(o===r){n.setAttribute(r,"")}n.async=true}return new Promise(((t,o)=>{n.onreadystatechange=n.onload=o=>{n.__dynamicImportLoaded=true;t(o)};n.onerror=t=>{if(n.parentNode){n.parentNode.removeChild(n)}o(t)};if(n.parentNode===null){document.head.appendChild(n)}else if(n.__dynamicImportLoaded){t()}}))}function g(t){if(f(t)){return p(t)}else{return Promise.race(l.filter((o=>o in t)).map((o=>p(t[o],o))))}}function m(t,o){return!window.dispatchEvent(new CustomEvent(`vaadin-router-${t}`,{cancelable:t==="go",detail:o}))}function d(t){return typeof t==="object"&&!!t}function b(t){return typeof t==="function"}function f(t){return typeof t==="string"}function h(t){const o=new Error(i(`Page not found (${t.pathname})`));o.context=t;o.code=404;return o}const y=new class t{};function k(t){const o=t.port;const n=t.protocol;const e=n==="http:"&&o==="80";const i=n==="https:"&&o==="443";const a=e||i?t.hostname:t.host;return`${n}//${a}`}function z(t){if(t.defaultPrevented){return}if(t.button!==0){return}if(t.shiftKey||t.ctrlKey||t.altKey||t.metaKey){return}let o=t.target;const n=t.composedPath?t.composedPath():t.path||[];for(let t=0;t<n.length;t++){const e=n[t];if(e.nodeName&&e.nodeName.toLowerCase()==="a"){o=e;break}}while(o&&o.nodeName.toLowerCase()!=="a"){o=o.parentNode}if(!o||o.nodeName.toLowerCase()!=="a"){return}if(o.target&&o.target.toLowerCase()!=="_self"){return}if(o.hasAttribute("download")){return}if(o.hasAttribute("router-ignore")){return}if(o.pathname===window.location.pathname&&o.hash!==""){return}const e=o.origin||k(o);if(e!==window.location.origin){return}const{pathname:i,search:a,hash:s}=o;if(m("go",{pathname:i,search:a,hash:s})){t.preventDefault();if(t&&t.type==="click"){window.scrollTo(0,0)}}}const x={activate(){window.document.addEventListener("click",z)},inactivate(){window.document.removeEventListener("click",z)}};const w=/Trident/.test(navigator.userAgent);if(w&&!b(window.PopStateEvent)){window.PopStateEvent=function(t,o){o=o||{};var n=document.createEvent("Event");n.initEvent(t,Boolean(o.bubbles),Boolean(o.cancelable));n.state=o.state||null;return n};window.PopStateEvent.prototype=window.Event.prototype}function P(t){if(t.state==="vaadin-router-ignore"){return}const{pathname:o,search:n,hash:e}=window.location;m("go",{pathname:o,search:n,hash:e})}const V={activate(){window.addEventListener("popstate",P)},inactivate(){window.removeEventListener("popstate",P)}};var j=Z;var L=C;var S=N;var q=B;var D=R;var O="/";var T="./";var E=new RegExp(["(\\\\.)","(?:\\:(\\w+)(?:\\(((?:\\\\.|[^\\\\()])+)\\))?|\\(((?:\\\\.|[^\\\\()])+)\\))([+*?])?"].join("|"),"g");function C(t,o){var n=[];var e=0;var i=0;var a="";var s=o&&o.delimiter||O;var r=o&&o.delimiters||T;var l=false;var v;while((v=E.exec(t))!==null){var c=v[0];var u=v[1];var p=v.index;a+=t.slice(i,p);i=p+c.length;if(u){a+=u[1];l=true;continue}var g="";var m=t[i];var d=v[2];var b=v[3];var f=v[4];var h=v[5];if(!l&&a.length){var y=a.length-1;if(r.indexOf(a[y])>-1){g=a[y];a=a.slice(0,y)}}if(a){n.push(a);a="";l=false}var k=g!==""&&m!==undefined&&m!==g;var z=h==="+"||h==="*";var x=h==="?"||h==="*";var w=g||s;var P=b||f;n.push({name:d||e++,prefix:g,delimiter:w,optional:x,repeat:z,partial:k,pattern:P?A(P):"[^"+M(w)+"]+?"})}if(a||i<t.length){n.push(a+t.substr(i))}return n}function N(t,o){return B(C(t,o))}function B(t){var o=new Array(t.length);for(var n=0;n<t.length;n++){if(typeof t[n]==="object"){o[n]=new RegExp("^(?:"+t[n].pattern+")$")}}return function(n,e){var i="";var a=e&&e.encode||encodeURIComponent;for(var s=0;s<t.length;s++){var r=t[s];if(typeof r==="string"){i+=r;continue}var l=n?n[r.name]:undefined;var v;if(Array.isArray(l)){if(!r.repeat){throw new TypeError('Expected "'+r.name+'" to not repeat, but got array')}if(l.length===0){if(r.optional)continue;throw new TypeError('Expected "'+r.name+'" to not be empty')}for(var c=0;c<l.length;c++){v=a(l[c],r);if(!o[s].test(v)){throw new TypeError('Expected all "'+r.name+'" to match "'+r.pattern+'"')}i+=(c===0?r.prefix:r.delimiter)+v}continue}if(typeof l==="string"||typeof l==="number"||typeof l==="boolean"){v=a(String(l),r);if(!o[s].test(v)){throw new TypeError('Expected "'+r.name+'" to match "'+r.pattern+'", but got "'+v+'"')}i+=r.prefix+v;continue}if(r.optional){if(r.partial)i+=r.prefix;continue}throw new TypeError('Expected "'+r.name+'" to be '+(r.repeat?"an array":"a string"))}return i}}function M(t){return t.replace(/([.+*?=^!:${}()[\]|/\\])/g,"\\$1")}function A(t){return t.replace(/([=!:$/()])/g,"\\$1")}function H(t){return t&&t.sensitive?"":"i"}function _(t,o){if(!o)return t;var n=t.source.match(/\((?!\?)/g);if(n){for(var e=0;e<n.length;e++){o.push({name:e,prefix:null,delimiter:null,optional:false,repeat:false,partial:false,pattern:null})}}return t}function U(t,o,n){var e=[];for(var i=0;i<t.length;i++){e.push(Z(t[i],o,n).source)}return new RegExp("(?:"+e.join("|")+")",H(n))}function I(t,o,n){return R(C(t,n),o,n)}function R(t,o,n){n=n||{};var e=n.strict;var i=n.start!==false;var a=n.end!==false;var s=M(n.delimiter||O);var r=n.delimiters||T;var l=[].concat(n.endsWith||[]).map(M).concat("$").join("|");var v=i?"^":"";var c=t.length===0;for(var u=0;u<t.length;u++){var p=t[u];if(typeof p==="string"){v+=M(p);c=u===t.length-1&&r.indexOf(p[p.length-1])>-1}else{var g=p.repeat?"(?:"+p.pattern+")(?:"+M(p.delimiter)+"(?:"+p.pattern+"))*":p.pattern;if(o)o.push(p);if(p.optional){if(p.partial){v+=M(p.prefix)+"("+g+")?"}else{v+="(?:"+M(p.prefix)+"("+g+"))?"}}else{v+=M(p.prefix)+"("+g+")"}}}if(a){if(!e)v+="(?:"+s+")?";v+=l==="$"?"$":"(?="+l+")"}else{if(!e)v+="(?:"+s+"(?="+l+"))?";if(!c)v+="(?="+s+"|"+l+")"}return new RegExp(v,H(n))}function Z(t,o,n){if(t instanceof RegExp){return _(t,o)}if(Array.isArray(t)){return U(t,o,n)}return I(t,o,n)}j.parse=L;j.compile=S;j.tokensToFunction=q;j.tokensToRegExp=D;const{hasOwnProperty:F}=Object.prototype;const $=new Map;$.set("|false",{keys:[],pattern:/(?:)/});function X(t){try{return decodeURIComponent(t)}catch(o){return t}}function K(t,o,n,e,i){n=!!n;const a=`${t}|${n}`;let s=$.get(a);if(!s){const o=[];s={keys:o,pattern:j(t,o,{end:n,strict:t===""})};$.set(a,s)}const r=s.pattern.exec(o);if(!r){return null}const l=Object.assign({},i);for(let t=1;t<r.length;t++){const o=s.keys[t-1];const n=o.name;const e=r[t];if(e!==undefined||!F.call(l,n)){if(o.repeat){l[n]=e?e.split(o.delimiter).map(X):[]}else{l[n]=e?X(e):e}}}return{path:r[0],keys:(e||[]).concat(s.keys),params:l}}function W(t,o,n,e,i){let a;let s;let r=0;let l=t.path||"";if(l.charAt(0)==="/"){if(n){l=l.substr(1)}n=true}return{next(v){if(t===v){return{done:true}}const c=t.__children=t.__children||t.children;if(!a){a=K(l,o,!c,e,i);if(a){return{done:false,value:{route:t,keys:a.keys,params:a.params,path:a.path}}}}if(a&&c){while(r<c.length){if(!s){const e=c[r];e.parent=t;let i=a.path.length;if(i>0&&o.charAt(i)==="/"){i+=1}s=W(e,o.substr(i),n,a.keys,a.params)}const e=s.next(v);if(!e.done){return{done:false,value:e.value}}s=null;r++}}return{done:true}}}}function G(t){if(b(t.route.action)){return t.route.action(t)}return undefined}function J(t,o){let n=o;while(n){n=n.parent;if(n===t){return true}}return false}function Q(t){let o=`Path '${t.pathname}' is not properly resolved due to an error.`;const n=(t.route||{}).path;if(n){o+=` Resolution had failed on route: '${n}'`}return o}function Y(t,o){const{route:n,path:e}=o;if(n&&!n.__synthetic){const o={path:e,route:n};if(!t.chain){t.chain=[]}else{if(n.parent){let o=t.chain.length;while(o--&&t.chain[o].route&&t.chain[o].route!==n.parent){t.chain.pop()}}}t.chain.push(o)}}class tt{constructor(t,o={}){if(Object(t)!==t){throw new TypeError("Invalid routes")}this.baseUrl=o.baseUrl||"";this.errorHandler=o.errorHandler;this.resolveRoute=o.resolveRoute||G;this.context=Object.assign({resolver:this},o.context);this.root=Array.isArray(t)?{path:"",__children:t,parent:null,__synthetic:true}:t;this.root.parent=null}getRoutes(){return[...this.root.__children]}setRoutes(t){u(t);const o=[...e(t)];this.root.__children=o}addRoutes(t){u(t);this.root.__children.push(...e(t));return this.getRoutes()}removeRoutes(){this.setRoutes([])}resolve(t){const o=Object.assign({},this.context,f(t)?{pathname:t}:t);const n=W(this.root,this.__normalizePathname(o.pathname),this.baseUrl);const e=this.resolveRoute;let i=null;let a=null;let s=o;function r(t,l=i.value.route,v){const c=v===null&&i.value.route;i=a||n.next(c);a=null;if(!t){if(i.done||!J(l,i.value.route)){a=i;return Promise.resolve(y)}}if(i.done){return Promise.reject(h(o))}s=Object.assign(s?{chain:s.chain?s.chain.slice(0):[]}:{},o,i.value);Y(s,i.value);return Promise.resolve(e(s)).then((o=>{if(o!==null&&o!==undefined&&o!==y){s.result=o.result||o;return s}return r(t,l,o)}))}o.next=r;return Promise.resolve().then((()=>r(true,this.root))).catch((t=>{const o=Q(s);if(!t){t=new Error(o)}else{console.warn(o)}t.context=t.context||s;if(!(t instanceof DOMException)){t.code=t.code||500}if(this.errorHandler){s.result=this.errorHandler(t);return s}throw t}))}static __createUrl(t,o){return new URL(t,o)}get __effectiveBaseUrl(){return this.baseUrl?this.constructor.__createUrl(this.baseUrl,document.baseURI||document.URL).href.replace(/[^\/]*$/,""):""}__normalizePathname(t){if(!this.baseUrl){return t}const o=this.__effectiveBaseUrl;const n=this.constructor.__createUrl(t,o).href;if(n.slice(0,o.length)===o){return n.slice(o.length)}}}tt.pathToRegexp=j;const{pathToRegexp:ot}=tt;const nt=new Map;function et(t,o,n){const e=o.name||o.component;if(e){if(t.has(e)){t.get(e).push(o)}else{t.set(e,[o])}}if(Array.isArray(n)){for(let e=0;e<n.length;e++){const i=n[e];i.parent=o;et(t,i,i.__children||i.children)}}}function it(t,o){const n=t.get(o);if(n&&n.length>1){throw new Error(`Duplicate route with name "${o}".`+` Try seting unique 'name' route properties.`)}return n&&n[0]}function at(t){let o=t.path;o=Array.isArray(o)?o[0]:o;return o!==undefined?o:""}function st(t,o={}){if(!(t instanceof tt)){throw new TypeError("An instance of Resolver is expected")}const n=new Map;return(e,i)=>{let a=it(n,e);if(!a){n.clear();et(n,t.root,t.root.__children);a=it(n,e);if(!a){throw new Error(`Route "${e}" not found`)}}let s=nt.get(a.fullPath);if(!s){let t=at(a);let o=a.parent;while(o){const n=at(o);if(n){t=n.replace(/\/$/,"")+"/"+t.replace(/^\//,"")}o=o.parent}const n=ot.parse(t);const e=ot.tokensToFunction(n);const i=Object.create(null);for(let t=0;t<n.length;t++){if(!f(n[t])){i[n[t].name]=true}}s={toPath:e,keys:i};nt.set(t,s);a.fullPath=t}let r=s.toPath(i,o)||"/";if(o.stringifyQueryParams&&i){const t={};const n=Object.keys(i);for(let o=0;o<n.length;o++){const e=n[o];if(!s.keys[e]){t[e]=i[e]}}const e=o.stringifyQueryParams(t);if(e){r+=e.charAt(0)==="?"?e:`?${e}`}}return r}}let rt=[];function lt(t){rt.forEach((t=>t.inactivate()));t.forEach((t=>t.activate()));rt=t}const vt=t=>{const o=getComputedStyle(t).getPropertyValue("animation-name");return o&&o!=="none"};const ct=(t,o)=>{const n=()=>{t.removeEventListener("animationend",n);o()};t.addEventListener("animationend",n)};function ut(t,o){t.classList.add(o);return new Promise((n=>{if(vt(t)){const e=t.getBoundingClientRect();const i=`height: ${e.bottom-e.top}px; width: ${e.right-e.left}px`;t.setAttribute("style",`position: absolute; ${i}`);ct(t,(()=>{t.classList.remove(o);t.removeAttribute("style");n()}))}else{t.classList.remove(o);n()}}))}const pt=256;function gt(t){return t!==null&&t!==undefined}function mt(t){const o=Object.assign({},t);delete o.next;return o}function dt({pathname:t="",search:o="",hash:n="",chain:e=[],params:i={},redirectFrom:a,resolver:s},r){const l=e.map((t=>t.route));return{baseUrl:s&&s.baseUrl||"",pathname:t,search:o,hash:n,routes:l,route:r||l.length&&l[l.length-1]||null,params:i,redirectFrom:a,getUrl:(t={})=>xt(Pt.pathToRegexp.compile(wt(l))(Object.assign({},i,t)),s)}}function bt(t,o){const n=Object.assign({},t.params);return{redirect:{pathname:o,from:t.pathname,params:n}}}function ft(t,o){o.location=dt(t);const n=t.chain.map((t=>t.route)).indexOf(t.route);t.chain[n].element=o;return o}function ht(t,o,n){if(b(t)){return t.apply(n,o)}}function yt(t,o,n){return e=>{if(e&&(e.cancel||e.redirect)){return e}if(n){return ht(n[t],o,n)}}}function kt(t,o){if(!Array.isArray(t)&&!d(t)){throw new Error(i(`Incorrect "children" value for the route ${o.path}: expected array or object, but got ${t}`))}o.__children=[];const n=e(t);for(let t=0;t<n.length;t++){c(n[t]);o.__children.push(n[t])}}function zt(t){if(t&&t.length){const o=t[0].parentNode;for(let n=0;n<t.length;n++){o.removeChild(t[n])}}}function xt(t,o){const n=o.__effectiveBaseUrl;return n?o.constructor.__createUrl(t.replace(/^\//,""),n).pathname:t}function wt(t){return t.map((t=>t.path)).reduce(((t,o)=>{if(o.length){return t.replace(/\/$/,"")+"/"+o.replace(/^\//,"")}return t}),"")}class Pt extends tt{constructor(t,o){const n=document.head.querySelector("base");const e=n&&n.getAttribute("href");super([],Object.assign({baseUrl:e&&tt.__createUrl(e,document.URL).pathname.replace(/[^\/]*$/,"")},o));this.resolveRoute=t=>this.__resolveRoute(t);const i=Pt.NavigationTrigger;Pt.setTriggers.apply(Pt,Object.keys(i).map((t=>i[t])));this.ready=Promise.resolve(t);this.location=dt({resolver:this});this.__lastStartedRenderId=0;this.__navigationEventHandler=this.__onNavigationEvent.bind(this);this.setOutlet(t);this.subscribe();this.__createdByRouter=new WeakMap;this.__addedByRouter=new WeakMap}__resolveRoute(t){const o=t.route;let n=Promise.resolve();if(b(o.children)){n=n.then((()=>o.children(mt(t)))).then((t=>{if(!gt(t)&&!b(o.children)){t=o.children}kt(t,o)}))}const e={redirect:o=>bt(t,o),component:t=>{const o=document.createElement(t);this.__createdByRouter.set(o,true);return o}};return n.then((()=>{if(this.__isLatestRender(t)){return ht(o.action,[t,e],o)}})).then((t=>{if(gt(t)){if(t instanceof HTMLElement||t.redirect||t===y){return t}}if(f(o.redirect)){return e.redirect(o.redirect)}if(o.bundle){return g(o.bundle).then((()=>{}),(()=>{throw new Error(i(`Bundle not found: ${o.bundle}. Check if the file name is correct`))}))}})).then((t=>{if(gt(t)){return t}if(f(o.component)){return e.component(o.component)}}))}setOutlet(t){if(t){this.__ensureOutlet(t)}this.__outlet=t}getOutlet(){return this.__outlet}setRoutes(t,o=false){this.__previousContext=undefined;this.__urlForName=undefined;super.setRoutes(t);if(!o){this.__onNavigationEvent()}return this.ready}render(t,o){const n=++this.__lastStartedRenderId;const e=Object.assign({search:"",hash:""},f(t)?{pathname:t}:t,{__renderId:n});this.ready=this.resolve(e).then((t=>this.__fullyResolveChain(t))).then((t=>{if(this.__isLatestRender(t)){const e=this.__previousContext;if(t===e){this.__updateBrowserHistory(e,true);return this.location}this.location=dt(t);if(o){this.__updateBrowserHistory(t,n===1)}m("location-changed",{router:this,location:this.location});if(t.__skipAttach){this.__copyUnchangedElements(t,e);this.__previousContext=t;return this.location}this.__addAppearingContent(t,e);const i=this.__animateIfNeeded(t);this.__runOnAfterEnterCallbacks(t);this.__runOnAfterLeaveCallbacks(t,e);return i.then((()=>{if(this.__isLatestRender(t)){this.__removeDisappearingContent();this.__previousContext=t;return this.location}}))}})).catch((t=>{if(n===this.__lastStartedRenderId){if(o){this.__updateBrowserHistory(e)}zt(this.__outlet&&this.__outlet.children);this.location=dt(Object.assign(e,{resolver:this}));m("error",Object.assign({router:this,error:t},e));throw t}}));return this.ready}__fullyResolveChain(t,o=t){return this.__findComponentContextAfterAllRedirects(o).then((n=>{const e=n!==o;const i=e?n:t;const a=xt(wt(n.chain),n.resolver);const s=a===n.pathname;const r=(t,o=t.route,n)=>t.next(undefined,o,n).then((n=>{if(n===null||n===y){if(s){return t}else if(o.parent!==null){return r(t,o.parent,n)}else{return n}}return n}));return r(n).then((t=>{if(t===null||t===y){throw h(i)}return t&&t!==y&&t!==n?this.__fullyResolveChain(i,t):this.__amendWithOnBeforeCallbacks(n)}))}))}__findComponentContextAfterAllRedirects(t){const o=t.result;if(o instanceof HTMLElement){ft(t,o);return Promise.resolve(t)}else if(o.redirect){return this.__redirect(o.redirect,t.__redirectCount,t.__renderId).then((t=>this.__findComponentContextAfterAllRedirects(t)))}else if(o instanceof Error){return Promise.reject(o)}else{return Promise.reject(new Error(i(`Invalid route resolution result for path "${t.pathname}". `+`Expected redirect object or HTML element, but got: "${a(o)}". `+`Double check the action return value for the route.`)))}}__amendWithOnBeforeCallbacks(t){return this.__runOnBeforeCallbacks(t).then((o=>{if(o===this.__previousContext||o===t){return o}return this.__fullyResolveChain(o)}))}__runOnBeforeCallbacks(t){const o=this.__previousContext||{};const n=o.chain||[];const e=t.chain;let i=Promise.resolve();const a=()=>({cancel:true});const s=o=>bt(t,o);t.__divergedChainIndex=0;t.__skipAttach=false;if(n.length){for(let o=0;o<Math.min(n.length,e.length);o=++t.__divergedChainIndex){if(n[o].route!==e[o].route||n[o].path!==e[o].path&&n[o].element!==e[o].element||!this.__isReusableElement(n[o].element,e[o].element)){break}}t.__skipAttach=e.length===n.length&&t.__divergedChainIndex==e.length&&this.__isReusableElement(t.result,o.result);if(t.__skipAttach){for(let o=e.length-1;o>=0;o--){i=this.__runOnBeforeLeaveCallbacks(i,t,{prevent:a},n[o])}for(let o=0;o<e.length;o++){i=this.__runOnBeforeEnterCallbacks(i,t,{prevent:a,redirect:s},e[o]);n[o].element.location=dt(t,n[o].route)}}else{for(let o=n.length-1;o>=t.__divergedChainIndex;o--){i=this.__runOnBeforeLeaveCallbacks(i,t,{prevent:a},n[o])}}}if(!t.__skipAttach){for(let o=0;o<e.length;o++){if(o<t.__divergedChainIndex){if(o<n.length&&n[o].element){n[o].element.location=dt(t,n[o].route)}}else{i=this.__runOnBeforeEnterCallbacks(i,t,{prevent:a,redirect:s},e[o]);if(e[o].element){e[o].element.location=dt(t,e[o].route)}}}}return i.then((o=>{if(o){if(o.cancel){this.__previousContext.__renderId=t.__renderId;return this.__previousContext}if(o.redirect){return this.__redirect(o.redirect,t.__redirectCount,t.__renderId)}}return t}))}__runOnBeforeLeaveCallbacks(t,o,n,e){const i=dt(o);return t.then((t=>{if(this.__isLatestRender(o)){const o=yt("onBeforeLeave",[i,n,this],e.element);return o(t)}})).then((t=>{if(!(t||{}).redirect){return t}}))}__runOnBeforeEnterCallbacks(t,o,n,e){const i=dt(o,e.route);return t.then((t=>{if(this.__isLatestRender(o)){const o=yt("onBeforeEnter",[i,n,this],e.element);return o(t)}}))}__isReusableElement(t,o){if(t&&o){return this.__createdByRouter.get(t)&&this.__createdByRouter.get(o)?t.localName===o.localName:t===o}return false}__isLatestRender(t){return t.__renderId===this.__lastStartedRenderId}__redirect(t,o,n){if(o>pt){throw new Error(i(`Too many redirects when rendering ${t.from}`))}return this.resolve({pathname:this.urlForPath(t.pathname,t.params),redirectFrom:t.from,__redirectCount:(o||0)+1,__renderId:n})}__ensureOutlet(t=this.__outlet){if(!(t instanceof Node)){throw new TypeError(i(`Expected router outlet to be a valid DOM Node (but got ${t})`))}}__updateBrowserHistory({pathname:t,search:o="",hash:n=""},e){if(window.location.pathname!==t||window.location.search!==o||window.location.hash!==n){const i=e?"replaceState":"pushState";window.history[i](null,document.title,t+o+n);window.dispatchEvent(new PopStateEvent("popstate",{state:"vaadin-router-ignore"}))}}__copyUnchangedElements(t,o){let n=this.__outlet;for(let e=0;e<t.__divergedChainIndex;e++){const i=o&&o.chain[e].element;if(i){if(i.parentNode===n){t.chain[e].element=i;n=i}else{break}}}return n}__addAppearingContent(t,o){this.__ensureOutlet();this.__removeAppearingContent();const n=this.__copyUnchangedElements(t,o);this.__appearingContent=[];this.__disappearingContent=Array.from(n.children).filter((o=>this.__addedByRouter.get(o)&&o!==t.result));let e=n;for(let o=t.__divergedChainIndex;o<t.chain.length;o++){const i=t.chain[o].element;if(i){e.appendChild(i);this.__addedByRouter.set(i,true);if(e===n){this.__appearingContent.push(i)}e=i}}}__removeDisappearingContent(){if(this.__disappearingContent){zt(this.__disappearingContent)}this.__disappearingContent=null;this.__appearingContent=null}__removeAppearingContent(){if(this.__disappearingContent&&this.__appearingContent){zt(this.__appearingContent);this.__disappearingContent=null;this.__appearingContent=null}}__runOnAfterLeaveCallbacks(t,o){if(!o){return}for(let n=o.chain.length-1;n>=t.__divergedChainIndex;n--){if(!this.__isLatestRender(t)){break}const e=o.chain[n].element;if(!e){continue}try{const n=dt(t);ht(e.onAfterLeave,[n,{},o.resolver],e)}finally{if(this.__disappearingContent.indexOf(e)>-1){zt(e.children)}}}}__runOnAfterEnterCallbacks(t){for(let o=t.__divergedChainIndex;o<t.chain.length;o++){if(!this.__isLatestRender(t)){break}const n=t.chain[o].element||{};const e=dt(t,t.chain[o].route);ht(n.onAfterEnter,[e,{},t.resolver],n)}}__animateIfNeeded(t){const o=(this.__disappearingContent||[])[0];const n=(this.__appearingContent||[])[0];const e=[];const i=t.chain;let a;for(let t=i.length;t>0;t--){if(i[t-1].route.animate){a=i[t-1].route.animate;break}}if(o&&n&&a){const t=d(a)&&a.leave||"leaving";const i=d(a)&&a.enter||"entering";e.push(ut(o,t));e.push(ut(n,i))}return Promise.all(e).then((()=>t))}subscribe(){window.addEventListener("vaadin-router-go",this.__navigationEventHandler)}unsubscribe(){window.removeEventListener("vaadin-router-go",this.__navigationEventHandler)}__onNavigationEvent(t){const{pathname:o,search:n,hash:e}=t?t.detail:window.location;if(f(this.__normalizePathname(o))){if(t&&t.preventDefault){t.preventDefault()}this.render({pathname:o,search:n,hash:e},true)}}static setTriggers(...t){lt(t)}urlForName(t,o){if(!this.__urlForName){this.__urlForName=st(this)}return xt(this.__urlForName(t,o),this)}urlForPath(t,o){return xt(Pt.pathToRegexp.compile(t)(o),this)}static go(t){const{pathname:o,search:n,hash:e}=f(t)?this.__createUrl(t,"http://a"):t;return m("go",{pathname:o,search:n,hash:e})}}const Vt=/\/\*\*\s+vaadin-dev-mode:start([\s\S]*)vaadin-dev-mode:end\s+\*\*\//i;const jt=window.Vaadin&&window.Vaadin.Flow&&window.Vaadin.Flow.clients;function Lt(){function t(){return true}return Tt(t)}function St(){try{if(qt()){return true}if(!Dt()){return false}if(jt){return!Ot()}return!Lt()}catch(t){return false}}function qt(){return localStorage.getItem("vaadin.developmentmode.force")}function Dt(){return["localhost","127.0.0.1"].indexOf(window.location.hostname)>=0}function Ot(){if(jt){const t=Object.keys(jt).map((t=>jt[t])).filter((t=>t.productionMode));if(t.length>0){return true}}return false}function Tt(t,o){if(typeof t!=="function"){return}const n=Vt.exec(t.toString());if(n){try{t=new Function(n[1])}catch(t){console.log("vaadin-development-mode-detector: uncommentAndRun() failed",t)}}return t(o)}window["Vaadin"]=window["Vaadin"]||{};const Et=function(t,o){if(window.Vaadin.developmentMode){return Tt(t,o)}};if(window.Vaadin.developmentMode===undefined){window.Vaadin.developmentMode=St()}function Ct(){}const Nt=function(){if(typeof Et==="function"){return Et(Ct)}};window.Vaadin=window.Vaadin||{};window.Vaadin.registrations=window.Vaadin.registrations||[];window.Vaadin.registrations.push({is:"@vaadin/router",version:"1.7.4"});Nt();Pt.NavigationTrigger={POPSTATE:V,CLICK:x};class Bt extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h4>Accordion</h4>\n\t\t<div class="container-view">\n\t\t\t<gov-accordion size="xs">\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Font Awesome Icon</h3>\n\t\t\t\t\t<p slot="annotation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<gov-icon slot="toggle-icon" name="info"></gov-icon>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item disabled is-expanded>\n\t\t\t\t\t<h3 slot="label">Kontaktní osoby</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Působnost v agendách</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p slot="annotation">Anotace Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>\n\t\t\t\t\t<gov-chip variant="primary" size="xs" slot="suffix">\n\t\t\t\t\t\tChip\n\t\t\t\t\t</gov-chip>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Zřizované organizace</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t</gov-accordion>\n\t\t\t<br>\n\t\t\t<gov-accordion size="xs" no-border>\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Font Awesome Icon</h3>\n\t\t\t\t\t<p slot="annotation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus</p>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Kontaktní osoby">\n\t\t\t\t\t<h3 slot="label">Kontaktní osoby</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Působnost v agendách">\n\t\t\t\t\t<p slot="label">Působnost v agendách</p>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Zřizované organizace">\n\t\t\t\t\t<span slot="label">Zřizované organizace</span>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t</gov-accordion>\n\t\t\t<br />\n\t\t\t<gov-accordion size="s" variant="secondary">\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Font Awesome Icon</h3>\n\t\t\t\t\t<p slot="annotation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<gov-icon slot="toggle-icon" name="info"></gov-icon>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item disabled is-expanded>\n\t\t\t\t\t<h3 slot="label">Kontaktní osoby</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Působnost v agendách</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Zřizované organizace</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t</gov-accordion>\n\t\t\t<br>\n\t\t\t<gov-accordion size="s">\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Font Awesome Icon</h3>\n\t\t\t\t\t<p slot="annotation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus</p>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Kontaktní osoby">\n\t\t\t\t\t<h3 slot="label">Kontaktní osoby</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Působnost v agendách">\n\t\t\t\t\t<h3 slot="label">Působnost v agendách</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<gov-chip variant="primary" size="xs" slot="suffix">\n\t\t\t\t\t\tChip\n\t\t\t\t\t</gov-chip>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Zřizované organizace">\n\t\t\t\t\t<h3 slot="label">Zřizované organizace</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t</gov-accordion>\n\t\t\t<br />\n\t\t\t<gov-accordion size="m">\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Font Awesome Icon</h3>\n\t\t\t\t\t<p slot="annotation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<gov-icon slot="toggle-icon" name="info"></gov-icon>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item disabled is-expanded>\n\t\t\t\t\t<h3 slot="label">Kontaktní osoby</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Působnost v agendách</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Zřizované organizace</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t</gov-accordion>\n\t\t\t<br>\n\t\t\t<gov-accordion size="m">\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Font Awesome Icon</h3>\n\t\t\t\t\t<p slot="annotation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus</p>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item is-expanded label="Kontaktní osoby">\n\t\t\t\t\t<h3 slot="label">Kontaktní osoby</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<gov-chip variant="primary" size="xs" slot="suffix">\n\t\t\t\t\t\tChip\n\t\t\t\t\t</gov-chip>\n\t\t\t\t\t\t\t\t<gov-accordion size="xs" no-border>\n\t\t\t\t\t\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t\t\t\t\t\t<h3 slot="label">Font Awesome Icon</h3>\n\t\t\t\t\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t\t\t\t<p slot="annotation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus</p>\n\t\t\t\t\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t\t\t\t\t\t<gov-icon slot="toggle-icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-accordion-item>\n\t\t\t\t\t\t\t\t\t<gov-accordion-item disabled is-expanded>\n\t\t\t\t\t\t\t\t\t\t<h3 slot="label">Kontaktní osoby</h3>\n\t\t\t\t\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t\t\t\t\t</gov-accordion-item>\n\t\t\t\t\t\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t\t\t\t\t\t<h3 slot="label">Působnost v agendách</h3>\n\t\t\t\t\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t\t\t\t\t</gov-accordion-item>\n\t\t\t\t\t\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t\t\t\t\t\t<h3 slot="label">Zřizované organizace</h3>\n\t\t\t\t\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t\t\t\t\t</gov-accordion-item>\n\t\t\t\t\t\t\t\t</gov-accordion>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Působnost v agendách">\n\t\t\t\t\t<h3 slot="label">Působnost v agendách</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<gov-chip variant="primary" size="xs" slot="suffix">\n\t\t\t\t\t\tChip\n\t\t\t\t\t</gov-chip>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Zřizované organizace">\n\t\t\t\t\t<h3 slot="label">Zřizované organizace</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t</gov-accordion>\n\t\t\t<br />\n\t\t\t<gov-accordion size="l">\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Font Awesome Icon</h3>\n\t\t\t\t\t<p slot="annotation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<gov-icon slot="toggle-icon" name="info"></gov-icon>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item disabled is-expanded>\n\t\t\t\t\t<h3 slot="label">Kontaktní osoby</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Působnost v agendách</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Zřizované organizace</h3>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t</gov-accordion>\n\t\t\t<br>\n\t\t\t<gov-accordion size="l">\n\t\t\t\t<gov-accordion-item>\n\t\t\t\t\t<h3 slot="label">Font Awesome Icon</h3>\n\t\t\t\t\t<p slot="annotation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus</p>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Kontaktní osoby">\n\t\t\t\t\t<h3 slot="label">Kontaktní osoby</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Působnost v agendách">\n\t\t\t\t\t<h3 slot="label">Působnost v agendách</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<gov-chip variant="primary" size="m" slot="suffix">\n\t\t\t\t\t\tChip\n\t\t\t\t\t</gov-chip>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t\t<gov-accordion-item label="Zřizované organizace">\n\t\t\t\t\t<h3 slot="label">Zřizované organizace</h3>\n\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t</gov-accordion-item>\n\t\t\t</gov-accordion>\n\t\t</div>\n\t\t`}}if(customElements.get("accordion-page")===undefined){customElements.define("accordion-page",Bt)}class Mt extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>Breadcrumbs</h2>\n\n\t\t<gov-breadcrumbs wcag-label="Drobečková navigace pro stránku Czech POINT">\n\t\t\t<ul>\n\t\t\t\t<li>\n\t\t\t\t\t<button>\n\t\t\t\t\tDomů\n\t\t\t\t\t</button>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<gov-icon  name="chevron-right"></gov-icon>\n\t\t\t\t\t<a href="#">Kam dál</a>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<gov-icon  name="chevron-right"></gov-icon>\n\t\t\t\t\t<a href="#">\n\t\t\t\t\tČeský eGovernment\n\t\t\t\t\t</a>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<gov-icon name="chevron-right"></gov-icon>\n\t\t\t\t\t<strong>Czech POINT</strong>\n\t\t\t\t</li>\n\t\t\t</ul>\n\t\t</gov-breadcrumbs>\n\n\t\t`}}if(customElements.get("breadcrumbs-page")===undefined){customElements.define("breadcrumbs-page",Mt)}class At extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<h1>Buttons</h1>\n\n\t\t\t<h4>Dropdown</h4>\n\n\t\t\t<gov-layout>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<div class="container-view">\n\t\t\t\t\t\t<gov-dropdown>\n\t\t\t\t\t\t\t<gov-button variant="primary" size="s">\n\t\t\t\t\t\t\t\tVíce\n\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t<ul slot="list">\n\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t\t<gov-button variant="primary" type="base" size="s">\n\t\t\t\t\t\t\t\t\t\tA další nabídka\n\t\t\t\t\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t\t<gov-button variant="primary" type="base" size="s">\n\t\t\t\t\t\t\t\t\t\tA další dlouhá nabídka\n\t\t\t\t\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t\t<gov-button variant="primary" type="base" size="s">\n\t\t\t\t\t\t\t\t\t\tA další\n\t\t\t\t\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t</gov-dropdown>\n\t\t\t\t\t</div>\n\t\t\t\t</gov-layout-column>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<div class="container-view">\n\t\t\t\t\t\t<gov-dropdown position="right">\n\t\t\t\t\t\t\t<gov-button variant="primary" size="s">\n\t\t\t\t\t\t\t\tVíce\n\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t<ul slot="list">\n\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t\t<gov-button variant="secondary" type="base" size="s">\n\t\t\t\t\t\t\t\t\t\tA další nabídka\n\t\t\t\t\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t\t<gov-button variant="secondary" type="base" size="s">\n\t\t\t\t\t\t\t\t\t\tA další dlouhá nabídka\n\t\t\t\t\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t\t<gov-button variant="secondary" type="base" size="s">\n\t\t\t\t\t\t\t\t\t\tA další\n\t\t\t\t\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t</gov-dropdown>\n\t\t\t\t\t</div>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\n\t\t\t<h4>Buttons - primary (default)</h4>\n\n\t\t\t<gov-button variant="primary" size="s" icon-left="basic/info"  icon-right="basic/info" href="http://localhost:3333/button">\n\t\t\t\t\tSmall Primary Icon Param\n\t\t\t\t</gov-button>\n\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="primary" size="s" href="http://localhost:3333/button">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br><br>\n\t\t\t\t<gov-button variant="primary" size="s" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" size="s" href="http://localhost:3333/button" loading="1" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" href="http://localhost:3333/button" loading="0">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" href="http://localhost:3333/button" loading="1" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" size="l" loading="true">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" size="l" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" size="xl" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" size="xl" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="primary" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<h4>Buttons - primary (expanded)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="primary" expanded="true">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tExpanded\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<h4>Buttons - primary (inversed)</h4>\n\t\t\t<div class="container-view gov-bg--primary-600">\n\t\t\t\t<gov-button inverse variant="primary" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - primary (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="primary" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="primary" type="outlined" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="outlined" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - primary (outlined inversed)</h4>\n\t\t\t<div class="container-view gov-bg--primary-600">\n\t\t\t\t<gov-button inverse variant="primary" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="outlined" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="outlined" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="outlined" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\n\t\t\t<h4>Buttons - primary (base)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="primary" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="base" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="primary" type="base" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="base" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - primary (base inversed)</h4>\n\t\t\t<div class="container-view gov-bg--primary-600">\n\t\t\t\t<gov-button inverse variant="primary" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="base" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="base" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="base" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - primary (link)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="primary" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="primary" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - primary (link inversed)</h4>\n\t\t\t<div class="container-view gov-bg--primary-600">\n\t\t\t\t<gov-button inverse variant="primary" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large Primary\n\t\t\t\t\t<gov-icon inverse slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button inverse variant="primary" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="primary" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - secondary (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="secondary" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="secondary" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="secondary" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - secondary (inversed)</h4>\n\t\t\t<div class="container-view gov-bg--secondary-800">\n\t\t\t\t<gov-button inverse variant="secondary" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - secondary (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="secondary" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="secondary" type="outlined" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="outlined" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - secondary (outlined inversed)</h4>\n\t\t\t<div class="container-view gov-bg--secondary-800">\n\t\t\t\t<gov-button inverse variant="secondary" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="outlined" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="outlined" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="outlined" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - secondary (base)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="secondary" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="base" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="secondary" type="base" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="base" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - secondary (base inversed)</h4>\n\t\t\t<div class="container-view gov-bg--secondary-800">\n\t\t\t\t<gov-button inverse variant="secondary" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="base" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="base" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="base" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - secondary (link)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="secondary" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall Secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal Secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge Secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large Secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="secondary" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="secondary" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - secondary (link inversed)</h4>\n\t\t\t<div class="container-view gov-bg--secondary-800">\n\t\t\t\t<gov-button inverse variant="secondary" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall Secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal Secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge Secondary\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large Secondary\n\t\t\t\t\t<gov-icon inverse slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button inverse variant="secondary" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="secondary" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - warning (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="warning" size="s" class="u-mr--medium u-mr-mobile--2xl u-mr-tablet--unset u-mr-portable--medium">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="warning" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="warning" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - warning (inversed)</h4>\n\t\t\t<div class="container-view gov-bg--warning-500">\n\t\t\t\t<gov-button inverse variant="warning" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - warning (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="warning" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="warning" type="outlined" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="outlined" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - warning (outlined inversed)</h4>\n\t\t\t<div class="container-view gov-bg--warning-500">\n\t\t\t\t<gov-button inverse variant="warning" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="outlined" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="outlined" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="outlined" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - warning (base)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="warning" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="base" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="warning" type="base" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="base" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - warning (base inversed)</h4>\n\t\t\t<div class="container-view gov-bg--warning-500">\n\t\t\t\t<gov-button inverse variant="warning" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="base" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="base" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="base" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - warning (link)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="warning" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="warning" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="warning" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - warning (link inversed)</h4>\n\t\t\t<div class="container-view gov-bg--warning-500">\n\t\t\t\t<gov-button inverse variant="warning" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge warning\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large warning\n\t\t\t\t\t<gov-icon inverse slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button inverse variant="warning" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="warning" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - success (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="success" size="s" class="u-mr--medium u-mr-mobile--2xl u-mr-tablet--unset u-mr-portable--medium">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="success" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="success" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - success (inversed)</h4>\n\t\t\t<div class="container-view gov-bg--success-500">\n\t\t\t\t<gov-button inverse variant="success" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - success (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="success" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="success" type="outlined" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="outlined" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - success (outlined inversed)</h4>\n\t\t\t<div class="container-view gov-bg--success-500">\n\t\t\t\t<gov-button inverse variant="success" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="outlined" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="outlined" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="outlined" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - success (base)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="success" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="base" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="success" type="base" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="base" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - success (base inversed)</h4>\n\t\t\t<div class="container-view gov-bg--success-500">\n\t\t\t\t<gov-button inverse variant="success" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="base" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="base" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="base" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - success (link)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="success" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="success" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="success" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - success (link inversed)</h4>\n\t\t\t<div class="container-view gov-bg--success-500">\n\t\t\t\t<gov-button inverse variant="success" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge success\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large success\n\t\t\t\t\t<gov-icon inverse slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button inverse variant="success" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="success" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - error (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="error" size="s" class="u-mr--medium u-mr-mobile--2xl u-mr-tablet--unset u-mr-portable--medium">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="error" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="error" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - error (inversed)</h4>\n\t\t\t<div class="container-view gov-bg--error-400">\n\t\t\t\t<gov-button inverse variant="error" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - error (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="error" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="error" type="outlined" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="outlined" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - error (outlined inversed)</h4>\n\t\t\t<div class="container-view gov-bg--error-400">\n\t\t\t\t<gov-button inverse variant="error" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="outlined" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="outlined" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="outlined" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - error (base)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="error" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="base" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="error" type="base" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="base" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - error (base inversed)</h4>\n\t\t\t<div class="container-view gov-bg--error-400">\n\t\t\t\t<gov-button inverse variant="error" type="base" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="base" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="base" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="base" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="base" loading="false">\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="base" loading="true" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="x-lg"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - error (link)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-button variant="error" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button variant="error" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="error" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Buttons - error (link inversed)</h4>\n\t\t\t<div class="container-view gov-bg--error-400">\n\t\t\t\t<gov-button inverse variant="error" type="link" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="link" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="link" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge error\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="link" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large error\n\t\t\t\t\t<gov-icon inverse slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t\t<br>\n\t\t\t\t<gov-button inverse variant="error" type="link" href="http://localhost:3333/button" loading="false">\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button inverse variant="error" type="link" href="http://localhost:3333/button" loading="true" disabled>\n\t\t\t\t\tOdeslat\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t\t<hr />\n\t\t`}}if(customElements.get("button-page")===undefined){customElements.define("button-page",At)}class Ht extends HTMLElement{connectedCallback(){this.innerHTML=`\n\n\t\t<div style="max-width: 650px">\n\t\t\t<h2>Card</h2>\n\n\t\t\t<gov-card label="Fusce tellus odio, dapibus id fermentum quis" expanded collapsible class="gov-bg--success-100">\n\t\t\t\t<p class="gov-color--secondary-700">\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Ipsum vitae etiam dui eget lectus vulputate ornare.\n\t\t\t\t</p>\n\t\t\t</gov-card>\n\n\t\t\t<br>\n\n\t\t\t<div style="height: 400px">\n\t\t\t\t<gov-card label="Fusce tellus odio, dapibus id fermentum quis" expanded collapsible>\n\t\t\t\t\t<div class="gov-content">\n\t\t\t\t\t\t<p class="gov-color--secondary-700">\n\t\t\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Ipsum vitae etiam dui eget lectus vulputate ornare.\n\t\t\t\t\t\t</p>\n\t\t\t\t\t\t<gov-button variant="primary" size="s" href="http://localhost:3333/button">\n\t\t\t\t\t\t\tButton\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t<p slot="footer" class="gov-color--primary-700">\n\t\t\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Ipsum vitae etiam dui eget lectus vulputate ornare.\n\t\t\t\t\t\t</p>\n\t\t\t\t\t</div>\n\t\t\t\t</gov-card>\n\t\t\t</div>\n\t\t\t<br>\n\t\t\t<gov-card label="Fusce tellus odio, dapibus id fermentum quis">\n\t\t\t\t<p class="gov-color--secondary-700">\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Ipsum vitae etiam dui eget lectus vulputate ornare.\n\t\t\t\t</p>\n\t\t\t\t<gov-button variant="primary" size="s" href="http://localhost:3333/button">\n\t\t\t\t\tButton\n\t\t\t\t</gov-button>\n\t\t\t\t<p slot="footer" color="gov-color--primary-700">\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Ipsum vitae etiam dui eget lectus vulputate ornare.\n\t\t\t\t</p>\n\t\t\t</gov-card>\n\t\t\t<h3>Image slot</h3>\n\t\t\t<gov-card expanded>\n\t\t\t\t<img slot="img" src="https://picsum.photos/536/354" src="" alt="Obárzek" width="536" height="354">\n\t\t\t\t<p class="gov-text--l gov-color--secondary-800">\n\t\t\t\t\t<b>\n\t\t\t\t\t\tCommodo consequat.\n\t\t\t\t\t</b>\n\t\t\t\t</p>\n\t\t\t\t<p class="gov-color--secondary-700">\n\t\t\t\t\tCommodo consequat. Nullam rhoncus aliquam metus.\n\t\t\t\t</p>\n\t\t\t\t<p class="gov-color--secondary-700">\n\t\t\t\t\t<a href="#">Chci vědět více</a>\n\t\t\t\t</p>\n\t\t\t</gov-card>\n\t\t\t<h3>Shadow variant</h3>\n\t\t\t<gov-card expanded class="gov-box-shadow--m">\n\t\t\t\t<img slot="img" src="https://picsum.photos/536/354" src="" alt="Obárzek" width="536" height="354">\n\t\t\t\t<p class="gov-text--l gov-color--secondary-800">\n\t\t\t\t\t<b>\n\t\t\t\t\t\tCommodo consequat.\n\t\t\t\t\t</b>\n\t\t\t\t</p>\n\t\t\t\t<p class="gov-color--secondary-700">\n\t\t\t\t\tCommodo consequat. Nullam rhoncus aliquam metus.\n\t\t\t\t</p>\n\t\t\t\t<gov-button variant="primary" size="s" href="http://localhost:3333/button">\n\t\t\t\t\tJak založit\n\t\t\t\t</gov-button>\n\t\t\t\t<gov-button variant="primary" type="outlined" size="s" href="http://localhost:3333/button">\n\t\t\t\t\tZjistit více\n\t\t\t\t</gov-button>\n\t\t\t</gov-card>\n\t\t\t<h3>With icon</h3>\n\t\t\t<gov-card>\n\t\t\t\t<gov-icon name="car" type="complex"></gov-icon>\n\t\t\t\t<p class="gov-color--secondary-700">\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras elementum. Fusce tellus odio, dapibus id fermentum quis, suscipit id erat. Fusce tellus.\n\t\t\t\t</p>\n\t\t\t\t<gov-button variant="primary" type="outlined" size="s" href="http://localhost:3333/button">\n\t\t\t\t\tLearn more\n\t\t\t\t</gov-button>\n\t\t\t</gov-card>\n\t\t\t<h3>Horizontal orientation</h3>\n\t\t\t<gov-card promotion>\n\t\t\t\t<gov-icon slot="icon" name="car" type="complex"></gov-icon>\n\t\t\t\t<p class="gov-color--secondary-700">\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras elementum. Fusce tellus odio, dapibus id fermentum quis, suscipit id erat. Fusce tellus.\n\t\t\t\t</p>\n\t\t\t\t<gov-button slot="btn" variant="primary" type="outlined" size="s" href="http://localhost:3333/button">\n\t\t\t\t\tLearn more\n\t\t\t\t</gov-button>\n\t\t\t</gov-card>\n\t\t</div>\n\n\t\t`}}if(customElements.get("card-page")===undefined){customElements.define("card-page",Ht)}class _t extends HTMLElement{connectedCallback(){this.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 variant="primary" size="s" inverse="">\n\t\t\t\tNot clickable S\n\t\t\t\t<gov-button slot="right" variant="primary" type="base" wcag-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 variant="primary" size="s">\n\t\t\t\tNot clickable S\n\t\t\t\t<gov-button slot="right" variant="primary" type="solid" wcag-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 variant="primary" size="m">\n\t\t\t\tNot clickable M\n\t\t\t\t<gov-button slot="right" variant="primary" type="solid" wcag-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</gov-chip>\n\t\t\t<gov-chip variant="primary" size="l">\n\t\t\t\tNot clickable L\n\t\t\t\t<gov-button slot="right" variant="primary" type="solid" wcag-label="Zavřít vše" size="l">\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 variant="primary" size="xl">\n\t\t\t\tNot clickable XL\n\t\t\t\t<gov-button slot="right" variant="primary" type="solid" wcag-label="Zavřít vše" size="xl">\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</div>\n\t\t\t<h4>Chips close (inversed)</h4>\n\t\t\t<div class="container-view gov-bg--primary-600">\n\t\t\t<gov-chip variant="primary" size="s" inverse>\n\t\t\t\tNot clickable S\n\t\t\t\t<gov-button slot="right" variant="primary" type="solid" wcag-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 variant="primary" size="m" inverse>\n\t\t\t\tNot clickable M\n\t\t\t\t<gov-button slot="right" variant="primary" type="solid" wcag-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</gov-chip>\n\t\t\t<gov-chip variant="primary" size="l" inverse>\n\t\t\t\tNot clickable L\n\t\t\t\t<gov-button slot="right" variant="primary" type="solid" wcag-label="Zavřít vše" size="l">\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 variant="primary" size="xl" inverse>\n\t\t\t\tNot clickable XL\n\t\t\t\t<gov-button slot="right" variant="primary" type="solid" wcag-label="Zavřít vše" size="xl">\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</div>\n\t\t\t<h4>Chips - primary (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="primary" size="xs">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" href="http://www.example.com/">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" disabled href="http://www.example.com/" target="_blank">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" size="l" href="http://www.example.com/">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tClickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tX-Large Primary\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<h4>Chips - primary (inversed)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="primary" size="xs" inverse>\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" size="s" inverse>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" href="http://www.example.com/" inverse>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" disabled href="http://www.example.com/" target="_blank" inverse>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" size="l" href="http://www.example.com/" inverse>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tClickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" size="xl" disabled inverse>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tX-Large Primary\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<h4>Chips - primary (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="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 variant="primary" tag="a" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall Primary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" tag="button" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal Primary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" tag="a" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge Primary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="primary" tag="button" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large Primary\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Chips - secondary (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="secondary" size="xs">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="secondary" size="xs" inverse>\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="secondary" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag="button" variant="secondary">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="secondary" disabled href="http://www.example.com/">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="secondary" size="l" tag="a">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tClickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="secondary" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tX-Large secondary\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<h4>Chips - secondary (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="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 variant="secondary" tag="a" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall secondary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="secondary" tag="button" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal secondary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="secondary" tag="a" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge secondary\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="secondary" tag="button" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large secondary\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Chips - success (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="success" size="xs">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="success" size="xs" inverse>\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="success" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag="button" variant="success">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="success" disabled href="http://www.example.com/">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="success" size="l" tag="a">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tClickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="success" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tX-Large success\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<h4>Chips - success (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="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 variant="success" tag="a" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall success\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="success" tag="button" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal success\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="success" tag="a" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge success\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="success" tag="button" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large success\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Chips - warning (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="warning" size="xs">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="warning" size="xs" inverse>\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="warning" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag="button" variant="warning">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="warning" disabled href="http://www.example.com/">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="warning" size="l" tag="a">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tClickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="warning" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tX-Large warning\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<h4>Chips - warning (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="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 variant="warning" tag="a" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall warning\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="warning" tag="button" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal warning\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="warning" tag="a" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge warning\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="warning" tag="button" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large warning\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Chips - error (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="error" size="xs">\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="error" size="xs" inverse>\n\t\t\t\t\tChip\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="error" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNot clickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip tag="button" variant="error">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tNormal href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="error" disabled href="http://www.example.com/">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tDisabled with href\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="error" size="l" href="http://www.example.com/">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tClickable\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="error" size="xl" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\tX-Large error\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t\t<h4>Chips - error (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-chip variant="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 variant="error" tag="a" type="outlined" size="s">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tSmall error\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="error" tag="button" type="outlined" disabled>\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tNormal error\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="error" tag="a" type="outlined" size="l">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tLarge error\n\t\t\t\t</gov-chip>\n\t\t\t\t<gov-chip variant="error" tag="button" type="outlined" disabled size="xl">\n\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\tX-Large error\n\t\t\t\t</gov-chip>\n\t\t\t</div>\n\t\t`}}if(customElements.get("chip-page")===undefined){customElements.define("chip-page",_t)}class Ut extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>Container</h2>\n\n\t\t<gov-container>\n\t\t\t<p>Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t</gov-container>\n\t\t`}}if(customElements.get("container-page")===undefined){customElements.define("container-page",Ut)}class It extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>Control Group</h2>\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 variant="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 variant="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 variant="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 variant="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 variant="primary" type="base" 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 variant="primary" type="base" 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 variant="primary" type="base" 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 variant="primary">\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 variant="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>\n\t\t\t<gov-button variant="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 variant="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 variant="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 />\n\t\t<gov-control-group variant="primary" no-border>\n\t\t<gov-button variant="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 variant="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 variant="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<br><br>\n\n\t\t<gov-control-group variant="secondary" no-border>\n\t\t\t<gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="primary" size="s"></gov-form-input>\n\t\t\t<gov-button variant="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 variant="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 variant="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</gov-control-group>\n\t\t<br />\n\t\t<gov-control-group variant="secondary">\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 variant="primary" type="outlined" 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 variant="secondary">\n\t\t\t<gov-button variant="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 variant="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 variant="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 />\n\t\t<gov-control-group variant="secondary">\n\t\t<gov-button variant="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 variant="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" variant="primary" 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 variant="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<br><br>\n\n\t\t<gov-control-group variant="secondary">\n\t\t\t<gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="secondary" size="s"></gov-form-input>\n\t\t\t<gov-button variant="secondary" 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 variant="secondary" 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 variant="secondary" 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</gov-control-group>\n\t\t<br />\n\t\t<gov-control-group variant="secondary" 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 variant="secondary" type="outlined" 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 variant="secondary">\n\t\t\t<gov-button variant="secondary" 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 variant="secondary" 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 variant="secondary" 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 />\n\t\t<gov-control-group variant="secondary">\n\t\t<gov-button variant="secondary" 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 variant="secondary" 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" variant="secondary" 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 variant="secondary" 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\n\t\t<br /><br />\n\t\t<gov-control-group variant="primary">\n\t\t<gov-button variant="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 variant="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" variant="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 variant="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 variant="secondary">\n\t\t<gov-button variant="secondary" 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 variant="secondary" 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" variant="secondary" 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 variant="secondary" 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 variant="success">\n\t\t<gov-button variant="success" 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 variant="success" 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" variant="success" 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 variant="success" 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 variant="warning">\n\t\t<gov-button variant="warning" 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 variant="warning" 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" variant="warning" 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 variant="warning" 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 variant="error">\n\t\t<gov-button variant="error" 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 variant="error" 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" variant="error" 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 variant="error" 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`}}if(customElements.get("control-group-page")===undefined){customElements.define("control-group-page",It)}class Rt extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<gov-cookiebar>\n\t\t\t\t<h2 class="h4">Můžeme si u vás uložit cookies?</h2>\n\n\t\t\t\t<p>\n\t\t\t\t\tCo že to znamená? Cookies jsou malé datové soubory, které slouží např. k tomu, aby si web pamatoval vaše nastavení a to, co vás zajímá, nebo abychom jej zlepšovali . Pro ukládání různých typů cookies od vás potřebujeme souhlas. Web bude fungovat i bez souhlasu, s ním ale o něco lépe.\n\t\t\t\t</p>\n\n\t\t\t\t<gov-button variant="primary" slot="actions-primary">\n\t\t\t\t\tSouhlasím se všemi\n\t\t\t\t</gov-button>\n\n\t\t\t\t<gov-button variant="primary" type="outlined" slot="actions-primary">\n\t\t\t\t\tOdmítnout všechny\n\t\t\t\t</gov-button>\n\n\t\t\t\t<gov-button variant="primary" type="base" slot="actions-secondary">\n\t\t\t\t\tPodrobné nastavení\n\t\t\t\t</gov-button>\n\t\t\t</gov-cookiebar>\n\t\t`}}if(customElements.get("cookiebar-page")===undefined){customElements.define("cookiebar-page",Rt)}class Zt extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>Empty</h2>\n\n\t\t<gov-empty>\n\t\t\t<gov-icon slot="icon" name="car" type="complex"></gov-icon>\n\t\t\t<p class="gov-text--2xl">\n\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Ipsum vitae etiam dui eget lectus vulputate ornare.\n\t\t\t</p>\n\t\t\t<p class="gov-text--l gov-color--secondary-700">\n\t\t\t\tInformace o tom, že je potřeba upřesnit vyhledávání\n\t\t\t</p>\n\t\t\t<gov-spacer size="l"></gov-spacer>\n\t\t\t<gov-button variant="primary">\n\t\t\t\tPřejít na jinou stránku\n\t\t\t</gov-button>\n\t\t</gov-empty>\n\t\t<gov-empty align="right">\n\t\t\t<gov-icon slot="icon" name="car" type="complex"></gov-icon>\n\t\t\t<p class="gov-text--2xl">\n\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Ipsum vitae etiam dui eget lectus vulputate ornare.\n\t\t\t</p>\n\t\t\t<p class="gov-text--l gov-color--secondary-700">\n\t\t\t\tInformace o tom, že je potřeba upřesnit vyhledávání\n\t\t\t</p>\n\t\t</gov-empty>\n\t\t<gov-empty align="center">\n\t\t\t<gov-icon slot="icon" name="car" type="complex"></gov-icon>\n\t\t\t<p class="gov-text--2xl">\n\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Ipsum vitae etiam dui eget lectus vulputate ornare.\n\t\t\t</p>\n\t\t\t<p class="gov-text--l gov-color--secondary-700">\n\t\t\t\tInformace o tom, že je potřeba upřesnit vyhledávání\n\t\t\t</p>\n\t\t</gov-empty>\n\t\t`}}if(customElements.get("empty-page")===undefined){customElements.define("empty-page",Zt)}class Ft extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>Error</h2>\n\t\t<gov-error-code>\n\t\t\t<gov-icon slot="icon" name="card-400" type="complex"></gov-icon>\n\t\t\t<h2 class="gov-text--6xl">Page Not Found</h2>\n\t\t\t<p class="gov-text--l">Sorry, the page you are looking for does not exist.</p>\n\t\t</gov-error-code>\n\t\t`}}if(customElements.get("error-page")===undefined){customElements.define("error-page",Ft)}class $t extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<gov-form-label>\n\t\t\t\tForm Label\n\t\t\t</gov-form-label>\n\t`}}if(customElements.get("form-label-page")===undefined){customElements.define("form-label-page",$t)}class Xt extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<gov-form-message>\n\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tDefault\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message>\n\t\t\t\t<p>\n\t\t\t\t\tDefault\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message variant="secondary">\n\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tSecondary\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message variant="secondary">\n\t\t\t\t<p>\n\t\t\t\t\tSecondary\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message variant="error">\n\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tError\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message variant="error">\n\t\t\t\t<p>\n\t\t\t\t\tError\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message variant="warning">\n\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tWarning\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message variant="warning">\n\t\t\t\t<p>\n\t\t\t\t\tWarning\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message variant="success">\n\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tSuccess\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message variant="success">\n\t\t\t\t<p>\n\t\t\t\t\tSuccess\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message>\n\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vitae dapibus eros, a dapibus metus. Ut a leo lorem. Sed ut fermentum diam. Sed porttitor ligula est, eget lobortis lacus rutrum et. Nunc sapien arcu, faucibus sit amet justo vel, aliquam gravida magna. Pellentesque et tempor risus. \n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\tAliquam suscipit justo dolor, et pellentesque dui venenatis quis. Vestibulum dignissim libero urna, non ultricies neque consequat ut.\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t\t\t<gov-form-message>\n\t\t\t\t<p>\n\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vitae dapibus eros, a dapibus metus. Ut a leo lorem. Sed ut fermentum diam. Sed porttitor ligula est, eget lobortis lacus rutrum et. Nunc sapien arcu, faucibus sit amet justo vel, aliquam gravida magna. Pellentesque et tempor risus. \n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\tAliquam suscipit justo dolor, et pellentesque dui venenatis quis. Vestibulum dignissim libero urna, non ultricies neque consequat ut.\n\t\t\t\t</p>\n\t\t\t</gov-form-message>\n\t`}}if(customElements.get("form-message-page")===undefined){customElements.define("form-message-page",Xt)}const Kt=t=>{if(!t)return t;return t.normalize("NFD").replace(/[\u0300-\u036f]/g,"")};const Wt=(t,o)=>Math.floor(Math.random()*(o-t+1)+t);const Gt=()=>[{name:"Pepa"},{name:"Katak"},{name:"Tomáš"},{name:"Ludvík"},{name:"Anežda"},{name:"Xaviér"},{name:"Ondřej"},{name:"Mirek"},{name:"Zdeněk"},{name:"Monika"},{name:"Jirka"},{name:"Abrahám"},{name:"Lucie"},{name:"Emily"},{name:"Pavel"},{name:"Gustav"},{name:"Amálie"}];class Jt extends HTMLElement{connectedCallback(){(()=>{setTimeout((()=>{const t=document.getElementById("moja");const o=document.getElementById("test-me-ujo");const n=document.getElementById("bagr");const e=document.getElementById("ba");const i=document.getElementById("kaprWWWWWW");const a=document.getElementById("poleno");if(e){e.addEventListener("gov-change",(function(t){console.log(t)}))}if(i){i.addEventListener("gov-blur",(function(t){console.log(t)}))}if(o){console.log(o);o.addEventListener("gov-add-file",(function(t){console.log(t.detail)}))}if(n){n.addEventListener("gov-select",(function(t){console.log(t)}));n.setSearchCallback((t=>new Promise((o=>{setTimeout((()=>{o(Gt().filter((({name:o})=>{if(!o)return false;return Kt(o).toLowerCase().indexOf(Kt(t).toLowerCase())>-1})))}),Wt(100,1e3))}))))}if(a){a.setOptions([{value:"a",name:"Aneta"},{value:"b",name:"Beata"},{value:"t",name:"Tomáš"}]);setTimeout((()=>{a.removeSelectedOption({value:"a",name:"Aneta"});a.getSelectedOptions().then((t=>console.log(t)))}),5e3)}if(t){t.setOptions([{value:"d",label:"Value D"},{value:"e",label:"Value E"},{value:"f",label:"Value F",disabled:true}]);setTimeout((()=>{t.value="h";t.setOptions([{value:"g",label:"Value G"},{value:"h",label:"Value H"},{value:"i",label:"Value I"}])}),2e3)}}),1e3)})();this.innerHTML=`\n\n\t<gov-form-control>\n\t\t\t\t<gov-form-label size="m" slot="top">Multiselect</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-multi-select name="test-me" size="xl" id="poleno">\n\t\t\t\t\t</gov-form-multi-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="m" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select  value="e" name="test-me" size="xl" id="moja">\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<h2>\n\t\t\t\tSamostatné použití\n\t\t\t</h2>\n\t\t\t<gov-form-input placeholder="Co hledáte" variant="primary">\n\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t</gov-form-input>\n\t\t\t<br>\n\t\t\t<gov-form-select size="l" name="test-me" invalid="true">\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<br>\n\t\t\t<gov-form-select size="l" name="test-me" success="true">\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<br>\n\t\t\t<gov-form-multi-select size="xl" id="ba" placeholder="Placeholder" wcag-described-by="me-and-you">\n\t\t\t\t<option value>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" selected>Value D</option>\n\t\t\t\t<option value="e">Value E</option>\n\t\t\t\t<option value="f">Value F</option>\n\t\t\t\t<option value="g">Value G</option>\n\t\t\t\t<option value="h">Value H</option>\n\t\t\t\t<option value="i" selected>Value I</option>\n\t\t\t</gov-form-multi-select>\n\t\t\t<br>\n\t\t\t<gov-form-multi-select size="xl" id="ba" placeholder="Placeholder" wcag-described-by="me-and-you" invalid="true">\n\t\t\t\t<option value>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" selected>Value D</option>\n\t\t\t\t<option value="e">Value E</option>\n\t\t\t\t<option value="f">Value F</option>\n\t\t\t\t<option value="g">Value G</option>\n\t\t\t\t<option value="h">Value H</option>\n\t\t\t\t<option value="i" selected>Value I</option>\n\t\t\t</gov-form-multi-select>\n\t\t\t<br>\n\t\t\t<gov-form-multi-select size="xl" id="ba" placeholder="Placeholder" wcag-described-by="me-and-you" success="true">\n\t\t\t\t<option value>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" selected>Value D</option>\n\t\t\t\t<option value="e">Value E</option>\n\t\t\t\t<option value="f">Value F</option>\n\t\t\t\t<option value="g">Value G</option>\n\t\t\t\t<option value="h">Value H</option>\n\t\t\t\t<option value="i" selected>Value I</option>\n\t\t\t</gov-form-multi-select>\n\t\t\t<br>\n\t\t\t<gov-form-checkbox name="test-me-c" value="me" checked no-label></gov-form-checkbox>\n\t\t\t<gov-form-radio name="superRadio2" value="me1" no-label></gov-form-radio>\n\t\t\t<br>\n\t\t\t<gov-form-radio name="superRadio2" value="me2" checked no-label></gov-form-radio>\n\t\t\t<gov-form-switch name="test-me" value="me2" checked no-label></gov-form-switch>\n\t\t\t<gov-form-checkbox name="test-me-c" value="me" checked>\n\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t</gov-form-checkbox>\n\t\t\t<gov-form-radio name="superRadio" value="me1">\n\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t</gov-form-radio>\n\t\t\t<gov-form-radio name="superRadio" value="me2" checked>\n\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t</gov-form-radio>\n\t\t\t<gov-form-switch name="test-me" value="me2" checked>\n\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t</gov-form-switch>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>\n\t\t\t\tDate & Time input (nativní)\n\t\t\t</h2>\n\t\t\t<gov-form-input size="m" placeholder="Co hledáte" input-type="datetime-local"></gov-form-input>\n\t\t\t<br>\n\t\t\t<gov-form-input size="l" placeholder="Co hledáte" input-type="date"></gov-form-input>\n\t\t\t<br>\n\t\t\t<gov-form-input size="xl" placeholder="Co hledáte" input-type="time"></gov-form-input>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>Search</h2>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-search name="test-me-c" value="me" variant="secondary">\n\t\t\t\t\t\t<gov-form-input slot="input" id="kapr" name="test-me" size="m" placeholder="Co hledáte"></gov-form-input>\n\t\t\t\t\t\t<gov-button slot="button" variant="primary" size="s">\n\t\t\t\t\t\t\t<gov-icon slot="left-icon" name="search"></gov-icon>\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</gov-form-search>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-search name="test-me-c" value="me" variant="primary">\n\t\t\t\t\t\t<gov-form-input slot="input" id="kapr" name="test-me" size="l" placeholder="Co hledáte"></gov-form-input>\n\t\t\t\t\t\t<gov-button slot="button" variant="primary" size="m">\n\t\t\t\t\t\t\tHledat\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</gov-form-search>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-search name="test-me-c" value="me"checked variant="secondary">\n\t\t\t\t\t\t<gov-form-input slot="input" id="kapr" size="xl" name="test-me" placeholder="Co hledáte"></gov-form-input>\n\t\t\t\t\t\t<gov-button slot="button" variant="secondary" size="l">\n\t\t\t\t\t\t\tHledat\n\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t</gov-form-search>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>File</h2>\n\t\t\t<div class="container-view">\n\t\t\t<h3>Normal 2</h3>\n\t\t\t\t<gov-form-control>\n\t\t\t\t\t<gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>\n\t\t\t\t\t<gov-form-group>\n\t\t\t\t\t\t<gov-form-file id="test-me-ujo" multiple accept=".pdf,.jpg,.png,.jpeg" max-file-size="616448">\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t<gov-button variant="primary" type="outlined" tabindex="-1">\n\t\t\t\t\t\t\t\t\tNahrát soubor ze zařízení\n\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p class="gov-text--s">\n\t\t\t\t\t\t\t\tPodporované formáty XML, PDF, DOC\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</gov-form-file>\n\t\t\t\t\t</gov-form-group>\n\t\t\t\t</gov-form-control>\n\t\t\t\t<br>\n\t\t\t\t<gov-form-control>\n\t\t\t\t\t<gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>\n\t\t\t\t\t<gov-form-group>\n\t\t\t\t\t\t<gov-form-file name="test-me-c">\n\t\t\t\t\t\t\t<p aria-hidden="true">\n\t\t\t\t\t\t\t\t<gov-button variant="primary" type="outlined">\n\t\t\t\t\t\t\t\t\t<gov-icon slot="left-icon" name="upload"></gov-icon>\n\t\t\t\t\t\t\t\t\tNahrát soubor ze zařízení\n\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p class="gov-text--s">\n\t\t\t\t\t\t\t\tPodporované formáty XML, PDF, DOC\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</gov-form-file>\n\t\t\t\t\t</gov-form-group>\n\t\t\t\t</gov-form-control>\n\t\t\t\t<br>\n\t\t\t\t<gov-form-control>\n\t\t\t\t\t<gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>\n\t\t\t\t\t<gov-form-group>\n\t\t\t\t\t\t<gov-form-file name="test-me-c" invalid>\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t<gov-button variant="primary" type="outlined">\n\t\t\t\t\t\t\t\t\t<gov-icon slot="left-icon" name="upload"></gov-icon>\n\t\t\t\t\t\t\t\t\tNahrát soubor ze zařízení\n\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p class="gov-text--s">\n\t\t\t\t\t\t\t\tPodporované formáty XML, PDF, DOC\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</gov-form-file>\n\t\t\t\t\t</gov-form-group>\n\t\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\t\tRequired\n\t\t\t\t\t</gov-form-message>\n\t\t\t\t</gov-form-control>\n\t\t\t\t<br>\n\n\t\t\t\t<h3>Expanded</h3>\n\t\t\t\t<gov-form-control>\n\t\t\t\t\t<gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>\n\t\t\t\t\t<gov-form-group>\n\t\t\t\t\t\t<gov-form-file expanded name="test-me-c">\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\tPřetáhněte soubor nebo\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t<gov-button variant="primary" type="outlined">\n\t\t\t\t\t\t\t\t\tNahrajte ze zařízení\n\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p class="gov-text--s">\n\t\t\t\t\t\t\t\tPodporované formáty XML, PDF, DOC\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</gov-form-file>\n\t\t\t\t\t</gov-form-group>\n\t\t\t\t</gov-form-control>\n\t\t\t\t<br>\n\t\t\t\t<gov-form-control disabled>\n\t\t\t\t\t<gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>\n\t\t\t\t\t<gov-form-group>\n\t\t\t\t\t\t<gov-form-file expanded name="test-me-c" disabled>\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\tPřetáhněte soubor nebo\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t<gov-button disabled variant="primary" type="outlined">\n\t\t\t\t\t\t\t\t\tNahrát ze zařízení\n\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p class="gov-text--s">\n\t\t\t\t\t\t\t\tPodporované formáty XML, PDF, DOC\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</gov-form-file>\n\t\t\t\t\t</gov-form-group>\n\t\t\t\t</gov-form-control>\n\t\t\t\t<br>\n\t\t\t\t<gov-form-control invalid>\n\t\t\t\t\t<gov-form-label size="s" slot="top">Přidat přílohu *</gov-form-label>\n\t\t\t\t\t<gov-form-group>\n\t\t\t\t\t\t<gov-form-file expanded name="test-me-c" invalid>\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\tPřetáhněte soubor nebo\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t<gov-button variant="primary" type="outlined">\n\t\t\t\t\t\t\t\t\tNahrát ze zařízení\n\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t<p class="gov-text--s">\n\t\t\t\t\t\t\t\tPodporované formáty XML, PDF, DOC\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</gov-form-file>\n\t\t\t\t\t</gov-form-group>\n\t\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\t\tRequired\n\t\t\t\t\t</gov-form-message>\n\t\t\t\t</gov-form-control>\n\t\t\t\t<br>\n\t\t\t</div>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>Multiselect</h2>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label slot="top">Multiselect</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-multi-select id="ba" placeholder="Placeholder" wcag-described-by="me-and-you">\n\t\t\t\t\t\t<option value>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d" selected>Value D</option>\n\t\t\t\t\t\t<option value="e">Value E</option>\n\t\t\t\t\t\t<option value="f">Value F</option>\n\t\t\t\t\t\t<option value="g">Value G</option>\n\t\t\t\t\t\t<option value="h">Value H</option>\n\t\t\t\t\t\t<option value="i" selected>Value I</option>\n\t\t\t\t\t</gov-form-multi-select>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>Autocomplete</h2>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label slot="top">Label of autocomplete</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-autocomplete placeholder="Placeholder autcomplete" id="bagr">\n\t\t\t\t\t\t<gov-icon name="search" slot="right-icon" />\n\t\t\t\t\t</gov-form-autocomplete>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label slot="top">Label of autocomplete</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-autocomplete placeholder="Placeholder autcomplete" id="bagr" invalid="true">\n\t\t\t\t\t\t<gov-icon name="search" slot="right-icon" />\n\t\t\t\t\t</gov-form-autocomplete>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control success="true">\n\t\t\t\t<gov-form-label slot="top">Label of autocomplete</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-autocomplete placeholder="Placeholder autcomplete" id="bagr" success="true">\n\t\t\t\t\t\t<gov-icon name="search" slot="right-icon" />\n\t\t\t\t\t</gov-form-autocomplete>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label slot="top">Label of autocomplete</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-autocomplete placeholder="Placeholder autcomplete" id="bagr" disabled="true">\n\t\t\t\t\t\t<gov-icon name="search" slot="right-icon" />\n\t\t\t\t\t</gov-form-autocomplete>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>Textarea</h2>\n\t\t\t<h3>\n\t\t\t\tDefault\n\t\t\t</h3>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of textarea</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input multiline rows="3" name="test-me" placeholder="Placeholder">\n\t\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tInvalid\n\t\t\t</h3>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of textarea</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input required multiline rows="3" name="test-me" value="Value of textarea" invalid="TRUE"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tDisabled\n\t\t\t</h3>\n\t\t\t<gov-form-control id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of textarea</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input multiline rows="3" name="test-me" disabled value="Value of textarea"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>Checkbox</h2>\n\t\t\t<h3>\n\t\t\t\tGaps\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="xs" slot="top">Label of word</gov-form-label>\n\t\t\t\t<gov-form-group gap="2xs">\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="xs" checked></gov-form-checkbox>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="xs" checked></gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group gap="2xs">\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="xs" required checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Option 1</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="xs" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Option 2</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group gap="xs">\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="s" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Option 1</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="s" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Option 2</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group gap="s">\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="m" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Option 1</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="m" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Option 2</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group gap="m">\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="l" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Option 1</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="l" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Option 2</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tDefault\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="xs" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="s" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="m" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="l" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tInvalid\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="xs" checked invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="s" checked invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="m" checked invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tDisabled\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="xs" disabled>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="s" disabled="True">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="m" checked disabled="TRUE">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-checkbox name="test-me-c" value="me" size="l" checked disabled="1">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-checkbox>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>Radio</h2>\n\t\t\t<h3>\n\t\t\t\tDefault group\n\t\t\t</h3>\n\t\t\t<gov-form-control fieldset>\n\t\t\t\t\t<gov-form-label legend size="s" slot="top">Seznam skupiny</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test1" value="me" size="xs">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test1" value="me2" size="xs" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test2" value="me" size="s">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test2" value="me2" size="s" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test3" value="me" size="m">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test3" value="me2" size="m" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test4" value="me" size="l">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test4" value="me2" size="l" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tInvalid\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test5" value="me" size="xs" invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test5" value="me2" size="xs" checked invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test6" value="me" size="s" invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test6" value="me2" size="s" checked invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test7" value="me" size="m" invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test7" value="me2" size="m" checked invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test8" value="me" size="l" invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test8" value="me2" size="l" checked invalid="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tDisabled\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test9" value="me" size="xs" disabled>\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test9" value="me2" size="xs" checked disabled>\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test10" value="me" size="s" disabled="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test10" value="me2" size="s" checked disabled="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test11" value="me" size="m" disabled="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test11" value="me2" size="m" checked disabled="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-radio name="test12" value="me" size="l" disabled="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 1</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t\t<gov-form-radio name="test12" value="me2" size="l" checked disabled="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Value 2</gov-form-label>\n\t\t\t\t\t</gov-form-radio>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>Select</h2>\n\t\t\t<h3>\n\t\t\t\tDefault\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="s">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="m">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="l">\n\t\t\t\t\t\t<option value="a" selected>Value A</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="m" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="xl">\n\t\t\t\t\t\t<option value="a" selected>Value A</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tPrefix / sufix\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="s">\n\t\t\t\t\t\t<span slot="prefix">$</span>\n\t\t\t\t\t\t<span slot="sufix">Kč</span>\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="m">\n\t\t\t\t\t\t<span slot="prefix">$</span>\n\t\t\t\t\t\t<span slot="sufix">Kč</span>\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="l">\n\t\t\t\t\t\t<span slot="prefix">$</span>\n\t\t\t\t\t\t<span slot="sufix">Kč</span>\n\t\t\t\t\t\t<option value="a" selected>Value A</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="m" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="l">\n\t\t\t\t\t\t<span slot="prefix">$</span>\n\t\t\t\t\t\t<span slot="sufix">Kč</span>\n\t\t\t\t\t\t<option value="a" selected>Value A</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tSuccess\n\t\t\t</h3>\n\t\t\t<gov-form-control success="true">\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="s" success="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control success="true">\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="m" success="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control success="true">\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="l" success="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control success="true">\n\t\t\t\t<gov-form-label size="m" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="xl" success="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tInvalid\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="s" invalid="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="m" invalid="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="l" invalid="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="m" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="xl" invalid="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tDisabled\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="s" disabled>\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="m" disabled>\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="m" disabled="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="m" slot="top">Souhlasím</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-select name="test-me" size="l" disabled="true">\n\t\t\t\t\t\t<option value="" selected>Placeholder</option>\n\t\t\t\t\t\t<option value="b">Value B</option>\n\t\t\t\t\t\t<option value="c">Value C</option>\n\t\t\t\t\t\t<option value="d">Value D</option>\n\t\t\t\t\t</gov-form-select>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>Input</h2>\n\t\t\t<h3>\n\t\t\t\tPrimary\n\t\t\t</h3>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="primary" size="s"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="primary" size="m"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input 3333</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" variant="primary" size="l"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="m" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" variant="primary" size="xl"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tSecondary\n\t\t\t</h3>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="secondary" size="s"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" variant="secondary" size="m"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input 3333</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" variant="secondary" size="l"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="m" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" variant="secondary" size="xl"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tPrefix / sufix\n\t\t\t</h3>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" size="s">\n\t\t\t\t\t\t<p slot="prefix">$</p>\n\t\t\t\t\t\t<p slot="sufix">Kč</p>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" id="kapr" name="test-me" placeholder="Placeholder" size="m">\n\t\t\t\t\t\t<span slot="prefix">$</span>\n\t\t\t\t\t\t<span slot="sufix">Kč</span>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="l">\n\t\t\t\t\t\t<span slot="prefix">$</span>\n\t\t\t\t\t\t<span slot="sufix">Kč</span>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="m" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="xl">\n\t\t\t\t\t\t<span slot="prefix">$</span>\n\t\t\t\t\t\t<span slot="sufix">Kč</span>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tLeft icon\n\t\t\t</h3>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s">\n\t\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m">\n\t\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="l">\n\t\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="m" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="xl">\n\t\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tRight icon\n\t\t\t</h3>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s">\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m">\n\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="l">\n\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="m" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="xl">\n\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tSuccess\n\t\t\t</h3>\n\t\t\t<gov-form-control type="input" id="metro2" success="true">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2" success="true">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2" success="True">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="l">\n\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2" success="1">\n\t\t\t\t<gov-form-label size="m" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="xl">\n\t\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tInvalid\n\t\t\t</h3>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s" invalid="true"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m" invalid="true"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="l" invalid="true">\n\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="m" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="xl" invalid="true">\n\t\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tDisabled\n\t\t\t</h3>\n\t\t\t<gov-form-control size="m" type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="s" disabled>\n\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control size="m" type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" placeholder="Placeholder" size="m" disabled>\n\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="l" disabled="True">\n\t\t\t\t\t\t<gov-icon slot="right-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="input" id="metro2">\n\t\t\t\t<gov-form-label size="m" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input id="kapr" name="test-me" value="Value of input" size="xl" disabled="1">\n\t\t\t\t\t\t<gov-icon slot="left-icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h3>\n\t\t\t\tPassword power\n\t\t\t</h3>\n\t\t\t<gov-form-password-power power="0"></gov-form-password-power>\n\t\t\t<gov-form-password-power power="1">slabé</gov-form-password-power>\n\t\t\t<gov-form-password-power power="2">střední</gov-form-password-power>\n\t\t\t<gov-form-password-power power="3">silné</gov-form-password-power>\n\n\n\t\t\t\x3c!-- ----------------------------------------------------------------------------------------------------------------------------- --\x3e\n\n\n\t\t\t<h2>Switch</h2>\n\t\t\t<h3>\n\t\t\t\tDefault\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="xs" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="s" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="m" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="l" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tWith message\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="xs" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="s" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="m" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="l" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t\t<gov-form-message slot="bottom" variant="error">\n\t\t\t\t\t<gov-icon slot="icon" name="exclamation-triangle-fill"></gov-icon>\n\t\t\t\t\tRequired\n\t\t\t\t</gov-form-message>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tWith label\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Label of toggle</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="xs" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="s" slot="top">Label of toggle</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="s" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="m" slot="top">Label of toggle</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="m" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-label size="m" slot="top">Label of toggle</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="l" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tDisabled\n\t\t\t</h3>\n\t\t\t<gov-form-control type="switch">\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="xs" disabled>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="switch">\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="s" disabled="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="switch">\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="m" checked disabled="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control type="switch">\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch name="test-me" value="me" size="l" checked disabled="true">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\n\t\t\t<h3>\n\t\t\t\tInvalid\n\t\t\t</h3>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch invalid name="test-me" value="me" size="xs" invalid="True">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch invalid name="test-me" value="me" size="s" invalid="TRUE">\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch invalid name="test-me" value="me" size="m" invalid="true" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<gov-form-control>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-switch invalid name="test-me" value="me" size="l" invalid="1" checked>\n\t\t\t\t\t\t<gov-form-label slot="label">Souhlasím</gov-form-label>\n\t\t\t\t\t</gov-form-switch>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t`}}if(customElements.get("forms-page")===undefined){customElements.define("forms-page",Jt)}class Qt extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<h4>Forms</h4>\n\t\t\t<div class="container-view container-view--inline">\n\t\t\t</div>\n\t\t`}}if(customElements.get("forms-restructue-page")===undefined){customElements.define("forms-restructue-page",Qt)}class Yt extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>\n\t\t\tGrid\n\t\t</h2>\n\t\t<style>\n\t\t\t.gov-grid-item span {\n\t\t\t\tdisplay: block;\n\t\t\t\tbackground: lightgray;\n\t\t\t\tpadding: 10px;\n\t\t\t}\n\t\t</style>\n\t\t<gov-grid>\n\t\t\t<gov-grid-item size="1/12"><span>1/12</span></gov-grid-item>\n\t\t\t<gov-grid-item size="11/12"><span>11/12</span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\t\t<gov-grid>\n\t\t\t<gov-grid-item size="2/12"><span>2/12</span></gov-grid-item>\n\t\t\t<gov-grid-item size="10/12"><span>10/12</span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\t\t<gov-grid>\n\t\t\t<gov-grid-item size="3/12"><span>3/12</span></gov-grid-item>\n\t\t\t<gov-grid-item size="9/12"><span>9/12</span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\t\t<gov-grid>\n\t\t\t<gov-grid-item size="4/12"><span>4/12</span></gov-grid-item>\n\t\t\t<gov-grid-item size="8/12"><span>8/12</span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\t\t<gov-grid>\n\t\t\t<gov-grid-item size="5/12"><span>5/12</span></gov-grid-item>\n\t\t\t<gov-grid-item size="7/12"><span>7/12</span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\t\t<gov-grid>\n\t\t\t<gov-grid-item size="6/12"><span>6/12</span></gov-grid-item>\n\t\t\t<gov-grid-item size="6/12"><span>6/12</span></gov-grid-item>\n\t\t</gov-grid>\n\n\t\t<h2>Responsive grid</h2>\n\t\t<gov-grid>\n\t\t\t<gov-grid-item size-sm="6/12" size-md="4/12" size-lg="3/12" size-xl="2/12"><span>Cell 1</span></gov-grid-item>\n\t\t\t<gov-grid-item size-sm="6/12" size-md="4/12" size-lg="3/12" size-xl="2/12"><span>Cell 2</span></gov-grid-item>\n\t\t\t<gov-grid-item size-sm="6/12" size-md="4/12" size-lg="3/12" size-xl="2/12"><span>Cell 3</span></gov-grid-item>\n\t\t\t<gov-grid-item size-sm="6/12" size-md="4/12" size-lg="3/12" size-xl="2/12"><span>Cell 4</span></gov-grid-item>\n\t\t\t<gov-grid-item size-sm="6/12" size-md="4/12" size-lg="3/12" size-xl="2/12"><span>Cell 5</span></gov-grid-item>\n\t\t\t<gov-grid-item size-sm="6/12" size-md="4/12" size-lg="3/12" size-xl="2/12"><span>Cell 6</span></gov-grid-item>\n\t\t</gov-grid>\n\n\t\t<h2>Horizontal (X) align</h2>\n\t\t<gov-grid>\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. Ut et tempor risus. In volutpat nec diam semper iaculis. Nam tempus varius nunc, eu congue mauris ornare nec. Sed sodales et nisl vitae volutpat. Duis luctus metus ut justo vestibulum, id suscipit lacus suscipit. Vestibulum at nisi at turpis volutpat fermentum non id erat. Morbi mauris eros, porttitor non tellus sed, iaculis ultrices tellus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae.</span></gov-grid-item>\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. </span></gov-grid-item>\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. Ut et tempor risus. In volutpat nec diam semper iaculis. Nam tempus varius nunc, eu congue mauris ornare nec. Sed sodales et nisl vitae volutpat. Duis luctus metus ut justo vestibulum, id suscipit lacus suscipit. Vestibulum at nisi at turpis volutpat fermentum non id erat.</span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\t\t<gov-grid align-x="middle">\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. Ut et tempor risus. In volutpat nec diam semper iaculis. Nam tempus varius nunc, eu congue mauris ornare nec. Sed sodales et nisl vitae volutpat. Duis luctus metus ut justo vestibulum, id suscipit lacus suscipit. Vestibulum at nisi at turpis volutpat fermentum non id erat. Morbi mauris eros, porttitor non tellus sed, iaculis ultrices tellus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae.</span></gov-grid-item>\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. </span></gov-grid-item>\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. Ut et tempor risus. In volutpat nec diam semper iaculis. Nam tempus varius nunc, eu congue mauris ornare nec. Sed sodales et nisl vitae volutpat. Duis luctus metus ut justo vestibulum, id suscipit lacus suscipit. Vestibulum at nisi at turpis volutpat fermentum non id erat.</span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\t\t<gov-grid align-x="bottom">\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. Ut et tempor risus. In volutpat nec diam semper iaculis. Nam tempus varius nunc, eu congue mauris ornare nec. Sed sodales et nisl vitae volutpat. Duis luctus metus ut justo vestibulum, id suscipit lacus suscipit. Vestibulum at nisi at turpis volutpat fermentum non id erat. Morbi mauris eros, porttitor non tellus sed, iaculis ultrices tellus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae.</span></gov-grid-item>\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. </span></gov-grid-item>\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. Ut et tempor risus. In volutpat nec diam semper iaculis. Nam tempus varius nunc, eu congue mauris ornare nec. Sed sodales et nisl vitae volutpat. Duis luctus metus ut justo vestibulum, id suscipit lacus suscipit. Vestibulum at nisi at turpis volutpat fermentum non id erat.</span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\n\t\t<h2>Vertical (Y) align</h2>\n\t\t<gov-grid>\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. </span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\t\t<gov-grid align-y="center">\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. </span></gov-grid-item>\n\t\t</gov-grid>\n\t\t<br>\n\t\t<gov-grid align-y="right">\n\t\t\t<gov-grid-item size="4/12"><span>Curabitur tincidunt leo elit, et accumsan leo vestibulum sit amet. Nulla quis nibh a diam ultricies volutpat. Pellentesque fringilla id diam in placerat. Pellentesque consectetur, nisl tincidunt scelerisque vulputate, diam velit cursus neque, eu posuere urna metus id justo. </span></gov-grid-item>\n\t\t</gov-grid>\n\t\t\t`}}if(customElements.get("grid-page")===undefined){customElements.define("grid-page",Yt)}class to extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<form style="padding: 20px;">\n\t\t\t<gov-form-label legend>\n\t\t\t\tForm Label legend\n\t\t\t</gov-form-label>\n\t\t\t<gov-form-control type="input">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" name="test-me" placeholder="Placeholder" variant="primary" size="s"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br><br>\n\t\t\t<legend>Legend</legend>\n\t\t\t<gov-form-control type="input">\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" name="test-me" placeholder="Placeholder" variant="primary" size="s"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br><br>\n\t\t\t<gov-form-control type="input" fieldset>\n\t\t\t\t<gov-form-label size="s" slot="top">Form control fieldset</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" name="test-me" placeholder="Placeholder" variant="primary" size="s"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</gov-form-control>\n\t\t\t<br><br>\n\t\t\t<fieldset>\n\t\t\t\t<gov-form-label size="s" slot="top">Fieldset</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" name="test-me" placeholder="Placeholder" variant="primary" size="s"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</fieldset>\n\t\t\t<br><br>\n\t\t\t<fieldset>\n\t\t\t\t<legend>Fieldset & Legend</legend>\n\t\t\t\t<gov-form-label size="s" slot="top">Label of input</gov-form-label>\n\t\t\t\t<gov-form-group>\n\t\t\t\t\t<gov-form-input type="number" name="test-me" placeholder="Placeholder" variant="primary" size="s"></gov-form-input>\n\t\t\t\t</gov-form-group>\n\t\t\t</fieldset>\n\t\t</form>\n\t\t`}}if(customElements.get("home-page")===undefined){customElements.define("home-page",to)}class oo extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>Infobar</h2>\n\n\t\t<div class="gov-bg--secondary-800">\n\t\t\t<gov-container>\n\t\t\t\t<gov-infobar variant="secondary" headline="Tohle bude super nadpis pro všechno" closable>\n\t\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-infobar>\n\t\t\t</gov-container>\n\t\t</div>\n\n\t\t<div class="gov-bg--primary-600">\n\t\t\t<gov-container>\n\t\t\t\t<gov-infobar variant="primary" headline="Tohle bude super nadpis pro všechno" closable>\n\t\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-infobar>\n\t\t\t</gov-container>\n\t\t</div>\n\n\t\t<div class="gov-bg--success-500">\n\t\t\t<gov-container>\n\t\t\t\t<gov-infobar variant="success" headline="Tohle bude super nadpis pro všechno" closable>\n\t\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-infobar>\n\t\t\t</gov-container>\n\t\t</div>\n\n\t\t<div class="gov-bg--error-400">\n\t\t\t<gov-container>\n\t\t\t\t<gov-infobar variant="error" headline="Tohle bude super nadpis pro všechno" closable>\n\t\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-infobar>\n\t\t\t</gov-container>\n\t\t</div>\n\n\t\t<div class="gov-bg--warning-400">\n\t\t\t<gov-container>\n\t\t\t\t<gov-infobar variant="warning" headline="Tohle bude super nadpis pro všechno" closable>\n\t\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-infobar>\n\t\t\t</gov-container>\n\t\t</div>\n\n\t\t<br/>\n\n\t\t<gov-infobar variant="secondary" headline="Tohle bude super nadpis pro všechno" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\n\n\t\t<br>\n\t\t<gov-infobar variant="secondary">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\t\t<br>\n\t\t<gov-infobar variant="warning" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tWarning - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\t\t<br>\n\t\t<gov-infobar variant="error" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tError - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\t\t<br>\n\t\t<gov-infobar variant="success" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tError - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\t\t<br>\n\t\t<gov-infobar variant="primary" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tError - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\n\t\t<h3>Inverse</h3>\n\t\t<br>\n\t\t<gov-infobar inverse="TRUE" variant="secondary" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\t\t<br>\n\t\t<gov-infobar inverse="True" variant="warning" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tWarning - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\t\t<br>\n\t\t<gov-infobar inverse="1" variant="error" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tError - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\t\t<br>\n\t\t<gov-infobar inverse="true" variant="success" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tError - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\t\t<br>\n\t\t<gov-infobar inverse="true" variant="primary" closable>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tError - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-infobar>\n\t\t`}}if(customElements.get("infobar-page")===undefined){customElements.define("infobar-page",oo)}class no extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>Layout</h2>\n\n\t\t<gov-container>\n\t\t\t<gov-layout type="stretch">\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Stretch</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t\t<gov-layout>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Stretch</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Stretch</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t\t<gov-layout>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Stretch</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Stretch</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Stretch</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t\t<gov-layout type="aside" variant="right">\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Aside right</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Aside right</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t\t<gov-layout type="aside" variant="left">\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Aside left</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Aside left</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t\t<gov-layout type="aside" variant="right" inverse>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Aside right inverse</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Aside right inverse</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t\t<gov-layout type="aside" variant="left" inverse>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Aside left inverse</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Aside left inverse</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t\t<gov-layout type="text" variant="left">\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Text left</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t\t<gov-layout type="text">\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Text</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t\t<gov-layout type="text" variant="right">\n\t\t\t\t<gov-layout-column>\n\t\t\t\t\t<p><b>Text right</b> Ut sollicitudin risus sit amet placerat fermentum. Sed libero mauris, maximus cursus magna tincidunt, efficitur congue enim. Suspendisse potenti. Sed ac eleifend leo. Nullam a sapien in diam semper faucibus sit amet vel nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eu faucibus mi. Morbi leo ipsum, tempus vel vulputate non, varius et lectus. Donec justo lacus, congue hendrerit felis sit amet, commodo lobortis neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Nulla vulputate urna sapien. Proin imperdiet rhoncus dictum. Pellentesque tempor ultrices tortor, ac mollis lorem mollis non. Phasellus sit amet maximus ex, id scelerisque nulla. Etiam eu orci a nulla semper maximus et at quam.</p>\n\t\t\t\t</gov-layout-column>\n\t\t\t</gov-layout>\n\t\t\t<br>\n\t\t</gov-container>\n\t\t<br>\n\n\t\t`}}if(customElements.get("layout-page")===undefined){customElements.define("layout-page",no)}class eo extends HTMLElement{connectedCallback(){setTimeout((function(){document.getElementById("btn").addEventListener("gov-click",(function(){document.getElementById("loading").setAttribute("loading","true")}))}),500);this.innerHTML=`\n\t\t\t<h2>Loading</h2>\n\t\t\t<div class="preview-container">\n      <div class="skeletons-defaults">\n        <h2>Default</h2>\n        <gov-skeleton variant="success"></gov-skeleton>     \n      </div>\n      <div class="skeletons-appearance-circle">\n        <h2>Default circle</h2>\n        <gov-skeleton shape="circle"> </gov-skeleton>\n      </div> \n      <div class="skeletons-appearance-circle">\n        <h2>Default rect</h2>\n        <gov-skeleton shape="rect"> </gov-skeleton>\n      </div>       \n      <div class="skeletons-with-count">\n        <h2>Default 4 rows</h2>\n        <gov-skeleton count="2"></gov-skeleton>\n      </div>           \n      <div class="skeletons-animation-no-animation">\n        <h2>Without animation</h2>\n        <gov-skeleton animation="false"></gov-skeleton>\n      </div>\n      <div class="skeletons-animation-pulse">\n        <h2>Pulse animation</h2>\n        <gov-skeleton animation="pulse"></gov-skeleton>\n      </div>\n      <div class="skeletons-animation-progress">\n        <h2>Progress animation</h2>\n        <gov-skeleton animation="progress"></gov-skeleton>\n      </div>\n      <div class="skeletons-with-theming">\n        <h2>Custom styles</h2>\n        <style>\n          .custom-skeleton {\n            --skeleton-width: 100px;\n            --skeleton-height: 100px;\n            --skeleton-background: #cccccc;\n            --skeleton-border-radius: 20px;\n          }\n        </style>\n        <gov-skeleton></gov-skeleton>\n      </div>\n      <div>\n        <h2>Custom width</h2>\n        <gov-skeleton width="500px"></gov-skeleton>\n      </div>\n      <div>\n        <h2>Custom height</h2>\n        <gov-skeleton height="80px"></gov-skeleton>\n      </div>\n    </div>\n\t\t\t\n\t\t\t\n\t\t\t<gov-button variant="primary" id="btn" wcag-label="Zobrazit načítání">Zobrazit načítání</gov-button>\n\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-loading id="loading">Načítání</gov-loading>\n\t\t`}}if(customElements.get("loading-page")===undefined){customElements.define("loading-page",eo)}class io extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>\n\t\t\tContent Message\n\t\t</h2>\n\t\t<gov-message variant="error">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-message>\n\t\t<br>\n\t\t<gov-message variant="primary">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-message>\n\t\t<br>\n\t\t<gov-message variant="success">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-message>\n\t\t<br>\n\t\t<gov-message variant="warning">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-message>\n\t\t<br>\n\t\t<gov-message variant="secondary">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-message>\n\t\t<br>\n\n\t\t<div class="gov-bg--secondary-300" style="padding: 48px">\n\t\t\t<h3>Inverse</h3>\n\t\t\t<gov-message inverse variant="error">\n\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t</p>\n\t\t\t</gov-message>\n\t\t\t<br>\n\t\t\t<gov-message inverse variant="primary">\n\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t</p>\n\t\t\t</gov-message>\n\t\t\t<br>\n\t\t\t<gov-message inverse variant="success">\n\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t</p>\n\t\t\t</gov-message>\n\t\t\t<br>\n\t\t\t<gov-message inverse variant="warning">\n\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t</p>\n\t\t\t</gov-message>\n\t\t\t<br>\n\t\t\t<gov-message inverse variant="secondary">\n\t\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t\t<p>\n\t\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t</p>\n\t\t\t</gov-message>\n\t\t</div>\n\n\t\t<h3>Shadow</h3>\n\t\t<gov-message variant="secondary" shadow>\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tFont awesome. Default - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t</p>\n\t\t</gov-message>\n\t\t\t`}}if(customElements.get("message-page")===undefined){customElements.define("message-page",io)}class ao extends HTMLElement{connectedCallback(){setTimeout((function(){document.getElementById("btn").addEventListener("gov-click",(function(){document.getElementById("modal").setAttribute("open","true")}))}),500);this.innerHTML=`\n\t\t\t<h2>Modal</h2>\n\t\t\t<gov-button variant="primary" 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-modal label="Podání daňového přiznání" id="modal" wcag-close-label="Zavřít modal žádosti o dávku">\n\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t<h3>Obsah modálního okna</h3>\n\t\t\t\t<p>Bude tvořen libovolnými komponentami</p>\n\t\t\t\t<h3>Obsah modálního okna</h3>\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. Quisque sollicitudin risus eu neque accumsan vulputate. Ut tincidunt metus eu nulla sodales, vitae dictum justo ornare. In tincidunt lobortis nunc, ac imperdiet odio condimentum nec. Ut aliquet pulvinar ligula vitae tincidunt. Phasellus egestas ut leo pretium laoreet. Fusce et vestibulum purus. Duis semper sem massa, non dignissim nunc aliquam sit amet.\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\tPraesent blandit mattis neque varius sagittis. Nulla ac scelerisque justo. Vestibulum aliquet blandit pharetra. Quisque lacus mi, tincidunt ac dui at, lobortis efficitur nisi. Fusce laoreet maximus purus, sit amet pulvinar mauris facilisis in. Integer fermentum elit eu aliquam sodales. Curabitur laoreet pharetra est rutrum posuere. In at eros tempus ex sodales facilisis. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras placerat dolor ac urna elementum facilisis. Aenean diam nibh, sollicitudin in porta sed, laoreet in nisl. Ut scelerisque tortor augue, vitae fermentum dui ornare non. Nulla fringilla libero non metus venenatis, eu maximus massa placerat. Praesent elementum convallis metus, vel iaculis sem pretium cursus.\n\t\t\t\t</p>\n\t\t\t\t<gov-button slot="footer" variant="primary" wcag-label="Vyplnit formulář o výši dávky">Vyplnit formulář</gov-button>\n\t\t\t</gov-modal>\n\t\t`}}if(customElements.get("modal-page")===undefined){customElements.define("modal-page",ao)}class so extends HTMLElement{connectedCallback(){this.innerHTML=`\n\n\t\t\t<h4>Nav</h4>\n\n\t\t\t<gov-nav wcag-label="Hlavní navigace">\n\t\t\t\t<gov-nav-item href="#">\n\t\t\t\t\tÚvod\n\t\t\t\t</gov-nav-item>\n\t\t\t\t<gov-nav-item href="#">\n\t\t\t\t\tSlužby veřejná správy\n\t\t\t\t</gov-nav-item>\n\t\t\t\t<gov-nav-item href="#">\n\t\t\t\t\tŽivotní události\n\t\t\t\t</gov-nav-item>\n\t\t\t\t<gov-nav-item href="#">\n\t\t\t\t\tO živote v ČR\n\t\t\t\t</gov-nav-item>\n\t\t\t\t<gov-nav-item href="#">\n\t\t\t\t\tČasté dotazy\n\t\t\t\t</gov-nav-item>\n\t\t\t</gov-nav>\n\t\t`}}if(customElements.get("nav-page")===undefined){customElements.define("nav-page",so)}class ro extends HTMLElement{connectedCallback(){setTimeout((()=>{const t=document.getElementById("bagr");if(t){t.addEventListener("gov-page",(()=>{}))}}),500);this.innerHTML=`\n\t\t<h2>Pagination</h2>\n\n\t\t<gov-pagination total="212" wcag-label="Stránkování pro sekci dokumenty" wcag-select-label="Vybrat stránku"></gov-pagination>\n\t\t<br>\n\t\t<gov-pagination size="s" total="212" wcag-label="Stránkování pro sekci dokumenty" wcag-select-label="Vybrat stránku"></gov-pagination>\n\t\t<br>\n\t\t<gov-pagination  id="bagr"  type="select" total="212"  wcag-label="Stránkování pro sekci dokumenty" wcag-select-label="Vybrat stránku"></gov-pagination>\n\t\t<br>\n\t\t<gov-pagination type="select" size="s" total="212"  wcag-label="Stránkování pro sekci dokumenty" wcag-select-label="Vybrat stránku"></gov-pagination>\n\t\t<br>\n\t\t<br>\n\t\t<gov-pagination variant="secondary" total="212" current="2" wcag-label="Stránkování pro sekci dokumenty" wcag-select-label="Vybrat stránku"></gov-pagination>\n\t\t<br>\n\t\t<gov-pagination size="s" variant="secondary" wcag-label="Stránkování pro sekci dokumenty" wcag-select-label="Vybrat stránku"></gov-pagination>\n\t\t<br>\n\t\t<gov-pagination type="select" variant="secondary" total="212"  wcag-label="Stránkování pro sekci dokumenty" wcag-select-label="Vybrat stránku"></gov-pagination>\n\t\t<br>\n\t\t<gov-pagination type="select" variant="secondary" size="s" total="212"  wcag-label="Stránkování pro sekci dokumenty" wcag-select-label="Vybrat stránku"></gov-pagination>\n\n\t\t`}}if(customElements.get("pagination-page")===undefined){customElements.define("pagination-page",ro)}class lo extends HTMLElement{connectedCallback(){setTimeout((function(){document.getElementById("btn").addEventListener("gov-click",(function(){document.getElementById("modal").setAttribute("open","true")}))}),500);this.innerHTML=`\n            <h2>Prompt</h2>\n\t\t\t<gov-button variant="error" id="btn">Smazat dokument</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-prompt label="Smazání dokumentu" id="modal" wcag-close-label="Zavřít prompt">\n\t\t\t\t<gov-icon class="gov-color--error-400" slot="icon" name="info"></gov-icon>\n\t\t\t\t<p class="gov-text--l gov-color--secondary-800">Opravdu chcete tento dokument smazat?</p>\n\t\t\t\t<p>Pokud tak učiníte, tak již nebude cesty zpět a souboru bude nenávratně odstraněn ze serveru. Ujistěte se, že máte dostatečnou zálohu.</p>\n                <gov-button slot="actions" size="l" variant="primary" type="base">Zrušit</gov-button>\n                <gov-button slot="actions" size="l" variant="error">Smazat dokument</gov-button>\n\t\t\t</gov-prompt>\n\t\t`}}if(customElements.get("prompt-page")===undefined){customElements.define("prompt-page",lo)}class vo extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>Side nav</h2>\n\n\t\t<div style="max-width: 300px;">\n\t\t\t<gov-side-nav>\n\t\t\t\t<gov-side-nav-item label="Hlavní skupina" count="true" href="#">\n\t\t\t\t\t<gov-side-nav-item label="Vše o našem projektu">\n\t\t\t\t\t\t<gov-side-nav-item label="Hodnocení">\n\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t\t<gov-side-nav-item label="Rozpočtová politika" count="true">\n\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t\t<gov-side-nav-item label="Partneři">\n\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t<gov-side-nav-item label="O nás" href="#">\n\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t<gov-side-nav-item label="O společnosti" href="#">\n\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t<gov-side-nav-item label="Kontakt">\n\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t<gov-side-nav-item label="Produkty" href="#">\n\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t<gov-side-nav-item label="Ocenění">\n\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t<gov-side-nav-item label="Naši klienti" href="#">\n\t\t\t\t</gov-side-nav-item>\n\t\t\t</gov-side-nav>\n\t\t\t<h3>Compact</h3>\n\t\t\t<gov-side-nav compact="true">\n\t\t\t\t<gov-side-nav-item label="Hlavní skupina" count="true" href="#">\n\t\t\t\t\t<gov-side-nav-item label="Vše o našem projektu">\n\t\t\t\t\t\t<gov-side-nav-item label="Hodnocení">\n\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t\t<gov-side-nav-item label="Rozpočtová politika" count="true">\n\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t\t<gov-side-nav-item label="Partneři">\n\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t<gov-side-nav-item label="O nás" href="#">\n\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t<gov-side-nav-item label="O společnosti" href="#">\n\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t<gov-side-nav-item label="Kontakt">\n\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t<gov-side-nav-item label="Produkty" href="#">\n\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t<gov-side-nav-item label="Ocenění">\n\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t<gov-side-nav-item label="Naši klienti" href="#">\n\t\t\t\t</gov-side-nav-item>\n\t\t\t</gov-side-nav>\n\n\t\t\t<h3>Inverse</h3>\n\t\t\t<div class="gov-bg--secondary-300" style="padding: 20px;">\n\t\t\t\t<gov-side-nav inverse="true">\n\t\t\t\t\t<gov-side-nav-item label="Hlavní skupina" count="true" href="#">\n\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t\t<gov-side-nav-item label="Vše o našem projektu">\n\t\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t\t\t<gov-side-nav-item label="Hodnocení">\n\t\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t\t\t<gov-side-nav-item label="Rozpočtová politika" count="true">\n\t\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t\t\t<gov-side-nav-item label="Partneři">\n\t\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t\t<gov-side-nav-item label="O nás" href="#">\n\t\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t\t<gov-side-nav-item label="O společnosti" href="#">\n\t\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t\t<gov-side-nav-item label="Kontakt">\n\t\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t<gov-side-nav-item label="Produkty" href="#">\n\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t<gov-side-nav-item label="Ocenění">\n\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-side-nav-item>\n\n\t\t\t\t\t<gov-side-nav-item label="Naši klienti" href="#">\n\t\t\t\t\t\t<gov-icon slot="icon" name="info"></gov-icon>\n\t\t\t\t\t</gov-side-nav-item>\n\t\t\t\t</gov-side-nav>\n\t\t\t</div>\n\t\t</div>\n\t\t`}}if(customElements.get("side-nav-page")===undefined){customElements.define("side-nav-page",vo)}class co extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<style>\n\t\t\t gov-spacer {\n\t\t\t\tbackground: lightgray;\n\t\t\t\tmargin-bottom: 10px;\n\t\t\t }\n\t\t\t</style>\n\t\t\t<gov-spacer size="2xs" breakpoint="sm"></gov-spacer>\n\t\t\t<gov-spacer size="xs" breakpoint="sm"></gov-spacer>\n\t\t\t<gov-spacer size="s" breakpoint="sm"></gov-spacer>\n\t\t\t<gov-spacer size="m" breakpoint="sm"></gov-spacer>\n\t\t\t<gov-spacer size="l" breakpoint="sm"></gov-spacer>\n\t\t\t<gov-spacer size="xl" breakpoint="sm"></gov-spacer>\n\t\t\t<gov-spacer size="2xl" breakpoint="sm"></gov-spacer>\n\t\t\t<gov-spacer size="3xl" breakpoint="sm"></gov-spacer>\n\t\t\t<gov-spacer size="4xl" breakpoint="sm"></gov-spacer>\n\t\t`}}if(customElements.get("spacer-page")===undefined){customElements.define("spacer-page",co)}class uo extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<gov-statsbar>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<slot>215 mil</slot>\n\t\t\t\t\t<p slot="text">datových zpráv</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<slot>1 mil</slot>\n\t\t\t\t\t<p slot="text">datových schránek</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<slot>967 tis</slot>\n\t\t\t\t\t<p slot="text">hodin ušetřených ve frontách</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<slot>12 mil</slot>\n\t\t\t\t\t<p slot="text">ušetřených korun</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t</gov-statsbar>\n\t\t\t<hr />\n\t\t\t<gov-statsbar>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="id-card" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>215 mil</slot>\n\t\t\t\t\t<p slot="text">Font Awesome</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="job-loss" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>1 mil</slot>\n\t\t\t\t\t<p slot="text">datových schránek</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="globe" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>967 tis</slot>\n\t\t\t\t\t<p slot="text">hodin ušetřených ve frontách</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="new-comments" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>12 mil</slot>\n\t\t\t\t\t<p slot="text">ušetřených korun</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t</gov-statsbar>\n\t\t\t<hr />\n\t\t\t<gov-statsbar icon-position="left">\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="id-card" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>215 mil</slot>\n\t\t\t\t\t<p slot="text">datových zpráv</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="job-loss" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>1 mil</slot>\n\t\t\t\t\t<p slot="text">datových schránek</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="globe" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>967 tis</slot>\n\t\t\t\t\t<p slot="text">hodin ušetřených ve frontách</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="new-comments" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>12 mil</slot>\n\t\t\t\t\t<p slot="text">ušetřených korun</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t</gov-statsbar>\n\t\t\t<hr />\n\t\t\t<gov-statsbar inverse variant="secondary">\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<slot>215 mil</slot>\n\t\t\t\t\t<p slot="text">datových zpráv</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<slot>1 mil</slot>\n\t\t\t\t\t<p slot="text">datových schránek</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<slot>967 tis</slot>\n\t\t\t\t\t<p slot="text">hodin ušetřených ve frontách</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<slot>12 mil</slot>\n\t\t\t\t\t<p slot="text">ušetřených korun</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t</gov-statsbar>\n\t\t\t<hr />\n\t\t\t<gov-statsbar inverse>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="id-card" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>215 mil</slot>\n\t\t\t\t\t<p slot="text">datových zpráv</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="job-loss" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>1 mil</slot>\n\t\t\t\t\t<p slot="text">datových schránek</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="globe" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>967 tis</slot>\n\t\t\t\t\t<p slot="text">hodin ušetřených ve frontách</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="new-comments" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>12 mil</slot>\n\t\t\t\t\t<p slot="text">ušetřených korun</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t</gov-statsbar>\n\t\t\t<hr />\n\t\t\t<gov-statsbar inverse variant="secondary" icon-position="left">\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="id-card" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>215 mil</slot>\n\t\t\t\t\t<p slot="text">datových zpráv</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="job-loss" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>1 mil</slot>\n\t\t\t\t\t<p slot="text">datových schránek</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="globe" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>967 tis</slot>\n\t\t\t\t\t<p slot="text">hodin ušetřených ve frontách</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="new-comments" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>12 mil</slot>\n\t\t\t\t\t<p slot="text">ušetřených korun</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t</gov-statsbar>\n\t\t\t<hr />\n\t\t\t<gov-statsbar variant="secondary">\n\t\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t\t<slot>215 mil</slot>\n\t\t\t\t\t\t<p slot="text">datových zpráv</p>\n\t\t\t\t\t</gov-statsbar-item>\n\t\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t\t<slot>1 mil</slot>\n\t\t\t\t\t\t<p slot="text">datových schránek</p>\n\t\t\t\t\t</gov-statsbar-item>\n\t\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t\t<slot>967 tis</slot>\n\t\t\t\t\t\t<p slot="text">hodin ušetřených ve frontách</p>\n\t\t\t\t\t</gov-statsbar-item>\n\t\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t\t<slot>12 mil</slot>\n\t\t\t\t\t\t<p slot="text">ušetřených korun</p>\n\t\t\t\t\t</gov-statsbar-item>\n\t\t\t</gov-statsbar>\n\t\t\t<gov-statsbar variant="secondary">\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="id-card" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>215 mil</slot>\n\t\t\t\t\t<p slot="text">datových zpráv</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="job-loss" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>1 mil</slot>\n\t\t\t\t\t<p slot="text">datových schránek</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="globe" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>967 tis</slot>\n\t\t\t\t\t<p slot="text">hodin ušetřených ve frontách</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="new-comments" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>12 mil</slot>\n\t\t\t\t\t<p slot="text">ušetřených korun</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t</gov-statsbar>\n\t\t\t<gov-statsbar variant="secondary" icon-position="left">\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="id-card" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>215 mil</slot>\n\t\t\t\t\t<p slot="text">datových zpráv</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="job-loss" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>1 mil</slot>\n\t\t\t\t\t<p slot="text">datových schránek</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="globe" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>967 tis</slot>\n\t\t\t\t\t<p slot="text">hodin ušetřených ve frontách</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t\t<gov-statsbar-item>\n\t\t\t\t\t<gov-icon type="complex" name="new-comments" slot="icon"></gov-icon>\n\t\t\t\t\t<slot>12 mil</slot>\n\t\t\t\t\t<p slot="text">ušetřených korun</p>\n\t\t\t\t</gov-statsbar-item>\n\t\t\t</gov-statsbar>\n\t\t`}}if(customElements.get("statsbar-page")===undefined){customElements.define("statsbar-page",uo)}class po extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<h2>Stepper</h2>\n\n\t\t\t<h3>Velikost M</h3>\n\t\t\t<gov-spacer size="l"></gov-spacer>\n\n\t\t\t<gov-stepper>\n\t\t\t\t<gov-stepper-item trigger-tag="h1" label="Hotový krok" variant="success" annotation="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus Lorem ipsum dolor sit amet, consectetur adipiscing elit.">\n\t\t\t\t\t<gov-icon slot="prefix" name="check-lg"></gov-icon>\n\t\t\t\t\t<div slot="content">\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus. Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</div>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Chybový krok" variant="error">\n\t\t\t\t\t<gov-icon slot="prefix" name="x-lg"></gov-icon>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item collapsible="true" label="Krok s textem, obrázkem, tlačítkem" variant="primary" annotation="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus">\n\t\t\t\t\t<span slot="prefix">2</span>\n\t\t\t\t\t<div slot="content">\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus. Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus. Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</div>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Budoucí krok" variant="secondary">\n\t\t\t\t\t<span slot="prefix">3</span>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Budoucí krok" variant="warning">\n\t\t\t\t\t<span slot="prefix">4</span>\n\t\t\t\t</gov-stepper-item>\n\t\t\t</gov-stepper>\n\n\t\t\t<br><br>\n\t\t\t<h3>Velikost S</h3>\n\t\t\t<gov-spacer size="l"></gov-spacer>\n\n\t\t\t<gov-stepper size="s">\n\t\t\t\t<gov-stepper-item trigger-tag="h1" label="Hotový krok" variant="success" annotation="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus">\n\t\t\t\t\t<gov-icon slot="prefix" name="check-lg"></gov-icon>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Chybový krok" variant="error">\n\t\t\t\t\t<gov-icon slot="prefix" name="x-lg"></gov-icon>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Krok s textem, obrázkem, tlačítkem" variant="primary">\n\t\t\t\t\t<span slot="prefix">2</span>\n\t\t\t\t\t<div slot="content">\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</div>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Budoucí krok" variant="secondary">\n\t\t\t\t\t<span slot="prefix">3</span>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Budoucí krok" variant="warning">\n\t\t\t\t\t<span slot="prefix">4</span>\n\t\t\t\t</gov-stepper-item>\n\t\t\t</gov-stepper>\n\n\t\t\t<br><br>\n\t\t\t<h3>Velikost XS</h3>\n\t\t\t<gov-spacer size="l"></gov-spacer>\n\n\t\t\t<gov-stepper size="xs">\n\t\t\t\t<gov-stepper-item trigger-tag="h1" label="Hotový krok" variant="success" annotation="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus">\n\t\t\t\t\t<gov-icon slot="prefix" name="check-lg"></gov-icon>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Chybový krok" variant="error">\n\t\t\t\t\t<gov-icon slot="prefix" name="x-lg"></gov-icon>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Krok s textem, obrázkem, tlačítkem" variant="primary">\n\t\t\t\t\t<span slot="prefix">2</span>\n\t\t\t\t\t<div slot="content">\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</div>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Budoucí krok" variant="secondary">\n\t\t\t\t\t<span slot="prefix">3</span>\n\t\t\t\t</gov-stepper-item>\n\t\t\t\t<gov-stepper-item label="Budoucí krok" variant="warning">\n\t\t\t\t\t<span slot="prefix">4</span>\n\t\t\t\t</gov-stepper-item>\n\t\t\t</gov-stepper>\n\t\t`}}if(customElements.get("stepper-page")===undefined){customElements.define("stepper-page",po)}class go extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<h2>Tabs</h2>\n\t\t\t<gov-tabs id="po" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" variant="secondary" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" variant="success" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" variant="warning" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" variant="error" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\n\t\t\t<gov-tabs id="po" type="chip" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\n\t\t\t<gov-tabs id="po" variant="secondary" type="chip" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" variant="success" type="chip" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" variant="warning" type="chip" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" variant="error" type="chip" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\n\t\t\t<h2>Vertical tabs</h2>\n\t\t\t<gov-tabs id="po" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti" orientation="vertical">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi super tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi super tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti" orientation="vertical">\n\t\t\t\t<gov-tabs-item label="Muj super tab">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="Dalsi super tab s dlouhým popisem" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="Další super tab s naprosto nesmyslně dlouhým popisem, který se doufám nevyužije">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" type="chip" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti" orientation="vertical">\n\t\t\t\t<gov-tabs-item label="TAB #1">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #2" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="TAB #3">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t\t<gov-tabs id="po" type="chip" wcag-label="Důležitý tabs" wcag-select-label="Výběr možnosti" orientation="vertical">\n\t\t\t\t<gov-tabs-item label="Muj super tab">\n\t\t\t\t\t<p>Muj super tab - Lorem ipsum (zkráceně lipsum) je označení pro standardní pseudolatinský text užívaný v grafickém\n\t\t\t\t\t\tdesignu a navrhování jako demonstrativní výplňový text při vytváření pracovních ukázek grafických\n\t\t\t\t\t\tnávrhů (např. internetových stránek, rozvržení časopisů či všech druhů reklamních materiálů). Lipsum\n\t\t\t\t\t\ttak pracovně znázorňuje text v ukázkových maketách (tzv. mock-up) předtím, než bude do hotového\n\t\t\t\t\t\tnávrhu vložen smysluplný obsah.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="Dalsi super tab s dlouhým popisem" default>\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“), oko by při posuzování vzhledu bylo vyrušováno pravidelnou\n\t\t\t\t\t\tstrukturou textu, která se od běžného textu liší. Text lorem ipsum na první pohled připomíná běžný\n\t\t\t\t\t\ttext, slova jsou různě dlouhá, frekvence písmen je podobná běžné řeči, interpunkce vypadá přirozeně\n\t\t\t\t\t\tatd.</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t\t<gov-tabs-item label="Další super tab s naprosto nesmyslně dlouhým popisem, který se doufám nevyužije">\n\t\t\t\t\t<p>Dalsi suepr tab - Pokud by se pro stejný účel použil smysluplný text, bylo by těžké hodnotit pouze vzhled, aniž by se\n\t\t\t\t\t\tpozorovatel nechal svést ke čtení obsahu. Pokud by byl naopak použit nesmyslný, ale pravidelný text\n\t\t\t\t\t\t(např. opakování „asdf asdf asdf…“).</p>\n\t\t\t\t</gov-tabs-item>\n\t\t\t</gov-tabs>\n\t\t`}}if(customElements.get("tabs-page")===undefined){customElements.define("tabs-page",go)}class mo extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<h1>Tags</h1>\n\t\t\t<h4>Tags - primary (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="primary" size="xs" type="solid">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="primary" size="xs" type="solid">\n\t\t\t\t\t<gov-icon slot="left-icon" name="star-fill"></gov-icon>\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="primary" size="xs" type="solid">\n\t\t\t\t\tTag\n\t\t\t\t\t<gov-icon slot="right-icon" name="star-fill"></gov-icon>\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="primary" size="xs" type="solid">\n\t\t\t\t\t<gov-icon slot="left-icon" name="star-fill"></gov-icon>\n\t\t\t\t\tTag\n\t\t\t\t\t<gov-icon slot="right-icon" name="star-fill"></gov-icon>\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="primary" 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\tSmall Primary\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="primary" size="m" type="solid">\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\t<gov-icon slot="right-icon" name="star-fill"></gov-icon>\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="primary" size="l" type="solid">\n\t\t\t\t\t<gov-icon slot="left-icon" name="star-fill"></gov-icon>\n\t\t\t\t\tLarge Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="star-fill"></gov-icon>\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="primary" size="xl" type="solid">\n\t\t\t\t\t<gov-icon slot="left-icon" name="star-fill"></gov-icon>\n\t\t\t\t\tX-Large Primary\n\t\t\t\t\t<gov-icon slot="right-icon" name="star-fill"></gov-icon>\n\t\t\t\t</gov-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - primary (inversed)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="primary" size="xs" inverse="true">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="primary" size="s" inverse="true">\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-tag>\n\t\t\t\t<gov-tag variant="primary" size="m" inverse="true">\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-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - primary (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="primary" type="outlined" size="xs">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="primary" 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-tag>\n\t\t\t\t<gov-tag variant="primary" type="outlined" size="m">\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-tag>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Tags - secondary (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="secondary" size="xs">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="secondary" 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-tag>\n\t\t\t\t<gov-tag variant="secondary" size="m">\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-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - secondary (inversed)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="secondary" size="xs" inverse="true">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="secondary" size="s" inverse="true">\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-tag>\n\t\t\t\t<gov-tag variant="secondary" size="m" inverse="true">\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-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - secondary (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="secondary" type="outlined" size="xs">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="secondary" 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-tag>\n\t\t\t\t<gov-tag variant="secondary" type="outlined" size="m">\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-tag>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Tags - success (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="success" size="xs">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="success" 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-tag>\n\t\t\t\t<gov-tag variant="success" size="m">\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-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - success (inversed)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="success" size="xs" inverse="true">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="success" size="s" inverse="true">\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-tag>\n\t\t\t\t<gov-tag variant="success" size="m" inverse="true">\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-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - success (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="success" type="outlined" size="xs">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="success" 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-tag>\n\t\t\t\t<gov-tag variant="success" type="outlined" size="m">\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-tag>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Tags - warning (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="warning" size="xs">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="warning" 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-tag>\n\t\t\t\t<gov-tag variant="warning" size="m">\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-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - warning (inversed)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="warning" size="xs" inverse="true">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="warning" size="s" inverse="true">\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-tag>\n\t\t\t\t<gov-tag variant="warning" size="m" inverse="true">\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-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - warning (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="warning" type="outlined" size="xs">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="warning" 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-tag>\n\t\t\t\t<gov-tag variant="warning" type="outlined" size="m">\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-tag>\n\t\t\t</div>\n\t\t\t<hr />\n\n\t\t\t<h4>Tags - error (default)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="error" size="xs">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="error" 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-tag>\n\t\t\t\t<gov-tag variant="error" size="m">\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-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - error (inversed)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="error" size="xs" inverse="true">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="error" size="s" inverse="true">\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-tag>\n\t\t\t\t<gov-tag variant="error" size="m" inverse="true">\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-tag>\n\t\t\t</div>\n\t\t\t<h4>Tags - error (outlined)</h4>\n\t\t\t<div class="container-view">\n\t\t\t\t<gov-tag variant="error" type="outlined" size="xs">\n\t\t\t\t\tTag\n\t\t\t\t</gov-tag>\n\t\t\t\t<gov-tag variant="error" 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-tag>\n\t\t\t\t<gov-tag variant="error" type="outlined" size="m">\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-tag>\n\t\t\t</div>\n\t\t`}}if(customElements.get("tag-page")===undefined){customElements.define("tag-page",mo)}class bo extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>Tiles</h2>\n\n\t\t<div class="gov-bg--secondary-300" style="padding: 48px;">\n\t\t\t<div style="max-width: 600px;">\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<br>\n\t\t\t\t<gov-tile name="Zdroje energie, těžba, nerosty, drahé kovy">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<ul class="gov-list--plain">\n\t\t\t\t\t\t<li><a href="#">Občanský život</a></li>\n\t\t\t\t\t\t<li><a href="#">Podnikání v ČR</a></li>\n\t\t\t\t\t\t<li><a href="#">Czech POINT</a></li>\n\t\t\t\t\t</ul>\n\t\t\t\t</gov-tile>\n\t\t\t</div>\n\t\t\t<br>\n\n\t\t\t<gov-tiles columns="4">\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t</gov-tiles>\n\t\t\t<br>\n\t\t\t<gov-tiles columns="3" no-border>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t\t<gov-tile href="#">\n\t\t\t\t\t<gov-icon name="id-card" type="complex" slot="icon"></gov-icon>\n\t\t\t\t\t<h3 slot="title">Zdroje energie, těžba, nerosty, drahé kovy</h3>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tSecondary - Od 20. 12. 2020 do 14:00 h do 20.&nbsp;12. 2020 do 15:00 h bude provedena plánovaná odstávka serverů. V&nbsp;uvedeném termínu bude nedostupné přihlášení k&nbsp;Portálu občana prostřednictvím datové schránky. Více informací <a href="#">zde</a>.\n\t\t\t\t\t</p>\n\t\t\t\t</gov-tile>\n\t\t\t</gov-tiles>\n\n\t\t</div>\n\t\t`}}if(customElements.get("tiles-page")===undefined){customElements.define("tiles-page",bo)}class fo extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>\n\t\t\tToast Message\n\t\t</h2>\n\t\t<gov-toast variant="success">\n\t\t\t<gov-icon name="check-lg" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tVaše dokumenty byly úspěšně staženy.\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t<br>\n\t\t<gov-toast variant="error" gravity="bottom" position="left">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tNení možné požadavek zpracovat z důvodu chyby serveru.\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t<br>\n\t\t<gov-toast variant="warning" position="left">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tŽádost se nepodařilo odeslat, zkontrolujte nastavení.\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t<br>\n\t\t<gov-toast variant="primary" position="center">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tSoubory jsou připraveny ke stažení.\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t<br>\n\t\t<gov-toast variant="secondary"  gravity="bottom" position="right">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tVaše aplikace byla aktualizovaná na novou verzi!\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t\t`}}if(customElements.get("toast-message-page")===undefined){customElements.define("toast-message-page",fo)}class ho extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t<h2>\n\t\t\tToast Message Countdown\n\t\t</h2>\n\t\t<gov-toast variant="success" type="solid" time="10000">\n\t\t\t<gov-icon name="check-lg" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tVaše dokumenty byly úspěšně staženy.\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t<br>\n\t\t<gov-toast variant="error" type="solid" gravity="bottom" position="left" time="10000">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tNení možné požadavek zpracovat z důvodu chyby serveru.\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t<br>\n\t\t<gov-toast variant="warning" type="solid" position="left" time="10000">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tŽádost se nepodařilo odeslat, zkontrolujte nastavení.\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t<br>\n\t\t<gov-toast variant="primary" type="solid" position="center" time="10000">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tSoubory jsou připraveny ke stažení.\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t<br>\n\t\t<gov-toast variant="secondary" type="solid" gravity="bottom" position="right" time="10000">\n\t\t\t<gov-icon name="info" slot="icon"></gov-icon>\n\t\t\t<p>\n\t\t\t\tVaše aplikace byla aktualizovaná na novou verzi!\n\t\t\t</p>\n\t\t</gov-toast>\n\t\t\t`}}if(customElements.get("toast-message-countdown-page")===undefined){customElements.define("toast-message-countdown-page",ho)}class yo extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<div style="width: 500px; overflow: auto; height: 100px">\n\t\t\t\t<div style="width: 800px; display: flex; flex-direction: row; height: 100px; gap: 20px">\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px"></div>\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px"></div>\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px"></div>\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px"></div>\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px"></div>\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px"></div>\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px"></div>\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px"></div>\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px"></div>\n\t\t\t\t\t<div style="width: 100px; border: 1px solid black; height: 100px">\n\t\t\t\t\t<gov-tooltip position="right" size="s" icon>\n\t\t\t\t\t<gov-icon name="info"></gov-icon>\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t<li>Toggler div, h1, h2 rozbije celou komponentu. </li>\n\t\t\t\t\t\t\t<li>Můžu použít tagy jako span, anchor, gov-icon - inlinové. Zde je použita ikonka z knihovny font-awesome</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip>\n</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<p>\n\t\t\t\tDefault scheme, size Small. Nelze umístit jako toggle element který je blokový - tj. div, h1, h2, atp.\n\t\t\t\t<gov-tooltip position="right" size="s" icon>\n\t\t\t\t\t<gov-icon name="info"></gov-icon>\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t<li>Toggler div, h1, h2 rozbije celou komponentu. </li>\n\t\t\t\t\t\t\t<li>Můžu použít tagy jako span, anchor, gov-icon - inlinové. Zde je použita ikonka z knihovny font-awesome</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip>\n\t\t\t\tza prací do států EU byste měli být vždy pojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy tento stát.\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\tV rámci\n\t\t\t\t<gov-tooltip variant="secondary" position="top" size="s" message="Znění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.">\n\t\t\t\t\tpřípadě vycestování (top)případě vycestování (top)případě vycestování\n\t\t\t\t</gov-tooltip>\n\t\t\t\tstátů EU platí princip jednoho pojištění. V za prací do států EU byste měli být vždy\n\t\t\t\tpojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy\n\t\t\t\ttento stát.\n\t\t\t</p>\n\t\t\t<p>V rámci\n\t\t\t\t<gov-tooltip variant="secondary" position="bottom" size="s">\n\t\t\t\t\tpřípadě vycestování (bottom)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip>\n\t\t\t\tstátů EU platí princip jednoho pojištění. V za prací do států EU byste měli být vždy\n\t\t\t\tpojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy\n\t\t\t\ttento stát.\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\tV rámci států EU platí princip jednoho pojištění. V za prací do států EU byste měli být vždy\n\t\t\t\t<gov-tooltip variant="secondary" position="top" size="m">\n\t\t\t\t\tpřípadě vycestování (top)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip>\n\t\t\t\tpojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy tento stát.\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\tV rámci států EU platí princip jednoho pojištění. V\n\t\t\t\t<gov-tooltip position="right">\n\t\t\t\t\tpřípadě vycestování postion (right)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip>\n\t\t\t\tza prací do států EU byste měli být vždy pojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy tento stát.\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\tV rámci\n\t\t\t\t<gov-tooltip position="top">\n\t\t\t\t\tpřípadě vycestování (top)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip>\n\t\t\t\tstátů EU platí princip jednoho pojištění. V za prací do států EU byste měli být vždy\n\t\t\t\tpojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy\n\t\t\t\ttento stát.\n\t\t\t</p>\n\t\t\t<p>\n\t\t\tV rámci\n\t\t\t\t<gov-tooltip position="bottom">\n\t\t\t\t\tpřípadě vycestování (bottom)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip> států EU platí princip jednoho pojištění. V za prací do států EU byste měli být vždy\n\t\t\t\tpojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy\n\t\t\t\ttento stát.\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\tV rámci států EU platí princip jednoho pojištění. V za prací do států EU byste měli být vždy\n\t\t\t\t<gov-tooltip variant="secondary" position="left">\n\t\t\t\t\tpřípadě vycestování (left)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip> pojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy\n\t\t\t\ttento stát. V rámci států EU platí princip jednoho pojištění. V\n\t\t\t\t<gov-tooltip variant="secondary" position="right" size="l">\n\t\t\t\t\tpřípadě vycestování (right)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip>\n\t\t\t\tza prací do států EU byste měli být vždy\n\t\t\t\tpojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy\n\t\t\t\ttento stát.\n\t\t\t</p>\n\t\t\t<p>V rámci\n\t\t\t\t<gov-tooltip position="top" size="l">\n\t\t\t\t\tpřípadě vycestování (top)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip> států EU platí princip jednoho pojištění. V za prací do států EU byste měli být vždy\n\t\t\t\tpojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy\n\t\t\t\ttento stát.\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\tV rámci\n\t\t\t\t<gov-tooltip variant="secondary" position="bottom" size="l">\n\t\t\t\t\tpřípadě vycestování (bottom)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip> států EU platí princip jednoho pojištění. V za prací do států EU byste měli být vždy\n\t\t\t\tpojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy\n\t\t\t\ttento stát.\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\tV rámci států EU platí princip jednoho pojištění. V za prací do států EU byste měli být vždy\n\t\t\t\t<gov-tooltip inverse variant="secondary" position="left" size="l">\n\t\t\t\t\tpřípadě vycestování (left)\n\t\t\t\t\t<gov-tooltip-content>\n\t\t\t\t\t\tZnění petice podléhá § 1 odst. 3-4 zákonuč. 85/1990 Sb. Text.\n\t\t\t\t\t</gov-tooltip-content>\n\t\t\t\t</gov-tooltip> pojištěni ve státě, ve kterém pracujete. Pokud pracujete pouze na území jednoho státu, je státem pojištění vždy\n\t\t\t\ttento stát.\n\t\t\t\t<br /><br /><br /><br /><br />x\n\t\t\t</p>\n\t`}}if(customElements.get("tooltip-page")===undefined){customElements.define("tooltip-page",yo)}class ko extends HTMLElement{connectedCallback(){this.innerHTML=`\n\t\t\t<p>\n\t\t\t\t<a class="gov-text--xs" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t\t<a class="gov-text--s" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t\t<a class="gov-text--m" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t\t<a class="gov-text--l" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t\t<a class="gov-text--xl" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t\t<a class="gov-text--2xl" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t\t<a class="gov-text--3xl" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t\t<a class="gov-text--4xl" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t\t<a class="gov-text--5xl" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t\t<a class="gov-text--6xl" href="#copy" target="_blank">paragraph with no more than four lines</a><br>\n\t\t\t</p>\n\n\t\t\t<ul>\n\t\t\t\t<li>This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines</li>\n\t\t\t\t<li>This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines</li>\n\t\t\t\t<li>This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines</li>\n\t\t\t\t<li>This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines</li>\n\t\t\t</ul>\n\t\t\t<ol>\n\t\t\t\t<li>This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines</li>\n\t\t\t\t<li>This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines</li>\n\t\t\t\t<li>This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines</li>\n\t\t\t\t<li>This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines</li>\n\t\t\t</ol>\n\n\t\t\t<h6 class="gov-text--6xl">Heading 1 Heading 1 Heading 1</h6>\n\t\t\t<h2>Heading 2 Heading 2 Heading 2</h2>\n\t\t\t<p>\n\t\t\t\tBody 1/400<br />A lead <a href="#copy" target="_blank">paragraph with no more than four lines</a> . Body 1/400 A lead paragraph with no more than four lines. Body 1/400 A lead paragraph with no more than four lines\n\t\t\t</p>\n\t\t\t<h4 class="gov-text--l">Heading 2 Heading 2 Heading 2</h4>\n\t\t\t<h3>Heading 3 Heading 3 Heading 3</h3>\n\t\t\t<p>\n\t\t\t\tBody 2/400<br />This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines\n\t\t\t</p>\n\t\t\t<h2>Heading 2 Heading 2 Heading 2</h2>\n\t\t\t<h3>Heading 3 Heading 3 Heading 3</h3>\n\t\t\t<p>\n\t\t\t\tBody 3/400<br />This is for body copy in components such as accordion, structured list or tile. This is for body copy in components such as accordion, structured list or tile.\n\t\t\t</p>\n\t\t\t<h3>Heading 3 Heading 3 Heading 3</h3>\n\t\t\t<h4>Heading 4 Heading 4 Heading 4</h4>\n\t\t\t<p>\n\t\t\t\tBold - Body 1/700<br />A lead paragraph with no more than four lines. Body 1/400 A lead paragraph with no more than four lines. Body 1/400 A lead paragraph with no more than four lines\n\t\t\t</p>\n\t\t\t<h4>Heading 4 Heading 4 Heading 4</h4>\n\t\t\t<h5>Heading 5 Heading 5 Heading 5</h5>\n\t\t\t<p>\n\t\t\t\tBold - Body 2/700<br />This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines. This is commonly used for long paragraphs with more than four lines\n\t\t\t</p>\n\t\t\t<h5>Heading 5 Heading 5 Heading 5</h5>\n\t\t\t<h6>Heading 6 Heading 6 Heading 6</h6>\n\t\t\t<p>\n\t\t\t\tBold - Body 3/700<br />This is for body copy in components such as accordion, structured list or tile. This is for body copy in components such as accordion, structured list or tile.\n\t\t\t</p>\n\t\t\t<h6>Heading 6 Heading 6 Heading 6</h6>\n\t\t\t<p class="text-x-small">\n\t\t\t\tAssistive<br />This is for explanatory helper text that appears below a field\n\t\t\t</p>\n\t\t\t<ul>\n\t\t\t\t<li>seznam položka seznam položka seznam položka<br />seznam položka seznam položka seznam položka</li>\n\t\t\t\t<li>seznam položka seznam položka seznam položka</li>\n\t\t\t\t<li>seznam položka seznam položka seznam položka</li>\n\t\t\t</ul>\n\t\t`}}if(customElements.get("typography-page")===undefined){customElements.define("typography-page",ko)}class zo extends HTMLElement{connectedCallback(){this.innerHTML=`\n            <h2>Wizard</h2>\n\t\t\t<div class="gov-bg--secondary-300" style="padding: 48px">\n\t\t\t\t<gov-wizard>\n\t\t\t\t\t<gov-wizard-item label-tag="h1" label="Font Awesome Icon" variant="success" collapsible>\n\t\t\t\t\t\t<span slot="prefix"><gov-icon name="check-lg"></gov-icon></span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Kontaktní osoby" variant="primary" is-expanded>\n\t\t\t\t\t\t<span slot="prefix">2</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Působnost v agendách" variant="secondary" collapsible="false">\n\t\t\t\t\t\t<span slot="prefix">3</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Zřizované organizace" variant="error" collapsible annotation="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus.">\n\t\t\t\t\t\t<span slot="prefix">4</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Zřizované organizace" variant="warning" is-expanded>\n\t\t\t\t\t\t<span slot="prefix">5</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t</gov-wizard>\n\n\t\t\t\t<br><br>\n\n\t\t\t\t<gov-wizard size="s">\n\t\t\t\t\t<gov-wizard-item label-tag="h1" label="Font Awesome Icon" variant="success" annotation="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus." collapsible>\n\t\t\t\t\t\t<gov-icon slot="prefix" name="check-lg"></gov-icon>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Kontaktní osoby" variant="primary" is-expanded>\n\t\t\t\t\t\t<span slot="prefix">2</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Působnost v agendách" variant="secondary">\n\t\t\t\t\t\t<span slot="prefix">3</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Zřizované organizace" variant="error">\n\t\t\t\t\t\t<span slot="prefix">4</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Zřizované organizace" variant="warning">\n\t\t\t\t\t\t<span slot="prefix">5</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t</gov-wizard>\n\t\t\t\t<br><br>\n\n\t\t\t\t<gov-wizard size="xs">\n\t\t\t\t\t<gov-wizard-item label-tag="h1" label="Font Awesome Icon" variant="success" annotation="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus." collapsible>\n\t\t\t\t\t\t<gov-icon slot="prefix" name="check-lg"></gov-icon>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Kontaktní osoby" variant="primary" is-expanded>\n\t\t\t\t\t\t<span slot="prefix">2</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Působnost v agendách" variant="secondary">\n\t\t\t\t\t\t<span slot="prefix">3</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Zřizované organizace" variant="error">\n\t\t\t\t\t\t<span slot="prefix">4</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t\t<gov-wizard-item label="Zřizované organizace" variant="warning">\n\t\t\t\t\t\t<span slot="prefix">5</span>\n\t\t\t\t\t\t<p>Opět věc a stylování obsahu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vehicula sollicitudin risus, quis tempor metus imperdiet vitae. Duis in blandit lacus.</p>\n\t\t\t\t\t</gov-wizard-item>\n\t\t\t\t</gov-wizard>\n\t\t\t</div>\n\t\t`}}if(customElements.get("wizard-page")===undefined){customElements.define("wizard-page",zo)}const xo=".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}@keyframes countdown{to{transform:scaleX(0)}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes pulse{0%{opacity:1}50%{opacity:0.4}100%{opacity:1}}html,body{margin:0;padding:0}.container-view{padding:12px}hr{height:0;border:0 none;border-top:1px solid gainsboro;font-size:0}hr.inversed{border-top-color:#254e80}";const wo=class{constructor(o){t(this,o)}componentWillLoad(){const t=document.getElementById("outlet");t.innerHTML="";const o=new Pt(t);o.setRoutes([{path:"/",component:"home-page"},{path:"/infobar",component:"infobar-page"},{path:"/accordion",component:"accordion-page"},{path:"/chip",component:"chip-page"},{path:"/button",component:"button-page"},{path:"/breadcrumbs",component:"breadcrumbs-page"},{path:"/card",component:"card-page"},{path:"/message",component:"message-page"},{path:"/cookiebar",component:"cookiebar-page"},{path:"/container",component:"container-page"},{path:"/control-group",component:"control-group-page"},{path:"/empty",component:"empty-page"},{path:"/error",component:"error-page"},{path:"/forms",component:"forms-page"},{path:"/forms-restructue",component:"forms-restructure-page"},{path:"/form-message",component:"form-message-page"},{path:"/form-label",component:"form-label-page"},{path:"/grid",component:"grid-page"},{path:"/loading",component:"loading-page"},{path:"/modal",component:"modal-page"},{path:"/nav",component:"nav-page"},{path:"/spacer",component:"spacer-page"},{path:"/statsbar",component:"statsbar-page"},{path:"/stepper",component:"stepper-page"},{path:"/tabs",component:"tabs-page"},{path:"/tag",component:"tag-page"},{path:"/tooltip",component:"tooltip-page"},{path:"/tiles",component:"tiles-page"},{path:"/typography",component:"typography-page"},{path:"/toast-message",component:"toast-message-page"},{path:"/toast-message-countdown",component:"toast-message-countdown-page"},{path:"/pagination",component:"pagination-page"},{path:"/prompt",component:"prompt-page"},{path:"/wizard",component:"wizard-page"},{path:"/side-nav",component:"side-nav-page"},{path:"/grid",component:"grid-page"},{path:"/layout",component:"layout-page"}])}render(){return o(n,null)}};wo.style=xo;export{wo as gov_app};
+//# sourceMappingURL=p-bf39d442.entry.js.map