@gov-design-system-ce/components 0.0.23 → 0.0.25

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

@@ -1,33 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-29ac07f6.js');
-const template = require('./template-e1c4ff78.js');
-
-const CookiebarClass = {
-  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',
-};
-
-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 GovCookiebar = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.h = template.govHost(this.host);
-  }
-  render() {
-    return (index.h(index.Host, { class: this.h.classes(CookiebarClass.root) }, index.h("div", { class: CookiebarClass.holder }, index.h("div", { class: CookiebarClass.content }, index.h("slot", null)), (this.h.hasSlot('actions-primary') || this.h.hasSlot('actions-secondary')) && (index.h("div", { class: CookiebarClass.actions }, this.h.hasSlot('actions-primary') && (index.h("div", { class: CookiebarClass.actionsPrimary }, index.h("slot", { name: "actions-primary" }))), this.h.hasSlot('actions-secondary') && (index.h("div", { class: CookiebarClass.actionsSecondary }, index.h("slot", { name: "actions-secondary" }))))))));
-  }
-  get host() { return index.getElement(this); }
-};
-GovCookiebar.style = govCookiebarCss;
-
-exports.gov_cookiebar = GovCookiebar;
-
-//# sourceMappingURL=gov-cookiebar.cjs.entry.js.map

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

@@ -1 +0,0 @@
-{"file":"gov-cookiebar.entry.cjs.js","mappings":";;;;;;;AAAO,MAAM,cAAc,GAAG;EAC7B,IAAI,EAAE,eAAe;EACrB,MAAM,EAAE,uBAAuB;EAC/B,OAAO,EAAE,wBAAwB;EACjC,OAAO,EAAE,wBAAwB;EACjC,cAAc,EAAE,gCAAgC;EAChD,gBAAgB,EAAE,kCAAkC;CACpD;;ACPD,MAAM,eAAe,GAAG,mrDAAmrD;;MCS9rD,YAAY;EAGxB;;IACC,IAAI,CAAC,CAAC,GAAGA,gBAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EAID,MAAM;IACL,QACCC,QAACC,UAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,IAC/CD,iBAAK,KAAK,EAAE,cAAc,CAAC,MAAM,IAChCA,iBAAK,KAAK,EAAE,cAAc,CAAC,OAAO,IACjCA,qBAAQ,CACH,EAEL,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,mBAAmB,CAAC,MACzEA,iBAAK,KAAK,EAAE,cAAc,CAAC,OAAO,IAChC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,KACjCA,iBAAK,KAAK,EAAE,cAAc,CAAC,cAAc,IACxCA,kBAAM,IAAI,EAAC,iBAAiB,GAAG,CAC1B,CACN,EAEA,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,mBAAmB,CAAC,KACnCA,iBAAK,KAAK,EAAE,cAAc,CAAC,gBAAgB,IAC1CA,kBAAM,IAAI,EAAC,mBAAmB,GAAG,CAC5B,CACN,CACI,CACN,CACI,CACA,EACP;GACD;;;;;;;","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}

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

@@ -1,31 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-29ac07f6.js');
-const template = require('./template-e1c4ff78.js');
-
-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 GovEmpty = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.h = template.govHost(this.host);
-  }
-  render() {
-    return (index.h(index.Host, { class: this.h.classes(EmptyClass.root) }, this.h.hasSlot('icon') && (index.h("div", { class: EmptyClass.icon }, index.h("slot", { name: "icon" }))), index.h("div", { class: EmptyClass.content }, index.h("slot", null))));
-  }
-  get host() { return index.getElement(this); }
-};
-GovEmpty.style = govEmptyCss;
-
-exports.gov_empty = GovEmpty;
-
-//# sourceMappingURL=gov-empty.cjs.entry.js.map

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

@@ -1 +0,0 @@
-{"file":"gov-empty.entry.cjs.js","mappings":";;;;;;;AAAO,MAAM,UAAU,GAAG;EACzB,IAAI,EAAE,WAAW;EACjB,IAAI,EAAE,iBAAiB;EACvB,SAAS,EAAE,sBAAsB;EACjC,OAAO,EAAE,oBAAoB;CAC7B;;ACLD,MAAM,WAAW,GAAG,yzBAAyzB;;MCSh0B,QAAQ;EAGpB;;IACC,IAAI,CAAC,CAAC,GAAGA,gBAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EAID,MAAM;IACL,QACCC,QAACC,UAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,IAC1C,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KACtBD,iBAAK,KAAK,EAAE,UAAU,CAAC,IAAI,IAC1BA,kBAAM,IAAI,EAAC,MAAM,GAAG,CACf,CACN,EACDA,iBAAK,KAAK,EAAE,UAAU,CAAC,OAAO,IAC7BA,qBAAQ,CACH,CACA,EACP;GACD;;;;;;;","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}

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

@@ -1,31 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-29ac07f6.js');
-const template = require('./template-e1c4ff78.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:7.125rem;height:7.125rem}@media (min-width: 48em){.gov-error-code__icon{width:12.5rem;height:12.5rem;margin:0 auto 2rem}.gov-error-code__icon>*{width:9.5rem;height:9.5rem}}";
-
-const GovErrorCode = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.h = template.govHost(this.host);
-  }
-  render() {
-    return (index.h(index.Host, { class: this.h.classes(ErrorCodeClass.root) }, index.h("div", { class: ErrorCodeClass.holder }, this.h.hasSlot('icon') && (index.h("div", { class: ErrorCodeClass.icon }, index.h("slot", { name: "icon" }))), index.h("div", { class: ErrorCodeClass.content }, index.h("slot", null)))));
-  }
-  get host() { return index.getElement(this); }
-};
-GovErrorCode.style = govErrorCodeCss;
-
-exports.gov_error_code = GovErrorCode;
-
-//# sourceMappingURL=gov-error-code.cjs.entry.js.map

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

