@ukic/web-components 2.38.0 → 2.38.1

package/dist/core/p-bc89defc.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icTextFieldCss","inputIds","MUTABLE_ATTRIBUTES","IC_INHERITED_ARIA","TextField","this","inheritedAttributes","hostMutationObserver","getNumberOfCharacters","value","undefined","length","getMaxLengthExceeded","numChars","type","minValueUnattained","Number","min","maxValueExceeded","max","maxLength","maxLengthExceeded","getMaxCharactersReached","maxCharactersReached","maxCharacters","maxCharactersError","onInput","ev","target","icInput","emit","onBlur","minCharactersUnattained","minCharacters","icBlur","onFocus","icFocus","hasStatus","status","disabled","handleFormReset","initialValue","hostMutationCallback","mutationList","forceComponentUpdate","forEach","attributeName","addedNodes","removedNodes","includes","el","getAttribute","checkSlotInChildMutations","forceUpdate","showValidation","maxNumChars","readonly","emptyString","isEmptyString","validationStatus","validationText","valueOutsideRange","charOutsideRange","validationInlineInternal","inputId","watchDisabledHandler","removeDisabledFalse","debounceChanged","icChange","debounceEvent","debounce","watchValueHandler","newValue","inputEl","connectedCallback","disconnectedCallback","removeFormResetListener","_a","disconnect","componentWillLoad","inheritAttributes","addFormResetListener","componentDidLoad","onComponentRequiredPropUndefined","prop","label","propName","getValidationText","MutationObserver","observe","attributes","childList","handleKeyDown","icKeydown","event","setFocus","focus","render","name","required","size","small","placeholder","helperText","rows","resize","validationInline","spellcheck","inputmode","fullWidth","truncateValue","hiddenInput","disabledMode","currentStatus","IcInformationStatus","Warning","Error","currentValidationText","maxLengthMessage","messageAriaLive","showStatusText","Success","multiline","hiddenCharCountDescId","describedBy","getInputDescribedByText","trim","disabledText","showLeftIcon","querySelector","invalid","renderHiddenInput","removeHiddenInput","h","Host","class","hideLabel","for","multiLine","slot","Object","assign","id","ref","ariaActiveDescendant","ariaExpanded","ariaOwns","autocomplete","autocapitalize","autoFocus","role","maxlength","minlength","isSlotUsed","message","ariaLiveMode","variant","hidden"],"sources":["src/components/ic-text-field/ic-text-field.css?tag=ic-text-field&encapsulation=shadow","src/components/ic-text-field/ic-text-field.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  /**\n   * @prop --input-width: Width of the input field\n   */\n  display: block;\n\n  --ic-input-label-helpertext-padding: var(--ic-space-xxs);\n}\n\n:host(.fullwidth) {\n  width: 100%;\n}\n\n::placeholder {\n  color: var(--ic-color-tertiary-text);\n  opacity: 1;\n}\n\ninput,\ntextarea {\n  border: 0;\n  border-radius: var(--ic-border-radius);\n  background-color: var(--ic-architectural-white);\n  line-height: 1.5rem;\n  letter-spacing: 0.005rem;\n  width: 100%;\n  padding-right: var(--ic-space-xs);\n  padding-left: var(--ic-space-xs);\n}\n\ntextarea {\n  min-height: var(--ic-space-lg);\n  resize: vertical;\n  padding-top: 0.375rem;\n}\n\ninput:focus,\ntextarea:focus {\n  border: 0;\n  outline: 0;\n}\n\ninput:disabled,\ntextarea:disabled {\n  color: var(--ic-architectural-200);\n}\n\ninput.readonly,\ntextarea.readonly {\n  color: var(--ic-color-primary-text);\n}\n\n/* Chrome, Safari, Edge */\ninput::-webkit-outer-spin-button,\ninput::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n/* Firefox */\ninput[type=\"number\"] {\n  -moz-appearance: textfield;\n}\n\ntextarea.no-resize {\n  resize: none;\n}\n\n.maxlengthtext {\n  color: var(--ic-color-secondary-text);\n  padding-right: var(--ic-space-xxxs);\n}\n\n.no-left-pad {\n  padding-left: 0;\n}\n\n::slotted([slot=\"icon\"]) {\n  fill: var(--ic-color-tertiary-text);\n}\n\n.has-value ::slotted([slot=\"icon\"]) {\n  fill: var(--ic-color-primary-text);\n}\n\n.charcount {\n  margin-right: calc(-1 * var(--ic-space-xxxs));\n}\n\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-decoration,\ninput[type=\"search\"]::-webkit-search-results-button,\ninput[type=\"search\"]::-webkit-search-results-decoration {\n  display: none;\n}\n\ninput[type=\"search\"].truncate-value {\n  width: 100%;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n@media (forced-colors: active) {\n  input.readonly,\n  textarea.readonly {\n    color: canvastext;\n  }\n\n  .has-value ::slotted([slot=\"icon\"]) {\n    fill: currentcolor;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  Method,\n  h,\n  forceUpdate,\n} from \"@stencil/core\";\nimport {\n  IcInformationStatus,\n  IcAutocompleteTypes,\n  IcAutocorrectStates,\n  IcInformationStatusOrEmpty,\n  IcValueEventDetail,\n  IcSizesNoLarge,\n} from \"../../utils/types\";\nimport {\n  inheritAttributes,\n  debounceEvent,\n  getInputDescribedByText,\n  renderHiddenInput,\n  isEmptyString,\n  onComponentRequiredPropUndefined,\n  addFormResetListener,\n  removeFormResetListener,\n  isSlotUsed,\n  removeDisabledFalse,\n  checkSlotInChildMutations,\n  removeHiddenInput,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n  IcAriaAutocompleteTypes,\n  IcTextFieldInputModes,\n  IcTextFieldTypes,\n} from \"./ic-text-field.types\";\n\nlet inputIds = 0;\nconst MUTABLE_ATTRIBUTES = [...IC_INHERITED_ARIA, \"title\"];\n\n/**\n * @slot icon - Content will be placed to the left of the text input.\n */\n@Component({\n  tag: \"ic-text-field\",\n  styleUrl: \"ic-text-field.css\",\n  shadow: true,\n})\nexport class TextField {\n  private inheritedAttributes: { [k: string]: string } = {};\n  private inputEl: HTMLInputElement | HTMLTextAreaElement;\n  private hostMutationObserver: MutationObserver = null;\n\n  @Element() el: HTMLIcTextFieldElement;\n\n  @State() numChars: number = 0;\n  @State() maxCharactersReached: boolean = false;\n  @State() maxCharactersError: boolean = false;\n  @State() minCharactersUnattained: boolean = false;\n  @State() maxLengthExceeded: boolean = false;\n  @State() maxValueExceeded: boolean = false;\n  @State() minValueUnattained: boolean = false;\n\n  /**\n   * @slot clear-button - an ic-button clear component will render as an end adornment to the input.\n   * @slot search-submit-button - an ic-button search submit component will render as an end adornment to the input.\n   * @slot menu - an ic-menu component will appear below the input.\n   */\n\n  /**\n   * @internal The active element when focus is on the ic-menu items.\n   */\n  @Prop() ariaActiveDescendant?: string;\n\n  /**\n   * @internal Used to identify whether inputting any text triggers more predictions\n   */\n  @Prop() ariaAutocomplete: IcAriaAutocompleteTypes = undefined;\n\n  /**\n   * @internal Used to identify if the slotted menu is rendered\n   */\n  @Prop() ariaExpanded: string;\n\n  /**\n   * @internal Used to identify any related child component\n   */\n  @Prop() ariaOwns: string;\n\n  /**\n   * The automatic capitalisation of the text value as it is entered/edited by the user.\n   * Available options: \"off\", \"none\", \"on\", \"sentences\", \"words\", \"characters\".\n   */\n  @Prop() autocapitalize = \"off\";\n\n  /**\n   * The state of autocompletion the browser can apply on the text value.\n   */\n  @Prop() autocomplete: IcAutocompleteTypes = \"off\";\n\n  /**\n   * The state of autocorrection the browser can apply when the user is entering/editing the text value.\n   */\n  @Prop() autocorrect: IcAutocorrectStates = \"off\";\n\n  /**\n   * If `true`, the form control will have input focus when the page loads.\n   */\n  @Prop() autoFocus = false;\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled: boolean = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  /**\n   * Specify whether the text field fills the full width of the container.\n   * If `true`, this overrides the --input-width CSS variable.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText: string = \"\";\n\n  /**\n   * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n   */\n  @Prop() hideLabel: boolean = false;\n\n  /**\n   * @internal If `true`, the hidden form input will stop rendering for form submission.\n   */\n  @Prop() hiddenInput: boolean = true;\n\n  /**\n   * The ID for the input.\n   */\n  @Prop() inputId?: string = `ic-text-field-input-${inputIds++}`;\n\n  /**\n   * A hint to the browser for which keyboard to display.\n   * Possible values: `\"none\"`, `\"text\"`, `\"tel\"`, `\"url\"`,\n   * `\"email\"`, `\"numeric\"`, `\"decimal\"`, and `\"search\"`.\n   */\n  @Prop() inputmode: IcTextFieldInputModes = \"text\";\n\n  /**\n   * The label for the input.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The maximum number that can be accepted as a value, when `type` is `number` and `rows` is `1`. (NOTE: Ensure to include visual indication of max value in `helperText` or `label`)\n   */\n  @Prop() max: string | number = undefined;\n\n  /**\n   * The maximum number of characters that can be entered in the field. Will display an error if too many characters are entered.\n   */\n  @Prop() maxCharacters: number = 0;\n\n  /**\n   * The count of characters in the field. Will display a warning if the bound is reached.\n   */\n  @Prop() maxLength: number = 0;\n\n  /**\n   * The text to display as the validation message when the maximum length is exceeded.\n   */\n  @Prop() maxLengthMessage: string = \"Maximum length exceeded\";\n\n  /**\n   * The minimum number that can be accepted as a value, when `type` is `number` and `rows` is `1`. (NOTE: Ensure to include visual indication of min value in `helperText` or `label`)\n   */\n  @Prop() min: string | number = undefined;\n\n  /**\n   * The minimum number of characters that can be entered in the field.\n   */\n  @Prop() minCharacters: number = 0;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.inputId;\n\n  /**\n   * The placeholder value to be displayed.\n   */\n  @Prop() placeholder: string = \"\";\n\n  /**\n   * If `true`, the read only state will be set.\n   */\n  @Prop({ reflect: true }) readonly: boolean = false;\n\n  /**\n   * If `true`, the input will require a value.\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * If `true`, the multiline text area will be resizeable.\n   */\n  @Prop() resize: boolean = false;\n\n  /**\n   * @internal Used to set the role if not default textbox;\n   */\n  @Prop() role: string;\n\n  /**\n   * The number of rows to transform the text field into a text area with a specific height.\n   */\n  @Prop() rows: number = 1;\n\n  /**\n   * The size of the text field component.\n   */\n  @Prop() size?: IcSizesNoLarge = \"default\";\n\n  /**\n   * @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n   */\n  @Prop() small?: boolean = false;\n\n  /**\n   * If `true`, the value of the text field will have its spelling and grammar checked.\n   */\n  @Prop() spellcheck: boolean = false;\n  /**\n   * @internal If `true`, an ellipsis will be displayed at the end of the value if the value is longer than the container.\n   */\n  @Prop() truncateValue?: boolean;\n\n  /**\n   * The type of control to display. The default type is text.\n   */\n  @Prop() type: IcTextFieldTypes = \"text\";\n\n  /**\n   * If `true`, the icon in input control will be displayed - only applies when validationStatus ='success'.\n   */\n  @Prop() validationInline: boolean = false;\n\n  /**\n   *  @internal If `true`, the validation will display inline.\n   */\n  @Prop() validationInlineInternal: boolean = false;\n\n  /**\n   * The validation state - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n  /**\n   * The validation state - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationText: string = \"\";\n\n  /**\n   * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n   */\n  @Prop() debounce: number = 0;\n\n  @Watch(\"debounce\")\n  private debounceChanged() {\n    this.icChange = debounceEvent(this.icChange, this.debounce);\n  }\n\n  /**\n   * The value of the text field.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = \"\";\n  @State() initialValue = this.value;\n\n  @Watch(\"value\")\n  private watchValueHandler(newValue: string): void {\n    if (this.inputEl && this.inputEl.value !== newValue) {\n      this.inputEl.value = newValue;\n    }\n\n    this.getMaxLengthExceeded(newValue);\n\n    this.getMaxCharactersReached(newValue);\n\n    this.icChange.emit({ value: newValue });\n  }\n\n  /**\n   * @internal Emitted when the validationInlineInternal is `true`\n   */\n  @Event() getValidationText: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when input loses focus.\n   */\n  @Event() icBlur: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when input gains focus.\n   */\n  @Event() icFocus: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() icInput: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when a keydown event occurred.\n   */\n  @Event() icKeydown: EventEmitter<{ event: KeyboardEvent }>;\n\n  connectedCallback(): void {\n    this.debounceChanged();\n  }\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.el, this.handleFormReset);\n    this.hostMutationObserver?.disconnect();\n  }\n\n  componentWillLoad(): void {\n    if (this.value !== this.initialValue) {\n      this.watchValueHandler(this.value);\n    }\n\n    this.getMaxLengthExceeded(this.value);\n\n    this.getMaxCharactersReached(this.value);\n\n    this.inheritedAttributes = inheritAttributes(this.el, MUTABLE_ATTRIBUTES);\n\n    if (this.readonly) {\n      this.maxLengthExceeded = false;\n      this.maxValueExceeded = false;\n      this.minValueUnattained = false;\n    }\n\n    addFormResetListener(this.el, this.handleFormReset);\n\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Text Field\"\n    );\n    if (this.validationInlineInternal) {\n      this.getValidationText.emit({ value: this.validationText });\n    }\n\n    this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n    this.hostMutationObserver.observe(this.el, {\n      attributes: true,\n      childList: true,\n    });\n  }\n\n  @Listen(\"keydown\", {})\n  handleKeyDown(ev: KeyboardEvent): void {\n    this.icKeydown.emit({ event: ev });\n    this.maxCharactersError = this.maxCharactersReached;\n  }\n\n  /**\n   * Sets focus on the native `input`.\n   */\n\n  @Method()\n  async setFocus(): Promise<void> {\n    this.inputEl?.focus();\n  }\n\n  private getNumberOfCharacters = (value: string) =>\n    value !== null && value !== undefined ? value.length : 0;\n\n  private getMaxLengthExceeded = (value: string) => {\n    this.numChars = this.getNumberOfCharacters(value);\n\n    if (this.type === \"number\") {\n      this.minValueUnattained = value && Number(value) < Number(this.min);\n      this.maxValueExceeded = Number(value) > Number(this.max);\n    }\n\n    if (this.maxLength > 0) {\n      this.maxLengthExceeded = this.numChars > this.maxLength;\n    }\n  };\n\n  private getMaxCharactersReached = (value: string) => {\n    this.numChars = this.getNumberOfCharacters(value);\n\n    this.maxCharactersReached =\n      this.maxCharacters > 0 ? this.numChars >= this.maxCharacters : false;\n\n    if (this.maxCharactersError && !this.maxCharactersReached) {\n      this.maxCharactersError = false;\n    }\n  };\n\n  private onInput = (ev: Event) => {\n    this.value = (ev.target as HTMLInputElement).value;\n    this.icInput.emit({ value: this.value });\n  };\n\n  private onBlur = (ev: Event) => {\n    const value = (ev.target as HTMLInputElement).value;\n    this.numChars = value.length;\n    this.minCharactersUnattained =\n      this.minCharacters > 0 ? this.numChars < this.minCharacters : false;\n    this.icBlur.emit({ value: value });\n  };\n\n  private onFocus = (ev: Event) => {\n    this.icFocus.emit({ value: (ev.target as HTMLInputElement).value });\n  };\n\n  private hasStatus = (status: IcInformationStatusOrEmpty) =>\n    status !== \"\" && !this.disabled;\n\n  private handleFormReset = (): void => {\n    this.value = this.initialValue;\n  };\n\n  // triggered when attributes of host element change\n  private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n    let forceComponentUpdate = false;\n    mutationList.forEach(\n      ({ attributeName, type, addedNodes, removedNodes }) => {\n        if (MUTABLE_ATTRIBUTES.includes(attributeName)) {\n          this.inheritedAttributes[attributeName] =\n            this.el.getAttribute(attributeName);\n          forceComponentUpdate = true;\n        } else if (type === \"childList\") {\n          forceComponentUpdate = checkSlotInChildMutations(\n            addedNodes,\n            removedNodes,\n            \"icon\"\n          );\n        }\n      }\n    );\n    if (forceComponentUpdate) {\n      forceUpdate(this);\n    }\n  };\n\n  private showValidation = (): boolean => {\n    const maxNumChars = this.readonly ? 0 : this.maxLength;\n    const emptyString =\n      isEmptyString(this.validationStatus) ||\n      isEmptyString(this.validationText);\n    const valueOutsideRange = this.minValueUnattained || this.maxValueExceeded;\n    const charOutsideRange =\n      maxNumChars > 0 ||\n      this.maxCharactersError ||\n      this.minCharactersUnattained;\n    return (\n      (!emptyString || valueOutsideRange || charOutsideRange) &&\n      !this.validationInlineInternal\n    );\n  };\n\n  render() {\n    const {\n      inputId,\n      name,\n      label,\n      required,\n      size,\n      small,\n      placeholder,\n      helperText,\n      rows,\n      resize,\n      disabled,\n      value,\n      min,\n      max,\n      maxLength,\n      numChars,\n      readonly,\n      maxLengthExceeded,\n      maxCharacters,\n      maxCharactersError,\n      maxCharactersReached,\n      minCharacters,\n      minCharactersUnattained,\n      minValueUnattained,\n      maxValueExceeded,\n      validationStatus,\n      validationText,\n      validationInline,\n      validationInlineInternal,\n      spellcheck,\n      inputmode,\n      fullWidth,\n      truncateValue,\n      hiddenInput,\n      showValidation,\n    } = this;\n\n    const disabledMode = readonly || disabled;\n\n    const currentStatus =\n      maxLengthExceeded ||\n      maxValueExceeded ||\n      minValueUnattained ||\n      minCharactersUnattained ||\n      maxCharactersError\n        ? maxCharactersError\n          ? IcInformationStatus.Warning\n          : IcInformationStatus.Error\n        : validationStatus;\n\n    const currentValidationText = maxLengthExceeded\n      ? this.maxLengthMessage\n      : maxCharactersError\n      ? `Maximum input is ${maxCharacters} characters`\n      : maxValueExceeded\n      ? `Maximum value of ${max} exceeded`\n      : minValueUnattained\n      ? `Minimum value of ${min} not met`\n      : minCharactersUnattained\n      ? `Minimum input is ${minCharacters} characters`\n      : validationText;\n\n    const maxNumChars = readonly ? 0 : maxLength;\n    const messageAriaLive =\n      maxLengthExceeded ||\n      maxCharactersError ||\n      maxValueExceeded ||\n      minValueUnattained ||\n      (maxLength === 0 && currentStatus === IcInformationStatus.Error)\n        ? \"assertive\"\n        : \"polite\";\n\n    const showStatusText =\n      this.hasStatus(currentStatus) &&\n      !(currentStatus == IcInformationStatus.Success && validationInline) &&\n      !validationInlineInternal;\n\n    const multiline = rows > 1;\n    const hiddenCharCountDescId =\n      maxLength > 0 ? `${inputId}-charcount-desc` : \"\";\n\n    const describedBy = `${hiddenCharCountDescId} ${getInputDescribedByText(\n      inputId,\n      helperText !== \"\",\n      showStatusText\n    )}`.trim();\n\n    const disabledText = disabledMode && !readonly;\n    const showLeftIcon =\n      !!this.el.querySelector(`[slot=\"icon\"]`) && !disabledText;\n\n    const invalid = `${currentStatus === IcInformationStatus.Error}`;\n\n    hiddenInput\n      ? renderHiddenInput(true, this.el, name, value, disabledMode)\n      : removeHiddenInput(this.el);\n\n    return (\n      <Host class={{ [\"fullwidth\"]: fullWidth }}>\n        <ic-input-container readonly={readonly} disabled={disabledMode}>\n          {!this.hideLabel && (\n            <ic-input-label\n              for={inputId}\n              label={label}\n              helperText={helperText}\n              required={required}\n              disabled={disabledText}\n              readonly={readonly}\n            ></ic-input-label>\n          )}\n\n          <ic-input-component-container\n            size={small ? \"small\" : size}\n            validationStatus={currentStatus}\n            multiLine={multiline}\n            disabled={disabledMode}\n            readonly={readonly}\n            validationInline={validationInline}\n            fullWidth={fullWidth}\n          >\n            {showLeftIcon && (\n              <span\n                class={{\n                  [\"readonly\"]: readonly,\n                  [\"has-value\"]: this.getNumberOfCharacters(value) > 0,\n                }}\n                slot=\"left-icon\"\n              >\n                <slot name=\"icon\" />\n              </span>\n            )}\n\n            {!multiline ? (\n              <input\n                id={inputId}\n                name={name}\n                ref={(el) => (this.inputEl = el as HTMLInputElement)}\n                type={this.type}\n                min={min}\n                max={max}\n                value={value}\n                class={{\n                  [\"no-left-pad\"]: !showLeftIcon && readonly,\n                  [\"readonly\"]: readonly,\n                  [\"truncate-value\"]: truncateValue,\n                }}\n                placeholder={placeholder ? placeholder : \"\"}\n                required={required}\n                disabled={disabledMode}\n                readonly={readonly}\n                onInput={this.onInput}\n                onBlur={this.onBlur}\n                onFocus={this.onFocus}\n                aria-label={label}\n                aria-describedby={describedBy}\n                aria-invalid={invalid}\n                aria-activedescendant={this.ariaActiveDescendant}\n                aria-expanded={this.ariaExpanded}\n                aria-owns={this.ariaOwns}\n                autocomplete={this.autocomplete}\n                autocapitalize={this.autocapitalize}\n                autoFocus={this.autoFocus}\n                spellcheck={spellcheck}\n                inputmode={inputmode}\n                role={this.role}\n                maxlength={maxCharactersReached ? maxCharacters : null}\n                minlength={minCharactersUnattained ? minCharacters : null}\n                {...this.inheritedAttributes}\n              ></input>\n            ) : (\n              <textarea\n                id={inputId}\n                class={{\n                  [\"no-resize\"]: resize === false || readonly,\n                  [\"no-left-pad\"]: !showLeftIcon && readonly,\n                  [\"readonly\"]: readonly,\n                }}\n                name={name}\n                ref={(el) => (this.inputEl = el as HTMLTextAreaElement)}\n                value={value}\n                rows={rows}\n                required={required}\n                disabled={disabledMode}\n                placeholder={placeholder ? placeholder : \"\"}\n                readonly={readonly}\n                onInput={this.onInput}\n                onBlur={this.onBlur}\n                onFocus={this.onFocus}\n                aria-label={label}\n                aria-describedby={describedBy}\n                aria-invalid={invalid}\n                autocapitalize={this.autocapitalize}\n                autoFocus={this.autoFocus}\n                spellcheck={spellcheck}\n                inputmode={inputmode}\n                maxlength={maxCharactersReached ? maxCharacters : null}\n                minlength={minCharactersUnattained ? minCharacters : null}\n                {...this.inheritedAttributes}\n              ></textarea>\n            )}\n            {isSlotUsed(this.el, \"clear-button\") && (\n              <slot name=\"clear-button\"></slot>\n            )}\n            {isSlotUsed(this.el, \"search-submit-button\") && (\n              <slot name=\"search-submit-button\"></slot>\n            )}\n          </ic-input-component-container>\n          {isSlotUsed(this.el, \"menu\") && <slot name=\"menu\"></slot>}\n          {showValidation() && (\n            <ic-input-validation\n              status={\n                this.hasStatus(currentStatus) === false ||\n                (currentStatus === IcInformationStatus.Success &&\n                  validationInline) ||\n                validationInlineInternal\n                  ? \"\"\n                  : currentStatus\n              }\n              message={showStatusText ? currentValidationText : \"\"}\n              ariaLiveMode={messageAriaLive}\n              for={inputId}\n              fullWidth={fullWidth}\n            >\n              {!readonly && maxNumChars > 0 && (\n                <div slot=\"validation-message-adornment\">\n                  <ic-typography\n                    variant=\"caption\"\n                    class={{\n                      [\"maxlengthtext\"]: true,\n                      [\"error\"]: maxLengthExceeded,\n                      [\"disabled\"]: disabledText,\n                    }}\n                  >\n                    <span\n                      aria-live=\"polite\"\n                      id={`${inputId}-charcount`}\n                      class=\"charcount\"\n                    >\n                      {numChars}/{maxNumChars}\n                    </span>\n                    <span hidden={true} id={hiddenCharCountDescId}>\n                      Field can contain a maximum of {maxNumChars} characters.\n                    </span>\n                  </ic-typography>\n                </div>\n              )}\n            </ic-input-validation>\n          )}\n        </ic-input-container>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}