@affinda/wc 0.5.0 → 0.6.1

package/dist/cjs/af-input.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"af-input.entry.cjs.js","sources":["src/components/af-input/af-input.css?tag=af-input&encapsulation=shadow","src/components/af-input/af-input.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n}\n\n/* Wrapper */\n.input-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--sds-size-space-200, 8px);\n  width: 100%;\n}\n\n/* Label row */\n.label-row {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.label {\n  flex: 1;\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: var(--font-weight-book, 500);\n  font-size: 16px;\n  line-height: 24px;\n  color: var(--af-input-label, var(--af-typography-body-dark, #14343b));\n  cursor: default;\n}\n\n.required {\n  color: var(--af-input-error, var(--colour-error, #be292a));\n  margin-left: 2px;\n}\n\n/* Info icon button */\n.info-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0;\n  border: none;\n  background: none;\n  cursor: pointer;\n  color: var(--af-input-icon, var(--af-background-icon-default, #14343b));\n  flex-shrink: 0;\n}\n\n.info-icon svg {\n  width: 20px;\n  height: 20px;\n}\n\n.info-icon:hover {\n  opacity: 0.7;\n}\n\n.info-icon:focus-visible {\n  outline: 2px solid var(--af-input-focus-ring, var(--af-typography-body-dark, #14343b));\n  outline-offset: 2px;\n  border-radius: 4px;\n}\n\n/* Description */\n.description {\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: var(--font-weight-regular, 400);\n  font-size: 16px;\n  line-height: 24px;\n  color: var(--af-input-description, var(--af-typography-body-default, #2b484f));\n  margin: 0;\n}\n\n/* Input container */\n.input-container {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  background: var(--af-input-bg, #ffffff);\n  border: 1px solid var(--af-input-border, var(--af-background-border-default, #d1ddda));\n  border-radius: var(--radii-input, 8px);\n  transition: all 0.15s ease;\n  min-height: 48px;\n  box-sizing: border-box;\n}\n\n/* Hover state */\n.input-container.hovered {\n  background: var(--af-input-bg-hover, var(--af-background-base-hover, #f4f7f6));\n  border-color: var(--af-input-border-hover, var(--af-background-border-heavy, #c6d5d1));\n}\n\n/* Focus state */\n.input-container.focused {\n  background: var(--af-input-bg, #ffffff);\n  border-color: var(--af-input-border-active, var(--af-typography-body-dark, #14343b));\n  box-shadow: \n    0 0 0 4px var(--af-background-base, #ffffff), \n    0 0 0 5px var(--af-input-focus-ring, var(--af-typography-body-dark, #14343b));\n}\n\n/* Error state */\n.input-container.error {\n  border-color: var(--af-input-border-error, var(--colour-error, #be292a));\n}\n\n/* Disabled state */\n.input-container.disabled {\n  background: var(--af-input-bg-disabled, var(--af-background-level-1, #e8eeed));\n  border-color: var(--af-input-border, var(--af-background-border-default, #d1ddda));\n  cursor: not-allowed;\n}\n\n/* Search icon */\n.search-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  flex-shrink: 0;\n  color: var(--af-input-icon, var(--af-background-icon-default, #14343b));\n}\n\n.search-icon svg {\n  width: 20px;\n  height: 20px;\n}\n\n.disabled .search-icon {\n  opacity: 0.5;\n}\n\n/* Native input */\n.input {\n  flex: 1;\n  min-width: 0;\n  padding: 0;\n  border: none;\n  background: transparent;\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: var(--font-weight-regular, 400);\n  font-size: 16px;\n  line-height: 24px;\n  color: var(--af-input-text, var(--af-typography-body-dark, #14343b));\n  outline: none;\n}\n\n.input::placeholder {\n  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));\n  opacity: 1;\n}\n\n.input:disabled {\n  cursor: not-allowed;\n  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));\n}\n\n.input:disabled::placeholder {\n  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));\n}\n\n/* Hide native browser styling for search inputs */\n.input[type=\"search\"]::-webkit-search-decoration,\n.input[type=\"search\"]::-webkit-search-cancel-button,\n.input[type=\"search\"]::-webkit-search-results-button,\n.input[type=\"search\"]::-webkit-search-results-decoration {\n  display: none;\n}\n\n/* Hide number input spinners */\n.input[type=\"number\"]::-webkit-inner-spin-button,\n.input[type=\"number\"]::-webkit-outer-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n.input[type=\"number\"] {\n  -moz-appearance: textfield;\n}\n\n/* Clear button */\n.clear-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0;\n  border: none;\n  background: none;\n  cursor: pointer;\n  color: var(--af-input-icon, var(--af-background-icon-default, #14343b));\n  flex-shrink: 0;\n  opacity: 0.6;\n  transition: opacity 0.15s ease;\n}\n\n.clear-button svg {\n  width: 16px;\n  height: 16px;\n}\n\n.clear-button:hover {\n  opacity: 1;\n}\n\n.clear-button:focus-visible {\n  outline: 2px solid var(--af-input-focus-ring, var(--af-typography-body-dark, #14343b));\n  outline-offset: 2px;\n  border-radius: 4px;\n}\n\n/* Error row */\n.error-row {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.error-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  flex-shrink: 0;\n  color: var(--af-input-error, var(--colour-error, #be292a));\n}\n\n.error-icon svg {\n  width: 20px;\n  height: 20px;\n}\n\n.error-text {\n  flex: 1;\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: var(--font-weight-regular, 400);\n  font-size: 16px;\n  line-height: 24px;\n  color: var(--af-input-error, var(--colour-error, #be292a));\n}\n","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"],"names":["h","Host"],"mappings":"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"}
+{"version":3,"file":"af-input.entry.cjs.js","sources":["src/components/af-input/af-input.css?tag=af-input&encapsulation=shadow","src/components/af-input/af-input.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n}\n\n/* Wrapper */\n.input-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: var(--sds-size-space-200, 8px);\n  width: 100%;\n}\n\n/* Label row */\n.label-row {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.label {\n  flex: 1;\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: var(--font-weight-book, 500);\n  font-size: 16px;\n  line-height: 24px;\n  color: var(--af-input-label, var(--af-typography-body-dark, #14343b));\n  cursor: default;\n}\n\n.required {\n  color: var(--af-input-error, var(--colour-error, #be292a));\n  margin-left: 2px;\n}\n\n/* Info icon button */\n.info-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0;\n  border: none;\n  background: none;\n  cursor: pointer;\n  color: var(--af-input-icon, var(--af-background-icon-default, #14343b));\n  flex-shrink: 0;\n}\n\n.info-icon svg {\n  width: 20px;\n  height: 20px;\n}\n\n.info-icon:hover {\n  opacity: 0.7;\n}\n\n.info-icon:focus-visible {\n  outline: 2px solid var(--af-input-focus-ring, var(--af-typography-body-dark, #14343b));\n  outline-offset: 2px;\n  border-radius: 4px;\n}\n\n/* Description */\n.description {\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: var(--font-weight-regular, 400);\n  font-size: 16px;\n  line-height: 24px;\n  color: var(--af-input-description, var(--af-typography-body-default, #2b484f));\n  margin: 0;\n}\n\n/* Input container */\n.input-container {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  background: var(--af-input-bg, #ffffff);\n  border: 1px solid var(--af-input-border, var(--af-background-border-default, #d1ddda));\n  border-radius: var(--radii-input, 8px);\n  transition: all 0.15s ease;\n  min-height: 48px;\n  box-sizing: border-box;\n}\n\n/* Hover state */\n.input-container.hovered {\n  background: var(--af-input-bg-hover, var(--af-background-base-hover, #f4f7f6));\n  border-color: var(--af-input-border-hover, var(--af-background-border-heavy, #c6d5d1));\n}\n\n/* Focus state */\n.input-container.focused {\n  background: var(--af-input-bg, #ffffff);\n  border-color: var(--af-input-border-active, var(--af-typography-body-dark, #14343b));\n  box-shadow: \n    0 0 0 4px var(--af-background-base, #ffffff), \n    0 0 0 5px var(--af-input-focus-ring, var(--af-typography-body-dark, #14343b));\n}\n\n/* Error state */\n.input-container.error {\n  border-color: var(--af-input-border-error, var(--colour-error, #be292a));\n}\n\n/* Disabled state */\n.input-container.disabled {\n  background: var(--af-input-bg-disabled, var(--af-background-level-1, #e8eeed));\n  border-color: var(--af-input-border, var(--af-background-border-default, #d1ddda));\n  cursor: not-allowed;\n}\n\n/* Search icon */\n.search-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  flex-shrink: 0;\n  color: var(--af-input-icon, var(--af-background-icon-default, #14343b));\n}\n\n.search-icon svg {\n  width: 20px;\n  height: 20px;\n}\n\n.disabled .search-icon {\n  opacity: 0.5;\n}\n\n/* Native input */\n.input {\n  flex: 1;\n  min-width: 0;\n  padding: 0;\n  border: none;\n  background: transparent;\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: var(--font-weight-regular, 400);\n  font-size: 16px;\n  line-height: 24px;\n  color: var(--af-input-text, var(--af-typography-body-dark, #14343b));\n  outline: none;\n}\n\n.input::placeholder {\n  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));\n  opacity: 1;\n}\n\n.input:disabled {\n  cursor: not-allowed;\n  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));\n}\n\n.input:disabled::placeholder {\n  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));\n}\n\n/* Hide native browser styling for search inputs */\n.input[type=\"search\"]::-webkit-search-decoration,\n.input[type=\"search\"]::-webkit-search-cancel-button,\n.input[type=\"search\"]::-webkit-search-results-button,\n.input[type=\"search\"]::-webkit-search-results-decoration {\n  display: none;\n}\n\n/* Hide number input spinners */\n.input[type=\"number\"]::-webkit-inner-spin-button,\n.input[type=\"number\"]::-webkit-outer-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n.input[type=\"number\"] {\n  -moz-appearance: textfield;\n}\n\n/* Clear button */\n.clear-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  padding: 0;\n  border: none;\n  background: none;\n  cursor: pointer;\n  color: var(--af-input-icon, var(--af-background-icon-default, #14343b));\n  flex-shrink: 0;\n  opacity: 0.6;\n  transition: opacity 0.15s ease;\n}\n\n.clear-button svg {\n  width: 16px;\n  height: 16px;\n}\n\n.clear-button:hover {\n  opacity: 1;\n}\n\n.clear-button:focus-visible {\n  outline: 2px solid var(--af-input-focus-ring, var(--af-typography-body-dark, #14343b));\n  outline-offset: 2px;\n  border-radius: 4px;\n}\n\n/* ---------- Multiline (textarea) mode ---------- */\n\n/* Container has no inner padding in multiline mode — the textarea\n   element owns the padding so it fills the box and resizes cleanly. */\n.input-container--multiline {\n  padding: 0;\n  min-height: 0;\n  overflow: hidden;\n}\n\n/* Native textarea */\n.input--multiline {\n  flex: 1;\n  min-width: 0;\n  min-height: 108px;\n  padding: 12px 16px;\n  border: none;\n  background: transparent;\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: var(--font-weight-regular, 400);\n  font-size: 16px;\n  line-height: 24px;\n  color: var(--af-input-text, var(--af-typography-body-dark, #14343b));\n  outline: none;\n  resize: vertical;\n}\n\n.input--multiline::placeholder {\n  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));\n  opacity: 1;\n}\n\n.input--multiline:disabled {\n  cursor: not-allowed;\n  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));\n  resize: none;\n}\n\n.input--multiline:disabled::placeholder {\n  color: var(--af-input-placeholder, var(--af-typography-body-subtle, #60767b));\n}\n\n/* Error row */\n.error-row {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.error-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  flex-shrink: 0;\n  color: var(--af-input-error, var(--colour-error, #be292a));\n}\n\n.error-icon svg {\n  width: 20px;\n  height: 20px;\n}\n\n.error-text {\n  flex: 1;\n  font-family: var(--typography-primaryfont, 'NeuSans', sans-serif);\n  font-weight: var(--font-weight-regular, 400);\n  font-size: 16px;\n  line-height: 24px;\n  color: var(--af-input-error, var(--colour-error, #be292a));\n}\n","import { Component, h, Prop, Host, Event, EventEmitter, State } from '@stencil/core';\n\n/**\n * Input field component with label, description, and error states.\n * Supports single-line and multi-line (textarea) modes via the `multiline` prop.\n *\n * @slot label-end - Content to display at the end of the label (e.g., info icon)\n */\n@Component({\n  tag: 'af-input',\n  styleUrl: 'af-input.css',\n  shadow: true\n})\nexport class AfInput {\n  /**\n   * The label text for the input field\n   */\n  @Prop() label?: string;\n\n  /**\n   * Description text displayed below the label\n   */\n  @Prop() description?: string;\n\n  /**\n   * Placeholder text for the input\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * The current value of the input\n   */\n  @Prop({ mutable: true }) value: string = '';\n\n  /**\n   * The input type (text, email, password, number, tel, url, search).\n   * Ignored when `multiline` is true.\n   */\n  @Prop() type: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search' = 'text';\n\n  /**\n   * The name of the input for form submission\n   */\n  @Prop() name?: string;\n\n  /**\n   * Whether the input is disabled\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Whether the input is required\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * Whether the input is read-only\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * Error message to display (also sets error state)\n   */\n  @Prop() error?: string;\n\n  /**\n   * Whether to show the info icon next to the label\n   */\n  @Prop() showInfoIcon: boolean = false;\n\n  /**\n   * Whether to show a search icon in the input. Ignored when `multiline` is true.\n   */\n  @Prop() showSearchIcon: boolean = false;\n\n  /**\n   * Whether to show a clear button when input has value. Ignored when `multiline` is true.\n   */\n  @Prop() clearable: boolean = false;\n\n  /**\n   * Autocomplete attribute for the input\n   */\n  @Prop() autocomplete?: string;\n\n  /**\n   * Maximum length of input value\n   */\n  @Prop() maxlength?: number;\n\n  /**\n   * Minimum length of input value\n   */\n  @Prop() minlength?: number;\n\n  /**\n   * Pattern for input validation (regex). Ignored when `multiline` is true.\n   */\n  @Prop() pattern?: string;\n\n  /**\n   * Render as a multi-line textarea instead of a single-line input.\n   * Activates `rows` and `resize` props; ignores `type`, `pattern`,\n   * `autocomplete`, `showSearchIcon`, `clearable`.\n   */\n  @Prop() multiline: boolean = false;\n\n  /**\n   * Number of visible rows when `multiline` is true. Ignored otherwise.\n   */\n  @Prop() rows: number = 4;\n\n  /**\n   * Whether the textarea is resizable. Ignored when `multiline` is false.\n   */\n  @Prop() resize: 'none' | 'vertical' | 'horizontal' | 'both' = 'vertical';\n\n  /**\n   * Emitted when the input value changes\n   */\n  @Event() afInput!: EventEmitter<{ value: string }>;\n\n  /**\n   * Emitted when the input loses focus\n   */\n  @Event() afBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the input gains focus\n   */\n  @Event() afFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when the clear button is clicked. Only fires in single-line mode.\n   */\n  @Event() afClear!: EventEmitter<void>;\n\n  /**\n   * Emitted when the info icon is clicked\n   */\n  @Event() afInfoClick!: EventEmitter<void>;\n\n  @State() private isFocused: boolean = false;\n  @State() private isHovered: boolean = false;\n\n  private inputEl?: HTMLInputElement | HTMLTextAreaElement;\n\n  private handleInput = (event: Event) => {\n    const target = event.target as HTMLInputElement | HTMLTextAreaElement;\n    this.value = target.value;\n    this.afInput.emit({ value: this.value });\n  };\n\n  private handleFocus = () => {\n    this.isFocused = true;\n    this.afFocus.emit();\n  };\n\n  private handleBlur = () => {\n    this.isFocused = false;\n    this.afBlur.emit();\n  };\n\n  private handleMouseEnter = () => {\n    this.isHovered = true;\n  };\n\n  private handleMouseLeave = () => {\n    this.isHovered = false;\n  };\n\n  private handleClear = () => {\n    this.value = '';\n    this.afClear.emit();\n    this.afInput.emit({ value: '' });\n    this.inputEl?.focus();\n  };\n\n  private handleInfoClick = (event: MouseEvent) => {\n    event.preventDefault();\n    event.stopPropagation();\n    this.afInfoClick.emit();\n  };\n\n  render() {\n    const hasError = !!this.error;\n    const hasValue = !!(this.value && this.value.length > 0);\n    const multiline = this.multiline;\n\n    const wrapperClasses = {\n      'input-wrapper': true,\n      'input-wrapper--multiline': multiline,\n      'disabled': this.disabled,\n      'error': hasError,\n      'focused': this.isFocused,\n      'hovered': this.isHovered && !this.disabled && !this.isFocused,\n      'populated': hasValue\n    };\n\n    const inputContainerClasses = {\n      'input-container': true,\n      'input-container--multiline': multiline,\n      'disabled': this.disabled,\n      'error': hasError,\n      'focused': this.isFocused,\n      'hovered': this.isHovered && !this.disabled && !this.isFocused\n    };\n\n    return (\n      <Host>\n        <div class={wrapperClasses}>\n          {/* Label */}\n          {this.label && (\n            <div class=\"label-row\">\n              <label class=\"label\" htmlFor=\"input\">\n                {this.label}\n                {this.required && <span class=\"required\">*</span>}\n              </label>\n              {this.showInfoIcon && (\n                <button\n                  type=\"button\"\n                  class=\"info-icon\"\n                  onClick={this.handleInfoClick}\n                  aria-label=\"More information\"\n                >\n                  <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                    <path d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    <path d=\"M12 16V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                    <path d=\"M12 8H12.01\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  </svg>\n                </button>\n              )}\n              <slot name=\"label-end\"></slot>\n            </div>\n          )}\n\n          {/* Description */}\n          {this.description && (\n            <p class=\"description\">{this.description}</p>\n          )}\n\n          {/* Input container */}\n          <div\n            class={inputContainerClasses}\n            onMouseEnter={this.handleMouseEnter}\n            onMouseLeave={this.handleMouseLeave}\n          >\n            {/* Search icon (single-line only) */}\n            {!multiline && this.showSearchIcon && (\n              <span class=\"search-icon\">\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path d=\"M11 19C15.4183 19 19 15.4183 19 11C19 6.58172 15.4183 3 11 3C6.58172 3 3 6.58172 3 11C3 15.4183 6.58172 19 11 19Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  <path d=\"M21 21L16.65 16.65\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                </svg>\n              </span>\n            )}\n\n            {/* Native input or textarea */}\n            {multiline ? (\n              <textarea\n                ref={(el) => this.inputEl = el ?? undefined}\n                id=\"input\"\n                class=\"input input--multiline\"\n                name={this.name}\n                value={this.value}\n                placeholder={this.placeholder}\n                disabled={this.disabled}\n                required={this.required}\n                readonly={this.readonly}\n                rows={this.rows}\n                maxlength={this.maxlength}\n                minlength={this.minlength}\n                style={{ resize: this.resize }}\n                aria-invalid={hasError ? 'true' : undefined}\n                aria-describedby={hasError ? 'error-message' : this.description ? 'description' : undefined}\n                onInput={this.handleInput}\n                onFocus={this.handleFocus}\n                onBlur={this.handleBlur}\n              />\n            ) : (\n              <input\n                ref={(el) => this.inputEl = el ?? undefined}\n                id=\"input\"\n                class=\"input\"\n                type={this.type}\n                name={this.name}\n                value={this.value}\n                placeholder={this.placeholder}\n                disabled={this.disabled}\n                required={this.required}\n                readonly={this.readonly}\n                autocomplete={this.autocomplete}\n                maxlength={this.maxlength}\n                minlength={this.minlength}\n                pattern={this.pattern}\n                aria-invalid={hasError ? 'true' : undefined}\n                aria-describedby={hasError ? 'error-message' : this.description ? 'description' : undefined}\n                onInput={this.handleInput}\n                onFocus={this.handleFocus}\n                onBlur={this.handleBlur}\n              />\n            )}\n\n            {/* Clear button (single-line only) */}\n            {!multiline && this.clearable && hasValue && !this.disabled && !this.readonly && (\n              <button\n                type=\"button\"\n                class=\"clear-button\"\n                onClick={this.handleClear}\n                aria-label=\"Clear input\"\n              >\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path d=\"M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                  <path d=\"M6 6L18 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                </svg>\n              </button>\n            )}\n          </div>\n\n          {/* Error message */}\n          {hasError && (\n            <div class=\"error-row\" id=\"error-message\">\n              <span class=\"error-icon\">\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path d=\"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                <path d=\"M12 16V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                <path d=\"M12 8H12.01\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                </svg>\n              </span>\n              <span class=\"error-text\">{this.error}</span>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n\n"],"names":["h","Host"],"mappings":"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"}

