npm - @affinda/wc - Versions diffs - 0.0.26 → 0.0.28 - Mend

@affinda/wc 0.0.26 → 0.0.28

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 (894) hide show

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

@@ -88,3 +88,4 @@ export class AfHeading {
         };
     }
 }
+//# sourceMappingURL=af-heading.js.map

package/dist/collection/components/af-heading/af-heading.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-heading.js","sourceRoot":"","sources":["../../../src/components/af-heading/af-heading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;;;GAIG;AAMH,MAAM,OAAO,SAAS;IALtB;QAME,oBAAoB;QACZ,UAAK,GAAuC,GAAG,CAAC;QAExD,wGAAwG;QAChG,UAAK,GAA4C,SAAS,CAAC;KA+BpE;IA7BS,aAAa;QACnB,2CAA2C;QAC3C,MAAM,MAAM,GAA2B;YACrC,IAAI,EAAE,IAAI;YACV,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;SACV,CAAC;QACF,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC;IACpC,CAAC;IAED,MAAM;QACJ,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,EAAS,CAAC;QAExC,OAAO,CACL,EAAC,GAAG,qDACF,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI;gBAC7B,CAAC,SAAS,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI;aAC9B,EACD,IAAI,EAAC,MAAM;YAEX,8DAAQ,CACJ,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n/**\n * Heading component that inherits color from theme context.\n * Color is determined by the parent theme (af-section, af-card, etc.)\n * via CSS custom properties.\n */\n@Component({\n tag: 'af-heading',\n styleUrl: 'af-heading.css',\n shadow: true\n})\nexport class AfHeading {\n /** Heading level */\n @Prop() level: 'xl' | '1' | '2' | '3' | '4' | '5' = '1';\n\n /** Visual alignment. Defaults to 'inherit' which reads from parent context (e.g. AfTypographyLockup) */\n @Prop() align: 'inherit' | 'left' | 'center' | 'right' = 'inherit';\n\n private getHeadingTag() {\n // Map display levels to semantic HTML tags\n const tagMap: Record<string, string> = {\n 'xl': 'h1',\n '1': 'h1',\n '2': 'h2',\n '3': 'h3',\n '4': 'h4',\n '5': 'h5'\n };\n return tagMap[this.level] || 'h1';\n }\n\n render() {\n const Tag = this.getHeadingTag() as any;\n\n return (\n <Tag\n class={{\n 'heading': true,\n [`level-${this.level}`]: true,\n [`align-${this.align}`]: true\n }}\n part=\"base\"\n >\n <slot />\n </Tag>\n );\n }\n}\n"]}

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

@@ -51,13 +51,12 @@ export class AfIcon {
                 "mutable": false,
                 "complexType": {
                     "original": "IconName",
-                    "resolved": "\"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"close\" | \"code\" | \"data\" | \"document-upload\" | \"download\" | \"edit\" | \"email\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"home\" | \"info\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"menu\" | \"minus\" | \"numbers\" | \"pause\" | \"play\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"search\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"time\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
+                    "resolved": "\"info\" | \"menu\" | \"code\" | \"data\" | \"search\" | \"time\" | \"close\" | \"pause\" | \"play\" | \"home\" | \"email\" | \"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"document-upload\" | \"download\" | \"edit\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"minus\" | \"numbers\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
                     "references": {
                         "IconName": {
                             "location": "import",
                             "path": "@affinda/icons",
-                            "id": "../icons/dist/index.d.ts::IconName",
-                            "referenceLocation": "IconName"
+                            "id": "../icons/dist/index.d.ts::IconName"
                         }
                     }
                 },
@@ -114,3 +113,4 @@ export class AfIcon {
         };
     }
 }
+//# sourceMappingURL=af-icon.js.map

package/dist/collection/components/af-icon/af-icon.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-icon.js","sourceRoot":"","sources":["../../../src/components/af-icon/af-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C;;;;;;;;;;;GAWG;AAMH,MAAM,OAAO,MAAM;IALnB;QAWE;;WAEG;QACK,SAAI,GAAW,EAAE,CAAC;KAoC3B;IA7BC,MAAM;QACJ,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAE1D,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAO,IAAI,CAAC;QACd,CAAC;QAED,MAAM,KAAK,GAAG;YACZ,KAAK,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI;YACvB,MAAM,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI;SACzB,CAAC;QAEF,kDAAkD;QAClD,MAAM,UAAU,GAAG,iBAAiB,QAAQ,CAAC,OAAO,wCAAwC,QAAQ,CAAC,OAAO,QAAQ,CAAC;QAErH,OAAO,CACL,EAAC,IAAI,IACH,IAAI,EAAC,KAAK,gBACE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,IAAI,iBACtB,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;YAE1C,YACE,KAAK,EAAC,gBAAgB,EACtB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,UAAU,GACrB,CACG,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host } from '@stencil/core';\nimport type { IconName } from '@affinda/icons';\nimport { getIconSvg } from '@affinda/icons';\n\n/**\n * Icon component that displays SVG icons from the Affinda icon library.\n * Icons inherit color from their parent via currentColor.\n * \n * Icons are bundled inline, so no runtime fetching is required.\n * This ensures icons work reliably in all bundler contexts.\n * \n * @example\n * ```html\n * <af-icon name=\"arrow-right\" size=\"24\"></af-icon>\n * ```\n */\n@Component({\n tag: 'af-icon',\n styleUrl: 'af-icon.css',\n shadow: true\n})\nexport class AfIcon {\n /**\n * The name of the icon to display\n */\n @Prop() name!: IconName;\n\n /**\n * Size of the icon in pixels\n */\n @Prop() size: number = 24;\n\n /**\n * Accessible label for the icon (for screen readers)\n */\n @Prop() label?: string;\n\n render() {\n const iconData = this.name ? getIconSvg(this.name) : null;\n \n if (!iconData) {\n return null;\n }\n\n const style = {\n width: `${this.size}px`,\n height: `${this.size}px`,\n };\n\n // Build the complete SVG with viewBox and content\n const svgContent = `<svg viewBox=\"${iconData.viewBox}\" xmlns=\"http://www.w3.org/2000/svg\">${iconData.content}</svg>`;\n\n return (\n <Host\n role=\"img\"\n aria-label={this.label || this.name}\n aria-hidden={this.label ? 'false' : 'true'}\n >\n <span\n class=\"icon-container\"\n style={style}\n innerHTML={svgContent}\n />\n </Host>\n );\n }\n}\n"]}

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

@@ -48,13 +48,12 @@ export class AfIconBox {
                 "mutable": false,
                 "complexType": {
                     "original": "IconName",
-                    "resolved": "\"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"close\" | \"code\" | \"data\" | \"document-upload\" | \"download\" | \"edit\" | \"email\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"home\" | \"info\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"menu\" | \"minus\" | \"numbers\" | \"pause\" | \"play\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"search\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"time\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
+                    "resolved": "\"info\" | \"menu\" | \"code\" | \"data\" | \"search\" | \"time\" | \"close\" | \"pause\" | \"play\" | \"home\" | \"email\" | \"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"document-upload\" | \"download\" | \"edit\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"minus\" | \"numbers\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
                     "references": {
                         "IconName": {
                             "location": "import",
                             "path": "@affinda/icons",
-                            "id": "../icons/dist/index.d.ts::IconName",
-                            "referenceLocation": "IconName"
+                            "id": "../icons/dist/index.d.ts::IconName"
                         }
                     }
                 },
@@ -95,3 +94,4 @@ export class AfIconBox {
         };
     }
 }
+//# sourceMappingURL=af-icon-box.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-icon-box.js","sourceRoot":"","sources":["../../../src/components/af-icon-box/af-icon-box.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAGzD;;;;;;;;;;;GAWG;AAOH,MAAM,OAAO,SAAS;IANtB;QAYE;;;;;WAKG;QACK,SAAI,GAAkC,SAAS,CAAC;KAkBzD;IAhBC,MAAM;QACJ,MAAM,gBAAgB,GAAG;YACvB,UAAU,EAAE,IAAI;YAChB,CAAC,kBAAkB,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI;SACtC,CAAC;QAEF,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAE9E,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,gBAAgB;gBAC1B,gEAAS,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,GAAY,CAChD,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host } from '@stencil/core';\nimport type { IconName } from '@affinda/icons';\n\n/**\n * IconBox atom - a themed container for displaying an icon with a rounded background.\n * \n * Inherits theme colors from parent Section via CSS custom properties:\n * - Background uses `--af-background-contrast`\n * - Icon color uses `--af-background-icon-default`\n * \n * @example\n * ```html\n * <af-icon-box icon=\"settings\" size=\"default\"></af-icon-box>\n * ```\n */\n@Component({\n tag: 'af-icon-box',\n styleUrl: 'af-icon-box.css',\n shadow: false,\n scoped: true,\n})\nexport class AfIconBox {\n /**\n * The name of the icon to display (from @affinda/icons)\n */\n @Prop() icon!: IconName;\n\n /**\n * Size variant of the icon box\n * - 'small': 48px container, 20px icon\n * - 'default': 64px container, 40px icon\n * - 'large': 80px container, 48px icon\n */\n @Prop() size: 'small' | 'default' | 'large' = 'default';\n\n render() {\n const containerClasses = {\n 'icon-box': true,\n [`icon-box--size-${this.size}`]: true,\n };\n\n const iconSize = this.size === 'small' ? 20 : this.size === 'large' ? 48 : 40;\n\n return (\n <Host>\n <div class={containerClasses}>\n <af-icon name={this.icon} size={iconSize}></af-icon>\n </div>\n </Host>\n );\n }\n}\n\n"]}

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

@@ -169,3 +169,4 @@ export class AfIconButton {
         };
     }
 }
+//# sourceMappingURL=af-icon-button.js.map

