npm - @utrecht/web-component-library-stencil - Versions diffs - 1.2.0 → 1.3.0 - Mend

@utrecht/web-component-library-stencil 1.2.0 → 1.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3162) hide show

package/dist/collection/components/digid-button.js CHANGED Viewed

@@ -9,7 +9,7 @@ export class DigidButton {
         this.type = undefined;
     }
     render() {
-        return (h("div", { class: "utrecht-digid-button" }, h("utrecht-digid-logo", { class: "utrecht-digid-button__logo" }), h("slot", null)));
+        return (h("div", { key: 'ecfb79329b3f94db24eef1385a1b9d1b15611217', class: "utrecht-digid-button" }, h("utrecht-digid-logo", { key: 'f15212932bd7d86d173b91ea3afa63fbec73c141', class: "utrecht-digid-button__logo" }), h("slot", { key: 'ced08d49c2d267b28be5a1f4168d2f8c3ee9d579' })));
     }
     static get is() { return "utrecht-digid-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/digid-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"digid-button.js","sourceRoot":"","sources":["~~../../../~~src/components/digid-button.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,WAAW;;;;IAEtB,MAAM;QACJ,OAAO,CACL,~~WAAK~~,KAAK,EAAC,sBAAsB;YAC/B,~~0BAAoB~~,KAAK,EAAC,4BAA4B,GAAG;YACzD,~~eAAa~~,CACT,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Rijksoverheid\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-digid-button',\n styleUrl: 'digid-button.scss',\n shadow: true,\n})\nexport class DigidButton {\n @Prop() type: string;\n render() {\n return (\n <div class=\"utrecht-digid-button\">\n <utrecht-digid-logo class=\"utrecht-digid-button__logo\" />\n <slot></slot>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"digid-button.js","sourceRoot":"","sources":["../../src/components/digid-button.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,WAAW;;;;IAEtB,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,sBAAsB;YAC/B,2EAAoB,KAAK,EAAC,4BAA4B,GAAG;YACzD,8DAAa,CACT,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Rijksoverheid\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-digid-button',\n styleUrl: 'digid-button.scss',\n shadow: true,\n})\nexport class DigidButton {\n @Prop() type: string;\n render() {\n return (\n <div class=\"utrecht-digid-button\">\n <utrecht-digid-logo class=\"utrecht-digid-button__logo\" />\n <slot></slot>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/digid-logo.js CHANGED Viewed

@@ -6,7 +6,7 @@
 import { h } from "@stencil/core";
 export class DigidLogo {
     render() {
-        return (h("svg", { class: "utrecht-icon", width: "100%", height: "100%", xmlns: "http://www.w3.org/2000/svg", version: "1.1", viewBox: "0 0 150 150" }, h("path", { d: "M136 150H14c-8 0-14-6-14-14V14C0 6 6 0 14 0h122c8 0 14 6 14 14v122c0 8-6 14-14 14z" }), h("path", { d: "M17 115V79h10c12 0 19 6 19 17 0 13-8 19-19 19H17zm6-6h4c7 0 12-4 12-13 0-8-5-12-13-12h-3v25zM54 77c3 0 4 1 4 3s-1 4-4 4c-2 0-3-2-3-4s1-3 3-3zm3 38h-6V88h6v27zM72 109h6c6 0 9 3 9 7 0 5-4 9-14 9-8 0-11-2-11-7 0-2 1-4 4-6l-2-3c0-2 1-3 3-4-3-2-4-4-4-8 0-6 4-10 11-10l4 1h9v4h-4l2 5c0 6-4 9-12 9h-3l-1 1c0 2 1 2 3 2zm1 12c6 0 8-2 8-4s-1-2-3-2l-9-1-2 3c0 2 2 4 6 4zm6-24c0-3-2-5-5-5s-5 1-5 5 1 5 5 5c3 0 5-1 5-5z", fill: "#FFFFFF" }), h("path", { d: "M94 77c2 0 3 1 3 3s-1 4-3 4c-3 0-4-2-4-4s1-3 4-3zm3 38h-6V88h6v27zM105 115V79h10c12 0 18 6 18 17 0 13-7 19-19 19h-9zm6-6h4c7 0 12-4 12-13 0-8-5-12-13-12h-3v25z", fill: "#E17000" })));
+        return (h("svg", { key: 'ffbe2c88c0c107e627bcc113c382a110c2b390c4', class: "utrecht-icon", width: "100%", height: "100%", xmlns: "http://www.w3.org/2000/svg", version: "1.1", viewBox: "0 0 150 150" }, h("path", { key: '6a2b3b3d152c02fe0d55cc958ac146679b35fd9c', d: "M136 150H14c-8 0-14-6-14-14V14C0 6 6 0 14 0h122c8 0 14 6 14 14v122c0 8-6 14-14 14z" }), h("path", { key: '82bfa64bc437c889215be728d86ef31f082244ab', d: "M17 115V79h10c12 0 19 6 19 17 0 13-8 19-19 19H17zm6-6h4c7 0 12-4 12-13 0-8-5-12-13-12h-3v25zM54 77c3 0 4 1 4 3s-1 4-4 4c-2 0-3-2-3-4s1-3 3-3zm3 38h-6V88h6v27zM72 109h6c6 0 9 3 9 7 0 5-4 9-14 9-8 0-11-2-11-7 0-2 1-4 4-6l-2-3c0-2 1-3 3-4-3-2-4-4-4-8 0-6 4-10 11-10l4 1h9v4h-4l2 5c0 6-4 9-12 9h-3l-1 1c0 2 1 2 3 2zm1 12c6 0 8-2 8-4s-1-2-3-2l-9-1-2 3c0 2 2 4 6 4zm6-24c0-3-2-5-5-5s-5 1-5 5 1 5 5 5c3 0 5-1 5-5z", fill: "#FFFFFF" }), h("path", { key: '270007edb1f36f471f8a370f4d64ec2daed58581', d: "M94 77c2 0 3 1 3 3s-1 4-3 4c-3 0-4-2-4-4s1-3 4-3zm3 38h-6V88h6v27zM105 115V79h10c12 0 18 6 18 17 0 13-7 19-19 19h-9zm6-6h4c7 0 12-4 12-13 0-8-5-12-13-12h-3v25z", fill: "#E17000" })));
     }
     static get is() { return "utrecht-digid-logo"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/digid-logo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"digid-logo.js","sourceRoot":"","sources":["~~../../../~~src/components/digid-logo.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,SAAS;IACpB,MAAM;QACJ,OAAO,CACL,~~WACE~~,KAAK,EAAC,cAAc,EACpB,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,KAAK,EACb,OAAO,EAAC,aAAa;YAErB,~~YAAM~~,CAAC,EAAC,oFAAoF,GAAG;YAC/F,~~YACE~~,CAAC,EAAC,wZAAwZ,EAC1Z,IAAI,EAAC,SAAS,GACd;YACF,~~YACE~~,CAAC,EAAC,iKAAiK,EACnK,IAAI,EAAC,SAAS,GACd,CACE,CACP,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Rijksoverheid\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-digid-logo',\n styleUrl: 'digid-logo.scss',\n shadow: true,\n})\nexport class DigidLogo {\n render() {\n return (\n <svg\n class=\"utrecht-icon\"\n width=\"100%\"\n height=\"100%\"\n xmlns=\"http://www.w3.org/2000/svg\"\n version=\"1.1\"\n viewBox=\"0 0 150 150\"\n >\n <path d=\"M136 150H14c-8 0-14-6-14-14V14C0 6 6 0 14 0h122c8 0 14 6 14 14v122c0 8-6 14-14 14z\" />\n <path\n d=\"M17 115V79h10c12 0 19 6 19 17 0 13-8 19-19 19H17zm6-6h4c7 0 12-4 12-13 0-8-5-12-13-12h-3v25zM54 77c3 0 4 1 4 3s-1 4-4 4c-2 0-3-2-3-4s1-3 3-3zm3 38h-6V88h6v27zM72 109h6c6 0 9 3 9 7 0 5-4 9-14 9-8 0-11-2-11-7 0-2 1-4 4-6l-2-3c0-2 1-3 3-4-3-2-4-4-4-8 0-6 4-10 11-10l4 1h9v4h-4l2 5c0 6-4 9-12 9h-3l-1 1c0 2 1 2 3 2zm1 12c6 0 8-2 8-4s-1-2-3-2l-9-1-2 3c0 2 2 4 6 4zm6-24c0-3-2-5-5-5s-5 1-5 5 1 5 5 5c3 0 5-1 5-5z\"\n fill=\"#FFFFFF\"\n />\n <path\n d=\"M94 77c2 0 3 1 3 3s-1 4-3 4c-3 0-4-2-4-4s1-3 4-3zm3 38h-6V88h6v27zM105 115V79h10c12 0 18 6 18 17 0 13-7 19-19 19h-9zm6-6h4c7 0 12-4 12-13 0-8-5-12-13-12h-3v25z\"\n fill=\"#E17000\"\n />\n </svg>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"digid-logo.js","sourceRoot":"","sources":["../../src/components/digid-logo.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,SAAS;IACpB,MAAM;QACJ,OAAO,CACL,4DACE,KAAK,EAAC,cAAc,EACpB,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,KAAK,EACb,OAAO,EAAC,aAAa;YAErB,6DAAM,CAAC,EAAC,oFAAoF,GAAG;YAC/F,6DACE,CAAC,EAAC,wZAAwZ,EAC1Z,IAAI,EAAC,SAAS,GACd;YACF,6DACE,CAAC,EAAC,iKAAiK,EACnK,IAAI,EAAC,SAAS,GACd,CACE,CACP,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Rijksoverheid\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-digid-logo',\n styleUrl: 'digid-logo.scss',\n shadow: true,\n})\nexport class DigidLogo {\n render() {\n return (\n <svg\n class=\"utrecht-icon\"\n width=\"100%\"\n height=\"100%\"\n xmlns=\"http://www.w3.org/2000/svg\"\n version=\"1.1\"\n viewBox=\"0 0 150 150\"\n >\n <path d=\"M136 150H14c-8 0-14-6-14-14V14C0 6 6 0 14 0h122c8 0 14 6 14 14v122c0 8-6 14-14 14z\" />\n <path\n d=\"M17 115V79h10c12 0 19 6 19 17 0 13-8 19-19 19H17zm6-6h4c7 0 12-4 12-13 0-8-5-12-13-12h-3v25zM54 77c3 0 4 1 4 3s-1 4-4 4c-2 0-3-2-3-4s1-3 3-3zm3 38h-6V88h6v27zM72 109h6c6 0 9 3 9 7 0 5-4 9-14 9-8 0-11-2-11-7 0-2 1-4 4-6l-2-3c0-2 1-3 3-4-3-2-4-4-4-8 0-6 4-10 11-10l4 1h9v4h-4l2 5c0 6-4 9-12 9h-3l-1 1c0 2 1 2 3 2zm1 12c6 0 8-2 8-4s-1-2-3-2l-9-1-2 3c0 2 2 4 6 4zm6-24c0-3-2-5-5-5s-5 1-5 5 1 5 5 5c3 0 5-1 5-5z\"\n fill=\"#FFFFFF\"\n />\n <path\n d=\"M94 77c2 0 3 1 3 3s-1 4-3 4c-3 0-4-2-4-4s1-3 4-3zm3 38h-6V88h6v27zM105 115V79h10c12 0 18 6 18 17 0 13-7 19-19 19h-9zm6-6h4c7 0 12-4 12-13 0-8-5-12-13-12h-3v25z\"\n fill=\"#E17000\"\n />\n </svg>\n );\n }\n}\n"]}

package/dist/collection/components/document.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class Document {
     render() {
-        return (h("div", { class: "utrecht-document" }, h("slot", null)));
+        return (h("div", { key: 'be18a2c99bc791af1137423662c75c84d8169267', class: "utrecht-document" }, h("slot", { key: '76f35358437a46b7de48f27b54545e033870b38b' })));
     }
     static get is() { return "utrecht-document"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/document.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"document.js","sourceRoot":"","sources":["~~../../../~~src/components/document.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,QAAQ;IACnB,MAAM;QACJ,OAAO,CACL,~~WAAK~~,KAAK,EAAC,kBAAkB;YAC3B,~~eAAa~~,CACT,CACP,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-document',\n styleUrl: 'document.scss',\n shadow: true,\n})\nexport class Document {\n render() {\n return (\n <div class=\"utrecht-document\">\n <slot></slot>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"document.js","sourceRoot":"","sources":["../../src/components/document.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,QAAQ;IACnB,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,kBAAkB;YAC3B,8DAAa,CACT,CACP,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-document',\n styleUrl: 'document.scss',\n shadow: true,\n})\nexport class Document {\n render() {\n return (\n <div class=\"utrecht-document\">\n <slot></slot>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/drawer.js CHANGED Viewed

@@ -12,12 +12,12 @@ export class Drawer {
     }
     render() {
         const { align, open } = this;
-        return (h("dialog", { ref: (el) => (this.dialogElement = el), class: clsx('utrecht-drawer', {
+        return (h("dialog", { key: '6767d8b4cb212e56257eb1ecd9be0df88476fbd7', ref: (el) => (this.dialogElement = el), class: clsx('utrecht-drawer', {
                 'utrecht-drawer--block-end': align === 'block-end',
                 'utrecht-drawer--block-start': align === 'block-start',
                 'utrecht-drawer--inline-end': align === 'inline-end' || !align,
                 'utrecht-drawer--inline-start': align === 'inline-start',
-            }), open: open }, h("slot", null)));
+            }), open: open }, h("slot", { key: '2dea76a210acfcb5bc0de8126d29ab77999ea306' })));
     }
     async close() {
         var _a;

package/dist/collection/components/drawer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"drawer.js","sourceRoot":"","sources":["~~../../../~~src/components/drawer.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,OAAO,MAAM;;;oBAEO,KAAK;;IAI7B,MAAM;QACJ,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;QAC7B,OAAO,CACL,~~cACE,~~GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,EAAuB,CAAC,EAC3D,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE;gBAC5B,2BAA2B,EAAE,KAAK,KAAK,WAAW;gBAClD,6BAA6B,EAAE,KAAK,KAAK,aAAa;gBACtD,4BAA4B,EAAE,KAAK,KAAK,YAAY,IAAI,CAAC,KAAK;gBAC9D,8BAA8B,EAAE,KAAK,KAAK,cAAc;aACzD,CAAC,EACF,IAAI,EAAE,IAAI;YAEV,~~eAAa~~,CACN,CACV,CAAC;IACJ,CAAC;IAGD,KAAK,CAAC,KAAK;;QACT,MAAA,IAAI,CAAC,aAAa,0CAAE,KAAK,EAAE,CAAC;IAC9B,CAAC;IAGD,KAAK,CAAC,SAAS;;QACb,oEAAoE;QACpE,wDAAwD;QACxD,iEAAiE;QACjE,oFAAoF;QACpF,MAAA,IAAI,CAAC,aAAa,0CAAE,KAAK,EAAE,CAAC;QAC5B,MAAA,IAAI,CAAC,aAAa,0CAAE,SAAS,EAAE,CAAC;IAClC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2020-2022 Gemeente Utrecht\n * Copyright (c) 2020-2022 Frameless B.V.\n */\n\nimport { Component, h, Method, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-drawer',\n styleUrl: 'drawer.scss',\n shadow: true,\n})\nexport class Drawer {\n @Prop() align: string;\n @Prop() open: boolean = false;\n\n dialogElement!: HTMLDialogElement;\n\n render() {\n const { align, open } = this;\n return (\n <dialog\n ref={(el) => (this.dialogElement = el as HTMLDialogElement)}\n class={clsx('utrecht-drawer', {\n 'utrecht-drawer--block-end': align === 'block-end',\n 'utrecht-drawer--block-start': align === 'block-start',\n 'utrecht-drawer--inline-end': align === 'inline-end' \|\| !align,\n 'utrecht-drawer--inline-start': align === 'inline-start',\n })}\n open={open}\n >\n <slot></slot>\n </dialog>\n );\n }\n\n @Method()\n async close() {\n this.dialogElement?.close();\n }\n\n @Method()\n async showModal() {\n // Dialog must not be `open` initially, prevent the following error:\n // \"Cannot call showModal() on an open non-modal dialog\"\n // Close the dialog first, to transition from non-modal to modal.\n // Ideally we would't `close()` the dialog when we know the dialog is already modal.\n this.dialogElement?.close();\n this.dialogElement?.showModal();\n }\n}\n"]}
1	+ {"version":3,"file":"drawer.js","sourceRoot":"","sources":["../../src/components/drawer.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,OAAO,MAAM;;;oBAEO,KAAK;;IAI7B,MAAM;QACJ,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;QAC7B,OAAO,CACL,+DACE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,EAAuB,CAAC,EAC3D,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE;gBAC5B,2BAA2B,EAAE,KAAK,KAAK,WAAW;gBAClD,6BAA6B,EAAE,KAAK,KAAK,aAAa;gBACtD,4BAA4B,EAAE,KAAK,KAAK,YAAY,IAAI,CAAC,KAAK;gBAC9D,8BAA8B,EAAE,KAAK,KAAK,cAAc;aACzD,CAAC,EACF,IAAI,EAAE,IAAI;YAEV,8DAAa,CACN,CACV,CAAC;IACJ,CAAC;IAGD,KAAK,CAAC,KAAK;;QACT,MAAA,IAAI,CAAC,aAAa,0CAAE,KAAK,EAAE,CAAC;IAC9B,CAAC;IAGD,KAAK,CAAC,SAAS;;QACb,oEAAoE;QACpE,wDAAwD;QACxD,iEAAiE;QACjE,oFAAoF;QACpF,MAAA,IAAI,CAAC,aAAa,0CAAE,KAAK,EAAE,CAAC;QAC5B,MAAA,IAAI,CAAC,aAAa,0CAAE,SAAS,EAAE,CAAC;IAClC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2020-2022 Gemeente Utrecht\n * Copyright (c) 2020-2022 Frameless B.V.\n */\n\nimport { Component, h, Method, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-drawer',\n styleUrl: 'drawer.scss',\n shadow: true,\n})\nexport class Drawer {\n @Prop() align: string;\n @Prop() open: boolean = false;\n\n dialogElement!: HTMLDialogElement;\n\n render() {\n const { align, open } = this;\n return (\n <dialog\n ref={(el) => (this.dialogElement = el as HTMLDialogElement)}\n class={clsx('utrecht-drawer', {\n 'utrecht-drawer--block-end': align === 'block-end',\n 'utrecht-drawer--block-start': align === 'block-start',\n 'utrecht-drawer--inline-end': align === 'inline-end' \|\| !align,\n 'utrecht-drawer--inline-start': align === 'inline-start',\n })}\n open={open}\n >\n <slot></slot>\n </dialog>\n );\n }\n\n @Method()\n async close() {\n this.dialogElement?.close();\n }\n\n @Method()\n async showModal() {\n // Dialog must not be `open` initially, prevent the following error:\n // \"Cannot call showModal() on an open non-modal dialog\"\n // Close the dialog first, to transition from non-modal to modal.\n // Ideally we would't `close()` the dialog when we know the dialog is already modal.\n this.dialogElement?.close();\n this.dialogElement?.showModal();\n }\n}\n"]}

package/dist/collection/components/eherkenning-logo.js CHANGED Viewed

@@ -6,7 +6,7 @@
 import { h } from "@stencil/core";
 export class EherkenningLogo {
     render() {
-        return (h("svg", { class: "utrecht-icon", xmlns: "http://www.w3.org/2000/svg", version: "1.1", viewBox: "-1 0 81 80" }, h("rect", { fill: "#E0E0E0", width: "80", height: "80" }), h("path", { "fill-rule": "evenodd", fill: "#00328C", d: "M37.363,23.178c0,2.027,0,4.055,0,6.08c-4.257,0-9.55,0-14.208,0  c-1.662,0-3.648-0.207-4.799,0.193c-1.041,0.359-1.796,1.169-2.176,2.111c-0.439,1.084-0.32,2.8-0.32,4.414c0,3.425,0,6.055,0,9.475  c0,1.531-0.159,3.325,0.191,4.479c0.316,1.042,1.316,2.194,2.561,2.496c1.318,0.319,3.094,0.064,4.672,0.064  c4.599,0,9.521,0,14.08,0c0,2.025,0,4.053,0,6.08c-6.402-0.083-12.492,0.112-18.176,0c-4.937-0.099-8.966-3.966-9.344-8.833  c-0.226-2.883,0-5.901,0-8.769c0-2.971-0.19-5.932,0-8.767c0.328-4.896,4.208-8.676,8.959-9.024c3.002-0.222,6.129,0,9.28,0  C31.145,23.178,34.26,23.178,37.363,23.178z" }), h("path", { "fill-rule": "evenodd", fill: "#FF0079", d: "M42.867,23.178c1.962,0,3.926,0,5.888,0c0,4.864,0,9.729,0,14.592  c-1.984,0-3.969,0-5.952,0c0-4.801,0-9.6,0-14.399C42.797,23.279,42.792,23.188,42.867,23.178z" }), h("path", { "fill-rule": "evenodd", fill: "#FF0079", d: "M64.434,23.178c1.941,0,3.883,0,5.824,0c0,11.798,0,23.595,0,35.393  c-1.962,0-3.926,0-5.888,0c0-4.992,0-9.984,0-14.977c-5.077,0-10.155,0-15.232,0c0.824-1.95,1.651-3.896,2.56-5.76  c4.203,0,8.405,0,12.608,0c0.15-4.693,0.021-9.664,0.064-14.464C64.365,23.279,64.36,23.188,64.434,23.178z" }), h("path", { "fill-rule": "evenodd", fill: "#00328C", d: "M19.89,37.77c5.376,0,10.752,0,16.129,0c-0.772,2.022-1.748,3.843-2.56,5.824  c-4.544,0-9.088,0-13.633,0c0-1.877,0-3.755,0-5.633C19.821,37.87,19.816,37.781,19.89,37.77z" }), h("path", { "fill-rule": "evenodd", fill: "#FF0079", d: "M42.93,43.594c1.941,0,3.883,0,5.824,0c0,4.992,0,9.984,0,14.977  c-1.984,0-3.969,0-5.952,0c0-4.93,0-9.856,0-14.783C42.8,43.678,42.851,43.62,42.93,43.594z" })));
+        return (h("svg", { key: '9cdc853752f5e66f8561517c1a8fa04e4b3f4692', class: "utrecht-icon", xmlns: "http://www.w3.org/2000/svg", version: "1.1", viewBox: "-1 0 81 80" }, h("rect", { key: '5f8462b4f0b0b83e928a7cc6e210060123123846', fill: "#E0E0E0", width: "80", height: "80" }), h("path", { key: '9bb70d897578c604e65f96d10f250f5fa5238ebb', "fill-rule": "evenodd", fill: "#00328C", d: "M37.363,23.178c0,2.027,0,4.055,0,6.08c-4.257,0-9.55,0-14.208,0  c-1.662,0-3.648-0.207-4.799,0.193c-1.041,0.359-1.796,1.169-2.176,2.111c-0.439,1.084-0.32,2.8-0.32,4.414c0,3.425,0,6.055,0,9.475  c0,1.531-0.159,3.325,0.191,4.479c0.316,1.042,1.316,2.194,2.561,2.496c1.318,0.319,3.094,0.064,4.672,0.064  c4.599,0,9.521,0,14.08,0c0,2.025,0,4.053,0,6.08c-6.402-0.083-12.492,0.112-18.176,0c-4.937-0.099-8.966-3.966-9.344-8.833  c-0.226-2.883,0-5.901,0-8.769c0-2.971-0.19-5.932,0-8.767c0.328-4.896,4.208-8.676,8.959-9.024c3.002-0.222,6.129,0,9.28,0  C31.145,23.178,34.26,23.178,37.363,23.178z" }), h("path", { key: '5d0b37410a40be16f15f1a6ddff369c00a981012', "fill-rule": "evenodd", fill: "#FF0079", d: "M42.867,23.178c1.962,0,3.926,0,5.888,0c0,4.864,0,9.729,0,14.592  c-1.984,0-3.969,0-5.952,0c0-4.801,0-9.6,0-14.399C42.797,23.279,42.792,23.188,42.867,23.178z" }), h("path", { key: '1a906a59e48a01c4d14fbbf1a40ba9ab67e61fda', "fill-rule": "evenodd", fill: "#FF0079", d: "M64.434,23.178c1.941,0,3.883,0,5.824,0c0,11.798,0,23.595,0,35.393  c-1.962,0-3.926,0-5.888,0c0-4.992,0-9.984,0-14.977c-5.077,0-10.155,0-15.232,0c0.824-1.95,1.651-3.896,2.56-5.76  c4.203,0,8.405,0,12.608,0c0.15-4.693,0.021-9.664,0.064-14.464C64.365,23.279,64.36,23.188,64.434,23.178z" }), h("path", { key: '2f71bf5483c1b2844bc664d0744bd411b5f7a07f', "fill-rule": "evenodd", fill: "#00328C", d: "M19.89,37.77c5.376,0,10.752,0,16.129,0c-0.772,2.022-1.748,3.843-2.56,5.824  c-4.544,0-9.088,0-13.633,0c0-1.877,0-3.755,0-5.633C19.821,37.87,19.816,37.781,19.89,37.77z" }), h("path", { key: '12c182a3e75fdd797146bb1ba5928b6032b3c887', "fill-rule": "evenodd", fill: "#FF0079", d: "M42.93,43.594c1.941,0,3.883,0,5.824,0c0,4.992,0,9.984,0,14.977  c-1.984,0-3.969,0-5.952,0c0-4.93,0-9.856,0-14.783C42.8,43.678,42.851,43.62,42.93,43.594z" })));
     }
     static get is() { return "utrecht-eherkenning-logo"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/eherkenning-logo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eherkenning-logo.js","sourceRoot":"","sources":["~~../../../~~src/components/eherkenning-logo.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,eAAe;IAC1B,MAAM;QACJ,OAAO,CACL,~~WAAK~~,KAAK,EAAC,cAAc,EAAC,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,EAAC,YAAY;YAC7F,~~YAAM~~,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG;YAC9C,~~yBACY~~,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,ykBAAykB,GAC3kB;YACF,~~yBACY~~,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,8JAA8J,GAChK;YACF,~~yBACY~~,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,4RAA4R,GAC9R;YACF,~~yBACY~~,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,wKAAwK,GAC1K;YACF,~~yBACY~~,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,0JAA0J,GAC5J,CACE,CACP,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Rijksoverheid\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-eherkenning-logo',\n styleUrl: 'eherkenning-logo.scss',\n shadow: true,\n})\nexport class EherkenningLogo {\n render() {\n return (\n <svg class=\"utrecht-icon\" xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" viewBox=\"-1 0 81 80\">\n <rect fill=\"#E0E0E0\" width=\"80\" height=\"80\" />\n <path\n fill-rule=\"evenodd\"\n fill=\"#00328C\"\n d=\"M37.363,23.178c0,2.027,0,4.055,0,6.08c-4.257,0-9.55,0-14.208,0 c-1.662,0-3.648-0.207-4.799,0.193c-1.041,0.359-1.796,1.169-2.176,2.111c-0.439,1.084-0.32,2.8-0.32,4.414c0,3.425,0,6.055,0,9.475 c0,1.531-0.159,3.325,0.191,4.479c0.316,1.042,1.316,2.194,2.561,2.496c1.318,0.319,3.094,0.064,4.672,0.064 c4.599,0,9.521,0,14.08,0c0,2.025,0,4.053,0,6.08c-6.402-0.083-12.492,0.112-18.176,0c-4.937-0.099-8.966-3.966-9.344-8.833 c-0.226-2.883,0-5.901,0-8.769c0-2.971-0.19-5.932,0-8.767c0.328-4.896,4.208-8.676,8.959-9.024c3.002-0.222,6.129,0,9.28,0 C31.145,23.178,34.26,23.178,37.363,23.178z\"\n />\n <path\n fill-rule=\"evenodd\"\n fill=\"#FF0079\"\n d=\"M42.867,23.178c1.962,0,3.926,0,5.888,0c0,4.864,0,9.729,0,14.592 c-1.984,0-3.969,0-5.952,0c0-4.801,0-9.6,0-14.399C42.797,23.279,42.792,23.188,42.867,23.178z\"\n />\n <path\n fill-rule=\"evenodd\"\n fill=\"#FF0079\"\n d=\"M64.434,23.178c1.941,0,3.883,0,5.824,0c0,11.798,0,23.595,0,35.393 c-1.962,0-3.926,0-5.888,0c0-4.992,0-9.984,0-14.977c-5.077,0-10.155,0-15.232,0c0.824-1.95,1.651-3.896,2.56-5.76 c4.203,0,8.405,0,12.608,0c0.15-4.693,0.021-9.664,0.064-14.464C64.365,23.279,64.36,23.188,64.434,23.178z\"\n />\n <path\n fill-rule=\"evenodd\"\n fill=\"#00328C\"\n d=\"M19.89,37.77c5.376,0,10.752,0,16.129,0c-0.772,2.022-1.748,3.843-2.56,5.824 c-4.544,0-9.088,0-13.633,0c0-1.877,0-3.755,0-5.633C19.821,37.87,19.816,37.781,19.89,37.77z\"\n />\n <path\n fill-rule=\"evenodd\"\n fill=\"#FF0079\"\n d=\"M42.93,43.594c1.941,0,3.883,0,5.824,0c0,4.992,0,9.984,0,14.977 c-1.984,0-3.969,0-5.952,0c0-4.93,0-9.856,0-14.783C42.8,43.678,42.851,43.62,42.93,43.594z\"\n />\n </svg>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"eherkenning-logo.js","sourceRoot":"","sources":["../../src/components/eherkenning-logo.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,eAAe;IAC1B,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,cAAc,EAAC,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,EAAC,YAAY;YAC7F,6DAAM,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG;YAC9C,0EACY,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,ykBAAykB,GAC3kB;YACF,0EACY,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,8JAA8J,GAChK;YACF,0EACY,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,4RAA4R,GAC9R;YACF,0EACY,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,wKAAwK,GAC1K;YACF,0EACY,SAAS,EACnB,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,0JAA0J,GAC5J,CACE,CACP,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Rijksoverheid\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-eherkenning-logo',\n styleUrl: 'eherkenning-logo.scss',\n shadow: true,\n})\nexport class EherkenningLogo {\n render() {\n return (\n <svg class=\"utrecht-icon\" xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\" viewBox=\"-1 0 81 80\">\n <rect fill=\"#E0E0E0\" width=\"80\" height=\"80\" />\n <path\n fill-rule=\"evenodd\"\n fill=\"#00328C\"\n d=\"M37.363,23.178c0,2.027,0,4.055,0,6.08c-4.257,0-9.55,0-14.208,0 c-1.662,0-3.648-0.207-4.799,0.193c-1.041,0.359-1.796,1.169-2.176,2.111c-0.439,1.084-0.32,2.8-0.32,4.414c0,3.425,0,6.055,0,9.475 c0,1.531-0.159,3.325,0.191,4.479c0.316,1.042,1.316,2.194,2.561,2.496c1.318,0.319,3.094,0.064,4.672,0.064 c4.599,0,9.521,0,14.08,0c0,2.025,0,4.053,0,6.08c-6.402-0.083-12.492,0.112-18.176,0c-4.937-0.099-8.966-3.966-9.344-8.833 c-0.226-2.883,0-5.901,0-8.769c0-2.971-0.19-5.932,0-8.767c0.328-4.896,4.208-8.676,8.959-9.024c3.002-0.222,6.129,0,9.28,0 C31.145,23.178,34.26,23.178,37.363,23.178z\"\n />\n <path\n fill-rule=\"evenodd\"\n fill=\"#FF0079\"\n d=\"M42.867,23.178c1.962,0,3.926,0,5.888,0c0,4.864,0,9.729,0,14.592 c-1.984,0-3.969,0-5.952,0c0-4.801,0-9.6,0-14.399C42.797,23.279,42.792,23.188,42.867,23.178z\"\n />\n <path\n fill-rule=\"evenodd\"\n fill=\"#FF0079\"\n d=\"M64.434,23.178c1.941,0,3.883,0,5.824,0c0,11.798,0,23.595,0,35.393 c-1.962,0-3.926,0-5.888,0c0-4.992,0-9.984,0-14.977c-5.077,0-10.155,0-15.232,0c0.824-1.95,1.651-3.896,2.56-5.76 c4.203,0,8.405,0,12.608,0c0.15-4.693,0.021-9.664,0.064-14.464C64.365,23.279,64.36,23.188,64.434,23.178z\"\n />\n <path\n fill-rule=\"evenodd\"\n fill=\"#00328C\"\n d=\"M19.89,37.77c5.376,0,10.752,0,16.129,0c-0.772,2.022-1.748,3.843-2.56,5.824 c-4.544,0-9.088,0-13.633,0c0-1.877,0-3.755,0-5.633C19.821,37.87,19.816,37.781,19.89,37.77z\"\n />\n <path\n fill-rule=\"evenodd\"\n fill=\"#FF0079\"\n d=\"M42.93,43.594c1.941,0,3.883,0,5.824,0c0,4.992,0,9.984,0,14.977 c-1.984,0-3.969,0-5.952,0c0-4.93,0-9.856,0-14.783C42.8,43.678,42.851,43.62,42.93,43.594z\"\n />\n </svg>\n );\n }\n}\n"]}

package/dist/collection/components/eidas-logo.js CHANGED Viewed

@@ -6,7 +6,7 @@
 import { h } from "@stencil/core";
 export class EidasLogo {
     render() {
-        return (h("svg", { class: "utrecht-icon", viewBox: "0 0 21 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M21 17.3383C21 18.2955 20.2291 19.0664 19.272 19.0664H1.72805C0.770872 19.0664 0 18.2955 0 17.3383V1.72805C0 0.770879 0.777296 0 1.72805 0H19.272C20.2291 0 21 0.777303 21 1.72805V17.3383Z", fill: "#2C4375" }), h("path", { d: "M7.88867 19.0984V15.9057C7.88867 14.5952 8.94862 13.5353 10.2591 13.5353H17.0493C18.3598 13.5353 19.4197 14.6017 19.4197 15.9057V19.0984", fill: "white" }), h("path", { d: "M9.38546 9.78369C9.55891 9.19911 9.83513 8.72373 10.2141 8.34472C10.5932 7.97213 11.075 7.69589 11.6724 7.51602C12.2698 7.33615 12.9765 7.24622 13.8051 7.24622C14.4989 7.24622 15.1028 7.32973 15.6231 7.49675C16.1435 7.66377 16.5932 7.92716 16.985 8.2869C17.4411 8.71089 17.7495 9.20553 17.9101 9.76442C18.0707 10.3233 18.1542 11.0299 18.1542 11.8651V17.0428C18.1542 17.486 18.0514 17.8201 17.8523 18.0385C17.6467 18.2569 17.3833 18.3661 17.0557 18.3661C16.7281 18.3661 16.4647 18.2569 16.272 18.0385C16.0792 17.8201 15.9765 17.4925 15.9765 17.0428V11.7173C15.9765 10.7987 15.803 10.1113 15.4497 9.66163C15.0964 9.21196 14.4989 8.98069 13.6445 8.98069C13.0278 8.98069 12.5525 9.0899 12.2056 9.31474C11.8651 9.53958 11.6274 9.84793 11.4925 10.2526C11.3576 10.6574 11.2934 11.1584 11.2934 11.7559V17.0428C11.2934 17.4796 11.197 17.8137 10.9979 18.0321C10.7987 18.2505 10.5353 18.3597 10.1949 18.3597C9.87367 18.3597 9.6103 18.2505 9.41758 18.0321C9.21844 17.8137 9.12207 17.4796 9.12207 17.0428V11.8779C9.12207 11.0621 9.21201 10.3683 9.38546 9.78369Z", fill: "white" }), h("path", { d: "M13.169 0.648804L13.683 2.0942L15.3275 2.08778L13.9913 2.98071L14.5052 4.41968L13.169 3.52675L11.8457 4.41968L12.3532 2.98071L11.0234 2.08778L12.668 2.0942L13.169 0.648804Z", fill: "#F2CD23" }), h("path", { d: "M18.2893 1.59314L18.7968 3.03854L20.4413 3.03211L19.1116 3.91862L19.6191 5.35759L18.2893 4.46466L16.9595 5.35759L17.4735 3.91862L16.1309 3.03211L17.7882 3.03854L18.2893 1.59314Z", fill: "#F2CD23" }), h("path", { d: "M3.60369 14.833L4.11118 16.2784L5.75573 16.272L4.41954 17.1585L4.93346 18.5975L3.60369 17.7045L2.27392 18.5975L2.78784 17.1585L1.45166 16.272L3.09619 16.2784L3.60369 14.833Z", fill: "#F2CD23" }), h("path", { d: "M4.80536 5.51819L5.31284 6.96358L6.95739 6.95716L5.62763 7.84367L6.13512 9.28264L4.80536 8.38971L3.47559 9.28264L3.98308 7.84367L2.65332 6.95716L4.30428 6.96358L4.80536 5.51819Z", fill: "#F2CD23" }), h("path", { d: "M8.43483 2.07495L8.93591 3.52035L10.5869 3.51392L9.25068 4.40043L9.76459 5.83941L8.43483 4.94647L7.10507 5.83941L7.61256 4.40043L6.27637 3.51392L7.92733 3.52035L8.43483 2.07495Z", fill: "#F2CD23" }), h("path", { d: "M3.12176 10.3234L3.62925 11.7688L5.28021 11.7623L3.94402 12.6488L4.45152 14.0878L3.12176 13.1949L1.79198 14.0878L2.3059 12.6488L0.969727 11.7623L2.61426 11.7688L3.12176 10.3234Z", fill: "#F2CD23" })));
+        return (h("svg", { key: 'a49b768c09a7428c31e92ec68ee575529a1e9c97', class: "utrecht-icon", viewBox: "0 0 21 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '28c920cc9483649ba7de128e6484010dfbdb9523', d: "M21 17.3383C21 18.2955 20.2291 19.0664 19.272 19.0664H1.72805C0.770872 19.0664 0 18.2955 0 17.3383V1.72805C0 0.770879 0.777296 0 1.72805 0H19.272C20.2291 0 21 0.777303 21 1.72805V17.3383Z", fill: "#2C4375" }), h("path", { key: '9434289a3c6908f27ceae9c18ebfc4a9edb209ca', d: "M7.88867 19.0984V15.9057C7.88867 14.5952 8.94862 13.5353 10.2591 13.5353H17.0493C18.3598 13.5353 19.4197 14.6017 19.4197 15.9057V19.0984", fill: "white" }), h("path", { key: '0123e4e1d68f20e26081e6d7d97fb56ace315a6d', d: "M9.38546 9.78369C9.55891 9.19911 9.83513 8.72373 10.2141 8.34472C10.5932 7.97213 11.075 7.69589 11.6724 7.51602C12.2698 7.33615 12.9765 7.24622 13.8051 7.24622C14.4989 7.24622 15.1028 7.32973 15.6231 7.49675C16.1435 7.66377 16.5932 7.92716 16.985 8.2869C17.4411 8.71089 17.7495 9.20553 17.9101 9.76442C18.0707 10.3233 18.1542 11.0299 18.1542 11.8651V17.0428C18.1542 17.486 18.0514 17.8201 17.8523 18.0385C17.6467 18.2569 17.3833 18.3661 17.0557 18.3661C16.7281 18.3661 16.4647 18.2569 16.272 18.0385C16.0792 17.8201 15.9765 17.4925 15.9765 17.0428V11.7173C15.9765 10.7987 15.803 10.1113 15.4497 9.66163C15.0964 9.21196 14.4989 8.98069 13.6445 8.98069C13.0278 8.98069 12.5525 9.0899 12.2056 9.31474C11.8651 9.53958 11.6274 9.84793 11.4925 10.2526C11.3576 10.6574 11.2934 11.1584 11.2934 11.7559V17.0428C11.2934 17.4796 11.197 17.8137 10.9979 18.0321C10.7987 18.2505 10.5353 18.3597 10.1949 18.3597C9.87367 18.3597 9.6103 18.2505 9.41758 18.0321C9.21844 17.8137 9.12207 17.4796 9.12207 17.0428V11.8779C9.12207 11.0621 9.21201 10.3683 9.38546 9.78369Z", fill: "white" }), h("path", { key: '601a63054af8d162e80d11b957dc3d27697ef218', d: "M13.169 0.648804L13.683 2.0942L15.3275 2.08778L13.9913 2.98071L14.5052 4.41968L13.169 3.52675L11.8457 4.41968L12.3532 2.98071L11.0234 2.08778L12.668 2.0942L13.169 0.648804Z", fill: "#F2CD23" }), h("path", { key: 'cbd04bc4118f8ea855f9e5c3359d394a3cd84f0a', d: "M18.2893 1.59314L18.7968 3.03854L20.4413 3.03211L19.1116 3.91862L19.6191 5.35759L18.2893 4.46466L16.9595 5.35759L17.4735 3.91862L16.1309 3.03211L17.7882 3.03854L18.2893 1.59314Z", fill: "#F2CD23" }), h("path", { key: '8d47f699d6ba6500b9e996801fbf87e36a517312', d: "M3.60369 14.833L4.11118 16.2784L5.75573 16.272L4.41954 17.1585L4.93346 18.5975L3.60369 17.7045L2.27392 18.5975L2.78784 17.1585L1.45166 16.272L3.09619 16.2784L3.60369 14.833Z", fill: "#F2CD23" }), h("path", { key: '465a761fd6f26a6d7c97b742bb81cd762d7aad4c', d: "M4.80536 5.51819L5.31284 6.96358L6.95739 6.95716L5.62763 7.84367L6.13512 9.28264L4.80536 8.38971L3.47559 9.28264L3.98308 7.84367L2.65332 6.95716L4.30428 6.96358L4.80536 5.51819Z", fill: "#F2CD23" }), h("path", { key: '363f8c14883800fbb8d82734a07c37f2df737a0d', d: "M8.43483 2.07495L8.93591 3.52035L10.5869 3.51392L9.25068 4.40043L9.76459 5.83941L8.43483 4.94647L7.10507 5.83941L7.61256 4.40043L6.27637 3.51392L7.92733 3.52035L8.43483 2.07495Z", fill: "#F2CD23" }), h("path", { key: '68cfbbbd069f4db233f7a70c0fc9ebf66e359e67', d: "M3.12176 10.3234L3.62925 11.7688L5.28021 11.7623L3.94402 12.6488L4.45152 14.0878L3.12176 13.1949L1.79198 14.0878L2.3059 12.6488L0.969727 11.7623L2.61426 11.7688L3.12176 10.3234Z", fill: "#F2CD23" })));
     }
     static get is() { return "utrecht-eidas-logo"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/eidas-logo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eidas-logo.js","sourceRoot":"","sources":["~~../../../~~src/components/eidas-logo.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,SAAS;IACpB,MAAM;QACJ,OAAO,CACL,~~WAAK~~,KAAK,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B;YAC1F,~~YACE~~,CAAC,EAAC,6LAA6L,EAC/L,IAAI,EAAC,SAAS,GACd;YACF,~~YACE~~,CAAC,EAAC,0IAA0I,EAC5I,IAAI,EAAC,OAAO,GACZ;YACF,~~YACE~~,CAAC,EAAC,0hCAA0hC,EAC5hC,IAAI,EAAC,OAAO,GACZ;YACF,~~YACE~~,CAAC,EAAC,8KAA8K,EAChL,IAAI,EAAC,SAAS,GACd;YACF,~~YACE~~,CAAC,EAAC,mLAAmL,EACrL,IAAI,EAAC,SAAS,GACd;YACF,~~YACE~~,CAAC,EAAC,+KAA+K,EACjL,IAAI,EAAC,SAAS,GACd;YACF,~~YACE~~,CAAC,EAAC,mLAAmL,EACrL,IAAI,EAAC,SAAS,GACd;YACF,~~YACE~~,CAAC,EAAC,mLAAmL,EACrL,IAAI,EAAC,SAAS,GACd;YACF,~~YACE~~,CAAC,EAAC,mLAAmL,EACrL,IAAI,EAAC,SAAS,GACd,CACE,CACP,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Rijksoverheid\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-eidas-logo',\n styleUrl: 'eidas-logo.scss',\n shadow: true,\n})\nexport class EidasLogo {\n render() {\n return (\n <svg class=\"utrecht-icon\" viewBox=\"0 0 21 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M21 17.3383C21 18.2955 20.2291 19.0664 19.272 19.0664H1.72805C0.770872 19.0664 0 18.2955 0 17.3383V1.72805C0 0.770879 0.777296 0 1.72805 0H19.272C20.2291 0 21 0.777303 21 1.72805V17.3383Z\"\n fill=\"#2C4375\"\n />\n <path\n d=\"M7.88867 19.0984V15.9057C7.88867 14.5952 8.94862 13.5353 10.2591 13.5353H17.0493C18.3598 13.5353 19.4197 14.6017 19.4197 15.9057V19.0984\"\n fill=\"white\"\n />\n <path\n d=\"M9.38546 9.78369C9.55891 9.19911 9.83513 8.72373 10.2141 8.34472C10.5932 7.97213 11.075 7.69589 11.6724 7.51602C12.2698 7.33615 12.9765 7.24622 13.8051 7.24622C14.4989 7.24622 15.1028 7.32973 15.6231 7.49675C16.1435 7.66377 16.5932 7.92716 16.985 8.2869C17.4411 8.71089 17.7495 9.20553 17.9101 9.76442C18.0707 10.3233 18.1542 11.0299 18.1542 11.8651V17.0428C18.1542 17.486 18.0514 17.8201 17.8523 18.0385C17.6467 18.2569 17.3833 18.3661 17.0557 18.3661C16.7281 18.3661 16.4647 18.2569 16.272 18.0385C16.0792 17.8201 15.9765 17.4925 15.9765 17.0428V11.7173C15.9765 10.7987 15.803 10.1113 15.4497 9.66163C15.0964 9.21196 14.4989 8.98069 13.6445 8.98069C13.0278 8.98069 12.5525 9.0899 12.2056 9.31474C11.8651 9.53958 11.6274 9.84793 11.4925 10.2526C11.3576 10.6574 11.2934 11.1584 11.2934 11.7559V17.0428C11.2934 17.4796 11.197 17.8137 10.9979 18.0321C10.7987 18.2505 10.5353 18.3597 10.1949 18.3597C9.87367 18.3597 9.6103 18.2505 9.41758 18.0321C9.21844 17.8137 9.12207 17.4796 9.12207 17.0428V11.8779C9.12207 11.0621 9.21201 10.3683 9.38546 9.78369Z\"\n fill=\"white\"\n />\n <path\n d=\"M13.169 0.648804L13.683 2.0942L15.3275 2.08778L13.9913 2.98071L14.5052 4.41968L13.169 3.52675L11.8457 4.41968L12.3532 2.98071L11.0234 2.08778L12.668 2.0942L13.169 0.648804Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M18.2893 1.59314L18.7968 3.03854L20.4413 3.03211L19.1116 3.91862L19.6191 5.35759L18.2893 4.46466L16.9595 5.35759L17.4735 3.91862L16.1309 3.03211L17.7882 3.03854L18.2893 1.59314Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M3.60369 14.833L4.11118 16.2784L5.75573 16.272L4.41954 17.1585L4.93346 18.5975L3.60369 17.7045L2.27392 18.5975L2.78784 17.1585L1.45166 16.272L3.09619 16.2784L3.60369 14.833Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M4.80536 5.51819L5.31284 6.96358L6.95739 6.95716L5.62763 7.84367L6.13512 9.28264L4.80536 8.38971L3.47559 9.28264L3.98308 7.84367L2.65332 6.95716L4.30428 6.96358L4.80536 5.51819Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M8.43483 2.07495L8.93591 3.52035L10.5869 3.51392L9.25068 4.40043L9.76459 5.83941L8.43483 4.94647L7.10507 5.83941L7.61256 4.40043L6.27637 3.51392L7.92733 3.52035L8.43483 2.07495Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M3.12176 10.3234L3.62925 11.7688L5.28021 11.7623L3.94402 12.6488L4.45152 14.0878L3.12176 13.1949L1.79198 14.0878L2.3059 12.6488L0.969727 11.7623L2.61426 11.7688L3.12176 10.3234Z\"\n fill=\"#F2CD23\"\n />\n </svg>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"eidas-logo.js","sourceRoot":"","sources":["../../src/components/eidas-logo.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,SAAS;IACpB,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B;YAC1F,6DACE,CAAC,EAAC,6LAA6L,EAC/L,IAAI,EAAC,SAAS,GACd;YACF,6DACE,CAAC,EAAC,0IAA0I,EAC5I,IAAI,EAAC,OAAO,GACZ;YACF,6DACE,CAAC,EAAC,0hCAA0hC,EAC5hC,IAAI,EAAC,OAAO,GACZ;YACF,6DACE,CAAC,EAAC,8KAA8K,EAChL,IAAI,EAAC,SAAS,GACd;YACF,6DACE,CAAC,EAAC,mLAAmL,EACrL,IAAI,EAAC,SAAS,GACd;YACF,6DACE,CAAC,EAAC,+KAA+K,EACjL,IAAI,EAAC,SAAS,GACd;YACF,6DACE,CAAC,EAAC,mLAAmL,EACrL,IAAI,EAAC,SAAS,GACd;YACF,6DACE,CAAC,EAAC,mLAAmL,EACrL,IAAI,EAAC,SAAS,GACd;YACF,6DACE,CAAC,EAAC,mLAAmL,EACrL,IAAI,EAAC,SAAS,GACd,CACE,CACP,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Rijksoverheid\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-eidas-logo',\n styleUrl: 'eidas-logo.scss',\n shadow: true,\n})\nexport class EidasLogo {\n render() {\n return (\n <svg class=\"utrecht-icon\" viewBox=\"0 0 21 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M21 17.3383C21 18.2955 20.2291 19.0664 19.272 19.0664H1.72805C0.770872 19.0664 0 18.2955 0 17.3383V1.72805C0 0.770879 0.777296 0 1.72805 0H19.272C20.2291 0 21 0.777303 21 1.72805V17.3383Z\"\n fill=\"#2C4375\"\n />\n <path\n d=\"M7.88867 19.0984V15.9057C7.88867 14.5952 8.94862 13.5353 10.2591 13.5353H17.0493C18.3598 13.5353 19.4197 14.6017 19.4197 15.9057V19.0984\"\n fill=\"white\"\n />\n <path\n d=\"M9.38546 9.78369C9.55891 9.19911 9.83513 8.72373 10.2141 8.34472C10.5932 7.97213 11.075 7.69589 11.6724 7.51602C12.2698 7.33615 12.9765 7.24622 13.8051 7.24622C14.4989 7.24622 15.1028 7.32973 15.6231 7.49675C16.1435 7.66377 16.5932 7.92716 16.985 8.2869C17.4411 8.71089 17.7495 9.20553 17.9101 9.76442C18.0707 10.3233 18.1542 11.0299 18.1542 11.8651V17.0428C18.1542 17.486 18.0514 17.8201 17.8523 18.0385C17.6467 18.2569 17.3833 18.3661 17.0557 18.3661C16.7281 18.3661 16.4647 18.2569 16.272 18.0385C16.0792 17.8201 15.9765 17.4925 15.9765 17.0428V11.7173C15.9765 10.7987 15.803 10.1113 15.4497 9.66163C15.0964 9.21196 14.4989 8.98069 13.6445 8.98069C13.0278 8.98069 12.5525 9.0899 12.2056 9.31474C11.8651 9.53958 11.6274 9.84793 11.4925 10.2526C11.3576 10.6574 11.2934 11.1584 11.2934 11.7559V17.0428C11.2934 17.4796 11.197 17.8137 10.9979 18.0321C10.7987 18.2505 10.5353 18.3597 10.1949 18.3597C9.87367 18.3597 9.6103 18.2505 9.41758 18.0321C9.21844 17.8137 9.12207 17.4796 9.12207 17.0428V11.8779C9.12207 11.0621 9.21201 10.3683 9.38546 9.78369Z\"\n fill=\"white\"\n />\n <path\n d=\"M13.169 0.648804L13.683 2.0942L15.3275 2.08778L13.9913 2.98071L14.5052 4.41968L13.169 3.52675L11.8457 4.41968L12.3532 2.98071L11.0234 2.08778L12.668 2.0942L13.169 0.648804Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M18.2893 1.59314L18.7968 3.03854L20.4413 3.03211L19.1116 3.91862L19.6191 5.35759L18.2893 4.46466L16.9595 5.35759L17.4735 3.91862L16.1309 3.03211L17.7882 3.03854L18.2893 1.59314Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M3.60369 14.833L4.11118 16.2784L5.75573 16.272L4.41954 17.1585L4.93346 18.5975L3.60369 17.7045L2.27392 18.5975L2.78784 17.1585L1.45166 16.272L3.09619 16.2784L3.60369 14.833Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M4.80536 5.51819L5.31284 6.96358L6.95739 6.95716L5.62763 7.84367L6.13512 9.28264L4.80536 8.38971L3.47559 9.28264L3.98308 7.84367L2.65332 6.95716L4.30428 6.96358L4.80536 5.51819Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M8.43483 2.07495L8.93591 3.52035L10.5869 3.51392L9.25068 4.40043L9.76459 5.83941L8.43483 4.94647L7.10507 5.83941L7.61256 4.40043L6.27637 3.51392L7.92733 3.52035L8.43483 2.07495Z\"\n fill=\"#F2CD23\"\n />\n <path\n d=\"M3.12176 10.3234L3.62925 11.7688L5.28021 11.7623L3.94402 12.6488L4.45152 14.0878L3.12176 13.1949L1.79198 14.0878L2.3059 12.6488L0.969727 11.7623L2.61426 11.7688L3.12176 10.3234Z\"\n fill=\"#F2CD23\"\n />\n </svg>\n );\n }\n}\n"]}

package/dist/collection/components/emphasis.js CHANGED Viewed

@@ -6,7 +6,7 @@
 import { h } from "@stencil/core";
 export class Emphasis {
     render() {
-        return (h("em", { class: "utrecht-emphasis" }, h("slot", null)));
+        return (h("em", { key: '483636635d74fcf9e64ac1a3eea65a3f64185200', class: "utrecht-emphasis" }, h("slot", { key: '63468a0a7e120aa8ea13a949e137a1d18e797747' })));
     }
     static get is() { return "utrecht-emphasis"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/emphasis.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"emphasis.js","sourceRoot":"","sources":["~~../../../~~src/components/emphasis.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,QAAQ;IACnB,MAAM;QACJ,OAAO,CACL,~~UAAI~~,KAAK,EAAC,kBAAkB;YAC1B,~~eAAa~~,CACV,CACN,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2020-2022 Gemeente Utrecht\n * Copyright (c) 2020-2022 Frameless B.V.\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-emphasis',\n styleUrl: 'emphasis.scss',\n shadow: true,\n})\nexport class Emphasis {\n render() {\n return (\n <em class=\"utrecht-emphasis\">\n <slot></slot>\n </em>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"emphasis.js","sourceRoot":"","sources":["../../src/components/emphasis.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,QAAQ;IACnB,MAAM;QACJ,OAAO,CACL,2DAAI,KAAK,EAAC,kBAAkB;YAC1B,8DAAa,CACV,CACN,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2020-2022 Gemeente Utrecht\n * Copyright (c) 2020-2022 Frameless B.V.\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-emphasis',\n styleUrl: 'emphasis.scss',\n shadow: true,\n})\nexport class Emphasis {\n render() {\n return (\n <em class=\"utrecht-emphasis\">\n <slot></slot>\n </em>\n );\n }\n}\n"]}

package/dist/collection/components/flex-wrap-fallback.js CHANGED Viewed

@@ -44,7 +44,7 @@ export class FlexWrapFallback {
     }
     render() {
         const { contentWraps } = this;
-        return (h("div", null, h("div", { id: "wrap", class: `utrecht-flex-wrap-fallback__content ${contentWraps ? 'utrecht-flex-wrap-fallback__content--hidden' : ''}`, "data-inert": contentWraps, "aria-hidden": contentWraps }, h("slot", null)), h("div", { id: "nowrap", class: `utrecht-flex-wrap-fallback__fallback ${contentWraps ? '' : 'utrecht-flex-wrap-fallback__fallback--hidden'}`, "data-inert": !contentWraps, hidden: !contentWraps }, h("slot", { name: "fallback" }))));
+        return (h("div", { key: '62ea3994b527fac3e69a2f4c99476383948e6d7a' }, h("div", { key: 'd59010b979e90700cccaf4deb2772844d50a4dec', id: "wrap", class: `utrecht-flex-wrap-fallback__content ${contentWraps ? 'utrecht-flex-wrap-fallback__content--hidden' : ''}`, "data-inert": contentWraps, "aria-hidden": contentWraps }, h("slot", { key: 'eff4ddc9ccc424d861dfda7479be5f6686f95f4e' })), h("div", { key: 'c9e0cf29b7858976a67eb4d6a1e12d2e352c9b80', id: "nowrap", class: `utrecht-flex-wrap-fallback__fallback ${contentWraps ? '' : 'utrecht-flex-wrap-fallback__fallback--hidden'}`, "data-inert": !contentWraps, hidden: !contentWraps }, h("slot", { key: '93d05078e717c77db89ac3c0bf14e8ee88549a4d', name: "fallback" }))));
     }
     static get is() { return "utrecht-flex-wrap-fallback"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/flex-wrap-fallback.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"flex-wrap-fallback.js","sourceRoot":"","sources":["~~../../../~~src/components/flex-wrap-fallback.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEnE;;GAEG;AACH,MAAM,cAAc,GAAG,CAAC,EAAW,EAAE,EAAE;;IACrC,MAAM,GAAG,GAAG,MAAA,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,aAAa,0CAAE,WAAW,CAAC;IAE3C,MAAM,KAAK,GAAG,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,gBAAgB,CAAC,EAAE,CAAC,CAAC;IAExC,IAAI,KAAK,IAAI,KAAK,CAAC,gBAAgB,CAAC,WAAW,CAAC,KAAK,MAAM,IAAI,KAAK,CAAC,gBAAgB,CAAC,SAAS,CAAC,KAAK,MAAM,EAAE;~~QAC3G~~,0CAA0C;QAC1C,OAAO,EAAE,CAAC,iBAAiB,CAAC,qBAAqB,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,gBAAgB,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;~~KAC7G~~;SAAM;~~QACL~~,OAAO,KAAK,CAAC;~~KACd~~;AACH,CAAC,CAAC;AAOF,MAAM,OAAO,gBAAgB;;;;;;IAQ3B,iBAAiB;QACf,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;~~YACxB~~,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;gBAC5C,gFAAgF;gBAChF,qCAAqC;gBACrC,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC;gBAC7E,MAAM,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;gBACjE,OAAO,CAAC,GAAG,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;gBACvC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,YAAY,IAAI,cAAc,CAAC,YAAY,CAAC,CAAC;YACrE,CAAC,CAAC,CAAC;~~SACJ~~;QAED,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IAChD,CAAC;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,cAAc,0CAAE,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACnD,CAAC;IACD,MAAM;QACJ,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC;QAC9B,OAAO,CACL;YACE,~~WACE~~,EAAE,EAAC,MAAM,EACT,KAAK,EAAE,uCACL,YAAY,CAAC,CAAC,CAAC,6CAA6C,CAAC,CAAC,CAAC,EACjE,EAAE,gBACU,YAAY,iBACX,YAAY;gBAEzB,~~eAAa~~,CACT;YACN,~~WACE~~,EAAE,EAAC,QAAQ,EACX,KAAK,EAAE,wCACL,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,8CACtB,EAAE,gBACU,CAAC,YAAY,EACzB,MAAM,EAAE,CAAC,YAAY;gBAErB,~~YAAM~~,IAAI,EAAC,UAAU,GAAQ,CACzB,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2020-2022 Gemeente Utrecht\n * Copyright (c) 2020-2022 Frameless B.V.\n /\n\nimport { Component, Element, h, Prop, State } from '@stencil/core';\n\n/\n Checks if an element has `flex-wrap: wrap` and the content wraps over multiple lines\n /\nconst hasFlexboxWrap = (el: Element) => {\n const win = el?.ownerDocument?.defaultView;\n\n const style = win?.getComputedStyle(el);\n\n if (style && style.getPropertyValue('flex-wrap') === 'wrap' && style.getPropertyValue('display') === 'flex') {\n // TODO: Account for writing-mode vertical\n return el.firstElementChild.getBoundingClientRect().top !== el.lastElementChild.getBoundingClientRect().top;\n } else {\n return false;\n }\n};\n\n@Component({\n tag: 'utrecht-flex-wrap-fallback',\n styleUrl: 'flex-wrap-fallback.scss',\n shadow: true,\n})\nexport class FlexWrapFallback {\n @Element() hostElement: HTMLElement;\n\n / ID reference for element with `display: flex;` or `display: inline-flex` and `flex-wrap: wrap` */\n @Prop({ attribute: 'flextarget', reflect: true }) flexTarget?: string;\n @State() resizeObserver: ResizeObserver;\n @State() contentWraps: boolean;\n\n connectedCallback() {\n if (!this.resizeObserver) {\n this.resizeObserver = new ResizeObserver(() => {\n // TODO: Support updating `flextarget` attribute, switch ResizeObserver to match\n // TODO: Escape ID selector CSS query\n const cssSelector = this.flexTarget ? `#${this.flexTarget}` : ':not([slot])';\n const flexTargetEl = this.hostElement.querySelector(cssSelector);\n console.log(cssSelector, flexTargetEl);\n this.contentWraps = !!flexTargetEl && hasFlexboxWrap(flexTargetEl);\n });\n }\n\n this.resizeObserver.observe(this.hostElement);\n }\n\n disconnectedCallback() {\n this.resizeObserver?.unobserve(this.hostElement);\n }\n render() {\n const { contentWraps } = this;\n return (\n <div>\n <div\n id=\"wrap\"\n class={`utrecht-flex-wrap-fallback__content ${\n contentWraps ? 'utrecht-flex-wrap-fallback__content--hidden' : ''\n }`}\n data-inert={contentWraps}\n aria-hidden={contentWraps}\n >\n <slot></slot>\n </div>\n <div\n id=\"nowrap\"\n class={`utrecht-flex-wrap-fallback__fallback ${\n contentWraps ? '' : 'utrecht-flex-wrap-fallback__fallback--hidden'\n }`}\n data-inert={!contentWraps}\n hidden={!contentWraps}\n >\n <slot name=\"fallback\"></slot>\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"flex-wrap-fallback.js","sourceRoot":"","sources":["../../src/components/flex-wrap-fallback.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEnE;;GAEG;AACH,MAAM,cAAc,GAAG,CAAC,EAAW,EAAE,EAAE;;IACrC,MAAM,GAAG,GAAG,MAAA,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,aAAa,0CAAE,WAAW,CAAC;IAE3C,MAAM,KAAK,GAAG,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,gBAAgB,CAAC,EAAE,CAAC,CAAC;IAExC,IAAI,KAAK,IAAI,KAAK,CAAC,gBAAgB,CAAC,WAAW,CAAC,KAAK,MAAM,IAAI,KAAK,CAAC,gBAAgB,CAAC,SAAS,CAAC,KAAK,MAAM,EAAE,CAAC;QAC5G,0CAA0C;QAC1C,OAAO,EAAE,CAAC,iBAAiB,CAAC,qBAAqB,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,gBAAgB,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;IAC9G,CAAC;SAAM,CAAC;QACN,OAAO,KAAK,CAAC;IACf,CAAC;AACH,CAAC,CAAC;AAOF,MAAM,OAAO,gBAAgB;;;;;;IAQ3B,iBAAiB;QACf,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACzB,IAAI,CAAC,cAAc,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;gBAC5C,gFAAgF;gBAChF,qCAAqC;gBACrC,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC;gBAC7E,MAAM,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;gBACjE,OAAO,CAAC,GAAG,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;gBACvC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,YAAY,IAAI,cAAc,CAAC,YAAY,CAAC,CAAC;YACrE,CAAC,CAAC,CAAC;QACL,CAAC;QAED,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IAChD,CAAC;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,cAAc,0CAAE,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACnD,CAAC;IACD,MAAM;QACJ,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC;QAC9B,OAAO,CACL;YACE,4DACE,EAAE,EAAC,MAAM,EACT,KAAK,EAAE,uCACL,YAAY,CAAC,CAAC,CAAC,6CAA6C,CAAC,CAAC,CAAC,EACjE,EAAE,gBACU,YAAY,iBACX,YAAY;gBAEzB,8DAAa,CACT;YACN,4DACE,EAAE,EAAC,QAAQ,EACX,KAAK,EAAE,wCACL,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,8CACtB,EAAE,gBACU,CAAC,YAAY,EACzB,MAAM,EAAE,CAAC,YAAY;gBAErB,6DAAM,IAAI,EAAC,UAAU,GAAQ,CACzB,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2020-2022 Gemeente Utrecht\n * Copyright (c) 2020-2022 Frameless B.V.\n /\n\nimport { Component, Element, h, Prop, State } from '@stencil/core';\n\n/\n Checks if an element has `flex-wrap: wrap` and the content wraps over multiple lines\n /\nconst hasFlexboxWrap = (el: Element) => {\n const win = el?.ownerDocument?.defaultView;\n\n const style = win?.getComputedStyle(el);\n\n if (style && style.getPropertyValue('flex-wrap') === 'wrap' && style.getPropertyValue('display') === 'flex') {\n // TODO: Account for writing-mode vertical\n return el.firstElementChild.getBoundingClientRect().top !== el.lastElementChild.getBoundingClientRect().top;\n } else {\n return false;\n }\n};\n\n@Component({\n tag: 'utrecht-flex-wrap-fallback',\n styleUrl: 'flex-wrap-fallback.scss',\n shadow: true,\n})\nexport class FlexWrapFallback {\n @Element() hostElement: HTMLElement;\n\n / ID reference for element with `display: flex;` or `display: inline-flex` and `flex-wrap: wrap` */\n @Prop({ attribute: 'flextarget', reflect: true }) flexTarget?: string;\n @State() resizeObserver: ResizeObserver;\n @State() contentWraps: boolean;\n\n connectedCallback() {\n if (!this.resizeObserver) {\n this.resizeObserver = new ResizeObserver(() => {\n // TODO: Support updating `flextarget` attribute, switch ResizeObserver to match\n // TODO: Escape ID selector CSS query\n const cssSelector = this.flexTarget ? `#${this.flexTarget}` : ':not([slot])';\n const flexTargetEl = this.hostElement.querySelector(cssSelector);\n console.log(cssSelector, flexTargetEl);\n this.contentWraps = !!flexTargetEl && hasFlexboxWrap(flexTargetEl);\n });\n }\n\n this.resizeObserver.observe(this.hostElement);\n }\n\n disconnectedCallback() {\n this.resizeObserver?.unobserve(this.hostElement);\n }\n render() {\n const { contentWraps } = this;\n return (\n <div>\n <div\n id=\"wrap\"\n class={`utrecht-flex-wrap-fallback__content ${\n contentWraps ? 'utrecht-flex-wrap-fallback__content--hidden' : ''\n }`}\n data-inert={contentWraps}\n aria-hidden={contentWraps}\n >\n <slot></slot>\n </div>\n <div\n id=\"nowrap\"\n class={`utrecht-flex-wrap-fallback__fallback ${\n contentWraps ? '' : 'utrecht-flex-wrap-fallback__fallback--hidden'\n }`}\n data-inert={!contentWraps}\n hidden={!contentWraps}\n >\n <slot name=\"fallback\"></slot>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/form-field-checkbox.css CHANGED Viewed

@@ -439,8 +439,9 @@
   border-color: var(--utrecht-checkbox-checked-border-color, var(--utrecht-checkbox-border-color));
   border-width: var(--utrecht-checkbox-checked-border-width, var(--utrecht-checkbox-border-width));
 }
-.utrecht-checkbox--custom.utrecht-checkbox--html-input:indeterminate,
-.utrecht-custom-checkbox--html-input:indeterminate {
+.utrecht-checkbox--custom.utrecht-checkbox--html-input:indeterminate, .utrecht-checkbox--custom.utrecht-checkbox--html-input:checked:indeterminate,
+.utrecht-custom-checkbox--html-input:indeterminate,
+.utrecht-custom-checkbox--html-input:checked:indeterminate {
   background-color: var(--utrecht-checkbox-indeterminate-background-color, var(--utrecht-checkbox-background-color));
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
   border-color: var(--utrecht-checkbox-indeterminate-border-color, var(--utrecht-checkbox-border-color));

package/dist/collection/components/form-field-checkbox.js CHANGED Viewed

@@ -29,18 +29,18 @@ export class FormFieldCheckbox {
             input.name = name;
             input.value = checked ? value || '' : '';
         }
-        return (h("div", { class: clsx('utrecht-form-field', 'utrecht-form-field--checkbox', {
+        return (h("div", { key: '6ec5184e7f1e1cc58530486b96463045d13a9917', class: clsx('utrecht-form-field', 'utrecht-form-field--checkbox', {
                 'utrecht-form-field--invalid': invalid,
-            }) }, h("p", { class: "utrecht-form-field__label utrecht-form-field__label--checkbox" }, h("label", { class: clsx('utrecht-form-label', {
+            }) }, h("p", { key: '74021237e4498e05c7a0137bdbbaeb25c8b304b7', class: "utrecht-form-field__label utrecht-form-field__label--checkbox" }, h("label", { key: 'd048b71ba2a1132876af6467aa59dc4505d28b61', class: clsx('utrecht-form-label', {
                 'utrecht-form-label--disabled': disabled,
-            }), htmlFor: "input" }, h("input", { id: "input", type: "checkbox", class: clsx('utrecht-form-field__input', 'utrecht-checkbox', 'utrecht-checkbox--custom', 'utrecht-checkbox--html-input', {
+            }), htmlFor: "input" }, h("input", { key: '8e4578663d8b1522760ae4ab5e95f4ecff0715ec', id: "input", type: "checkbox", class: clsx('utrecht-form-field__input', 'utrecht-checkbox', 'utrecht-checkbox--custom', 'utrecht-checkbox--html-input', {
                 'utrecht-checkbox--disabled': disabled,
                 'utrecht-checkbox--invalid': invalid,
                 'utrecht-checkbox--required': required,
             }), "aria-invalid": invalid || undefined, disabled: disabled, required: required, checked: checked, value: value, onBlur: (evt) => this.utrechtBlur.emit(evt), onChange: (evt) => this.utrechtChange.emit(evt), onFocus: (evt) => this.utrechtFocus.emit(evt), onInput: (evt) => {
                 this.checked = evt.target.checked;
                 this.utrechtInput.emit(evt);
-            } }), ' ', label, h("slot", { name: "label" })), invalid && (h("utrecht-form-field-description", { status: "invalid", class: "utrecht-form-field__description utrecht-form-field__description--invalid", id: "error-message" }, h("slot", { name: "error-message" })))), h("utrecht-form-field-description", { class: "utrecht-form-field__description", id: "description" }, h("slot", { name: "description" })), h("div", { class: "utrecht-form-field__status", id: "status" }, h("div", { class: "utrecht-form-field-description utrecht-form-field-description--status" }, h("slot", { name: "status" })))));
+            } }), ' ', label, h("slot", { key: '760faa660a52b2819b42b3b03c44efe8d8383726', name: "label" })), invalid && (h("utrecht-form-field-description", { key: '35b3ab3458a8a208828fcc61d755cb42a5b16f1b', status: "invalid", class: "utrecht-form-field__description utrecht-form-field__description--invalid", id: "error-message" }, h("slot", { key: '4d102d6692745b19b6c636c4cf775aba54bebe38', name: "error-message" })))), h("utrecht-form-field-description", { key: 'ecd06161e975ca004268fa57e4b721a5117759d3', class: "utrecht-form-field__description", id: "description" }, h("slot", { key: '9938bff0a0fc52850b12af33df0a302c86d38161', name: "description" })), h("div", { key: 'eae4f7477d17812b689d068f1bf16735022bb4bc', class: "utrecht-form-field__status", id: "status" }, h("div", { key: 'a28112687723aafbfe5168cc4ab89ebb968e3f44', class: "utrecht-form-field-description utrecht-form-field-description--status" }, h("slot", { key: '0822afdbfdb2966b2e96ed72b81dcfe320365dd6', name: "status" })))));
     }
     static get is() { return "utrecht-form-field-checkbox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/form-field-checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-field-checkbox.js","sourceRoot":"","sources":["~~../../../~~src/components/form-field-checkbox.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACjF,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,OAAO,iBAAiB;;qBAGJ,EAAE;wBAC0C,KAAK;uBACP,KAAK;uBACL,KAAK;wBACH,KAAK;oBAClD,EAAE;qBACD,EAAE;;IAM1B,MAAM;QACJ,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;QAEvF,IAAI,KAAK,GAAG,WAAW,CAAC,aAAa,CAAC,sBAAsB,CAA4B,CAAC;QAEzF,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;~~YAClB~~,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;~~SACrC~~;QAED,IAAI,CAAC,KAAK,IAAI,IAAI,EAAE;~~YAClB~~,KAAK,GAAG,WAAW,CAAC,aAAa,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;YACzD,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAC;YACtB,WAAW,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;~~SAChC~~;QAED,IAAI,KAAK,IAAI,IAAI,EAAE;~~YACjB~~,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;YAClB,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;~~SAC1C~~;QAED,OAAO,CACL,~~WACE~~,KAAK,EAAE,IAAI,CAAC,oBAAoB,EAAE,8BAA8B,EAAE;gBAChE,6BAA6B,EAAE,OAAO;aACvC,CAAC;YAEF,~~SAAG~~,KAAK,EAAC,+DAA+D;gBACtE,~~aACE~~,KAAK,EAAE,IAAI,CAAC,oBAAoB,EAAE;wBAChC,8BAA8B,EAAE,QAAQ;qBACzC,CAAC,EACF,OAAO,EAAC,OAAO;oBAEf,~~aACE~~,EAAE,EAAC,OAAO,EACV,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,IAAI,CACT,2BAA2B,EAC3B,kBAAkB,EAClB,0BAA0B,EAC1B,8BAA8B,EAC9B;4BACE,4BAA4B,EAAE,QAAQ;4BACtC,2BAA2B,EAAE,OAAO;4BACpC,4BAA4B,EAAE,QAAQ;yBACvC,CACF,kBACa,OAAO,IAAI,SAAS,EAClC,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,EAC3C,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,CAAC,EAC/C,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,EAC7C,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE;4BACf,IAAI,CAAC,OAAO,GAAI,GAAG,CAAC,MAA2B,CAAC,OAAO,CAAC;4BACxD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;wBAC9B,CAAC,GACD;oBAAC,GAAG;oBACL,KAAK;oBACN,~~YAAM~~,IAAI,EAAC,OAAO,GAAQ,CACpB;gBACP,OAAO,IAAI,CACV,~~sCACE~~,MAAM,EAAC,SAAS,EAChB,KAAK,EAAC,0EAA0E,EAChF,EAAE,EAAC,eAAe;oBAElB,~~YAAM~~,IAAI,EAAC,eAAe,GAAQ,CACH,CAClC,CACC;YACJ,~~sCAAgC~~,KAAK,EAAC,iCAAiC,EAAC,EAAE,EAAC,aAAa;gBACtF,~~YAAM~~,IAAI,EAAC,aAAa,GAAQ,CACD;YACjC,~~WAAK~~,KAAK,EAAC,4BAA4B,EAAC,EAAE,EAAC,QAAQ;gBACjD,~~WAAK~~,KAAK,EAAC,uEAAuE;oBAChF,~~YAAM~~,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, Element, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-form-field-checkbox',\n styleUrl: 'form-field-checkbox.scss',\n shadow: true,\n})\nexport class FormFieldCheckbox {\n @Element() hostElement!: HTMLElement;\n\n @Prop() label: string = '';\n @Prop({ attribute: 'disabled', reflect: true }) disabled: boolean = false;\n @Prop({ attribute: 'checked', reflect: true }) checked: boolean = false;\n @Prop({ attribute: 'invalid', reflect: true }) invalid: boolean = false;\n @Prop({ attribute: 'required', reflect: true }) required: boolean = false;\n @Prop() name: string = '';\n @Prop() value: string = '';\n @Event() utrechtBlur: EventEmitter;\n @Event() utrechtChange: EventEmitter;\n @Event() utrechtFocus: EventEmitter;\n @Event() utrechtInput: EventEmitter;\n\n render() {\n const { checked, disabled, hostElement, label, name, invalid, required, value } = this;\n\n let input = hostElement.querySelector('input[type=\"hidden\"]') as HTMLInputElement \| null;\n\n if (input && !name) {\n input.parentNode.removeChild(input);\n }\n\n if (!input && name) {\n input = hostElement.ownerDocument.createElement('input');\n input.type = 'hidden';\n hostElement.appendChild(input);\n }\n\n if (input && name) {\n input.name = name;\n input.value = checked ? value \|\| '' : '';\n }\n\n return (\n <div\n class={clsx('utrecht-form-field', 'utrecht-form-field--checkbox', {\n 'utrecht-form-field--invalid': invalid,\n })}\n >\n <p class=\"utrecht-form-field__label utrecht-form-field__label--checkbox\">\n <label\n class={clsx('utrecht-form-label', {\n 'utrecht-form-label--disabled': disabled,\n })}\n htmlFor=\"input\"\n >\n <input\n id=\"input\"\n type=\"checkbox\"\n class={clsx(\n 'utrecht-form-field__input',\n 'utrecht-checkbox',\n 'utrecht-checkbox--custom',\n 'utrecht-checkbox--html-input',\n {\n 'utrecht-checkbox--disabled': disabled,\n 'utrecht-checkbox--invalid': invalid,\n 'utrecht-checkbox--required': required,\n },\n )}\n aria-invalid={invalid \|\| undefined}\n disabled={disabled}\n required={required}\n checked={checked}\n value={value}\n onBlur={(evt) => this.utrechtBlur.emit(evt)}\n onChange={(evt) => this.utrechtChange.emit(evt)}\n onFocus={(evt) => this.utrechtFocus.emit(evt)}\n onInput={(evt) => {\n this.checked = (evt.target as HTMLInputElement).checked;\n this.utrechtInput.emit(evt);\n }}\n />{' '}\n {label}\n <slot name=\"label\"></slot>\n </label>\n {invalid && (\n <utrecht-form-field-description\n status=\"invalid\"\n class=\"utrecht-form-field__description utrecht-form-field__description--invalid\"\n id=\"error-message\"\n >\n <slot name=\"error-message\"></slot>\n </utrecht-form-field-description>\n )}\n </p>\n <utrecht-form-field-description class=\"utrecht-form-field__description\" id=\"description\">\n <slot name=\"description\"></slot>\n </utrecht-form-field-description>\n <div class=\"utrecht-form-field__status\" id=\"status\">\n <div class=\"utrecht-form-field-description utrecht-form-field-description--status\">\n <slot name=\"status\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"form-field-checkbox.js","sourceRoot":"","sources":["../../src/components/form-field-checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, Element, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-form-field-checkbox',\n styleUrl: 'form-field-checkbox.scss',\n shadow: true,\n})\nexport class FormFieldCheckbox {\n @Element() hostElement!: HTMLElement;\n\n @Prop() label: string = '';\n @Prop({ attribute: 'disabled', reflect: true }) disabled: boolean = false;\n @Prop({ attribute: 'checked', reflect: true }) checked: boolean = false;\n @Prop({ attribute: 'invalid', reflect: true }) invalid: boolean = false;\n @Prop({ attribute: 'required', reflect: true }) required: boolean = false;\n @Prop() name: string = '';\n @Prop() value: string = '';\n @Event() utrechtBlur: EventEmitter;\n @Event() utrechtChange: EventEmitter;\n @Event() utrechtFocus: EventEmitter;\n @Event() utrechtInput: EventEmitter;\n\n render() {\n const { checked, disabled, hostElement, label, name, invalid, required, value } = this;\n\n let input = hostElement.querySelector('input[type=\"hidden\"]') as HTMLInputElement \| null;\n\n if (input && !name) {\n input.parentNode.removeChild(input);\n }\n\n if (!input && name) {\n input = hostElement.ownerDocument.createElement('input');\n input.type = 'hidden';\n hostElement.appendChild(input);\n }\n\n if (input && name) {\n input.name = name;\n input.value = checked ? value \|\| '' : '';\n }\n\n return (\n <div\n class={clsx('utrecht-form-field', 'utrecht-form-field--checkbox', {\n 'utrecht-form-field--invalid': invalid,\n })}\n >\n <p class=\"utrecht-form-field__label utrecht-form-field__label--checkbox\">\n <label\n class={clsx('utrecht-form-label', {\n 'utrecht-form-label--disabled': disabled,\n })}\n htmlFor=\"input\"\n >\n <input\n id=\"input\"\n type=\"checkbox\"\n class={clsx(\n 'utrecht-form-field__input',\n 'utrecht-checkbox',\n 'utrecht-checkbox--custom',\n 'utrecht-checkbox--html-input',\n {\n 'utrecht-checkbox--disabled': disabled,\n 'utrecht-checkbox--invalid': invalid,\n 'utrecht-checkbox--required': required,\n },\n )}\n aria-invalid={invalid \|\| undefined}\n disabled={disabled}\n required={required}\n checked={checked}\n value={value}\n onBlur={(evt) => this.utrechtBlur.emit(evt)}\n onChange={(evt) => this.utrechtChange.emit(evt)}\n onFocus={(evt) => this.utrechtFocus.emit(evt)}\n onInput={(evt) => {\n this.checked = (evt.target as HTMLInputElement).checked;\n this.utrechtInput.emit(evt);\n }}\n />{' '}\n {label}\n <slot name=\"label\"></slot>\n </label>\n {invalid && (\n <utrecht-form-field-description\n status=\"invalid\"\n class=\"utrecht-form-field__description utrecht-form-field__description--invalid\"\n id=\"error-message\"\n >\n <slot name=\"error-message\"></slot>\n </utrecht-form-field-description>\n )}\n </p>\n <utrecht-form-field-description class=\"utrecht-form-field__description\" id=\"description\">\n <slot name=\"description\"></slot>\n </utrecht-form-field-description>\n <div class=\"utrecht-form-field__status\" id=\"status\">\n <div class=\"utrecht-form-field-description utrecht-form-field-description--status\">\n <slot name=\"status\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/form-field-description.js CHANGED Viewed

@@ -10,7 +10,7 @@ export class FormFieldDescription {
     }
     render() {
         const { status } = this;
-        return (h("div", { class: clsx('utrecht-form-field-description', status === 'valid' && 'utrecht-form-field-description--valid', status === 'invalid' && 'utrecht-form-field-description--invalid') }, h("slot", null)));
+        return (h("div", { key: '3a4163e4b022daaf98bebea9d51e4c2884507d80', class: clsx('utrecht-form-field-description', status === 'valid' && 'utrecht-form-field-description--valid', status === 'invalid' && 'utrecht-form-field-description--invalid') }, h("slot", { key: '5408ce48a98c4c1cf593b49701864aaa5ab756c0' })));
     }
     static get is() { return "utrecht-form-field-description"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/form-field-description.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-field-description.js","sourceRoot":"","sources":["~~../../../~~src/components/form-field-description.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,OAAO,oBAAoB;;sBACiC,IAAI;;IAEpE,MAAM;QACJ,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;QAExB,OAAO,CACL,~~WACE~~,KAAK,EAAE,IAAI,CACT,gCAAgC,EAChC,MAAM,KAAK,OAAO,IAAI,uCAAuC,EAC7D,MAAM,KAAK,SAAS,IAAI,yCAAyC,CAClE;YAED,~~eAAa~~,CACT,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-form-field-description',\n styleUrl: 'form-field-description.scss',\n shadow: true,\n})\nexport class FormFieldDescription {\n @Prop({ attribute: 'status', reflect: true }) status?: string = null;\n\n render() {\n const { status } = this;\n\n return (\n <div\n class={clsx(\n 'utrecht-form-field-description',\n status === 'valid' && 'utrecht-form-field-description--valid',\n status === 'invalid' && 'utrecht-form-field-description--invalid',\n )}\n >\n <slot></slot>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"form-field-description.js","sourceRoot":"","sources":["../../src/components/form-field-description.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,OAAO,oBAAoB;;sBACiC,IAAI;;IAEpE,MAAM;QACJ,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;QAExB,OAAO,CACL,4DACE,KAAK,EAAE,IAAI,CACT,gCAAgC,EAChC,MAAM,KAAK,OAAO,IAAI,uCAAuC,EAC7D,MAAM,KAAK,SAAS,IAAI,yCAAyC,CAClE;YAED,8DAAa,CACT,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-form-field-description',\n styleUrl: 'form-field-description.scss',\n shadow: true,\n})\nexport class FormFieldDescription {\n @Prop({ attribute: 'status', reflect: true }) status?: string = null;\n\n render() {\n const { status } = this;\n\n return (\n <div\n class={clsx(\n 'utrecht-form-field-description',\n status === 'valid' && 'utrecht-form-field-description--valid',\n status === 'invalid' && 'utrecht-form-field-description--invalid',\n )}\n >\n <slot></slot>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/form-field-error-message.js CHANGED Viewed

@@ -5,7 +5,7 @@
 import { h } from "@stencil/core";
 export class FormFieldErrorMessage {
     render() {
-        return h("slot", null);
+        return h("slot", { key: '8461e77cb793b8820b55d66f63ce8010773c438c' });
     }
     static get is() { return "utrecht-form-field-error-message"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/form-field-error-message.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-field-error-message.js","sourceRoot":"","sources":["~~../../../~~src/components/form-field-error-message.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,qBAAqB;IAChC,MAAM;QACJ,OAAO,~~eAAa~~,CAAC;IACvB,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-form-field-error-message',\n styleUrl: 'form-field-error-message.scss',\n shadow: true,\n})\nexport class FormFieldErrorMessage {\n render() {\n return <slot></slot>;\n }\n}\n"]}
1	+ {"version":3,"file":"form-field-error-message.js","sourceRoot":"","sources":["../../src/components/form-field-error-message.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,qBAAqB;IAChC,MAAM;QACJ,OAAO,8DAAa,CAAC;IACvB,CAAC;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-form-field-error-message',\n styleUrl: 'form-field-error-message.scss',\n shadow: true,\n})\nexport class FormFieldErrorMessage {\n render() {\n return <slot></slot>;\n }\n}\n"]}

package/dist/collection/components/form-field-textarea.js CHANGED Viewed

@@ -34,14 +34,14 @@ export class FormFieldTextarea {
             input.name = name;
             input.value = value || '';
         }
-        return (h("div", { class: clsx('utrecht-form-field', 'utrecht-form-field--textbox', {
+        return (h("div", { key: 'd6ababfee87bdba23a46dcb2ca72f454cbee3415', class: clsx('utrecht-form-field', 'utrecht-form-field--textbox', {
                 'utrecht-form-field--invalid': invalid,
-            }) }, h("p", { class: "utrecht-form-field__label" }, h("label", { class: clsx('utrecht-form-label', {
+            }) }, h("p", { key: '5a87c3f75302a119209b880fe73c46d1fa9130b4', class: "utrecht-form-field__label" }, h("label", { key: 'bea182ffec6279eddb15028984278f67ec4fe5d9', class: clsx('utrecht-form-label', {
                 'utrecht-form-label--disabled': disabled,
-            }), htmlFor: "input" }, label, h("slot", { name: "label" }))), h("utrecht-form-field-description", { id: "description" }, h("slot", { name: "description" })), invalid && (h("utrecht-form-field-description", { status: "invalid", class: "utrecht-form-field__error-message", id: "error-message" }, h("slot", { name: "error-message" }))), h("p", { class: "utrecht-form-field__input" }, h("textarea", { id: "input", class: clsx('utrecht-textarea', 'utrecht-textarea--html-textarea', disabled && 'utrecht-textarea--disabled', invalid && 'utrecht-textarea--invalid', readOnly && 'utrecht-textarea--readonly'), "aria-invalid": invalid, cols: cols !== HTML_DEFAULT_COLS ? cols : null, disabled: disabled, dir: "auto", placeholder: placeholder || null, readonly: readOnly, required: required, rows: rows !== HTML_DEFAULT_ROWS ? rows : null, onBlur: (evt) => this.utrechtBlur.emit(evt), onChange: (evt) => this.utrechtChange.emit(evt), onFocus: (evt) => this.utrechtFocus.emit(evt), onInput: (evt) => {
+            }), htmlFor: "input" }, label, h("slot", { key: 'ef85b539d73de13c2ebeb6972c9fc63ddfedabe6', name: "label" }))), h("utrecht-form-field-description", { key: '25527eb7a39816596e3acd5aebe0230b72356e25', id: "description" }, h("slot", { key: 'af077dd05def32105fa0c3dbbf5e20e4671fc25b', name: "description" })), invalid && (h("utrecht-form-field-description", { key: '444c5ee8c6ee638a36f95cd4577f5df6165477ce', status: "invalid", class: "utrecht-form-field__error-message", id: "error-message" }, h("slot", { key: '013d9c6d6016f36099e6733dbfe5fd4df6a4efee', name: "error-message" }))), h("p", { key: '7e66dc7e13ed92ed1f899c0b26a0f3bec1147e0c', class: "utrecht-form-field__input" }, h("textarea", { key: 'c52075082e1a4f6b8f8f24502d5493cf60b5370c', id: "input", class: clsx('utrecht-textarea', 'utrecht-textarea--html-textarea', disabled && 'utrecht-textarea--disabled', invalid && 'utrecht-textarea--invalid', readOnly && 'utrecht-textarea--readonly'), "aria-invalid": invalid, cols: cols !== HTML_DEFAULT_COLS ? cols : null, disabled: disabled, dir: "auto", placeholder: placeholder || null, readonly: readOnly, required: required, rows: rows !== HTML_DEFAULT_ROWS ? rows : null, onBlur: (evt) => this.utrechtBlur.emit(evt), onChange: (evt) => this.utrechtChange.emit(evt), onFocus: (evt) => this.utrechtFocus.emit(evt), onInput: (evt) => {
                 this.value = evt.target.value;
                 this.utrechtInput.emit(evt);
-            } }, value)), h("div", { class: "utrecht-form-field__status", id: "status" }, h("div", { class: "utrecht-form-field-description utrecht-form-field-description--status" }, h("slot", { name: "status" })))));
+            } }, value)), h("div", { key: '84140728b2dc0dd2519348b40a1e28ba106fe7b3', class: "utrecht-form-field__status", id: "status" }, h("div", { key: '4a1fba4ee60281d955826b4688fcb19d44c024fc', class: "utrecht-form-field-description utrecht-form-field-description--status" }, h("slot", { key: '0a68c43c0e92f1f614ef1b50833e7094e861302f', name: "status" })))));
     }
     static get is() { return "utrecht-form-field-textarea"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/form-field-textarea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-field-textarea.js","sourceRoot":"","sources":["~~../../../~~src/components/form-field-textarea.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACjF,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,MAAM,iBAAiB,GAAG,EAAE,CAAC;AAC7B,MAAM,iBAAiB,GAAG,CAAC,CAAC;AAO5B,MAAM,OAAO,iBAAiB;;oBAEL,iBAAiB;wBACK,KAAK;uBACN,KAAK;qBACzB,EAAE;oBACH,EAAE;wBAC2C,KAAK;2BAC3C,EAAE;wBACa,KAAK;oBAC3B,iBAAiB;qBAChB,EAAE;;IAM1B,MAAM;QACJ,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;QAEjH,IAAI,KAAK,GAAG,WAAW,CAAC,aAAa,CAAC,sBAAsB,CAA4B,CAAC;QAEzF,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;~~YAClB~~,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;~~SACrC~~;QAED,IAAI,CAAC,KAAK,IAAI,IAAI,EAAE;~~YAClB~~,KAAK,GAAG,WAAW,CAAC,aAAa,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;YACzD,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAC;YACtB,WAAW,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;~~SAChC~~;QAED,IAAI,KAAK,IAAI,IAAI,EAAE;~~YACjB~~,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;YAClB,KAAK,CAAC,KAAK,GAAG,KAAK,IAAI,EAAE,CAAC;~~SAC3B~~;QAED,OAAO,CACL,~~WACE~~,KAAK,EAAE,IAAI,CAAC,oBAAoB,EAAE,6BAA6B,EAAE;gBAC/D,6BAA6B,EAAE,OAAO;aACvC,CAAC;YAEF,~~SAAG~~,KAAK,EAAC,2BAA2B;gBAClC,~~aACE~~,KAAK,EAAE,IAAI,CAAC,oBAAoB,EAAE;wBAChC,8BAA8B,EAAE,QAAQ;qBACzC,CAAC,EACF,OAAO,EAAC,OAAO;oBAEd,KAAK;oBACN,~~YAAM~~,IAAI,EAAC,OAAO,GAAQ,CACpB,CACN;YACJ,~~sCAAgC~~,EAAE,EAAC,aAAa;gBAC9C,~~YAAM~~,IAAI,EAAC,aAAa,GAAQ,CACD;YAChC,OAAO,IAAI,CACV,~~sCAAgC~~,MAAM,EAAC,SAAS,EAAC,KAAK,EAAC,mCAAmC,EAAC,EAAE,EAAC,eAAe;gBAC3G,~~YAAM~~,IAAI,EAAC,eAAe,GAAQ,CACH,CAClC;YACD,~~SAAG~~,KAAK,EAAC,2BAA2B;gBAClC,~~gBACE~~,EAAE,EAAC,OAAO,EACV,KAAK,EAAE,IAAI,CACT,kBAAkB,EAClB,iCAAiC,EACjC,QAAQ,IAAI,4BAA4B,EACxC,OAAO,IAAI,2BAA2B,EACtC,QAAQ,IAAI,4BAA4B,CACzC,kBACa,OAAO,EACrB,IAAI,EAAE,IAAI,KAAK,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EAC9C,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAC,MAAM,EACV,WAAW,EAAE,WAAW,IAAI,IAAI,EAChC,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,KAAK,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EAC9C,MAAM,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,EAC3C,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,CAAC,EAC/C,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,EAC7C,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE;wBACf,IAAI,CAAC,KAAK,GAAI,GAAG,CAAC,MAA8B,CAAC,KAAK,CAAC;wBACvD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;oBAC9B,CAAC,IAEA,KAAK,CACG,CACT;YACJ,~~WAAK~~,KAAK,EAAC,4BAA4B,EAAC,EAAE,EAAC,QAAQ;gBACjD,~~WAAK~~,KAAK,EAAC,uEAAuE;oBAChF,~~YAAM~~,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, Element, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\nconst HTML_DEFAULT_COLS = 20;\nconst HTML_DEFAULT_ROWS = 2;\n\n@Component({\n tag: 'utrecht-form-field-textarea',\n styleUrl: 'form-field-textarea.scss',\n shadow: true,\n})\nexport class FormFieldTextarea {\n @Element() hostElement!: HTMLElement;\n @Prop() cols: number = HTML_DEFAULT_COLS;\n @Prop({ reflect: true }) disabled: boolean = false;\n @Prop({ reflect: true }) invalid: boolean = false;\n @Prop() label: string = '';\n @Prop() name: string = '';\n @Prop({ attribute: 'readonly', reflect: true }) readOnly: boolean = false;\n @Prop() placeholder: string = '';\n @Prop({ reflect: true }) required: boolean = false;\n @Prop() rows: number = HTML_DEFAULT_ROWS;\n @Prop() value: string = '';\n @Event() utrechtBlur: EventEmitter;\n @Event() utrechtChange: EventEmitter;\n @Event() utrechtFocus: EventEmitter;\n @Event() utrechtInput: EventEmitter;\n\n render() {\n const { cols, disabled, hostElement, invalid, label, name, placeholder, readOnly, required, rows, value } = this;\n\n let input = hostElement.querySelector('input[type=\"hidden\"]') as HTMLInputElement \| null;\n\n if (input && !name) {\n input.parentNode.removeChild(input);\n }\n\n if (!input && name) {\n input = hostElement.ownerDocument.createElement('input');\n input.type = 'hidden';\n hostElement.appendChild(input);\n }\n\n if (input && name) {\n input.name = name;\n input.value = value \|\| '';\n }\n\n return (\n <div\n class={clsx('utrecht-form-field', 'utrecht-form-field--textbox', {\n 'utrecht-form-field--invalid': invalid,\n })}\n >\n <p class=\"utrecht-form-field__label\">\n <label\n class={clsx('utrecht-form-label', {\n 'utrecht-form-label--disabled': disabled,\n })}\n htmlFor=\"input\"\n >\n {label}\n <slot name=\"label\"></slot>\n </label>\n </p>\n <utrecht-form-field-description id=\"description\">\n <slot name=\"description\"></slot>\n </utrecht-form-field-description>\n {invalid && (\n <utrecht-form-field-description status=\"invalid\" class=\"utrecht-form-field__error-message\" id=\"error-message\">\n <slot name=\"error-message\"></slot>\n </utrecht-form-field-description>\n )}\n <p class=\"utrecht-form-field__input\">\n <textarea\n id=\"input\"\n class={clsx(\n 'utrecht-textarea',\n 'utrecht-textarea--html-textarea',\n disabled && 'utrecht-textarea--disabled',\n invalid && 'utrecht-textarea--invalid',\n readOnly && 'utrecht-textarea--readonly',\n )}\n aria-invalid={invalid}\n cols={cols !== HTML_DEFAULT_COLS ? cols : null}\n disabled={disabled}\n dir=\"auto\"\n placeholder={placeholder \|\| null}\n readonly={readOnly}\n required={required}\n rows={rows !== HTML_DEFAULT_ROWS ? rows : null}\n onBlur={(evt) => this.utrechtBlur.emit(evt)}\n onChange={(evt) => this.utrechtChange.emit(evt)}\n onFocus={(evt) => this.utrechtFocus.emit(evt)}\n onInput={(evt) => {\n this.value = (evt.target as HTMLTextAreaElement).value;\n this.utrechtInput.emit(evt);\n }}\n >\n {value}\n </textarea>\n </p>\n <div class=\"utrecht-form-field__status\" id=\"status\">\n <div class=\"utrecht-form-field-description utrecht-form-field-description--status\">\n <slot name=\"status\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"form-field-textarea.js","sourceRoot":"","sources":["../../src/components/form-field-textarea.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, Element, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\nconst HTML_DEFAULT_COLS = 20;\nconst HTML_DEFAULT_ROWS = 2;\n\n@Component({\n tag: 'utrecht-form-field-textarea',\n styleUrl: 'form-field-textarea.scss',\n shadow: true,\n})\nexport class FormFieldTextarea {\n @Element() hostElement!: HTMLElement;\n @Prop() cols: number = HTML_DEFAULT_COLS;\n @Prop({ reflect: true }) disabled: boolean = false;\n @Prop({ reflect: true }) invalid: boolean = false;\n @Prop() label: string = '';\n @Prop() name: string = '';\n @Prop({ attribute: 'readonly', reflect: true }) readOnly: boolean = false;\n @Prop() placeholder: string = '';\n @Prop({ reflect: true }) required: boolean = false;\n @Prop() rows: number = HTML_DEFAULT_ROWS;\n @Prop() value: string = '';\n @Event() utrechtBlur: EventEmitter;\n @Event() utrechtChange: EventEmitter;\n @Event() utrechtFocus: EventEmitter;\n @Event() utrechtInput: EventEmitter;\n\n render() {\n const { cols, disabled, hostElement, invalid, label, name, placeholder, readOnly, required, rows, value } = this;\n\n let input = hostElement.querySelector('input[type=\"hidden\"]') as HTMLInputElement \| null;\n\n if (input && !name) {\n input.parentNode.removeChild(input);\n }\n\n if (!input && name) {\n input = hostElement.ownerDocument.createElement('input');\n input.type = 'hidden';\n hostElement.appendChild(input);\n }\n\n if (input && name) {\n input.name = name;\n input.value = value \|\| '';\n }\n\n return (\n <div\n class={clsx('utrecht-form-field', 'utrecht-form-field--textbox', {\n 'utrecht-form-field--invalid': invalid,\n })}\n >\n <p class=\"utrecht-form-field__label\">\n <label\n class={clsx('utrecht-form-label', {\n 'utrecht-form-label--disabled': disabled,\n })}\n htmlFor=\"input\"\n >\n {label}\n <slot name=\"label\"></slot>\n </label>\n </p>\n <utrecht-form-field-description id=\"description\">\n <slot name=\"description\"></slot>\n </utrecht-form-field-description>\n {invalid && (\n <utrecht-form-field-description status=\"invalid\" class=\"utrecht-form-field__error-message\" id=\"error-message\">\n <slot name=\"error-message\"></slot>\n </utrecht-form-field-description>\n )}\n <p class=\"utrecht-form-field__input\">\n <textarea\n id=\"input\"\n class={clsx(\n 'utrecht-textarea',\n 'utrecht-textarea--html-textarea',\n disabled && 'utrecht-textarea--disabled',\n invalid && 'utrecht-textarea--invalid',\n readOnly && 'utrecht-textarea--readonly',\n )}\n aria-invalid={invalid}\n cols={cols !== HTML_DEFAULT_COLS ? cols : null}\n disabled={disabled}\n dir=\"auto\"\n placeholder={placeholder \|\| null}\n readonly={readOnly}\n required={required}\n rows={rows !== HTML_DEFAULT_ROWS ? rows : null}\n onBlur={(evt) => this.utrechtBlur.emit(evt)}\n onChange={(evt) => this.utrechtChange.emit(evt)}\n onFocus={(evt) => this.utrechtFocus.emit(evt)}\n onInput={(evt) => {\n this.value = (evt.target as HTMLTextAreaElement).value;\n this.utrechtInput.emit(evt);\n }}\n >\n {value}\n </textarea>\n </p>\n <div class=\"utrecht-form-field__status\" id=\"status\">\n <div class=\"utrecht-form-field-description utrecht-form-field-description--status\">\n <slot name=\"status\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/form-field-textbox.js CHANGED Viewed

@@ -36,14 +36,14 @@ export class FormFieldTextbox {
             input.name = name;
             input.value = value || '';
         }
-        return (h("div", { class: clsx('utrecht-form-field', 'utrecht-form-field--textbox', {
+        return (h("div", { key: '81f69dc4c9b116fcb0e560f413df61a188c70f68', class: clsx('utrecht-form-field', 'utrecht-form-field--textbox', {
                 'utrecht-form-field--invalid': invalid,
-            }) }, h("p", { class: "utrecht-form-field__label" }, h("label", { class: clsx('utrecht-form-label', {
+            }) }, h("p", { key: '8e8141e3eee2b40f7801a3837f939404eff69a9b', class: "utrecht-form-field__label" }, h("label", { key: '1305f854bf2e74e222a3140125c9f917e5066140', class: clsx('utrecht-form-label', {
                 'utrecht-form-label--disabled': disabled,
-            }), htmlFor: "input" }, label, h("slot", { name: "label" }))), h("utrecht-form-field-description", { id: "description" }, h("slot", { name: "description" })), invalid && (h("utrecht-form-field-description", { status: "invalid", class: "utrecht-form-field__error-message", id: "error-message" }, h("slot", { name: "error-message" }))), h("p", { class: "utrecht-form-field__input" }, h("input", { id: "input", class: clsx('utrecht-form-field__input', 'utrecht-textbox', 'utrecht-textbox--html-input', disabled && 'utrecht-textbox--disabled', invalid && 'utrecht-textbox--invalid', readOnly && 'utrecht-textbox--readonly'), type: type || 'text', autoComplete: autoComplete ? autoComplete : null, "aria-describedby": clsx('description', 'status', { 'error-message': invalid }), "aria-invalid": invalid, dir: "auto", disabled: disabled, min: typeof min === 'number' ? String(min) : typeof min === 'string' ? min : null, max: typeof max === 'number' ? String(max) : typeof max === 'string' ? max : null, pattern: pattern ? pattern : null, placeholder: placeholder || null, readonly: readOnly, required: required, value: value, onBlur: (evt) => this.utrechtBlur.emit(evt), onChange: (evt) => this.utrechtChange.emit(evt), onFocus: (evt) => this.utrechtFocus.emit(evt), onInput: (evt) => {
+            }), htmlFor: "input" }, label, h("slot", { key: '2d0c7a3e19f99e53dbc0db8969daa1e801fcb56f', name: "label" }))), h("utrecht-form-field-description", { key: 'bff6fd53e4bfc70af9f74b63be9c84b10c5e64b1', id: "description" }, h("slot", { key: '4acf695691c3feeb81c349fdb172f1f404fd0f43', name: "description" })), invalid && (h("utrecht-form-field-description", { key: '1382ceee3c586948bf7f5324dbb4278626351e08', status: "invalid", class: "utrecht-form-field__error-message", id: "error-message" }, h("slot", { key: '768832d7234708f0bea96aa0a7c54a7f7ec32b6c', name: "error-message" }))), h("p", { key: 'c44cdc24ee3e5f27674e0096fa177b98f007ff3c', class: "utrecht-form-field__input" }, h("input", { key: 'dc34dc18072913cca937af2be29fa962399a553e', id: "input", class: clsx('utrecht-form-field__input', 'utrecht-textbox', 'utrecht-textbox--html-input', disabled && 'utrecht-textbox--disabled', invalid && 'utrecht-textbox--invalid', readOnly && 'utrecht-textbox--readonly'), type: type || 'text', autoComplete: autoComplete ? autoComplete : null, "aria-describedby": clsx('description', 'status', { 'error-message': invalid }), "aria-invalid": invalid, dir: "auto", disabled: disabled, min: typeof min === 'number' ? String(min) : typeof min === 'string' ? min : null, max: typeof max === 'number' ? String(max) : typeof max === 'string' ? max : null, pattern: pattern ? pattern : null, placeholder: placeholder || null, readonly: readOnly, required: required, value: value, onBlur: (evt) => this.utrechtBlur.emit(evt), onChange: (evt) => this.utrechtChange.emit(evt), onFocus: (evt) => this.utrechtFocus.emit(evt), onInput: (evt) => {
                 this.value = evt.target.value;
                 this.utrechtInput.emit(evt);
-            } })), h("div", { class: "utrecht-form-field__status", id: "status" }, h("div", { class: "utrecht-form-field-description utrecht-form-field-description--status" }, h("slot", { name: "status" })))));
+            } })), h("div", { key: 'c5f76aeaa428ca712f47166addae039dd86d25c6', class: "utrecht-form-field__status", id: "status" }, h("div", { key: '76d7daebf1fafa8041f7ec6068f9374820b4affd', class: "utrecht-form-field-description utrecht-form-field-description--status" }, h("slot", { key: 'cc7d9e57d82185f3306184bd9ff02ae828d35001', name: "status" })))));
     }
     static get is() { return "utrecht-form-field-textbox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/form-field-textbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-field-textbox.js","sourceRoot":"","sources":["~~../../../~~src/components/form-field-textbox.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACjF,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,OAAO,gBAAgB;;4BAGgD,EAAE;wBAChC,KAAK;uBACN,KAAK;qBACzB,EAAE;mBACK,EAAE;mBACF,EAAE;oBACV,EAAE;uBACC,EAAE;2BACE,EAAE;wBACoC,KAAK;wBAC5B,KAAK;oBACV,EAAE;qBAClB,EAAE;;IAM1B,MAAM;QACJ,MAAM,EACJ,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,OAAO,EACP,KAAK,EACL,GAAG,EACH,GAAG,EACH,IAAI,EACJ,OAAO,EACP,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,KAAK,GACN,GAAG,IAAI,CAAC;QAET,IAAI,KAAK,GAAG,WAAW,CAAC,aAAa,CAAC,sBAAsB,CAA4B,CAAC;QAEzF,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;~~YAClB~~,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;~~SACrC~~;QAED,IAAI,CAAC,KAAK,IAAI,IAAI,EAAE;~~YAClB~~,KAAK,GAAG,WAAW,CAAC,aAAa,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;YACzD,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAC;YACtB,KAAK,CAAC,UAAU,GAAG,MAAM,CAAC;YAC1B,WAAW,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;~~SAChC~~;QAED,IAAI,KAAK,IAAI,IAAI,EAAE;~~YACjB~~,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;YAClB,KAAK,CAAC,KAAK,GAAG,KAAK,IAAI,EAAE,CAAC;~~SAC3B~~;QAED,OAAO,CACL,~~WACE~~,KAAK,EAAE,IAAI,CAAC,oBAAoB,EAAE,6BAA6B,EAAE;gBAC/D,6BAA6B,EAAE,OAAO;aACvC,CAAC;YAEF,~~SAAG~~,KAAK,EAAC,2BAA2B;gBAClC,~~aACE~~,KAAK,EAAE,IAAI,CAAC,oBAAoB,EAAE;wBAChC,8BAA8B,EAAE,QAAQ;qBACzC,CAAC,EACF,OAAO,EAAC,OAAO;oBAEd,KAAK;oBACN,~~YAAM~~,IAAI,EAAC,OAAO,GAAQ,CACpB,CACN;YACJ,~~sCAAgC~~,EAAE,EAAC,aAAa;gBAC9C,~~YAAM~~,IAAI,EAAC,aAAa,GAAQ,CACD;YAChC,OAAO,IAAI,CACV,~~sCAAgC~~,MAAM,EAAC,SAAS,EAAC,KAAK,EAAC,mCAAmC,EAAC,EAAE,EAAC,eAAe;gBAC3G,~~YAAM~~,IAAI,EAAC,eAAe,GAAQ,CACH,CAClC;YACD,~~SAAG~~,KAAK,EAAC,2BAA2B;gBAClC,~~aACE~~,EAAE,EAAC,OAAO,EACV,KAAK,EAAE,IAAI,CACT,2BAA2B,EAC3B,iBAAiB,EACjB,6BAA6B,EAC7B,QAAQ,IAAI,2BAA2B,EACvC,OAAO,IAAI,0BAA0B,EACrC,QAAQ,IAAI,2BAA2B,CACxC,EACD,IAAI,EAAE,IAAI,IAAI,MAAM,EACpB,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,sBAC9B,IAAI,CAAC,aAAa,EAAE,QAAQ,EAAE,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC,kBAC/D,OAAO,EACrB,GAAG,EAAC,MAAM,EACV,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EACjF,GAAG,EAAE,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EACjF,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,EACjC,WAAW,EAAE,WAAW,IAAI,IAAI,EAChC,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,EAC3C,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,CAAC,EAC/C,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,EAC7C,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE;wBACf,IAAI,CAAC,KAAK,GAAI,GAAG,CAAC,MAA2B,CAAC,KAAK,CAAC;wBACpD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;oBAC9B,CAAC,GACD,CACA;YACJ,~~WAAK~~,KAAK,EAAC,4BAA4B,EAAC,EAAE,EAAC,QAAQ;gBACjD,~~WAAK~~,KAAK,EAAC,uEAAuE;oBAChF,~~YAAM~~,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, Element, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-form-field-textbox',\n styleUrl: 'form-field-textbox.scss',\n shadow: true,\n})\nexport class FormFieldTextbox {\n @Element() hostElement!: HTMLElement;\n\n @Prop({ attribute: 'autocomplete', reflect: true }) autoComplete: string = '';\n @Prop({ reflect: true }) disabled: boolean = false;\n @Prop({ reflect: true }) invalid: boolean = false;\n @Prop() label: string = '';\n @Prop() min: number \| string = '';\n @Prop() max: number \| string = '';\n @Prop() name: string = '';\n @Prop() pattern: string = '';\n @Prop() placeholder: string = '';\n @Prop({ attribute: 'readonly', reflect: true }) readOnly: boolean = false;\n @Prop({ reflect: true }) required: boolean = false;\n @Prop({ reflect: true }) type: string = '';\n @Prop() value: string = '';\n @Event() utrechtBlur: EventEmitter;\n @Event() utrechtChange: EventEmitter;\n @Event() utrechtFocus: EventEmitter;\n @Event() utrechtInput: EventEmitter;\n\n render() {\n const {\n autoComplete,\n disabled,\n hostElement,\n invalid,\n label,\n min,\n max,\n name,\n pattern,\n placeholder,\n readOnly,\n required,\n type,\n value,\n } = this;\n\n let input = hostElement.querySelector('input[type=\"hidden\"]') as HTMLInputElement \| null;\n\n if (input && !name) {\n input.parentNode.removeChild(input);\n }\n\n if (!input && name) {\n input = hostElement.ownerDocument.createElement('input');\n input.type = 'hidden';\n input.ariaHidden = 'true';\n hostElement.appendChild(input);\n }\n\n if (input && name) {\n input.name = name;\n input.value = value \|\| '';\n }\n\n return (\n <div\n class={clsx('utrecht-form-field', 'utrecht-form-field--textbox', {\n 'utrecht-form-field--invalid': invalid,\n })}\n >\n <p class=\"utrecht-form-field__label\">\n <label\n class={clsx('utrecht-form-label', {\n 'utrecht-form-label--disabled': disabled,\n })}\n htmlFor=\"input\"\n >\n {label}\n <slot name=\"label\"></slot>\n </label>\n </p>\n <utrecht-form-field-description id=\"description\">\n <slot name=\"description\"></slot>\n </utrecht-form-field-description>\n {invalid && (\n <utrecht-form-field-description status=\"invalid\" class=\"utrecht-form-field__error-message\" id=\"error-message\">\n <slot name=\"error-message\"></slot>\n </utrecht-form-field-description>\n )}\n <p class=\"utrecht-form-field__input\">\n <input\n id=\"input\"\n class={clsx(\n 'utrecht-form-field__input',\n 'utrecht-textbox',\n 'utrecht-textbox--html-input',\n disabled && 'utrecht-textbox--disabled',\n invalid && 'utrecht-textbox--invalid',\n readOnly && 'utrecht-textbox--readonly',\n )}\n type={type \|\| 'text'}\n autoComplete={autoComplete ? autoComplete : null}\n aria-describedby={clsx('description', 'status', { 'error-message': invalid })}\n aria-invalid={invalid}\n dir=\"auto\"\n disabled={disabled}\n min={typeof min === 'number' ? String(min) : typeof min === 'string' ? min : null}\n max={typeof max === 'number' ? String(max) : typeof max === 'string' ? max : null}\n pattern={pattern ? pattern : null}\n placeholder={placeholder \|\| null}\n readonly={readOnly}\n required={required}\n value={value}\n onBlur={(evt) => this.utrechtBlur.emit(evt)}\n onChange={(evt) => this.utrechtChange.emit(evt)}\n onFocus={(evt) => this.utrechtFocus.emit(evt)}\n onInput={(evt) => {\n this.value = (evt.target as HTMLInputElement).value;\n this.utrechtInput.emit(evt);\n }}\n />\n </p>\n <div class=\"utrecht-form-field__status\" id=\"status\">\n <div class=\"utrecht-form-field-description utrecht-form-field-description--status\">\n <slot name=\"status\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"form-field-textbox.js","sourceRoot":"","sources":["../../src/components/form-field-textbox.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, Element, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-form-field-textbox',\n styleUrl: 'form-field-textbox.scss',\n shadow: true,\n})\nexport class FormFieldTextbox {\n @Element() hostElement!: HTMLElement;\n\n @Prop({ attribute: 'autocomplete', reflect: true }) autoComplete: string = '';\n @Prop({ reflect: true }) disabled: boolean = false;\n @Prop({ reflect: true }) invalid: boolean = false;\n @Prop() label: string = '';\n @Prop() min: number \| string = '';\n @Prop() max: number \| string = '';\n @Prop() name: string = '';\n @Prop() pattern: string = '';\n @Prop() placeholder: string = '';\n @Prop({ attribute: 'readonly', reflect: true }) readOnly: boolean = false;\n @Prop({ reflect: true }) required: boolean = false;\n @Prop({ reflect: true }) type: string = '';\n @Prop() value: string = '';\n @Event() utrechtBlur: EventEmitter;\n @Event() utrechtChange: EventEmitter;\n @Event() utrechtFocus: EventEmitter;\n @Event() utrechtInput: EventEmitter;\n\n render() {\n const {\n autoComplete,\n disabled,\n hostElement,\n invalid,\n label,\n min,\n max,\n name,\n pattern,\n placeholder,\n readOnly,\n required,\n type,\n value,\n } = this;\n\n let input = hostElement.querySelector('input[type=\"hidden\"]') as HTMLInputElement \| null;\n\n if (input && !name) {\n input.parentNode.removeChild(input);\n }\n\n if (!input && name) {\n input = hostElement.ownerDocument.createElement('input');\n input.type = 'hidden';\n input.ariaHidden = 'true';\n hostElement.appendChild(input);\n }\n\n if (input && name) {\n input.name = name;\n input.value = value \|\| '';\n }\n\n return (\n <div\n class={clsx('utrecht-form-field', 'utrecht-form-field--textbox', {\n 'utrecht-form-field--invalid': invalid,\n })}\n >\n <p class=\"utrecht-form-field__label\">\n <label\n class={clsx('utrecht-form-label', {\n 'utrecht-form-label--disabled': disabled,\n })}\n htmlFor=\"input\"\n >\n {label}\n <slot name=\"label\"></slot>\n </label>\n </p>\n <utrecht-form-field-description id=\"description\">\n <slot name=\"description\"></slot>\n </utrecht-form-field-description>\n {invalid && (\n <utrecht-form-field-description status=\"invalid\" class=\"utrecht-form-field__error-message\" id=\"error-message\">\n <slot name=\"error-message\"></slot>\n </utrecht-form-field-description>\n )}\n <p class=\"utrecht-form-field__input\">\n <input\n id=\"input\"\n class={clsx(\n 'utrecht-form-field__input',\n 'utrecht-textbox',\n 'utrecht-textbox--html-input',\n disabled && 'utrecht-textbox--disabled',\n invalid && 'utrecht-textbox--invalid',\n readOnly && 'utrecht-textbox--readonly',\n )}\n type={type \|\| 'text'}\n autoComplete={autoComplete ? autoComplete : null}\n aria-describedby={clsx('description', 'status', { 'error-message': invalid })}\n aria-invalid={invalid}\n dir=\"auto\"\n disabled={disabled}\n min={typeof min === 'number' ? String(min) : typeof min === 'string' ? min : null}\n max={typeof max === 'number' ? String(max) : typeof max === 'string' ? max : null}\n pattern={pattern ? pattern : null}\n placeholder={placeholder \|\| null}\n readonly={readOnly}\n required={required}\n value={value}\n onBlur={(evt) => this.utrechtBlur.emit(evt)}\n onChange={(evt) => this.utrechtChange.emit(evt)}\n onFocus={(evt) => this.utrechtFocus.emit(evt)}\n onInput={(evt) => {\n this.value = (evt.target as HTMLInputElement).value;\n this.utrechtInput.emit(evt);\n }}\n />\n </p>\n <div class=\"utrecht-form-field__status\" id=\"status\">\n <div class=\"utrecht-form-field-description utrecht-form-field-description--status\">\n <slot name=\"status\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/form-toggle.js CHANGED Viewed

@@ -32,7 +32,7 @@ export class FormToggle {
                 toggleInteraction();
             }
         };
-        return (h("div", { class: clsx('utrecht-form-toggle', checked && 'utrecht-form-toggle--checked', !checked && 'utrecht-form-toggle--not-checked', disabled && 'utrecht-form-toggle--disabled'), tabIndex: disabled ? null : 0, role: "switch", "aria-disabled": disabled ? 'true' : null, onClick: handleClick, onKeyPress: handleKeyPress, onKeyUp: handleKeyUp }, h("div", { class: "utrecht-form-toggle__label utrecht-form-toggle__label--off" }), h("div", { class: "utrecht-form-toggle__label utrecht-form-toggle__label--on" }), h("div", { class: clsx('utrecht-form-toggle__track', checked && 'utrecht-form-toggle__track--checked', !checked && 'utrecht-form-toggle__track--not-checked', disabled && 'utrecht-form-toggle__track--disabled') }, h("div", { class: clsx('utrecht-form-toggle__thumb', checked && 'utrecht-form-toggle__thumb--checked', !checked && 'utrecht-form-toggle__thumb--not-checked', disabled && 'utrecht-form-toggle__thumb--disabled') }))));
+        return (h("div", { key: '54f5470a38cb60e12130f75e9b24ac02b9d96db9', class: clsx('utrecht-form-toggle', checked && 'utrecht-form-toggle--checked', !checked && 'utrecht-form-toggle--not-checked', disabled && 'utrecht-form-toggle--disabled'), tabIndex: disabled ? null : 0, role: "switch", "aria-disabled": disabled ? 'true' : null, onClick: handleClick, onKeyPress: handleKeyPress, onKeyUp: handleKeyUp }, h("div", { key: 'a265ad79b987d81de246ed844e7383b8bbddc69d', class: "utrecht-form-toggle__label utrecht-form-toggle__label--off" }), h("div", { key: '5832e80fa189690f6b6aad72b14bf6d073af9f43', class: "utrecht-form-toggle__label utrecht-form-toggle__label--on" }), h("div", { key: '2866dd1126c200d2c4f88ec05fc949d66ac2857f', class: clsx('utrecht-form-toggle__track', checked && 'utrecht-form-toggle__track--checked', !checked && 'utrecht-form-toggle__track--not-checked', disabled && 'utrecht-form-toggle__track--disabled') }, h("div", { key: 'a8da4d30ac7036f5cca07ab77b12e354de09acad', class: clsx('utrecht-form-toggle__thumb', checked && 'utrecht-form-toggle__thumb--checked', !checked && 'utrecht-form-toggle__thumb--not-checked', disabled && 'utrecht-form-toggle__thumb--disabled') }))));
     }
     static get is() { return "utrecht-form-toggle"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/form-toggle.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form-toggle.js","sourceRoot":"","sources":["~~../../../~~src/components/form-toggle.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,OAAO,UAAU;;wBACwB,KAAK;uBACN,KAAK;;IAMjD,MAAM;QACJ,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAEnC,MAAM,iBAAiB,GAAG,GAAG,EAAE;YAC7B,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;~~gBAClB~~,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;gBAC7B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;gBAC7B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;~~aAC/B~~;QACH,CAAC,CAAC;QAEF,MAAM,WAAW,GAAG,GAAG,EAAE;YACvB,iBAAiB,EAAE,CAAC;QACtB,CAAC,CAAC;QAEF,MAAM,cAAc,GAAG,CAAC,GAAG,EAAE,EAAE;YAC7B,IAAI,GAAG,CAAC,IAAI,KAAK,OAAO,IAAI,GAAG,CAAC,GAAG,KAAK,GAAG,EAAE;~~gBAC3C~~,iEAAiE;gBACjE,GAAG,CAAC,cAAc,EAAE,CAAC;~~aACtB~~;QACH,CAAC,CAAC;QAEF,MAAM,WAAW,GAAG,CAAC,GAAG,EAAE,EAAE;YAC1B,IAAI,GAAG,CAAC,IAAI,KAAK,OAAO,IAAI,GAAG,CAAC,GAAG,KAAK,GAAG,EAAE;~~gBAC3C~~,iBAAiB,EAAE,CAAC;~~aACrB~~;QACH,CAAC,CAAC;QAEF,OAAO,CACL,~~WACE~~,KAAK,EAAE,IAAI,CACT,qBAAqB,EACrB,OAAO,IAAI,8BAA8B,EACzC,CAAC,OAAO,IAAI,kCAAkC,EAC9C,QAAQ,IAAI,+BAA+B,CAC5C,EACD,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAC7B,IAAI,EAAC,QAAQ,mBACE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,EACvC,OAAO,EAAE,WAAW,EACpB,UAAU,EAAE,cAAc,EAC1B,OAAO,EAAE,WAAW;YAEpB,~~WAAK~~,KAAK,EAAC,4DAA4D,GAAO;YAC9E,~~WAAK~~,KAAK,EAAC,2DAA2D,GAAO;YAC7E,~~WACE~~,KAAK,EAAE,IAAI,CACT,4BAA4B,EAC5B,OAAO,IAAI,qCAAqC,EAChD,CAAC,OAAO,IAAI,yCAAyC,EACrD,QAAQ,IAAI,sCAAsC,CACnD;gBAED,~~WACE~~,KAAK,EAAE,IAAI,CACT,4BAA4B,EAC5B,OAAO,IAAI,qCAAqC,EAChD,CAAC,OAAO,IAAI,yCAAyC,EACrD,QAAQ,IAAI,sCAAsC,CACnD,GACI,CACH,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-form-toggle',\n styleUrl: 'form-toggle.scss',\n shadow: true,\n})\nexport class FormToggle {\n @Prop({ reflect: true }) disabled: boolean = false;\n @Prop({ reflect: true }) checked: boolean = false;\n @Event() utrechtBlur: EventEmitter;\n @Event() utrechtChange: EventEmitter;\n @Event() utrechtFocus: EventEmitter;\n @Event() utrechtInput: EventEmitter;\n\n render() {\n const { checked, disabled } = this;\n\n const toggleInteraction = () => {\n if (!this.disabled) {\n this.checked = !this.checked;\n this.utrechtInput.emit(this);\n this.utrechtChange.emit(this);\n }\n };\n\n const handleClick = () => {\n toggleInteraction();\n };\n\n const handleKeyPress = (evt) => {\n if (evt.code === 'Space' \|\| evt.key === ' ') {\n // Do not scroll the page using Space when the toggle is focussed\n evt.preventDefault();\n }\n };\n\n const handleKeyUp = (evt) => {\n if (evt.code === 'Space' \|\| evt.key === ' ') {\n toggleInteraction();\n }\n };\n\n return (\n <div\n class={clsx(\n 'utrecht-form-toggle',\n checked && 'utrecht-form-toggle--checked',\n !checked && 'utrecht-form-toggle--not-checked',\n disabled && 'utrecht-form-toggle--disabled',\n )}\n tabIndex={disabled ? null : 0}\n role=\"switch\"\n aria-disabled={disabled ? 'true' : null}\n onClick={handleClick}\n onKeyPress={handleKeyPress}\n onKeyUp={handleKeyUp}\n >\n <div class=\"utrecht-form-toggle__label utrecht-form-toggle__label--off\"></div>\n <div class=\"utrecht-form-toggle__label utrecht-form-toggle__label--on\"></div>\n <div\n class={clsx(\n 'utrecht-form-toggle__track',\n checked && 'utrecht-form-toggle__track--checked',\n !checked && 'utrecht-form-toggle__track--not-checked',\n disabled && 'utrecht-form-toggle__track--disabled',\n )}\n >\n <div\n class={clsx(\n 'utrecht-form-toggle__thumb',\n checked && 'utrecht-form-toggle__thumb--checked',\n !checked && 'utrecht-form-toggle__thumb--not-checked',\n disabled && 'utrecht-form-toggle__thumb--disabled',\n )}\n ></div>\n </div>\n </div>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"form-toggle.js","sourceRoot":"","sources":["../../src/components/form-toggle.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,IAAI,MAAM,MAAM,CAAC;AAOxB,MAAM,OAAO,UAAU;;wBACwB,KAAK;uBACN,KAAK;;IAMjD,MAAM;QACJ,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAEnC,MAAM,iBAAiB,GAAG,GAAG,EAAE;YAC7B,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;gBACnB,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;gBAC7B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;gBAC7B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAChC,CAAC;QACH,CAAC,CAAC;QAEF,MAAM,WAAW,GAAG,GAAG,EAAE;YACvB,iBAAiB,EAAE,CAAC;QACtB,CAAC,CAAC;QAEF,MAAM,cAAc,GAAG,CAAC,GAAG,EAAE,EAAE;YAC7B,IAAI,GAAG,CAAC,IAAI,KAAK,OAAO,IAAI,GAAG,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;gBAC5C,iEAAiE;gBACjE,GAAG,CAAC,cAAc,EAAE,CAAC;YACvB,CAAC;QACH,CAAC,CAAC;QAEF,MAAM,WAAW,GAAG,CAAC,GAAG,EAAE,EAAE;YAC1B,IAAI,GAAG,CAAC,IAAI,KAAK,OAAO,IAAI,GAAG,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;gBAC5C,iBAAiB,EAAE,CAAC;YACtB,CAAC;QACH,CAAC,CAAC;QAEF,OAAO,CACL,4DACE,KAAK,EAAE,IAAI,CACT,qBAAqB,EACrB,OAAO,IAAI,8BAA8B,EACzC,CAAC,OAAO,IAAI,kCAAkC,EAC9C,QAAQ,IAAI,+BAA+B,CAC5C,EACD,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAC7B,IAAI,EAAC,QAAQ,mBACE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,EACvC,OAAO,EAAE,WAAW,EACpB,UAAU,EAAE,cAAc,EAC1B,OAAO,EAAE,WAAW;YAEpB,4DAAK,KAAK,EAAC,4DAA4D,GAAO;YAC9E,4DAAK,KAAK,EAAC,2DAA2D,GAAO;YAC7E,4DACE,KAAK,EAAE,IAAI,CACT,4BAA4B,EAC5B,OAAO,IAAI,qCAAqC,EAChD,CAAC,OAAO,IAAI,yCAAyC,EACrD,QAAQ,IAAI,sCAAsC,CACnD;gBAED,4DACE,KAAK,EAAE,IAAI,CACT,4BAA4B,EAC5B,OAAO,IAAI,qCAAqC,EAChD,CAAC,OAAO,IAAI,yCAAyC,EACrD,QAAQ,IAAI,sCAAsC,CACnD,GACI,CACH,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2021 Robbert Broersma\n */\n\nimport { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\n@Component({\n tag: 'utrecht-form-toggle',\n styleUrl: 'form-toggle.scss',\n shadow: true,\n})\nexport class FormToggle {\n @Prop({ reflect: true }) disabled: boolean = false;\n @Prop({ reflect: true }) checked: boolean = false;\n @Event() utrechtBlur: EventEmitter;\n @Event() utrechtChange: EventEmitter;\n @Event() utrechtFocus: EventEmitter;\n @Event() utrechtInput: EventEmitter;\n\n render() {\n const { checked, disabled } = this;\n\n const toggleInteraction = () => {\n if (!this.disabled) {\n this.checked = !this.checked;\n this.utrechtInput.emit(this);\n this.utrechtChange.emit(this);\n }\n };\n\n const handleClick = () => {\n toggleInteraction();\n };\n\n const handleKeyPress = (evt) => {\n if (evt.code === 'Space' \|\| evt.key === ' ') {\n // Do not scroll the page using Space when the toggle is focussed\n evt.preventDefault();\n }\n };\n\n const handleKeyUp = (evt) => {\n if (evt.code === 'Space' \|\| evt.key === ' ') {\n toggleInteraction();\n }\n };\n\n return (\n <div\n class={clsx(\n 'utrecht-form-toggle',\n checked && 'utrecht-form-toggle--checked',\n !checked && 'utrecht-form-toggle--not-checked',\n disabled && 'utrecht-form-toggle--disabled',\n )}\n tabIndex={disabled ? null : 0}\n role=\"switch\"\n aria-disabled={disabled ? 'true' : null}\n onClick={handleClick}\n onKeyPress={handleKeyPress}\n onKeyUp={handleKeyUp}\n >\n <div class=\"utrecht-form-toggle__label utrecht-form-toggle__label--off\"></div>\n <div class=\"utrecht-form-toggle__label utrecht-form-toggle__label--on\"></div>\n <div\n class={clsx(\n 'utrecht-form-toggle__track',\n checked && 'utrecht-form-toggle__track--checked',\n !checked && 'utrecht-form-toggle__track--not-checked',\n disabled && 'utrecht-form-toggle__track--disabled',\n )}\n >\n <div\n class={clsx(\n 'utrecht-form-toggle__thumb',\n checked && 'utrecht-form-toggle__thumb--checked',\n !checked && 'utrecht-form-toggle__thumb--not-checked',\n disabled && 'utrecht-form-toggle__thumb--disabled',\n )}\n ></div>\n </div>\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/form.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form.js","sourceRoot":"","sources":["~~../../../~~src/components/form.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,IAAI;;;;;;;;;IAOf,MAAM;QACJ,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QAC3E,MAAM,SAAS,GAAG,sCAAsC,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;YAC/E,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;YAC1B,OAAO,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,eAAe,CAAC,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC7F,CAAC,CAAC,CAAC;QAEH,OAAO,CACL,YACE,MAAM,EAAE,MAAM,qBACG,SAAS,EAC1B,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM;YAEd,WAAK,KAAK,EAAC,uBAAuB,EAAC,EAAE,EAAE,SAAS;gBAC9C,YAAM,IAAI,EAAC,SAAS,GAAG,CACnB;YACN,eAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2020-2022 Gemeente Utrecht\n * Copyright (c) 2020-2022 Frameless B.V.\n */\n\nimport { Component, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-form',\n styleUrl: 'form.scss',\n shadow: false,\n})\nexport class Form {\n @Prop() action?: string;\n @Prop() autocomplete?: string;\n @Prop() enctype?: string;\n @Prop() method?: string;\n @Prop({ attribute: 'novalidate' }) noValidate?: string;\n @Prop() target?: string;\n render() {\n const { action, autocomplete, enctype, method, target, noValidate } = this;\n const headingId = '10000000-1000-4000-8000-100000000000'.replace(/[018]/g, (n) => {\n const c = parseInt(n, 10);\n return (c ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))).toString(16);\n });\n\n return (\n <form\n action={action}\n aria-labelledby={headingId}\n autocomplete={autocomplete}\n enctype={enctype}\n method={method}\n novalidate={noValidate}\n target={target}\n >\n <div class=\"utrecht-form__heading\" id={headingId}>\n <slot name=\"heading\" />\n </div>\n <slot></slot>\n </form>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"form.js","sourceRoot":"","sources":["../../src/components/form.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,IAAI;;;;;;;;;IAOf,MAAM;QACJ,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QAC3E,MAAM,SAAS,GAAG,sCAAsC,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;YAC/E,MAAM,CAAC,GAAG,QAAQ,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;YAC1B,OAAO,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,eAAe,CAAC,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC7F,CAAC,CAAC,CAAC;QAEH,OAAO,CACL,YACE,MAAM,EAAE,MAAM,qBACG,SAAS,EAC1B,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM;YAEd,WAAK,KAAK,EAAC,uBAAuB,EAAC,EAAE,EAAE,SAAS;gBAC9C,YAAM,IAAI,EAAC,SAAS,GAAG,CACnB;YACN,eAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/*\n @license EUPL-1.2\n * Copyright (c) 2020-2022 Gemeente Utrecht\n * Copyright (c) 2020-2022 Frameless B.V.\n */\n\nimport { Component, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'utrecht-form',\n styleUrl: 'form.scss',\n shadow: false,\n})\nexport class Form {\n @Prop() action?: string;\n @Prop() autocomplete?: string;\n @Prop() enctype?: string;\n @Prop() method?: string;\n @Prop({ attribute: 'novalidate' }) noValidate?: string;\n @Prop() target?: string;\n render() {\n const { action, autocomplete, enctype, method, target, noValidate } = this;\n const headingId = '10000000-1000-4000-8000-100000000000'.replace(/[018]/g, (n) => {\n const c = parseInt(n, 10);\n return (c ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))).toString(16);\n });\n\n return (\n <form\n action={action}\n aria-labelledby={headingId}\n autocomplete={autocomplete}\n enctype={enctype}\n method={method}\n novalidate={noValidate}\n target={target}\n >\n <div class=\"utrecht-form__heading\" id={headingId}>\n <slot name=\"heading\" />\n </div>\n <slot></slot>\n </form>\n );\n }\n}\n"]}