@gov-design-system-ce/components 4.0.8-rc10 → 4.0.8-rc11

package/dist/esm/gov-icon.entry.js

@@ -1,130 +1,131 @@
-import { d as getAssetPath, r as registerInstance, h, a as Host, g as getElement } from './index-eb59f132.js';
-import { i as iconsPath, e as iconsLazyLoad } from './win-1dbd3f5c.js';
-import { g as govHost } from './template-a0067bb6.js';
-import './utils-c057a3fa.js';
+import { d as getAssetPath, r as registerInstance, h, a as Host, g as getElement } from './index-84a63a3e.js';
+import { i as iconsPath, e as iconsLazyLoad } from './win-b64cd8a6.js';
+import { g as govHost } from './template-94812ab3.js';
+import './utils-e10e994d.js';
 
 var Types;
 (function (Types) {
-  Types["BASIC"] = "basic";
-  Types["COMPLEX"] = "complex";
-  Types["COLORED"] = "colored";
+    Types["BASIC"] = "basic";
+    Types["COMPLEX"] = "complex";
+    Types["COLORED"] = "colored";
 })(Types || (Types = {}));
 const IconClass = {
-  root: 'gov-icon',
-  holder: 'gov-icon__holder',
+    root: 'gov-icon',
+    holder: 'gov-icon__holder',
 };
 
-const version = "4.0.8-rc10";
+const version = "4.0.8-rc11";
 
 const dsVersion = () => {
-  return version;
+    return version;
 };
 
 const iconCache = {};
 const requestCache = {};
 const isExternalUrl = (path) => path.startsWith("http://") || path.startsWith("https://");
 const iconUrl = (path, name, type) => {
-  if (isExternalUrl(path)) {
-    return `${path}/${type}/${name}.svg?v=${dsVersion()}`;
-  }
-  return getAssetPath(`${path}/${type}/${name}.svg`) + `?v=${dsVersion()}`;
+    if (isExternalUrl(path)) {
+        return `${path}/${type}/${name}.svg?v=${dsVersion()}`;
+    }
+    return getAssetPath(`${path}/${type}/${name}.svg`) + `?v=${dsVersion()}`;
 };
 async function fetchIcon({ name, type }) {
-  const cacheKey = type + "-" + name;
-  if (iconCache[cacheKey]) {
-    return iconCache[cacheKey];
-  }
-  if (!requestCache[cacheKey]) {
-    requestCache[cacheKey] = fetch(iconUrl(iconsPath(), name, type)).then(resp => {
-      if (resp.status === 200) {
-        return resp.text();
-      }
-      else {
-        throw new Error("Gov Icon doesn't exists");
-      }
-    });
-  }
-  const path = await requestCache[cacheKey];
-  iconCache[cacheKey] = path;
-  return path;
+    const cacheKey = type + "-" + name;
+    if (iconCache[cacheKey]) {
+        return iconCache[cacheKey];
+    }
+    if (!requestCache[cacheKey]) {
+        requestCache[cacheKey] = fetch(iconUrl(iconsPath(), name, type)).then(resp => {
+            if (resp.status === 200) {
+                return resp.text();
+            }
+            else {
+                throw new Error("Gov Icon doesn't exists");
+            }
+        });
+    }
+    const path = await requestCache[cacheKey];
+    iconCache[cacheKey] = path;
+    return path;
 }
 
 const govIconCss = ".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}}.gov-icon{display:inline-flex}.gov-icon__holder{display:inline-flex;width:100%;height:100%}.gov-icon__holder+.gov-icon__holder{display:none !important}.gov-icon svg{display:inline-flex;width:100%;height:100%;max-width:100%;max-height:100%}";
+const GovIconStyle0 = govIconCss;
 
 const GovIcon = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.name = null;