package/dist/collection/components/af-icon-button/af-icon-button.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-icon-button.js","sourceRoot":"","sources":["../../../src/components/af-icon-button/af-icon-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,YAAY;IALzB;QAME;;;;;WAKG;QACsB,YAAO,GAAyC,SAAS,CAAC;QAEnF;;WAEG;QACK,SAAI,GAAiC,QAAQ,CAAC;QAEtD;;WAEG;QACK,aAAQ,GAAY,KAAK,CAAC;QAOlC;;WAEG;QACK,SAAI,GAAkC,QAAQ,CAAC;KAuCxD;IAhCC,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,aAAa,EAAE,IAAI;YACnB,CAAC,WAAW,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI;YACjC,CAAC,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI;YAC3B,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;QAEF,MAAM,OAAO,GAAG,CACd,YAAM,KAAK,EAAC,MAAM;YAChB,eAAa,CACR,CACR,CAAC;QAEF,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YAChC,OAAO,CACL,EAAC,IAAI;gBACH,SAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,gBAAc,IAAI,CAAC,SAAS,IAC3D,OAAO,CACN,CACC,CACR,CAAC;QACJ,CAAC;QAED,OAAO,CACL,EAAC,IAAI;YACH,cAAQ,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,OAAO,gBAAc,IAAI,CAAC,SAAS,IACzF,OAAO,CACD,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host } from '@stencil/core';\n\n@Component({\n tag: 'af-icon-button',\n styleUrl: 'af-icon-button.css',\n shadow: true\n})\nexport class AfIconButton {\n /**\n * The visual variant of the button.\n * - `primary` - Main CTA with filled ice background\n * - `secondary` - Supporting action with white background\n * - `tertiary` - Minimal style with transparent background\n */\n @Prop({ reflect: true }) variant: 'primary' | 'secondary' | 'tertiary' = 'primary';\n\n /**\n * The size of the button\n */\n @Prop() size: 'large' | 'medium' | 'small' = 'medium';\n\n /**\n * Whether the button is disabled\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Optional href to render as a link\n */\n @Prop() href?: string;\n\n /**\n * Button type (when not using href)\n */\n @Prop() type: 'button' | 'submit' | 'reset' = 'button';\n\n /**\n * Accessible label for screen readers\n */\n @Prop() ariaLabel!: string;\n\n render() {\n const classes = {\n 'icon-button': true,\n [`variant-${this.variant}`]: true,\n [`size-${this.size}`]: true,\n 'disabled': this.disabled\n };\n\n const content = (\n <span class=\"icon\">\n <slot></slot>\n </span>\n );\n\n if (this.href && !this.disabled) {\n return (\n <Host>\n <a href={this.href} class={classes} aria-label={this.ariaLabel}>\n {content}\n </a>\n </Host>\n );\n }\n\n return (\n <Host>\n <button type={this.type} disabled={this.disabled} class={classes} aria-label={this.ariaLabel}>\n {content}\n </button>\n </Host>\n );\n }\n}\n"]}

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

@@ -64,13 +64,12 @@ export class AfIconText {
                 "mutable": false,
                 "complexType": {
                     "original": "IconName",
-                    "resolved": "\"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"close\" | \"code\" | \"data\" | \"document-upload\" | \"download\" | \"edit\" | \"email\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"home\" | \"info\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"menu\" | \"minus\" | \"numbers\" | \"pause\" | \"play\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"search\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"time\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
+                    "resolved": "\"info\" | \"menu\" | \"code\" | \"data\" | \"search\" | \"time\" | \"close\" | \"pause\" | \"play\" | \"home\" | \"email\" | \"account-01\" | \"account-02\" | \"accounts-payable\" | \"arrow-down\" | \"arrow-left\" | \"arrow-right\" | \"arrow-up\" | \"bpo\" | \"chats\" | \"check\" | \"check-circle\" | \"chevron-down\" | \"chevron-left\" | \"chevron-right\" | \"chevron-up\" | \"document-upload\" | \"download\" | \"edit\" | \"eye\" | \"facebook\" | \"gear\" | \"github\" | \"heart\" | \"insurance\" | \"lending-01\" | \"lending-02\" | \"link-out\" | \"linkedin\" | \"map-pin\" | \"minus\" | \"numbers\" | \"plus\" | \"productivity\" | \"quote\" | \"recruitment\" | \"refresh\" | \"security-01\" | \"security-02\" | \"solutions\" | \"sparkle\" | \"support\" | \"system\" | \"verification-01\" | \"wand\" | \"x\" | \"youtube\"",
                     "references": {
                         "IconName": {
                             "location": "import",
                             "path": "@affinda/icons",
-                            "id": "../icons/dist/index.d.ts::IconName",
-                            "referenceLocation": "IconName"
+                            "id": "../icons/dist/index.d.ts::IconName"
                         }
                     }
                 },
@@ -148,3 +147,4 @@ export class AfIconText {
         };
     }
 }
+//# sourceMappingURL=af-icon-text.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-icon-text.js","sourceRoot":"","sources":["../../../src/components/af-icon-text/af-icon-text.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAGzD;;;;;;;;;;;;;;;;;;;;;GAqBG;AAOH,MAAM,OAAO,UAAU;IANvB;QAYE;;WAEG;QACK,gBAAW,GAAsB,CAAC,CAAC;QAE3C;;;;WAIG;QACK,gBAAW,GAA8B,UAAU,CAAC;QAE5D;;WAEG;QACK,aAAQ,GAAkC,SAAS,CAAC;KAmC7D;IAjCC,MAAM;QACJ,MAAM,gBAAgB,GAAG;YACvB,WAAW,EAAE,IAAI;YACjB,CAAC,cAAc,IAAI,CAAC,WAAW,EAAE,CAAC,EAAE,IAAI;SACzC,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,gBAAgB;gBAC1B,oEACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,KAAK,EAAC,iBAAiB,GACV;gBAEf,6EACE,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,aAAa,EAAC,MAAM,EACpB,eAAe,EAAC,UAAU,EAC1B,KAAK,EAAC,mBAAmB;oBAEzB,8DAAa;oBACb,6DAAM,IAAI,EAAC,aAAa;wBACtB,6DAAM,IAAI,EAAC,aAAa,GAAQ,CAC3B;oBACP,6DAAM,IAAI,EAAC,SAAS;wBAClB,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACvB,CACc,CACnB,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host } from '@stencil/core';\nimport type { IconName } from '@affinda/icons';\n\n/**\n * IconText molecule - combines an IconBox with a TypographyLockup for feature items.\n * \n * Composes:\n * - af-icon-box: Themed icon container\n * - af-typography-lockup: Heading, description, and button slots\n * \n * Inherits theme colors from parent Section via CSS custom properties.\n * \n * @slot - Heading text content (passed to TypographyLockup)\n * @slot description - Body/description text\n * @slot buttons - Action buttons (typically ghost style)\n * \n * @example\n * ```html\n * <af-icon-text icon=\"settings\" heading-size=\"4\">\n * Feature Heading\n * <span slot=\"description\">Feature description text.</span>\n * <af-button slot=\"buttons\" variant=\"ghost\">Learn more</af-button>\n * </af-icon-text>\n * ```\n */\n@Component({\n tag: 'af-icon-text',\n styleUrl: 'af-icon-text.css',\n shadow: false,\n scoped: true,\n})\nexport class AfIconText {\n /**\n * The icon name to display in the IconBox\n */\n @Prop() icon!: IconName;\n\n /**\n * Heading size for the typography lockup (1-5, where 1 is largest)\n */\n @Prop() headingSize: 1 | 2 | 3 | 4 | 5 = 4;\n\n /**\n * Layout orientation\n * - 'vertical': Icon above text (default, used in grid layouts)\n * - 'horizontal': Icon beside text (used in compact layouts)\n */\n @Prop() orientation: 'vertical' | 'horizontal' = 'vertical';\n\n /**\n * Size of the icon box\n */\n @Prop() iconSize: 'small' | 'default' | 'large' = 'default';\n\n render() {\n const containerClasses = {\n 'icon-text': true,\n [`icon-text--${this.orientation}`]: true,\n };\n\n return (\n <Host>\n <div class={containerClasses}>\n <af-icon-box \n icon={this.icon} \n size={this.iconSize}\n class=\"icon-text__icon\"\n ></af-icon-box>\n \n <af-typography-lockup\n headingSize={this.headingSize}\n textAlignment=\"left\"\n buttonAlignment=\"vertical\"\n class=\"icon-text__lockup\"\n >\n <slot></slot>\n <span slot=\"description\">\n <slot name=\"description\"></slot>\n </span>\n <span slot=\"buttons\">\n <slot name=\"buttons\"></slot>\n </span>\n </af-typography-lockup>\n </div>\n </Host>\n );\n }\n}\n\n"]}

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

@@ -113,3 +113,4 @@ export class AfIllustratedCard {
         };
     }
 }
+//# sourceMappingURL=af-illustrated-card.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-illustrated-card.js","sourceRoot":"","sources":["../../../src/components/af-illustrated-card/af-illustrated-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;;;;;;;;;;GAYG;AAOH,MAAM,OAAO,iBAAiB;IAN9B;QAOE;;;WAGG;QACK,UAAK,GAAsE,YAAY,CAAC;QAEhG;;WAEG;QACK,eAAU,GAAyB,SAAS,CAAC;QAErD;;WAEG;QACK,aAAQ,GAAwB,SAAS,CAAC;KAwCnD;IAtCC,MAAM;QACJ,MAAM,cAAc,GAAG;YACrB,kBAAkB,EAAE,IAAI;YACxB,CAAC,gCAAgC,IAAI,CAAC,UAAU,EAAE,CAAC,EAAE,IAAI;YACzD,CAAC,0BAA0B,IAAI,CAAC,QAAQ,EAAE,CAAC,EAAE,IAAI;SAClD,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,cAAc;gBACxB,gEAAS,KAAK,EAAE,IAAI,CAAC,KAAK;oBAExB,4DAAK,KAAK,EAAC,2BAA2B;wBACpC,6EACE,WAAW,EAAE,CAAC,EACd,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,aAAa,EAAC,MAAM,EACpB,YAAY,EAAC,UAAU;4BAEvB,8DAAa;4BACb,6DAAM,IAAI,EAAC,aAAa;gCACtB,6DAAM,IAAI,EAAC,MAAM,GAAQ,CACpB;4BACP,6DAAM,IAAI,EAAC,SAAS;gCAClB,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACvB,CACc,CACnB;oBAGN,4DAAK,KAAK,EAAC,qCAAqC;wBAC9C,6DAAM,IAAI,EAAC,cAAc,GAAQ,CAC7B,CACE,CACN,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\n\n/**\n * Illustrated Card molecule component that combines a card with an illustration.\n *\n * Uses a theme background with text at top, a button row in the middle, and\n * an illustration from @affinda/illustrations at the bottom.\n *\n * Uses af-card atom internally and af-typography-lockup for text hierarchy.\n *\n * @slot - Heading text content\n * @slot body - Description/body text content\n * @slot buttons - Action buttons (rendered below the description, above the illustration)\n * @slot illustration - Illustration image element\n */\n@Component({\n tag: 'af-illustrated-card',\n styleUrl: 'af-illustrated-card.css',\n shadow: false,\n scoped: true,\n})\nexport class AfIllustratedCard {\n /**\n * Theme variant - sets background color and provides theme context.\n * Defaults to 'mist-green'.\n */\n @Prop() theme?: 'white' | 'white-ivory' | 'inkwell' | 'mist-green' | 'soft-clay' = 'mist-green';\n\n /**\n * Responsive breakpoint for typography sizing.\n */\n @Prop() breakpoint: 'desktop' | 'mobile' = 'desktop';\n\n /**\n * Card size variant (applies to desktop only).\n */\n @Prop() cardSize: 'default' | 'large' = 'default';\n\n render() {\n const wrapperClasses = {\n 'illustrated-card': true,\n [`illustrated-card--breakpoint-${this.breakpoint}`]: true,\n [`illustrated-card--size-${this.cardSize}`]: true,\n };\n\n return (\n <Host>\n <div class={wrapperClasses}>\n <af-card theme={this.theme}>\n {/* Content area with typography lockup */}\n <div class=\"illustrated-card__content\">\n <af-typography-lockup\n headingSize={3}\n breakpoint={this.breakpoint}\n textAlignment=\"left\"\n buttonLayout=\"vertical\"\n >\n <slot></slot>\n <span slot=\"description\">\n <slot name=\"body\"></slot>\n </span>\n <span slot=\"buttons\">\n <slot name=\"buttons\"></slot>\n </span>\n </af-typography-lockup>\n </div>\n\n {/* Illustration area at bottom */}\n <div class=\"illustrated-card__illustration-area\">\n <slot name=\"illustration\"></slot>\n </div>\n </af-card>\n </div>\n </Host>\n );\n }\n}\n"]}

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

@@ -94,3 +94,4 @@ export class AfImage {
         };
     }
 }
+//# sourceMappingURL=af-image.js.map

