@gov-design-system-ce/components 4.0.8-rc23 → 4.1.0-rc1

package/dist/cjs/gov-cookiebar.cjs.entry.js

@@ -2,32 +2,27 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-f53beed1.js');
-const template = require('./template-431f0737.js');
+const index = require('./index-1af4880c.js');
+const template = require('./template-b070338f.js');
 
-const CookiebarClass = {
+const CookieConsentClass = {
     root: 'gov-cookiebar',
-    holder: 'gov-cookiebar__holder',
     content: 'gov-cookiebar__content',
     actions: 'gov-cookiebar__actions',
-    actionsPrimary: 'gov-cookiebar__actions-primary',
-    actionsSecondary: 'gov-cookiebar__actions-secondary',
+    actionsPrimary: 'gov-cookiebar__actions--primary',
+    actionsSecondary: 'gov-cookiebar__actions--secondary',
 };
 
-const govCookiebarCss = ".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-cookiebar{z-index:51;position:fixed;right:0;bottom:0;left:0;background-color:var(--gov-cookiebar-bg, var(--gov-color-neutral-white));box-shadow:var(--gov-cookiebar-box-shadow, 0 0.0625rem 2.5rem rgba(var(--gov-color-secondary-800-rgb), 0.45))}.gov-cookiebar__holder{display:block;width:100%;max-width:calc(var(--gov-container-width, 73.75rem) + 2 * var(--gov-container-padding, 2.5rem));margin-right:auto;margin-left:auto;padding-right:var(--gov-container-padding-mobile, 1.25rem);padding-left:var(--gov-container-padding-mobile, 1.25rem);padding-top:1.25rem;padding-bottom:1.25rem}@media (min-width: 48em){.gov-cookiebar__holder{padding-right:var(--gov-container-padding, 2.5rem);padding-left:var(--gov-container-padding, 2.5rem)}}.gov-cookiebar__holder>*{margin-bottom:0}.gov-cookiebar__holder>*+*{margin-top:2rem}.gov-cookiebar__content>*{margin-bottom:0}.gov-cookiebar__content>*+*{margin-top:0.75rem}.gov-cookiebar__content p{color:var(--gov-cookiebar-color, var(--gov-color-secondary-700));letter-spacing:0.0125em}.gov-cookiebar__actions,.gov-cookiebar__actions-primary,.gov-cookiebar__actions-secondary{display:flex;gap:0.625rem;flex-wrap:wrap;justify-content:space-between}@media (min-width: 48em){.gov-cookiebar__holder{padding-top:2rem;padding-bottom:2rem}.gov-cookiebar__actions,.gov-cookiebar__actions-primary,.gov-cookiebar__actions-secondary{gap:1rem}}";
-const GovCookiebarStyle0 = govCookiebarCss;
-
 const GovCookiebar = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.h = template.govHost(this.host);
     }
     render() {
-        return (index.h(index.Host, { key: '6a5611e51a1b8f8b28ab26610f996108163d0984', class: this.h.classes(CookiebarClass.root) }, index.h("div", { key: 'b13c933c0148793db30738419206024a3fa3fe6b', class: CookiebarClass.holder }, index.h("div", { key: '72a6c3bfa91d05d5b8bdbda929f2e14e1e6b088b', class: CookiebarClass.content }, index.h("slot", { key: 'd8dfcd756269a79e368eccc1ec8e74fe5ca3d78d' })), (this.h.hasSlot('actions-primary') || this.h.hasSlot('actions-secondary')) && (index.h("div", { key: '709d985f515870a0b2ba420bed0504b10e4084fa', class: CookiebarClass.actions }, this.h.hasSlot('actions-primary') && (index.h("div", { key: 'c8c1f120a3be8bad685722f159b421202e34ecee', class: CookiebarClass.actionsPrimary }, index.h("slot", { key: 'ab75e519298f74599b2dd81983fdd383cc107339', name: "actions-primary" }))), this.h.hasSlot('actions-secondary') && (index.h("div", { key: 'ad0c34b6d8264e04937375be96f8a2fce9d2cdad', class: CookiebarClass.actionsSecondary }, index.h("slot", { key: 'db94b03571c793242fec2e1e47f84ce656b3932f', name: "actions-secondary" }))))))));
+        return (index.h(index.Host, { key: 'ac6045b566122680c12a0cdf5068d81d53f4f4a9', class: this.h.classes(CookieConsentClass.root) }, index.h("div", { key: 'f03a1401b65a6a90430dcad642bbceb8e843143b', class: CookieConsentClass.content }, index.h("slot", { key: 'a373d6a55d299c240cc5aa596090dccb2a071e64', name: "headline" }), index.h("slot", { key: 'c5e9b1c6a1ec0daf9959fae074983fd2d5131320' })), (this.h.hasSlot('actions-primary') || this.h.hasSlot('actions-secondary')) && (index.h("div", { key: '21d6131b451e16abff7270a521b7aa18b8e8c340', class: CookieConsentClass.actions }, this.h.hasSlot('actions-primary') && (index.h("div", { key: '8b3d07e54492d9374f1398b4c48afa9df5bf9052', class: CookieConsentClass.actionsPrimary }, index.h("slot", { key: '15d29f653408e2910c64f11847307ab9e8394951', name: "actions-primary" }))), this.h.hasSlot('actions-secondary') && (index.h("div", { key: 'ef629c9a63af59cb5cf127127c2b04d8524091a1', class: CookieConsentClass.actionsSecondary }, index.h("slot", { key: 'e9b571f11d5b5077d3862376e5588db2e4e37f66', name: "actions-secondary" })))))));
     }
     get host() { return index.getElement(this); }
 };
-GovCookiebar.style = GovCookiebarStyle0;
 
 exports.gov_cookiebar = GovCookiebar;
 