-    this.type = "basic";
-    this.iconData = undefined;
-    this.visible = false;
-    this.error = false;
-    this.h = govHost(this.host);
-  }
-  async loadIconPathData() {
-    const { name, visible, type } = this;
-    if (!name || !visible) {
-      return;
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.name = null;
+        this.type = "basic";
+        this.iconData = undefined;
+        this.visible = false;
+        this.error = false;
+        this.h = govHost(this.host);
     }
-    try {
-      this.iconData = await fetchIcon({ name, type });
+    async loadIconPathData() {
+        const { name, visible, type } = this;
+        if (!name || !visible) {
+            return;
+        }
+        try {
+            this.iconData = await fetchIcon({ name, type });
+        }
+        catch (e) {
+            this.error = true;
+        }
     }
-    catch (e) {
-      this.error = true;
+    connectedCallback() {
+        if (iconsLazyLoad()) {
+            this.visible = true;
+            this.loadIconPathData().finally();
+        }
+        else {
+            this.waitUntilVisible(async () => {
+                this.visible = true;
+                await this.loadIconPathData();
+            });
+        }
     }
-  }
-  connectedCallback() {
-    if (iconsLazyLoad()) {
-      this.visible = true;
-      this.loadIconPathData().finally();
+    disconnectedCallback() {
+        if (this.intersectionObserver) {
+            this.intersectionObserver.disconnect();
+            this.intersectionObserver = null;
+        }
     }
-    else {
-      this.waitUntilVisible(async () => {
-        this.visible = true;
+    async componentWillLoad() {
         await this.loadIconPathData();
-      });
-    }
-  }
-  disconnectedCallback() {
-    if (this.intersectionObserver) {
-      this.intersectionObserver.disconnect();
-      this.intersectionObserver = null;
     }
-  }
-  async componentWillLoad() {
-    await this.loadIconPathData();
-  }
-  waitUntilVisible(callback) {
-    if (typeof window === "undefined" || !window.IntersectionObserver) {
-      callback();
-      return;
+    waitUntilVisible(callback) {
+        if (typeof window === "undefined" || !window.IntersectionObserver) {
+            callback();
+            return;
+        }
+        this.intersectionObserver = new IntersectionObserver(entries => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    if (this.intersectionObserver) {
+                        this.intersectionObserver.disconnect();
+                        this.intersectionObserver = null;
+                    }
+                    callback();
+                }
+            });
+        }, { rootMargin: "50px" });
+        this.intersectionObserver.observe(this.host);
     }
-    this.intersectionObserver = new IntersectionObserver(entries => {
-      entries.forEach(entry => {
-        if (entry.isIntersecting) {
-          if (this.intersectionObserver) {
-            this.intersectionObserver.disconnect();
-            this.intersectionObserver = null;
-          }
-          callback();
+    render() {
+        if (this.error) {
+            return null;
         }
-      });
-    }, { rootMargin: "50px" });
-    this.intersectionObserver.observe(this.host);
-  }
-  render() {
-    if (this.error) {
-      return null;
+        return (h(Host, { class: this.h.classes(IconClass.root) }, h("span", { class: IconClass.holder, innerHTML: this.iconData })));
     }
-    return (h(Host, { class: this.h.classes(IconClass.root) }, h("span", { class: IconClass.holder, innerHTML: this.iconData })));
-  }
-  static get assetsDirs() { return ["assets"]; }
-  get host() { return getElement(this); }
-  static get watchers() { return {
-    "name": ["loadIconPathData"]
-  }; }
+    static get assetsDirs() { return ["assets"]; }
+    get host() { return getElement(this); }
+    static get watchers() { return {
+        "name": ["loadIconPathData"]
+    }; }
 };
-GovIcon.style = govIconCss;
+GovIcon.style = GovIconStyle0;
 
 export { GovIcon as gov_icon };
 

package/dist/esm/gov-icon.entry.js.map

@@ -1 +1 @@
-{"file":"gov-icon.entry.js","mappings":"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","names":[],"sources":["../../../packages/core/src/components/gov-icon/constants.ts","../../../packages/core/src/utils/ds.utils.ts","../../../packages/core/src/utils/icon.utils.ts","../../../packages/core/src/components/gov-icon/gov-icon.scss?tag=gov-icon","../../../packages/core/src/components/gov-icon/gov-icon.tsx"],"sourcesContent":["import { ValueOf } from '../../types/interfaces'\n\nenum Types {\n\tBASIC = 'basic',\n\tCOMPLEX = 'complex',\n\tCOLORED = 'colored',\n}\nexport type Type = `${ValueOf<typeof Types>}`\n\nexport const IconClass = {\n\troot: 'gov-icon',\n\tholder: 'gov-icon__holder',\n}\n","import { version } from '../../package.json'\n\nexport const dsVersion = (): string => {\n\treturn version\n}\n","import { getAssetPath } from \"@stencil/core\"\nimport { dsVersion } from \"./ds.utils\"\nimport { iconsPath } from \"../helpers/Dom/win\"\n\nconst iconCache: { [key: string]: string } = {}\nconst requestCache: { [key: string]: Promise<string> } = {}\n\nconst isExternalUrl = (path: string) => path.startsWith(\"http://\") || path.startsWith(\"https://\")\nconst iconUrl = (path: string, name: string, type: string) => {\n\tif (isExternalUrl(path)) {\n\t\treturn `${path}/${type}/${name}.svg?v=${dsVersion()}`\n\t}\n\treturn getAssetPath(`${path}/${type}/${name}.svg`) + `?v=${dsVersion()}`\n}\n\nexport async function fetchIcon({ name, type }: { name: string; type: string }): Promise<string> {\n\tconst cacheKey = type + \"-\" + name\n\tif (iconCache[cacheKey]) {\n\t\treturn iconCache[cacheKey]\n\t}\n\tif (!requestCache[cacheKey]) {\n\t\trequestCache[cacheKey] = fetch(iconUrl(iconsPath(), name, type)).then(resp => {\n\t\t\tif (resp.status === 200) {\n\t\t\t\treturn resp.text()\n\t\t\t} else {\n\t\t\t\tthrow new Error(\"Gov Icon doesn't exists\")\n\t\t\t}\n\t\t})\n\t}\n\tconst path = await requestCache[cacheKey]\n\ticonCache[cacheKey] = path\n\treturn path\n}\n","/*\n *   Icon\n */\n\n$class: \".gov-icon\";\n\n#{$class} {\n\tdisplay: inline-flex;\n\t&__holder {\n\t\tdisplay: inline-flex;\n\t\twidth: 100%;\n\t\theight: 100%;\n\n\t\t& + #{$class}__holder {\n\t\t\tdisplay: none !important;\n\t\t}\n\t}\n\tsvg {\n\t\tdisplay: inline-flex;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tmax-width: 100%;\n\t\tmax-height: 100%;\n\t}\n}\n","import {Build, Component, Element, h, Host, Prop, State, Watch} from \"@stencil/core\"\nimport {IconClass} from \"./constants\"\nimport {fetchIcon} from \"../../utils/icon.utils\"\nimport {govHost} from \"../../helpers/Dom/template\"\nimport {GovHost} from \"../../helpers/Dom/template.types\"\nimport {iconsLazyLoad} from \"../../helpers/Dom/win\"\n\n@Component({\n  assetsDirs: [\"assets\"],\n  styleUrl: \"gov-icon.scss\",\n  tag: \"gov-icon\",\n})\nexport class GovIcon {\n  private h: GovHost\n\n  constructor() {\n    this.h = govHost(this.host)\n  }\n\n  @Element() host: HTMLGovIconElement\n  /**\n   * Name of icon\n   */\n  @Prop() name: string = null\n  /**\n   * Type (folder) of icon\n   */\n  @Prop() type: string = \"basic\"\n  @State() private iconData: string\n  @State() private visible = false\n  @State() private error = false\n  private intersectionObserver: IntersectionObserver\n\n  @Watch(\"name\")\n  private async loadIconPathData(): Promise<void> {\n    const {name, visible, type} = this\n    if (!Build.isBrowser || !name || !visible) {\n      return\n    }\n    try {\n      this.iconData = await fetchIcon({name, type})\n    } catch (e) {\n      this.error = true\n    }\n  }\n\n  connectedCallback(): void {\n    if (iconsLazyLoad()) {\n      this.visible = true\n      this.loadIconPathData().finally()\n    } else {\n      this.waitUntilVisible(async () => {\n        this.visible = true\n        await this.loadIconPathData()\n      })\n    }\n  }\n\n  disconnectedCallback(): void {\n    if (this.intersectionObserver) {\n      this.intersectionObserver.disconnect()\n      this.intersectionObserver = null\n    }\n  }\n\n  async componentWillLoad(): Promise<void> {\n    await this.loadIconPathData()\n  }\n\n  private waitUntilVisible(callback: () => void): void {\n    if (!Build.isBrowser || typeof window === \"undefined\" || !(window as any).IntersectionObserver) {\n      callback()\n      return\n    }\n    this.intersectionObserver = new IntersectionObserver(\n      entries => {\n        entries.forEach(entry => {\n          if (entry.isIntersecting) {\n            if (this.intersectionObserver) {\n              this.intersectionObserver.disconnect()\n              this.intersectionObserver = null\n            }\n            callback()\n          }\n        })\n      },\n      {rootMargin: \"50px\"},\n    )\n    this.intersectionObserver.observe(this.host)\n  }\n\n  render() {\n    if (this.error) {\n      return null\n    }\n    return (\n      <Host class={this.h.classes(IconClass.root)}>\n        <span class={IconClass.holder} innerHTML={this.iconData}></span>\n      </Host>\n    )\n  }\n}\n"],"version":3}
+{"file":"gov-icon.entry.js","mappings":";;;;;AAEA,IAAK,KAIJ;AAJD,WAAK,KAAK;IACT,wBAAe,CAAA;IACf,4BAAmB,CAAA;IACnB,4BAAmB,CAAA;AACpB,CAAC,EAJI,KAAK,KAAL,KAAK,QAIT;AAGM,MAAM,SAAS,GAAG;IACxB,IAAI,EAAE,UAAU;IAChB,MAAM,EAAE,kBAAkB;CAC1B;;;;ACVM,MAAM,SAAS,GAAG;IACxB,OAAO,OAAO,CAAA;AACf,CAAC;;ACAD,MAAM,SAAS,GAA8B,EAAE,CAAA;AAC/C,MAAM,YAAY,GAAuC,EAAE,CAAA;AAE3D,MAAM,aAAa,GAAG,CAAC,IAAY,KAAK,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,CAAA;AACjG,MAAM,OAAO,GAAG,CAAC,IAAY,EAAE,IAAY,EAAE,IAAY;IACxD,IAAI,aAAa,CAAC,IAAI,CAAC,EAAE;QACxB,OAAO,GAAG,IAAI,IAAI,IAAI,IAAI,IAAI,UAAU,SAAS,EAAE,EAAE,CAAA;KACrD;IACD,OAAO,YAAY,CAAC,GAAG,IAAI,IAAI,IAAI,IAAI,IAAI,MAAM,CAAC,GAAG,MAAM,SAAS,EAAE,EAAE,CAAA;AACzE,CAAC,CAAA;AAEM,eAAe,SAAS,CAAC,EAAE,IAAI,EAAE,IAAI,EAAkC;IAC7E,MAAM,QAAQ,GAAG,IAAI,GAAG,GAAG,GAAG,IAAI,CAAA;IAClC,IAAI,SAAS,CAAC,QAAQ,CAAC,EAAE;QACxB,OAAO,SAAS,CAAC,QAAQ,CAAC,CAAA;KAC1B;IACD,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE;QAC5B,YAAY,CAAC,QAAQ,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI;YACzE,IAAI,IAAI,CAAC,MAAM,KAAK,GAAG,EAAE;gBACxB,OAAO,IAAI,CAAC,IAAI,EAAE,CAAA;aAClB;iBAAM;gBACN,MAAM,IAAI,KAAK,CAAC,yBAAyB,CAAC,CAAA;aAC1C;SACD,CAAC,CAAA;KACF;IACD,MAAM,IAAI,GAAG,MAAM,YAAY,CAAC,QAAQ,CAAC,CAAA;IACzC,SAAS,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAA;IAC1B,OAAO,IAAI,CAAA;AACZ;;AChCA,MAAM,UAAU,GAAG,ukBAAukB,CAAC;AAC3lB,sBAAe,UAAU;;MCWZ,OAAO;IAGlB;;oBAQuB,IAAI;oBAIJ,OAAO;;uBAEH,KAAK;qBACP,KAAK;QAd5B,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC5B;IAiBO,MAAM,gBAAgB;QAC5B,MAAM,EAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAC,GAAG,IAAI,CAAA;QAClC,IAAwB,CAAC,IAAI,IAAI,CAAC,OAAO,EAAE;YACzC,OAAM;SACP;QACD,IAAI;YACF,IAAI,CAAC,QAAQ,GAAG,MAAM,SAAS,CAAC,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC,CAAA;SAC9C;QAAC,OAAO,CAAC,EAAE;YACV,IAAI,CAAC,KAAK,GAAG,IAAI,CAAA;SAClB;KACF;IAED,iBAAiB;QACf,IAAI,aAAa,EAAE,EAAE;YACnB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;YACnB,IAAI,CAAC,gBAAgB,EAAE,CAAC,OAAO,EAAE,CAAA;SAClC;aAAM;YACL,IAAI,CAAC,gBAAgB,CAAC;gBACpB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;gBACnB,MAAM,IAAI,CAAC,gBAAgB,EAAE,CAAA;aAC9B,CAAC,CAAA;SACH;KACF;IAED,oBAAoB;QAClB,IAAI,IAAI,CAAC,oBAAoB,EAAE;YAC7B,IAAI,CAAC,oBAAoB,CAAC,UAAU,EAAE,CAAA;YACtC,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAA;SACjC;KACF;IAED,MAAM,iBAAiB;QACrB,MAAM,IAAI,CAAC,gBAAgB,EAAE,CAAA;KAC9B;IAEO,gBAAgB,CAAC,QAAoB;QAC3C,IAAwB,OAAO,MAAM,KAAK,WAAW,IAAI,CAAE,MAAc,CAAC,oBAAoB,EAAE;YAC9F,QAAQ,EAAE,CAAA;YACV,OAAM;SACP;QACD,IAAI,CAAC,oBAAoB,GAAG,IAAI,oBAAoB,CAClD,OAAO;YACL,OAAO,CAAC,OAAO,CAAC,KAAK;gBACnB,IAAI,KAAK,CAAC,cAAc,EAAE;oBACxB,IAAI,IAAI,CAAC,oBAAoB,EAAE;wBAC7B,IAAI,CAAC,oBAAoB,CAAC,UAAU,EAAE,CAAA;wBACtC,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAA;qBACjC;oBACD,QAAQ,EAAE,CAAA;iBACX;aACF,CAAC,CAAA;SACH,EACD,EAAC,UAAU,EAAE,MAAM,EAAC,CACrB,CAAA;QACD,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC7C;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,OAAO,IAAI,CAAA;SACZ;QACD,QACE,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC,IACzC,YAAM,KAAK,EAAE,SAAS,CAAC,MAAM,EAAE,SAAS,EAAE,IAAI,CAAC,QAAQ,GAAS,CAC3D,EACR;KACF;;;;;;;;;;;","names":[],"sources":["../../../packages/core/src/components/gov-icon/constants.ts","../../../packages/core/src/utils/ds.utils.ts","../../../packages/core/src/utils/icon.utils.ts","../../../packages/core/src/components/gov-icon/gov-icon.scss?tag=gov-icon","../../../packages/core/src/components/gov-icon/gov-icon.tsx"],"sourcesContent":["import { ValueOf } from '../../types/interfaces'\n\nenum Types {\n\tBASIC = 'basic',\n\tCOMPLEX = 'complex',\n\tCOLORED = 'colored',\n}\nexport type Type = `${ValueOf<typeof Types>}`\n\nexport const IconClass = {\n\troot: 'gov-icon',\n\tholder: 'gov-icon__holder',\n}\n","import { version } from '../../package.json'\n\nexport const dsVersion = (): string => {\n\treturn version\n}\n","import { getAssetPath } from \"@stencil/core\"\nimport { dsVersion } from \"./ds.utils\"\nimport { iconsPath } from \"../helpers/Dom/win\"\n\nconst iconCache: { [key: string]: string } = {}\nconst requestCache: { [key: string]: Promise<string> } = {}\n\nconst isExternalUrl = (path: string) => path.startsWith(\"http://\") || path.startsWith(\"https://\")\nconst iconUrl = (path: string, name: string, type: string) => {\n\tif (isExternalUrl(path)) {\n\t\treturn `${path}/${type}/${name}.svg?v=${dsVersion()}`\n\t}\n\treturn getAssetPath(`${path}/${type}/${name}.svg`) + `?v=${dsVersion()}`\n}\n\nexport async function fetchIcon({ name, type }: { name: string; type: string }): Promise<string> {\n\tconst cacheKey = type + \"-\" + name\n\tif (iconCache[cacheKey]) {\n\t\treturn iconCache[cacheKey]\n\t}\n\tif (!requestCache[cacheKey]) {\n\t\trequestCache[cacheKey] = fetch(iconUrl(iconsPath(), name, type)).then(resp => {\n\t\t\tif (resp.status === 200) {\n\t\t\t\treturn resp.text()\n\t\t\t} else {\n\t\t\t\tthrow new Error(\"Gov Icon doesn't exists\")\n\t\t\t}\n\t\t})\n\t}\n\tconst path = await requestCache[cacheKey]\n\ticonCache[cacheKey] = path\n\treturn path\n}\n","/*\n *   Icon\n */\n\n$class: \".gov-icon\";\n\n#{$class} {\n\tdisplay: inline-flex;\n\t&__holder {\n\t\tdisplay: inline-flex;\n\t\twidth: 100%;\n\t\theight: 100%;\n\n\t\t& + #{$class}__holder {\n\t\t\tdisplay: none !important;\n\t\t}\n\t}\n\tsvg {\n\t\tdisplay: inline-flex;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tmax-width: 100%;\n\t\tmax-height: 100%;\n\t}\n}\n","import {Build, Component, Element, h, Host, Prop, State, Watch} from \"@stencil/core\"\nimport {IconClass} from \"./constants\"\nimport {fetchIcon} from \"../../utils/icon.utils\"\nimport {govHost} from \"../../helpers/Dom/template\"\nimport {GovHost} from \"../../helpers/Dom/template.types\"\nimport {iconsLazyLoad} from \"../../helpers/Dom/win\"\n\n@Component({\n  assetsDirs: [\"assets\"],\n  styleUrl: \"gov-icon.scss\",\n  tag: \"gov-icon\",\n})\nexport class GovIcon {\n  private h: GovHost\n\n  constructor() {\n    this.h = govHost(this.host)\n  }\n\n  @Element() host: HTMLGovIconElement\n  /**\n   * Name of icon\n   */\n  @Prop() name: string = null\n  /**\n   * Type (folder) of icon\n   */\n  @Prop() type: string = \"basic\"\n  @State() private iconData: string\n  @State() private visible = false\n  @State() private error = false\n  private intersectionObserver: IntersectionObserver\n\n  @Watch(\"name\")\n  private async loadIconPathData(): Promise<void> {\n    const {name, visible, type} = this\n    if (!Build.isBrowser || !name || !visible) {\n      return\n    }\n    try {\n      this.iconData = await fetchIcon({name, type})\n    } catch (e) {\n      this.error = true\n    }\n  }\n\n  connectedCallback(): void {\n    if (iconsLazyLoad()) {\n      this.visible = true\n      this.loadIconPathData().finally()\n    } else {\n      this.waitUntilVisible(async () => {\n        this.visible = true\n        await this.loadIconPathData()\n      })\n    }\n  }\n\n  disconnectedCallback(): void {\n    if (this.intersectionObserver) {\n      this.intersectionObserver.disconnect()\n      this.intersectionObserver = null\n    }\n  }\n\n  async componentWillLoad(): Promise<void> {\n    await this.loadIconPathData()\n  }\n\n  private waitUntilVisible(callback: () => void): void {\n    if (!Build.isBrowser || typeof window === \"undefined\" || !(window as any).IntersectionObserver) {\n      callback()\n      return\n    }\n    this.intersectionObserver = new IntersectionObserver(\n      entries => {\n        entries.forEach(entry => {\n          if (entry.isIntersecting) {\n            if (this.intersectionObserver) {\n              this.intersectionObserver.disconnect()\n              this.intersectionObserver = null\n            }\n            callback()\n          }\n        })\n      },\n      {rootMargin: \"50px\"},\n    )\n    this.intersectionObserver.observe(this.host)\n  }\n\n  render() {\n    if (this.error) {\n      return null\n    }\n    return (\n      <Host class={this.h.classes(IconClass.root)}>\n        <span class={IconClass.holder} innerHTML={this.iconData}></span>\n      </Host>\n    )\n  }\n}\n"],"version":3}

package/dist/esm/gov-infobar.entry.js

@@ -1,87 +1,88 @@
-import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-eb59f132.js';
-import { g as govHost, a as toBoolAttr } from './template-a0067bb6.js';
-import { c as canValidateWcagOnRender } from './win-1dbd3f5c.js';
+import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-84a63a3e.js';
+import { g as govHost, a as toBoolAttr } from './template-94812ab3.js';
+import { c as canValidateWcagOnRender } from './win-b64cd8a6.js';
 import { F as Fragment } from './Fragment-8d8d54fb.js';
-import { v as validateProp } from './props-a85d9c89.js';
-import { c as validateWcagProp } from './wcag-7d25e12b.js';
-import { p as pick, d as delay } from './utils-c057a3fa.js';
-import { V as Variants } from './variants-2b936d58.js';
-import './gov.log-49da0221.js';
-import './string.utils-f268fc6b.js';
+import { v as validateProp } from './props-ec3beb91.js';
+import { c as validateWcagProp } from './wcag-6ad92279.js';
+import { p as pick, d as delay } from './utils-e10e994d.js';
+import { V as Variants } from './variants-69f013c1.js';
+import './gov.log-431da6b2.js';
+import './string.utils-5ce3f551.js';
 
 const InfobarVariants = pick(Variants, ['PRIMARY', 'SECONDARY', 'WARNING', 'ERROR', 'SUCCESS']);
 const InfobarClass = {
-  root: 'gov-infobar',
-  section: 'gov-infobar__section',
-  icon: 'gov-infobar__icon',
-  content: 'gov-infobar__content',
-  closable: 'gov-infobar__content--closable',
-  headline: 'gov-infobar__headline',
-  close: 'gov-infobar__close',
+    root: 'gov-infobar',
+    section: 'gov-infobar__section',
+    icon: 'gov-infobar__icon',
+    content: 'gov-infobar__content',
+    closable: 'gov-infobar__content--closable',
+    headline: 'gov-infobar__headline',
+    close: 'gov-infobar__close',
 };
 
 const govInfobarCss = ".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}}.gov-infobar{position:relative;display:block;width:100%}.gov-infobar__section{display:flex;gap:1rem;padding:1rem}.gov-infobar__icon{flex:0 0 auto}.gov-infobar__icon>*{width:1.25rem;height:1.25rem}.gov-infobar__headline{display:flex;gap:1rem}.gov-infobar__headline+div{margin-top:0.5rem}.gov-infobar__headline p{margin-bottom:0}.gov-infobar__headline gov-button{margin-top:-0.25rem}.gov-infobar__content{width:100%}.gov-infobar__content>*:last-child{margin-bottom:0}.gov-infobar__content--closable{padding-right:3.5rem}.gov-infobar__content p{font-weight:var(--gov-text-m-font-weight);font-size:var(--gov-text-m-font-size);line-height:var(--gov-text-m-line-height);letter-spacing:var(--gov-text-m-letter-spacing)}.gov-infobar__content a{color:inherit}@media not all and (pointer: coarse){.gov-infobar__content a:hover{color:inherit}}.gov-infobar__content a .gov-icon{color:inherit}.gov-infobar__close{position:absolute;top:0.875rem;right:1rem}.gov-infobar[variant=warning]{background-color:var(--gov-infobar-warning-bg-color, var(--gov-color-warning))}.gov-infobar[variant=warning] .gov-infobar__icon{color:var(--gov-infobar-warning-icon-color, var(--gov-color-secondary))}.gov-infobar[variant=warning] .gov-infobar__content{color:var(--gov-infobar-warning-text-color, var(--gov-color-secondary))}.gov-infobar[variant=warning][inverse=\"\"],.gov-infobar[variant=warning][inverse=true i],.gov-infobar[variant=warning][inverse=\"1\"]{border-bottom:var(--gov-infobar-border, 0.0625rem solid var(--gov-color-secondary-400));background-color:var(--gov-infobar-inverse-bg, var(--gov-color-neutral-white))}.gov-infobar[variant=warning][inverse=\"\"] .gov-infobar__icon,.gov-infobar[variant=warning][inverse=true i] .gov-infobar__icon,.gov-infobar[variant=warning][inverse=\"1\"] .gov-infobar__icon{color:var(--gov-infobar-warning-bg-color, var(--gov-color-warning))}.gov-infobar[variant=warning][inverse=\"\"] .gov-infobar__content,.gov-infobar[variant=warning][inverse=true i] .gov-infobar__content,.gov-infobar[variant=warning][inverse=\"1\"] .gov-infobar__content{color:var(--gov-infobar-inverse-color, var(--gov-color-secondary-800))}.gov-infobar[variant=error]{background-color:var(--gov-infobar-error-bg-color, var(--gov-color-error))}.gov-infobar[variant=error] .gov-infobar__icon{color:var(--gov-infobar-error-icon-color, var(--gov-color-neutral-white))}.gov-infobar[variant=error] .gov-infobar__content{color:var(--gov-infobar-error-text-color, var(--gov-color-neutral-white))}.gov-infobar[variant=error][inverse=\"\"],.gov-infobar[variant=error][inverse=true i],.gov-infobar[variant=error][inverse=\"1\"]{border-bottom:var(--gov-infobar-border, 0.0625rem solid var(--gov-color-secondary-400));background-color:var(--gov-infobar-inverse-bg, var(--gov-color-neutral-white))}.gov-infobar[variant=error][inverse=\"\"] .gov-infobar__icon,.gov-infobar[variant=error][inverse=true i] .gov-infobar__icon,.gov-infobar[variant=error][inverse=\"1\"] .gov-infobar__icon{color:var(--gov-infobar-error-bg-color, var(--gov-color-error))}.gov-infobar[variant=error][inverse=\"\"] .gov-infobar__content,.gov-infobar[variant=error][inverse=true i] .gov-infobar__content,.gov-infobar[variant=error][inverse=\"1\"] .gov-infobar__content{color:var(--gov-infobar-inverse-color, var(--gov-color-secondary-800))}.gov-infobar[variant=secondary]{background-color:var(--gov-infobar-secondary-bg-color, var(--gov-color-secondary))}.gov-infobar[variant=secondary] .gov-infobar__icon{color:var(--gov-infobar-secondary-icon-color, var(--gov-color-neutral-white))}.gov-infobar[variant=secondary] .gov-infobar__content{color:var(--gov-infobar-secondary-text-color, var(--gov-color-neutral-white))}.gov-infobar[variant=secondary][inverse=\"\"],.gov-infobar[variant=secondary][inverse=true i],.gov-infobar[variant=secondary][inverse=\"1\"]{border-bottom:var(--gov-infobar-border, 0.0625rem solid var(--gov-color-secondary-400));background-color:var(--gov-infobar-inverse-bg, var(--gov-color-neutral-white))}.gov-infobar[variant=secondary][inverse=\"\"] .gov-infobar__icon,.gov-infobar[variant=secondary][inverse=true i] .gov-infobar__icon,.gov-infobar[variant=secondary][inverse=\"1\"] .gov-infobar__icon{color:var(--gov-infobar-secondary-bg-color, var(--gov-color-secondary))}.gov-infobar[variant=secondary][inverse=\"\"] .gov-infobar__content,.gov-infobar[variant=secondary][inverse=true i] .gov-infobar__content,.gov-infobar[variant=secondary][inverse=\"1\"] .gov-infobar__content{color:var(--gov-infobar-inverse-color, var(--gov-color-secondary-800))}.gov-infobar[variant=success]{background-color:var(--gov-infobar-success-bg-color, var(--gov-color-success-500))}.gov-infobar[variant=success] .gov-infobar__icon{color:var(--gov-infobar-success-icon-color, var(--gov-color-neutral-white))}.gov-infobar[variant=success] .gov-infobar__content{color:var(--gov-infobar-success-text-color, var(--gov-color-neutral-white))}.gov-infobar[variant=success][inverse=\"\"],.gov-infobar[variant=success][inverse=true i],.gov-infobar[variant=success][inverse=\"1\"]{border-bottom:var(--gov-infobar-border, 0.0625rem solid var(--gov-color-secondary-400));background-color:var(--gov-infobar-inverse-bg, var(--gov-color-neutral-white))}.gov-infobar[variant=success][inverse=\"\"] .gov-infobar__icon,.gov-infobar[variant=success][inverse=true i] .gov-infobar__icon,.gov-infobar[variant=success][inverse=\"1\"] .gov-infobar__icon{color:var(--gov-infobar-success-bg-color, var(--gov-color-success-500))}.gov-infobar[variant=success][inverse=\"\"] .gov-infobar__content,.gov-infobar[variant=success][inverse=true i] .gov-infobar__content,.gov-infobar[variant=success][inverse=\"1\"] .gov-infobar__content{color:var(--gov-infobar-inverse-color, var(--gov-color-secondary-800))}.gov-infobar[variant=primary]{background-color:var(--gov-infobar-primary-bg-color, var(--gov-color-primary))}.gov-infobar[variant=primary] .gov-infobar__icon{color:var(--gov-infobar-primary-icon-color, var(--gov-color-neutral-white))}.gov-infobar[variant=primary] .gov-infobar__content{color:var(--gov-infobar-primary-text-color, var(--gov-color-neutral-white))}.gov-infobar[variant=primary][inverse=\"\"],.gov-infobar[variant=primary][inverse=true i],.gov-infobar[variant=primary][inverse=\"1\"]{border-bottom:var(--gov-infobar-border, 0.0625rem solid var(--gov-color-secondary-400));background-color:var(--gov-infobar-inverse-bg, var(--gov-color-neutral-white))}.gov-infobar[variant=primary][inverse=\"\"] .gov-infobar__icon,.gov-infobar[variant=primary][inverse=true i] .gov-infobar__icon,.gov-infobar[variant=primary][inverse=\"1\"] .gov-infobar__icon{color:var(--gov-infobar-primary-bg-color, var(--gov-color-primary))}.gov-infobar[variant=primary][inverse=\"\"] .gov-infobar__content,.gov-infobar[variant=primary][inverse=true i] .gov-infobar__content,.gov-infobar[variant=primary][inverse=\"1\"] .gov-infobar__content{color:var(--gov-infobar-inverse-color, var(--gov-color-secondary-800))}";
+const GovInfobarStyle0 = govInfobarCss;
 
 const GovInfobar = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.govClose = createEvent(this, "gov-close", 7);
-    this.headline = undefined;
-    this.variant = 'primary';
-    this.role = undefined;
-    this.inverse = false;
-    this.wcagCloseLabel = 'Zavřít informační lištu';
-    this.wcagToggleLabel = 'Zobrazit více informací';
-    this.closable = false;
-    this.toggleContent = false;
-    this.h = govHost(this.host);
-  }
-  validateVariant(newValue) {
-    validateProp(InfobarVariants, newValue, InfobarClass.root);
-  }
-  componentWillLoad() {
-    this.validateVariant(this.variant);
-  }
-  async componentDidRender() {
-    if (canValidateWcagOnRender()) {
-      await delay(500);
-      await this.validateWcag();
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.govClose = createEvent(this, "gov-close", 7);
+        this.headline = undefined;
+        this.variant = 'primary';
+        this.role = undefined;
+        this.inverse = false;
+        this.wcagCloseLabel = 'Zavřít informační lištu';
+        this.wcagToggleLabel = 'Zobrazit více informací';
+        this.closable = false;
+        this.toggleContent = false;
+        this.h = govHost(this.host);
     }
-  }
-  render() {
-    let inverse = !this.inverse;
-    let variant = this.inverse ? 'secondary' : this.variant;
-    if (this.variant == 'warning') {
-      inverse = false;
-      variant = 'secondary';
+    validateVariant(newValue) {
+        validateProp(InfobarVariants, newValue, InfobarClass.root);
     }
-    const closeButton = (h("div", { class: InfobarClass.close }, h("gov-button", { size: "s", wcagLabel: this.wcagCloseLabel, type: "base", variant: variant, inverse: inverse, "on-gov-click": this.onCloseHandler.bind(this) }, h("gov-icon", { name: "x-lg" }))));
-    return (h(Host, { class: this.h.classes(InfobarClass.root), variant: this.variant }, h("section", { class: InfobarClass.section, role: this.role }, this.h.hasSlot('icon') && (h("div", { class: InfobarClass.icon }, h("slot", { name: "icon" }))), h("div", { class: InfobarClass.content + (this.closable ? ' ' + InfobarClass.closable : '') }, this.headline ? (h(Fragment, null, h("div", { class: InfobarClass.headline }, h("p", null, this.headline), h("gov-button", { size: "s", wcagLabel: this.wcagToggleLabel, type: "base", variant: variant, inverse: inverse, "on-gov-click": () => (this.toggleContent = !this.toggleContent) }, h("gov-icon", { name: this.toggleContent ? 'chevron-up' : 'chevron-down' }))), h("div", { hidden: !this.toggleContent, "aria-hidden": toBoolAttr(this.toggleContent) }, h("slot", null)))) : (h("slot", null)))), this.closable && closeButton));
-  }
-  onCloseHandler(e) {
-    this.govClose.emit({
-      component: InfobarClass.root,
-      ref: this.host,
-      originalEvent: e,
-    });
-  }
-  /**
-   * Validate the WCAG attributes of the component
-   */
-  async validateWcag() {
-    if (this.closable) {
-      validateWcagProp(this.wcagCloseLabel, 'wcag-close-label', InfobarClass.root);
+    componentWillLoad() {
+        this.validateVariant(this.variant);
     }
-    if (this.headline) {
-      validateWcagProp(this.wcagToggleLabel, 'wcag-toggle-label', InfobarClass.root);
+    async componentDidRender() {
+        if (canValidateWcagOnRender()) {
+            await delay(500);
+            await this.validateWcag();
+        }
     }
-  }
-  get host() { return getElement(this); }
-  static get watchers() { return {
-    "variant": ["validateVariant"]
-  }; }
+    render() {
+        let inverse = !this.inverse;
+        let variant = this.inverse ? 'secondary' : this.variant;
+        if (this.variant == 'warning') {
+            inverse = false;
+            variant = 'secondary';
+        }
+        const closeButton = (h("div", { key: '77b4d53e93469ca4325f5af65c8fc90efa44e821', class: InfobarClass.close }, h("gov-button", { key: '5e8fc17fb25637229c1d5c122edb032ac9eade08', size: "s", wcagLabel: this.wcagCloseLabel, type: "base", variant: variant, inverse: inverse, "on-gov-click": this.onCloseHandler.bind(this) }, h("gov-icon", { key: '45a33018478d0ef04211313a10857a7d2ad6e66a', name: "x-lg" }))));
+        return (h(Host, { key: 'bbcca556a269756e86610ac5730d780afc10dd1f', class: this.h.classes(InfobarClass.root), variant: this.variant }, h("section", { key: '03af203186f5dabafa3871a27ecef1064dc62138', class: InfobarClass.section, role: this.role }, this.h.hasSlot('icon') && (h("div", { key: '2aa3131f8489eb94a3cf18c58af98c25ea6c6295', class: InfobarClass.icon }, h("slot", { key: '4c81fa3be4aff480578222c3e65f84e51117b221', name: "icon" }))), h("div", { key: '190f4f6b6d5b6962551e310a081f765b572b24e9', class: InfobarClass.content + (this.closable ? ' ' + InfobarClass.closable : '') }, this.headline ? (h(Fragment, null, h("div", { class: InfobarClass.headline }, h("p", null, this.headline), h("gov-button", { size: "s", wcagLabel: this.wcagToggleLabel, type: "base", variant: variant, inverse: inverse, "on-gov-click": () => (this.toggleContent = !this.toggleContent) }, h("gov-icon", { name: this.toggleContent ? 'chevron-up' : 'chevron-down' }))), h("div", { hidden: !this.toggleContent, "aria-hidden": toBoolAttr(this.toggleContent) }, h("slot", null)))) : (h("slot", null)))), this.closable && closeButton));
+    }
+    onCloseHandler(e) {
+        this.govClose.emit({
+            component: InfobarClass.root,
+            ref: this.host,
+            originalEvent: e,
+        });
+    }
+    /**
+     * Validate the WCAG attributes of the component
+     */
+    async validateWcag() {
+        if (this.closable) {
+            validateWcagProp(this.wcagCloseLabel, 'wcag-close-label', InfobarClass.root);
+        }
+        if (this.headline) {
+            validateWcagProp(this.wcagToggleLabel, 'wcag-toggle-label', InfobarClass.root);
+        }
+    }
+    get host() { return getElement(this); }
+    static get watchers() { return {
+        "variant": ["validateVariant"]
+    }; }
 };
-GovInfobar.style = govInfobarCss;
+GovInfobar.style = GovInfobarStyle0;
 
 export { GovInfobar as gov_infobar };
 

package/dist/esm/gov-infobar.entry.js.map

@@ -1 +1 @@
-{"file":"gov-infobar.entry.js","mappings":"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","names":[],"sources":["../../../packages/core/src/components/gov-infobar/constants.ts","../../../packages/core/src/components/gov-infobar/gov-infobar.scss?tag=gov-infobar","../../../packages/core/src/components/gov-infobar/gov-infobar.tsx"],"sourcesContent":["import { Variants } from '../../core/constants/variants'\nimport { pick } from '../../utils/utils'\nimport { ValueOf } from '../../types/interfaces'\n\nexport const InfobarVariants = pick(Variants, ['PRIMARY', 'SECONDARY', 'WARNING', 'ERROR', 'SUCCESS'])\nexport type VariantType = `${ValueOf<typeof InfobarVariants>}`\n\nexport const InfobarClass = {\n\troot: 'gov-infobar',\n\tsection: 'gov-infobar__section',\n\ticon: 'gov-infobar__icon',\n\tcontent: 'gov-infobar__content',\n\tclosable: 'gov-infobar__content--closable',\n\theadline: 'gov-infobar__headline',\n\tclose: 'gov-infobar__close',\n}\n","/*\n *   Infobar\n */\n\n$class: \".gov-infobar\";\n\n#{$class} {\n\t@include base();\n\n\t&__section {\n\t\tdisplay: flex;\n\t\tgap: rem-calc(16);\n\t\tpadding: rem-calc(16);\n\t}\n\n\t&__icon {\n\t\tflex: 0 0 auto;\n\n\t\t& > * {\n\t\t\twidth: rem-calc(20);\n\t\t\theight: rem-calc(20);\n\t\t}\n\t}\n\n\t&__headline {\n\t\tdisplay: flex;\n\t\tgap: rem-calc(16);\n\n\t\t+ div {\n\t\t\tmargin-top: rem-calc(8);\n\t\t}\n\n\t\tp {\n\t\t\tmargin-bottom: 0;\n\t\t}\n\n\t\tgov-button {\n\t\t\tmargin-top: rem-calc(-4);\n\t\t}\n\t}\n\n\t&__content {\n\t\t@include reset-last-margin();\n\t\twidth: 100%;\n\n\t\t&--closable {\n\t\t\tpadding-right: rem-calc(56);\n\t\t}\n\n\t\tp {\n\t\t\t@include typography($font-size-m);\n\t\t}\n\n\t\ta {\n\t\t\tcolor: inherit;\n\t\t\t@include hover() {\n\t\t\t\tcolor: inherit;\n\t\t\t}\n\t\t\t.gov-icon {\n\t\t\t\tcolor: inherit;\n\t\t\t}\n\t\t}\n\t}\n\n\t&__close {\n\t\tposition: absolute;\n\t\ttop: rem-calc(14);\n\t\tright: rem-calc(16);\n\t}\n\n\t// VARIANTS\n\t@each $variant, $definitions in $infobar-variants {\n\t\t&[variant=\"#{$variant}\"] {\n\t\t\tbackground-color: get(\"bg-color\", $definitions);\n\n\t\t\t#{$class} {\n\t\t\t\t&__icon {\n\t\t\t\t\tcolor: get(\"icon-color\", $definitions);\n\t\t\t\t}\n\n\t\t\t\t&__content {\n\t\t\t\t\tcolor: get(\"text-color\", $definitions);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t@if deep-map-check($definitions, \"border\") {\n\t\t\t\tborder-bottom: $infobar-border;\n\t\t\t}\n\n\t\t\t// STATES\n\t\t\t@include parameter(\"inverse\") {\n\t\t\t\tborder-bottom: $infobar-border;\n\t\t\t\tbackground-color: $infobar-inverse-bg;\n\t\t\t\t#{$class} {\n\t\t\t\t\t&__icon {\n\t\t\t\t\t\tcolor: get(\"bg-color\", $definitions);\n\t\t\t\t\t}\n\n\t\t\t\t\t&__content {\n\t\t\t\t\t\tcolor: $infobar-inverse-color;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n","import {Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch} from '@stencil/core'\nimport {govHost, toBoolAttr} from '../../helpers/Dom/template'\nimport {GovHost} from '../../helpers/Dom/template.types'\nimport {canValidateWcagOnRender} from '../../helpers/Dom/win'\nimport Fragment from '../../helpers/Fragment'\nimport {validateProp} from '../../helpers/Validate/props'\nimport {validateWcagProp} from '../../helpers/Validate/wcag'\nimport {delay} from '../../utils/utils'\nimport {ButtonEvent} from '../gov-button/button/gov-button.types'\nimport {InfobarClass, InfobarVariants, VariantType} from './constants'\nimport {InfobarEvent} from './gov-infobar.types'\n\n@Component({\n\ttag: 'gov-infobar',\n\tstyleUrl: 'gov-infobar.scss',\n})\nexport class GovInfobar {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovInfobarElement\n\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop() readonly headline: string\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop() readonly variant: VariantType = 'primary'\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop() readonly role: HTMLElement['role'] = undefined\n\t/**\n\t * Determine if component should have inverse colors to be used on dark background\n\t */\n\t@Prop() readonly inverse: boolean = false\n\t/**\n\t * Aria label for the closing button. It is mandatory if the infobar is closable\n\t */\n\t@Prop({attribute: 'wcag-close-label'}) readonly wcagCloseLabel: string = 'Zavřít informační lištu'\n\t/**\n\t * Aria label for the toggle button. It is mandatory if the infobar has headline\n\t */\n\t@Prop({attribute: 'wcag-toggle-label'}) readonly wcagToggleLabel: string = 'Zobrazit více informací'\n\t/**\n\t * Called when the close button is clicked\n\t */\n\t@Event({eventName: 'gov-close'}) govClose: EventEmitter<InfobarEvent>\n\t/**\n\t * Displays the option to close the infobar\n\t */\n\t@Prop() readonly closable?: boolean = false\n\n\t@State() toggleContent = false\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(InfobarVariants, newValue, InfobarClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateVariant(this.variant)\n\t}\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\tlet inverse = !this.inverse\n\t\tlet variant = this.inverse ? 'secondary' : this.variant\n\n\t\tif (this.variant == 'warning') {\n\t\t\tinverse = false\n\t\t\tvariant = 'secondary'\n\t\t}\n\n\t\tconst closeButton = (\n\t\t\t<div class={InfobarClass.close}>\n\t\t\t\t<gov-button size=\"s\" wcagLabel={this.wcagCloseLabel} type=\"base\" variant={variant} inverse={inverse}\n\t\t\t\t\t\t\t\t\t\ton-gov-click={this.onCloseHandler.bind(this)}>\n\t\t\t\t\t<gov-icon name=\"x-lg\"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t)\n\n\t\treturn (\n\t\t\t<Host class={this.h.classes(InfobarClass.root)} variant={this.variant}>\n\t\t\t\t<section class={InfobarClass.section} role={this.role}>\n\t\t\t\t\t{this.h.hasSlot('icon') && (\n\t\t\t\t\t\t<div class={InfobarClass.icon}>\n\t\t\t\t\t\t\t<slot name=\"icon\"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t<div class={InfobarClass.content + (this.closable ? ' ' + InfobarClass.closable : '')}>\n\t\t\t\t\t\t{this.headline ? (\n\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t<div class={InfobarClass.headline}>\n\t\t\t\t\t\t\t\t\t<p>{this.headline}</p>\n\t\t\t\t\t\t\t\t\t<gov-button\n\t\t\t\t\t\t\t\t\t\tsize=\"s\"\n\t\t\t\t\t\t\t\t\t\twcagLabel={this.wcagToggleLabel}\n\t\t\t\t\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\t\t\t\t\tinverse={inverse}\n\t\t\t\t\t\t\t\t\t\ton-gov-click={() => (this.toggleContent = !this.toggleContent)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<gov-icon name={this.toggleContent ? 'chevron-up' : 'chevron-down'}></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div hidden={!this.toggleContent} aria-hidden={toBoolAttr(this.toggleContent)}>\n\t\t\t\t\t\t\t\t\t<slot/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<slot/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</section>\n\t\t\t\t{this.closable && closeButton}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tonCloseHandler(e: CustomEvent<ButtonEvent>) {\n\t\tthis.govClose.emit({\n\t\t\tcomponent: InfobarClass.root,\n\t\t\tref: this.host,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tif (this.closable) {\n\t\t\tvalidateWcagProp(this.wcagCloseLabel, 'wcag-close-label', InfobarClass.root)\n\t\t}\n\t\tif (this.headline) {\n\t\t\tvalidateWcagProp(this.wcagToggleLabel, 'wcag-toggle-label', InfobarClass.root)\n\t\t}\n\t}\n}\n"],"version":3}
+{"file":"gov-infobar.entry.js","mappings":"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","names":[],"sources":["../../../packages/core/src/components/gov-infobar/constants.ts","../../../packages/core/src/components/gov-infobar/gov-infobar.scss?tag=gov-infobar","../../../packages/core/src/components/gov-infobar/gov-infobar.tsx"],"sourcesContent":["import { Variants } from '../../core/constants/variants'\nimport { pick } from '../../utils/utils'\nimport { ValueOf } from '../../types/interfaces'\n\nexport const InfobarVariants = pick(Variants, ['PRIMARY', 'SECONDARY', 'WARNING', 'ERROR', 'SUCCESS'])\nexport type VariantType = `${ValueOf<typeof InfobarVariants>}`\n\nexport const InfobarClass = {\n\troot: 'gov-infobar',\n\tsection: 'gov-infobar__section',\n\ticon: 'gov-infobar__icon',\n\tcontent: 'gov-infobar__content',\n\tclosable: 'gov-infobar__content--closable',\n\theadline: 'gov-infobar__headline',\n\tclose: 'gov-infobar__close',\n}\n","/*\n *   Infobar\n */\n\n$class: \".gov-infobar\";\n\n#{$class} {\n\t@include base();\n\n\t&__section {\n\t\tdisplay: flex;\n\t\tgap: rem-calc(16);\n\t\tpadding: rem-calc(16);\n\t}\n\n\t&__icon {\n\t\tflex: 0 0 auto;\n\n\t\t& > * {\n\t\t\twidth: rem-calc(20);\n\t\t\theight: rem-calc(20);\n\t\t}\n\t}\n\n\t&__headline {\n\t\tdisplay: flex;\n\t\tgap: rem-calc(16);\n\n\t\t+ div {\n\t\t\tmargin-top: rem-calc(8);\n\t\t}\n\n\t\tp {\n\t\t\tmargin-bottom: 0;\n\t\t}\n\n\t\tgov-button {\n\t\t\tmargin-top: rem-calc(-4);\n\t\t}\n\t}\n\n\t&__content {\n\t\t@include reset-last-margin();\n\t\twidth: 100%;\n\n\t\t&--closable {\n\t\t\tpadding-right: rem-calc(56);\n\t\t}\n\n\t\tp {\n\t\t\t@include typography($font-size-m);\n\t\t}\n\n\t\ta {\n\t\t\tcolor: inherit;\n\t\t\t@include hover() {\n\t\t\t\tcolor: inherit;\n\t\t\t}\n\t\t\t.gov-icon {\n\t\t\t\tcolor: inherit;\n\t\t\t}\n\t\t}\n\t}\n\n\t&__close {\n\t\tposition: absolute;\n\t\ttop: rem-calc(14);\n\t\tright: rem-calc(16);\n\t}\n\n\t// VARIANTS\n\t@each $variant, $definitions in $infobar-variants {\n\t\t&[variant=\"#{$variant}\"] {\n\t\t\tbackground-color: get(\"bg-color\", $definitions);\n\n\t\t\t#{$class} {\n\t\t\t\t&__icon {\n\t\t\t\t\tcolor: get(\"icon-color\", $definitions);\n\t\t\t\t}\n\n\t\t\t\t&__content {\n\t\t\t\t\tcolor: get(\"text-color\", $definitions);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t@if deep-map-check($definitions, \"border\") {\n\t\t\t\tborder-bottom: $infobar-border;\n\t\t\t}\n\n\t\t\t// STATES\n\t\t\t@include parameter(\"inverse\") {\n\t\t\t\tborder-bottom: $infobar-border;\n\t\t\t\tbackground-color: $infobar-inverse-bg;\n\t\t\t\t#{$class} {\n\t\t\t\t\t&__icon {\n\t\t\t\t\t\tcolor: get(\"bg-color\", $definitions);\n\t\t\t\t\t}\n\n\t\t\t\t\t&__content {\n\t\t\t\t\t\tcolor: $infobar-inverse-color;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n","import {Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch} from '@stencil/core'\nimport {govHost, toBoolAttr} from '../../helpers/Dom/template'\nimport {GovHost} from '../../helpers/Dom/template.types'\nimport {canValidateWcagOnRender} from '../../helpers/Dom/win'\nimport Fragment from '../../helpers/Fragment'\nimport {validateProp} from '../../helpers/Validate/props'\nimport {validateWcagProp} from '../../helpers/Validate/wcag'\nimport {delay} from '../../utils/utils'\nimport {ButtonEvent} from '../gov-button/button/gov-button.types'\nimport {InfobarClass, InfobarVariants, VariantType} from './constants'\nimport {InfobarEvent} from './gov-infobar.types'\n\n@Component({\n\ttag: 'gov-infobar',\n\tstyleUrl: 'gov-infobar.scss',\n})\nexport class GovInfobar {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovInfobarElement\n\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop() readonly headline: string\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop() readonly variant: VariantType = 'primary'\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop() readonly role: HTMLElement['role'] = undefined\n\t/**\n\t * Determine if component should have inverse colors to be used on dark background\n\t */\n\t@Prop() readonly inverse: boolean = false\n\t/**\n\t * Aria label for the closing button. It is mandatory if the infobar is closable\n\t */\n\t@Prop({attribute: 'wcag-close-label'}) readonly wcagCloseLabel: string = 'Zavřít informační lištu'\n\t/**\n\t * Aria label for the toggle button. It is mandatory if the infobar has headline\n\t */\n\t@Prop({attribute: 'wcag-toggle-label'}) readonly wcagToggleLabel: string = 'Zobrazit více informací'\n\t/**\n\t * Called when the close button is clicked\n\t */\n\t@Event({eventName: 'gov-close'}) govClose: EventEmitter<InfobarEvent>\n\t/**\n\t * Displays the option to close the infobar\n\t */\n\t@Prop() readonly closable?: boolean = false\n\n\t@State() toggleContent = false\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(InfobarVariants, newValue, InfobarClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateVariant(this.variant)\n\t}\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\tlet inverse = !this.inverse\n\t\tlet variant = this.inverse ? 'secondary' : this.variant\n\n\t\tif (this.variant == 'warning') {\n\t\t\tinverse = false\n\t\t\tvariant = 'secondary'\n\t\t}\n\n\t\tconst closeButton = (\n\t\t\t<div class={InfobarClass.close}>\n\t\t\t\t<gov-button size=\"s\" wcagLabel={this.wcagCloseLabel} type=\"base\" variant={variant} inverse={inverse}\n\t\t\t\t\t\t\t\t\t\ton-gov-click={this.onCloseHandler.bind(this)}>\n\t\t\t\t\t<gov-icon name=\"x-lg\"></gov-icon>\n\t\t\t\t</gov-button>\n\t\t\t</div>\n\t\t)\n\n\t\treturn (\n\t\t\t<Host class={this.h.classes(InfobarClass.root)} variant={this.variant}>\n\t\t\t\t<section class={InfobarClass.section} role={this.role}>\n\t\t\t\t\t{this.h.hasSlot('icon') && (\n\t\t\t\t\t\t<div class={InfobarClass.icon}>\n\t\t\t\t\t\t\t<slot name=\"icon\"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t<div class={InfobarClass.content + (this.closable ? ' ' + InfobarClass.closable : '')}>\n\t\t\t\t\t\t{this.headline ? (\n\t\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t\t<div class={InfobarClass.headline}>\n\t\t\t\t\t\t\t\t\t<p>{this.headline}</p>\n\t\t\t\t\t\t\t\t\t<gov-button\n\t\t\t\t\t\t\t\t\t\tsize=\"s\"\n\t\t\t\t\t\t\t\t\t\twcagLabel={this.wcagToggleLabel}\n\t\t\t\t\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\t\t\t\t\tinverse={inverse}\n\t\t\t\t\t\t\t\t\t\ton-gov-click={() => (this.toggleContent = !this.toggleContent)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<gov-icon name={this.toggleContent ? 'chevron-up' : 'chevron-down'}></gov-icon>\n\t\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div hidden={!this.toggleContent} aria-hidden={toBoolAttr(this.toggleContent)}>\n\t\t\t\t\t\t\t\t\t<slot/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<slot/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</section>\n\t\t\t\t{this.closable && closeButton}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tonCloseHandler(e: CustomEvent<ButtonEvent>) {\n\t\tthis.govClose.emit({\n\t\t\tcomponent: InfobarClass.root,\n\t\t\tref: this.host,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tif (this.closable) {\n\t\t\tvalidateWcagProp(this.wcagCloseLabel, 'wcag-close-label', InfobarClass.root)\n\t\t}\n\t\tif (this.headline) {\n\t\t\tvalidateWcagProp(this.wcagToggleLabel, 'wcag-toggle-label', InfobarClass.root)\n\t\t}\n\t}\n}\n"],"version":3}

package/dist/esm/gov-layout-column.entry.js

@@ -1,20 +1,21 @@
-import { r as registerInstance, h, a as Host, g as getElement } from './index-eb59f132.js';
-import { a as LayoutColumnClass } from './constants-3786b01b.js';
-import { g as govHost } from './template-a0067bb6.js';
+import { r as registerInstance, h, a as Host, g as getElement } from './index-84a63a3e.js';
+import { a as LayoutColumnClass } from './constants-f0f531b6.js';
+import { g as govHost } from './template-94812ab3.js';
 
 const govLayoutColumnCss = ".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}}.gov-layout-column{position:relative;display:block;width:100%}";
+const GovLayoutColumnStyle0 = govLayoutColumnCss;
 
 const GovLayoutColumn = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.h = govHost(this.host);
-  }
-  render() {
-    return (h(Host, { class: this.h.classes(LayoutColumnClass.root) }, h("slot", null)));
-  }
-  get host() { return getElement(this); }
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.h = govHost(this.host);
+    }
+    render() {
+        return (h(Host, { key: '96d7caf7c86867a69524c15f2f18eb5b2862ead2', class: this.h.classes(LayoutColumnClass.root) }, h("slot", { key: 'a220bd7ae663b91ff405f20f4073089505d87527' })));
+    }
+    get host() { return getElement(this); }
 };