@@ -1 +0,0 @@
-{"file":"gov-error-code.entry.cjs.js","mappings":";;;;;;;AAAO,MAAM,cAAc,GAAG;EAC7B,IAAI,EAAE,gBAAgB;EACtB,IAAI,EAAE,sBAAsB;EAC5B,MAAM,EAAE,wBAAwB;EAChC,OAAO,EAAE,yBAAyB;CAClC;;ACLD,MAAM,eAAe,GAAG,+hCAA+hC;;MCS1iC,YAAY;EAGxB;;IACC,IAAI,CAAC,CAAC,GAAGA,gBAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EAID,MAAM;IACL,QACCC,QAACC,UAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,IAC/CD,iBAAK,KAAK,EAAE,cAAc,CAAC,MAAM,IAC/B,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KACtBA,iBAAK,KAAK,EAAE,cAAc,CAAC,IAAI,IAC9BA,kBAAM,IAAI,EAAC,MAAM,GAAG,CACf,CACN,EACDA,iBAAK,KAAK,EAAE,cAAc,CAAC,OAAO,IACjCA,qBAAQ,CACH,CACD,CACA,EACP;GACD;;;;;;;","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(114);\n\t\t\theight: rem-calc(114);\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(152);\n\t\t\t\theight: rem-calc(152);\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}

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

@@ -1,196 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-29ac07f6.js');
-const string_utils = require('./string.utils-0f08c48c.js');
-const constants = require('./constants-86fb4eb4.js');
-const props = require('./props-5f82e4c0.js');
-const utils = require('./utils-c9b1bba3.js');
-const template = require('./template-e1c4ff78.js');
-require('./sizes-79872c2a.js');
-require('./variants-f5ffeef3.js');
-require('./gov.log-0c9dca27.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__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 GovFormAutocomplete = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.govFocus = index.createEvent(this, "gov-focus", 7);
-    this.govBlur = index.createEvent(this, "gov-blur", 7);
-    this.govInput = index.createEvent(this, "gov-input", 7);
-    this.govSelect = index.createEvent(this, "gov-select", 7);
-    this.templateResolver = item => item[this.nameKey];
-    this.value = "";
-    this.identifier = undefined;
-    this.variant = undefined;
-    this.success = undefined;
-    this.size = "m";
-    this.nameKey = "name";
-    this.name = undefined;
-    this.required = false;
-    this.disabled = undefined;
-    this.placeholder = undefined;
-    this.readonly = undefined;
-    this.invalid = undefined;
-    this.minlength = 2;
-    this.maxlength = undefined;
-    this.wcagDescribedBy = undefined;
-    this.wcagLabelledBy = undefined;
-    this.wcagOwns = undefined;
-    this.focused = undefined;
-    this.processing = false;
-    this.arrowCounter = -1;
-    this.list = [];
-    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);
-  }
-  onArrowUp() {
-    if (this.arrowCounter > 0) {
-      this.arrowCounter = this.arrowCounter - 1;
-    }
-  }
-  onArrowDown() {
-    if (this.arrowCounter < this.list.length - 1) {
-      this.arrowCounter = this.arrowCounter + 1;
-    }
-  }
-  doSearch() {
-    if (Number.isInteger(this.minlength) && String(this.value).length <= this.minlength && this.minlength) {
-      this.list = [];
-      this.arrowCounter = -1;
-      this.processing = false;
-      return;
-    }
-    if (this.searchCallback) {
-      this.processing = true;
-      this.searchCallback(this.value)
-        .then(response => (this.list = response))
-        .catch(() => (this.list = []))
-        .finally(() => {
-        this.arrowCounter = -1;
-        this.processing = false;
-      });
-    }
-  }
-  componentWillLoad() {
-    this.validateVariant(this.variant);
-    this.validateSize(this.size);
-  }
-  render() {
-    return (index.h(index.Host, { class: constants.FormAutocompleteClass.root, size: this.size, variant: this.variant }, index.h("gov-form-input", { 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, role: "searchbox", value: this.value, minlength: this.minlength, maxlength: this.maxlength, "on-gov-input": utils.throttle(this.onInputHandler.bind(this), 200), "on-gov-keyup": this.onKeyUpHandler.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", { slot: "right-icon", name: "right-icon" })), index.h("ul", { class: constants.FormAutocompleteClass.list, role: "listbox", id: this.listBoxId }, 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, onClick: () => this.onSelectHandler(index$1), "aria-selected": template.toBoolAttr(isSelected) }));
-    }))));
-  }
-  onFocusHandler(e) {
-    this.focused = true;
-    this.arrowCounter = -1;
-    if ((this.value || this.minlength === 0) && this.searchCallback) {
-      this.doSearch();
-    }
-    e.stopPropagation();
-    this.govFocus.emit({
-      originalEvent: e,
-      component: constants.FormAutocompleteClass.root,
-      value: this.value,
-      selected: null
-    });
-  }
-  onBlurHandler(e) {
-    this.focused = false;
-    setTimeout(() => (this.list = []), 200);
-    this.arrowCounter = -1;
-    e.stopPropagation();
-    this.govBlur.emit({
-      originalEvent: e,
-      component: constants.FormAutocompleteClass.root,
-      value: this.value,
-      selected: null
-    });
-  }
-  onInputHandler(e) {
-    this.value = e.target.value;
-    e.stopPropagation();
-    this.govInput.emit({
-      originalEvent: e,
-      component: constants.FormAutocompleteClass.root,
-      value: this.value,
-      selected: null
-    });
-    this.doSearch();
-  }
-  onSelectHandler(index = -1) {
-    let selected = null;
-    if (index > -1) {
-      selected = this.list[index];
-    }
-    else if (utils.has(this.arrowCounter, this.list)) {
-      selected = this.list[this.arrowCounter];
-    }
-    if (selected) {
-      this.govSelect.emit({
-        component: constants.FormAutocompleteClass.root,
-        value: this.value,
-        selected: selected
-      });
-      this.list = [];
-      if (utils.has(this.nameKey, selected) && typeof selected[this.nameKey] === "string") {
-        this.value = selected[this.nameKey];
-      }
-    }
-  }
-  onKeyUpHandler(e) {
-    const event = e.detail.originalEvent;
-    e.stopPropagation();
-    if (event.keyCode === 38)
-      this.onArrowUp();
-    else if (event.keyCode === 40)
-      this.onArrowDown();
-    else if (event.keyCode === 13)
-      this.onSelectHandler();
-  }
-  /**
-   * Returns the current state of the component
-   */
-  async setFocus(options) {
-    return this.inputRef.focus(options);
-  }
-  /**
-   * Clears whisperer value
-   */
-  async clearValue() {
-    this.value = "";
-    this.inputRef.value = "";
-    await this.inputRef.clearValue();
-  }
-  /**
-   * Set a custom asynchronous function for the whisperer
-   */
-  async setSearchCallback(callback) {
-    this.searchCallback = callback;
-  }
-  /**
-   * Setting a custom whisper result template
-   * @param callback
-   */
-  async setTemplateResolver(callback) {
-    this.templateResolver = callback;
-  }
-  get host() { return index.getElement(this); }
-  static get watchers() { return {
-    "variant": ["validateVariant"],
-    "size": ["validateSize"]
-  }; }
-};
-GovFormAutocomplete.style = govFormAutocompleteCss;
-
-exports.gov_form_autocomplete = GovFormAutocomplete;
-
-//# sourceMappingURL=gov-form-autocomplete.cjs.entry.js.map

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