package/dist/collection/components/af-image/af-image.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-image.js","sourceRoot":"","sources":["../../../src/components/af-image/af-image.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;GAGG;AAOH,MAAM,OAAO,OAAO;IANpB;QAiBE;;;;;;;;WAQG;QACK,UAAK,GAA4D,SAAS,CAAC;KAYpF;IAVC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,oCAAoC,IAAI,CAAC,KAAK,EAAE;gBAC1D,4DAAK,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAC,OAAO,GAAG;gBACnD,4DAAK,KAAK,EAAC,cAAc,iBAAa,MAAM,GAAO,CAC/C,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * A styled image container with rounded corners and a subtle inset border.\n * Provides consistent image styling across the design system.\n */\n@Component({\n tag: 'af-image',\n styleUrl: 'af-image.css',\n shadow: false,\n scoped: true\n})\nexport class AfImage {\n /**\n * The image source URL\n */\n @Prop() src!: string;\n\n /**\n * Alternative text for the image (required for accessibility)\n */\n @Prop() alt!: string;\n\n /**\n * Shape / corner rounding variant. Matches Webflow's `.image-fill.rounded-*`\n * patterns where only one edge is rounded so the image bleeds into a\n * neighbouring section.\n * - `rounded` (default) — symmetric rounded corners on all four sides.\n * - `rounded-left` — rounded only on the left edge (top-left + bottom-left).\n * - `rounded-right` — rounded only on the right edge.\n * - `square` — no corner rounding.\n */\n @Prop() shape: 'rounded' | 'rounded-left' | 'rounded-right' | 'square' = 'rounded';\n\n render() {\n return (\n <Host>\n <div class={`image-container image-container--${this.shape}`}>\n <img src={this.src} alt={this.alt} class=\"image\" />\n <div class=\"image-border\" aria-hidden=\"true\"></div>\n </div>\n </Host>\n );\n }\n}\n"]}

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

@@ -161,10 +161,10 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 360px;
-  height: 360px;
-  max-width: 360px;
-  max-height: 360px;
+  width: 288px;
+  height: 288px;
+  max-width: 288px;
+  max-height: 288px;
   aspect-ratio: 1;
 }
@@ -200,8 +200,8 @@
   display: flex;
   flex-direction: column;
   gap: 40px;
-  padding-top: var(--margins-margin-tb-tight, 48px);
-  padding-bottom: var(--margins-margin-tb-tight, 48px);
+  padding-top: 38px;
+  padding-bottom: 38px;
   padding-right: 0;
   padding-left: 0;
 }
@@ -268,7 +268,7 @@
 .banner__buttons {
   display: flex;
   flex-direction: row;
-  gap: 12px;
+  gap: 24px;
   align-items: flex-start;
 }

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

@@ -273,3 +273,4 @@ export class AfInPageBanner {
         };
     }
 }
+//# sourceMappingURL=af-in-page-banner.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-in-page-banner.js","sourceRoot":"","sources":["../../../src/components/af-in-page-banner/af-in-page-banner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAIzD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AAOH,MAAM,OAAO,cAAc;IAN3B;QAOE,qEAAqE;QAC7D,UAAK,GAAgB,YAAY,CAAC;QAE1C,qBAAqB;QACb,YAAO,GAAW,EAAE,CAAC;QAE7B,yBAAyB;QACjB,gBAAW,GAAW,EAAE,CAAC;QAEjC,0BAA0B;QAClB,sBAAiB,GAAW,EAAE,CAAC;QAEvC,yBAAyB;QACjB,qBAAgB,GAAW,GAAG,CAAC;QAEvC,qEAAqE;QAC7D,wBAAmB,GAAW,EAAE,CAAC;QAEzC,2BAA2B;QACnB,uBAAkB,GAAW,GAAG,CAAC;QAEzC;;;WAGG;QACK,oBAAe,GAAW,EAAE,CAAC;QAErC,kDAAkD;QAC1C,uBAAkB,GAAY,IAAI,CAAC;KA4E5C;IA1EC;;;;OAIG;IACK,iBAAiB;QACvB,OAAO,CACL,WAAK,KAAK,EAAC,sBAAsB,iBAAa,MAAM;YAClD,WACE,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,kBAAkB;gBAExB,YACE,CAAC,EAAC,ilBAAilB,EACnlB,IAAI,EAAC,cAAc,GACnB,CACE,CACF,CACP,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,gBAAgB,IAAI,CAAC,KAAK,EAAE;gBAErC,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,iBAAiB,EAAE;gBAGpD,4DAAK,KAAK,EAAC,sBAAsB,IAC9B,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CACtB,WACE,GAAG,EAAE,IAAI,CAAC,eAAe,EACzB,GAAG,EAAC,EAAE,EACN,KAAK,EAAC,0BAA0B,EAChC,OAAO,EAAC,MAAM,GACd,CACH,CAAC,CAAC,CAAC,CACF,YAAM,IAAI,EAAC,cAAc,GAAQ,CAClC,CACG;gBAGN,4DAAK,KAAK,EAAC,iBAAiB;oBAC1B,4DAAK,KAAK,EAAC,cAAc;wBACvB,2DAAI,KAAK,EAAC,iBAAiB;4BACzB,6DAAM,IAAI,EAAC,SAAS,IAAE,IAAI,CAAC,OAAO,CAAQ,CACvC;wBACL,4DAAK,KAAK,EAAC,qBAAqB;4BAC9B,6DAAM,IAAI,EAAC,aAAa,IAAE,IAAI,CAAC,WAAW,CAAQ,CAC9C,CACF;oBAEN,4DAAK,KAAK,EAAC,iBAAiB;wBAC1B,6DAAM,IAAI,EAAC,SAAS;4BACjB,IAAI,CAAC,iBAAiB,IAAI,CACzB,kEAAW,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,EAAC,SAAS,IACtD,IAAI,CAAC,iBAAiB,CACb,CACb;4BACA,IAAI,CAAC,mBAAmB,IAAI,CAC3B,kEAAW,IAAI,EAAE,IAAI,CAAC,kBAAkB,EAAE,OAAO,EAAC,WAAW,IAC1D,IAAI,CAAC,mBAAmB,CACf,CACb,CACI,CACH,CACF,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\ntype BannerTheme = 'white-ivory' | 'mist-green' | 'soft-clay' | 'inkwell';\n\n/**\n * In-page banner component for call-to-action content.\n * \n * A banner card with illustration, heading, description, and action buttons.\n * Typically placed inside a neutral (white) Section to show off its themed background.\n * \n * The component has its own theme prop to control its background color and styling.\n * \n * **Illustration Usage:**\n * Use `illustrationUrl` to pass an illustration image URL. For theme-matched illustrations,\n * use `getIllustrationUrlByScene()` from `@affinda/illustrations` in your consuming app:\n * \n * ```tsx\n * import { getIllustrationUrlByScene } from '@affinda/illustrations';\n * \n * <InPageBanner\n * theme=\"inkwell\"\n * illustrationUrl={getIllustrationUrlByScene('automate', 'inkwell')}\n * ...\n * />\n * ```\n * \n * Alternatively, use the `illustration` slot for completely custom content.\n *\n * **Slot-based composition (preferred for rich content):**\n * - `heading` — heading markup (overrides the `heading` prop when provided).\n * - `description` — description markup (overrides the `description` prop).\n * - `buttons` — custom button group (overrides the primary/secondary button\n * props; use when you need ghost variants, more than two buttons, or\n * per-button icons).\n * - `illustration` — custom illustration markup.\n *\n * The string props remain supported for simple cases.\n */\n@Component({\n tag: 'af-in-page-banner',\n styleUrl: 'af-in-page-banner.css',\n shadow: false,\n scoped: true,\n})\nexport class AfInPageBanner {\n /** Theme - sets the banner background color and typography colors */\n @Prop() theme: BannerTheme = 'mist-green';\n\n /** Banner heading */\n @Prop() heading: string = '';\n\n /** Banner description */\n @Prop() description: string = '';\n\n /** Primary button text */\n @Prop() primaryButtonText: string = '';\n\n /** Primary button URL */\n @Prop() primaryButtonUrl: string = '#';\n\n /** Secondary button text (optional - if empty, button won't show) */\n @Prop() secondaryButtonText: string = '';\n\n /** Secondary button URL */\n @Prop() secondaryButtonUrl: string = '#';\n\n /** \n * Illustration URL. For theme-matched illustrations, use getIllustrationUrlByScene() \n * from @affinda/illustrations in your app code.\n */\n @Prop() illustrationUrl: string = '';\n\n /** Whether to show the decorative wave overlay */\n @Prop() showWaveDecoration: boolean = true;\n\n /**\n * Renders the decorative wave SVG overlay.\n * Uses the Affinda brand \"infinity loop\" wave pattern.\n * Fill color is controlled via CSS custom properties per theme.\n */\n private renderWaveOverlay() {\n return (\n <div class=\"banner__wave-overlay\" aria-hidden=\"true\">\n <svg \n viewBox=\"0 0 521 323\" \n fill=\"none\" \n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"banner__wave-svg\"\n >\n <path \n 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\" \n fill=\"currentColor\"\n />\n </svg>\n </div>\n );\n }\n\n render() {\n return (\n <Host>\n <div class={`banner theme-${this.theme}`}>\n {/* Decorative wave overlay */}\n {this.showWaveDecoration && this.renderWaveOverlay()}\n\n {/* Illustration area */}\n <div class=\"banner__illustration\">\n {this.illustrationUrl ? (\n <img \n src={this.illustrationUrl} \n alt=\"\" \n class=\"banner__illustration-img\" \n loading=\"lazy\"\n />\n ) : (\n <slot name=\"illustration\"></slot>\n )}\n </div>\n\n {/* Content area — slots take precedence over string props. */}\n <div class=\"banner__content\">\n <div class=\"banner__copy\">\n <h2 class=\"banner__heading\">\n <slot name=\"heading\">{this.heading}</slot>\n </h2>\n <div class=\"banner__description\">\n <slot name=\"description\">{this.description}</slot>\n </div>\n </div>\n\n <div class=\"banner__buttons\">\n <slot name=\"buttons\">\n {this.primaryButtonText && (\n <af-button href={this.primaryButtonUrl} variant=\"primary\">\n {this.primaryButtonText}\n </af-button>\n )}\n {this.secondaryButtonText && (\n <af-button href={this.secondaryButtonUrl} variant=\"secondary\">\n {this.secondaryButtonText}\n </af-button>\n )}\n </slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

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

@@ -163,3 +163,4 @@ export class AfInline {
         };
     }
 }
+//# sourceMappingURL=af-inline.js.map

package/dist/collection/components/af-inline/af-inline.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-inline.js","sourceRoot":"","sources":["../../../src/components/af-inline/af-inline.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAMzD;;;;;GAKG;AAMH,MAAM,OAAO,QAAQ;IALrB;QAME;;;WAGG;QACK,QAAG,GAAQ,GAAG,CAAC;QAEvB;;WAEG;QACK,UAAK,GAAU,QAAQ,CAAC;QAEhC;;WAEG;QACK,YAAO,GAAY,OAAO,CAAC;QAEnC;;WAEG;QACK,SAAI,GAAY,IAAI,CAAC;KAmC9B;IAjCC,MAAM;QACJ,MAAM,QAAQ,GAA0B;YACtC,KAAK,EAAE,YAAY;YACnB,MAAM,EAAE,QAAQ;YAChB,GAAG,EAAE,UAAU;YACf,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,UAAU;SACrB,CAAC;QAEF,MAAM,UAAU,GAA4B;YAC1C,KAAK,EAAE,YAAY;YACnB,MAAM,EAAE,QAAQ;YAChB,GAAG,EAAE,UAAU;YACf,OAAO,EAAE,eAAe;YACxB,MAAM,EAAE,cAAc;YACtB,MAAM,EAAE,cAAc;SACvB,CAAC;QAEF,MAAM,KAAK,GAAG;YACZ,OAAO,EAAE,aAAa;YACtB,aAAa,EAAE,KAAK;YACpB,GAAG,EAAE,eAAe,IAAI,CAAC,GAAG,GAAG;YAC/B,UAAU,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;YAChC,cAAc,EAAE,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC;YACxC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ;SACd,CAAC;QAE5B,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,KAAK;YAChB,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Prop } from '@stencil/core';\n\ntype Gap = '1' | '2' | '3' | '4' | '5' | '6' | '8';\ntype Align = 'start' | 'center' | 'end' | 'stretch' | 'baseline';\ntype Justify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';\n\n/**\n * Inline layout component for horizontal inline-flex layouts with gap and optional wrapping.\n * Ideal for button groups, tags, pills, and other inline elements.\n *\n * @slot - Content to layout inline\n */\n@Component({\n tag: 'af-inline',\n styleUrl: 'af-inline.css',\n shadow: true,\n})\nexport class AfInline {\n /**\n * Gap between items using space tokens (1-8).\n * Maps to --space-1 through --space-8 (4px to 32px).\n */\n @Prop() gap: Gap = '2';\n\n /**\n * Align items on the cross axis.\n */\n @Prop() align: Align = 'center';\n\n /**\n * Justify content on the main axis.\n */\n @Prop() justify: Justify = 'start';\n\n /**\n * Whether items should wrap to the next line when they overflow.\n */\n @Prop() wrap: boolean = true;\n\n render() {\n const alignMap: Record<Align, string> = {\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n stretch: 'stretch',\n baseline: 'baseline',\n };\n\n const justifyMap: Record<Justify, string> = {\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n between: 'space-between',\n around: 'space-around',\n evenly: 'space-evenly',\n };\n\n const style = {\n display: 'inline-flex',\n flexDirection: 'row',\n gap: `var(--space-${this.gap})`,\n alignItems: alignMap[this.align],\n justifyContent: justifyMap[this.justify],\n flexWrap: this.wrap ? 'wrap' : 'nowrap',\n } as Record<string, string>;\n\n return (\n <Host style={style}>\n <slot></slot>\n </Host>\n );\n }\n}\n\n"]}

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