package/dist/cjs/af-logo-well.cjs.entry.js

@@ -9,7 +9,7 @@ const AfLogoWell = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '3dce73db40979d85f0ec5f467baf049e3582d8e2' }, index.h("div", { key: '7c788d3abb3ad7b1f6835d4561c3389dda007ffa', class: "logo-well" }, index.h("slot", { key: 'fa27e27c2c6204256582143b8dd00c8de5f73501' }))));
+        return (index.h(index.Host, { key: '89f971eecc9e4a0656c6a6865c2653e64bbdd7bb' }, index.h("div", { key: 'a4ac54bd1649f010caa095b2ea1f8e7ea8b24a02', class: "logo-well" }, index.h("slot", { key: '11cf1c916f2b056c6ee575351263d83778529146' }))));
     }
 };
 AfLogoWell.style = afLogoWellCss;

package/dist/cjs/af-nav-accordion-item.cjs.entry.js

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

package/dist/cjs/af-nav-accordion.cjs.entry.js

@@ -72,7 +72,7 @@ const AfNavAccordion = class {
         this.syncItems();
     }
     render() {
-        return (index.h(index.Host, { key: 'e60e0f40da03dce1a766a880f1f3649dd957b63e', class: { [`breakpoint-${this.breakpoint}`]: true, [`mode-${this.mode}`]: true } }, index.h("div", { key: 'e80e79b012c3060a9fdfcec22af050eb5d063648', class: "nav-accordion" }, index.h("slot", { key: '234d41321e32046d3d439a93a544c0325b0a02a8' }))));
+        return (index.h(index.Host, { key: '111706b5210510f44864d0dd8f5d2fe1901839da', class: { [`breakpoint-${this.breakpoint}`]: true, [`mode-${this.mode}`]: true } }, index.h("div", { key: 'e21f1a8ae3edf2c8aa08385240a536c69cf0da6e', class: "nav-accordion" }, index.h("slot", { key: 'c452fa149aec51c88dbaef3e59de7e28c4f89de3' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/af-nav-menu-nest.cjs.entry.js

@@ -35,7 +35,7 @@ const AfNavMenuNest = class {
             [`type-${this.type}`]: true,
             [`breakpoint-${this.breakpoint}`]: true
         };
-        return (index.h(index.Host, { key: '90fbee205d076ffd9884122101a2f337088d6cd6' }, index.h("div", { key: '49e9b2290833f5200119d2cac7d4381e74eddbec', class: classes }, index.h("div", { key: '148790bd4481d662149913a6b53e248c4ff49f95', class: "menu-columns" }, index.h("slot", { key: '7790aa268c060cc8253bab3dc08c9de0819eb39a' })), index.h("div", { key: '393ed046ddcd717e4d1dd8a2e9df0332f1612238', class: "menu-sidebar" }, index.h("slot", { key: 'cb61c9744b070aaf2bcbbbf2b402664e41e2866c', name: "sidebar" })))));
+        return (index.h(index.Host, { key: 'b0eb2c4904916a16b2b6ec6d612337fed3c05e12' }, index.h("div", { key: 'dd1836b1c6ee6f75555989334a35e2a41d9bacab', class: classes }, index.h("div", { key: '4e3ae3951e9969d21a5e18a0489a33631bb1e8f2', class: "menu-columns" }, index.h("slot", { key: '64c660d4a5b35dda06b0ff0ca21c0e24014ceef2' })), index.h("div", { key: '7418a543431a9fd0fbbf95b1e3b5e862d5ac3917', class: "menu-sidebar" }, index.h("slot", { key: 'd36bb4016c86d9258a70ddbb46232264bdb156e4', name: "sidebar" })))));
     }
 };
 AfNavMenuNest.style = afNavMenuNestCss;

package/dist/cjs/af-nav-menu.cjs.entry.js

@@ -32,7 +32,7 @@ const AfNavMenu = class {
             'has-border': this.showBorder,
             'card-style': this.cardStyle
         };
-        return (index.h(index.Host, { key: 'b77aa8f55e2148e3a21dea9009ccc9f345ad5da1' }, index.h("div", { key: '0ef8c2202f6ba4925bf16a2e448dec67f65b1bd6', class: classes }, this.heading && (index.h("div", { key: '6164df7a1a6efe8afb57860d20175fa5ecabf39c', class: "menu-header" }, index.h("h3", { key: 'a517c7e3039424974c111dc8bf085b9bb57ce833', class: "menu-heading" }, this.heading))), index.h("div", { key: '18389d1f29886f2d832744bf1cadc449c8e96948', class: "menu-items" }, index.h("slot", { key: '40c5ffc54a5c1eedd8e07fbecd040070f1b16d97' })))));
+        return (index.h(index.Host, { key: '3245ae98bb4b1ab013d36630802bb1cdece57675' }, index.h("div", { key: 'e84dcdc45b92f928ee7b8dd2328a2b7276a2e02a', class: classes }, this.heading && (index.h("div", { key: 'd42c91176b53b5d0375cb29d489b722dcd3c8e74', class: "menu-header" }, index.h("h3", { key: 'b2cf5d6cb682db6f68c9a45045fb060710097137', class: "menu-heading" }, this.heading))), index.h("div", { key: '89e7aef886d60d2ce3d8b82cd1b2c588d4894be8', class: "menu-items" }, index.h("slot", { key: '29d596f664fdfc83fc40c17686751f1b893bce26' })))));
     }
 };
 AfNavMenu.style = afNavMenuCss;

package/dist/cjs/af-number-badge.cjs.entry.js

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

package/dist/cjs/af-numbered-stepper-item.cjs.entry.js

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

package/dist/cjs/af-numbered-stepper.cjs.entry.js

@@ -26,7 +26,7 @@ const AfNumberedStepper = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '018229242bb7fbcd74c312683b4a6ce4e7337894', class: `numbered-stepper numbered-stepper--${this.orientation}`, role: "list" }, index.h("slot", { key: '3fae9bbb5bc403d2f55bd4076c1794163e9631e2' })));
+        return (index.h(index.Host, { key: '468809af144520073ec0924b8b293a1a7a98c2a6', class: `numbered-stepper numbered-stepper--${this.orientation}`, role: "list" }, index.h("slot", { key: 'e7ab09871620ab5ccc1b384443824a91750a15c3' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/af-paperclip-decoration.cjs.entry.js

@@ -9,14 +9,18 @@ const AfPaperclipDecoration = class {
         index.registerInstance(this, hostRef);
         /**
          * SVG width — accepts any CSS length or unitless number (pixels).
-         * Defaults to the intrinsic viewBox width (`655`).
+         * Default sized so the watermark stays inside the af-hero
+         * inkwell-centered column without bleeding into the `logos-below`
+         * client-logo carousel. Override per-page via the prop if a larger
+         * decorative scale is wanted somewhere with no logos slot.
          */
-        this.width = '655';
+        this.width = '520';
         /**
          * SVG height — accepts any CSS length or unitless number (pixels).
-         * Defaults to the intrinsic viewBox height (`754`).
+         * Sized to match the trimmed `width` default; preserves the source
+         * SVG's 655 × 754 aspect ratio.
          */
-        this.height = '754';
+        this.height = '600';
         /**
          * Fill opacity of the paperclip shape. Defaults to `0.06` to match the
          * marketing-site watermark treatment.
@@ -30,7 +34,7 @@ const AfPaperclipDecoration = class {
         this.fill = 'white';
     }
     render() {
-        return (index.h(index.Host, { key: '4236fa1de1c1847b0665c79341000bfb63ab4509' }, index.h("svg", { key: '6c11c85851c7e6e11d625dac2eb546bb9a0405dc', "aria-hidden": "true", width: this.width, height: this.height, viewBox: "0 0 655 754", fill: "none", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "none" }, index.h("path", { key: 'ab2f7bcda82bd715dcf336abb1e191badd1f624a', d: "M1102.14 108.279C1031.8 37.5181 939.128 -1.06817 840.61 0.447304H358.674L262.104 157.124H841.87C842.558 157.124 843.36 157.124 844.047 157.124C900.638 157.124 953.791 179.273 994 219.725C1035.24 261.225 1058.04 316.715 1058.04 376.052C1058.04 497.872 960.665 596.844 841.068 596.844H251.335C197.609 596.844 153.848 552.313 153.848 497.639C153.848 442.965 197.723 397.734 251.221 396.102H779.208L878.872 239.426H248.586C111.577 242.923 0 358.682 0 497.639C0 636.596 112.723 753.404 251.335 753.404H841.068C1045.55 753.404 1212 584.021 1212 375.935C1212 274.398 1173.05 179.39 1102.26 108.162L1102.14 108.279Z", fill: this.fill, "fill-opacity": this.opacity }))));
+        return (index.h(index.Host, { key: '9db0e4d35474d6c783387ed5c522943ac89f5315' }, index.h("svg", { key: 'a79d736a5ab711844bc1f2233c493edf66039fb4', "aria-hidden": "true", width: this.width, height: this.height, viewBox: "0 0 655 754", fill: "none", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "none" }, index.h("path", { key: 'c6a0f21366a159e5af9f69e324797450e4b31b15', d: "M1102.14 108.279C1031.8 37.5181 939.128 -1.06817 840.61 0.447304H358.674L262.104 157.124H841.87C842.558 157.124 843.36 157.124 844.047 157.124C900.638 157.124 953.791 179.273 994 219.725C1035.24 261.225 1058.04 316.715 1058.04 376.052C1058.04 497.872 960.665 596.844 841.068 596.844H251.335C197.609 596.844 153.848 552.313 153.848 497.639C153.848 442.965 197.723 397.734 251.221 396.102H779.208L878.872 239.426H248.586C111.577 242.923 0 358.682 0 497.639C0 636.596 112.723 753.404 251.335 753.404H841.068C1045.55 753.404 1212 584.021 1212 375.935C1212 274.398 1173.05 179.39 1102.26 108.162L1102.14 108.279Z", fill: this.fill, "fill-opacity": this.opacity }))));
     }
 };
 AfPaperclipDecoration.style = afPaperclipDecorationCss;

package/dist/cjs/af-paperclip-decoration.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"af-paperclip-decoration.entry.cjs.js","sources":["src/components/af-paperclip-decoration/af-paperclip-decoration.css?tag=af-paperclip-decoration&encapsulation=shadow","src/components/af-paperclip-decoration/af-paperclip-decoration.tsx"],"sourcesContent":[":host {\n  display: block;\n  /* Decorative-only; host is sized/positioned by the consumer. */\n  pointer-events: none;\n}\n\nsvg {\n  display: block;\n  /* Let the SVG honour its own width/height attributes rather than\n     inheriting host dimensions. */\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Decorative paperclip vector graphic. Renders the left-half paperclip\n * silhouette (viewBox `0 0 655 754`) that the marketing site bleeds off\n * the right edge of inkwell hero sections.\n *\n * Purely decorative — the inner `<svg>` is `aria-hidden=\"true\"`. Size it\n * via the `width` / `height` props (they accept any CSS length, e.g.\n * `\"655\"`, `\"100%\"`, `\"50vw\"`) and position the host element in CSS.\n *\n * `fill` is white by default (intended for inkwell backgrounds); override\n * for other themes, e.g. `fill=\"var(--colour-brand-inkwell)\"` on a\n * mist-green section. `opacity` defaults to `0.06` to match the\n * watermark treatment used on `/`, `/au`, and `/platform`.\n *\n * @example\n * ```html\n * <af-section theme=\"inkwell\" padding=\"loose\" style=\"position:relative;overflow:hidden\">\n *   <af-paperclip-decoration\n *     style=\"position:absolute;bottom:-80px;right:-80px\"\n *   ></af-paperclip-decoration>\n *   <af-container style=\"position:relative;z-index:1\">\n *     <!-- hero content -->\n *   </af-container>\n * </af-section>\n * ```\n */\n@Component({\n  tag: 'af-paperclip-decoration',\n  styleUrl: 'af-paperclip-decoration.css',\n  shadow: true\n})\nexport class AfPaperclipDecoration {\n  /**\n   * SVG width — accepts any CSS length or unitless number (pixels).\n   * Defaults to the intrinsic viewBox width (`655`).\n   */\n  @Prop() width: string = '655';\n\n  /**\n   * SVG height — accepts any CSS length or unitless number (pixels).\n   * Defaults to the intrinsic viewBox height (`754`).\n   */\n  @Prop() height: string = '754';\n\n  /**\n   * Fill opacity of the paperclip shape. Defaults to `0.06` to match the\n   * marketing-site watermark treatment.\n   */\n  @Prop() opacity: number = 0.06;\n\n  /**\n   * Fill colour. Defaults to `white` (designed for inkwell backgrounds);\n   * override for other themes, e.g. `var(--colour-brand-inkwell)` on a\n   * mist-green section.\n   */\n  @Prop() fill: string = 'white';\n\n  render() {\n    return (\n      <Host>\n        <svg\n          aria-hidden=\"true\"\n          width={this.width}\n          height={this.height}\n          viewBox=\"0 0 655 754\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          preserveAspectRatio=\"none\"\n        >\n          <path\n            d=\"M1102.14 108.279C1031.8 37.5181 939.128 -1.06817 840.61 0.447304H358.674L262.104 157.124H841.87C842.558 157.124 843.36 157.124 844.047 157.124C900.638 157.124 953.791 179.273 994 219.725C1035.24 261.225 1058.04 316.715 1058.04 376.052C1058.04 497.872 960.665 596.844 841.068 596.844H251.335C197.609 596.844 153.848 552.313 153.848 497.639C153.848 442.965 197.723 397.734 251.221 396.102H779.208L878.872 239.426H248.586C111.577 242.923 0 358.682 0 497.639C0 636.596 112.723 753.404 251.335 753.404H841.068C1045.55 753.404 1212 584.021 1212 375.935C1212 274.398 1173.05 179.39 1102.26 108.162L1102.14 108.279Z\"\n            fill={this.fill}\n            fill-opacity={this.opacity}\n          />\n        </svg>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,wBAAwB,GAAG,6DAA6D;;MCiCjF,qBAAqB,GAAA,MAAA;AALlC,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAW,KAAK;AAE7B;;;AAGG;AACK,QAAA,IAAM,CAAA,MAAA,GAAW,KAAK;AAE9B;;;AAGG;AACK,QAAA,IAAO,CAAA,OAAA,GAAW,IAAI;AAE9B;;;;AAIG;AACK,QAAA,IAAI,CAAA,IAAA,GAAW,OAAO;AAuB/B;IArBC,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,aAAA,EACc,MAAM,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,mBAAmB,EAAC,MAAM,EAAA,EAE1BA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,imBAAimB,EACnmB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAA,cAAA,EACD,IAAI,CAAC,OAAO,GAC1B,CACE,CACD;;;;;;;"}
+{"version":3,"file":"af-paperclip-decoration.entry.cjs.js","sources":["src/components/af-paperclip-decoration/af-paperclip-decoration.css?tag=af-paperclip-decoration&encapsulation=shadow","src/components/af-paperclip-decoration/af-paperclip-decoration.tsx"],"sourcesContent":[":host {\n  display: block;\n  /* Decorative-only; host is sized/positioned by the consumer. */\n  pointer-events: none;\n}\n\nsvg {\n  display: block;\n  /* Let the SVG honour its own width/height attributes rather than\n     inheriting host dimensions. */\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * Decorative paperclip vector graphic. Renders the left-half paperclip\n * silhouette (viewBox `0 0 655 754`) that the marketing site bleeds off\n * the right edge of inkwell hero sections.\n *\n * Purely decorative — the inner `<svg>` is `aria-hidden=\"true\"`. Size it\n * via the `width` / `height` props (they accept any CSS length, e.g.\n * `\"655\"`, `\"100%\"`, `\"50vw\"`) and position the host element in CSS.\n *\n * `fill` is white by default (intended for inkwell backgrounds); override\n * for other themes, e.g. `fill=\"var(--colour-brand-inkwell)\"` on a\n * mist-green section. `opacity` defaults to `0.06` to match the\n * watermark treatment used on `/`, `/au`, and `/platform`.\n *\n * @example\n * ```html\n * <af-section theme=\"inkwell\" padding=\"loose\" style=\"position:relative;overflow:hidden\">\n *   <af-paperclip-decoration\n *     style=\"position:absolute;bottom:-80px;right:-80px\"\n *   ></af-paperclip-decoration>\n *   <af-container style=\"position:relative;z-index:1\">\n *     <!-- hero content -->\n *   </af-container>\n * </af-section>\n * ```\n */\n@Component({\n  tag: 'af-paperclip-decoration',\n  styleUrl: 'af-paperclip-decoration.css',\n  shadow: true\n})\nexport class AfPaperclipDecoration {\n  /**\n   * SVG width — accepts any CSS length or unitless number (pixels).\n   * Default sized so the watermark stays inside the af-hero\n   * inkwell-centered column without bleeding into the `logos-below`\n   * client-logo carousel. Override per-page via the prop if a larger\n   * decorative scale is wanted somewhere with no logos slot.\n   */\n  @Prop() width: string = '520';\n\n  /**\n   * SVG height — accepts any CSS length or unitless number (pixels).\n   * Sized to match the trimmed `width` default; preserves the source\n   * SVG's 655 × 754 aspect ratio.\n   */\n  @Prop() height: string = '600';\n\n  /**\n   * Fill opacity of the paperclip shape. Defaults to `0.06` to match the\n   * marketing-site watermark treatment.\n   */\n  @Prop() opacity: number = 0.06;\n\n  /**\n   * Fill colour. Defaults to `white` (designed for inkwell backgrounds);\n   * override for other themes, e.g. `var(--colour-brand-inkwell)` on a\n   * mist-green section.\n   */\n  @Prop() fill: string = 'white';\n\n  render() {\n    return (\n      <Host>\n        <svg\n          aria-hidden=\"true\"\n          width={this.width}\n          height={this.height}\n          viewBox=\"0 0 655 754\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          preserveAspectRatio=\"none\"\n        >\n          <path\n            d=\"M1102.14 108.279C1031.8 37.5181 939.128 -1.06817 840.61 0.447304H358.674L262.104 157.124H841.87C842.558 157.124 843.36 157.124 844.047 157.124C900.638 157.124 953.791 179.273 994 219.725C1035.24 261.225 1058.04 316.715 1058.04 376.052C1058.04 497.872 960.665 596.844 841.068 596.844H251.335C197.609 596.844 153.848 552.313 153.848 497.639C153.848 442.965 197.723 397.734 251.221 396.102H779.208L878.872 239.426H248.586C111.577 242.923 0 358.682 0 497.639C0 636.596 112.723 753.404 251.335 753.404H841.068C1045.55 753.404 1212 584.021 1212 375.935C1212 274.398 1173.05 179.39 1102.26 108.162L1102.14 108.279Z\"\n            fill={this.fill}\n            fill-opacity={this.opacity}\n          />\n        </svg>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,wBAAwB,GAAG,6DAA6D;;MCiCjF,qBAAqB,GAAA,MAAA;AALlC,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;;;;;AAMG;AACK,QAAA,IAAK,CAAA,KAAA,GAAW,KAAK;AAE7B;;;;AAIG;AACK,QAAA,IAAM,CAAA,MAAA,GAAW,KAAK;AAE9B;;;AAGG;AACK,QAAA,IAAO,CAAA,OAAA,GAAW,IAAI;AAE9B;;;;AAIG;AACK,QAAA,IAAI,CAAA,IAAA,GAAW,OAAO;AAuB/B;IArBC,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,aAAA,EACc,MAAM,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,mBAAmB,EAAC,MAAM,EAAA,EAE1BA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,imBAAimB,EACnmB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAA,cAAA,EACD,IAAI,CAAC,OAAO,GAC1B,CACE,CACD;;;;;;;"}

package/dist/cjs/af-progress-line.cjs.entry.js

@@ -21,10 +21,10 @@ const AfProgressLine = class {
         // Clamp progress between 0 and 1
         const clampedProgress = Math.max(0, Math.min(1, this.progress));
         const progressPercent = clampedProgress * 100;
-        return (index.h(index.Host, { key: 'b09e523a63bdb6ea6084e98e6fb8030840648f27' }, index.h("div", { key: 'eda92bcf3b0f9d92edfb32299953b984520cc413', class: {
+        return (index.h(index.Host, { key: 'f56ae490d0d9e374f540ccb88b0af53430796b42' }, index.h("div", { key: '20832426b290b5ee44d0507848f1cd4f06973202', class: {
                 'progress-line': true,
                 [`progress-line--${this.orientation}`]: true,
-            }, role: "progressbar", "aria-valuenow": Math.round(progressPercent), "aria-valuemin": 0, "aria-valuemax": 100 }, index.h("div", { key: 'cf4748fdaf9a5e1f410e4bf16acaf6ebd80a931b', class: "progress-line__background" }), index.h("div", { key: '3c20e0c290595e97b5e34a6e788297e180494add', class: "progress-line__active", style: { width: `${progressPercent}%` } }))));
+            }, role: "progressbar", "aria-valuenow": Math.round(progressPercent), "aria-valuemin": 0, "aria-valuemax": 100 }, index.h("div", { key: '19623163676a5fd71c7b5ba91b33f53d188647c9', class: "progress-line__background" }), index.h("div", { key: '0bd6ccd0748930edd43a384bf8ddad55f8c9d07b', class: "progress-line__active", style: { width: `${progressPercent}%` } }))));
     }
 };
 AfProgressLine.style = afProgressLineCss;

package/dist/cjs/af-section.cjs.entry.js

@@ -15,8 +15,8 @@ const AfSection = class {
         this.container = true;
     }
     render() {
-        const content = index.h("slot", { key: '6c300093d45c3f5a029ef4ad367fb6796c392d56' });
-        return (index.h(index.Host, { key: '05da4bf23a6c5aba61b21d1536cf615cd0176cfb' }, index.h("div", { key: '3ec6bacbd5acef49183afa406efbe9301287a086', class: `section padding-${this.padding} theme-${this.theme}` }, this.container ? (index.h("af-container", null, content)) : content)));
+        const content = index.h("slot", { key: 'fd7304dd713f0cbad475910d56fd9e2622068fad' });
+        return (index.h(index.Host, { key: 'f1758977b8ce080e03631629507f33759d1696d9' }, index.h("div", { key: 'af0fd30917df8a59cf7d441e9346ed643672aaec', class: `section padding-${this.padding} theme-${this.theme}` }, this.container ? (index.h("af-container", null, content)) : content)));
     }
 };
 AfSection.style = afSectionCss;

package/dist/cjs/af-show.cjs.entry.js

@@ -14,7 +14,7 @@ const AfShow = class {
             [`show-above-${this.above}`]: !!this.above,
             [`show-below-${this.below}`]: !!this.below,
         };
-        return (index.h(index.Host, { key: '5fcd914caa419668e4783e20fd427d25af19f769', class: classes }, index.h("slot", { key: '8e2d9c0e1df36a0e49c65956241d24ffb956bf96' })));
+        return (index.h(index.Host, { key: '42763e1aa4b245a42a4319ee3db31277b1bbca79', class: classes }, index.h("slot", { key: '0f88b298410118de3a3963b30d48b24c180f6a86' })));
     }
 };
 AfShow.style = afShowCss;

package/dist/cjs/af-social-link.cjs.entry.js

@@ -31,7 +31,7 @@ const AfSocialLink = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'fe837fca1e27062dd707f9b5e58e5ce6d9c95cf8' }, index.h("a", { key: '78dde128f42950f3c1a51770c0a431ad16df03fb', href: this.href, target: "_blank", rel: "noopener noreferrer", class: "social-link", "aria-label": this.label }, this.renderIcon())));
+        return (index.h(index.Host, { key: 'ae4db8c4baeea96b707faf5581c5e5970019fad6' }, index.h("a", { key: '53e90930c51f30fa0ec74773234b06e3c2e06d6c', href: this.href, target: "_blank", rel: "noopener noreferrer", class: "social-link", "aria-label": this.label }, this.renderIcon())));
     }
 };
 AfSocialLink.style = afSocialLinkCss;