@@ -1 +0,0 @@
-{"file":"gov-form-autocomplete.entry.cjs.js","mappings":";;;;;;;;;;;;;;AAAA,MAAM,sBAAsB,GAAG,grDAAgrD;;MCelsD,mBAAmB;EAM/B;;;;;;IAFQ,qBAAgB,GAAiE,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;iBAUnE,EAAE;;;;gBAgBd,GAAG;mBAIJ,MAAM;;oBASJ,KAAK;;;;;qBAqBL,CAAC;;;;;;sBAmChB,KAAK;wBACH,CAAC,CAAC;gBACiB,EAAE;IA9F5C,IAAI,CAAC,SAAS,GAAGA,qBAAQ,CAAC,YAAY,CAAC,CAAA;GACvC;EAgGD,eAAe,CAAC,QAAgB;IAC/BC,kBAAY,CAACC,kCAAwB,EAAE,QAAQ,EAAEC,+BAAqB,CAAC,IAAI,CAAC,CAAA;GAC5E;EAGD,YAAY,CAAC,QAAgB;IAC5BF,kBAAY,CAACG,+BAAqB,EAAE,QAAQ,EAAED,+BAAqB,CAAC,IAAI,CAAC,CAAA;GACzE;EAEO,SAAS;IAChB,IAAI,IAAI,CAAC,YAAY,GAAG,CAAC,EAAE;MAC1B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,GAAG,CAAC,CAAA;KACzC;GACD;EAEO,WAAW;IAClB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;MAC7C,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,GAAG,CAAC,CAAA;KACzC;GACD;EAEO,QAAQ;IACf,IAAI,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,EAAE;MACtG,IAAI,CAAC,IAAI,GAAG,EAAE,CAAA;MACd,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAA;MACtB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAA;MACvB,OAAM;KACN;IACD,IAAI,IAAI,CAAC,cAAc,EAAE;MACxB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAA;MACtB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC;SAC7B,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,CAAC;SACxC,KAAK,CAAC,OAAO,IAAI,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC;SAC7B,OAAO,CAAC;QACR,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAA;QACtB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAA;OACvB,CAAC,CAAA;KACH;GACD;EAED,iBAAiB;IAChB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;IAClC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC5B;EAED,MAAM;IACL,QACCE,QAACC,UAAI,IAAC,KAAK,EAAEH,+BAAqB,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,IAC9EE,4BACC,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,YAAY,EAAE,KAAK,EACnB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,SAAS,EAAE,IAAI,CAAC,SAAS,kBACXE,cAAQ,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,kBAC7C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,kBAC9B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,iBAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,EAC1C,gBAAgB,EAAE,MAAM,EACxB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,QAAQ,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EACnD,YAAY,EAAE,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,OAAO,EAC9C,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,QAAQ,GAAG,EAA6B,CAAC,IAE1DF,kBAAM,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,YAAY,GAAG,CAC5B,EACjBA,gBAAI,KAAK,EAAEF,+BAAqB,CAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,IAAI,CAAC,SAAS,IACxE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAEK,OAAK;MAC1B,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,KAAKA,OAAK,CAAA;MAC9C,QACCH,gBACC,KAAK,EAAEF,+BAAqB,CAAC,IAAI,EACjC,SAAS,EAAE,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,UAAU,CAAC,EAClD,IAAI,EAAE,QAAQ,mBACCK,OAAK,EACpB,QAAQ,EAAE,UAAU,GAAG,CAAC,GAAG,CAAC,CAAC,kBACf,IAAI,CAAC,IAAI,CAAC,MAAM,EAC9B,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAACA,OAAK,CAAC,mBAC3BC,mBAAU,CAAC,UAAU,CAAC,GACpC,EACF;KACD,CAAC,CACE,CACC,EACP;GACD;EAEO,cAAc,CAAC,CAAa;IACnC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;IACnB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAA;IACtB,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,SAAS,KAAK,CAAC,KAAK,IAAI,CAAC,cAAc,EAAE;MAChE,IAAI,CAAC,QAAQ,EAAE,CAAA;KACf;IACD,CAAC,CAAC,eAAe,EAAE,CAAA;IACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;MAClB,aAAa,EAAE,CAAC;MAChB,SAAS,EAAEN,+BAAqB,CAAC,IAAI;MACrC,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,QAAQ,EAAE,IAAI;KACd,CAAC,CAAA;GACF;EAEO,aAAa,CAAC,CAAa;IAClC,IAAI,CAAC,OAAO,GAAG,KAAK,CAAA;IACpB,UAAU,CAAC,OAAO,IAAI,CAAC,IAAI,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC,CAAA;IACvC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,CAAA;IACtB,CAAC,CAAC,eAAe,EAAE,CAAA;IACnB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;MACjB,aAAa,EAAE,CAAC;MAChB,SAAS,EAAEA,+BAAqB,CAAC,IAAI;MACrC,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,QAAQ,EAAE,IAAI;KACd,CAAC,CAAA;GACF;EAEO,cAAc,CAAC,CAAa;IACnC,IAAI,CAAC,KAAK,GAAI,CAAC,CAAC,MAAkC,CAAC,KAAK,CAAA;IACxD,CAAC,CAAC,eAAe,EAAE,CAAA;IACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;MAClB,aAAa,EAAE,CAAC;MAChB,SAAS,EAAEA,+BAAqB,CAAC,IAAI;MACrC,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,QAAQ,EAAE,IAAI;KACd,CAAC,CAAA;IACF,IAAI,CAAC,QAAQ,EAAE,CAAA;GACf;EAEO,eAAe,CAAC,KAAK,GAAG,CAAC,CAAC;IACjC,IAAI,QAAQ,GAAsC,IAAI,CAAA;IACtD,IAAI,KAAK,GAAG,CAAC,CAAC,EAAE;MACf,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;KAC3B;SAAM,IAAIO,SAAG,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE;MAC7C,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;KACvC;IACD,IAAI,QAAQ,EAAE;MACb,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;QACnB,SAAS,EAAEP,+BAAqB,CAAC,IAAI;QACrC,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,QAAQ,EAAE,QAAQ;OAClB,CAAC,CAAA;MACF,IAAI,CAAC,IAAI,GAAG,EAAE,CAAA;MACd,IAAIO,SAAG,CAAC,IAAI,CAAC,OAAO,EAAE,QAAQ,CAAC,IAAI,OAAO,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,QAAQ,EAAE;QAC9E,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;OACnC;KACD;GACD;EAEO,cAAc,CAAC,CAAc;IACpC,MAAM,KAAK,GAAI,CAAC,CAAC,MAAyB,CAAC,aAA8B,CAAA;IACzE,CAAC,CAAC,eAAe,EAAE,CAAA;IACnB,IAAI,KAAK,CAAC,OAAO,KAAK,EAAE;MAAE,IAAI,CAAC,SAAS,EAAE,CAAA;SACrC,IAAI,KAAK,CAAC,OAAO,KAAK,EAAE;MAAE,IAAI,CAAC,WAAW,EAAE,CAAA;SAC5C,IAAI,KAAK,CAAC,OAAO,KAAK,EAAE;MAAE,IAAI,CAAC,eAAe,EAAE,CAAA;GACrD;;;;EAMD,MAAM,QAAQ,CAAC,OAAsB;IACpC,OAAO,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAA;GACnC;;;;EAMD,MAAM,UAAU;IACf,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA;IACf,IAAI,CAAC,QAAQ,CAAC,KAAK,GAAG,EAAE,CAAA;IAExB,MAAM,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAA;GAChC;;;;EAMD,MAAM,iBAAiB,CAAC,QAAyC;IAChE,IAAI,CAAC,cAAc,GAAG,QAAQ,CAAA;GAC9B;;;;;EAOD,MAAM,mBAAmB,CAAC,QAAmD;IAC5E,IAAI,CAAC,gBAAgB,GAAG,QAAQ,CAAA;GAChC;;;;;;;;;;;","names":["createID","validateProp","FormAutocompleteVariants","FormAutocompleteClass","FormAutocompleteSizes","h","Host","throttle","index","toBoolAttr","has"],"sources":["../../../packages/core/src/components/gov-form/autocomplete/gov-form-autocomplete.scss?tag=gov-form-autocomplete","../../../packages/core/src/components/gov-form/autocomplete/gov-form-autocomplete.tsx"],"sourcesContent":["$class: \".gov-form-autocomplete\";\n\n#{$class} {\n\t@include base();\n\t&__list {\n\t\t@include typography($font-size-s);\n\t\t@extend %reset-ul;\n\t\tposition: absolute;\n\t\ttop: 100%;\n\t\tright: 0;\n\t\tleft: 0;\n\t\tz-index: 5;\n\t\tmax-height: rem-calc(225);\n\t\tmargin-top: rem-calc(8);\n\t\tborder: $form-autocomplete-border;\n\t\tborder-radius: $border-radius;\n\t\tbackground: $form-autocomplete-bg;\n\t\toverflow-x: hidden;\n\t\toverflow-y: auto;\n\t\toverscroll-behavior: none;\n\t}\n\t&__list > &__item {\n\t\t@extend %reset-ul-li;\n\t\tpadding: rem-calc(12 8);\n\t\tcursor: pointer;\n\t}\n\n\t// STATES\n\t&__list:empty {\n\t\tdisplay: none;\n\t}\n\n\t// HOVERS\n\t&__item {\n\t\t@include parameter(\"aria-selected\") {\n\t\t\tbackground: $form-autocomplete-item-select-bg;\n\t\t}\n\t\t@include hover() {\n\t\t\tbackground: $form-autocomplete-item-hover-bg;\n\t\t}\n\t}\n}\n","import { Component, Element, Host, h, Prop, Watch, Event, EventEmitter, State, Method } from \"@stencil/core\"\nimport { SizesType } from \"./constants\"\nimport { createID } from \"../../../utils/string.utils\"\nimport { FormAutocompleteClass, FormAutocompleteVariants, VariantType, FormAutocompleteSizes } from \"./constants\"\nimport { validateProp } from \"../../../helpers/Validate/props\"\nimport { has, throttle } from \"../../../utils/utils\"\nimport { FormAutocompleteEvent, GovFormAutocompleteItem } from \"./gov-form-autocomplete.types\"\nimport { toBoolAttr } from \"../../../helpers/Dom/template\"\nimport { Nullable } from \"../../../types/interfaces\"\nimport { FormInputEvent } from \"../input/gov-form-input.types\"\n\n@Component({\n\ttag: \"gov-form-autocomplete\",\n\tstyleUrl: \"gov-form-autocomplete.scss\",\n})\nexport class GovFormAutocomplete {\n\tprivate inputRef?: HTMLGovFormInputElement\n\tprivate readonly listBoxId: string\n\tprivate searchCallback: (value: string) => Promise<GovFormAutocompleteItem[]>\n\tprivate templateResolver: (item: GovFormAutocompleteItem, selected: boolean) => string = item => item[this.nameKey]\n\n\tconstructor() {\n\t\tthis.listBoxId = createID(\"GovListBox\")\n\t}\n\n\t@Element() host: HTMLGovFormInputElement\n\t/**\n\t * Value of input\n\t */\n\t@Prop({ reflect: true, mutable: true }) value = \"\"\n\t/**\n\t * Custom input identifier.\n\t */\n\t@Prop({ attribute: \"identifier\" }) readonly identifier: string\n\t/**\n\t * Style variation of the form input.\n\t */\n\t@Prop() readonly variant?: VariantType\n\t/**\n\t * Indicates the entered value of child form element does conform to the format expected by the application.\n\t */\n\t@Prop() readonly success: boolean\n\t/**\n\t * Input’s size.\n\t */\n\t@Prop() readonly size?: SizesType = \"m\"\n\t/**\n\t * Main key name in the object\n\t */\n\t@Prop() readonly nameKey: string = \"name\"\n\t/**\n\t * Name of the input.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the input component disabled.\n\t * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean\n\t/**\n\t * Text that appears in the form control when it has no value set\n\t */\n\t@Prop() readonly placeholder: string\n\t/**\n\t * The value is not editable\n\t */\n\t@Prop() readonly readonly: boolean\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Minimum length (number of characters) of value\n\t */\n\t@Prop() readonly minlength: number = 2\n\t/**\n\t * Maximum length (number of characters) of value\n\t */\n\t@Prop() readonly maxlength: number\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: \"wcag-described-by\" }) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({ attribute: \"wcag-labelled-by\" }) readonly wcagLabelledBy: string\n\t/**\n\t * Same as original parameter\n\t * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-owns\n\t */\n\t@Prop({ attribute: \"wcag-owns\" }) readonly wcagOwns: string\n\t/**\n\t * Emitted when the input has focus.\n\t */\n\t@Event({ eventName: \"gov-focus\" }) govFocus: EventEmitter<FormAutocompleteEvent>\n\t/**\n\t * Emitted when the input loses focus.\n\t */\n\t@Event({ eventName: \"gov-blur\" }) govBlur: EventEmitter<FormAutocompleteEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({ eventName: \"gov-input\" }) govInput: EventEmitter<FormAutocompleteEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({ eventName: \"gov-select\" }) govSelect: EventEmitter<FormAutocompleteEvent>\n\t@State() focused: boolean\n\t@State() processing = false\n\t@State() arrowCounter = -1\n\t@State() list: GovFormAutocompleteItem[] = []\n\n\t@Watch(\"variant\")\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormAutocompleteVariants, newValue, FormAutocompleteClass.root)\n\t}\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormAutocompleteSizes, newValue, FormAutocompleteClass.root)\n\t}\n\n\tprivate onArrowUp() {\n\t\tif (this.arrowCounter > 0) {\n\t\t\tthis.arrowCounter = this.arrowCounter - 1\n\t\t}\n\t}\n\n\tprivate onArrowDown() {\n\t\tif (this.arrowCounter < this.list.length - 1) {\n\t\t\tthis.arrowCounter = this.arrowCounter + 1\n\t\t}\n\t}\n\n\tprivate doSearch() {\n\t\tif (Number.isInteger(this.minlength) && String(this.value).length <= this.minlength && this.minlength) {\n\t\t\tthis.list = []\n\t\t\tthis.arrowCounter = -1\n\t\t\tthis.processing = false\n\t\t\treturn\n\t\t}\n\t\tif (this.searchCallback) {\n\t\t\tthis.processing = true\n\t\t\tthis.searchCallback(this.value)\n\t\t\t\t.then(response => (this.list = response))\n\t\t\t\t.catch(() => (this.list = []))\n\t\t\t\t.finally(() => {\n\t\t\t\t\tthis.arrowCounter = -1\n\t\t\t\t\tthis.processing = false\n\t\t\t\t})\n\t\t}\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={FormAutocompleteClass.root} size={this.size} variant={this.variant}>\n\t\t\t\t<gov-form-input\n\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\tname={this.name}\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\treadonly={this.readonly}\n\t\t\t\t\tautocomplete={false}\n\t\t\t\t\tsize={this.size}\n\t\t\t\t\tvariant={this.variant}\n\t\t\t\t\trequired={this.required}\n\t\t\t\t\tinvalid={this.invalid}\n\t\t\t\t\trole={\"searchbox\"}\n\t\t\t\t\tvalue={this.value}\n\t\t\t\t\tminlength={this.minlength}\n\t\t\t\t\tmaxlength={this.maxlength}\n\t\t\t\t\ton-gov-input={throttle(this.onInputHandler.bind(this), 200)}\n\t\t\t\t\ton-gov-keyup={this.onKeyUpHandler.bind(this)}\n\t\t\t\t\ton-gov-focus={this.onFocusHandler.bind(this)}\n\t\t\t\t\ton-gov-blur={this.onBlurHandler.bind(this)}\n\t\t\t\t\twcagAutocomplete={\"list\"}\n\t\t\t\t\twcagDescribedBy={this.wcagDescribedBy}\n\t\t\t\t\twcagLabelledBy={this.wcagLabelledBy}\n\t\t\t\t\twcagOwns={[this.listBoxId, this.wcagOwns].join(\" \")}\n\t\t\t\t\twcagExpanded={this.list.length && this.focused}\n\t\t\t\t\tref={el => (this.inputRef = el as HTMLGovFormInputElement)}\n\t\t\t\t>\n\t\t\t\t\t<slot slot=\"right-icon\" name=\"right-icon\" />\n\t\t\t\t</gov-form-input>\n\t\t\t\t<ul class={FormAutocompleteClass.list} role={\"listbox\"} id={this.listBoxId}>\n\t\t\t\t\t{this.list.map((item, index) => {\n\t\t\t\t\t\tconst isSelected = this.arrowCounter === index\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\tclass={FormAutocompleteClass.item}\n\t\t\t\t\t\t\t\tinnerHTML={this.templateResolver(item, isSelected)}\n\t\t\t\t\t\t\t\trole={\"option\"}\n\t\t\t\t\t\t\t\taria-posinset={index}\n\t\t\t\t\t\t\t\ttabindex={isSelected ? 0 : -1}\n\t\t\t\t\t\t\t\taria-setsize={this.list.length}\n\t\t\t\t\t\t\t\tonClick={() => this.onSelectHandler(index)}\n\t\t\t\t\t\t\t\taria-selected={toBoolAttr(isSelected)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t})}\n\t\t\t\t</ul>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\tthis.focused = true\n\t\tthis.arrowCounter = -1\n\t\tif ((this.value || this.minlength === 0) && this.searchCallback) {\n\t\t\tthis.doSearch()\n\t\t}\n\t\te.stopPropagation()\n\t\tthis.govFocus.emit({\n\t\t\toriginalEvent: e,\n\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\tvalue: this.value,\n\t\t\tselected: null\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\tthis.focused = false\n\t\tsetTimeout(() => (this.list = []), 200)\n\t\tthis.arrowCounter = -1\n\t\te.stopPropagation()\n\t\tthis.govBlur.emit({\n\t\t\toriginalEvent: e,\n\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\tvalue: this.value,\n\t\t\tselected: null\n\t\t})\n\t}\n\n\tprivate onInputHandler(e: InputEvent) {\n\t\tthis.value = (e.target as HTMLGovFormInputElement).value\n\t\te.stopPropagation()\n\t\tthis.govInput.emit({\n\t\t\toriginalEvent: e,\n\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\tvalue: this.value,\n\t\t\tselected: null\n\t\t})\n\t\tthis.doSearch()\n\t}\n\n\tprivate onSelectHandler(index = -1) {\n\t\tlet selected: Nullable<GovFormAutocompleteItem> = null\n\t\tif (index > -1) {\n\t\t\tselected = this.list[index]\n\t\t} else if (has(this.arrowCounter, this.list)) {\n\t\t\tselected = this.list[this.arrowCounter]\n\t\t}\n\t\tif (selected) {\n\t\t\tthis.govSelect.emit({\n\t\t\t\tcomponent: FormAutocompleteClass.root,\n\t\t\t\tvalue: this.value,\n\t\t\t\tselected: selected\n\t\t\t})\n\t\t\tthis.list = []\n\t\t\tif (has(this.nameKey, selected) && typeof selected[this.nameKey] === \"string\") {\n\t\t\t\tthis.value = selected[this.nameKey]\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate onKeyUpHandler(e: CustomEvent) {\n\t\tconst event = (e.detail as FormInputEvent).originalEvent as KeyboardEvent\n\t\te.stopPropagation()\n\t\tif (event.keyCode === 38) this.onArrowUp()\n\t\telse if (event.keyCode === 40) this.onArrowDown()\n\t\telse if (event.keyCode === 13) this.onSelectHandler()\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync setFocus(options?: FocusOptions): Promise<void> {\n\t\treturn this.inputRef.focus(options)\n\t}\n\n\t/**\n\t * Clears whisperer value\n\t */\n\t@Method()\n\tasync clearValue(): Promise<void> {\n\t\tthis.value = \"\"\n\t\tthis.inputRef.value = \"\"\n\n\t\tawait this.inputRef.clearValue()\n\t}\n\n\t/**\n\t * Set a custom asynchronous function for the whisperer\n\t */\n\t@Method()\n\tasync setSearchCallback(callback: (value: string) => Promise<any>) {\n\t\tthis.searchCallback = callback\n\t}\n\n\t/**\n\t * Setting a custom whisper result template\n\t * @param callback\n\t */\n\t@Method()\n\tasync setTemplateResolver(callback: (item: GovFormAutocompleteItem) => string) {\n\t\tthis.templateResolver = callback\n\t}\n}\n"],"version":3}

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