@@ -524,3 +524,4 @@ export class AfInput {
             }];
     }
 }
+//# sourceMappingURL=af-input.js.map

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

@@ -0,0 +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 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"]}

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

@@ -19,3 +19,4 @@ export class AfLogo {
         };
     }
 }
+//# sourceMappingURL=af-logo.js.map

package/dist/collection/components/af-logo/af-logo.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-logo.js","sourceRoot":"","sources":["../../../src/components/af-logo/af-logo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;GAEG;AAMH,MAAM,OAAO,MAAM;IACjB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DACE,KAAK,EAAC,UAAU,EAChB,OAAO,EAAC,eAAe,gBACZ,SAAS,EACpB,IAAI,EAAC,KAAK;gBAEV,6DACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,6bAA6b,GAC/b;gBACF,6DACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,4uBAA4uB,GAC9uB;gBACF,6DAAM,IAAI,EAAC,cAAc,EAAC,CAAC,EAAC,gDAAgD,GAAE;gBAC9E,6DACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,udAAud,GACzd;gBACF,6DACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,wuBAAwuB,GAC1uB;gBACF,6DACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,0uBAA0uB,GAC5uB;gBACF,6DAAM,IAAI,EAAC,cAAc,EAAC,CAAC,EAAC,sKAAsK,GAAE;gBACpM,6DAAM,IAAI,EAAC,cAAc,EAAC,CAAC,EAAC,sKAAsK,GAAE,CAChM,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host } from '@stencil/core';\n\n/**\n * Affinda logo component\n */\n@Component({\n tag: 'af-logo',\n styleUrl: 'af-logo.css',\n shadow: true\n})\nexport class AfLogo {\n render() {\n return (\n <Host>\n <svg \n class=\"logo-svg\" \n viewBox=\"0 0 9290 1432\" \n aria-label=\"Affinda\"\n role=\"img\"\n >\n <path \n fill=\"currentColor\" \n d=\"M1691.17,452.11c-107.93-107.48-250.13-166.09-401.3-163.79h-739.51l-148.18,237.98h892.96c86.83,0,168.39,33.64,230.09,95.09,63.28,63.04,98.26,147.32,98.26,237.45,0,185.03-149.41,335.36-332.92,335.36H385.66c-82.44,0-149.59-67.64-149.59-150.68s67.32-151.75,149.41-154.23h810.17l152.93-237.98H381.44C171.21,656.62,0,832.45,0,1043.52s172.97,388.48,385.66,388.48h904.91c313.76,0,569.17-257.28,569.17-573.34,0-154.22-59.76-298.53-168.4-406.72l-.17.18Z\"\n />\n <path \n fill=\"currentColor\" \n d=\"M3265.12,353.81c-21.8-16.16-44.47-30.56-68.02-42.85-75.76-39.69-161-59.89-253.45-59.89-159.6,0-297.92,58.13-411.29,172.82-113.02,114.33-170.49,253.96-170.49,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.29,173.52,409.35,173.52,89.47,0,173.31-18.97,249.06-56.38,26.19-12.99,51.68-28.1,76.11-45.49v89.05h268.39V276.36h-268.39v77.45ZM3232.07,1013.47c-27.24,48.65-65.38,86.24-116.35,114.87-51.85,29.15-105.11,43.38-162.58,43.38s-107.92-14.05-157.31-43.21c-49.57-28.98-87.88-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.18-51.99,67.32-91.15,116.36-119.6,49.21-28.63,101.41-42.5,159.94-42.5,90.87,0,165.04,30.56,226.73,93.61,62.23,63.4,92.46,140.68,92.46,236.22,0,63.05-13.54,117.67-41.13,167.02l-.18.35Z\"\n />\n <path fill=\"currentColor\" d=\"M5569.92,278.96h-269.66v1143.74h269.66V278.96Z\"/>\n <path \n fill=\"currentColor\" \n d=\"M6504.78,328.74c-68.7-45.4-148.11-68.37-235.78-68.37s-163.57,19.96-235.61,59.36c-21.61,11.84-42.69,25.44-63.07,40.81v-89.22h-270.22v1151.2h270.22v-436.03c0-154.94,8.78-223.14,15.81-252.11,15.64-61.13,47.44-110.95,96.81-152.65,47.96-40.28,100.49-59.89,160.58-59.89,51.13,0,89.96,11.13,118.95,34.28,28.81,22.79,48.14,58.13,59.56,109.18,4.56,18.37,12.12,70.14,12.12,211.83v545.57h270.21v-583.02c0-146.29-15.28-253.17-46.56-326.67-32.67-76.85-84.33-138.69-153.2-184.27h.18Z\"\n />\n <path \n fill=\"currentColor\" \n d=\"M7728.49,355.19c-21.79-16.14-44.46-30.52-68.02-42.8-75.75-39.64-161-59.81-253.45-59.81-159.59,0-297.92,58.06-411.28,172.6-113.02,114.19-170.49,253.63-170.49,414.48s56.77,304.68,168.73,419.04c112.49,115.07,250.29,173.3,409.35,173.3,89.47,0,173.3-18.94,249.06-56.3,26.19-12.98,51.67-28.07,76.1-45.43v90.68h268.39V0h-268.39v355.37-.17ZM7695.45,1014.01c-27.24,48.59-65.38,86.13-116.36,114.72-51.85,29.11-104.93,43.32-162.58,43.32s-107.92-14.03-157.31-43.15c-49.56-28.94-87.88-68.76-117.58-121.38-29.88-52.97-44.29-106.64-44.29-164.18s14.41-111.73,43.94-164c29.17-51.92,67.32-91.03,116.35-119.45,49.22-28.59,101.42-42.45,159.95-42.45,90.87,0,165.04,30.52,226.73,93.49,62.22,63.32,92.45,140.5,92.45,235.92,0,62.97-13.53,117.52-41.12,166.81l-.18.35Z\"\n />\n <path \n fill=\"currentColor\" \n d=\"M9021.01,277.76v76.05c-21.79-16.16-44.47-30.56-68.02-42.85-75.75-39.69-161-59.89-253.45-59.89-159.59,0-297.92,58.13-411.29,172.82-113.01,114.33-170.48,253.96-170.48,415.01s56.77,304.89,168.73,419.58c112.49,115.21,250.28,173.52,409.35,173.52,89.46,0,173.3-18.97,249.06-56.38,26.19-12.99,51.67-28.1,76.1-45.49v89.05h268.39V277.76h-268.39ZM8987.97,1013.47c-27.25,48.65-65.39,86.24-116.36,114.87-51.85,29.15-105.1,43.38-162.58,43.38s-107.92-14.05-157.3-43.21c-49.57-28.98-87.89-68.85-117.59-121.53-29.88-53.04-44.29-106.79-44.29-164.39s14.41-111.88,43.94-164.21c29.17-51.99,67.31-91.15,116.35-119.6,49.22-28.63,101.42-42.5,159.95-42.5,90.87,0,165.04,30.56,226.73,93.61,62.22,63.4,92.45,140.68,92.45,236.22,0,63.05-13.53,117.67-41.13,167.02l-.17.35Z\"\n />\n <path fill=\"currentColor\" d=\"M3927.32,519.82c0-140.11,112.99-241.01,251.96-241.01h302.69V0h-302.69c-284.39,0-515.59,233.28-515.59,519.82v902.88h263.81v-445.28h431.9v-265.98h-431.9v-191.62h-.18Z\"/>\n <path fill=\"currentColor\" d=\"M4745.61,519.82c0-140.11,112.99-241.01,251.95-241.01h302.7V0h-302.7c-284.38,0-515.59,233.28-515.59,519.82v902.88h263.82v-445.28h431.89v-265.98h-431.89v-191.62h-.18Z\"/>\n </svg>\n </Host>\n );\n }\n}\n"]}

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

@@ -19,3 +19,4 @@ export class AfLogoWell {
         };
     }
 }
+//# sourceMappingURL=af-logo-well.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-logo-well.js","sourceRoot":"","sources":["../../../src/components/af-logo-well/af-logo-well.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;GAEG;AAMH,MAAM,OAAO,UAAU;IACrB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,WAAW;gBACpB,8DAAa,CACT,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host } from '@stencil/core';\n\n/**\n * A rounded container for displaying client logos\n */\n@Component({\n tag: 'af-logo-well',\n styleUrl: 'af-logo-well.css',\n shadow: true,\n})\nexport class AfLogoWell {\n render() {\n return (\n <Host>\n <div class=\"logo-well\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n\n"]}

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

@@ -182,3 +182,4 @@ export class AfNavAccordion {
             }];
     }
 }
+//# sourceMappingURL=af-nav-accordion.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-nav-accordion.js","sourceRoot":"","sources":["../../../src/components/af-nav-accordion/af-nav-accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Host, Event, EventEmitter, Element, State, Listen } from '@stencil/core';\n\n/**\n * Navigation-styled accordion for mobile menu patterns.\n * A wrapper around af-accordion with navigation-specific styling.\n * \n * @slot - Place af-nav-accordion-item components here\n */\n@Component({\n tag: 'af-nav-accordion',\n styleUrl: 'af-nav-accordion.css',\n shadow: false,\n scoped: true,\n})\nexport class AfNavAccordion {\n @Element() el!: HTMLElement;\n\n /**\n * Behavior mode for the accordion.\n * - `independent`: Multiple items can be open simultaneously\n * - `exclusive`: Only one item can be open at a time (typical for mobile nav)\n */\n @Prop() mode: 'independent' | 'exclusive' = 'exclusive';\n\n /**\n * Breakpoint for styling\n * - `desktop`: Desktop-specific styles\n * - `mobile`: Mobile-specific styles (default for nav menus)\n */\n @Prop({ reflect: true }) breakpoint: 'desktop' | 'mobile' = 'mobile';\n\n /**\n * Currently open item ID(s)\n */\n @Prop({ mutable: true }) value?: string | string[];\n\n /**\n * Emitted when the open state of items changes\n */\n @Event({ eventName: 'af-nav-accordion-change' }) navAccordionChange!: EventEmitter<{ value: string | string[] | null }>;\n\n @State() internalValue: string[] = [];\n\n componentWillLoad() {\n this.internalValue = this.normalizeValue(this.value);\n }\n\n /**\n * Listen for toggle events from child items\n */\n @Listen('af-nav-accordion-item-toggle')\n handleItemToggle(event: CustomEvent<{ itemId: string; open: boolean }>) {\n event.stopPropagation();\n const { itemId, open } = event.detail;\n\n let newValue: string[];\n\n if (this.mode === 'exclusive') {\n newValue = open ? [itemId] : [];\n } else {\n if (open) {\n newValue = [...this.internalValue, itemId];\n } else {\n newValue = this.internalValue.filter(id => id !== itemId);\n }\n }\n\n this.internalValue = newValue;\n this.syncItems();\n\n const emitValue = this.mode === 'exclusive' \n ? (newValue.length > 0 ? newValue[0] : null)\n : newValue;\n this.navAccordionChange.emit({ value: emitValue });\n }\n\n private normalizeValue(value: string | string[] | undefined): string[] {\n if (value === undefined || value === null) {\n return [];\n }\n if (Array.isArray(value)) {\n return this.mode === 'exclusive' ? value.slice(0, 1) : value;\n }\n return [value];\n }\n\n private syncItems() {\n const items = this.el.querySelectorAll('af-nav-accordion-item');\n items.forEach((element) => {\n const item = element as HTMLElement & { itemId?: string; open?: boolean };\n if (item.itemId) {\n item.open = this.internalValue.includes(item.itemId);\n }\n });\n }\n\n componentDidLoad() {\n this.syncItems();\n }\n\n render() {\n return (\n <Host class={{ [`breakpoint-${this.breakpoint}`]: true, [`mode-${this.mode}`]: true }}>\n <div class=\"nav-accordion\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n\n"]}

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