-GovLayoutColumn.style = govLayoutColumnCss;
+GovLayoutColumn.style = GovLayoutColumnStyle0;
 
 export { GovLayoutColumn as gov_layout_column };
 

package/dist/esm/gov-layout-column.entry.js.map

@@ -1 +1 @@
-{"file":"gov-layout-column.entry.js","mappings":";;;;AAAA,MAAM,kBAAkB,GAAG,sZAAsZ;;MCSpa,eAAe;EAG3B;;IACC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EAID,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAClD,eAAQ,CACF,EACP;GACD;;;;;;;","names":[],"sources":["../../../packages/core/src/components/gov-layout/gov-layout-column.scss?tag=gov-layout-column","../../../packages/core/src/components/gov-layout/gov-layout-column.tsx"],"sourcesContent":["/*\n *   Layout column\n */\n\n$class: \".gov-layout-column\";\n\n#{$class} {\n\tposition: relative;\n\tdisplay: block;\n\twidth: 100%;\n}\n","import { Component, Element, h, Host } from '@stencil/core'\nimport { LayoutColumnClass } from './constants'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-layout-column',\n\tstyleUrl: 'gov-layout-column.scss',\n})\nexport class GovLayoutColumn {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovLayoutColumnElement\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(LayoutColumnClass.root)}>\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"gov-layout-column.entry.js","mappings":";;;;AAAA,MAAM,kBAAkB,GAAG,sZAAsZ,CAAC;AAClb,8BAAe,kBAAkB;;MCQpB,eAAe;IAG3B;;QACC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAID,MAAM;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAClD,8DAAQ,CACF,EACP;KACD;;;;;;;","names":[],"sources":["../../../packages/core/src/components/gov-layout/gov-layout-column.scss?tag=gov-layout-column","../../../packages/core/src/components/gov-layout/gov-layout-column.tsx"],"sourcesContent":["/*\n *   Layout column\n */\n\n$class: \".gov-layout-column\";\n\n#{$class} {\n\tposition: relative;\n\tdisplay: block;\n\twidth: 100%;\n}\n","import { Component, Element, h, Host } from '@stencil/core'\nimport { LayoutColumnClass } from './constants'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-layout-column',\n\tstyleUrl: 'gov-layout-column.scss',\n})\nexport class GovLayoutColumn {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovLayoutColumnElement\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(LayoutColumnClass.root)}>\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/esm/gov-layout.entry.js

@@ -1,29 +1,30 @@
-import { r as registerInstance, h, a as Host, g as getElement } from './index-eb59f132.js';
-import { L as LayoutClass } from './constants-3786b01b.js';
-import { g as govHost } from './template-a0067bb6.js';
+import { r as registerInstance, h, a as Host, g as getElement } from './index-84a63a3e.js';
+import { L as LayoutClass } from './constants-f0f531b6.js';
+import { g as govHost } from './template-94812ab3.js';
 
 const govLayoutCss = ".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}}.gov-layout{position:relative;display:block;width:100%}.gov-layout__section{display:flex;gap:var(--gov-layout-gap, 1.375rem);flex-direction:column}@media (min-width: 64em){.gov-layout__section{flex-direction:row}.gov-layout__section-aside-right .gov-layout-column:first-child,.gov-layout__section-aside .gov-layout-column:first-child{flex:1 1 auto;width:auto}.gov-layout__section-aside-right .gov-layout-column:last-child,.gov-layout__section-aside .gov-layout-column:last-child{flex:0 0 auto;width:calc(var(--gov-container-width, 73.75rem) / 3 - var(--gov-layout-gap, 1.375rem))}.gov-layout__section-aside-left .gov-layout-column:first-child{flex:0 0 auto;width:calc(var(--gov-container-width, 73.75rem) / 3 - var(--gov-layout-gap, 1.375rem))}.gov-layout__section-aside-left .gov-layout-column:last-child{flex:1 1 auto;width:auto}.gov-layout__section-aside-right-inverse .gov-layout-column:first-child{order:1}.gov-layout__section-aside-left-inverse .gov-layout-column:first-child{order:2}.gov-layout__section-text{width:var(--gov-layout-content-width, 48.75rem);margin-right:auto;margin-left:auto}.gov-layout__section-text-left{width:var(--gov-layout-content-width, 48.75rem);margin-right:auto}.gov-layout__section-text-right{width:var(--gov-layout-content-width, 48.75rem);margin-left:auto}}";
+const GovLayoutStyle0 = govLayoutCss;
 
 const GovLayout = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.type = 'stretch';
-    this.variant = undefined;
-    this.inverse = false;
-    this.h = govHost(this.host);
-  }
-  typeClass(originalClass, type, variant, inverse) {
-    const isType = type ? '-' + type : '';
-    const isVariant = variant ? '-' + variant : '';
-    const isInverse = inverse ? '-inverse' : '';
-    return originalClass + ' ' + originalClass + isType + isVariant + isInverse;
-  }
-  render() {
-    return (h(Host, { type: this.type, class: this.h.classes(LayoutClass.root) }, h("section", { class: this.typeClass(LayoutClass.section, this.type, this.variant, this.inverse) }, h("slot", null))));
-  }
-  get host() { return getElement(this); }
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.type = 'stretch';
+        this.variant = undefined;
+        this.inverse = false;
+        this.h = govHost(this.host);
+    }
+    typeClass(originalClass, type, variant, inverse) {
+        const isType = type ? '-' + type : '';
+        const isVariant = variant ? '-' + variant : '';
+        const isInverse = inverse ? '-inverse' : '';
+        return originalClass + ' ' + originalClass + isType + isVariant + isInverse;
+    }
+    render() {
+        return (h(Host, { key: '40b9ae2ac1e955be12e7265272d960fbda2046e8', type: this.type, class: this.h.classes(LayoutClass.root) }, h("section", { key: '9bc91c3391ecf1b06623874b844427da526b51b8', class: this.typeClass(LayoutClass.section, this.type, this.variant, this.inverse) }, h("slot", { key: '8d7677a617e4e36a05c4820e69ff5e9466c887e2' }))));
+    }
+    get host() { return getElement(this); }
 };
-GovLayout.style = govLayoutCss;
+GovLayout.style = GovLayoutStyle0;
 
 export { GovLayout as gov_layout };