@@ -1,122 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-29ac07f6.js');
-const string_utils = require('./string.utils-0f08c48c.js');
-const props = require('./props-5f82e4c0.js');
-const form = require('./form-9b8b1740.js');
-const template = require('./template-e1c4ff78.js');
-const wcag = require('./wcag-6efc0ab7.js');
-const win = require('./win-84bda0aa.js');
-const utils = require('./utils-c9b1bba3.js');
-const Fragment = require('./Fragment-52846f79.js');
-require('./gov.log-0c9dca27.js');
-require('./sizes-79872c2a.js');
-require('./variants-f5ffeef3.js');
-require('./constants-e8760a84.js');
-require('./constants-caad94b4.js');
-require('./constants-86fb4eb4.js');
-require('./constants-97eea364.js');
-
-const govFormCheckboxCss = ".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-checkbox{cursor:pointer}.gov-form-checkbox input{position:absolute;top:0;left:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.gov-form-checkbox input+span{position:relative;display:block}.gov-form-checkbox input+span::before{content:\"\";position:absolute;display:block;top:0;left:0;border:var(--gov-form-checkbox-border-size, 0.125rem solid var(--gov-color-primary));background-color:var(--gov-form-checkbox-background-color, var(--gov-color-neutral-white));transition:150ms linear border-color, 150ms linear background-color, 150ms linear outline-color}.gov-form-checkbox .gov-form-label__label{position:relative;z-index:1;width:100%}.gov-form-checkbox input:focus-visible+span::before{outline:var(--gov-outline-width, 0.125rem) solid var(--gov-color-focus-base)}[invalid=\"\"].gov-form-checkbox .gov-form-label__label,[invalid=true i].gov-form-checkbox .gov-form-label__label,[invalid=\"1\"].gov-form-checkbox .gov-form-label__label{color:var(--gov-form-state-color-error, var(--gov-color-error))}[invalid=\"\"].gov-form-checkbox input+span::before,[invalid=true i].gov-form-checkbox input+span::before,[invalid=\"1\"].gov-form-checkbox input+span::before{border-color:var(--gov-form-state-color-error, var(--gov-color-error))}[disabled=\"\"].gov-form-checkbox,[disabled=true i].gov-form-checkbox,[disabled=\"1\"].gov-form-checkbox{pointer-events:none}[disabled=\"\"].gov-form-checkbox .gov-form-label__label,[disabled=true i].gov-form-checkbox .gov-form-label__label,[disabled=\"1\"].gov-form-checkbox .gov-form-label__label{color:var(--gov-form-state-color-disabled, var(--gov-color-secondary-600))}[disabled=\"\"].gov-form-checkbox input+span::before,[disabled=true i].gov-form-checkbox input+span::before,[disabled=\"1\"].gov-form-checkbox input+span::before{border-color:var(--gov-form-input-disabled-bg, var(--gov-color-primary-400))}[size=xs].gov-form-checkbox{font-weight:var(--gov-text-xs-font-weight);font-size:var(--gov-text-xs-font-size);line-height:var(--gov-text-xs-line-height);letter-spacing:var(--gov-text-xs-letter-spacing);display:block;min-width:var(--gov-form-checkbox-core-xs-indicator-size, 1.25rem);min-height:var(--gov-form-checkbox-core-xs-indicator-size, 1.25rem)}[size=xs].gov-form-checkbox .gov-form-label__label{padding-top:calc((var(--gov-form-checkbox-core-xs-indicator-size, 1.25rem) - var(--gov-text-xs-font-size) * 1.5) / 2);padding-left:calc(var(--gov-form-checkbox-core-xs-indicator-size, 1.25rem) + var(--gov-form-checkbox-core-xs-gap, 0.75rem))}[size=xs].gov-form-checkbox input+span::before{width:var(--gov-form-checkbox-core-xs-indicator-size, 1.25rem);height:var(--gov-form-checkbox-core-xs-indicator-size, 1.25rem)}[size=s].gov-form-checkbox{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);display:block;min-width:var(--gov-form-checkbox-core-s-indicator-size, 1.375rem);min-height:var(--gov-form-checkbox-core-s-indicator-size, 1.375rem)}[size=s].gov-form-checkbox .gov-form-label__label{padding-top:calc((var(--gov-form-checkbox-core-s-indicator-size, 1.375rem) - var(--gov-text-s-font-size) * 1.5) / 2);padding-left:calc(var(--gov-form-checkbox-core-s-indicator-size, 1.375rem) + var(--gov-form-checkbox-core-s-gap, 0.75rem))}[size=s].gov-form-checkbox input+span::before{width:var(--gov-form-checkbox-core-s-indicator-size, 1.375rem);height:var(--gov-form-checkbox-core-s-indicator-size, 1.375rem)}[size=m].gov-form-checkbox{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);display:block;min-width:var(--gov-form-checkbox-core-m-indicator-size, 1.5rem);min-height:var(--gov-form-checkbox-core-m-indicator-size, 1.5rem)}[size=m].gov-form-checkbox .gov-form-label__label{padding-top:calc((var(--gov-form-checkbox-core-m-indicator-size, 1.5rem) - var(--gov-text-m-font-size) * 1.5) / 2);padding-left:calc(var(--gov-form-checkbox-core-m-indicator-size, 1.5rem) + var(--gov-form-checkbox-core-m-gap, 1rem))}[size=m].gov-form-checkbox input+span::before{width:var(--gov-form-checkbox-core-m-indicator-size, 1.5rem);height:var(--gov-form-checkbox-core-m-indicator-size, 1.5rem)}[size=l].gov-form-checkbox{font-weight:var(--gov-text-l-font-weight);font-size:var(--gov-text-l-font-size);line-height:var(--gov-text-l-line-height);letter-spacing:var(--gov-text-l-letter-spacing);display:block;min-width:var(--gov-form-checkbox-core-l-indicator-size, 2rem);min-height:var(--gov-form-checkbox-core-l-indicator-size, 2rem)}[size=l].gov-form-checkbox .gov-form-label__label{padding-top:calc((var(--gov-form-checkbox-core-l-indicator-size, 2rem) - var(--gov-text-l-font-size) * 1.5) / 2);padding-left:calc(var(--gov-form-checkbox-core-l-indicator-size, 2rem) + var(--gov-form-checkbox-core-l-gap, 1rem))}[size=l].gov-form-checkbox input+span::before{width:var(--gov-form-checkbox-core-l-indicator-size, 2rem);height:var(--gov-form-checkbox-core-l-indicator-size, 2rem)}.gov-form-checkbox input+span::before{border-radius:var(--gov-border-radius, 0.1875rem)}.gov-form-checkbox__check{position:absolute;color:var(--gov-form-checkbox-check-color, var(--gov-color-neutral-white));opacity:0;transition:150ms linear opacity}.gov-form-checkbox input:checked+span::before{background:var(--gov-form-checkbox-indicator-bg, var(--gov-color-primary))}input:checked+span .gov-form-checkbox__check{opacity:1}.gov-form-checkbox[invalid=\"\"] input:checked+span::before,.gov-form-checkbox[invalid=true i] input:checked+span::before,.gov-form-checkbox[invalid=\"1\"] input:checked+span::before{background:var(--gov-form-state-color-error, var(--gov-color-error))}.gov-form-checkbox[disabled=\"\"] input:checked+span::before,.gov-form-checkbox[disabled=true i] input:checked+span::before,.gov-form-checkbox[disabled=\"1\"] input:checked+span::before{border-color:var(--gov-form-input-disabled-bg, var(--gov-color-primary-400));background-color:var(--gov-form-input-disabled-bg, var(--gov-color-primary-400))}.gov-form-checkbox[size=xs] .gov-form-checkbox__check{top:calc((var(--gov-form-checkbox-core-xs-indicator-size, 1.25rem) - var(--gov-form-checkbox-core-xs-check-size, 0.75rem)) / 2);left:calc((var(--gov-form-checkbox-core-xs-indicator-size, 1.25rem) - var(--gov-form-checkbox-core-xs-check-size, 0.75rem)) / 2);width:var(--gov-form-checkbox-core-xs-check-size, 0.75rem);height:var(--gov-form-checkbox-core-xs-check-size, 0.75rem)}.gov-form-checkbox[size=s] .gov-form-checkbox__check{top:calc((var(--gov-form-checkbox-core-s-indicator-size, 1.375rem) - var(--gov-form-checkbox-core-s-check-size, 0.825rem)) / 2);left:calc((var(--gov-form-checkbox-core-s-indicator-size, 1.375rem) - var(--gov-form-checkbox-core-s-check-size, 0.825rem)) / 2);width:var(--gov-form-checkbox-core-s-check-size, 0.825rem);height:var(--gov-form-checkbox-core-s-check-size, 0.825rem)}.gov-form-checkbox[size=m] .gov-form-checkbox__check{top:calc((var(--gov-form-checkbox-core-m-indicator-size, 1.5rem) - var(--gov-form-checkbox-core-m-check-size, 0.9rem)) / 2);left:calc((var(--gov-form-checkbox-core-m-indicator-size, 1.5rem) - var(--gov-form-checkbox-core-m-check-size, 0.9rem)) / 2);width:var(--gov-form-checkbox-core-m-check-size, 0.9rem);height:var(--gov-form-checkbox-core-m-check-size, 0.9rem)}.gov-form-checkbox[size=l] .gov-form-checkbox__check{top:calc((var(--gov-form-checkbox-core-l-indicator-size, 2rem) - var(--gov-form-checkbox-core-l-check-size, 1.2rem)) / 2);left:calc((var(--gov-form-checkbox-core-l-indicator-size, 2rem) - var(--gov-form-checkbox-core-l-check-size, 1.2rem)) / 2);width:var(--gov-form-checkbox-core-l-check-size, 1.2rem);height:var(--gov-form-checkbox-core-l-check-size, 1.2rem)}";
-
-const GovFormCheckbox = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.govFocus = index.createEvent(this, "gov-focus", 7);
-    this.govBlur = index.createEvent(this, "gov-blur", 7);
-    this.govChange = index.createEvent(this, "gov-change", 7);
-    this.value = undefined;
-    this.checked = false;
-    this.required = false;
-    this.disabled = undefined;
-    this.name = undefined;
-    this.size = "m";
-    this.identifier = undefined;
-    this.noLabel = false;
-    this.invalid = undefined;
-    this.wcagDescribedBy = undefined;
-    this.wcagLabelledBy = undefined;
-    this.checkboxId = string_utils.createID("GovCheckbox");
-    this.h = template.govHost(this.host);
-    this.f = form.govForm(this.h);
-  }
-  validateSize(newValue) {
-    props.validateProp(form.FormCheckboxSizes, newValue, form.FormCheckboxClass.root);
-  }
-  componentWillLoad() {
-    this.f.passAttrToControl("type", "checkbox");
-  }
-  async componentDidRender() {
-    this.f.passAttrToLabel("identifier", this.identifier || this.checkboxId);
-    this.f.passAttrToLabel("required", String(this.required));
-    if (win.canValidateWcagOnRender()) {
-      await utils.delay(500);
-      await this.validateWcag();
-    }
-  }
-  render() {
-    const wrapCheckbox = (children) => {
-      if (this.noLabel) {
-        return (index.h("label", null, children));
-      }
-      return children;
-    };
-    return (index.h(index.Host, { class: form.FormCheckboxClass.root, checked: this.checked, size: this.size, invalid: template.toBoolAttrIfDefined(this.invalid) }, wrapCheckbox(index.h(Fragment.Fragment, null, index.h("input", { id: this.identifier || this.checkboxId, type: "checkbox", value: this.value, name: this.name, checked: this.checked, onClick: this.onClickHandler.bind(this), onChange: this.onChangeHandler.bind(this), onFocus: this.onFocusHandler.bind(this), onBlur: this.onBlurHandler.bind(this), required: this.required, ref: el => (this.inputRef = el), "aria-checked": template.toBoolAttr(this.checked), "aria-required": template.toBoolAttrIfDefined(this.required), "aria-invalid": template.toBoolAttrIfDefined(this.invalid), "aria-describedby": this.wcagDescribedBy, "aria-labelledby": this.wcagLabelledBy, "aria-disabled": template.toBoolAttrIfDefined(this.disabled) }), index.h("span", null, index.h("slot", { name: "label" }), index.h("gov-icon", { class: form.FormCheckboxClass.check, name: "check-lg" }))))));
-  }
-  onFocusHandler(e) {
-    e.stopPropagation();
-    this.govFocus.emit({
-      component: form.FormCheckboxClass.root,
-      value: this.value,
-      checked: this.checked,
-      originalEvent: e,
-    });
-  }
-  onBlurHandler(e) {
-    e.stopPropagation();
-    this.govBlur.emit({
-      component: form.FormCheckboxClass.root,
-      value: this.value,
-      checked: this.checked,
-      originalEvent: e,
-    });
-  }
-  onClickHandler(e) {
-    e.stopPropagation();
-  }
-  onChangeHandler(e) {
-    this.checked = e.target.checked;
-    e.stopPropagation();
-    this.govChange.emit({
-      component: form.FormCheckboxClass.root,
-      value: this.value,
-      checked: this.checked,
-      originalEvent: e,
-    });
-  }
-  /**
-   * Returns the reference of the native element
-   */
-  async getRef() {
-    return this.inputRef;
-  }
-  /**
-   * Validate the WCAG attributes of the component
-   */
-  async validateWcag() {
-    wcag.validateWcagRef(this.wcagDescribedBy, "wcag-described-by", form.FormCheckboxClass.root);
-    wcag.validateWcagRef(this.wcagLabelledBy, "wcag-labelled-by", form.FormCheckboxClass.root);
-    wcag.validateWcagLabelFor(this.identifier || this.checkboxId, this.wcagLabelledBy, form.FormCheckboxClass.root);
-  }
-  get host() { return index.getElement(this); }
-  static get watchers() { return {
-    "size": ["validateSize"]
-  }; }
-};
-GovFormCheckbox.style = govFormCheckboxCss;
-
-exports.gov_form_checkbox = GovFormCheckbox;
-
-//# sourceMappingURL=gov-form-checkbox.cjs.entry.js.map