@@ -277,3 +277,4 @@ export class AfNavAccordionItem {
             }];
     }
 }
+//# sourceMappingURL=af-nav-accordion-item.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-nav-accordion-item.js","sourceRoot":"","sources":["../../../src/components/af-nav-accordion-item/af-nav-accordion-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Host, Event, EventEmitter, Element, State, Watch, Method } from '@stencil/core';\n\n/**\n * Navigation accordion item with NavItem-styled trigger.\n * Combines navigation item styling with accordion collapse behavior.\n * \n * @slot trigger - Custom trigger content (optional - uses label if not provided)\n * @slot - The collapsible content (typically NavMenuNest or NavMenu components)\n */\n@Component({\n tag: 'af-nav-accordion-item',\n styleUrl: 'af-nav-accordion-item.css',\n shadow: false,\n scoped: true,\n})\nexport class AfNavAccordionItem {\n @Element() el!: HTMLElement;\n\n /**\n * Unique identifier for this accordion item\n */\n @Prop({ reflect: true }) itemId!: string;\n\n /**\n * Label text for the navigation item trigger\n */\n @Prop() label?: string;\n\n /**\n * Whether this item is currently expanded\n */\n @Prop({ reflect: true, mutable: true }) open: boolean = false;\n\n /**\n * Whether this item is disabled\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * Optional href - if provided, clicking navigates instead of expanding\n * (chevron area would still toggle expansion if both behaviors needed)\n */\n @Prop() href?: string;\n\n /**\n * Breakpoint for styling\n */\n @Prop({ reflect: true }) breakpoint: 'desktop' | 'mobile' = 'mobile';\n\n /**\n * Emitted when the accordion item is toggled\n */\n @Event({ eventName: 'af-nav-accordion-item-toggle' }) navAccordionItemToggle!: EventEmitter<{ itemId: string; open: boolean }>;\n\n @State() contentHeight: number = 0;\n @State() hasTriggerSlot: boolean = false;\n @State() hasContent: boolean = false;\n\n private contentRef?: HTMLElement;\n\n @Watch('open')\n handleOpenChange(newValue: boolean) {\n if (newValue) {\n this.measureContent();\n }\n }\n\n /**\n * Detect whether the host has any default-slot children — i.e. whether\n * this item expands to reveal a sub-menu, or is just a simple link.\n * We check in componentWillLoad (before render) because after render\n * Stencil has appended its own output to the host and this.el.children\n * would include that.\n */\n componentWillLoad() {\n this.hasContent = Array.from(this.el.children).some(\n (child) => !(child as HTMLElement).hasAttribute('slot'),\n );\n }\n\n componentDidLoad() {\n if (this.open) {\n this.measureContent();\n }\n }\n\n /**\n * Programmatically toggle the accordion item\n */\n @Method()\n async toggle() {\n if (!this.disabled && !this.href) {\n this.open = !this.open;\n this.navAccordionItemToggle.emit({ itemId: this.itemId, open: this.open });\n }\n }\n\n private measureContent() {\n if (this.contentRef) {\n this.contentHeight = this.contentRef.scrollHeight;\n }\n }\n\n private handleTriggerClick = (event: MouseEvent) => {\n // If it's a link, let it navigate (unless they clicked the chevron specifically)\n if (this.href) {\n return;\n }\n event.preventDefault();\n this.toggle();\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if ((event.key === 'Enter' || event.key === ' ') && !this.href) {\n event.preventDefault();\n this.toggle();\n }\n };\n\n private handleSlotChange = (event: Event) => {\n const slot = event.target as HTMLSlotElement;\n this.hasTriggerSlot = slot.assignedNodes().length > 0;\n };\n\n render() {\n const contentStyle = {\n maxHeight: this.open ? `${this.contentHeight}px` : '0px'\n };\n\n // Only render the chevron toggle when this item actually has\n // sub-content to expand. A plain href item with no children is a\n // direct link and shouldn't show a disclosure affordance.\n const hasDropdownContent = this.hasContent;\n\n return (\n <Host \n class={{ \n 'is-open': this.open, \n 'is-disabled': this.disabled,\n [`breakpoint-${this.breakpoint}`]: true\n }}\n >\n <div class=\"nav-accordion-item\">\n {/* Trigger */}\n {this.href ? (\n <a\n href={this.href}\n class=\"trigger\"\n aria-expanded={this.open ? 'true' : 'false'}\n aria-controls={`content-${this.itemId}`}\n >\n <div class=\"trigger-content\">\n <slot name=\"trigger\" onSlotchange={this.handleSlotChange}>\n <span class=\"label\">{this.label}</span>\n </slot>\n </div>\n {hasDropdownContent && (\n <button \n class=\"chevron-button\"\n onClick={(e) => { e.preventDefault(); e.stopPropagation(); this.toggle(); }}\n aria-label={this.open ? 'Collapse' : 'Expand'}\n type=\"button\"\n >\n <div class={{ 'chevron': true, 'is-open': this.open }}>\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M6 9l6 6 6-6\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n </button>\n )}\n </a>\n ) : (\n <button\n class=\"trigger\"\n onClick={this.handleTriggerClick}\n onKeyDown={this.handleKeyDown}\n aria-expanded={this.open ? 'true' : 'false'}\n aria-controls={`content-${this.itemId}`}\n disabled={this.disabled}\n type=\"button\"\n >\n <div class=\"trigger-content\">\n <slot name=\"trigger\" onSlotchange={this.handleSlotChange}>\n <span class=\"label\">{this.label}</span>\n </slot>\n </div>\n {hasDropdownContent && (\n <div class={{ 'chevron': true, 'is-open': this.open }}>\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M6 9l6 6 6-6\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n )}\n </button>\n )}\n\n {/* Collapsible content */}\n <div\n id={`content-${this.itemId}`}\n class=\"content-wrapper\"\n style={contentStyle}\n aria-hidden={!this.open ? 'true' : 'false'}\n >\n <div class=\"content\" ref={(el) => (this.contentRef = el)}>\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n\n"]}

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

@@ -135,3 +135,4 @@ export class AfNavCard {
         };
     }
 }
+//# sourceMappingURL=af-nav-card.js.map