package/dist/cjs/gov-cookiebar.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"gov-cookiebar.entry.cjs.js","mappings":";;;;;;;AAAO,MAAM,cAAc,GAAG;IAC7B,IAAI,EAAE,eAAe;IACrB,MAAM,EAAE,uBAAuB;IAC/B,OAAO,EAAE,wBAAwB;IACjC,OAAO,EAAE,wBAAwB;IACjC,cAAc,EAAE,gCAAgC;IAChD,gBAAgB,EAAE,kCAAkC;CACpD;;ACPD,MAAM,eAAe,GAAG,mrDAAmrD,CAAC;AAC5sD,2BAAe,eAAe;;MCQjB,YAAY;IAGxB;;QACC,IAAI,CAAC,CAAC,GAAGA,gBAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAID,MAAM;QACL,QACCC,QAACC,UAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,IAC/CD,kEAAK,KAAK,EAAE,cAAc,CAAC,MAAM,IAChCA,kEAAK,KAAK,EAAE,cAAc,CAAC,OAAO,IACjCA,oEAAQ,CACH,EAEL,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,mBAAmB,CAAC,MACzEA,kEAAK,KAAK,EAAE,cAAc,CAAC,OAAO,IAChC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,KACjCA,kEAAK,KAAK,EAAE,cAAc,CAAC,cAAc,IACxCA,mEAAM,IAAI,EAAC,iBAAiB,GAAG,CAC1B,CACN,EAEA,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,mBAAmB,CAAC,KACnCA,kEAAK,KAAK,EAAE,cAAc,CAAC,gBAAgB,IAC1CA,mEAAM,IAAI,EAAC,mBAAmB,GAAG,CAC5B,CACN,CACI,CACN,CACI,CACA,EACP;KACD;;;;;;;","names":["govHost","h","Host"],"sources":["../../../packages/core/src/components/gov-cookiebar/constants.tsx","../../../packages/core/src/components/gov-cookiebar/gov-cookiebar.scss?tag=gov-cookiebar","../../../packages/core/src/components/gov-cookiebar/gov-cookiebar.tsx"],"sourcesContent":["export const CookiebarClass = {\n\troot: 'gov-cookiebar',\n\tholder: 'gov-cookiebar__holder',\n\tcontent: 'gov-cookiebar__content',\n\tactions: 'gov-cookiebar__actions',\n\tactionsPrimary: 'gov-cookiebar__actions-primary',\n\tactionsSecondary: 'gov-cookiebar__actions-secondary',\n}\n","/*\n *   Cookiebar\n */\n\n$class: \".gov-cookiebar\";\n\n#{$class} {\n\t@include z-index(\"bar\", 1);\n\tposition: fixed;\n\tright: 0;\n\tbottom: 0;\n\tleft: 0;\n\tbackground-color: $cookiebar-bg;\n\tbox-shadow: $cookiebar-box-shadow;\n\t&__holder {\n\t\t@include container();\n\t\t@include space(32);\n\t\tpadding-top: rem-calc(20);\n\t\tpadding-bottom: rem-calc(20);\n\t}\n\t&__content {\n\t\t@include space(12);\n\t\tp {\n\t\t\tcolor: $cookiebar-color;\n\t\t\tletter-spacing: em-calc(0.2);\n\t\t}\n\t}\n\t&__actions {\n\t\t&,\n\t\t&-primary,\n\t\t&-secondary {\n\t\t\tdisplay: flex;\n\t\t\tgap: rem-calc(10);\n\t\t\tflex-wrap: wrap;\n\t\t\tjustify-content: space-between;\n\t\t}\n\t}\n\n\t// MQ\n\t@include mq($from: md) {\n\t\t&__holder {\n\t\t\tpadding-top: rem-calc(32);\n\t\t\tpadding-bottom: rem-calc(32);\n\t\t}\n\t\t&__actions {\n\t\t\t&,\n\t\t\t&-primary,\n\t\t\t&-secondary {\n\t\t\t\tgap: rem-calc(16);\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Element, h, Host } from '@stencil/core'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\nimport { CookiebarClass } from './constants'\n\n@Component({\n\ttag: 'gov-cookiebar',\n\tstyleUrl: 'gov-cookiebar.scss',\n})\nexport class GovCookiebar {\n\th: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovCookiebarElement\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(CookiebarClass.root)}>\n\t\t\t\t<div class={CookiebarClass.holder}>\n\t\t\t\t\t<div class={CookiebarClass.content}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{(this.h.hasSlot('actions-primary') || this.h.hasSlot('actions-secondary')) && (\n\t\t\t\t\t\t<div class={CookiebarClass.actions}>\n\t\t\t\t\t\t\t{this.h.hasSlot('actions-primary') && (\n\t\t\t\t\t\t\t\t<div class={CookiebarClass.actionsPrimary}>\n\t\t\t\t\t\t\t\t\t<slot name=\"actions-primary\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t{this.h.hasSlot('actions-secondary') && (\n\t\t\t\t\t\t\t\t<div class={CookiebarClass.actionsSecondary}>\n\t\t\t\t\t\t\t\t\t<slot name=\"actions-secondary\" />\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"gov-cookiebar.entry.cjs.js","mappings":";;;;;;;AAAO,MAAM,kBAAkB,GAAG;IACjC,IAAI,EAAE,eAAe;IACrB,OAAO,EAAE,wBAAwB;IACjC,OAAO,EAAE,wBAAwB;IACjC,cAAc,EAAE,iCAAiC;IACjD,gBAAgB,EAAE,mCAAmC;CACrD;;MCEY,YAAY;IAGxB;;QACC,IAAI,CAAC,CAAC,GAAGA,gBAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAID,MAAM;QACL,QACCC,QAACC,UAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,kBAAkB,CAAC,IAAI,CAAC,IACnDD,kEAAK,KAAK,EAAE,kBAAkB,CAAC,OAAO,IACrCA,mEAAM,IAAI,EAAC,UAAU,GAAG,EACxBA,oEAAQ,CACH,EAEL,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,mBAAmB,CAAC,MACzEA,kEAAK,KAAK,EAAE,kBAAkB,CAAC,OAAO,IACpC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,KACjCA,kEAAK,KAAK,EAAE,kBAAkB,CAAC,cAAc,IAC5CA,mEAAM,IAAI,EAAC,iBAAiB,GAAG,CAC1B,CACN,EAEA,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,mBAAmB,CAAC,KACnCA,kEAAK,KAAK,EAAE,kBAAkB,CAAC,gBAAgB,IAC9CA,mEAAM,IAAI,EAAC,mBAAmB,GAAG,CAC5B,CACN,CACI,CACN,CACK,EACP;KACD;;;;;;","names":["govHost","h","Host"],"sources":["../../../packages/core/src/components/gov-cookiebar/constants.tsx","../../../packages/core/src/components/gov-cookiebar/gov-cookiebar.tsx"],"sourcesContent":["export const CookieConsentClass = {\n\troot: 'gov-cookiebar',\n\tcontent: 'gov-cookiebar__content',\n\tactions: 'gov-cookiebar__actions',\n\tactionsPrimary: 'gov-cookiebar__actions--primary',\n\tactionsSecondary: 'gov-cookiebar__actions--secondary',\n}\n","import { Component, Element, h, Host } from '@stencil/core'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\nimport { CookieConsentClass } from './constants'\n\n@Component({\n\ttag: 'gov-cookiebar',\n})\nexport class GovCookiebar {\n\th: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovCookiebarElement\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(CookieConsentClass.root)}>\n\t\t\t\t<div class={CookieConsentClass.content}>\n\t\t\t\t\t<slot name=\"headline\" />\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\n\t\t\t\t{(this.h.hasSlot('actions-primary') || this.h.hasSlot('actions-secondary')) && (\n\t\t\t\t\t<div class={CookieConsentClass.actions}>\n\t\t\t\t\t\t{this.h.hasSlot('actions-primary') && (\n\t\t\t\t\t\t\t<div class={CookieConsentClass.actionsPrimary}>\n\t\t\t\t\t\t\t\t<slot name=\"actions-primary\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{this.h.hasSlot('actions-secondary') && (\n\t\t\t\t\t\t\t<div class={CookieConsentClass.actionsSecondary}>\n\t\t\t\t\t\t\t\t<slot name=\"actions-secondary\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/cjs/gov-dialog.cjs.entry.js

@@ -0,0 +1,108 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-1af4880c.js');
+const template = require('./template-b070338f.js');
+const win = require('./win-587f4614.js');
+const wcag = require('./wcag-31089f70.js');
+const string_utils = require('./string.utils-2335838f.js');
+const stencil_utils = require('./stencil.utils-182382ee.js');
+require('./utils-d263c5c6.js');
+require('./gov.log-1e8bab6e.js');
+require('./helpers.types-ff60c9bd.js');
+
+const DialogClass = {
+    root: 'gov-dialog',
+    dialog: 'gov-dialog__dialog',
+    inner: 'gov-dialog__inner',
+    header: 'gov-dialog__header',
+    title: 'gov-dialog__title',
+    content: 'gov-dialog__content',
+    close: 'gov-dialog__close',
+    footer: 'gov-dialog__footer',
+    bodyFix: 'body-fixed',
+};
+
+const GovDialog = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.govClose = index.createEvent(this, "gov-close", 7);
+        this.hydrated = false;
+        this.open = false;
+        this.blockClose = false;
+        this.blockBackdropClose = false;
+        this.role = 'dialog';
+        this.labelTag = 'h2';
+        this.accessibleLabelledBy = undefined;
+        this.accessibleDescribedBy = undefined;
+        this.accessibleCloseLabel = 'Zavřít okno';
+        this.accessibleCloseLabelledBy = undefined;
+        this.h = template.govHost(this.host);
+        this.labelId = string_utils.createID('GovDialogLabel');
+        this.contentId = string_utils.createID('GovDialogContent');
+    }
+    watchOpen(newValue) {
+        this.open = newValue;
+        this.setFocus().finally();
+    }
+    showDialog() {
+        this.open = true;
+        document.body.classList.add(DialogClass.bodyFix);
+    }
+    hideDialog() {
+        this.open = false;
+        document.body.classList.remove(DialogClass.bodyFix);
+    }
+    async componentDidRender() {
+        if (win.canValidateWcagOnRender()) {
+            stencil_utils.tick(() => this.validateAccessibility());
+        }
+        if (this.open) {
+            this.showDialog();
+        }
+        else {
+            this.hideDialog();
+        }
+    }
+    connectedCallback() {
+        this.hydrated = true;
+    }
+    disconnectedCallback() {
+        document.body.classList.remove(DialogClass.bodyFix);
+    }
+    render() {
+        return (index.h(index.Host, { key: 'c9c05262cbe6a644f4e89fea848dccc9dea0fe21', class: this.h.classes(DialogClass.root), open: this.open, hydrated: this.hydrated }, index.h("dialog", { key: 'fc6a9ca72044ef912c324cb037e954e7ae8b7caf', class: DialogClass.dialog, hidden: !this.open, tabindex: template.boolToFocusValue(this.open), open: this.open, "aria-modal": "true", "aria-hidden": template.toBoolAttr(!this.open), "aria-labelledby": this.accessibleLabelledBy || this.labelId, "aria-describedby": this.accessibleDescribedBy || this.contentId, role: this.role }, index.h("div", { key: '228a0abc31b73533418dcce1224dd9b42fd1e6cc', class: DialogClass.inner }, index.h("div", { key: '1e9b3d475ff385b25c46540ddfd2217cba174b3a', class: DialogClass.header }, index.h("slot", { key: 'e300fed969e9156d856f9f0b1b8caf6e5dc2d6af', name: "icon" }), this.h.hasSlot('title') && (index.h("span", { key: 'e156b2daa9c47ca45a5cc8437850d1b7ae9b4dfe', class: DialogClass.title, id: this.labelId }, index.h("slot", { key: 'afcf49f1829ded6b4d2ad99b0ee4256d3d5ed85c', name: "title" }))), index.h("gov-button", { key: '1b07b5ba700ae96704bf16ba620e88cf8a87b4b0', ref: el => (this.closeCtaRef = el), disabled: this.blockClose, class: DialogClass.close, color: "primary", "accessible-label": this.accessibleCloseLabel, "accessible-labelledby": this.accessibleCloseLabelledBy, type: "base", "on-gov-click": this.onCloseHandler.bind(this) }, index.h("gov-icon", { key: 'cf7ee3fa0123ddd188d82640f3964d35b47ae9c7', slot: "left-icon", name: "x-lg" }))), index.h("div", { key: '1487b7df9acf942fa351fb236d29e0208416387a', class: DialogClass.content, id: this.contentId }, index.h("slot", { key: '8b811c1cab346ae2a482e5297b53f5ffaeb9e92a' })), this.h.hasSlot('footer') && (index.h("div", { key: 'e958768f856cec2de8a2e6c1fe1aab0c4694f0cd', class: DialogClass.footer }, index.h("slot", { key: 'bc9da8073722bb9c94a7ec295cc354b46ee09685', name: "footer" }))))), this.open ? (index.h("gov-backdrop", { disabled: this.blockBackdropClose, "accessible-label": this.accessibleCloseLabel, "accessible-labelled-by": this.accessibleCloseLabelledBy, "on-gov-click": this.onCloseHandler.bind(this) })) : null));
+    }
+    onCloseHandler(e) {
+        e.stopPropagation();
+        e.preventDefault();
+        if (this.blockClose === false) {
+            this.hideDialog();
+            this.govClose.emit(e);
+        }
+    }
+    /**
+     * Sets the close button to focus
+     */
+    async setFocus() {
+        if (this.open && this.closeCtaRef) {
+            this.closeCtaRef.setFocus().catch();
+        }
+    }
+    /**
+     * Validate the WCAG attributes of the component
+     */
+    async validateAccessibility() {
+        wcag.validateWcagRef(this.accessibleLabelledBy, 'accessible-labelled-by', DialogClass.root);
+        wcag.validateWcagRef(this.accessibleDescribedBy, 'accessible-described-by', DialogClass.root);
+    }
+    get host() { return index.getElement(this); }
+    static get watchers() { return {
+        "open": ["watchOpen"]
+    }; }
+};
+
+exports.gov_dialog = GovDialog;
+
+//# sourceMappingURL=gov-dialog.cjs.entry.js.map