package/dist/cjs/af-spacer.cjs.entry.js

@@ -36,7 +36,7 @@ const AfSpacer = class {
                 style.height = sizeValue;
             }
         }
-        return index.h(index.Host, { key: 'babcc0cce83253929d43a83856149296b0ea880b', style: style, "aria-hidden": "true" });
+        return index.h(index.Host, { key: '0ffa6692a18f469b5fe09385e268b1a43f5fdbe9', style: style, "aria-hidden": "true" });
     }
 };
 AfSpacer.style = afSpacerCss;

package/dist/cjs/af-split-section.cjs.entry.js

@@ -25,14 +25,14 @@ const AfSplitSection = class {
         this.container = true;
     }
     render() {
-        const content = index.h("slot", { key: 'e56b2c06d21917dc745f308867026b2898a08ddf' });
+        const content = index.h("slot", { key: '25574554f5f24e11488e1b94842229b7b87b3ffe' });
         // Create the split background using CSS gradient
         const topColor = themeColors[this.topTheme];
         const bottomColor = themeColors[this.bottomTheme];
         const backgroundStyle = {
             background: `linear-gradient(to bottom, ${topColor} 0%, ${topColor} 50%, ${bottomColor} 50%, ${bottomColor} 100%)`
         };
-        return (index.h(index.Host, { key: 'f1f5610bc3789c1038efc9c82a22f9e1c400ed36' }, index.h("div", { key: 'ed7dd397f532c9daa67588edfd1861979859a70c', class: `split-section padding-${this.padding} top-theme-${this.topTheme}`, style: backgroundStyle }, this.container ? (index.h("af-container", null, content)) : content)));
+        return (index.h(index.Host, { key: '5745d7d5c8b238a4959a53f820498bf348b1c668' }, index.h("div", { key: 'a2b8760b663800015b120c2ad82b004bced9882f', class: `split-section padding-${this.padding} top-theme-${this.topTheme}`, style: backgroundStyle }, this.container ? (index.h("af-container", null, content)) : content)));
     }
 };
 AfSplitSection.style = afSplitSectionCss;

