@fabric-msft/fabric-web 4.0.0-beta.1 → 5.0.0

package/dist/esm/components/text-input/text-input.base.js

@@ -1,11 +1,13 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
+import { attr, observable, nullableNumberConverter, FASTElement, Observable } from '@microsoft/fast-element';
+import { TextInputTypes, ImplicitSubmissionBlockingTypes } from './text-input.options.js';
+
+var __decorate = globalThis && globalThis.__decorate || function (decorators, target, key, desc) {
+  var c = arguments.length,
+    r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+    d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { attr, FASTElement, nullableNumberConverter, Observable, observable } from "@microsoft/fast-element";
-import { ImplicitSubmissionBlockingTypes, TextInputType } from "./text-input.options.js";
 /**
  * A Text Input Custom HTML Element.
  * Based largely on the {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input | `<input>`} element.
@@ -18,336 +20,341 @@ import { ImplicitSubmissionBlockingTypes, TextInputType } from "./text-input.opt
  * @csspart control - The internal `<input>` control
  * @public
  */
-export class BaseTextInput extends FASTElement {
-    constructor() {
-        super(...arguments);
-        /**
-         * Allows setting a type or mode of text.
-         *
-         * @public
-         * @remarks
-         * HTML Attribute: `type`
-         */
-        this.type = TextInputType.text;
-        /**
-         * Indicates that the value has been changed by the user.
-         *
-         * @internal
-         */
-        this.dirtyValue = false;
-        /**
-         * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
-         *
-         * @internal
-         */
-        this.elementInternals = this.attachInternals();
-    }
-    /**
-     * Tracks the current value of the input.
-     *
-     * @param prev - the previous value
-     * @param next - the next value
-     *
-     * @internal
-     */
-    currentValueChanged(prev, next) {
-        this.value = next;
-    }
-    /**
-     * Updates the control label visibility based on the presence of default slotted content.
-     *
-     * @internal
-     */
-    defaultSlottedNodesChanged(prev, next) {
-        if (this.$fastController.isConnected) {
-            this.controlLabel.hidden = !(next === null || next === void 0 ? void 0 : next.length);
-        }
-    }
-    /**
-     * Sets the value of the element to the initial value.
-     *
-     * @internal
-     */
-    initialValueChanged() {
-        if (!this.dirtyValue) {
-            this.value = this.initialValue;
-        }
-    }
-    /**
-     * Syncs the `ElementInternals.ariaReadOnly` property when the `readonly` property changes.
-     *
-     * @internal
-     */
-    readOnlyChanged() {
-        if (this.$fastController.isConnected) {
-            this.elementInternals.ariaReadOnly = `${!!this.readOnly}`;
-        }
-    }
-    /**
-     * Syncs the element's internal `aria-required` state with the `required` attribute.
-     *
-     * @param previous - the previous required state
-     * @param next - the current required state
-     *
-     * @internal
-     */
-    requiredChanged(previous, next) {
-        if (this.$fastController.isConnected) {
-            this.elementInternals.ariaRequired = `${!!next}`;
-        }
-    }
-    /**
-     * Calls the `setValidity` method when the control reference changes.
-     *
-     * @param prev - the previous control reference
-     * @param next - the current control reference
-     *
-     * @internal
-     */
-    controlChanged(prev, next) {
-        this.setValidity();
-    }
-    /**
-     * The element's validity state.
-     *
-     * @public
-     * @remarks
-     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/validity | `ElementInternals.validity`} property.
-     */
-    get validity() {
-        return this.elementInternals.validity;
-    }
-    /**
-     * The validation message.
-     *
-     * @public
-     * @remarks
-     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/validationMessage | `ElementInternals.validationMessage`} property.
-     */
-    get validationMessage() {
-        return (this.elementInternals.validationMessage || this.control.validationMessage);
-    }
-    /**
-     * The current value of the input.
-     * @public
-     */
-    get value() {
-        Observable.track(this, "value");
-        return this.currentValue;
-    }
-    set value(value) {
-        this.currentValue = value;
-        if (this.$fastController.isConnected) {
-            this.control.value = value !== null && value !== void 0 ? value : "";
-            this.setFormValue(value);
-            this.setValidity();
-            Observable.notify(this, "value");
-        }
-    }
-    /**
-     * Determines if the control can be submitted for constraint validation.
-     *
-     * @public
-     * @remarks
-     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/willValidate | `ElementInternals.willValidate`} property.
-     */
-    get willValidate() {
-        return this.elementInternals.willValidate;
-    }
+class BaseTextInput extends FASTElement {
+  constructor() {
+    super(...arguments);
     /**
-     * The associated form element.
+     * Allows setting a type or mode of text.
      *
      * @public
      * @remarks
-     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/form | `ElementInternals.form`} property.
+     * HTML Attribute: `type`
      */
-    get form() {
-        return this.elementInternals.form;
-    }
+    this.type = TextInputTypes.text;
     /**
-     * Handles the internal control's `keypress` event.
+     * Indicates that the value has been changed by the user.
      *
      * @internal
      */
-    beforeinputHandler(e) {
-        if (e.inputType === "insertLineBreak") {
-            this.implicitSubmit();
-        }
-        return true;
-    }
+    this.dirtyValue = false;
     /**
-     * Change event handler for inner control.
+     * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
      *
      * @internal
-     * @privateRemarks
-     * "Change" events are not `composable` so they will not permeate the shadow DOM boundary. This function effectively
-     * proxies the change event, emitting a `change` event whenever the internal control emits a `change` event.
      */
-    changeHandler(e) {
-        this.setValidity();
-        this.$emit("change", e, {
-            bubbles: true,
-            composed: true
-        });
-        return true;
+    this.elementInternals = this.attachInternals();
+  }
+  /**
+   * Tracks the current value of the input.
+   *
+   * @param prev - the previous value
+   * @param next - the next value
+   *
+   * @internal
+   */
+  currentValueChanged(prev, next) {
+    this.value = next;
+  }
+  /**
+   * Updates the control label visibility based on the presence of default slotted content.
+   *
+   * @internal
+   */
+  defaultSlottedNodesChanged(prev, next) {
+    if (this.$fastController.isConnected) {
+      this.controlLabel.hidden = !(next === null || next === void 0 ? void 0 : next.length);
     }
-    /**
-     * Checks the validity of the element and returns the result.
-     *
-     * @public
-     * @remarks
-     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/checkValidity | `HTMLInputElement.checkValidity()`} method.
-     */
-    checkValidity() {
-        return this.elementInternals.checkValidity();
+  }
+  /**
+   * Sets the value of the element to the initial value.
+   *
+   * @internal
+   */
+  initialValueChanged() {
+    if (!this.dirtyValue) {
+      this.value = this.initialValue;
     }
-    /**
-     * Clicks the inner control when the component is clicked.
-     *
-     * @param e - the event object
-     */
-    clickHandler(e) {
-        var _a;
-        if (e.target === this) {
-            (_a = this.control) === null || _a === void 0 ? void 0 : _a.click();
-        }
-        return true;
+  }
+  /**
+   * Syncs the `ElementInternals.ariaReadOnly` property when the `readonly` property changes.
+   *
+   * @internal
+   */
+  readOnlyChanged() {
+    if (this.$fastController.isConnected) {
+      this.elementInternals.ariaReadOnly = `${!!this.readOnly}`;
     }
-    connectedCallback() {
-        super.connectedCallback();
-        this.setFormValue(this.value);
-        this.setValidity();
+  }
+  /**
+   * Syncs the element's internal `aria-required` state with the `required` attribute.
+   *
+   * @param previous - the previous required state
+   * @param next - the current required state
+   *
+   * @internal
+   */
+  requiredChanged(previous, next) {
+    if (this.$fastController.isConnected) {
+      this.elementInternals.ariaRequired = `${!!next}`;
     }
-    /**
-     * Focuses the inner control when the component is focused.
-     *
-     * @param e - the event object
-     * @public
-     */
-    focusinHandler(e) {
-        var _a;
-        if (e.target === this) {
-            (_a = this.control) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-        return true;
+  }
+  /**
+   * Calls the `setValidity` method when the control reference changes.
+   *
+   * @param prev - the previous control reference
+   * @param next - the current control reference
+   *
+   * @internal
+   */
+  controlChanged(_prev, _next) {
+    this.setValidity();
+  }
+  /**
+   * The element's validity state.
+   *
+   * @public
+   * @remarks
+   * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/validity | `ElementInternals.validity`} property.
+   */
+  get validity() {
+    return this.elementInternals.validity;
+  }
+  /**
+   * The validation message.
+   *
+   * @public
+   * @remarks
+   * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/validationMessage | `ElementInternals.validationMessage`} property.
+   */
+  get validationMessage() {
+    return this.elementInternals.validationMessage || this.control.validationMessage;
+  }
+  /**
+   * The current value of the input.
+   * @public
+   */
+  get value() {
+    Observable.track(this, "value");
+    return this.currentValue;
+  }
+  set value(value) {
+    this.currentValue = value;
+    if (this.$fastController.isConnected) {
+      this.control.value = value !== null && value !== void 0 ? value : "";
+      this.setFormValue(value);
+      this.setValidity();
+      Observable.notify(this, "value");
     }
-    /**
-     * Resets the value to its initial value when the form is reset.
-     *
-     * @internal
-     */
-    formResetCallback() {
-        this.value = this.initialValue;
-        this.dirtyValue = false;
+  }
+  /**
+   * Determines if the control can be submitted for constraint validation.
+   *
+   * @public
+   * @remarks
+   * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/willValidate | `ElementInternals.willValidate`} property.
+   */
+  get willValidate() {
+    return this.elementInternals.willValidate;
+  }
+  /**
+   * The associated form element.
+   *
+   * @public
+   * @remarks
+   * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/form | `ElementInternals.form`} property.
+   */
+  get form() {
+    return this.elementInternals.form;
+  }
+  /**
+   * Handles the internal control's `keypress` event.
+   *
+   * @internal
+   */
+  beforeinputHandler(e) {
+    if (e.inputType === "insertLineBreak") {
+      this.implicitSubmit();
     }
-    /**
-     * Handles implicit form submission when the user presses the "Enter" key.
-     *
-     * @internal
-     */
-    implicitSubmit() {
-        if (!this.elementInternals.form) {
-            return;
-        }
-        if (this.elementInternals.form.elements.length === 1) {
-            this.elementInternals.form.requestSubmit();
-            return;
-        }
-        const formElements = Array.from(this.elementInternals.form.elements);
-        // Try submitting with the first submit button, if any
-        const submitButton = formElements.find((x) => x.getAttribute("type") === "submit");
-        if (submitButton) {
-            submitButton.click();
-            return;
-        }
-        // Determine if there is only one implicit submission blocking element
-        const filteredElements = formElements.filter((x) => { var _a; return ImplicitSubmissionBlockingTypes.includes((_a = x.getAttribute("type")) !== null && _a !== void 0 ? _a : ""); });
-        if (filteredElements.length > 1) {
-            return;
-        }
-        this.elementInternals.form.requestSubmit();
+    return true;
+  }
+  /**
+   * Change event handler for inner control.
+   *
+   * @internal
+   * @privateRemarks
+   * "Change" events are not `composable` so they will not permeate the shadow DOM boundary. This function effectively
+   * proxies the change event, emitting a `change` event whenever the internal control emits a `change` event.
+   */
+  changeHandler(e) {
+    this.setValidity();
+    this.$emit("change", e, {
+      bubbles: true,
+      composed: true
+    });
+    return true;
+  }
+  /**
+   * Checks the validity of the element and returns the result.
+   *
+   * @public
+   * @remarks
+   * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/checkValidity | `HTMLInputElement.checkValidity()`} method.
+   */
+  checkValidity() {
+    return this.elementInternals.checkValidity();
+  }
+  /**
+   * Clicks the inner control when the component is clicked.
+   *
+   * @param e - the event object
+   */
+  clickHandler(e) {
+    var _a;
+    if (e.target === this) {
+      (_a = this.control) === null || _a === void 0 ? void 0 : _a.click();
     }
-    /**
-     * Handles the internal control's `input` event.
-     *
-     * @internal
-     */
-    inputHandler(e) {
-        this.dirtyValue = true;
-        this.value = this.control.value;
-        return true;
+    return true;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setFormValue(this.value);
+    this.setValidity();
+  }
+  /**
+   * Focuses the inner control when the component is focused.
+   *
+   * @param e - the event object
+   * @public
+   */
+  focusinHandler(e) {
+    var _a;
+    if (e.target === this) {
+      (_a = this.control) === null || _a === void 0 ? void 0 : _a.focus();
     }
-    /**
-     * Handles the internal control's `keydown` event.
-     *
-     * @param e - the event object
-     * @internal
-     */
-    keydownHandler(e) {
-        if (e.key === "Enter") {
-            this.implicitSubmit();
-        }
-        return true;
+    return true;
+  }
+  /**
+   * Resets the value to its initial value when the form is reset.
+   *
+   * @internal
+   */
+  formResetCallback() {
+    this.value = this.initialValue;
+    this.dirtyValue = false;
+  }
+  /**
+   * Handles implicit form submission when the user presses the "Enter" key.
+   *
+   * @internal
+   */
+  implicitSubmit() {
+    if (!this.elementInternals.form) {
+      return;
     }
-    /**
-     * Selects all the text in the text field.
-     *
-     * @public
-     * @privateRemarks
-     * The `select` event does not permeate the shadow DOM boundary. This function effectively proxies the event,
-     * emitting a `select` event whenever the internal control emits a `select` event
-     *
-     */
-    select() {
-        this.control.select();
-        this.$emit("select");
+    if (this.elementInternals.form.elements.length === 1) {
+      this.elementInternals.form.requestSubmit();
+      return;
     }
-    /**
-     * Sets the custom validity message.
-     * @param message - The message to set
-     *
-     * @public
-     */
-    setCustomValidity(message) {
-        this.elementInternals.setValidity({ customError: true }, message);
-        this.reportValidity();
+    const formElements = Array.from(this.elementInternals.form.elements);
+    // Try submitting with the first submit button, if any
+    const submitButton = formElements.find(x => x.getAttribute("type") === "submit");
+    if (submitButton) {
+      submitButton.click();
+      return;
     }
-    /**
-     * Reports the validity of the element.
-     *
-     * @public
-     * @remarks
-     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/reportValidity | `HTMLInputElement.reportValidity()`} method.
-     */
-    reportValidity() {
-        return this.elementInternals.reportValidity();
+    // Determine if there is only one implicit submission blocking element
+    const filteredElements = formElements.filter(x => {
+      var _a;
+      return ImplicitSubmissionBlockingTypes.includes((_a = x.getAttribute("type")) !== null && _a !== void 0 ? _a : "");
+    });
+    if (filteredElements.length > 1) {
+      return;
     }
-    /**
-     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/setFormValue | `ElementInternals.setFormValue()`} method.
-     *
-     * @internal
-     */
-    setFormValue(value, state) {
-        this.elementInternals.setFormValue(value, value !== null && value !== void 0 ? value : state);
+    this.elementInternals.form.requestSubmit();
+  }
+  /**
+   * Handles the internal control's `input` event.
+   *
+   * @internal
+   */
+  inputHandler(_e) {
+    this.dirtyValue = true;
+    this.value = this.control.value;
+    return true;
+  }
+  /**
+   * Handles the internal control's `keydown` event.
+   *
+   * @param e - the event object
+   * @internal
+   */
+  keydownHandler(e) {
+    if (e.key === "Enter") {
+      this.implicitSubmit();
     }
-    /**
-     * Sets the validity of the control.
-     *
-     * @param flags - Validity flags. If not provided, the control's `validity` will be used.
-     * @param message - Optional message to supply. If not provided, the control's `validationMessage` will be used. If the control does not have a `validationMessage`, the message will be empty.
-     * @param anchor - Optional anchor to use for the validation message. If not provided, the control will be used.
-     *
-     * @internal
-     */
-    setValidity(flags, message, anchor) {
-        if (this.$fastController.isConnected && this.control) {
-            if (this.disabled) {
-                this.elementInternals.setValidity({});
-                return;
-            }
-            this.elementInternals.setValidity(flags !== null && flags !== void 0 ? flags : this.control.validity, message !== null && message !== void 0 ? message : this.validationMessage, anchor !== null && anchor !== void 0 ? anchor : this.control);
-        }
+    return true;
+  }
+  /**
+   * Selects all the text in the text field.
+   *
+   * @public
+   * @privateRemarks
+   * The `select` event does not permeate the shadow DOM boundary. This function effectively proxies the event,
+   * emitting a `select` event whenever the internal control emits a `select` event
+   *
+   */
+  select() {
+    this.control.select();
+    this.$emit("select");
+  }
+  /**
+   * Sets the custom validity message.
+   * @param message - The message to set
+   *
+   * @public
+   */
+  setCustomValidity(message) {
+    this.elementInternals.setValidity({
+      customError: true
+    }, message);
+    this.reportValidity();
+  }
+  /**
+   * Reports the validity of the element.
+   *
+   * @public
+   * @remarks
+   * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/reportValidity | `HTMLInputElement.reportValidity()`} method.
+   */
+  reportValidity() {
+    return this.elementInternals.reportValidity();
+  }
+  /**
+   * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/setFormValue | `ElementInternals.setFormValue()`} method.
+   *
+   * @internal
+   */
+  setFormValue(value, state) {
+    this.elementInternals.setFormValue(value, value !== null && value !== void 0 ? value : state);
+  }
+  /**
+   * Sets the validity of the control.
+   *
+   * @param flags - Validity flags. If not provided, the control's `validity` will be used.
+   * @param message - Optional message to supply. If not provided, the control's `validationMessage` will be used. If the control does not have a `validationMessage`, the message will be empty.
+   * @param anchor - Optional anchor to use for the validation message. If not provided, the control will be used.
+   *
+   * @internal
+   */
+  setValidity(flags, message, anchor) {
+    if (this.$fastController.isConnected && this.control) {
+      if (this.disabled) {
+        this.elementInternals.setValidity({});
+        return;
+      }
+      this.elementInternals.setValidity(flags !== null && flags !== void 0 ? flags : this.control.validity, message !== null && message !== void 0 ? message : this.validationMessage, anchor !== null && anchor !== void 0 ? anchor : this.control);
     }
+  }
 }
 /**
  * The form-associated flag.
@@ -356,77 +363,56 @@ export class BaseTextInput extends FASTElement {
  * @public
  */
 BaseTextInput.formAssociated = true;
-__decorate([
-    attr
-], BaseTextInput.prototype, "autocomplete", void 0);
-__decorate([
-    attr({ mode: "boolean" })
-], BaseTextInput.prototype, "autofocus", void 0);
-__decorate([
-    attr({ attribute: "current-value" })
-], BaseTextInput.prototype, "currentValue", void 0);
-__decorate([
-    observable
-], BaseTextInput.prototype, "defaultSlottedNodes", void 0);
-__decorate([
-    attr
-], BaseTextInput.prototype, "dirname", void 0);
-__decorate([
-    attr({ mode: "boolean" })
-], BaseTextInput.prototype, "disabled", void 0);
-__decorate([
-    attr({ attribute: "form" })
-], BaseTextInput.prototype, "formAttribute", void 0);
-__decorate([
-    attr({ attribute: "value", mode: "fromView" })
-], BaseTextInput.prototype, "initialValue", void 0);
-__decorate([
-    attr
-], BaseTextInput.prototype, "list", void 0);
-__decorate([
-    attr({ converter: nullableNumberConverter })
-], BaseTextInput.prototype, "maxlength", void 0);
-__decorate([
-    attr({ converter: nullableNumberConverter })
-], BaseTextInput.prototype, "minlength", void 0);
-__decorate([
-    attr({ mode: "boolean" })
-], BaseTextInput.prototype, "multiple", void 0);
-__decorate([
-    attr
-], BaseTextInput.prototype, "name", void 0);
-__decorate([
-    attr
-], BaseTextInput.prototype, "pattern", void 0);
-__decorate([
-    attr
-], BaseTextInput.prototype, "placeholder", void 0);
-__decorate([
-    attr({ attribute: "readonly", mode: "boolean" })
-], BaseTextInput.prototype, "readOnly", void 0);
-__decorate([
-    attr({ mode: "boolean" })
-], BaseTextInput.prototype, "required", void 0);
-__decorate([
-    attr({ converter: nullableNumberConverter })
-], BaseTextInput.prototype, "size", void 0);
-__decorate([
-    attr({
-        converter: {
-            fromView: (value) => typeof value === "string"
-                ? ["true", ""].includes(value.trim().toLowerCase())
-                : null,
-            toView: (value) => value.toString()
-        }
-    })
-], BaseTextInput.prototype, "spellcheck", void 0);
-__decorate([
-    attr
-], BaseTextInput.prototype, "type", void 0);
-__decorate([
-    observable
-], BaseTextInput.prototype, "control", void 0);
-__decorate([
-    observable
-], BaseTextInput.prototype, "controlLabel", void 0);
-//# sourceMappingURL=text-input.base.js.map
+__decorate([attr], BaseTextInput.prototype, "autocomplete", void 0);
+__decorate([attr({
+  mode: "boolean"
+})], BaseTextInput.prototype, "autofocus", void 0);
+__decorate([attr({
+  attribute: "current-value"
+})], BaseTextInput.prototype, "currentValue", void 0);
+__decorate([observable], BaseTextInput.prototype, "defaultSlottedNodes", void 0);
+__decorate([attr], BaseTextInput.prototype, "dirname", void 0);
+__decorate([attr({
+  mode: "boolean"
+})], BaseTextInput.prototype, "disabled", void 0);
+__decorate([attr({
+  attribute: "form"
+})], BaseTextInput.prototype, "formAttribute", void 0);
+__decorate([attr({
+  attribute: "value",
+  mode: "fromView"
+})], BaseTextInput.prototype, "initialValue", void 0);
+__decorate([attr], BaseTextInput.prototype, "list", void 0);
+__decorate([attr({
+  converter: nullableNumberConverter
+})], BaseTextInput.prototype, "maxlength", void 0);
+__decorate([attr({
+  converter: nullableNumberConverter
+})], BaseTextInput.prototype, "minlength", void 0);
+__decorate([attr({
+  mode: "boolean"
+})], BaseTextInput.prototype, "multiple", void 0);
+__decorate([attr], BaseTextInput.prototype, "name", void 0);
+__decorate([attr], BaseTextInput.prototype, "pattern", void 0);
+__decorate([attr], BaseTextInput.prototype, "placeholder", void 0);
+__decorate([attr({
+  attribute: "readonly",
+  mode: "boolean"
+})], BaseTextInput.prototype, "readOnly", void 0);
+__decorate([attr({
+  mode: "boolean"
+})], BaseTextInput.prototype, "required", void 0);
+__decorate([attr({
+  converter: nullableNumberConverter
+})], BaseTextInput.prototype, "size", void 0);
+__decorate([attr({
+  converter: {
+    fromView: value => typeof value === "string" ? ["true", ""].includes(value.trim().toLowerCase()) : null,
+    toView: value => value.toString()
+  }
+})], BaseTextInput.prototype, "spellcheck", void 0);
+__decorate([attr], BaseTextInput.prototype, "type", void 0);
+__decorate([observable], BaseTextInput.prototype, "control", void 0);
+__decorate([observable], BaseTextInput.prototype, "controlLabel", void 0);
+
+export { BaseTextInput };