package/dist/collection/components/af-nav-card/af-nav-card.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-nav-card.js","sourceRoot":"","sources":["../../../src/components/af-nav-card/af-nav-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEhE;;;;;;;;;;;GAWG;AAOH,MAAM,OAAO,SAAS;IANtB;QAsBE;;WAEG;QACK,aAAQ,GAAW,EAAE,CAAC;QAErB,cAAS,GAAY,KAAK,CAAC;QAE5B,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;KAuCH;IArCC,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,UAAU,EAAE,IAAI;YAChB,YAAY,EAAE,IAAI,CAAC,SAAS;SAC7B,CAAC;QAEF,MAAM,OAAO,GAAG,CACd,WACE,KAAK,EAAE,OAAO,EACd,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,YAAY,EAAE,IAAI,CAAC,gBAAgB;YAEnC,WAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,QAAQ,IAAI,CAChB,WAAK,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAC,YAAY,GAAG,CACnE,CACG;YACN,WAAK,KAAK,EAAC,SAAS,IACjB,IAAI,CAAC,OAAO,IAAI,CACf,UAAI,KAAK,EAAC,SAAS,IAAE,IAAI,CAAC,OAAO,CAAM,CACxC,CACG,CACF,CACP,CAAC;QAEF,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,OAAO,CACL,EAAC,IAAI;gBACH,SAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,WAAW,IAClC,OAAO,CACN,CACC,CACR,CAAC;QACJ,CAAC;QAED,OAAO,EAAC,IAAI,QAAE,OAAO,CAAQ,CAAC;IAChC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host, State } from '@stencil/core';\n\n/**\n * A navigation card component for featured article content in mega-menu dropdowns.\n * Displays an image with a gradient overlay and headline text.\n * \n * **Usage:**\n * - Place in the `sidebar` slot of NavMenuNest\n * - Provide imageSrc, heading, and href props\n * \n * **Hover behavior:**\n * - Slight scale effect (1.02)\n * - Headline underline\n */\n@Component({\n tag: 'af-nav-card',\n styleUrl: 'af-nav-card.css',\n shadow: false,\n scoped: true,\n})\nexport class AfNavCard {\n /**\n * The headline text displayed over the image\n */\n @Prop() heading?: string;\n\n /**\n * URL to navigate to when clicked\n */\n @Prop() href?: string;\n\n /**\n * Image source URL for the background\n */\n @Prop() imageSrc?: string;\n\n /**\n * Alternative text for the image\n */\n @Prop() imageAlt: string = '';\n\n @State() isHovered: boolean = false;\n\n private handleMouseEnter = () => {\n this.isHovered = true;\n };\n\n private handleMouseLeave = () => {\n this.isHovered = false;\n };\n\n render() {\n const classes = {\n 'nav-card': true,\n 'is-hovered': this.isHovered\n };\n\n const content = (\n <div\n class={classes}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n >\n <div class=\"image-container\">\n {this.imageSrc && (\n <img src={this.imageSrc} alt={this.imageAlt} class=\"card-image\" />\n )}\n </div>\n <div class=\"overlay\">\n {this.heading && (\n <h3 class=\"heading\">{this.heading}</h3>\n )}\n </div>\n </div>\n );\n\n if (this.href) {\n return (\n <Host>\n <a href={this.href} class=\"card-link\">\n {content}\n </a>\n </Host>\n );\n }\n\n return <Host>{content}</Host>;\n }\n}\n"]}

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

@@ -185,3 +185,4 @@ export class AfNavItem {
     }
     static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=af-nav-item.js.map

package/dist/collection/components/af-nav-item/af-nav-item.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-nav-item.js","sourceRoot":"","sources":["../../../src/components/af-nav-item/af-nav-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAElE;;;;;;;;;;GAUG;AAOH,MAAM,OAAO,SAAS;IANtB;QASE;;;;WAIG;QACK,cAAS,GAA4B,SAAS,CAAC;QAEvD;;;;WAIG;QACK,YAAO,GAAgB,IAAI,CAAC;QAEpC;;;;WAIG;QACsB,eAAU,GAAyB,SAAS,CAAC;QAOtE;;WAEG;QACK,WAAM,GAAY,KAAK,CAAC;QAEhC;;;;WAIG;QACK,yBAAoB,GAAG,CAAC,KAAoB,EAAE,EAAE;YACtD,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,UAAU,EAAE,CAAC;gBAC3E,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC;YAClB,CAAC;QACH,CAAC,CAAC;KAgDH;IA9CC,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,UAAU,EAAE,IAAI;YAChB,CAAC,aAAa,IAAI,CAAC,SAAS,EAAE,CAAC,EAAE,IAAI;YACrC,CAAC,WAAW,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI;YACjC,CAAC,cAAc,IAAI,CAAC,UAAU,EAAE,CAAC,EAAE,IAAI;YACvC,QAAQ,EAAE,IAAI,CAAC,MAAM;SACtB,CAAC;QAEF,MAAM,YAAY,GAAG;YACnB,YAAM,IAAI,EAAC,WAAW,GAAQ;YAC9B,WAAK,KAAK,EAAC,iBAAiB;gBAC1B,eAAa,CACT;YACN,YAAM,IAAI,EAAC,YAAY,GAAQ;SAChC,CAAC;QAEF,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,OAAO,CACL,EAAC,IAAI;gBACH,SAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,UAAU;oBAClC,WAAK,KAAK,EAAE,OAAO,IAAG,YAAY,CAAO,CACvC,CACC,CACR,CAAC;QACJ,CAAC;QAED,MAAM,iBAAiB,GAAG,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC;QAChE,IAAI,iBAAiB,EAAE,CAAC;YACtB,OAAO,CACL,EAAC,IAAI;gBACH,WACE,KAAK,EAAE,OAAO,EACd,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,mBACG,MAAM,EACpB,SAAS,EAAE,IAAI,CAAC,oBAAoB,IAEnC,YAAY,CACT,CACD,CACR,CAAC;QACJ,CAAC;QAED,OAAO,EAAC,IAAI,QAAE,WAAK,KAAK,EAAE,OAAO,IAAG,YAAY,CAAO,CAAQ,CAAC;IAClE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, h, Prop, Host } from '@stencil/core';\n\n/**\n * A generic navigation item component that can be used in navigation bars, menus, and sidebars.\n * Supports multiple hierarchy levels, variants, and states (active, hover).\n *\n * **Dropdown trigger a11y:** when the host carries a `data-dropdown=\"id\"`\n * attribute and has no `href`, the inner wrapper is promoted to\n * `role=\"button\"` with `tabindex=\"0\"` and keyboard activation (Enter/Space),\n * so keyboard users can open the matching dropdown panel just like a\n * pointer click. The companion `af-navbar` keeps `aria-expanded` on the\n * host in sync with the active dropdown.\n */\n@Component({\n tag: 'af-nav-item',\n styleUrl: 'af-nav-item.css',\n shadow: false,\n scoped: true,\n})\nexport class AfNavItem {\n @Element() el!: HTMLElement;\n\n /**\n * Visual hierarchy level of the navigation item\n * - 'primary': Bold, main navigation (larger text, prominent styling)\n * - 'secondary': Lighter, sub-navigation (smaller text, subtle styling)\n */\n @Prop() hierarchy: 'primary' | 'secondary' = 'primary';\n\n /**\n * Visual variant within the hierarchy level\n * - '01': Darker/more prominent styling\n * - '02': Lighter/more subtle styling\n */\n @Prop() variant: '01' | '02' = '01';\n\n /**\n * Breakpoint variant for responsive styling\n * - 'desktop': Desktop-specific styles\n * - 'mobile': Mobile-specific styles (larger text, different spacing)\n */\n @Prop({ reflect: true }) breakpoint: 'desktop' | 'mobile' = 'desktop';\n\n /**\n * URL to navigate to when clicked\n */\n @Prop() href?: string;\n\n /**\n * Whether this nav item is currently active/selected\n */\n @Prop() active: boolean = false;\n\n /**\n * Promote Enter and Space on a focused trigger into a synthetic click\n * so the surrounding af-navbar (which listens on click) treats the\n * keyboard activation identically to a pointer click.\n */\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Enter' || event.key === ' ' || event.key === 'Spacebar') {\n event.preventDefault();\n this.el.click();\n }\n };\n\n render() {\n const classes = {\n 'nav-item': true,\n [`hierarchy-${this.hierarchy}`]: true,\n [`variant-${this.variant}`]: true,\n [`breakpoint-${this.breakpoint}`]: true,\n 'active': this.active,\n };\n\n const innerContent = [\n <slot name=\"icon-left\"></slot>,\n <div class=\"label-container\">\n <slot></slot>\n </div>,\n <slot name=\"icon-right\"></slot>,\n ];\n\n if (this.href) {\n return (\n <Host>\n <a href={this.href} class=\"nav-link\">\n <div class={classes}>{innerContent}</div>\n </a>\n </Host>\n );\n }\n\n const isDropdownTrigger = this.el.hasAttribute('data-dropdown');\n if (isDropdownTrigger) {\n return (\n <Host>\n <div\n class={classes}\n role=\"button\"\n tabindex={0}\n aria-haspopup=\"menu\"\n onKeyDown={this.handleTriggerKeyDown}\n >\n {innerContent}\n </div>\n </Host>\n );\n }\n\n return <Host>{<div class={classes}>{innerContent}</div>}</Host>;\n }\n}\n"]}

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

@@ -128,3 +128,4 @@ export class AfNavMenu {
         };
     }
 }
+//# sourceMappingURL=af-nav-menu.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-nav-menu.js","sourceRoot":"","sources":["../../../src/components/af-nav-menu/af-nav-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;GAGG;AAOH,MAAM,OAAO,SAAS;IANtB;QAYE;;;;WAIG;QACK,eAAU,GAAyB,SAAS,CAAC;QAErD;;;;WAIG;QACK,eAAU,GAAY,KAAK,CAAC;QAEpC;;;WAGG;QACsB,cAAS,GAAY,KAAK,CAAC;KAyBrD;IAvBC,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,UAAU,EAAE,IAAI;YAChB,CAAC,cAAc,IAAI,CAAC,UAAU,EAAE,CAAC,EAAE,IAAI;YACvC,YAAY,EAAE,IAAI,CAAC,UAAU;YAC7B,YAAY,EAAE,IAAI,CAAC,SAAS;SAC7B,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,OAAO;gBAChB,IAAI,CAAC,OAAO,IAAI,CACf,4DAAK,KAAK,EAAC,aAAa;oBACtB,2DAAI,KAAK,EAAC,cAAc,IAAE,IAAI,CAAC,OAAO,CAAM,CACxC,CACP;gBACD,4DAAK,KAAK,EAAC,YAAY;oBACrB,8DAAa,CACT,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host } from '@stencil/core';\n\n/**\n * A grouped navigation menu component with a heading.\n * Used in mega-menu dropdowns to group related navigation items.\n */\n@Component({\n tag: 'af-nav-menu',\n styleUrl: 'af-nav-menu.css',\n shadow: false,\n scoped: true,\n})\nexport class AfNavMenu {\n /**\n * The heading text displayed above the navigation items\n */\n @Prop() heading?: string;\n\n /**\n * Breakpoint variant for responsive styling\n * - 'desktop': Desktop-specific styles (right border, horizontal padding)\n * - 'mobile': Mobile-specific styles (bottom border, vertical layout)\n */\n @Prop() breakpoint: 'desktop' | 'mobile' = 'desktop';\n\n /**\n * Whether to show the right border separator.\n * When used inside NavMenuNest, borders are controlled by the parent.\n * Set to true only when using NavMenu standalone.\n */\n @Prop() showBorder: boolean = false;\n\n /**\n * Whether to display as a card with background color and rounded corners.\n * Used for highlighted sidebar menus (e.g., solutions-alt variant).\n */\n @Prop({ reflect: true }) cardStyle: boolean = false;\n\n render() {\n const classes = {\n 'nav-menu': true,\n [`breakpoint-${this.breakpoint}`]: true,\n 'has-border': this.showBorder,\n 'card-style': this.cardStyle\n };\n\n return (\n <Host>\n <div class={classes}>\n {this.heading && (\n <div class=\"menu-header\">\n <h3 class=\"menu-heading\">{this.heading}</h3>\n </div>\n )}\n <div class=\"menu-items\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n\n"]}

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

@@ -127,3 +127,4 @@ export class AfNavMenuNest {
         };
     }
 }
+//# sourceMappingURL=af-nav-menu-nest.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-nav-menu-nest.js","sourceRoot":"","sources":["../../../src/components/af-nav-menu-nest/af-nav-menu-nest.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;;;;;;;;;;;;;;;;GAkBG;AAOH,MAAM,OAAO,aAAa;IAN1B;QAOE;;;;;;WAMG;QACK,SAAI,GAA4D,WAAW,CAAC;QAEpF;;;;WAIG;QACK,eAAU,GAAyB,SAAS,CAAC;QAErD;;;;WAIG;QACsB,sBAAiB,GAAY,IAAI,CAAC;KAuB5D;IArBC,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,eAAe,EAAE,IAAI;YACrB,aAAa,EAAE,IAAI;YACnB,CAAC,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI;YAC3B,CAAC,cAAc,IAAI,CAAC,UAAU,EAAE,CAAC,EAAE,IAAI;SACxC,CAAC;QAEF,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,OAAO;gBACjB,4DAAK,KAAK,EAAC,cAAc;oBACvB,8DAAa,CACT;gBACN,4DAAK,KAAK,EAAC,cAAc;oBACvB,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host } from '@stencil/core';\n\n/**\n * A mega-menu dropdown panel component.\n * Acts as a container for NavMenu columns and optionally a sidebar.\n * Used as the dropdown content for navbar items.\n * \n * **Slots:**\n * - default: Place NavMenu components here - they will be displayed as columns\n * - sidebar: Optional sidebar content (NavMenu, NavCard, or any content)\n * \n * **Example:**\n * ```html\n * <af-nav-menu-nest type=\"solutions\" breakpoint=\"desktop\">\n * <af-nav-menu heading=\"Industries\">...</af-nav-menu>\n * <af-nav-menu heading=\"Use Cases\">...</af-nav-menu>\n * <af-nav-menu heading=\"Documents\">...</af-nav-menu>\n * <af-nav-menu slot=\"sidebar\" heading=\"Resume Parser\">...</af-nav-menu>\n * </af-nav-menu-nest>\n * ```\n */\n@Component({\n tag: 'af-nav-menu-nest',\n styleUrl: 'af-nav-menu-nest.css',\n shadow: false,\n scoped: true,\n})\nexport class AfNavMenuNest {\n /**\n * The type/variant of the mega-menu\n * - 'solutions': Multi-column layout (3 columns + sidebar)\n * - 'solutions-alt': Alternative solutions layout\n * - 'resources': Multi-column layout with optional featured card\n * - 'pricing': Simpler layout without sidebar\n */\n @Prop() type: 'solutions' | 'solutions-alt' | 'resources' | 'pricing' = 'solutions';\n\n /**\n * Breakpoint variant for responsive styling\n * - 'desktop': Horizontal multi-column layout\n * - 'mobile': Vertical stacked layout\n */\n @Prop() breakpoint: 'desktop' | 'mobile' = 'desktop';\n\n /**\n * Whether to show the heavier border on the last column (before sidebar).\n * Set to `true` when sidebar has content, `false` when no sidebar.\n * When `false`, the last column has no border.\n */\n @Prop({ reflect: true }) showSidebarBorder: boolean = true;\n\n render() {\n const classes = {\n 'nav-menu-nest': true,\n 'theme-white': true,\n [`type-${this.type}`]: true,\n [`breakpoint-${this.breakpoint}`]: true\n };\n\n return (\n <Host>\n <div class={classes}>\n <div class=\"menu-columns\">\n <slot></slot>\n </div>\n <div class=\"menu-sidebar\">\n <slot name=\"sidebar\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

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

@@ -296,3 +296,4 @@ export class AfNavbar {
             }];
     }
 }
+//# sourceMappingURL=af-navbar.js.map