package/dist/cjs/af-stack.cjs.entry.js

@@ -55,7 +55,7 @@ const AfStack = class {
             justifyContent: justifyMap[this.justify],
             flexWrap: this.wrap ? 'wrap' : 'nowrap',
         };
-        return (index.h(index.Host, { key: '2be027b85f3b9167ec237f8b046d41c68e92eaea', style: style }, index.h("slot", { key: 'df553b2b049139b4dbbb8b8794098dec439d3642' })));
+        return (index.h(index.Host, { key: 'bf6f8a0e7454bbdf4a55a5723a32b40bef78805b', style: style }, index.h("slot", { key: '54e82fd4bc6ca19d8b29ed424a2c7d54a8784a22' })));
     }
 };
 AfStack.style = afStackCss;

package/dist/cjs/af-stat.cjs.entry.js

@@ -9,7 +9,7 @@ const AfStat = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '7aa910b1138ba826e4b9b6e9b829cde4e512ebfe' }, index.h("div", { key: '0b8301efd14d2e4275f508b4a3b21bb7130c5308', class: "stat" }, index.h("af-heading", { key: '4ed345a252ef232354b03ed2e393f943aa7d6d2f', level: "2", class: "stat__value" }, this.value), index.h("af-text", { key: 'ea32cadc8a0b216d1bd0929e8b68d8c19121690b', variant: "medium", class: "stat__label" }, this.label))));
+        return (index.h(index.Host, { key: 'db2aa04e087c7313db9dde512368413ea6428d38' }, index.h("div", { key: '72f0578398f5d82dcd27bf7e4102f9801f1067b3', class: "stat" }, index.h("af-heading", { key: '1accbab198a0923be4af5b5b6c0e7e5ca82c36b5', level: "2", class: "stat__value" }, this.value), index.h("af-text", { key: '533ea04317fb66451e7d130369b25080e37cff41', variant: "medium", class: "stat__label" }, this.label))));
     }
 };
 AfStat.style = afStatCss;

