npm - @affinda/wc - Versions diffs - 0.5.0 → 0.6.0 - Mend

@affinda/wc 0.5.0 → 0.6.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 (378) hide show

package/dist/collection/components/af-footer-link/af-footer-link.js CHANGED Viewed

@@ -11,7 +11,7 @@ export class AfFooterLink {
         this.external = false;
     }
     render() {
-        return (h(Host, { key: 'bbd1c9452688e637e2f042855b460c550a04ab7d' }, h("li", { key: '01c2e3ea98cb848935f587e7dd83a71735f9bacb' }, h("a", { key: '965d00d17484deade15cc8e502ad507e67443f8c', href: this.href, class: "footer-link", target: this.external ? '_blank' : undefined, rel: this.external ? 'noopener noreferrer' : undefined }, h("slot", { key: '4536f9279791c59a9d198454ed2bf4e60194d52e' }), this.external && (h("svg", { key: '5e7a04185d8643b164f4b35f95dba5f0312ce1f4', class: "footer-link__external-icon", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none" }, h("path", { key: '6a6a43d0276a36ffc43f6a29e31a74d8c4ae3c57', d: "M10 6.5v3a1 1 0 0 1-1 1H2.5a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3M7.5 1.5h3v3M5.5 6.5l5-5", stroke: "currentColor", "stroke-width": "1.2", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
+        return (h(Host, { key: 'e341043b7d2a33e6bad09755eef69f170c7b809a' }, h("li", { key: 'abd9188151d0d11b0b98ad28ec7263f68cf03ee9' }, h("a", { key: '8de2cdf51282334947408dc2d5f5b4060a94e73a', href: this.href, class: "footer-link", target: this.external ? '_blank' : undefined, rel: this.external ? 'noopener noreferrer' : undefined }, h("slot", { key: '3f2fd206e8b121afcd137de19e2ef7ce974ef16e' }), this.external && (h("svg", { key: '9e3075f004cfdee1dcf25be2a0437f841a2baeda', class: "footer-link__external-icon", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none" }, h("path", { key: '72d0f422c4ded4b4ff44107edd5afa99b30ff123', d: "M10 6.5v3a1 1 0 0 1-1 1H2.5a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3M7.5 1.5h3v3M5.5 6.5l5-5", stroke: "currentColor", "stroke-width": "1.2", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
     }
     static get is() { return "af-footer-link"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-grid/af-grid.js CHANGED Viewed

@@ -28,14 +28,14 @@ export class AfGrid {
             end: 'end',
             stretch: 'stretch',
         };
-        return (h(Host, { key: 'bb11b9a7bd4d800f5466f199789ca36ca699e82d', style: {
+        return (h(Host, { key: 'd8f5d8d0eb7a070892ed00bea3b6cacba55ebfd0', style: {
                 '--grid-columns': String(this.columns),
                 '--grid-columns-lg': String(this.columnsLg ?? this.columns),
                 '--grid-columns-md': String(this.columnsMd ?? this.columnsLg ?? this.columns),
                 '--grid-columns-sm': String(this.columnsSm ?? this.columnsMd ?? this.columnsLg ?? 1),
                 '--grid-gap': `var(--space-${this.gap})`,
                 '--grid-align': alignMap[this.align],
-            } }, h("div", { key: '02d1c73218c856deee3915f5c1c61c6e01380fe3', class: "grid" }, h("slot", { key: 'c4d54340438da4c9bc0f865e1e62c206b1cc4e3f' }))));
+            } }, h("div", { key: '11c90d93bb50c200faeab87ffaef287256609f4e', class: "grid" }, h("slot", { key: '4e468e5ce63b0550ae6f16694b7e0a5e26d8564f' }))));
     }
     static get is() { return "af-grid"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/af-hero/af-hero.js CHANGED Viewed

@@ -135,12 +135,12 @@ export class AfHero {
         const hasIllustration = v === 'inkwell-illustration' ||
             v === 'soft-clay-illustration' ||
             v === 'mist-green-illustration';
-        return (h(Host, { key: '0a992496d31ad5bfbc3d987f8e14d4947ed4634a', class: {
+        return (h(Host, { key: 'c40393e3a50d1beecbe83804a1407a51d46e82ce', class: {
                 [`hero--${v}`]: true,
                 [`hero--pad-${this.topPad}`]: true,
                 [`hero--theme-${this.theme}`]: true,
                 'hero--float-navbar': this.resolvedFloatNavbar,
-            } }, h("af-section", { key: 'e7fb9c00edf9df24b3a6f31ec73153f076623b80', theme: this.theme, padding: "none", container: false, class: "hero__section" }, centered && (h("div", { key: 'c11031876d2de4e7bdec1ff11ff05488f91e1b95', class: "hero__paperclip", "aria-hidden": "true" }, h("slot", { key: 'e374f0ebeb82e4d1f5f0be91a0067a2d6c0dc5ec', name: "paperclip" }))), h("af-container", { key: '516ef86f39140df14422abd4dc2688d5afe95327', class: "hero__inner" }, centered ? (this.renderCopy()) : (h("div", { class: "hero__grid" }, this.renderCopy(), hasImage && this.renderPhoto(), hasIllustration && this.renderIllustration()))), h("div", { key: '946d5bd24bba79faa0aa11af2313538d9131acdc', class: "hero__logos" }, h("slot", { key: '3e6f93398f642963bf38f95dbd9c037f26dcf8f9', name: "logos-below" })))));
+            } }, h("af-section", { key: '77ce170dadae5685fd58ccd3e9b679099ed7068f', theme: this.theme, padding: "none", container: false, class: "hero__section" }, centered && (h("div", { key: 'e1f70ac7c9f4f708a3ac033aaba9c61aa1c5ca58', class: "hero__paperclip", "aria-hidden": "true" }, h("slot", { key: '4cc7a2ca78151e4190e81af45ad9989e28c667b1', name: "paperclip" }))), h("af-container", { key: 'c3e00acd79776207246290a7b3d5b8bb7b776791', class: "hero__inner" }, centered ? (this.renderCopy()) : (h("div", { class: "hero__grid" }, this.renderCopy(), hasImage && this.renderPhoto(), hasIllustration && this.renderIllustration()))), h("div", { key: '0cdd9f9071e3670a6d4b4a6082abe9252750d3b5', class: "hero__logos" }, h("slot", { key: '8b53c58048c404b6d057f0e56d1ec0402ffd6e00', name: "logos-below" })))));
     }
     static get is() { return "af-hero"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-icon-box/af-icon-box.js CHANGED Viewed

@@ -27,7 +27,7 @@ export class AfIconBox {
             [`icon-box--size-${this.size}`]: true,
         };
         const iconSize = this.size === 'small' ? 20 : this.size === 'large' ? 48 : 40;
-        return (h(Host, { key: 'b224f522fa4db3081cb97fbe88aec0a4f4198d61' }, h("div", { key: '99ee87a2104918c6d3855cc5d7e90dcbda2d9638', class: containerClasses }, h("af-icon", { key: '778170ce3b08ca6b34289cc6bd1d49ade9583bc1', name: this.icon, size: iconSize }))));
+        return (h(Host, { key: '2a0468909e1ec2a92c20b7cda6cb39af8584a42b' }, h("div", { key: '57eaff445b3d6a04c5eb7c39729bfb576866ca07', class: containerClasses }, h("af-icon", { key: '5590e7bd7dea9951f2f647c85240ee6673bcac32', name: this.icon, size: iconSize }))));
     }
     static get is() { return "af-icon-box"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-icon-text/af-icon-text.js CHANGED Viewed

@@ -43,7 +43,7 @@ export class AfIconText {
             'icon-text': true,
             [`icon-text--${this.orientation}`]: true,
         };
-        return (h(Host, { key: 'e00ca808eec26f88a177d91373d749908f3b2b5a' }, h("div", { key: 'c2709624720dd8775474c7c5be41ab93291bbe83', class: containerClasses }, h("af-icon-box", { key: '68feda331b07eefd23f10a4edf25b935e0298cf8', icon: this.icon, size: this.iconSize, class: "icon-text__icon" }), h("af-typography-lockup", { key: '56ee1da85e0808e3e12033abc7f0c74786b0b099', headingSize: this.headingSize, textAlignment: "left", buttonAlignment: "vertical", class: "icon-text__lockup" }, h("slot", { key: '056bef68d2251e514527cd49cbe2e8623556cc2a' }), h("span", { key: 'fb3379b7494d73b306a10f792f403ea1da719067', slot: "description" }, h("slot", { key: '7d06d6f52096fd80343823bd406f5a80d0035eaa', name: "description" })), h("span", { key: '9b4e20bc667fe53312297bdea1b5a96706dd3521', slot: "buttons" }, h("slot", { key: 'dac8dfcef4cb3f1f3d7caacb6ef40d29e52b53fe', name: "buttons" }))))));
+        return (h(Host, { key: 'cff8f57c2175530744bbf82bcaf80883602dea66' }, h("div", { key: '2fd499767ec70050ed0319a27d8cdb91b5b9432c', class: containerClasses }, h("af-icon-box", { key: 'd39fe7b335e68064ee0ef88a9fa210ae7c7d5166', icon: this.icon, size: this.iconSize, class: "icon-text__icon" }), h("af-typography-lockup", { key: 'f613b10a4f90fef207ac007170be63a06d3018a9', headingSize: this.headingSize, textAlignment: "left", buttonAlignment: "vertical", class: "icon-text__lockup" }, h("slot", { key: '151b8544c65eede0f0c7fa3c0bfc003bed54c25a' }), h("span", { key: 'eae7c355f05b99b3a443d2dd7a211d9c4ee9398c', slot: "description" }, h("slot", { key: '2514ef8f6b6524d8647e43cc2a111a03ea17f094', name: "description" })), h("span", { key: '0271986cc47f4b0625294109f720b76cb8917e21', slot: "buttons" }, h("slot", { key: '28a5b615d74f94249a60ab59561e756ad49c9726', name: "buttons" }))))));
     }
     static get is() { return "af-icon-text"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-illustrated-card/af-illustrated-card.js CHANGED Viewed

@@ -34,7 +34,7 @@ export class AfIllustratedCard {
             [`illustrated-card--breakpoint-${this.breakpoint}`]: true,
             [`illustrated-card--size-${this.cardSize}`]: true,
         };
-        return (h(Host, { key: '6cfa00ec3678220a5cb65c47c2a6dd120a8c5553' }, h("div", { key: '0b2fe8e581ead66d4f87007effce17bc506acb90', class: wrapperClasses }, h("af-card", { key: '7c9b545d3dd1960c43a6913ed28beb7f061c31e7', theme: this.theme }, h("div", { key: 'cfe8a3385853a6affefc77f18f5625f292f10489', class: "illustrated-card__content" }, h("af-typography-lockup", { key: '38e539b8617502fdd4ae2ebd6e1e536cf502b9a1', headingSize: 3, breakpoint: this.breakpoint, textAlignment: "left", buttonLayout: "vertical" }, h("slot", { key: '8988255edefe50349f78fe45db72c584ba6378ef' }), h("span", { key: '769cbdd181f166b086974e21a7f941dd4e17add0', slot: "description" }, h("slot", { key: 'ac1793bf3c0cc8e1a5d1ce9b2958a4e320b81134', name: "body" })), h("span", { key: 'ef22764670352f88d7e647b44625ac1afa94d51f', slot: "buttons" }, h("slot", { key: '625f23188a6cd9914b67b1c9937c728bc7125f4f', name: "buttons" })))), h("div", { key: '0616a426ea07da6c92488c65d85ba3c3ab84c40b', class: "illustrated-card__illustration-area" }, h("slot", { key: 'cf2998e62fb20f3cd049e0640004322a0b438ac1', name: "illustration" }))))));
+        return (h(Host, { key: '9cb248db15ab8be5119df3183457470491de468b' }, h("div", { key: 'c3ba0afed9c7fe45f5d577aedf9b320a1f875e47', class: wrapperClasses }, h("af-card", { key: '07f201cc8c56bade2e793e68b7777c23ac7d0ba7', theme: this.theme }, h("div", { key: '7f1a2579a29229f8161771836b60c0d882cabf59', class: "illustrated-card__content" }, h("af-typography-lockup", { key: 'b5d9150b3f63e46e36f478380f36fb3f273f227c', headingSize: 3, breakpoint: this.breakpoint, textAlignment: "left", buttonLayout: "vertical" }, h("slot", { key: '6aba88b9857866d246270d6a7c0ebe9ba67c5d74' }), h("span", { key: '2e0454ef021e537917aad2227fd75e66b421761c', slot: "description" }, h("slot", { key: 'a7779fbb7ce77d4d24ac834bd302e3aa437610ab', name: "body" })), h("span", { key: 'c0c82b1f5470dfd8f7b75474b4730e679c2641d7', slot: "buttons" }, h("slot", { key: '1a9ec3da3c50fe815e4502ec71218c8a21dc3b1c', name: "buttons" })))), h("div", { key: 'e758d3071a54afdad44903e0002d5aa8a50b17e0', class: "illustrated-card__illustration-area" }, h("slot", { key: '9521bbe523e32015e5bfd8f56cdcc1959e382fc2', name: "illustration" }))))));
     }
     static get is() { return "af-illustrated-card"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-image/af-image.js CHANGED Viewed

@@ -17,7 +17,7 @@ export class AfImage {
         this.shape = 'rounded';
     }
     render() {
-        return (h(Host, { key: 'a8954272f3c0defc0b9e33d5f3221c6e1083d927' }, h("div", { key: '2fd3bad5b46360cac57d069031ec2f69103f6542', class: `image-container image-container--${this.shape}` }, h("img", { key: '72a11cde6b65481320d8b6a1d65e85862d4a449e', src: this.src, alt: this.alt, class: "image" }), h("div", { key: '7727e1ac4179e96f8c8928de678136337bd82f44', class: "image-border", "aria-hidden": "true" }))));
+        return (h(Host, { key: '4f48634e84e032c9a93cf48444709146ffe591b7' }, h("div", { key: 'c26f889afa7c3d35e5f65dcc23d63a41a9c0987e', class: `image-container image-container--${this.shape}` }, h("img", { key: 'c1474197475df3bff2263b509f3abf59a53aa932', src: this.src, alt: this.alt, class: "image" }), h("div", { key: 'bb6e0cae628bf65e423d5986df8ed119af74e699', class: "image-border", "aria-hidden": "true" }))));
     }
     static get is() { return "af-image"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-in-page-banner/af-in-page-banner.js CHANGED Viewed

@@ -66,7 +66,7 @@ export class AfInPageBanner {
         return (h("div", { class: "banner__wave-overlay", "aria-hidden": "true" }, h("svg", { viewBox: "0 0 521 323", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "banner__wave-svg" }, h("path", { d: "M473.775 46.273C443.539 15.92 403.701 -0.631616 361.351 0.0184478H154.183L112.67 67.225H361.893C362.189 67.225 362.533 67.225 362.829 67.225C387.155 67.225 410.004 76.7259 427.289 94.0776C445.017 111.879 454.816 135.682 454.816 161.134C454.816 213.389 412.959 255.843 361.548 255.843H108.041C84.9457 255.843 66.1345 236.742 66.1345 213.289C66.1345 189.837 84.9949 170.435 107.992 169.735H334.957L377.799 102.528H106.859C47.9636 104.029 0 153.683 0 213.289C0 272.895 48.456 323 108.041 323H361.548C449.449 323 521 250.343 521 161.084C521 117.53 504.257 76.7759 473.824 46.2229L473.775 46.273Z", fill: "currentColor" }))));
     }
     render() {
-        return (h(Host, { key: '87abd1c23d56419cbbaf1c34230afa17f7ccffa8' }, h("div", { key: 'ea56f17212a63e56bf1339009dbbac39835aacf3', class: `banner theme-${this.theme}` }, this.showWaveDecoration && this.renderWaveOverlay(), h("div", { key: '09016e39680edb60995ce373f906025d86e4c9d4', class: "banner__illustration" }, this.illustrationUrl ? (h("img", { src: this.illustrationUrl, alt: "", class: "banner__illustration-img", loading: "lazy" })) : (h("slot", { name: "illustration" }))), h("div", { key: 'aebd3b10940e61b6b24a4592741173e175b8f17a', class: "banner__content" }, h("div", { key: 'e3f900a1775c905f4e5816ed56fc7ccfd48581a7', class: "banner__copy" }, h("h2", { key: 'fde36b2f853c379ab9434c2619eb9b5959f47a66', class: "banner__heading" }, h("slot", { key: 'd872bb70022c71240442fbf884e2479332657973', name: "heading" }, this.heading)), h("div", { key: '21728ca79ef014f2397da9c9bea6e42d278fdcbf', class: "banner__description" }, h("slot", { key: '5c383f37817482d3865d0aa9f4119522ef6b9152', name: "description" }, this.description))), h("div", { key: '057731169459a52833810baf53ad3f62c4687693', class: "banner__buttons" }, h("slot", { key: '1e6da776478fd903694226b78ccf4b99f9848d39', name: "buttons" }, this.primaryButtonText && (h("af-button", { key: '8c930f1b11bcd07a1078caa8a65dc29ef9a625f4', href: this.primaryButtonUrl, variant: "primary" }, this.primaryButtonText)), this.secondaryButtonText && (h("af-button", { key: '0b57d550f76dd26b2d5253f618fb4cd03cfd5186', href: this.secondaryButtonUrl, variant: "secondary" }, this.secondaryButtonText))))))));
+        return (h(Host, { key: '022f98e0925a4cdc04db66889b266f1741932513' }, h("div", { key: '64f60ef33b18ba4e0e20d5248a3a8d396a72b4cd', class: `banner theme-${this.theme}` }, this.showWaveDecoration && this.renderWaveOverlay(), h("div", { key: '26ff6aefd41268a5bece7fb2c5161cfacd38d54e', class: "banner__illustration" }, this.illustrationUrl ? (h("img", { src: this.illustrationUrl, alt: "", class: "banner__illustration-img", loading: "lazy" })) : (h("slot", { name: "illustration" }))), h("div", { key: '025c1664b11d6531d2471ab652a0715e58ee5d46', class: "banner__content" }, h("div", { key: 'e58cc91158e663068ddaa01fd9776135055769fc', class: "banner__copy" }, h("h2", { key: '7f3afcf9b28cbc1b924f6dec0bf4882c64b1c306', class: "banner__heading" }, h("slot", { key: 'ac04c8f27d294f97f79ab11595ce4c1e12e3d9f3', name: "heading" }, this.heading)), h("div", { key: '7b5a689cf681591d8eac098f9e0a8d3b01348140', class: "banner__description" }, h("slot", { key: '724079691b59aab3f336a3524b85f5fe27ad754d', name: "description" }, this.description))), h("div", { key: 'e4d8eedee783e6b48ca780bf95337048384165fc', class: "banner__buttons" }, h("slot", { key: 'e1b5995706145354b41daa5a774086ddaa65accc', name: "buttons" }, this.primaryButtonText && (h("af-button", { key: 'c5e797d3c62876d4ba964272efe7d9d97b962a36', href: this.primaryButtonUrl, variant: "primary" }, this.primaryButtonText)), this.secondaryButtonText && (h("af-button", { key: 'e4a8ba0065181b3201f906fdc718595ad9bdd4fc', href: this.secondaryButtonUrl, variant: "secondary" }, this.secondaryButtonText))))))));
     }
     static get is() { return "af-in-page-banner"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-inline/af-inline.js CHANGED Viewed

@@ -49,7 +49,7 @@ export class AfInline {
             justifyContent: justifyMap[this.justify],
             flexWrap: this.wrap ? 'wrap' : 'nowrap',
         };
-        return (h(Host, { key: '3dce5c336021a6c5046258120a72f3087a421e2a', style: style }, h("slot", { key: '28fb5aff7cb1a0edf1389bc7146d21560313468c' })));
+        return (h(Host, { key: '7069c721994bbd1acc8d57875522dbefdaf796d9', style: style }, h("slot", { key: 'e39c2d982cca56ab6545e3e8a43eea7696708f21' })));
     }
     static get is() { return "af-inline"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/af-input/af-input.css CHANGED Viewed

@@ -214,6 +214,48 @@
   border-radius: 4px;
 }
+/* ---------- Multiline (textarea) mode ---------- */
+/* Container has no inner padding in multiline mode — the textarea
+   element owns the padding so it fills the box and resizes cleanly. */
+.input-container--multiline {
+  padding: 0;
+  min-height: 0;
+  overflow: hidden;
+}
+/* Native textarea */
+.input--multiline {
+  flex: 1;
+  min-width: 0;
+  min-height: 108px;
+  padding: 12px 16px;
+  border: none;
+  background: transparent;
+  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);
+  font-weight: var(--font-weight-regular, 400);
+  font-size: 16px;
+  line-height: 24px;
+  color: var(--af-input-text, var(--af-typography-body-dark, #14343b));
+  outline: none;
+  resize: vertical;
+}
+.input--multiline::placeholder {
+  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));
+  opacity: 1;
+}
+.input--multiline:disabled {
+  cursor: not-allowed;
+  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));
+  resize: none;
+}
+.input--multiline:disabled::placeholder {
+  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));
+}
 /* Error row */
 .error-row {
   display: flex;

package/dist/collection/components/af-input/af-input.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 /**
  * Input field component with label, description, and error states.
- * Supports various input types and validation states.
+ * Supports single-line and multi-line (textarea) modes via the `multiline` prop.
  *
  * @slot label-end - Content to display at the end of the label (e.g., info icon)
  */
@@ -12,7 +12,8 @@ export class AfInput {
          */
         this.value = '';
         /**
-         * The input type (text, email, password, number, tel, url, search)
+         * The input type (text, email, password, number, tel, url, search).
+         * Ignored when `multiline` is true.
          */
         this.type = 'text';
         /**
@@ -32,13 +33,27 @@ export class AfInput {
          */
         this.showInfoIcon = false;
         /**
-         * Whether to show a search icon in the input
+         * Whether to show a search icon in the input. Ignored when `multiline` is true.
          */
         this.showSearchIcon = false;
         /**
-         * Whether to show a clear button when input has value
+         * Whether to show a clear button when input has value. Ignored when `multiline` is true.
          */
         this.clearable = false;
+        /**
+         * Render as a multi-line textarea instead of a single-line input.
+         * Activates `rows` and `resize` props; ignores `type`, `pattern`,
+         * `autocomplete`, `showSearchIcon`, `clearable`.
+         */
+        this.multiline = false;
+        /**
+         * Number of visible rows when `multiline` is true. Ignored otherwise.
+         */
+        this.rows = 4;
+        /**
+         * Whether the textarea is resizable. Ignored when `multiline` is false.
+         */
+        this.resize = 'vertical';
         this.isFocused = false;
         this.isHovered = false;
         this.handleInput = (event) => {
@@ -75,8 +90,10 @@ export class AfInput {
     render() {
         const hasError = !!this.error;
         const hasValue = !!(this.value && this.value.length > 0);
+        const multiline = this.multiline;
         const wrapperClasses = {
             'input-wrapper': true,
+            'input-wrapper--multiline': multiline,
             'disabled': this.disabled,
             'error': hasError,
             'focused': this.isFocused,
@@ -85,12 +102,13 @@ export class AfInput {
         };
         const inputContainerClasses = {
             'input-container': true,
+            'input-container--multiline': multiline,
             'disabled': this.disabled,
             'error': hasError,
             'focused': this.isFocused,
             'hovered': this.isHovered && !this.disabled && !this.isFocused
         };
-        return (h(Host, { key: '5bf8980e12ad5fc3b8b84df3acc749bddf61042d' }, h("div", { key: 'd0266eca85871397ed73381ca3d36f3dc2dd79ce', class: wrapperClasses }, this.label && (h("div", { key: 'f9fc2fe3f52a1f9be1404943d91489357ea941dc', class: "label-row" }, h("label", { key: '76283a7f0c9be127aa8c9115fcbc26b2d67d51cc', class: "label", htmlFor: "input" }, this.label, this.required && h("span", { key: '6b0de23e857abfdd25d6eefaa6ff22f22fa813dd', class: "required" }, "*")), this.showInfoIcon && (h("button", { key: '7c5f7a47a8357301f3fe28d6078bdec3ec1160c3', type: "button", class: "info-icon", onClick: this.handleInfoClick, "aria-label": "More information" }, h("svg", { key: '655c9448589937c2047a58962f78ab1872e0da84', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '5066c29389ac8f9e1e27771f43a98f75f9b03634', d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '1993da070066d33575618267d6af5b13b641143b', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'dd99ac12d4a23b98c98fca1df34916968276fc0e', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("slot", { key: 'b406de5a455af79a69497c6a641b5c41347ee1ab', name: "label-end" }))), this.description && (h("p", { key: '0dcebb186df7055efb168f96ad4199e2f614a87c', class: "description" }, this.description)), h("div", { key: '754b8a3e67d5807d7d484d475d31913dee8004f4', class: inputContainerClasses, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, this.showSearchIcon && (h("span", { key: '5757962a3479a6cd1f12bd1da183919af69ad9f4', class: "search-icon" }, h("svg", { key: '4106175e5b41e4c978b38eda6db36799a6a6f762', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '1d54b9a8c682c9049e97b28143f0dcd90e068dee', d: "M11 19C15.4183 19 19 15.4183 19 11C19 6.58172 15.4183 3 11 3C6.58172 3 3 6.58172 3 11C3 15.4183 6.58172 19 11 19Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'd3ed0187abde8c14eae462612c918e10cb46916d', d: "M21 21L16.65 16.65", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("input", { key: 'fb7a551d44282686732b78865bab8720c5e08830', ref: (el) => this.inputEl = el ?? undefined, id: "input", class: "input", type: this.type, name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, required: this.required, readonly: this.readonly, autocomplete: this.autocomplete, maxlength: this.maxlength, minlength: this.minlength, pattern: this.pattern, "aria-invalid": hasError ? 'true' : undefined, "aria-describedby": hasError ? 'error-message' : this.description ? 'description' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur }), this.clearable && hasValue && !this.disabled && !this.readonly && (h("button", { key: '6ad41a3ee4ffdbeefa11e45754a22143b33405e5', type: "button", class: "clear-button", onClick: this.handleClear, "aria-label": "Clear input" }, h("svg", { key: '129f73660030e81ff17071fae51bb34af23eca57', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '78d4c71521ac7daced7023c5bcfb2bfccf593fab', d: "M18 6L6 18", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '4eb85452029e8347dd648dcc849fa000b41b7fea', d: "M6 6L18 18", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), hasError && (h("div", { key: 'cc3b6083e88bb99ec17edffbf95ec89e2bb27e97', class: "error-row", id: "error-message" }, h("span", { key: 'fe264a854aaebe481a6913275859ca57b1d61d0d', class: "error-icon" }, h("svg", { key: '1159f77b184d1888c5c5ebe6138070c66abb66e6', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '59975a202086127c2548843e842d33895d6ba1ff', d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '11c79f296c1dce73beebd67eeefe3d71b17ee191', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '9f146c96a38b14afb1919cf480224ee520ac16b0', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("span", { key: '2d326d0d72727dca4c4839fb5279323e556fbe04', class: "error-text" }, this.error))))));
+        return (h(Host, { key: '55cf204d355367913c765891190048599a46653e' }, h("div", { key: '8f72840a7a6fa8615e535f171f5297fb5d0cdfe5', class: wrapperClasses }, this.label && (h("div", { key: '06711c6031da07fca88bd438db7fb80acc12df71', class: "label-row" }, h("label", { key: '1db607ff65a624aa2520bdfbc2063c0f6587b00c', class: "label", htmlFor: "input" }, this.label, this.required && h("span", { key: 'd2ffc85aafb99e5fc7723993354a23fd99f04ac6', class: "required" }, "*")), this.showInfoIcon && (h("button", { key: '1adcddb4121582d35eff611d8299ff4ed6d0cc24', type: "button", class: "info-icon", onClick: this.handleInfoClick, "aria-label": "More information" }, h("svg", { key: 'e1abef80244c616ba98f89d23f9a4b6b2e4d97e1', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'fedd67859d45345298c7e6e4a67e1e98ac4a9178', d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '076a1ff76cc8b5287dd29df42d6b629d34ae739e', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '640f19dd94e31f1090704ccc534b3917cc70a905', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("slot", { key: 'e3b42a60ad6b2378ab6593e239208b847d20c8ad', name: "label-end" }))), this.description && (h("p", { key: '8bf359cd53f562bedbe29f54004d5a974398db7b', class: "description" }, this.description)), h("div", { key: 'eb5a21523188828d60713cc772a477fa2a22a3a3', class: inputContainerClasses, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, !multiline && this.showSearchIcon && (h("span", { key: 'ed8945ddd4601e3d2ef84f2644a7ab567156157a', class: "search-icon" }, h("svg", { key: '2684f4233757a74cb55abfb1e62481e5848a5fbc', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'f6855623658e5ea149421b37f039967e6622c955', d: "M11 19C15.4183 19 19 15.4183 19 11C19 6.58172 15.4183 3 11 3C6.58172 3 3 6.58172 3 11C3 15.4183 6.58172 19 11 19Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'db81f64ac649e9f41bfdb47a287d3e671951f171', d: "M21 21L16.65 16.65", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), multiline ? (h("textarea", { ref: (el) => this.inputEl = el ?? undefined, id: "input", class: "input input--multiline", name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, required: this.required, readonly: this.readonly, rows: this.rows, maxlength: this.maxlength, minlength: this.minlength, style: { resize: this.resize }, "aria-invalid": hasError ? 'true' : undefined, "aria-describedby": hasError ? 'error-message' : this.description ? 'description' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur })) : (h("input", { ref: (el) => this.inputEl = el ?? undefined, id: "input", class: "input", type: this.type, name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, required: this.required, readonly: this.readonly, autocomplete: this.autocomplete, maxlength: this.maxlength, minlength: this.minlength, pattern: this.pattern, "aria-invalid": hasError ? 'true' : undefined, "aria-describedby": hasError ? 'error-message' : this.description ? 'description' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur })), !multiline && this.clearable && hasValue && !this.disabled && !this.readonly && (h("button", { key: 'ed7c9c3753fd291aa1105c2f30e00a2b2868efed', type: "button", class: "clear-button", onClick: this.handleClear, "aria-label": "Clear input" }, h("svg", { key: '0615828eb7d27c6cf45fa7f91b25a14dd97fe972', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '6a60d954427656fcc01940dd861c37bd214570d0', d: "M18 6L6 18", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '9471a7899c62b9fbce7ceafc4986b29c0000f26f', d: "M6 6L18 18", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), hasError && (h("div", { key: '1972022a3ca5a7f366a83cf35e2eecb4b812bd29', class: "error-row", id: "error-message" }, h("span", { key: '450e80c8d42914048eb114a222d9db8e9b94d3fa', class: "error-icon" }, h("svg", { key: '57eeb2884b16a9adf5fe0744814d00465da436e1', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '9e25cb82f47c915b4c4afa0283a143c9221b465c', d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'faf252192e9a4706c5ed363ba240a0cb1ddf6770', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '4eda8b2840b7bf70919460ffe46e54d702ec3191', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("span", { key: 'a22e99093a097f8c7be12c8aa4a1b65a87484eb3', class: "error-text" }, this.error))))));
     }
     static get is() { return "af-input"; }
     static get encapsulation() { return "shadow"; }
@@ -195,7 +213,7 @@ export class AfInput {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The input type (text, email, password, number, tel, url, search)"
+                    "text": "The input type (text, email, password, number, tel, url, search).\nIgnored when `multiline` is true."
                 },
                 "getter": false,
                 "setter": false,
@@ -333,7 +351,7 @@ export class AfInput {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Whether to show a search icon in the input"
+                    "text": "Whether to show a search icon in the input. Ignored when `multiline` is true."
                 },
                 "getter": false,
                 "setter": false,
@@ -353,7 +371,7 @@ export class AfInput {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Whether to show a clear button when input has value"
+                    "text": "Whether to show a clear button when input has value. Ignored when `multiline` is true."
                 },
                 "getter": false,
                 "setter": false,
@@ -430,12 +448,72 @@ export class AfInput {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": "Pattern for input validation (regex)"
+                    "text": "Pattern for input validation (regex). Ignored when `multiline` is true."
                 },
                 "getter": false,
                 "setter": false,
                 "reflect": false,
                 "attribute": "pattern"
+            },
+            "multiline": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Render as a multi-line textarea instead of a single-line input.\nActivates `rows` and `resize` props; ignores `type`, `pattern`,\n`autocomplete`, `showSearchIcon`, `clearable`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "multiline",
+                "defaultValue": "false"
+            },
+            "rows": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Number of visible rows when `multiline` is true. Ignored otherwise."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "rows",
+                "defaultValue": "4"
+            },
+            "resize": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'none' | 'vertical' | 'horizontal' | 'both'",
+                    "resolved": "\"both\" | \"horizontal\" | \"none\" | \"vertical\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether the textarea is resizable. Ignored when `multiline` is false."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "resize",
+                "defaultValue": "'vertical'"
             }
         };
     }
@@ -499,7 +577,7 @@ export class AfInput {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "Emitted when the clear button is clicked"
+                    "text": "Emitted when the clear button is clicked. Only fires in single-line mode."
                 },
                 "complexType": {
                     "original": "void",

package/dist/collection/components/af-input/af-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"af-input.js","sourceRoot":"","sources":["../../../src/components/af-input/af-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAgB,KAAK,EAAE,MAAM,eAAe,CAAC;AAErF;;;;;GAKG;AAMH,MAAM,OAAO,OAAO;IALpB;QAqBE;;WAEG;QACsB,UAAK,GAAW,EAAE,CAAC;QAE5C;;WAEG;QACK,SAAI,GAAwE,MAAM,CAAC;QAO3F;;WAEG;QACsB,aAAQ,GAAY,KAAK,CAAC;QAEnD;;WAEG;QACK,aAAQ,GAAY,KAAK,CAAC;QAElC;;WAEG;QACK,aAAQ,GAAY,KAAK,CAAC;QAOlC;;WAEG;QACK,iBAAY,GAAY,KAAK,CAAC;QAEtC;;WAEG;QACK,mBAAc,GAAY,KAAK,CAAC;QAExC;;WAEG;QACK,cAAS,GAAY,KAAK,CAAC;QA+ClB,cAAS,GAAY,KAAK,CAAC;QAC3B,cAAS,GAAY,KAAK,CAAC;QAIpC,gBAAW,GAAG,CAAC,KAAY,EAAE,EAAE;YACrC,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;YAChD,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;YAC1B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;QAC3C,CAAC,CAAC;QAEM,gBAAW,GAAG,GAAG,EAAE;YACzB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QACtB,CAAC,CAAC;QAEM,eAAU,GAAG,GAAG,EAAE;YACxB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QACrB,CAAC,CAAC;QAEM,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACxB,CAAC,CAAC;QAEM,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACzB,CAAC,CAAC;QAEM,gBAAW,GAAG,GAAG,EAAE;YACzB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;YAChB,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;YACpB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;YACjC,IAAI,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;QACxB,CAAC,CAAC;QAEM,oBAAe,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC9C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;QAC1B,CAAC,CAAC;KAgIH;IA9HC,MAAM;QACJ,MAAM,QAAQ,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;QAC9B,MAAM,QAAQ,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAEzD,MAAM,cAAc,GAAG;YACrB,eAAe,EAAE,IAAI;YACrB,UAAU,EAAE,IAAI,CAAC,QAAQ;YACzB,OAAO,EAAE,QAAQ;YACjB,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,SAAS,EAAE,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,SAAS;YAC9D,WAAW,EAAE,QAAQ;SACtB,CAAC;QAEF,MAAM,qBAAqB,GAAG;YAC5B,iBAAiB,EAAE,IAAI;YACvB,UAAU,EAAE,IAAI,CAAC,QAAQ;YACzB,OAAO,EAAE,QAAQ;YACjB,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,SAAS,EAAE,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,SAAS;SAC/D,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,cAAc;gBAEvB,IAAI,CAAC,KAAK,IAAI,CACb,4DAAK,KAAK,EAAC,WAAW;oBACpB,8DAAO,KAAK,EAAC,OAAO,EAAC,OAAO,EAAC,OAAO;wBACjC,IAAI,CAAC,KAAK;wBACV,IAAI,CAAC,QAAQ,IAAI,6DAAM,KAAK,EAAC,UAAU,QAAS,CAC3C;oBACP,IAAI,CAAC,YAAY,IAAI,CACpB,+DACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,WAAW,EACjB,OAAO,EAAE,IAAI,CAAC,eAAe,gBAClB,kBAAkB;wBAE7B,4DAAK,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B;4BACrE,6DAAM,CAAC,EAAC,mHAAmH,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE;4BACrN,6DAAM,CAAC,EAAC,WAAW,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE;4BAC7G,6DAAM,CAAC,EAAC,aAAa,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE,CAC3G,CACC,CACV;oBACD,6DAAM,IAAI,EAAC,WAAW,GAAQ,CAC1B,CACP;gBAGA,IAAI,CAAC,WAAW,IAAI,CACnB,0DAAG,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,WAAW,CAAK,CAC9C;gBAGD,4DACE,KAAK,EAAE,qBAAqB,EAC5B,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,YAAY,EAAE,IAAI,CAAC,gBAAgB;oBAGlC,IAAI,CAAC,cAAc,IAAI,CACtB,6DAAM,KAAK,EAAC,aAAa;wBACvB,4DAAK,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B;4BACrE,6DAAM,CAAC,EAAC,mHAAmH,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE;4BACrN,6DAAM,CAAC,EAAC,oBAAoB,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE,CAClH,CACD,CACR;oBAGD,8DACE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,EAAE,IAAI,SAAS,EAC3C,EAAE,EAAC,OAAO,EACV,KAAK,EAAC,OAAO,EACb,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,OAAO,EAAE,IAAI,CAAC,OAAO,kBACP,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,sBACzB,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,EAC3F,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,MAAM,EAAE,IAAI,CAAC,UAAU,GACvB;oBAGD,IAAI,CAAC,SAAS,IAAI,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CACjE,+DACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,cAAc,EACpB,OAAO,EAAE,IAAI,CAAC,WAAW,gBACd,aAAa;wBAExB,4DAAK,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B;4BACrE,6DAAM,CAAC,EAAC,YAAY,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE;4BAC9G,6DAAM,CAAC,EAAC,YAAY,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE,CAC1G,CACC,CACV,CACG;gBAGL,QAAQ,IAAI,CACX,4DAAK,KAAK,EAAC,WAAW,EAAC,EAAE,EAAC,eAAe;oBACvC,6DAAM,KAAK,EAAC,YAAY;wBACtB,4DAAK,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B;4BACrE,6DAAM,CAAC,EAAC,mHAAmH,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE;4BACrN,6DAAM,CAAC,EAAC,WAAW,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE;4BAC7G,6DAAM,CAAC,EAAC,aAAa,EAAC,MAAM,EAAC,cAAc,kBAAc,KAAK,oBAAgB,OAAO,qBAAiB,OAAO,GAAE,CAC3G,CACD;oBACP,6DAAM,KAAK,EAAC,YAAY,IAAE,IAAI,CAAC,KAAK,CAAQ,CACxC,CACP,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host, Event, EventEmitter, State } from '@stencil/core';\n\n/*\n Input field component with label, description, and error states.\n * Supports various input types and validation states.\n * \n * @slot label-end - Content to display at the end of the label (e.g., info icon)\n /\n@Component({\n tag: 'af-input',\n styleUrl: 'af-input.css',\n shadow: true\n})\nexport class AfInput {\n /\n The label text for the input field\n /\n @Prop() label?: string;\n\n /\n Description text displayed below the label\n /\n @Prop() description?: string;\n\n /\n Placeholder text for the input\n /\n @Prop() placeholder?: string;\n\n /\n The current value of the input\n /\n @Prop({ mutable: true }) value: string = '';\n\n /\n The input type (text, email, password, number, tel, url, search)\n /\n @Prop() type: 'text' \| 'email' \| 'password' \| 'number' \| 'tel' \| 'url' \| 'search' = 'text';\n\n /\n The name of the input for form submission\n /\n @Prop() name?: string;\n\n /\n Whether the input is disabled\n /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /\n Whether the input is required\n /\n @Prop() required: boolean = false;\n\n /\n Whether the input is read-only\n /\n @Prop() readonly: boolean = false;\n\n /\n Error message to display (also sets error state)\n /\n @Prop() error?: string;\n\n /\n Whether to show the info icon next to the label\n /\n @Prop() showInfoIcon: boolean = false;\n\n /\n Whether to show a search icon in the input\n /\n @Prop() showSearchIcon: boolean = false;\n\n /\n Whether to show a clear button when input has value\n /\n @Prop() clearable: boolean = false;\n\n /\n Autocomplete attribute for the input\n /\n @Prop() autocomplete?: string;\n\n /\n Maximum length of input value\n /\n @Prop() maxlength?: number;\n\n /\n Minimum length of input value\n /\n @Prop() minlength?: number;\n\n /\n Pattern for input validation (regex)\n /\n @Prop() pattern?: string;\n\n /\n Emitted when the input value changes\n /\n @Event() afInput!: EventEmitter<{ value: string }>;\n\n /\n Emitted when the input loses focus\n /\n @Event() afBlur!: EventEmitter<void>;\n\n /\n Emitted when the input gains focus\n /\n @Event() afFocus!: EventEmitter<void>;\n\n /\n Emitted when the clear button is clicked\n /\n @Event() afClear!: EventEmitter<void>;\n\n /\n Emitted when the info icon is clicked\n /\n @Event() afInfoClick!: EventEmitter<void>;\n\n @State() private isFocused: boolean = false;\n @State() private isHovered: boolean = false;\n\n private inputEl?: HTMLInputElement;\n\n private handleInput = (event: Event) => {\n const target = event.target as HTMLInputElement;\n this.value = target.value;\n this.afInput.emit({ value: this.value });\n };\n\n private handleFocus = () => {\n this.isFocused = true;\n this.afFocus.emit();\n };\n\n private handleBlur = () => {\n this.isFocused = false;\n this.afBlur.emit();\n };\n\n private handleMouseEnter = () => {\n this.isHovered = true;\n };\n\n private handleMouseLeave = () => {\n this.isHovered = false;\n };\n\n private handleClear = () => {\n this.value = '';\n this.afClear.emit();\n this.afInput.emit({ value: '' });\n this.inputEl?.focus();\n };\n\n private handleInfoClick = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n this.afInfoClick.emit();\n };\n\n render() {\n const hasError = !!this.error;\n const hasValue = !!(this.value && this.value.length > 0);\n\n const wrapperClasses = {\n 'input-wrapper': true,\n 'disabled': this.disabled,\n 'error': hasError,\n 'focused': this.isFocused,\n 'hovered': this.isHovered && !this.disabled && !this.isFocused,\n 'populated': hasValue\n };\n\n const inputContainerClasses = {\n 'input-container': true,\n 'disabled': this.disabled,\n 'error': hasError,\n 'focused': this.isFocused,\n 'hovered': this.isHovered && !this.disabled && !this.isFocused\n };\n\n return (\n <Host>\n <div class={wrapperClasses}>\n {/ Label /}\n {this.label && (\n <div class=\"label-row\">\n <label class=\"label\" htmlFor=\"input\">\n {this.label}\n {this.required && <span class=\"required\"></span>}\n </label>\n {this.showInfoIcon && (\n <button \n type=\"button\" \n class=\"info-icon\" \n onClick={this.handleInfoClick}\n aria-label=\"More information\"\n >\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 16V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 8H12.01\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </button>\n )}\n <slot name=\"label-end\"></slot>\n </div>\n )}\n\n {/* Description /}\n {this.description && (\n <p class=\"description\">{this.description}</p>\n )}\n\n {/ Input container /}\n <div \n class={inputContainerClasses}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n >\n {/ Search icon /}\n {this.showSearchIcon && (\n <span class=\"search-icon\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M11 19C15.4183 19 19 15.4183 19 11C19 6.58172 15.4183 3 11 3C6.58172 3 3 6.58172 3 11C3 15.4183 6.58172 19 11 19Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M21 21L16.65 16.65\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </span>\n )}\n\n {/ Native input /}\n <input\n ref={(el) => this.inputEl = el ?? undefined}\n id=\"input\"\n class=\"input\"\n type={this.type}\n name={this.name}\n value={this.value}\n placeholder={this.placeholder}\n disabled={this.disabled}\n required={this.required}\n readonly={this.readonly}\n autocomplete={this.autocomplete}\n maxlength={this.maxlength}\n minlength={this.minlength}\n pattern={this.pattern}\n aria-invalid={hasError ? 'true' : undefined}\n aria-describedby={hasError ? 'error-message' : this.description ? 'description' : undefined}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n />\n\n {/ Clear button /}\n {this.clearable && hasValue && !this.disabled && !this.readonly && (\n <button \n type=\"button\" \n class=\"clear-button\" \n onClick={this.handleClear}\n aria-label=\"Clear input\"\n >\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M6 6L18 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </button>\n )}\n </div>\n\n {/ Error message */}\n {hasError && (\n <div class=\"error-row\" id=\"error-message\">\n <span class=\"error-icon\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 16V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 8H12.01\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </span>\n <span class=\"error-text\">{this.error}</span>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n\n"]}
1	+ {"version":3,"file":"af-input.js","sourceRoot":"","sources":["../../../src/components/af-input/af-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Host, Event, EventEmitter, State } from '@stencil/core';\n\n/*\n Input field component with label, description, and error states.\n * Supports single-line and multi-line (textarea) modes via the `multiline` prop.\n \n @slot label-end - Content to display at the end of the label (e.g., info icon)\n /\n@Component({\n tag: 'af-input',\n styleUrl: 'af-input.css',\n shadow: true\n})\nexport class AfInput {\n /\n The label text for the input field\n /\n @Prop() label?: string;\n\n /\n Description text displayed below the label\n /\n @Prop() description?: string;\n\n /\n Placeholder text for the input\n /\n @Prop() placeholder?: string;\n\n /\n The current value of the input\n /\n @Prop({ mutable: true }) value: string = '';\n\n /\n The input type (text, email, password, number, tel, url, search).\n * Ignored when `multiline` is true.\n /\n @Prop() type: 'text' \| 'email' \| 'password' \| 'number' \| 'tel' \| 'url' \| 'search' = 'text';\n\n /\n The name of the input for form submission\n /\n @Prop() name?: string;\n\n /\n Whether the input is disabled\n /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /\n Whether the input is required\n /\n @Prop() required: boolean = false;\n\n /\n Whether the input is read-only\n /\n @Prop() readonly: boolean = false;\n\n /\n Error message to display (also sets error state)\n /\n @Prop() error?: string;\n\n /\n Whether to show the info icon next to the label\n /\n @Prop() showInfoIcon: boolean = false;\n\n /\n Whether to show a search icon in the input. Ignored when `multiline` is true.\n /\n @Prop() showSearchIcon: boolean = false;\n\n /\n Whether to show a clear button when input has value. Ignored when `multiline` is true.\n /\n @Prop() clearable: boolean = false;\n\n /\n Autocomplete attribute for the input\n /\n @Prop() autocomplete?: string;\n\n /\n Maximum length of input value\n /\n @Prop() maxlength?: number;\n\n /\n Minimum length of input value\n /\n @Prop() minlength?: number;\n\n /\n Pattern for input validation (regex). Ignored when `multiline` is true.\n /\n @Prop() pattern?: string;\n\n /\n Render as a multi-line textarea instead of a single-line input.\n * Activates `rows` and `resize` props; ignores `type`, `pattern`,\n * `autocomplete`, `showSearchIcon`, `clearable`.\n /\n @Prop() multiline: boolean = false;\n\n /\n Number of visible rows when `multiline` is true. Ignored otherwise.\n /\n @Prop() rows: number = 4;\n\n /\n Whether the textarea is resizable. Ignored when `multiline` is false.\n /\n @Prop() resize: 'none' \| 'vertical' \| 'horizontal' \| 'both' = 'vertical';\n\n /\n Emitted when the input value changes\n /\n @Event() afInput!: EventEmitter<{ value: string }>;\n\n /\n Emitted when the input loses focus\n /\n @Event() afBlur!: EventEmitter<void>;\n\n /\n Emitted when the input gains focus\n /\n @Event() afFocus!: EventEmitter<void>;\n\n /\n Emitted when the clear button is clicked. Only fires in single-line mode.\n /\n @Event() afClear!: EventEmitter<void>;\n\n /\n Emitted when the info icon is clicked\n /\n @Event() afInfoClick!: EventEmitter<void>;\n\n @State() private isFocused: boolean = false;\n @State() private isHovered: boolean = false;\n\n private inputEl?: HTMLInputElement \| HTMLTextAreaElement;\n\n private handleInput = (event: Event) => {\n const target = event.target as HTMLInputElement \| HTMLTextAreaElement;\n this.value = target.value;\n this.afInput.emit({ value: this.value });\n };\n\n private handleFocus = () => {\n this.isFocused = true;\n this.afFocus.emit();\n };\n\n private handleBlur = () => {\n this.isFocused = false;\n this.afBlur.emit();\n };\n\n private handleMouseEnter = () => {\n this.isHovered = true;\n };\n\n private handleMouseLeave = () => {\n this.isHovered = false;\n };\n\n private handleClear = () => {\n this.value = '';\n this.afClear.emit();\n this.afInput.emit({ value: '' });\n this.inputEl?.focus();\n };\n\n private handleInfoClick = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n this.afInfoClick.emit();\n };\n\n render() {\n const hasError = !!this.error;\n const hasValue = !!(this.value && this.value.length > 0);\n const multiline = this.multiline;\n\n const wrapperClasses = {\n 'input-wrapper': true,\n 'input-wrapper--multiline': multiline,\n 'disabled': this.disabled,\n 'error': hasError,\n 'focused': this.isFocused,\n 'hovered': this.isHovered && !this.disabled && !this.isFocused,\n 'populated': hasValue\n };\n\n const inputContainerClasses = {\n 'input-container': true,\n 'input-container--multiline': multiline,\n 'disabled': this.disabled,\n 'error': hasError,\n 'focused': this.isFocused,\n 'hovered': this.isHovered && !this.disabled && !this.isFocused\n };\n\n return (\n <Host>\n <div class={wrapperClasses}>\n {/ Label /}\n {this.label && (\n <div class=\"label-row\">\n <label class=\"label\" htmlFor=\"input\">\n {this.label}\n {this.required && <span class=\"required\"></span>}\n </label>\n {this.showInfoIcon && (\n <button\n type=\"button\"\n class=\"info-icon\"\n onClick={this.handleInfoClick}\n aria-label=\"More information\"\n >\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 16V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 8H12.01\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </button>\n )}\n <slot name=\"label-end\"></slot>\n </div>\n )}\n\n {/* Description /}\n {this.description && (\n <p class=\"description\">{this.description}</p>\n )}\n\n {/ Input container /}\n <div\n class={inputContainerClasses}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n >\n {/ Search icon (single-line only) /}\n {!multiline && this.showSearchIcon && (\n <span class=\"search-icon\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M11 19C15.4183 19 19 15.4183 19 11C19 6.58172 15.4183 3 11 3C6.58172 3 3 6.58172 3 11C3 15.4183 6.58172 19 11 19Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M21 21L16.65 16.65\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </span>\n )}\n\n {/ Native input or textarea /}\n {multiline ? (\n <textarea\n ref={(el) => this.inputEl = el ?? undefined}\n id=\"input\"\n class=\"input input--multiline\"\n name={this.name}\n value={this.value}\n placeholder={this.placeholder}\n disabled={this.disabled}\n required={this.required}\n readonly={this.readonly}\n rows={this.rows}\n maxlength={this.maxlength}\n minlength={this.minlength}\n style={{ resize: this.resize }}\n aria-invalid={hasError ? 'true' : undefined}\n aria-describedby={hasError ? 'error-message' : this.description ? 'description' : undefined}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n />\n ) : (\n <input\n ref={(el) => this.inputEl = el ?? undefined}\n id=\"input\"\n class=\"input\"\n type={this.type}\n name={this.name}\n value={this.value}\n placeholder={this.placeholder}\n disabled={this.disabled}\n required={this.required}\n readonly={this.readonly}\n autocomplete={this.autocomplete}\n maxlength={this.maxlength}\n minlength={this.minlength}\n pattern={this.pattern}\n aria-invalid={hasError ? 'true' : undefined}\n aria-describedby={hasError ? 'error-message' : this.description ? 'description' : undefined}\n onInput={this.handleInput}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n />\n )}\n\n {/ Clear button (single-line only) /}\n {!multiline && this.clearable && hasValue && !this.disabled && !this.readonly && (\n <button\n type=\"button\"\n class=\"clear-button\"\n onClick={this.handleClear}\n aria-label=\"Clear input\"\n >\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M6 6L18 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </button>\n )}\n </div>\n\n {/ Error message */}\n {hasError && (\n <div class=\"error-row\" id=\"error-message\">\n <span class=\"error-icon\">\n <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 16V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M12 8H12.01\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </span>\n <span class=\"error-text\">{this.error}</span>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n\n"]}

package/dist/collection/components/af-logo-well/af-logo-well.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { h, Host } from "@stencil/core";
  */
 export class AfLogoWell {
     render() {
-        return (h(Host, { key: '3dce73db40979d85f0ec5f467baf049e3582d8e2' }, h("div", { key: '7c788d3abb3ad7b1f6835d4561c3389dda007ffa', class: "logo-well" }, h("slot", { key: 'fa27e27c2c6204256582143b8dd00c8de5f73501' }))));
+        return (h(Host, { key: '89f971eecc9e4a0656c6a6865c2653e64bbdd7bb' }, h("div", { key: 'a4ac54bd1649f010caa095b2ea1f8e7ea8b24a02', class: "logo-well" }, h("slot", { key: '11cf1c916f2b056c6ee575351263d83778529146' }))));
     }
     static get is() { return "af-logo-well"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/af-nav-accordion/af-nav-accordion.js CHANGED Viewed

@@ -71,7 +71,7 @@ export class AfNavAccordion {
         this.syncItems();
     }
     render() {
-        return (h(Host, { key: 'e60e0f40da03dce1a766a880f1f3649dd957b63e', class: { [`breakpoint-${this.breakpoint}`]: true, [`mode-${this.mode}`]: true } }, h("div", { key: 'e80e79b012c3060a9fdfcec22af050eb5d063648', class: "nav-accordion" }, h("slot", { key: '234d41321e32046d3d439a93a544c0325b0a02a8' }))));
+        return (h(Host, { key: '111706b5210510f44864d0dd8f5d2fe1901839da', class: { [`breakpoint-${this.breakpoint}`]: true, [`mode-${this.mode}`]: true } }, h("div", { key: 'e21f1a8ae3edf2c8aa08385240a536c69cf0da6e', class: "nav-accordion" }, h("slot", { key: 'c452fa149aec51c88dbaef3e59de7e28c4f89de3' }))));
     }
     static get is() { return "af-nav-accordion"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-nav-accordion-item/af-nav-accordion-item.js CHANGED Viewed

@@ -84,11 +84,11 @@ export class AfNavAccordionItem {
         // sub-content to expand. A plain href item with no children is a
         // direct link and shouldn't show a disclosure affordance.
         const hasDropdownContent = this.hasContent;
-        return (h(Host, { key: '4027092e406bd448da8d84941b626a5416d7974f', class: {
+        return (h(Host, { key: 'bcdd77ad3dea306e2c1b9b8481d3e00a8cd8cc72', class: {
                 'is-open': this.open,
                 'is-disabled': this.disabled,
                 [`breakpoint-${this.breakpoint}`]: true
-            } }, h("div", { key: '5ed6f75516a8b2a82c9231568beef6b8d5257318', class: "nav-accordion-item" }, this.href ? (h("a", { href: this.href, class: "trigger", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": `content-${this.itemId}` }, h("div", { class: "trigger-content" }, h("slot", { name: "trigger", onSlotchange: this.handleSlotChange }, h("span", { class: "label" }, this.label))), hasDropdownContent && (h("button", { class: "chevron-button", onClick: (e) => { e.preventDefault(); e.stopPropagation(); this.toggle(); }, "aria-label": this.open ? 'Collapse' : 'Expand', type: "button" }, h("div", { class: { 'chevron': true, 'is-open': this.open } }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor" }, h("path", { d: "M6 9l6 6 6-6", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))) : (h("button", { class: "trigger", onClick: this.handleTriggerClick, onKeyDown: this.handleKeyDown, "aria-expanded": this.open ? 'true' : 'false', "aria-controls": `content-${this.itemId}`, disabled: this.disabled, type: "button" }, h("div", { class: "trigger-content" }, h("slot", { name: "trigger", onSlotchange: this.handleSlotChange }, h("span", { class: "label" }, this.label))), hasDropdownContent && (h("div", { class: { 'chevron': true, 'is-open': this.open } }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor" }, h("path", { d: "M6 9l6 6 6-6", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: '158bd9902b4f77655cccfb8571802fd4853abbcc', id: `content-${this.itemId}`, class: "content-wrapper", style: contentStyle, "aria-hidden": !this.open ? 'true' : 'false' }, h("div", { key: 'a3a4a2214fb02312d2ed90772afc83f5799f01dc', class: "content", ref: (el) => (this.contentRef = el) }, h("slot", { key: '834d9fc168ca9e17bcfa2dc9cd117e51e331344e' }))))));
+            } }, h("div", { key: 'b82a343372689e06aff2ec3eb2b9b2b0ba02c14d', class: "nav-accordion-item" }, this.href ? (h("a", { href: this.href, class: "trigger", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": `content-${this.itemId}` }, h("div", { class: "trigger-content" }, h("slot", { name: "trigger", onSlotchange: this.handleSlotChange }, h("span", { class: "label" }, this.label))), hasDropdownContent && (h("button", { class: "chevron-button", onClick: (e) => { e.preventDefault(); e.stopPropagation(); this.toggle(); }, "aria-label": this.open ? 'Collapse' : 'Expand', type: "button" }, h("div", { class: { 'chevron': true, 'is-open': this.open } }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor" }, h("path", { d: "M6 9l6 6 6-6", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))) : (h("button", { class: "trigger", onClick: this.handleTriggerClick, onKeyDown: this.handleKeyDown, "aria-expanded": this.open ? 'true' : 'false', "aria-controls": `content-${this.itemId}`, disabled: this.disabled, type: "button" }, h("div", { class: "trigger-content" }, h("slot", { name: "trigger", onSlotchange: this.handleSlotChange }, h("span", { class: "label" }, this.label))), hasDropdownContent && (h("div", { class: { 'chevron': true, 'is-open': this.open } }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor" }, h("path", { d: "M6 9l6 6 6-6", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: '880a15014002f905a4c1c1e20dc5516022b9aee1', id: `content-${this.itemId}`, class: "content-wrapper", style: contentStyle, "aria-hidden": !this.open ? 'true' : 'false' }, h("div", { key: 'e47b8972907ad32e3fee37f030f1d86c17ac30bc', class: "content", ref: (el) => (this.contentRef = el) }, h("slot", { key: '1def93a51457196a6a023ab32905b8eaa7590c05' }))))));
     }
     static get is() { return "af-nav-accordion-item"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-nav-menu/af-nav-menu.js CHANGED Viewed

@@ -30,7 +30,7 @@ export class AfNavMenu {
             'has-border': this.showBorder,
             'card-style': this.cardStyle
         };
-        return (h(Host, { key: 'b77aa8f55e2148e3a21dea9009ccc9f345ad5da1' }, h("div", { key: '0ef8c2202f6ba4925bf16a2e448dec67f65b1bd6', class: classes }, this.heading && (h("div", { key: '6164df7a1a6efe8afb57860d20175fa5ecabf39c', class: "menu-header" }, h("h3", { key: 'a517c7e3039424974c111dc8bf085b9bb57ce833', class: "menu-heading" }, this.heading))), h("div", { key: '18389d1f29886f2d832744bf1cadc449c8e96948', class: "menu-items" }, h("slot", { key: '40c5ffc54a5c1eedd8e07fbecd040070f1b16d97' })))));
+        return (h(Host, { key: '3245ae98bb4b1ab013d36630802bb1cdece57675' }, h("div", { key: 'e84dcdc45b92f928ee7b8dd2328a2b7276a2e02a', class: classes }, this.heading && (h("div", { key: 'd42c91176b53b5d0375cb29d489b722dcd3c8e74', class: "menu-header" }, h("h3", { key: 'b2cf5d6cb682db6f68c9a45045fb060710097137', class: "menu-heading" }, this.heading))), h("div", { key: '89e7aef886d60d2ce3d8b82cd1b2c588d4894be8', class: "menu-items" }, h("slot", { key: '29d596f664fdfc83fc40c17686751f1b893bce26' })))));
     }
     static get is() { return "af-nav-menu"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-nav-menu-nest/af-nav-menu-nest.js CHANGED Viewed

@@ -48,7 +48,7 @@ export class AfNavMenuNest {
             [`type-${this.type}`]: true,
             [`breakpoint-${this.breakpoint}`]: true
         };
-        return (h(Host, { key: '90fbee205d076ffd9884122101a2f337088d6cd6' }, h("div", { key: '49e9b2290833f5200119d2cac7d4381e74eddbec', class: classes }, h("div", { key: '148790bd4481d662149913a6b53e248c4ff49f95', class: "menu-columns" }, h("slot", { key: '7790aa268c060cc8253bab3dc08c9de0819eb39a' })), h("div", { key: '393ed046ddcd717e4d1dd8a2e9df0332f1612238', class: "menu-sidebar" }, h("slot", { key: 'cb61c9744b070aaf2bcbbbf2b402664e41e2866c', name: "sidebar" })))));
+        return (h(Host, { key: 'b0eb2c4904916a16b2b6ec6d612337fed3c05e12' }, h("div", { key: 'dd1836b1c6ee6f75555989334a35e2a41d9bacab', class: classes }, h("div", { key: '4e3ae3951e9969d21a5e18a0489a33631bb1e8f2', class: "menu-columns" }, h("slot", { key: '64c660d4a5b35dda06b0ff0ca21c0e24014ceef2' })), h("div", { key: '7418a543431a9fd0fbbf95b1e3b5e862d5ac3917', class: "menu-sidebar" }, h("slot", { key: 'd36bb4016c86d9258a70ddbb46232264bdb156e4', name: "sidebar" })))));
     }
     static get is() { return "af-nav-menu-nest"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-number-badge/af-number-badge.js CHANGED Viewed

@@ -34,7 +34,7 @@ export class AfNumberBadge {
             height: `${this.size}px`,
             fontSize: `${fontSize}px`,
         };
-        return (h(Host, { key: '6d275b5b5e029c0d34508dca9cd674cfcc686130', role: "img", "aria-label": `Number ${this.number}${isInCircle ? ' badge' : ''}` }, h("span", { key: 'd158b8c0139ac46b892170859ae0d0c43ec2eb9a', class: {
+        return (h(Host, { key: 'e38ee2826f507669b252c5aac8b02c9f0040d97e', role: "img", "aria-label": `Number ${this.number}${isInCircle ? ' badge' : ''}` }, h("span", { key: '49d9df033be715ce38e87b32a8fec3b2d9596675', class: {
                 'badge': true,
                 [`variant-${this.variant}`]: true,
             }, style: badgeStyle }, this.number)));

package/dist/collection/components/af-numbered-stepper/af-numbered-stepper.js CHANGED Viewed

@@ -49,7 +49,7 @@ export class AfNumberedStepper {
         });
     }
     render() {
-        return (h(Host, { key: '018229242bb7fbcd74c312683b4a6ce4e7337894', class: `numbered-stepper numbered-stepper--${this.orientation}`, role: "list" }, h("slot", { key: '3fae9bbb5bc403d2f55bd4076c1794163e9631e2' })));
+        return (h(Host, { key: '468809af144520073ec0924b8b293a1a7a98c2a6', class: `numbered-stepper numbered-stepper--${this.orientation}`, role: "list" }, h("slot", { key: 'e7ab09871620ab5ccc1b384443824a91750a15c3' })));
     }
     static get is() { return "af-numbered-stepper"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-numbered-stepper-item/af-numbered-stepper-item.js CHANGED Viewed

@@ -24,7 +24,7 @@ export class AfNumberedStepperItem {
     render() {
         // The badge supports 1–10; clamp for safety so we never pass a bad prop.
         const clamped = Math.max(1, Math.min(10, this.index | 0));
-        return (h(Host, { key: 'f703f0459299a2a7f9bec41634fb9c71749aebdb', role: "listitem" }, h("div", { key: '635c36a16c67735dd241228fb44b3dda152bc9d9', class: "numbered-stepper-item__marker-row", "aria-hidden": "true" }, h("af-number-badge", { key: 'ce495f0f0f17ea196a0ba0032c4e897fb027b2ad', class: "numbered-stepper-item__badge", number: clamped, variant: "inCircle", size: 40 }), h("span", { key: '5158ca703611b55d28bb34b445f68fa462b582cf', class: "numbered-stepper-item__connector" })), h("af-typography-lockup", { key: '591e3622a0cd4132a13ea7b0c87e368954ce287c', class: "numbered-stepper-item__lockup", "heading-size": "card", "text-alignment": "center" }, h("slot", { key: '0b8ada7fb0b6bd5bb29eb8f1fffa07eb79984b3f', name: "heading" }), h("span", { key: '83813e92ed8e70dbaf507db4fb306e0d69cf5d51', slot: "description" }, h("slot", { key: 'a676610379b5f948d65acad4f8c4adeecf5c81a1', name: "body" })))));
+        return (h(Host, { key: '62bc6f558da62d664e22c680af3d4a0cd959ee27', role: "listitem" }, h("div", { key: 'aac9fb7f30e3a0bbb70303102526bc9871910737', class: "numbered-stepper-item__marker-row", "aria-hidden": "true" }, h("af-number-badge", { key: 'fb4ba62a61cdc4bced7985f8013a7adcc309cf0e', class: "numbered-stepper-item__badge", number: clamped, variant: "inCircle", size: 40 }), h("span", { key: '3090034f17f0c62ab94a91bd45b5772856b6c632', class: "numbered-stepper-item__connector" })), h("af-typography-lockup", { key: 'fdcc257515a9265330d4443d6e665ad44630cc73', class: "numbered-stepper-item__lockup", "heading-size": "card", "text-alignment": "center" }, h("slot", { key: '6905c5a82d0dc82ed81ef3847f534bde32be9262', name: "heading" }), h("span", { key: '8be84e524019bf3f51b5d8447eaae5d6d2b881f0', slot: "description" }, h("slot", { key: '6c0b5d91a79706cb864fa532d6432699130bd728', name: "body" })))));
     }
     static get is() { return "af-numbered-stepper-item"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/af-paperclip-decoration/af-paperclip-decoration.js CHANGED Viewed

@@ -50,7 +50,7 @@ export class AfPaperclipDecoration {
         this.fill = 'white';
     }
     render() {
-        return (h(Host, { key: '4236fa1de1c1847b0665c79341000bfb63ab4509' }, h("svg", { key: '6c11c85851c7e6e11d625dac2eb546bb9a0405dc', "aria-hidden": "true", width: this.width, height: this.height, viewBox: "0 0 655 754", fill: "none", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "none" }, h("path", { key: 'ab2f7bcda82bd715dcf336abb1e191badd1f624a', d: "M1102.14 108.279C1031.8 37.5181 939.128 -1.06817 840.61 0.447304H358.674L262.104 157.124H841.87C842.558 157.124 843.36 157.124 844.047 157.124C900.638 157.124 953.791 179.273 994 219.725C1035.24 261.225 1058.04 316.715 1058.04 376.052C1058.04 497.872 960.665 596.844 841.068 596.844H251.335C197.609 596.844 153.848 552.313 153.848 497.639C153.848 442.965 197.723 397.734 251.221 396.102H779.208L878.872 239.426H248.586C111.577 242.923 0 358.682 0 497.639C0 636.596 112.723 753.404 251.335 753.404H841.068C1045.55 753.404 1212 584.021 1212 375.935C1212 274.398 1173.05 179.39 1102.26 108.162L1102.14 108.279Z", fill: this.fill, "fill-opacity": this.opacity }))));
+        return (h(Host, { key: '2056080b6be950fecf3cd1dc43114e457dac513b' }, h("svg", { key: '8a054a7d2794adc1042d474cffb0e82ad686bb63', "aria-hidden": "true", width: this.width, height: this.height, viewBox: "0 0 655 754", fill: "none", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "none" }, h("path", { key: 'e8704baa60e7b272d3c731b104b8e93f7a7ae517', d: "M1102.14 108.279C1031.8 37.5181 939.128 -1.06817 840.61 0.447304H358.674L262.104 157.124H841.87C842.558 157.124 843.36 157.124 844.047 157.124C900.638 157.124 953.791 179.273 994 219.725C1035.24 261.225 1058.04 316.715 1058.04 376.052C1058.04 497.872 960.665 596.844 841.068 596.844H251.335C197.609 596.844 153.848 552.313 153.848 497.639C153.848 442.965 197.723 397.734 251.221 396.102H779.208L878.872 239.426H248.586C111.577 242.923 0 358.682 0 497.639C0 636.596 112.723 753.404 251.335 753.404H841.068C1045.55 753.404 1212 584.021 1212 375.935C1212 274.398 1173.05 179.39 1102.26 108.162L1102.14 108.279Z", fill: this.fill, "fill-opacity": this.opacity }))));
     }
     static get is() { return "af-paperclip-decoration"; }
     static get encapsulation() { return "shadow"; }