package/dist/collection/components/af-navbar/af-navbar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-navbar.js","sourceRoot":"","sources":["../../../src/components/af-navbar/af-navbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAEjF;;;;;;;;;;;;;;;;;;;GAmBG;AAOH,MAAM,OAAO,QAAQ;IANrB;QASW,mBAAc,GAAY,KAAK,CAAC;QAEzC,iEAAiE;QACxD,mBAAc,GAAkB,IAAI,CAAC;QAE9C,qFAAqF;QAC7E,oBAAe,GAAY,IAAI,CAAC;QAKxC,mFAAmF;QAC1D,gBAAW,GAAY,KAAK,CAAC;QAE9C,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,cAAc,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC;YAC3C,oDAAoD;YACpD,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC7B,CAAC,CAAC;QAEF;;WAEG;QACK,iBAAY,GAAG,CAAC,UAAkB,EAAE,EAAE;YAC5C,IAAI,CAAC,cAAc,GAAG,UAAU,CAAC;QACnC,CAAC,CAAC;QAEF;;WAEG;QACK,kBAAa,GAAG,GAAG,EAAE;YAC3B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC7B,CAAC,CAAC;QAEF;;WAEG;QACK,mBAAc,GAAG,CAAC,UAAkB,EAAE,EAAE;YAC9C,IAAI,IAAI,CAAC,cAAc,KAAK,UAAU,EAAE,CAAC;gBACvC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;YAC7B,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,cAAc,GAAG,UAAU,CAAC;YACnC,CAAC;QACH,CAAC,CAAC;KAqNH;IAzMC;;;OAGG;IAEH,kBAAkB,CAAC,KAAiB;QAClC,MAAM,MAAM,GAAG,KAAK,CAAC,MAA4B,CAAC;QAClD,MAAM,OAAO,GAAG,MAAM,EAAE,OAAO,EAAE,CAAC,iBAAiB,CAAuB,CAAC;QAC3E,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC;YAAE,OAAO;QACnD,MAAM,EAAE,GAAG,OAAO,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC;QACjD,IAAI,CAAC,EAAE;YAAE,OAAO;QAChB,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,iBAAiB,GAAG,OAAO,CAAC;QACjC,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC,CAAC;IAC1B,CAAC;IAED;;;OAGG;IAEH,WAAW,CAAC,KAAiB;QAC3B,MAAM,MAAM,GAAG,KAAK,CAAC,MAA4B,CAAC;QAClD,MAAM,OAAO,GAAG,MAAM,EAAE,OAAO,EAAE,CAAC,iBAAiB,CAAuB,CAAC;QAC3E,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC;YAAE,OAAO;QACnD,MAAM,EAAE,GAAG,OAAO,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC;QACjD,IAAI,CAAC,EAAE,IAAI,IAAI,CAAC,cAAc,KAAK,EAAE,EAAE,CAAC;YACtC,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAC5B,OAAO;QACT,CAAC;QACD,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,iBAAiB,GAAG,OAAO,CAAC;QACjC,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;IACxB,CAAC;IAED;;;OAGG;IAEH,eAAe;QACb,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAGD,eAAe;QACb,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAC9B,CAAC;IAEO,aAAa;QACnB,+DAA+D;QAC/D,8DAA8D;QAC9D,4DAA4D;QAC5D,gEAAgE;QAChE,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;YACvC,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;QAC9B,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC;IAEO,oBAAoB;QAC1B,IAAI,IAAI,CAAC,UAAU,KAAK,SAAS,EAAE,CAAC;YAClC,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YAC9B,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;QAC9B,CAAC;IACH,CAAC;IAED;;OAEG;IAEH,mBAAmB,CAAC,KAAiB;QACnC,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;QAClC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,aAAa,EAAE,CAAC;QACvB,CAAC;IACH,CAAC;IAED;;;;;OAKG;IACH,gBAAgB;QACd,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAED,kBAAkB;QAChB,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAEO,iBAAiB;QACvB,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAc,YAAY,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;YACpE,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC;gBAAE,OAAO;YACrC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC,cAAc,CAAC;QACxE,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAc,iBAAiB,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YAC3E,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC;gBAAE,OAAO;YACvC,MAAM,MAAM,GAAG,OAAO,CAAC,YAAY,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC,cAAc,CAAC;YAC7E,IAAI,MAAM;gBAAE,OAAO,CAAC,YAAY,CAAC,aAAa,EAAE,EAAE,CAAC,CAAC;;gBAC/C,OAAO,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;YAC5C,OAAO,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;QACnE,CAAC,CAAC,CAAC;IACL,CAAC;IAED;;;;OAIG;IAEH,aAAa,CAAC,KAAoB;QAChC,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,IAAI,CAAC,cAAc,KAAK,IAAI,EAAE,CAAC;YAC3D,MAAM,OAAO,GAAG,IAAI,CAAC,iBAAiB,CAAC;YACvC,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC;QACrB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,KAAK,IAAI,CAAC;QAEjD,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,EAAE,mBAAmB,EAAE,WAAW,EAAE;YAE/C,4DAAK,KAAK,EAAE,gBAAgB,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,GAAQ;YAE9E,4DAAK,KAAK,EAAC,kBAAkB;gBAC3B,4DAAK,KAAK,EAAC,oBAAoB;oBAE7B,4DAAK,KAAK,EAAC,aAAa;wBACtB,4DAAK,KAAK,EAAC,MAAM;4BACf,6DAAM,IAAI,EAAC,MAAM,IAEd,IAAI,CAAC,eAAe,IAAI,iEAAmB,CACvC,CACH;wBAGN,+DACE,KAAK,EAAC,oBAAoB,EAC1B,OAAO,EAAE,IAAI,CAAC,gBAAgB,gBACnB,wBAAwB,mBACpB,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,IAEpD,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CACrB,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc;4BAC/E,YAAM,CAAC,EAAC,sBAAsB,kBAAc,GAAG,oBAAgB,OAAO,qBAAiB,OAAO,GAAE,CAC5F,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc;4BAC/E,YAAM,CAAC,EAAC,yBAAyB,kBAAc,GAAG,oBAAgB,OAAO,qBAAiB,OAAO,GAAE,CAC/F,CACP,CACM;wBAET,4DAAK,KAAK,EAAE,aAAa,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE;4BACjE,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,CACF;oBAGN,4DAAK,KAAK,EAAE,gBAAgB,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE;wBACpE,4DAAK,KAAK,EAAC,aAAa;4BACtB,6DAAM,IAAI,EAAC,KAAK,GAAQ,CACpB;wBACN,4DAAK,KAAK,EAAC,YAAY;4BACrB,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACF;gBAGN,4DAAK,KAAK,EAAE,sBAAsB,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;oBAC9D,4DAAK,KAAK,EAAC,4BAA4B;wBACrC,6DAAM,IAAI,EAAC,WAAW,GAAQ,CAC1B,CACF,CACF;YAGN,4DAAK,KAAK,EAAE,iCAAiC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;gBAEjF,4DAAK,KAAK,EAAC,yBAAyB;oBAClC,6DAAM,IAAI,EAAC,eAAe;wBACxB,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACtB,CACH;gBAGN,4DAAK,KAAK,EAAC,qBAAqB;oBAC9B,6DAAM,IAAI,EAAC,aAAa,GAAQ,CAC5B,CACF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, State, h, Host, Prop, Element, Listen } from '@stencil/core';\n\n/**\n * A full-width navigation bar component that provides the main site navigation.\n * Features a pill-shaped container with logo, navigation links, and action buttons.\n * Includes mobile hamburger menu and support for mega-menu dropdowns.\n * \n * The logo slot can be used to provide a custom logo. If no logo is provided,\n * the default Affinda logo will be displayed.\n * \n * **Slots:**\n * - `logo` - Logo area (defaults to Affinda logo if empty)\n * - `start` - Primary navigation links (left side, desktop)\n * - `end` - Secondary/utility links (right side)\n * - `button` - Call-to-action button\n * - `dropdowns` - One or more dropdown panels, each a `<div data-for=\"id\">`\n * where `id` matches the `data-dropdown=\"id\"` attribute on the trigger.\n * Clicking a trigger toggles the matching panel; only one is visible at\n * a time.\n * - `mobile-menu` - Mobile menu content (use af-nav-accordion for accordion menus)\n * - `mobile-button` - CTA button for mobile menu (appears at top)\n */\n@Component({\n tag: 'af-navbar',\n styleUrl: 'af-navbar.css',\n shadow: false,\n scoped: true,\n})\nexport class AfNavbar {\n @Element() el!: HTMLElement;\n\n @State() mobileMenuOpen: boolean = false;\n \n /** The currently open dropdown identifier (null if none open) */\n @State() activeDropdown: string | null = null;\n\n /** Whether to show the default Affinda logo when no logo slot content is provided */\n @Prop() showDefaultLogo: boolean = true;\n\n /** Theme for the spacer background - should match the section below the navbar */\n @Prop() theme?: 'white' | 'inkwell' | 'mist-green' | 'soft-clay';\n\n /** Force mobile layout regardless of viewport size (useful for testing/stories) */\n @Prop({ reflect: true }) forceMobile: boolean = false;\n\n private toggleMobileMenu = () => {\n this.mobileMenuOpen = !this.mobileMenuOpen;\n // Close any open dropdown when toggling mobile menu\n this.activeDropdown = null;\n };\n\n /**\n * Opens a dropdown by its identifier\n */\n private openDropdown = (dropdownId: string) => {\n this.activeDropdown = dropdownId;\n };\n\n /**\n * Closes the currently open dropdown\n */\n private closeDropdown = () => {\n this.activeDropdown = null;\n };\n\n /**\n * Toggles a dropdown by its identifier\n */\n private toggleDropdown = (dropdownId: string) => {\n if (this.activeDropdown === dropdownId) {\n this.activeDropdown = null;\n } else {\n this.activeDropdown = dropdownId;\n }\n };\n\n /** Timer id used to debounce hover-driven closes. */\n private closeTimer?: number;\n\n /**\n * The trigger element that opened the currently active dropdown. Tracked\n * so an Esc keypress can close the dropdown and restore focus to the\n * trigger, matching WAI-ARIA menu-button guidance.\n */\n private lastActiveTrigger?: HTMLElement;\n\n /**\n * Open the dropdown matching a `[data-dropdown]` trigger on click —\n * acts as a toggle so keyboard/touch users can still dismiss it.\n */\n @Listen('click')\n handleTriggerClick(event: MouseEvent) {\n const target = event.target as HTMLElement | null;\n const trigger = target?.closest?.('[data-dropdown]') as HTMLElement | null;\n if (!trigger || !this.el.contains(trigger)) return;\n const id = trigger.getAttribute('data-dropdown');\n if (!id) return;\n event.preventDefault();\n event.stopPropagation();\n this.cancelScheduledClose();\n this.lastActiveTrigger = trigger;\n this.toggleDropdown(id);\n }\n\n /**\n * Open the dropdown matching a `[data-dropdown]` trigger on hover.\n * Uses mouseover (which bubbles) and checks for the trigger ancestor.\n */\n @Listen('mouseover')\n handleHover(event: MouseEvent) {\n const target = event.target as HTMLElement | null;\n const trigger = target?.closest?.('[data-dropdown]') as HTMLElement | null;\n if (!trigger || !this.el.contains(trigger)) return;\n const id = trigger.getAttribute('data-dropdown');\n if (!id || this.activeDropdown === id) {\n this.cancelScheduledClose();\n return;\n }\n this.cancelScheduledClose();\n this.lastActiveTrigger = trigger;\n this.openDropdown(id);\n }\n\n /**\n * When the pointer leaves the navbar entirely (including any open\n * dropdown panel), schedule a close. Re-entering cancels it.\n */\n @Listen('mouseleave')\n handleHostLeave() {\n this.scheduleClose();\n }\n\n @Listen('mouseenter')\n handleHostEnter() {\n this.cancelScheduledClose();\n }\n\n private scheduleClose() {\n // Short 100ms debounce so the mouse has time to cross any tiny\n // dead-zone between the nav pill, the dropdown panel, and the\n // items inside it without accidentally closing the panel. A\n // re-entering mouseenter on the host cancels the pending close.\n this.cancelScheduledClose();\n this.closeTimer = window.setTimeout(() => {\n this.closeDropdown();\n this.closeTimer = undefined;\n }, 100);\n }\n\n private cancelScheduledClose() {\n if (this.closeTimer !== undefined) {\n clearTimeout(this.closeTimer);\n this.closeTimer = undefined;\n }\n }\n\n /**\n * Handle clicks outside the navbar to close dropdowns\n */\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n const path = event.composedPath();\n if (!path.includes(this.el)) {\n this.closeDropdown();\n }\n }\n\n /**\n * Keep the visibility of slotted dropdown panels, and the `data-active`\n * flag on their triggers, in sync with the currently active dropdown.\n * Each panel lives in the `dropdowns` slot and carries a `data-for`\n * attribute that matches its trigger's id.\n */\n componentDidLoad() {\n this.syncDropdownState();\n }\n\n componentDidUpdate() {\n this.syncDropdownState();\n }\n\n private syncDropdownState() {\n this.el.querySelectorAll<HTMLElement>('[data-for]').forEach((panel) => {\n if (!this.el.contains(panel)) return;\n panel.hidden = panel.getAttribute('data-for') !== this.activeDropdown;\n });\n this.el.querySelectorAll<HTMLElement>('[data-dropdown]').forEach((trigger) => {\n if (!this.el.contains(trigger)) return;\n const active = trigger.getAttribute('data-dropdown') === this.activeDropdown;\n if (active) trigger.setAttribute('data-active', '');\n else trigger.removeAttribute('data-active');\n trigger.setAttribute('aria-expanded', active ? 'true' : 'false');\n });\n }\n\n /**\n * Handle escape key to close dropdowns. If a dropdown is open, restore\n * focus to the trigger that opened it so keyboard users don't lose\n * their place in the tab order.\n */\n @Listen('keydown', { target: 'document' })\n handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'Escape' && this.activeDropdown !== null) {\n const toFocus = this.lastActiveTrigger;\n this.closeDropdown();\n toFocus?.focus?.();\n }\n }\n\n render() {\n const hasDropdown = this.activeDropdown !== null;\n\n return (\n <Host class={{ 'has-dropdown-open': hasDropdown }}>\n {/* Spacer element to prevent content from being hidden behind sticky navbar */}\n <div class={`navbar-spacer${this.theme ? ` theme-${this.theme}` : ''}`}></div>\n \n <nav class=\"navbar-container\">\n <div class=\"navbar theme-white\">\n {/* Left section: Logo + Nav Links */}\n <div class=\"navbar-left\">\n <div class=\"logo\">\n <slot name=\"logo\">\n {/* Default Affinda logo if no slot content provided */}\n {this.showDefaultLogo && <af-logo></af-logo>}\n </slot>\n </div>\n \n {/* Hamburger menu button - mobile only */}\n <button \n class=\"mobile-menu-toggle\"\n onClick={this.toggleMobileMenu}\n aria-label=\"Toggle navigation menu\"\n aria-expanded={this.mobileMenuOpen ? 'true' : 'false'}\n >\n {this.mobileMenuOpen ? (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M18 6L6 18M6 6l12 12\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n ) : (\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\">\n <path d=\"M3 12h18M3 6h18M3 18h18\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n )}\n </button>\n \n <div class={`nav-links ${this.mobileMenuOpen ? 'mobile-open' : ''}`}>\n <slot name=\"start\"></slot>\n </div>\n </div>\n\n {/* Right section: Actions + Button */}\n <div class={`navbar-right ${this.mobileMenuOpen ? 'mobile-open' : ''}`}>\n <div class=\"nav-actions\">\n <slot name=\"end\"></slot>\n </div>\n <div class=\"nav-button\">\n <slot name=\"button\"></slot>\n </div>\n </div>\n </div>\n\n {/* Dropdown panel container */}\n <div class={`dropdown-container ${hasDropdown ? 'is-open' : ''}`}>\n <div class=\"dropdown-panel theme-white\">\n <slot name=\"dropdowns\"></slot>\n </div>\n </div>\n </nav>\n\n {/* Mobile menu panel */}\n <div class={`mobile-menu-panel theme-white ${this.mobileMenuOpen ? 'is-open' : ''}`}>\n {/* Mobile CTA button at top */}\n <div class=\"mobile-button-container\">\n <slot name=\"mobile-button\">\n <slot name=\"button\"></slot>\n </slot>\n </div>\n \n {/* Mobile navigation content */}\n <div class=\"mobile-menu-content\">\n <slot name=\"mobile-menu\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

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

@@ -62,7 +62,7 @@ export class AfNumberBadge {
                     "references": {
                         "NumberBadgeNumber": {
                             "location": "local",
-                            "path": "/home/andrew/affinda-ui/packages/wc/src/components/af-number-badge/af-number-badge.tsx",
+                            "path": "/home/runner/work/affinda-ui/affinda-ui/packages/wc/src/components/af-number-badge/af-number-badge.tsx",
                             "id": "src/components/af-number-badge/af-number-badge.tsx::NumberBadgeNumber"
                         }
                     }
@@ -88,7 +88,7 @@ export class AfNumberBadge {
                     "references": {
                         "NumberBadgeVariant": {
                             "location": "local",
-                            "path": "/home/andrew/affinda-ui/packages/wc/src/components/af-number-badge/af-number-badge.tsx",
+                            "path": "/home/runner/work/affinda-ui/affinda-ui/packages/wc/src/components/af-number-badge/af-number-badge.tsx",
                             "id": "src/components/af-number-badge/af-number-badge.tsx::NumberBadgeVariant"
                         }
                     }
@@ -128,3 +128,4 @@ export class AfNumberBadge {
         };
     }
 }
+//# sourceMappingURL=af-number-badge.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"af-number-badge.js","sourceRoot":"","sources":["../../../src/components/af-number-badge/af-number-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKzD;;;;;;;;;GASG;AAMH,MAAM,OAAO,aAAa;IAL1B;QAME;;WAEG;QACK,WAAM,GAAsB,CAAC,CAAC;QAEtC;;;;WAIG;QACK,YAAO,GAAuB,UAAU,CAAC;QAEjD;;WAEG;QACK,SAAI,GAAW,EAAE,CAAC;KA6B3B;IA3BC,MAAM;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,KAAK,UAAU,CAAC;QAC/C,MAAM,QAAQ,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC;QAEhE,MAAM,UAAU,GAAG;YACjB,KAAK,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI;YACvB,MAAM,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI;YACxB,QAAQ,EAAE,GAAG,QAAQ,IAAI;SAC1B,CAAC;QAEF,OAAO,CACL,EAAC,IAAI,qDACH,IAAI,EAAC,KAAK,gBACE,UAAU,IAAI,CAAC,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE;YAEhE,6DACE,KAAK,EAAE;oBACL,OAAO,EAAE,IAAI;oBACb,CAAC,WAAW,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI;iBAClC,EACD,KAAK,EAAE,UAAU,IAEhB,IAAI,CAAC,MAAM,CACP,CACF,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, Host } from '@stencil/core';\n\nexport type NumberBadgeNumber = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;\nexport type NumberBadgeVariant = 'inCircle' | 'outlined';\n\n/**\n * NumberBadge displays numbers 1-10 in either a filled circle or text-only style.\n * Perfect for numbered lists, step indicators, or ordered content.\n * \n * @example\n * ```html\n * <af-number-badge number=\"1\" variant=\"inCircle\" size=\"48\"></af-number-badge>\n * <af-number-badge number=\"5\" variant=\"outlined\" size=\"32\"></af-number-badge>\n * ```\n */\n@Component({\n tag: 'af-number-badge',\n styleUrl: 'af-number-badge.css',\n shadow: true\n})\nexport class AfNumberBadge {\n /**\n * The number to display (1-10)\n */\n @Prop() number: NumberBadgeNumber = 1;\n\n /**\n * Visual variant of the badge\n * - `inCircle` - Number in filled soft-clay circle\n * - `outlined` - Number text only in mist-green\n */\n @Prop() variant: NumberBadgeVariant = 'inCircle';\n\n /**\n * Size of the badge in pixels\n */\n @Prop() size: number = 48;\n\n render() {\n const isInCircle = this.variant === 'inCircle';\n const fontSize = isInCircle ? this.size * 0.4 : this.size * 0.8;\n\n const badgeStyle = {\n width: `${this.size}px`,\n height: `${this.size}px`,\n fontSize: `${fontSize}px`,\n };\n\n return (\n <Host\n role=\"img\"\n aria-label={`Number ${this.number}${isInCircle ? ' badge' : ''}`}\n >\n <span\n class={{\n 'badge': true,\n [`variant-${this.variant}`]: true,\n }}\n style={badgeStyle}\n >\n {this.number}\n </span>\n </Host>\n );\n }\n}\n\n"]}

package/dist/collection/components/af-progress-line/af-progress-line.js CHANGED Viewed

@@ -83,3 +83,4 @@ export class AfProgressLine {
         };
     }
 }