package/dist/cjs/af-stats-row.cjs.entry.js

@@ -9,7 +9,7 @@ const AfStatsRow = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: 'b2bdf61d7367064cabbb1f802436f57e056117ea' }, index.h("div", { key: '84f19a40ac81af985648a0863f90f9622bb06176', class: "stats-row" }, index.h("slot", { key: '605bda456df46717eecafdc7083c0b2e9b259fa0' }))));
+        return (index.h(index.Host, { key: '49538a82264992333834fdc12ec64522cf4242fe' }, index.h("div", { key: '9d567f97bc5f2707fad9e40b8d3ce0c4658db73b', class: "stats-row" }, index.h("slot", { key: 'f48aac6723185f8f10804355da4731f03285d9db' }))));
     }
 };
 AfStatsRow.style = afStatsRowCss;

package/dist/cjs/af-stepper-step.cjs.entry.js

@@ -14,7 +14,7 @@ const AfStepperStep = class {
         this.index = 1;
     }
     render() {
-        return (index.h(index.Host, { key: '7ea12be34ade3e4f2cd3b5453ec13f4b4e2dc613' }, index.h("span", { key: '4be517aa7d2f6e5cf998221d2823d1f6c06167de', class: "stepper-step__badge" }, this.index), index.h("div", { key: 'e13ccd376cf098378bf1ac13ecc61ce9a8aa9cd6', class: "stepper-step__content" }, index.h("div", { key: '9798d19d11031998955c9df2a09fda210c1c96ee', class: "stepper-step__heading" }, index.h("slot", { key: '1ecaba03758b8109fa2d861cfaa09e7e41873f7e', name: "heading" })), index.h("div", { key: '21efd7b8aa67137f72044c31f4719eac1802fea3', class: "stepper-step__body" }, index.h("slot", { key: '73a42fef64c764bf96513914d4a0912f51516832', name: "body" })))));
+        return (index.h(index.Host, { key: 'd7c49caaec94513a798ff851f8975b2df55848ce' }, index.h("span", { key: 'd8f9d57de5434a961c217b57ac220f8930d17f6f', class: "stepper-step__badge" }, this.index), index.h("div", { key: '62204e81ed7bfd36d342da448ea0ea8852e16854', class: "stepper-step__content" }, index.h("div", { key: '40edc0e5973fabcfa781195e64fa0446d6be0e0c', class: "stepper-step__heading" }, index.h("slot", { key: '090302f455303956e2b6185a2e30d41d13b489e0', name: "heading" })), index.h("div", { key: '5fd26c30a269068568e95007f84dda0912a4bde4', class: "stepper-step__body" }, index.h("slot", { key: '5f3f4178f54edbbf05be6cd3df74a30bc2e18f96', name: "body" })))));
     }
 };
 AfStepperStep.style = afStepperStepCss;