package/dist/cjs/gov-dialog.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"gov-dialog.entry.cjs.js","mappings":"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","names":["govHost","createID","canValidateWcagOnRender","tick","h","Host","boolToFocusValue","toBoolAttr","validateWcagRef"],"sources":["../../../packages/core/src/components/gov-dialog/constants.ts","../../../packages/core/src/components/gov-dialog/gov-dialog.tsx"],"sourcesContent":["export const DialogClass = {\n\troot: 'gov-dialog',\n\tdialog: 'gov-dialog__dialog',\n\tinner: 'gov-dialog__inner',\n\theader: 'gov-dialog__header',\n\ttitle: 'gov-dialog__title',\n\tcontent: 'gov-dialog__content',\n\tclose: 'gov-dialog__close',\n\tfooter: 'gov-dialog__footer',\n\tbodyFix: 'body-fixed',\n}\n","import {Component, Element, Event, EventEmitter, h, Host, Method, Prop, Watch} from '@stencil/core'\nimport {boolToFocusValue, govHost, toBoolAttr} from '../../helpers/Dom/template'\nimport {GovHost} from '../../helpers/Dom/template.types'\nimport {canValidateWcagOnRender} from '../../helpers/Dom/win'\nimport {validateWcagRef} from '../../helpers/Validate/wcag'\nimport {Nullable} from '../../types/interfaces'\nimport {createID} from '../../utils/string.utils'\nimport {DialogClass} from './constants'\nimport {tick} from \"../../utils/stencil.utils\";\n\n@Component({\n\ttag: 'gov-dialog',\n})\nexport class GovDialog {\n\tprivate h: GovHost\n\tprivate readonly labelId: string\n\tprivate readonly contentId: string\n\tprivate hydrated = false;\n\tprivate closeCtaRef?: HTMLGovButtonElement\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t\tthis.labelId = createID('GovDialogLabel')\n\t\tthis.contentId = createID('GovDialogContent')\n\t}\n\n\t@Element() host: HTMLGovDialogElement\n\n\t/**\n\t * Attribute for dialog window display\n\t */\n\t@Prop({mutable: true, reflect: true}) open = false\n\t/**\n\t * Attribute allowing blocking the dialog closing\n\t */\n\t@Prop({attribute: 'block-close'}) blockClose = false\n\t/**\n\t * Attribute allowing blocking the backdrop dialog closing\n\t */\n\t@Prop({attribute: 'block-backdrop-close'}) blockBackdropClose = false\n\t/**\n\t * Role of dialog\n\t */\n\t@Prop({attribute: 'role'}) role: Nullable<string> = 'dialog'\n\t/**\n\t * Used to change the HTML tag in the dialog label for correct semantic structure\n\t */\n\t@Prop({attribute: 'label-tag'}) readonly labelTag: string = 'h2'\n\t/**\n\t * String of id's that indicate alternative labels elements\n\t */\n\t@Prop({attribute: 'accessible-labelled-by'}) accessibleLabelledBy: string\n\t/**\n\t * Indicates the id of a component that describes the dialog.\n\t */\n\t@Prop({attribute: 'accessible-described-by'}) accessibleDescribedBy: string\n\t/**\n\t * Adds accessible label for the dialog close button that is only shown for screen readers.\n\t */\n\t@Prop({attribute: 'accessible-close-label'}) readonly accessibleCloseLabel: string = 'Zavřít okno'\n\t/**\n\t * A string of identifiers that indicate alternative label elements for closing the dialog window\n\t */\n\t@Prop({attribute: 'accessible-close-labelled-by'}) accessibleCloseLabelledBy: string\n\t/**\n\t * Emitted when dialog window closes.\n\t */\n\t@Event({eventName: 'gov-close'}) govClose: EventEmitter<PointerEvent>\n\n\t@Watch('open')\n\twatchOpen(newValue: boolean): void {\n\t\tthis.open = newValue\n\t\tthis.setFocus().finally()\n\t}\n\n\tprivate showDialog() {\n\t\tthis.open = true\n\t\tdocument.body.classList.add(DialogClass.bodyFix)\n\t}\n\n\tprivate hideDialog() {\n\t\tthis.open = false\n\t\tdocument.body.classList.remove(DialogClass.bodyFix)\n\t}\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\ttick(() => this.validateAccessibility())\n\t\t}\n\n\t\tif (this.open) {\n\t\t\tthis.showDialog()\n\t\t} else {\n\t\t\tthis.hideDialog()\n\t\t}\n\t}\n\n\tconnectedCallback() {\n\t\tthis.hydrated = true\n\t}\n\n\tdisconnectedCallback(): void {\n\t\tdocument.body.classList.remove(DialogClass.bodyFix)\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(DialogClass.root)} open={this.open} hydrated={this.hydrated}>\n\t\t\t\t<dialog\n\t\t\t\t\tclass={DialogClass.dialog}\n\t\t\t\t\thidden={!this.open}\n\t\t\t\t\ttabindex={boolToFocusValue(this.open)}\n\t\t\t\t\topen={this.open}\n\t\t\t\t\taria-modal=\"true\"\n\t\t\t\t\taria-hidden={toBoolAttr(!this.open)}\n\t\t\t\t\taria-labelledby={this.accessibleLabelledBy || this.labelId}\n\t\t\t\t\taria-describedby={this.accessibleDescribedBy || this.contentId}\n\t\t\t\t\trole={this.role}\n\t\t\t\t>\n\t\t\t\t\t<div class={DialogClass.inner}>\n\t\t\t\t\t\t<div class={DialogClass.header}>\n\t\t\t\t\t\t\t<slot name=\"icon\"/>\n\t\t\t\t\t\t\t{this.h.hasSlot('title') && (\n\t\t\t\t\t\t\t\t<span class={DialogClass.title} id={this.labelId}>\n\t\t\t\t\t\t\t\t\t<slot name=\"title\"/>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<gov-button\n\t\t\t\t\t\t\t\tref={el => (this.closeCtaRef = el)}\n\t\t\t\t\t\t\t\tdisabled={this.blockClose}\n\t\t\t\t\t\t\t\tclass={DialogClass.close}\n\t\t\t\t\t\t\t\tcolor=\"primary\"\n\t\t\t\t\t\t\t\taccessible-label={this.accessibleCloseLabel}\n\t\t\t\t\t\t\t\taccessible-labelledby={this.accessibleCloseLabelledBy}\n\t\t\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\t\t\ton-gov-click={this.onCloseHandler.bind(this)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"/>\n\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class={DialogClass.content} id={this.contentId}>\n\t\t\t\t\t\t\t<slot/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{this.h.hasSlot('footer') && (\n\t\t\t\t\t\t\t<div class={DialogClass.footer}>\n\t\t\t\t\t\t\t\t<slot name=\"footer\"/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</dialog>\n\n\t\t\t\t{this.open ? (\n\t\t\t\t\t<gov-backdrop\n\t\t\t\t\t\tdisabled={this.blockBackdropClose}\n\t\t\t\t\t\taccessible-label={this.accessibleCloseLabel}\n\t\t\t\t\t\taccessible-labelled-by={this.accessibleCloseLabelledBy}\n\t\t\t\t\t\ton-gov-click={this.onCloseHandler.bind(this)}\n\t\t\t\t\t/>\n\t\t\t\t) : null}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onCloseHandler(e: PointerEvent) {\n\t\te.stopPropagation()\n\t\te.preventDefault()\n\t\tif (this.blockClose === false) {\n\t\t\tthis.hideDialog()\n\t\t\tthis.govClose.emit(e)\n\t\t}\n\t}\n\n\t/**\n\t * Sets the close button to focus\n\t */\n\t@Method()\n\tasync setFocus(): Promise<void> {\n\t\tif (this.open && this.closeCtaRef) {\n\t\t\tthis.closeCtaRef.setFocus().catch()\n\t\t}\n\t}\n\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateAccessibility(): Promise<void> {\n\t\tvalidateWcagRef(this.accessibleLabelledBy, 'accessible-labelled-by', DialogClass.root)\n\t\tvalidateWcagRef(this.accessibleDescribedBy, 'accessible-described-by', DialogClass.root)\n\t}\n}\n"],"version":3}

package/dist/cjs/gov-dropdown.cjs.entry.js

@@ -2,12 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-f53beed1.js');
-const template = require('./template-431f0737.js');
-const string_utils = require('./string.utils-b84c81cf.js');
-const constants = require('./constants-4fefc173.js');
+const index = require('./index-1af4880c.js');
+const template = require('./template-b070338f.js');
+const string_utils = require('./string.utils-2335838f.js');
+const constants = require('./constants-861428a4.js');
 require('./sizes-89f8d3b2.js');
-require('./variants-85b514ea.js');
+require('./colors-976f6dff.js');
 require('./utils-d263c5c6.js');
 
 const ClickOutsideOptionsDefaults = {
@@ -76,9 +76,6 @@ const DropdownClass = {
     list: 'gov-dropdown__list'
 };
 
-const govDropdownCss = ".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-dropdown{position:relative}.gov-dropdown__list{position:absolute;left:0;z-index:100}.gov-dropdown ul{padding:0.25rem;border-radius:var(--gov-border-radius, 0.1875rem);background-color:var(--gov-dropdown-bg-color, var(--gov-color-neutral-white));box-shadow:var(--gov-dropdown-box-shadow, 0 0.25rem 1.25rem rgba(0, 0, 0, 0.1))}.gov-dropdown li{margin:0;white-space:nowrap}.gov-dropdown li::before{content:none}.gov-dropdown li>*{width:100%}.gov-dropdown li>* .element{justify-content:space-between;width:100%}.gov-dropdown[position=right] .gov-dropdown__list{right:0;left:initial}";
-const GovDropdownStyle0 = govDropdownCss;
-
 const GovDropdown = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
@@ -90,23 +87,9 @@ const GovDropdown = class {
         this.listId = string_utils.createID("GovDropdownList");
         this.controlId = string_utils.createID("GovDropdownControl");
     }
-    componentWillLoad() {
+    watchOpen() {
         var _a;
-        if (this.trigger) {
-            this.trigger.setAttribute("wcag-controls", this.listId);
-            this.trigger.setAttribute("wcag-has-popup", template.toBoolAttr(!!this.list));
-            this.trigger.setAttribute("identifier", (_a = this.identifier) !== null && _a !== void 0 ? _a : this.controlId);
-            this.trigger.addEventListener("gov-click", (e) => {
-                e.preventDefault();
-                e.stopPropagation();
-                this.open = !this.open;
-                this.govChange.emit({
-                    component: DropdownClass.root,
-                    originalEvent: e,
-                    open: this.open,
-                });
-            });
-        }
+        (_a = this.trigger) === null || _a === void 0 ? void 0 : _a.setAttribute("aria-expanded", template.toBoolAttr(this.open));
     }
     get trigger() {
         return this.host.querySelector(`* > ${constants.ButtonClass.root}`);
@@ -114,8 +97,27 @@ const GovDropdown = class {
     get list() {
         return this.h.getSlot("list");
     }
+    componentWillLoad() {
+        var _a;
+        if (!this.trigger)
+            return;
+        this.trigger.setAttribute("aria-controls", this.listId);
+        this.trigger.setAttribute("aria-haspopup", template.toBoolAttr(!!this.list));
+        this.trigger.setAttribute("aria-expanded", template.toBoolAttr(this.open));
+        this.trigger.setAttribute("identifier", (_a = this.identifier) !== null && _a !== void 0 ? _a : this.controlId);
+        this.trigger.addEventListener("gov-click", (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+            this.open = !this.open;
+            this.govChange.emit({
+                component: DropdownClass.root,
+                originalEvent: e,
+                open: this.open,
+            });
+        });
+    }
     render() {
-        return (index.h(index.Host, { key: '61aca1f1967a8b220344954830cabaf3263d88e9', class: this.h.classes([DropdownClass.root]), open: this.open, position: this.position }, index.h("slot", { key: '64f688d56b671a89d1f0647bd7c3cfbdf246a499' }), index.h("div", { key: 'bb8042e8a01d09b021342d007974f4f89555450a', ref: el => registerClickOutside(this, el, () => this.open = false), class: DropdownClass.list, id: this.listId, "aria-labelledby": this.controlId, "aria-hidden": template.toBoolAttr(!this.open), hidden: !this.open }, index.h("slot", { key: '99d026e3f578cc7fa8ddfcf425f63b6765b99a7e', name: "list" }))));
+        return (index.h(index.Host, { key: 'ee6eaf511c26f189e161ac9d13c26e8dbc5a3ac7', class: this.h.classes([DropdownClass.root]), open: this.open, position: this.position }, index.h("slot", { key: '964f39a16b89cebb8fdaab7025ff63a0298f1a8c' }), index.h("div", { key: '344a7f2b55a7e4fa9ee92777276e65057bcf025d', ref: el => registerClickOutside(this, el, () => this.open = false), class: DropdownClass.list, id: this.listId, "aria-labelledby": this.controlId, "aria-hidden": template.toBoolAttr(!this.open), hidden: !this.open }, index.h("slot", { key: '54ee18b9f2ec257708d21fe7fa1c3b2ff1827824', name: "list" }))));
     }
     /**
      * Returns the current state of the dropdown
@@ -124,14 +126,16 @@ const GovDropdown = class {
         return this.open;
     }
     /**
-     * Sets the dropdown state
+     * Toggle state of dropdown
      */
-    async setOpen(state) {
-        this.open = state;
+    async toggle() {
+        this.open = !this.open;
     }
     get host() { return index.getElement(this); }
+    static get watchers() { return {
+        "open": ["watchOpen"]
+    }; }
 };
-GovDropdown.style = GovDropdownStyle0;
 
 exports.gov_dropdown = GovDropdown;
 

package/dist/cjs/gov-dropdown.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"gov-dropdown.entry.cjs.js","mappings":"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","names":["govHost","createID","toBoolAttr","ButtonClass","h","Host"],"sources":["../../../node_modules/stencil-click-outside/dist/esm/index.js","../../../packages/core/src/components/gov-button/dropdown/constants.ts","../../../packages/core/src/components/gov-button/dropdown/gov-dropdown.scss?tag=gov-dropdown","../../../packages/core/src/components/gov-button/dropdown/gov-dropdown.tsx"],"sourcesContent":["import { Build as BUILD, getElement } from '@stencil/core';\nconst ClickOutsideOptionsDefaults = {\n    triggerEvents: \"click\",\n    exclude: \"\"\n};\n/**\n * Call this function as soon as the click outside of annotated method's host is done.\n * @example\n```\n@ClickOutside()\ncallback() {\n  // this will run when click outside of element (host component) is done.\n}\n```\n */\nexport function ClickOutside(opt = ClickOutsideOptionsDefaults) {\n    return (proto, methodName) => {\n        // this is to resolve the 'compiler optimization issue':\n        // lifecycle events not being called when not explicitly declared in at least one of components from bundle\n        BUILD.connectedCallback = true;\n        BUILD.disconnectedCallback = true;\n        const { connectedCallback, disconnectedCallback } = proto;\n        proto.connectedCallback = function () {\n            const host = getElement(this);\n            const method = this[methodName];\n            registerClickOutside(this, host, method, opt);\n            return connectedCallback && connectedCallback.call(this);\n        };\n        proto.disconnectedCallback = function () {\n            const host = getElement(this);\n            const method = this[methodName];\n            removeClickOutside(this, host, method, opt);\n            return disconnectedCallback && disconnectedCallback.call(this);\n        };\n    };\n}\n/**\n * Register callback function for HTMLElement to be executed when user clicks outside of element.\n * @example\n```\n<span\n    ref={spanEl => registerClickOutside(this, spanEl, () => this.test())}>\n      Hello, World!\n</span>;\n```\n */\nexport function registerClickOutside(component, element, callback, opt = ClickOutsideOptionsDefaults) {\n    const excludedNodes = getExcludedNodes(opt);\n    getTriggerEvents(opt).forEach(triggerEvent => {\n        window.addEventListener(triggerEvent, (e) => {\n            initClickOutside(e, component, element, callback, excludedNodes);\n        }, false);\n    });\n}\n/**\n * Remove click outside callback function for HTMLElement.\n */\nexport function removeClickOutside(component, element, callback, opt = ClickOutsideOptionsDefaults) {\n    getTriggerEvents(opt).forEach(triggerEvent => {\n        window.removeEventListener(triggerEvent, (e) => {\n            initClickOutside(e, component, element, callback);\n        }, false);\n    });\n}\nfunction initClickOutside(event, component, element, callback, excludedNodes) {\n    const target = event.target;\n    if (!element.contains(target) && !isExcluded(target, excludedNodes)) {\n        callback.call(component);\n    }\n}\nfunction getTriggerEvents(opt) {\n    if (opt.triggerEvents) {\n        return opt.triggerEvents.split(\",\").map(e => e.trim());\n    }\n    return [\"click\"];\n}\nfunction getExcludedNodes(opt) {\n    if (opt.exclude) {\n        try {\n            return Array.from(document.querySelectorAll(opt.exclude));\n        }\n        catch (err) {\n            console.warn(`@ClickOutside: Exclude: '${opt.exclude}' will not be evaluated. Check your exclude selector syntax.`, err);\n        }\n    }\n    return;\n}\nfunction isExcluded(target, excudedNodes) {\n    if (target && excudedNodes) {\n        for (let excludedNode of excudedNodes) {\n            if (excludedNode.contains(target)) {\n                return true;\n            }\n        }\n    }\n    return false;\n}\n","import { ValueOf } from \"../../../types/interfaces\"\n\nexport enum Position {\n\tLEFT = 'left',\n\tRIGHT = 'right',\n}\n\nexport type PositionType = `${ValueOf<typeof Position>}`\n\nexport const DropdownClass = {\n\troot: 'gov-dropdown',\n\tlist: 'gov-dropdown__list'\n}\n","/*\n *   Dropdown\n */\n\n$class: \".gov-dropdown\";\n\n#{$class} {\n\tposition: relative;\n\n\t&__list {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tz-index: 100;\n\t}\n\tul {\n\t\tpadding: rem-calc(4);\n\t\tborder-radius: $border-radius;\n\t\tbackground-color: $dropdown-bg-color;\n\t\tbox-shadow: $dropdown-box-shadow;\n\t}\n\tli {\n\t\tmargin: 0;\n\t\twhite-space: nowrap;\n\t\t&::before {\n\t\t\tcontent: none;\n\t\t}\n\t\t> * {\n\t\t\twidth: 100%;\n\t\t}\n\t\t> * .element {\n\t\t\tjustify-content: space-between;\n\t\t\twidth: 100%;\n\t\t}\n\t}\n\t&[position=\"right\"] {\n\t\t#{$class}__list {\n\t\t\tright: 0;\n\t\t\tleft: initial;\n\t\t}\n\t}\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from \"@stencil/core\"\nimport { registerClickOutside } from \"stencil-click-outside\"\n\nimport { govHost, toBoolAttr } from \"../../../helpers/Dom/template\"\nimport { GovHost } from \"../../../helpers/Dom/template.types\"\nimport { Nullable } from \"../../../types/interfaces\"\nimport { createID } from \"../../../utils/string.utils\"\nimport { ButtonClass } from \"../button/constants\"\nimport { DropdownClass, Position, PositionType } from \"./constants\"\nimport { DropdownEvent } from \"./gov-dropdown.types\"\n\n@Component({\n\ttag: \"gov-dropdown\",\n\tstyleUrl: \"gov-dropdown.scss\",\n})\nexport class GovDropdown {\n\tprivate h: GovHost\n\tprivate readonly listId: string\n\tprivate readonly controlId: string\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t\tthis.listId = createID(\"GovDropdownList\")\n\t\tthis.controlId = createID(\"GovDropdownControl\")\n\t}\n\n\t@Element() host: HTMLGovButtonElement\n\n\t/**\n\t * Custom trigger identifier\n\t */\n\t@Prop({attribute: \"identifier\"}) readonly identifier: string\n\t/**\n\t * Dropdown open state\n\t */\n\t@Prop({mutable: true}) open = false\n\t/**\n\t * Menu display position\n\t */\n\t@Prop() readonly position: PositionType = Position.LEFT\n\t/**\n\t * Emitted when the dropdown change state\n\t */\n\t@Event({ eventName: \"gov-change\" }) govChange: EventEmitter<DropdownEvent>\n\n\tcomponentWillLoad() {\n\t\tif (this.trigger) {\n\t\t\tthis.trigger.setAttribute(\"wcag-controls\", this.listId)\n\t\t\tthis.trigger.setAttribute(\"wcag-has-popup\", toBoolAttr(!!this.list))\n\t\t\tthis.trigger.setAttribute(\"identifier\", this.identifier ?? this.controlId)\n\n\t\t\tthis.trigger.addEventListener(\"gov-click\", (e) => {\n\t\t\t\te.preventDefault()\n\t\t\t\te.stopPropagation()\n\t\t\t\tthis.open = !this.open\n\n\t\t\t\tthis.govChange.emit({\n\t\t\t\t\tcomponent: DropdownClass.root,\n\t\t\t\t\toriginalEvent: e,\n\t\t\t\t\topen: this.open,\n\t\t\t\t})\n\t\t\t})\n\t\t}\n\t}\n\n\tget trigger() {\n\t\treturn this.host.querySelector(`* > ${ButtonClass.root}`) as HTMLGovButtonElement\n\t}\n\n\tget list() {\n\t\treturn this.h.getSlot(\"list\") as Nullable<HTMLUListElement>\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes([DropdownClass.root])} open={this.open} position={this.position}>\n\t\t\t\t<slot></slot>\n\t\t\t\t<div\n\t\t\t\t\tref={el => registerClickOutside(this, el, () => this.open = false)}\n\t\t\t\t\tclass={DropdownClass.list}\n\t\t\t\t\tid={this.listId}\n\t\t\t\t\taria-labelledby={this.controlId}\n\t\t\t\t\taria-hidden={toBoolAttr(!this.open)}\n\t\t\t\t\thidden={!this.open}>\n\t\t\t\t\t<slot name=\"list\"></slot>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Returns the current state of the dropdown\n\t */\n\t@Method()\n\tasync getState() {\n\t\treturn this.open\n\t}\n\n\t/**\n\t * Sets the dropdown state\n\t */\n\t@Method()\n\tasync setOpen(state: boolean) {\n\t\tthis.open = state\n\t}\n}\n"],"version":3}
+{"file":"gov-dropdown.entry.cjs.js","mappings":"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","names":["govHost","createID","toBoolAttr","ButtonClass","h","Host"],"sources":["../../../node_modules/stencil-click-outside/dist/esm/index.js","../../../packages/core/src/components/gov-button/dropdown/constants.ts","../../../packages/core/src/components/gov-button/dropdown/gov-dropdown.tsx"],"sourcesContent":["import { Build as BUILD, getElement } from '@stencil/core';\nconst ClickOutsideOptionsDefaults = {\n    triggerEvents: \"click\",\n    exclude: \"\"\n};\n/**\n * Call this function as soon as the click outside of annotated method's host is done.\n * @example\n```\n@ClickOutside()\ncallback() {\n  // this will run when click outside of element (host component) is done.\n}\n```\n */\nexport function ClickOutside(opt = ClickOutsideOptionsDefaults) {\n    return (proto, methodName) => {\n        // this is to resolve the 'compiler optimization issue':\n        // lifecycle events not being called when not explicitly declared in at least one of components from bundle\n        BUILD.connectedCallback = true;\n        BUILD.disconnectedCallback = true;\n        const { connectedCallback, disconnectedCallback } = proto;\n        proto.connectedCallback = function () {\n            const host = getElement(this);\n            const method = this[methodName];\n            registerClickOutside(this, host, method, opt);\n            return connectedCallback && connectedCallback.call(this);\n        };\n        proto.disconnectedCallback = function () {\n            const host = getElement(this);\n            const method = this[methodName];\n            removeClickOutside(this, host, method, opt);\n            return disconnectedCallback && disconnectedCallback.call(this);\n        };\n    };\n}\n/**\n * Register callback function for HTMLElement to be executed when user clicks outside of element.\n * @example\n```\n<span\n    ref={spanEl => registerClickOutside(this, spanEl, () => this.test())}>\n      Hello, World!\n</span>;\n```\n */\nexport function registerClickOutside(component, element, callback, opt = ClickOutsideOptionsDefaults) {\n    const excludedNodes = getExcludedNodes(opt);\n    getTriggerEvents(opt).forEach(triggerEvent => {\n        window.addEventListener(triggerEvent, (e) => {\n            initClickOutside(e, component, element, callback, excludedNodes);\n        }, false);\n    });\n}\n/**\n * Remove click outside callback function for HTMLElement.\n */\nexport function removeClickOutside(component, element, callback, opt = ClickOutsideOptionsDefaults) {\n    getTriggerEvents(opt).forEach(triggerEvent => {\n        window.removeEventListener(triggerEvent, (e) => {\n            initClickOutside(e, component, element, callback);\n        }, false);\n    });\n}\nfunction initClickOutside(event, component, element, callback, excludedNodes) {\n    const target = event.target;\n    if (!element.contains(target) && !isExcluded(target, excludedNodes)) {\n        callback.call(component);\n    }\n}\nfunction getTriggerEvents(opt) {\n    if (opt.triggerEvents) {\n        return opt.triggerEvents.split(\",\").map(e => e.trim());\n    }\n    return [\"click\"];\n}\nfunction getExcludedNodes(opt) {\n    if (opt.exclude) {\n        try {\n            return Array.from(document.querySelectorAll(opt.exclude));\n        }\n        catch (err) {\n            console.warn(`@ClickOutside: Exclude: '${opt.exclude}' will not be evaluated. Check your exclude selector syntax.`, err);\n        }\n    }\n    return;\n}\nfunction isExcluded(target, excudedNodes) {\n    if (target && excudedNodes) {\n        for (let excludedNode of excudedNodes) {\n            if (excludedNode.contains(target)) {\n                return true;\n            }\n        }\n    }\n    return false;\n}\n","import { ValueOf } from \"../../../types/interfaces\"\n\nexport enum Position {\n\tLEFT = 'left',\n\tRIGHT = 'right',\n}\n\nexport type PositionType = `${ValueOf<typeof Position>}`\n\nexport const DropdownClass = {\n\troot: 'gov-dropdown',\n\tlist: 'gov-dropdown__list'\n}\n","import {Component, Element, Event, EventEmitter, h, Host, Method, Prop, Watch} from \"@stencil/core\"\nimport {registerClickOutside} from \"stencil-click-outside\"\nimport {govHost, toBoolAttr} from \"../../../helpers/Dom/template\"\nimport {GovHost} from \"../../../helpers/Dom/template.types\"\nimport {Nullable} from \"../../../types/interfaces\"\nimport {createID} from \"../../../utils/string.utils\"\nimport {ButtonClass} from \"../button/constants\"\nimport {DropdownClass, Position, PositionType} from \"./constants\"\nimport {DropdownEvent} from \"./gov-dropdown.types\"\n\n@Component({\n\ttag: \"gov-dropdown\",\n})\nexport class GovDropdown {\n\tprivate h: GovHost\n\tprivate readonly listId: string\n\tprivate readonly controlId: string\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t\tthis.listId = createID(\"GovDropdownList\")\n\t\tthis.controlId = createID(\"GovDropdownControl\")\n\t}\n\n\t@Element() host: HTMLGovButtonElement\n\n\t/**\n\t * Custom trigger identifier\n\t */\n\t@Prop({attribute: \"identifier\"}) readonly identifier: string\n\t/**\n\t * Dropdown state\n\t */\n\t@Prop({mutable: true}) open = false\n\t/**\n\t * Menu display position\n\t */\n\t@Prop() readonly position: PositionType = Position.LEFT\n\t/**\n\t * Emitted when the dropdown change state\n\t */\n\t@Event({eventName: \"gov-change\"}) govChange: EventEmitter<DropdownEvent>\n\n\t@Watch('open')\n\twatchOpen() {\n\t\tthis.trigger?.setAttribute(\"aria-expanded\", toBoolAttr(this.open))\n\t}\n\n\tget trigger() {\n\t\treturn this.host.querySelector(`* > ${ButtonClass.root}`) as HTMLGovButtonElement\n\t}\n\n\tget list() {\n\t\treturn this.h.getSlot(\"list\") as Nullable<HTMLUListElement>\n\t}\n\n\tcomponentWillLoad() {\n\t\tif (!this.trigger) return;\n\n\t\tthis.trigger.setAttribute(\"aria-controls\", this.listId)\n\t\tthis.trigger.setAttribute(\"aria-haspopup\", toBoolAttr(!!this.list))\n\t\tthis.trigger.setAttribute(\"aria-expanded\", toBoolAttr(this.open))\n\t\tthis.trigger.setAttribute(\"identifier\", this.identifier ?? this.controlId)\n\n\t\tthis.trigger.addEventListener(\"gov-click\", (e) => {\n\t\t\te.preventDefault()\n\t\t\te.stopPropagation()\n\t\t\tthis.open = !this.open\n\n\t\t\tthis.govChange.emit({\n\t\t\t\tcomponent: DropdownClass.root,\n\t\t\t\toriginalEvent: e,\n\t\t\t\topen: this.open,\n\t\t\t})\n\t\t})\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes([DropdownClass.root])} open={this.open} position={this.position}>\n\t\t\t\t<slot></slot>\n\t\t\t\t<div\n\t\t\t\t\tref={el => registerClickOutside(this, el, () => this.open = false)}\n\t\t\t\t\tclass={DropdownClass.list}\n\t\t\t\t\tid={this.listId}\n\t\t\t\t\taria-labelledby={this.controlId}\n\t\t\t\t\taria-hidden={toBoolAttr(!this.open)}\n\t\t\t\t\thidden={!this.open}>\n\t\t\t\t\t<slot name=\"list\"></slot>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Returns the current state of the dropdown\n\t */\n\t@Method()\n\tasync getState() {\n\t\treturn this.open\n\t}\n\n\t/**\n\t * Toggle state of dropdown\n\t */\n\t@Method()\n\tasync toggle() {\n\t\tthis.open = !this.open\n\t}\n}\n"],"version":3}

package/dist/cjs/gov-empty.cjs.entry.js

@@ -2,30 +2,41 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-f53beed1.js');
-const template = require('./template-431f0737.js');
+const index = require('./index-1af4880c.js');
+const utils = require('./utils-d263c5c6.js');
+const sizes = require('./sizes-89f8d3b2.js');
+const template = require('./template-b070338f.js');
+const props = require('./props-b8a955b2.js');
+const constants = require('./constants-e1bbb053.js');
+require('./gov.log-1e8bab6e.js');
+require('./win-587f4614.js');
 
+utils.pick(sizes.Sizes, ['_S', '_M', '_L']);
 const EmptyClass = {
     root: 'gov-empty',
-    icon: 'gov-empty__icon',
-    container: 'gov-empty__container',
     content: 'gov-empty__content',
 };
 
-const govEmptyCss = ".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-empty{position:relative;display:block;width:100%}.gov-empty__icon{display:inline-flex;justify-content:center;align-items:center;width:6rem;height:6rem;margin-bottom:2rem;border-radius:50%;background:var(--gov-empty-icon-circle-bg, linear-gradient(to bottom, var(--gov-color-primary-200), var(--gov-color-neutral-white)));color:var(--gov-empty-icon-color, var(--gov-color-primary))}.gov-empty__icon>*{width:3.5rem;height:3.5rem}.gov-empty__content>*:last-child{margin-bottom:0}";
-const GovEmptyStyle0 = govEmptyCss;
-
 const GovEmpty = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        this.size = 'm';
         this.h = template.govHost(this.host);
     }
+    validateSize(newValue) {
+        props.validateProp(constants.AccordionSizes, newValue, constants.AccordionClass.root);
+    }
+    componentWillLoad() {
+        this.validateSize(this.size);
+    }
     render() {
-        return (index.h(index.Host, { key: 'c82d19938b561c87b71dddd89fdac22a441a7694', class: this.h.classes(EmptyClass.root) }, this.h.hasSlot('icon') && (index.h("div", { key: '216a756eaaeef5032b60c0b11e2e8e751aedda5b', class: EmptyClass.icon }, index.h("slot", { key: '980a0e840474c32d27590ac5640476e0e192209c', name: "icon" }))), index.h("div", { key: 'a3e1275bf59225caa12e631c65cbed51c08d6ddc', class: EmptyClass.content }, index.h("slot", { key: 'cd1a2407f415c6f826f81f8592677308cb8776a5' }))));
+        return (index.h(index.Host, { key: 'd69440398b476c59b60240f687d7f00dacfe4f0d', class: this.h.classes(EmptyClass.root), size: this.size }, this.h.hasSlot('icon') && (index.h("slot", { key: '7832fc85c0ccbb79a2832cf2bc9bee560790a10e', name: "icon" })), index.h("div", { key: '0cc061e85c0817f996ffc18601b3ac6dcf2b52b5', class: EmptyClass.content }, index.h("slot", { key: 'fbe776f189de07ba54ca1c600e9979d6af7667b9', name: "headline" }), index.h("slot", { key: 'e28fb1ef408ae3daa1b642ff3b15e87457553b6b' }))));
     }
     get host() { return index.getElement(this); }
+    static get watchers() { return {
+        "size": ["validateSize"]
+    }; }
 };
-GovEmpty.style = GovEmptyStyle0;
 
 exports.gov_empty = GovEmpty;
 

package/dist/cjs/gov-empty.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"gov-empty.entry.cjs.js","mappings":";;;;;;;AAAO,MAAM,UAAU,GAAG;IACzB,IAAI,EAAE,WAAW;IACjB,IAAI,EAAE,iBAAiB;IACvB,SAAS,EAAE,sBAAsB;IACjC,OAAO,EAAE,oBAAoB;CAC7B;;ACLD,MAAM,WAAW,GAAG,yzBAAyzB,CAAC;AAC90B,uBAAe,WAAW;;MCQb,QAAQ;IAGpB;;QACC,IAAI,CAAC,CAAC,GAAGA,gBAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAID,MAAM;QACL,QACCC,QAACC,UAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,IAC1C,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KACtBD,kEAAK,KAAK,EAAE,UAAU,CAAC,IAAI,IAC1BA,mEAAM,IAAI,EAAC,MAAM,GAAG,CACf,CACN,EACDA,kEAAK,KAAK,EAAE,UAAU,CAAC,OAAO,IAC7BA,oEAAQ,CACH,CACA,EACP;KACD;;;;;;;","names":["govHost","h","Host"],"sources":["../../../packages/core/src/components/gov-empty/constants.ts","../../../packages/core/src/components/gov-empty/gov-empty.scss?tag=gov-empty","../../../packages/core/src/components/gov-empty/gov-empty.tsx"],"sourcesContent":["export const EmptyClass = {\n\troot: 'gov-empty',\n\ticon: 'gov-empty__icon',\n\tcontainer: 'gov-empty__container',\n\tcontent: 'gov-empty__content',\n}\n","/*\n *   Alert\n */\n\n$class: \".gov-empty\";\n\n#{$class} {\n\t@include base();\n\t&__icon {\n\t\tdisplay: inline-flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\twidth: rem-calc(96);\n\t\theight: rem-calc(96);\n\t\tmargin-bottom: calc(rem-calc(96) / 3);\n\t\tborder-radius: 50%;\n\t\tbackground: $empty-icon-circle-bg;\n\t\tcolor: $empty-icon-color;\n\t\t& > * {\n\t\t\twidth: rem-calc(56);\n\t\t\theight: rem-calc(56);\n\t\t}\n\t}\n\t&__content {\n\t\t@include reset-last-margin();\n\t}\n}\n","import { Component, Element, Host, h } from '@stencil/core'\nimport { EmptyClass } from './constants'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-empty',\n\tstyleUrl: 'gov-empty.scss',\n})\nexport class GovEmpty {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovEmptyElement\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(EmptyClass.root)}>\n\t\t\t\t{this.h.hasSlot('icon') && (\n\t\t\t\t\t<div class={EmptyClass.icon}>\n\t\t\t\t\t\t<slot name=\"icon\" />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div class={EmptyClass.content}>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"gov-empty.entry.cjs.js","mappings":";;;;;;;;;;;;;AAI0BA,UAAI,CAACC,WAAK,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,EAAC;AAGlD,MAAM,UAAU,GAAG;IACzB,IAAI,EAAE,WAAW;IACjB,OAAO,EAAE,oBAAoB;CAC7B;;MCAY,QAAQ;IAGpB;;oBAQyC,GAAG;QAP3C,IAAI,CAAC,CAAC,GAAGC,gBAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IASD,YAAY,CAAC,QAAgB;QAC5BC,kBAAY,CAACC,wBAAc,EAAE,QAAQ,EAAEC,wBAAc,CAAC,IAAI,CAAC,CAAA;KAC3D;IAED,iBAAiB;QAChB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC5B;IAED,MAAM;QACL,QACCC,QAACC,UAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IAC3D,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KACtBD,mEAAM,IAAI,EAAC,MAAM,GAAG,CACpB,EACDA,kEAAK,KAAK,EAAE,UAAU,CAAC,OAAO,IAC7BA,mEAAM,IAAI,EAAC,UAAU,GAAG,EACxBA,oEAAQ,CACH,CACA,EACP;KACD;;;;;;;;;","names":["pick","Sizes","govHost","validateProp","AccordionSizes","AccordionClass","h","Host"],"sources":["../../../packages/core/src/components/gov-empty/constants.ts","../../../packages/core/src/components/gov-empty/gov-empty.tsx"],"sourcesContent":["import {pick} from \"../../utils/utils\";\nimport {Sizes} from \"../../core/constants/sizes\";\nimport {ValueOf} from \"../../types/interfaces\";\n\nexport const EmptySizes = pick(Sizes, ['_S', '_M', '_L'])\nexport type EmptySizesType = `${ValueOf<typeof EmptySizes>}`\n\nexport const EmptyClass = {\n\troot: 'gov-empty',\n\tcontent: 'gov-empty__content',\n}\n","import {Component, Element, Host, h, Prop, Watch} from '@stencil/core'\nimport {EmptyClass, EmptySizesType} from './constants'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\nimport {validateProp} from \"../../helpers/Validate/props\";\nimport {AccordionClass, AccordionSizes} from \"../gov-accordion/constants\";\n\n@Component({\n\ttag: 'gov-empty',\n})\nexport class GovEmpty {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovEmptyElement\n\t/**\n\t * Element size.\n\t */\n\t@Prop() readonly size?: EmptySizesType = 'm'\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(AccordionSizes, newValue, AccordionClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateSize(this.size)\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(EmptyClass.root)} size={this.size}>\n\t\t\t\t{this.h.hasSlot('icon') && (\n\t\t\t\t\t<slot name=\"icon\" />\n\t\t\t\t)}\n\t\t\t\t<div class={EmptyClass.content}>\n\t\t\t\t\t<slot name=\"headline\" />\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/cjs/gov-error-code.cjs.entry.js

@@ -2,30 +2,24 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-f53beed1.js');
-const template = require('./template-431f0737.js');
+const index = require('./index-1af4880c.js');
+const template = require('./template-b070338f.js');
 
 const ErrorCodeClass = {
     root: 'gov-error-code',
-    icon: 'gov-error-code__icon',
-    holder: 'gov-error-code__holder',
     content: 'gov-error-code__content',
 };
 
-const govErrorCodeCss = ".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-error-code{position:relative;display:block;width:100%}.gov-error-code__holder{margin:0 auto;text-align:center}.gov-error-code__content>*:last-child{margin-bottom:0}.gov-error-code__icon{display:flex;justify-content:center;align-items:center;width:9.375rem;height:9.375rem;margin:0 auto 1.5rem;border-radius:50%;background:var(--gov-error-icon-circle-bg, linear-gradient(to bottom, var(--gov-color-primary-200), var(--gov-color-neutral-white)));color:var(--gov-error-icon-color, var(--gov-color-primary))}.gov-error-code__icon>*{width:6.5625rem;height:6.5625rem}@media (min-width: 48em){.gov-error-code__icon{width:12.5rem;height:12.5rem;margin:0 auto 2rem}.gov-error-code__icon>*{width:8.75rem;height:8.75rem}}";
-const GovErrorCodeStyle0 = govErrorCodeCss;
-
 const GovErrorCode = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.h = template.govHost(this.host);
     }
     render() {
-        return (index.h(index.Host, { key: '1e634f7ebf2fc9ca6d2ccd620fd38b35b788843a', class: this.h.classes(ErrorCodeClass.root) }, index.h("div", { key: '3d531a4bdc60e66e02975b6fa6b10c374a772455', class: ErrorCodeClass.holder }, this.h.hasSlot('icon') && (index.h("div", { key: '96cf7a9046710206c587ad35c69084bda9b3d8dd', class: ErrorCodeClass.icon }, index.h("slot", { key: '2b532b0c490ff77a25a740cf675e7ff9013edbfb', name: "icon" }))), index.h("div", { key: 'a22c2bf3ee35e4ba1bf5840a15b3032c52ad8dd1', class: ErrorCodeClass.content }, index.h("slot", { key: '32ba276ba27e1fc83edfbc4260b3f1a68b0de7eb' })))));
+        return (index.h(index.Host, { key: '8c7ac0985621c075b94e1bad82a913c9454b10cf', class: this.h.classes(ErrorCodeClass.root), align: "center" }, this.h.hasSlot('icon') && (index.h("slot", { key: '498d60a762977d1dfd24750a2c0afd2ce21f1c68', name: "icon" })), index.h("div", { key: 'bdd3a7505c44660e772bd55f80519fc0f4026a4a', class: ErrorCodeClass.content }, index.h("slot", { key: 'f9c789de200eb94d4844c633c771339be14f416e', name: "headline" }), index.h("slot", { key: '475487ef2fb1bb63eea1ca35a81024b734c402be' }))));
     }
     get host() { return index.getElement(this); }
 };
-GovErrorCode.style = GovErrorCodeStyle0;
 
 exports.gov_error_code = GovErrorCode;
 

package/dist/cjs/gov-error-code.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"gov-error-code.entry.cjs.js","mappings":";;;;;;;AAAO,MAAM,cAAc,GAAG;IAC7B,IAAI,EAAE,gBAAgB;IACtB,IAAI,EAAE,sBAAsB;IAC5B,MAAM,EAAE,wBAAwB;IAChC,OAAO,EAAE,yBAAyB;CAClC;;ACLD,MAAM,eAAe,GAAG,miCAAmiC,CAAC;AAC5jC,2BAAe,eAAe;;MCQjB,YAAY;IAGxB;;QACC,IAAI,CAAC,CAAC,GAAGA,gBAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAID,MAAM;QACL,QACCC,QAACC,UAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,IAC/CD,kEAAK,KAAK,EAAE,cAAc,CAAC,MAAM,IAC/B,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KACtBA,kEAAK,KAAK,EAAE,cAAc,CAAC,IAAI,IAC9BA,mEAAM,IAAI,EAAC,MAAM,GAAG,CACf,CACN,EACDA,kEAAK,KAAK,EAAE,cAAc,CAAC,OAAO,IACjCA,oEAAQ,CACH,CACD,CACA,EACP;KACD;;;;;;;","names":["govHost","h","Host"],"sources":["../../../packages/core/src/components/gov-error-code/constants.ts","../../../packages/core/src/components/gov-error-code/gov-error-code.scss?tag=gov-error-code","../../../packages/core/src/components/gov-error-code/gov-error-code.tsx"],"sourcesContent":["export const ErrorCodeClass = {\n\troot: 'gov-error-code',\n\ticon: 'gov-error-code__icon',\n\tholder: 'gov-error-code__holder',\n\tcontent: 'gov-error-code__content',\n}\n","/*\n *   Alert\n */\n\n$class: \".gov-error-code\";\n\n#{$class} {\n\t@include base();\n\t&__holder {\n\t\tmargin: 0 auto;\n\t\ttext-align: center;\n\t}\n\t&__content {\n\t\t@include reset-last-margin();\n\t}\n\t&__icon {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\twidth: rem-calc(150);\n\t\theight: rem-calc(150);\n\t\tmargin: 0 auto rem-calc(24);\n\t\tborder-radius: 50%;\n\t\tbackground: $error-icon-circle-bg;\n\t\tcolor: $error-icon-color;\n\t\t& > * {\n\t\t\twidth: rem-calc(105);\n\t\t\theight: rem-calc(105);\n\t\t}\n\t}\n\n\t// MQ\n\t@include mq($from: md) {\n\t\t&__icon {\n\t\t\twidth: rem-calc(200);\n\t\t\theight: rem-calc(200);\n\t\t\tmargin: 0 auto rem-calc(32);\n\t\t\t& > * {\n\t\t\t\twidth: rem-calc(140);\n\t\t\t\theight: rem-calc(140);\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Element, h, Host } from '@stencil/core'\nimport { ErrorCodeClass } from './constants'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-error-code',\n\tstyleUrl: 'gov-error-code.scss',\n})\nexport class GovErrorCode {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovErrorCodeElement\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(ErrorCodeClass.root)}>\n\t\t\t\t<div class={ErrorCodeClass.holder}>\n\t\t\t\t\t{this.h.hasSlot('icon') && (\n\t\t\t\t\t\t<div class={ErrorCodeClass.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={ErrorCodeClass.content}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"gov-error-code.entry.cjs.js","mappings":";;;;;;;AAAO,MAAM,cAAc,GAAG;IAC7B,IAAI,EAAE,gBAAgB;IACtB,OAAO,EAAE,yBAAyB;CAClC;;MCKY,YAAY;IAGxB;;QACC,IAAI,CAAC,CAAC,GAAGA,gBAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAID,MAAM;QACL,QACCC,QAACC,UAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,KAAK,EAAC,QAAQ,IAC7D,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KACtBD,mEAAM,IAAI,EAAC,MAAM,GAAG,CACpB,EACDA,kEAAK,KAAK,EAAE,cAAc,CAAC,OAAO,IACjCA,mEAAM,IAAI,EAAC,UAAU,GAAG,EACxBA,oEAAQ,CACH,CACD,EACP;KACD;;;;;;","names":["govHost","h","Host"],"sources":["../../../packages/core/src/components/gov-error-code/constants.ts","../../../packages/core/src/components/gov-error-code/gov-error-code.tsx"],"sourcesContent":["export const ErrorCodeClass = {\n\troot: 'gov-error-code',\n\tcontent: 'gov-error-code__content',\n}\n","import { Component, Element, h, Host } from '@stencil/core'\nimport { ErrorCodeClass } from './constants'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-error-code',\n})\nexport class GovErrorCode {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovErrorCodeElement\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(ErrorCodeClass.root)} align=\"center\">\n\t\t\t\t\t{this.h.hasSlot('icon') && (\n\t\t\t\t\t\t<slot name=\"icon\" />\n\t\t\t\t\t)}\n\t\t\t\t\t<div class={ErrorCodeClass.content}>\n\t\t\t\t\t\t<slot name=\"headline\" />\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/cjs/gov-form-autocomplete.cjs.entry.js

@@ -2,22 +2,20 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-f53beed1.js');
-const template = require('./template-431f0737.js');
-const props = require('./props-edd0d46f.js');
-const string_utils = require('./string.utils-b84c81cf.js');
+const index = require('./index-1af4880c.js');
+const template = require('./template-b070338f.js');
+const props = require('./props-b8a955b2.js');
+const string_utils = require('./string.utils-2335838f.js');
 const utils = require('./utils-d263c5c6.js');
-const constants = require('./constants-fb915aae.js');
+const constants = require('./constants-47ba678b.js');
 const array_utils = require('./array.utils-96eadde3.js');
-require('./gov.log-8887c6bc.js');
-require('./win-03714165.js');
+const attribute = require('./attribute-06dc5228.js');
+const accessibility = require('./accessibility-c475826b.js');
+require('./gov.log-1e8bab6e.js');
+require('./win-587f4614.js');
 require('./sizes-89f8d3b2.js');
-require('./variants-85b514ea.js');
 require('./helpers.types-ff60c9bd.js');
 
-const govFormAutocompleteCss = ".gov-form-autocomplete__list{margin:0;padding:0}.gov-form-autocomplete__list>.gov-form-autocomplete__item{margin:0;padding:0;background:none}.gov-form-autocomplete__list>.gov-form-autocomplete__item::before{display:none}.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-form-autocomplete{position:relative;display:block;width:100%}.gov-form-autocomplete__list{font-weight:var(--gov-text-s-font-weight);font-size:var(--gov-text-s-font-size);line-height:var(--gov-text-s-line-height);letter-spacing:var(--gov-text-s-letter-spacing);position:absolute;top:100%;right:0;left:0;z-index:5;max-height:14.0625rem;margin-top:0.5rem;border:var(--gov-autocomplete-item-hover, 0.0625rem solid var(--gov-color-secondary-500));border-radius:var(--gov-border-radius, 0.1875rem);background:var(--gov-autocomplete-bg, var(--gov-color-neutral-white));overflow-x:hidden;overflow-y:auto;overscroll-behavior:none}.gov-form-autocomplete__list>.gov-form-autocomplete__item{padding:0.75rem 0.5rem;cursor:pointer}.gov-form-autocomplete__item--empty,.gov-form-autocomplete__item--loading{padding:0.75rem 0.5rem;color:var(--gov-autocomplete-item-disable-color, var(--gov-color-secondary-600))}.gov-form-autocomplete__item--empty .gov-icon,.gov-form-autocomplete__item--empty .gov-spin-animation,.gov-form-autocomplete__item--loading .gov-icon,.gov-form-autocomplete__item--loading .gov-spin-animation{width:12px;height:12px}.gov-form-autocomplete__list:empty{display:none}.gov-form-autocomplete__item[aria-selected=\"\"],.gov-form-autocomplete__item[aria-selected=true i],.gov-form-autocomplete__item[aria-selected=\"1\"]{background:var(--gov-autocomplete-item-select, var(--gov-color-secondary-400))}@media not all and (pointer: coarse){.gov-form-autocomplete__item:hover{background:var(--gov-autocomplete-item-hover, var(--gov-color-primary-100))}}";
-const GovFormAutocompleteStyle0 = govFormAutocompleteCss;
-
 const GovFormAutocomplete = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
@@ -29,7 +27,6 @@ const GovFormAutocomplete = class {
         this.value = '';
         this.options = undefined;
         this.identifier = undefined;
-        this.variant = undefined;
         this.success = undefined;
         this.size = 'm';
         this.nameKey = 'name';
@@ -44,18 +41,13 @@ const GovFormAutocomplete = class {
         this.throttleTime = 200;
         this.messageEmpty = 'Nebyly nalezeny žádné výsledky';
         this.messageLoading = 'Načítám...';
-        this.wcagDescribedBy = undefined;
-        this.wcagLabelledBy = undefined;
-        this.wcagOwns = undefined;
         this.focused = undefined;
         this.processing = false;
         this.arrowCounter = -1;
         this.list = [];
+        this.inheritedAttributes = {};
         this.listBoxId = string_utils.createID('GovListBox');
     }
-    validateVariant(newValue) {
-        props.validateProp(constants.FormAutocompleteVariants, newValue, constants.FormAutocompleteClass.root);
-    }
     validateSize(newValue) {
         props.validateProp(constants.FormAutocompleteSizes, newValue, constants.FormAutocompleteClass.root);
     }
@@ -115,14 +107,27 @@ const GovFormAutocomplete = class {
             return false;
         }
     }
+    componentDidLoad() {
+        this.attributeObserver = new attribute.AttributeObserver(this.host, (attributeName, newValue) => {
+            this.onAriaAttributeChange(attributeName, newValue);
+        });
+        this.attributeObserver.startObserving(attribute.ariaAttributes);
+    }
     componentWillLoad() {
-        this.validateVariant(this.variant);
         this.validateSize(this.size);
+        this.inheritedAttributes = accessibility.inheritAriaAttributes(this.host);
+    }
+    disconnectedCallback() {
+        this.attributeObserver.stopObserving();
+    }
+    onAriaAttributeChange(attributeName, newValue) {
+        this.host.removeAttribute(attributeName);
+        this.inheritedAttributes = Object.assign(Object.assign({}, this.inheritedAttributes), { [attributeName]: newValue });
     }
     render() {
-        return (index.h(index.Host, { key: '3ade1a0f94261a8530ce85af0a67f0ce5ed067d3', class: constants.FormAutocompleteClass.root, size: this.size, variant: this.variant }, index.h("gov-form-input", { key: 'ac6392ffdb77783b45b774dbb00edca83de7370e', placeholder: this.placeholder, name: this.name, disabled: this.disabled, readonly: this.readonly, autocomplete: false, size: this.size, variant: this.variant, required: this.required, invalid: this.invalid, success: this.success, role: 'searchbox', value: this.value, minlength: this.minlength, maxlength: this.maxlength, "on-gov-input": utils.throttle(this.onInputHandler.bind(this), this.throttleTime), "on-gov-keyup": this.onKeyUpHandler.bind(this), "on-gov-keydown": this.onKeyDownHandler.bind(this), "on-gov-focus": this.onFocusHandler.bind(this), "on-gov-blur": this.onBlurHandler.bind(this), wcagAutocomplete: 'list', wcagDescribedBy: this.wcagDescribedBy, wcagLabelledBy: this.wcagLabelledBy, wcagOwns: [this.listBoxId, this.wcagOwns].join(' '), wcagExpanded: this.list.length && this.focused, ref: el => (this.inputRef = el) }, index.h("slot", { key: 'adb1c0a349ac9f12e0fb7d2790516a1e7a4cf437', slot: "right-icon", name: "right-icon" })), index.h("ul", { key: '9d11566e2fda522c662d8af6973cd5f4d155c1ad', class: constants.FormAutocompleteClass.list, role: 'listbox', "aria-hidden": template.toBoolAttr(!this.focused), hidden: !this.focused, id: this.listBoxId, ref: el => (this.listRef = el) }, this.focused && this.list.length === 0 && this.processing === false && this.isValueAccepted && this.messageEmpty ? (index.h("li", { class: constants.FormAutocompleteClass.empty }, this.messageEmpty)) : null, this.focused && this.processing === true && this.isValueAccepted ? (index.h("li", { class: constants.FormAutocompleteClass.loading }, index.h("gov-icon", { name: "loader", class: "gov-spin-animation" }), "\u00A0", this.messageLoading)) : null, this.focused ? this.list.map((item, index$1) => {
+        return (index.h(index.Host, { key: 'ea390b2ba5832f3269f5bc27732b212f2c893ace', class: constants.FormAutocompleteClass.root, size: this.size }, index.h("gov-form-input", Object.assign({ key: 'd76f02655c5e640062c413e8ac8e40266a74fa1e', placeholder: this.placeholder, name: this.name, disabled: this.disabled, readonly: this.readonly, autocomplete: false, size: this.size, required: this.required, invalid: this.invalid, success: this.success, role: 'searchbox', value: this.value, minlength: this.minlength, maxlength: this.maxlength, "on-gov-input": utils.throttle(this.onInputHandler.bind(this), this.throttleTime), "on-gov-keyup": this.onKeyUpHandler.bind(this), "on-gov-keydown": this.onKeyDownHandler.bind(this), "on-gov-focus": this.onFocusHandler.bind(this), "on-gov-blur": this.onBlurHandler.bind(this) }, this.inheritedAttributes, { "aria-autocomplete": 'list', "aria-owns": [this.listBoxId, this.inheritedAttributes['aria-owns']].join(' '), "aria-expanded": template.booleanString(this.list.length && this.focused ? true : false), ref: el => (this.inputRef = el) }), index.h("slot", { key: 'd5a3373d4b1aa5883c67a79dee06124d794a4956', name: "right-icon" })), index.h("ul", { key: '26bb0a0e05692a25e8ceda76ce7439c43d49325a', class: constants.FormAutocompleteClass.list, role: 'listbox', "aria-hidden": template.toBoolAttr(!this.focused), hidden: !this.focused, id: this.listBoxId, ref: el => (this.listRef = el) }, this.focused && this.list.length === 0 && this.processing === false && this.isValueAccepted && this.messageEmpty ? (index.h("li", { class: constants.FormAutocompleteClass.empty }, this.messageEmpty)) : null, this.focused && this.processing === true && this.isValueAccepted ? (index.h("li", { class: constants.FormAutocompleteClass.loading }, index.h("gov-skeleton", { size: "m" }))) : null, this.focused ? this.list.map((item, index$1) => {
             const isSelected = this.arrowCounter === index$1;
-            return (index.h("li", { class: constants.FormAutocompleteClass.item, innerHTML: this.templateResolver(item, isSelected), role: 'option', "aria-posinset": index$1, tabindex: isSelected ? 0 : -1, "aria-setsize": this.list.length, onTouchStart: (e) => this.onSelectHandler(e, index$1), onMouseDown: (e) => this.onSelectHandler(e, index$1), "aria-selected": template.toBoolAttr(isSelected) }));
+            return (index.h("li", { class: constants.FormAutocompleteClass.item, innerHTML: this.templateResolver(item, isSelected), role: 'option', "aria-posinset": index$1, tabindex: isSelected ? 0 : -1, "aria-setsize": this.list.length, onTouchStart: (e) => this.onSelectHandler(e, index$1), onMouseDown: (e) => this.onSelectHandler(e, index$1), "aria-selected": template.toBoolAttr(isSelected) }, index.h("slot", { name: "list-item-left" }), index.h("slot", { name: "list-item-right" })));
         }) : null)));
     }
     onFocusHandler(e) {
@@ -254,12 +259,10 @@ const GovFormAutocomplete = class {
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
-        "variant": ["validateVariant"],
         "size": ["validateSize"],
         "options": ["watchOptions"]
     }; }
 };
-GovFormAutocomplete.style = GovFormAutocompleteStyle0;
 
 exports.gov_form_autocomplete = GovFormAutocomplete;