package/dist/cjs/gov-form-checkbox.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"gov-form-checkbox.entry.cjs.js","mappings":"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","names":["createID","govHost","govForm","validateProp","FormCheckboxSizes","FormCheckboxClass","canValidateWcagOnRender","delay","h","Host","toBoolAttrIfDefined","Fragment","toBoolAttr","validateWcagRef","validateWcagLabelFor"],"sources":["../../../packages/core/src/components/gov-form/checkbox/gov-form-checkbox.scss?tag=gov-form-checkbox","../../../packages/core/src/components/gov-form/checkbox/gov-form-checkbox.tsx"],"sourcesContent":["/*\n *   Checkbox\n */\n\n@import \"../checkbox/gov-form-checkbox-core.scss\";\n$class: \".gov-form-checkbox\";\n\n#{$class} {\n\t@extend %form-checkbox-core;\n\tinput + span {\n\t\t&::before {\n\t\t\tborder-radius: $border-radius;\n\t\t}\n\t}\n\t&__check {\n\t\tposition: absolute;\n\t\tcolor: $form-checkbox-check-color;\n\t\topacity: 0;\n\t\ttransition: $t linear opacity;\n\t}\n\n\t// STATES\n\tinput:checked + span::before {\n\t\tbackground: $form-checkbox-indicator-bg;\n\t}\n\tinput:checked + span &__check {\n\t\topacity: 1;\n\t}\n\t@include parameter(\"invalid\") {\n\t\tinput:checked + span::before {\n\t\t\tbackground: $form-state-color-error;\n\t\t}\n\t}\n\t@include parameter(\"disabled\") {\n\t\tinput:checked + span::before {\n\t\t\tborder-color: $form-state-bg-disabled;\n\t\t\tbackground-color: $form-state-bg-disabled;\n\t\t}\n\t}\n\n\t// VARIANTS\n\t@each $size, $definitions in $form-checkbox-core-sizes {\n\t\t&[size=\"#{$size}\"] {\n\t\t\t#{$class} {\n\t\t\t\t&__check {\n\t\t\t\t\ttop: calc((get(\"indicator-size\", $definitions) - get(\"check-size\", $definitions)) / 2);\n\t\t\t\t\tleft: calc((get(\"indicator-size\", $definitions) - get(\"check-size\", $definitions)) / 2);\n\t\t\t\t\twidth: get(\"check-size\", $definitions);\n\t\t\t\t\theight: get(\"check-size\", $definitions);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, Watch, Method } from \"@stencil/core\"\nimport { createID } from \"../../../utils/string.utils\"\nimport { validateProp } from \"../../../helpers/Validate/props\"\nimport { FormCheckboxClass, FormCheckboxSizes, FormCheckboxSizesType } from \"./constants\"\nimport { toBoolAttrIfDefined } from \"../../../helpers/Dom/template\"\nimport { validateWcagLabelFor, validateWcagRef } from \"../../../helpers/Validate/wcag\"\nimport { canValidateWcagOnRender } from \"../../../helpers/Dom/win\"\nimport { delay } from \"../../../utils/utils\"\nimport { GovForm } from \"../../../helpers/Dom/form.types\"\nimport { govHost, toBoolAttr } from \"../../../helpers/Dom/template\"\nimport { GovHost } from \"../../../helpers/Dom/template.types\"\nimport { govForm } from \"../../../helpers/Dom/form\"\nimport Fragment from \"../../../helpers/Fragment\"\nimport { FormCheckboxEvent } from \"./gov-form-checkbox.types\"\n\n@Component({\n\ttag: \"gov-form-checkbox\",\n\tstyleUrl: \"gov-form-checkbox.scss\",\n})\nexport class GovFormCheckbox {\n\tprivate readonly h: GovHost\n\tprivate f: GovForm\n\tprivate inputRef?: HTMLInputElement\n\n\tprivate readonly checkboxId: string\n\n\tconstructor() {\n\t\tthis.checkboxId = createID(\"GovCheckbox\")\n\n\t\tthis.h = govHost(this.host)\n\t\tthis.f = govForm(this.h)\n\t}\n\n\t@Element() host: HTMLGovFormCheckboxElement\n\t/**\n\t * Value of checkbox\n\t */\n\t@Prop() readonly value: string\n\t/**\n\t * Checkbox default state\n\t */\n\t@Prop({ reflect: true, mutable: true }) checked = false\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the checkbox component disabled.\n\t * This prevents users from being able to interact with the checkbox, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean\n\t/**\n\t * Name of the checkbox.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Checkboxes size.\n\t */\n\t@Prop() readonly size?: FormCheckboxSizesType = \"m\"\n\t/**\n\t * Custom checkbox identifier.\n\t */\n\t@Prop({ attribute: \"identifier\" }) readonly identifier: string\n\t/**\n\t * When you can't use the form label.\n\t */\n\t@Prop({ attribute: \"no-label\" }) readonly noLabel: boolean = false\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: \"wcag-described-by\" }) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({ attribute: \"wcag-labelled-by\" }) readonly wcagLabelledBy: string\n\t/**\n\t * Emitted when the checkbox has focus.\n\t */\n\t@Event({ eventName: \"gov-focus\" }) govFocus: EventEmitter<FormCheckboxEvent>\n\t/**\n\t * Emitted when the checkbox loses focus.\n\t */\n\t@Event({ eventName: \"gov-blur\" }) govBlur: EventEmitter<FormCheckboxEvent>\n\t/**\n\t * Emitted when the checkbox change value.\n\t */\n\t@Event({ eventName: \"gov-change\" }) govChange: EventEmitter<FormCheckboxEvent>\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormCheckboxSizes, newValue, FormCheckboxClass.root)\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.f.passAttrToControl(\"type\", \"checkbox\")\n\t}\n\n\tasync componentDidRender() {\n\t\tthis.f.passAttrToLabel(\"identifier\", this.identifier || this.checkboxId)\n\t\tthis.f.passAttrToLabel(\"required\", String(this.required))\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\tconst wrapCheckbox = (children) => {\n\t\t\tif (this.noLabel) {\n\t\t\t\treturn (\n\t\t\t\t\t<label>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</label>\n\t\t\t\t)\n\t\t\t}\n\t\t\treturn children\n\t\t}\n\n\t\treturn (\n\t\t\t<Host class={FormCheckboxClass.root} checked={this.checked} size={this.size} invalid={toBoolAttrIfDefined(this.invalid)}>\n\t\t\t\t{wrapCheckbox(\n\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tid={this.identifier || this.checkboxId}\n\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\t\tchecked={this.checked}\n\t\t\t\t\t\t\tonClick={this.onClickHandler.bind(this)}\n\t\t\t\t\t\t\tonChange={this.onChangeHandler.bind(this)}\n\t\t\t\t\t\t\tonFocus={this.onFocusHandler.bind(this)}\n\t\t\t\t\t\t\tonBlur={this.onBlurHandler.bind(this)}\n\t\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\t\tref={el => (this.inputRef = el as HTMLInputElement)}\n\t\t\t\t\t\t\taria-checked={toBoolAttr(this.checked)}\n\t\t\t\t\t\t\taria-required={toBoolAttrIfDefined(this.required)}\n\t\t\t\t\t\t\taria-invalid={toBoolAttrIfDefined(this.invalid)}\n\t\t\t\t\t\t\taria-describedby={this.wcagDescribedBy}\n\t\t\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t<slot name=\"label\" />\n\t\t\t\t\t\t\t<gov-icon class={FormCheckboxClass.check} name=\"check-lg\"></gov-icon>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</Fragment>,\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.govFocus.emit({\n\t\t\tcomponent: FormCheckboxClass.root,\n\t\t\tvalue: this.value,\n\t\t\tchecked: this.checked,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.govBlur.emit({\n\t\t\tcomponent: FormCheckboxClass.root,\n\t\t\tvalue: this.value,\n\t\t\tchecked: this.checked,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onClickHandler(e: PointerEvent) {\n\t\te.stopPropagation()\n\t}\n\n\tprivate onChangeHandler(e: Event) {\n\t\tthis.checked = (e.target as HTMLInputElement).checked\n\t\te.stopPropagation()\n\t\tthis.govChange.emit({\n\t\t\tcomponent: FormCheckboxClass.root,\n\t\t\tvalue: this.value,\n\t\t\tchecked: this.checked,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\t/**\n\t * Returns the reference of the native element\n\t */\n\t@Method()\n\tasync getRef(): Promise<HTMLInputElement> {\n\t\treturn this.inputRef\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\tvalidateWcagRef(this.wcagDescribedBy, \"wcag-described-by\", FormCheckboxClass.root)\n\t\tvalidateWcagRef(this.wcagLabelledBy, \"wcag-labelled-by\", FormCheckboxClass.root)\n\t\tvalidateWcagLabelFor(this.identifier || this.checkboxId, this.wcagLabelledBy, FormCheckboxClass.root)\n\t}\n}\n"],"version":3}