package/dist/cjs/af-stepper.cjs.entry.js

@@ -24,7 +24,7 @@ const AfStepper = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: 'c0f67912f1725dcc8cce09bb7fc87ef2b61f0153', class: `stepper stepper--${this.orientation}` }, index.h("div", { key: '190ee10d7b204a387cda11019275018becb7700f', class: "stepper__connector", "aria-hidden": "true" }), index.h("slot", { key: 'af02da9d06b1b29850686f66e941403ac765e5d0' })));
+        return (index.h(index.Host, { key: 'a8aeeb5a9274e24d0e3b4daf84f5ba4f30ce47d3', class: `stepper stepper--${this.orientation}` }, index.h("div", { key: 'aa2263b4a10e144c376b6afad896f83d9c642a88', class: "stepper__connector", "aria-hidden": "true" }), index.h("slot", { key: '6ff6d3ce84bd8c06599ef5e8e9244d210e16578a' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/af-tab-bar.cjs.entry.js

@@ -78,7 +78,7 @@ const AfTabBar = class {
             [`shape-${this.shape}`]: true,
             [`breakpoint-${this.breakpoint}`]: true,
         };
-        return (index.h(index.Host, { key: 'b1fa40c2156ac7271650aafd27d369c3a8224f44', role: "tablist" }, index.h("div", { key: 'e92eaef79f5df92cca1b2170218df2668afc031d', class: containerClasses }, index.h("slot", { key: '307aea867005fe40899b54d9fe1e31ecca0528e8' }))));
+        return (index.h(index.Host, { key: '41e03f4561dc7f11c19b533e659b07053f08a5e3', role: "tablist" }, index.h("div", { key: '191491f64e3d77fafe58e241f777a6a9e3b79e04', class: containerClasses }, index.h("slot", { key: '181e1169bd9215cb99d8bd0dabeaa49aac5fc24a' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/af-tab.cjs.entry.js

@@ -55,7 +55,7 @@ const AfTab = class {
             'disabled': this.disabled,
             [`shape-${this.shape}`]: true,
         };
-        return (index.h(index.Host, { key: '5127117fc8ffbf1ed62de57af0a3ba569398bd0b' }, index.h("button", { key: 'e32591d0448724b7ead02702b21c5f31518bf982', class: tabClasses, role: "tab", "aria-selected": this.active ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, tabindex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown, disabled: this.disabled }, this.displayNumber && (index.h("span", { key: '2d9756769c9a9442e632faac4710eceb6ec7dcb2', class: "number-slot" }, index.h("slot", { key: 'fc9b02645ada6c015cbdb07db5d02c7f8fee9320', name: "number" }))), this.displayIcon && (index.h("span", { key: '8f9ef1b8cec03bea2231a0cc19a91537b84de31f', class: "icon-slot" }, index.h("slot", { key: '9fae54937c7876df37624aa8928dbfe478bec556', name: "icon" }))), index.h("span", { key: 'e332be1f9007beb3bed7bc4b74480f0fcacd8a6e', class: "label" }, this.label))));
+        return (index.h(index.Host, { key: '9e477df87e7bd6442e9f755d3caaf99e4138c60e' }, index.h("button", { key: 'b7f4504a1be24fb9db831fbf6ca4da535b7eb200', class: tabClasses, role: "tab", "aria-selected": this.active ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, tabindex: this.disabled ? -1 : 0, onClick: this.handleClick, onKeyDown: this.handleKeyDown, disabled: this.disabled }, this.displayNumber && (index.h("span", { key: 'd3dbb0dda4a819304ef8a70b34379c6b7fd2d85f', class: "number-slot" }, index.h("slot", { key: '2a1b2881d7fcd689f3e4e5e4e06407084690966c', name: "number" }))), this.displayIcon && (index.h("span", { key: 'b07f1d3f8c723ec260cfa4900e51f7581d2f8024', class: "icon-slot" }, index.h("slot", { key: '6b80404c46e77ab06d3ca24a108fbea231420867', name: "icon" }))), index.h("span", { key: 'e657d5ffa4938fb85dd165e8679eff694cbb357e', class: "label" }, this.label))));
     }
 };
 AfTab.style = afTabCss;

package/dist/cjs/af-tag.cjs.entry.js

@@ -23,11 +23,11 @@ const AfTag = class {
     render() {
         const TagElement = this.href ? 'a' : 'span';
         const linkProps = this.href ? { href: this.href } : {};
-        return (index.h(index.Host, { key: '6317b50a0fa62e85bfb9141a6653494cc2b1892d' }, index.h(TagElement, { key: 'b9b13cf62afe67ccd4aaac53dbc44b736afd0084', class: {
+        return (index.h(index.Host, { key: '95d6f9fcae0b4117edc2bd0918feeeee3ab32d17' }, index.h(TagElement, { key: 'fb6f02834d02b8b5b43b3052f72688a99ea9f6d4', class: {
                 'tag': true,
                 [`size-${this.size}`]: true,
                 [`variant-${this.variant}`]: true,
-            }, ...linkProps }, index.h("slot", { key: 'd4f5a9e748fd2a155845c9ad7bd5f414a25f694f' }))));
+            }, ...linkProps }, index.h("slot", { key: 'a259918d262801ee8f005374ee2517535bcbd6f8' }))));
     }
 };
 AfTag.style = afTagCss;

package/dist/cjs/af-testimonial-carousel.cjs.entry.js

@@ -92,7 +92,7 @@ const AfTestimonialCarousel = class {
         return (this.currentIndex + 1) / this.testimonialCount;
     }
     render() {
-        return (index.h(index.Host, { key: '2aae30a8996d65e6bb85883f41d9be0389e6945c' }, index.h("div", { key: '702073a8a2d720e24f5d80204ce01b7f43e52633', class: "testimonial-carousel" }, index.h("div", { key: '405781a22ac921805d28110c6784ee284fd696f9', class: "testimonial-slides" }, index.h("slot", { key: 'ed0a41a5fa386a2472dc9d0c0e7013c1a673850d' })), this.testimonialCount > 1 && (index.h("div", { key: 'f65ff8b896e4ae6667d9c4cf2282cdd5d7b3126c', class: "testimonial-progress" }, index.h("af-progress-line", { key: 'db4f70a9c5981820f053ae63cf23958840433f78', progress: this.getProgress() }))))));
+        return (index.h(index.Host, { key: '22b5bf9b57d64d03969fceef7c63a235cc3b28bb' }, index.h("div", { key: '4522d4d723ed18d9c700276d2fa55ec3a78618d2', class: "testimonial-carousel" }, index.h("div", { key: '3dc008449b1b7236ad5bb4f5a641b4635452dd1b', class: "testimonial-slides" }, index.h("slot", { key: '2e6503ea2a6aaa0cfa04552668f07d88c9169b43' })), this.testimonialCount > 1 && (index.h("div", { key: '7531aeca557692b0c6fad26031e9da67fe76a2a5', class: "testimonial-progress" }, index.h("af-progress-line", { key: 'a72e2ae998da694906a261a9e505035e5306b93b', progress: this.getProgress() }))))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/af-testimonial-stat.cjs.entry.js

@@ -13,7 +13,7 @@ const AfTestimonialStat = class {
         this.accentBorder = false;
     }
     render() {
-        return (index.h(index.Host, { key: 'b7d49238a1751411a02158e697b3fd102734df05' }, index.h("div", { key: 'e9dba52bac336fe49d6167c4797e83ddf9edca4f', class: `stat ${this.accentBorder ? 'stat--accent' : ''}` }, index.h("af-heading", { key: '15f6e7e2e1719639c8f3996bf89e79e928a5fd86', level: 2, class: "stat-value" }, this.value), index.h("af-text", { key: '977d2e4675e0fc7d6e590da64f92e4c180b79dbf', variant: "medium", class: "stat-description" }, this.description))));
+        return (index.h(index.Host, { key: '91a17ccf44b3306f2fad218201c0df9d541bdefd' }, index.h("div", { key: '6df0dc851385ea20371197016c421365ef230fc4', class: `stat ${this.accentBorder ? 'stat--accent' : ''}` }, index.h("af-heading", { key: 'dae1f4350a927c43a44d3030c39d9a6e4fd46f11', level: 2, class: "stat-value" }, this.value), index.h("af-text", { key: '06db3eac580389a28974e9841d52b1175aa3d00a', variant: "medium", class: "stat-description" }, this.description))));
     }
 };
 AfTestimonialStat.style = afTestimonialStatCss;

package/dist/cjs/af-testimonial.cjs.entry.js

@@ -29,11 +29,11 @@ const AfTestimonial = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: '731b22cd73117b5150774e4a942269fefee68af3' }, index.h("div", { key: '97be7f81adea9e75629482ada37806e4be7a4e88', class: "testimonial-card" }, index.h("div", { key: '09d053f7292c0e5c34aac45313081ffc2aca57d3', class: "testimonial-image" }, this.backgroundImage && (index.h("img", { key: 'ea8e17ad2b1647f01bcbf16dc8a141baf30490dc', src: this.backgroundImage, alt: "", class: "testimonial-bg-image" })), this.logoImage && (index.h("div", { key: '84da201c5c63f70bee5830aeecbed9de50586c62', class: "testimonial-logo" }, index.h("img", { key: '0e0daf826a8be6efcb39e5d2d2ec78f3feb5df54', src: this.logoImage, alt: "Company logo" })))), index.h("div", { key: '6d25d332c3c2821a9420a041eae26f1c26ccf394', class: "testimonial-content" }, index.h("div", { key: '3051e3ad9b0d85dbf553b1bb0ff3aa0b2e4863ce', class: "testimonial-quote-section" }, index.h("div", { key: '6d0dc3e296a05d9185a97e2f796cc31731d2667e', class: "testimonial-quote-icon" }, index.h("slot", { key: '7b09d4c26868e371bf41146b99f8d07247a1a288', name: "quote-icon" }, index.h("af-icon", { key: '728720f7a1214a4471f1812f8ae87ce5fae77c2f', name: "quote", size: 48 }))), index.h("div", { key: 'd7fc3a5d8adbd9c5be02664a09c53703fdd00395', class: "testimonial-text" }, index.h("slot", { key: 'b3bf6aa863a2124ca86b84b21c804089c70e976e', name: "quote-body" }, this.quote)), index.h("div", { key: '233f082b2c42896306f6fb7f9686f2f2f6496428', class: "testimonial-attribution" }, this.attribution)), index.h("div", { key: '1ba7fb4a9d100609a227fa63fa6b6be9988364a7', class: "testimonial-stats" }, index.h("slot", { key: '6fa48aaef4606aae2d76f172948ea3950d635a2f', name: "stats" })), index.h("div", { key: '8bd5923a156d1c86df98cb6a2f3d9daef91f7916', class: "testimonial-footer" }, index.h("div", { key: '9959b29b05a9ce368ed9d4797e321799dea15789', class: "testimonial-nav" }, this.showNavigation ? (
+        return (index.h(index.Host, { key: '80a3efe588282b01d52658687773625f288a4b3e' }, index.h("div", { key: '1bab71c2e9cd9642b974581ab1e81b4409c3db33', class: "testimonial-card" }, index.h("div", { key: '757017d5e835d315098347d6ed57289f21c027d7', class: "testimonial-image" }, this.backgroundImage && (index.h("img", { key: 'b34a06a82ca938e81e79380a6b5722bd078131f7', src: this.backgroundImage, alt: "", class: "testimonial-bg-image" })), this.logoImage && (index.h("div", { key: 'dba031936873eccadad941db017d5984088f0a50', class: "testimonial-logo" }, index.h("img", { key: '078fc2154e5adc48b7f75f5a93031ef1eecd0d41', src: this.logoImage, alt: "Company logo" })))), index.h("div", { key: '9f54287503b26830cfe219f34e4d761726f9f8b9', class: "testimonial-content" }, index.h("div", { key: 'b6c72479f48f7069cca0836f983bedb5ca0d7616', class: "testimonial-quote-section" }, index.h("div", { key: '5e89e9efd6e138724dc3e61179944673e1171eba', class: "testimonial-quote-icon" }, index.h("slot", { key: '286f01b50320b8cbe558cdc843c1ba1da3ef5068', name: "quote-icon" }, index.h("af-icon", { key: 'f960ac4275fb9bd80fdcee5f1de5fc5873e325d5', name: "quote", size: 48 }))), index.h("div", { key: '57339e4a4c65e4525f2f04b8374734c4c71ecb93', class: "testimonial-text" }, index.h("slot", { key: '35db736d11a36fbb91ce4f5a289f04cac83be2e5', name: "quote-body" }, this.quote)), index.h("div", { key: '35db245f0a6324e5c3322cd5c4cf8206762c9ad3', class: "testimonial-attribution" }, this.attribution)), index.h("div", { key: '67dbc98ab75bc036ca4b3f3976505345421231ef', class: "testimonial-stats" }, index.h("slot", { key: 'd7499af5422f112c42cfd815fec43e9743876021', name: "stats" })), index.h("div", { key: '0e557948da1a17d10b2e75f8f2cb9193a6ca6c07', class: "testimonial-footer" }, index.h("div", { key: 'f942dacf7c4676be08b88c4ec6a5bfd8115e2e04', class: "testimonial-nav" }, this.showNavigation ? (
         // Render built-in navigation buttons
         index.h("div", { class: "testimonial-nav-buttons" }, index.h("af-icon-button", { variant: "secondary", disabled: !this.hasPrev, onClick: this.handlePrev, ariaLabel: "Previous testimonial" }, index.h("af-icon", { name: "arrow-left", size: 24 })), index.h("af-icon-button", { variant: "secondary", disabled: !this.hasNext, onClick: this.handleNext, ariaLabel: "Next testimonial" }, index.h("af-icon", { name: "arrow-right", size: 24 })))) : (
         // Allow custom navigation via slot
-        index.h("slot", { name: "navigation" }))), this.readMoreLink && (index.h("af-button", { key: '1a88e42fae5e0b6d12e2a89ff7bcd4fd67ec33d1', variant: "secondary", href: this.readMoreLink }, "Read full story", index.h("af-icon", { key: 'c024eaef94ee44a1fe65415778cc573b63741a97', slot: "icon-right", name: "arrow-right", size: 24 }))))))));
+        index.h("slot", { name: "navigation" }))), this.readMoreLink && (index.h("af-button", { key: '6197b00d781b08eec10bf487918deed969408df4', variant: "secondary", href: this.readMoreLink }, "Read full story", index.h("af-icon", { key: '2cdf53d215a417beff6e8edf20f510ee68d176ab', slot: "icon-right", name: "arrow-right", size: 24 }))))))));
     }
 };
 AfTestimonial.style = afTestimonialCss;

package/dist/cjs/af-text-image-nest.cjs.entry.js

@@ -21,7 +21,7 @@ const AfTextImageNest = class {
             'nest__grid': true,
             [`grid-${this.layout}`]: true,
         };
-        return (index.h(index.Host, { key: 'c0932581b26fbbba8f67a214ccd2e0c05add427c' }, index.h("div", { key: '811bf5a068bbf597df03b9f6fe79d96d32a21b0a', class: containerClasses }, index.h("div", { key: '351337cb9cecea663f7ec017e4b373ed15e9fbc5', class: "nest__content" }, index.h("div", { key: '80a2695415830da74e6926df555e20899e94b15f', class: gridClasses }, index.h("slot", { key: '2971cbdba5249c9ad4af96cbb90e570faf638fe3' })), index.h("div", { key: '849c3b397d2a5b0eaf22fec4b69873ae49906732', class: "nest__footer" }, index.h("slot", { key: '7fdaf48586387028c8b5678dea632c788ac9a672', name: "buttons" }))))));
+        return (index.h(index.Host, { key: 'e250c2528e02050ea4debe9685eae3b6053a98b2' }, index.h("div", { key: '2af2eb56c3f384a12f4fcf1cefc155bb5a063a38', class: containerClasses }, index.h("div", { key: '270a0bf4748ab56477d0b9d79ebf4f4bbb122ac3', class: "nest__content" }, index.h("div", { key: '76013f327279d631b59a97d659b6c6932d967041', class: gridClasses }, index.h("slot", { key: '50c5772a355f729671ad38eb745f06040cecac16' })), index.h("div", { key: 'd285fc3f8a66b869bfda14beb9903e19f9d0de84', class: "nest__footer" }, index.h("slot", { key: '2f416cc2f07fb24149b8b8f9190c3fa7f8efe034', name: "buttons" }))))));
     }
 };
 AfTextImageNest.style = afTextImageNestCss;

package/dist/cjs/af-textarea.cjs.entry.js

@@ -66,6 +66,17 @@ const AfTextarea = class {
             this.afInfoClick.emit();
         };
     }
+    componentWillLoad() {
+        if (typeof console !== 'undefined' && !AfTextarea.deprecationWarned) {
+            AfTextarea.deprecationWarned = true;
+            // eslint-disable-next-line no-console
+            console.warn('[@affinda/wc] <af-textarea> is deprecated and will be removed in a ' +
+                'future major release. Use <af-input multiline> instead — same props ' +
+                '(label, description, placeholder, value, name, disabled, required, ' +
+                'readonly, error, showInfoIcon, rows, resize, maxlength, minlength) ' +
+                'and same rendered chrome. See @affinda/wc CHANGELOG for migration.');
+        }
+    }
     render() {
         const hasError = !!this.error;
         const hasValue = !!(this.value && this.value.length > 0);
@@ -84,9 +95,11 @@ const AfTextarea = class {
             'focused': this.isFocused,
             'hovered': this.isHovered && !this.disabled && !this.isFocused
         };
-        return (index.h(index.Host, { key: '84f322a374d364669942e9153c6ba42221af1059' }, index.h("div", { key: '4b5a62e919a479bcf741f2d1d9e39a7b0e1e49ac', class: wrapperClasses }, this.label && (index.h("div", { key: 'e73b88c28588b8f3e5b9823467e8c972fd671391', class: "label-row" }, index.h("label", { key: '01c16777469e037495997efc2cacc51778fcd9c7', class: "label", htmlFor: "textarea" }, this.label, this.required && index.h("span", { key: '6da50443dadd3a6eec5655b4ff2fa19affa38006', class: "required" }, "*")), this.showInfoIcon && (index.h("button", { key: 'c731c726f54946273a330c0173f09faeb9fe583b', type: "button", class: "info-icon", onClick: this.handleInfoClick, "aria-label": "More information" }, index.h("svg", { key: '24a1ee4fb10ebd9a84a897cefef09ad7e7b63565', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '3523e8495fc5ffa06d793318f55ba79043174931', 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" }), index.h("path", { key: 'd2caa0b33fccc6289f00fc22fc329df52d86a6ed', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { key: 'db8d8ee03abe2638265d192be6efb992a6041199', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), index.h("slot", { key: '8325f2fc490d8261a596398da7cc68d74ccfce11', name: "label-end" }))), this.description && (index.h("p", { key: '7db9b0e06615f5a13b7759cd81c23ee6ab124769', class: "description" }, this.description)), index.h("div", { key: '939c306f7a56735956e2ef4badeb4cfa39abf759', class: textareaContainerClasses, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, index.h("textarea", { key: '0dffd719ed83955990ae1935fb8d39ab92fd9b94', ref: (el) => this.textareaEl = el ?? undefined, id: "textarea", class: "textarea", name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, required: this.required, readonly: this.readonly, rows: this.rows, maxlength: this.maxlength, minlength: this.minlength, style: { resize: this.resize }, "aria-invalid": hasError ? 'true' : undefined, "aria-describedby": hasError ? 'error-message' : this.description ? 'description' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur })), hasError && (index.h("div", { key: '1f7f83da7518216eb63ff9cb685ffb92b3b37fb1', class: "error-row", id: "error-message" }, index.h("span", { key: 'a1af53a449805506ac0abddae3a236232a538bd9', class: "error-icon" }, index.h("svg", { key: 'b52e5c14a8986c502e1e0dce8a95c7d381c7a8e3', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'af8c97b747c960065f7461e84c893e644b66d9c5', 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" }), index.h("path", { key: '145226126e4ba52c6234b3c454e43d87b495789c', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { key: '7b94917ac5c96c6abbfc93826b07fa967b49506a', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), index.h("span", { key: '9f097e0c43b1a6b19d0275fed8a216e901ce2d86', class: "error-text" }, this.error))))));
+        return (index.h(index.Host, { key: '362cc1d8d9a12a1622a3a4368c1690af22242290' }, index.h("div", { key: '2b5193878afd041a2404e05628c8a2a27f070dd4', class: wrapperClasses }, this.label && (index.h("div", { key: 'a4786205092ce86aa5d2b13b2eefc068776bc73c', class: "label-row" }, index.h("label", { key: '9f674738598a0d8cd6ff3ca12d2eef1b82c683ab', class: "label", htmlFor: "textarea" }, this.label, this.required && index.h("span", { key: 'e65cfaf5de0806fdaee3fd69fa142dbe80092377', class: "required" }, "*")), this.showInfoIcon && (index.h("button", { key: 'b9c83365313296a885eced01f5e32d3880d0e6b6', type: "button", class: "info-icon", onClick: this.handleInfoClick, "aria-label": "More information" }, index.h("svg", { key: 'f27bd125dad6258d48b27dce04ee3c91a9e765dd', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '9bfaed8ee3d846caad4cf6841e3a9deb4a050686', 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" }), index.h("path", { key: '0c733ab918ce62dac76ff223eb7a361e11b444f1', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { key: '9d2fd2885490c9563c48bdc40b988e6b6ed6d899', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), index.h("slot", { key: 'a488fc5ce906aa2c6d36e3d1c5c6dc20955dfa7e', name: "label-end" }))), this.description && (index.h("p", { key: '2b27b3f5362d87d9eef7a2261d324b7db03dbd7c', class: "description" }, this.description)), index.h("div", { key: 'f900a4a8d7231bc43c41a77c331e6c90f8772c67', class: textareaContainerClasses, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, index.h("textarea", { key: 'f48df2967a6d72daa2b93c635882c72021af33e7', ref: (el) => this.textareaEl = el ?? undefined, id: "textarea", class: "textarea", name: this.name, value: this.value, placeholder: this.placeholder, disabled: this.disabled, required: this.required, readonly: this.readonly, rows: this.rows, maxlength: this.maxlength, minlength: this.minlength, style: { resize: this.resize }, "aria-invalid": hasError ? 'true' : undefined, "aria-describedby": hasError ? 'error-message' : this.description ? 'description' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur })), hasError && (index.h("div", { key: '8793024cd9c7dec0a19a1acd789ecd8ed57f7168', class: "error-row", id: "error-message" }, index.h("span", { key: 'dc457887b83f8c9fea7daca0bf5a0690474c4f49', class: "error-icon" }, index.h("svg", { key: 'd8c6d985c7c219419072943adab3819217fb1ae4', viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '75265f2e70dd27201b09033b4b5100df51d876f5', 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" }), index.h("path", { key: 'b4225c6f1ae0e3246ad143fe6f2157daa615fcb6', d: "M12 16V12", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), index.h("path", { key: '48735f9ef113826e43488e0491d34a3b549924e5', d: "M12 8H12.01", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), index.h("span", { key: '6a0a7e436977e6ecc37dd64db30aad7eb189e166', class: "error-text" }, this.error))))));
     }
 };
+/** @internal */
+AfTextarea.deprecationWarned = false;
 AfTextarea.style = afTextareaCss;
 
 exports.af_textarea = AfTextarea;