+//# sourceMappingURL=af-progress-line.js.map

package/dist/collection/components/af-progress-line/af-progress-line.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"af-progress-line.js","sourceRoot":"","sources":["../../../src/components/af-progress-line/af-progress-line.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEzD;;;;;GAKG;AAOH,MAAM,OAAO,cAAc;IAN3B;QAOE;;WAEG;QACK,aAAQ,GAAW,CAAC,CAAC;QAE7B;;;WAGG;QACK,gBAAW,GAAiB,YAAY,CAAC;KA4BlD;IA1BC,MAAM;QACJ,iCAAiC;QACjC,MAAM,eAAe,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC;QAChE,MAAM,eAAe,GAAG,eAAe,GAAG,GAAG,CAAC;QAE9C,OAAO,CACL,EAAC,IAAI;YACH,4DACE,KAAK,EAAE;oBACL,eAAe,EAAE,IAAI;oBACrB,CAAC,kBAAkB,IAAI,CAAC,WAAW,EAAE,CAAC,EAAE,IAAI;iBAC7C,EACD,IAAI,EAAC,aAAa,mBACH,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,mBAC3B,CAAC,mBACD,GAAG;gBAElB,4DAAK,KAAK,EAAC,2BAA2B,GAAG;gBACzC,4DACE,KAAK,EAAC,uBAAuB,EAC7B,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,eAAe,GAAG,EAAE,GACvC,CACE,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Host } from '@stencil/core';\n\n/**\n * Progress Line atom component for displaying scroll or completion progress.\n * \n * Shows a horizontal bar with a filled portion indicating progress.\n * Used primarily for carousel scroll indicators.\n */\n@Component({\n tag: 'af-progress-line',\n styleUrl: 'af-progress-line.css',\n shadow: false,\n scoped: true,\n})\nexport class AfProgressLine {\n /**\n * Progress value from 0 to 1 (0 = 0%, 1 = 100%).\n */\n @Prop() progress: number = 0;\n\n /**\n * Orientation of the progress line.\n * Currently only horizontal is supported.\n */\n @Prop() orientation: 'horizontal' = 'horizontal';\n\n render() {\n // Clamp progress between 0 and 1\n const clampedProgress = Math.max(0, Math.min(1, this.progress));\n const progressPercent = clampedProgress * 100;\n\n return (\n <Host>\n <div\n class={{\n 'progress-line': true,\n [`progress-line--${this.orientation}`]: true,\n }}\n role=\"progressbar\"\n aria-valuenow={Math.round(progressPercent)}\n aria-valuemin={0}\n aria-valuemax={100}\n >\n <div class=\"progress-line__background\" />\n <div\n class=\"progress-line__active\"\n style={{ width: `${progressPercent}%` }}\n />\n </div>\n </Host>\n );\n }\n}\n\n"]}

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

@@ -157,3 +157,4 @@ export class AfRadio {
     }
     static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=af-radio.js.map