@fluentui/web-components 3.0.0-rc.3 → 3.0.0-rc.31

package/dist/esm/text-input/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/text-input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAEnG,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/text-input/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAEnG,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/esm/text-input/text-input.base.d.ts

@@ -10,6 +10,10 @@ import { TextInputType } from './text-input.options.js';
  * @csspart label - The internal `<label>` element
  * @csspart root - the root container for the internal control
  * @csspart control - The internal `<input>` control
+ *
+ * @fires { Event } change - Fires a custom 'change' event when the value changes and the input loses focus
+ * @fires { Event } select - Fires when the `select()` method is called.
+ *
  * @public
  */
 export declare class BaseTextInput extends FASTElement {
@@ -22,15 +26,6 @@ export declare class BaseTextInput extends FASTElement {
      * HTML Attribute: `autocomplete`
      */
     autocomplete?: string;
-    /**
-     * Indicates that the element should get focus after the page finishes loading.
-     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Element/input#autofocus | `autofocus`} attribute
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: `autofocus`
-     */
-    autofocus: boolean;
     /**
      * The current value of the input.
      * @public
@@ -296,12 +291,6 @@ export declare class BaseTextInput extends FASTElement {
      * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/form | `ElementInternals.form`} property.
      */
     get form(): HTMLFormElement | null;
-    /**
-     * Handles the internal control's `keypress` event.
-     *
-     * @internal
-     */
-    beforeinputHandler(e: InputEvent): boolean | void;
     /**
      * Change event handler for inner control.
      *
@@ -326,13 +315,6 @@ export declare class BaseTextInput extends FASTElement {
      */
     clickHandler(e: MouseEvent): boolean | void;
     connectedCallback(): void;
-    /**
-     * Focuses the inner control when the component is focused.
-     *
-     * @param e - the event object
-     * @public
-     */
-    focusinHandler(e: FocusEvent): boolean | void;
     /**
      * Resets the value to its initial value when the form is reset.
      *

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

@@ -1,5 +1,6 @@
 import { __decorate } from "tslib";
-import { attr, FASTElement, nullableNumberConverter, Observable, observable } from '@microsoft/fast-element';
+import { attr, FASTElement, nullableNumberConverter, Observable, observable, Updates } from '@microsoft/fast-element';
+import { maybeSetAutoFocus } from '../utils/autofocus.js';
 import { ImplicitSubmissionBlockingTypes, TextInputType } from './text-input.options.js';
 /**
  * A Text Input Custom HTML Element.
@@ -11,6 +12,10 @@ import { ImplicitSubmissionBlockingTypes, TextInputType } from './text-input.opt
  * @csspart label - The internal `<label>` element
  * @csspart root - the root container for the internal control
  * @csspart control - The internal `<input>` control
+ *
+ * @fires { Event } change - Fires a custom 'change' event when the value changes and the input loses focus
+ * @fires { Event } select - Fires when the `select()` method is called.
+ *
  * @public
  */
 export class BaseTextInput extends FASTElement {
@@ -54,9 +59,11 @@ export class BaseTextInput extends FASTElement {
      * @internal
      */
     defaultSlottedNodesChanged(prev, next) {
-        if (this.$fastController.isConnected) {
-            this.controlLabel.hidden = !next?.length;
-        }
+        Updates.enqueue(() => {
+            if (this.controlLabel) {
+                this.controlLabel.hidden = !next?.some(node => node.nodeType === Node.ELEMENT_NODE || (node.nodeType === Node.TEXT_NODE && !!node.textContent?.trim()));
+            }
+        });
     }
     /**
      * Sets the value of the element to the initial value.
@@ -100,7 +107,11 @@ export class BaseTextInput extends FASTElement {
      * @internal
      */
     controlChanged(prev, next) {
-        this.setValidity();
+        Updates.enqueue(() => {
+            if (this.$fastController.isConnected) {
+                this.setValidity();
+            }
+        });
     }
     /**
      * The form-associated flag.
@@ -139,7 +150,7 @@ export class BaseTextInput extends FASTElement {
     }
     set value(value) {
         this.currentValue = value;
-        if (this.$fastController.isConnected) {
+        if (this.elementInternals && this.control) {
             this.control.value = value ?? '';
             this.setFormValue(value);
             this.setValidity();
@@ -166,17 +177,6 @@ export class BaseTextInput extends FASTElement {
     get form() {
         return this.elementInternals.form;
     }
-    /**
-     * Handles the internal control's `keypress` event.
-     *
-     * @internal
-     */
-    beforeinputHandler(e) {
-        if (e.inputType === 'insertLineBreak') {
-            this.implicitSubmit();
-        }
-        return true;
-    }
     /**
      * Change event handler for inner control.
      *
@@ -218,18 +218,7 @@ export class BaseTextInput extends FASTElement {
         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) {
-        if (e.target === this) {
-            this.control?.focus();
-        }
-        return true;
+        maybeSetAutoFocus(this);
     }
     /**
      * Resets the value to its initial value when the form is reset.
@@ -328,7 +317,7 @@ export class BaseTextInput extends FASTElement {
      * @internal
      */
     setFormValue(value, state) {
-        this.elementInternals.setFormValue(value, value ?? state);
+        this.elementInternals?.setFormValue(value, value ?? state);
     }
     /**
      * Sets the validity of the control.
@@ -340,7 +329,7 @@ export class BaseTextInput extends FASTElement {
      * @internal
      */
     setValidity(flags, message, anchor) {
-        if (this.$fastController.isConnected && this.control) {
+        if (this.elementInternals && this.control) {
             if (this.disabled) {
                 this.elementInternals.setValidity({});
                 return;
@@ -352,9 +341,6 @@ export class BaseTextInput extends FASTElement {
 __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);

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

@@ -1 +1 @@
-{"version":3,"file":"text-input.base.js","sourceRoot":"","sources":["../../../src/text-input/text-input.base.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"text-input.base.js","sourceRoot":"","sources":["../../../src/text-input/text-input.base.ts"],"names":[],"mappings":"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"}

package/dist/esm/text-input/text-input.bench.d.ts

@@ -1,3 +1,4 @@
+import './define.js';
 declare const itemRenderer: () => HTMLElement;
 export default itemRenderer;
 export { tests } from '../utils/benchmark-wrapper.js';

package/dist/esm/text-input/text-input.bench.js

@@ -1,6 +1,4 @@
-import { FluentDesignSystem } from '../fluent-design-system.js';
-import { definition } from './text-input.definition.js';
-definition.define(FluentDesignSystem.registry);
+import './define.js';
 const itemRenderer = () => {
     const textInput = document.createElement('fluent-text-input');
     return textInput;

package/dist/esm/text-input/text-input.bench.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-input.bench.js","sourceRoot":"","sources":["../../../src/text-input/text-input.bench.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAExD,UAAU,CAAC,MAAM,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;AAE/C,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAAC;IAC9D,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC;AAC5B,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC"}
+{"version":3,"file":"text-input.bench.js","sourceRoot":"","sources":["../../../src/text-input/text-input.bench.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AAErB,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAAC;IAC9D,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC;AAC5B,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/esm/text-input/text-input.d.ts

@@ -6,6 +6,8 @@ import { TextInputAppearance, TextInputControlSize } from './text-input.options.
  * Based on BaseTextInput and includes style and layout specific attributes
  *
  * @tag fluent-text-input
+ * @fires { Event } change - Fired when the input value is committed via a change event.
+ * @fires { Event } select - Fires when the `select()` method is called.
  *
  * @public
  */

package/dist/esm/text-input/text-input.definition-async.d.ts

@@ -0,0 +1,10 @@
+import { type PartialFASTElementDefinition } from '@microsoft/fast-element/declarative.js';
+/**
+ * The async definition configuration for the `<fluent-text-input>` element.
+ *
+ * @public
+ * @remarks
+ * This is used in server-side rendering (SSR) scenarios where the template
+ * is provided as a deferred option to be hydrated later.
+ */
+export declare const declarativeDefinition: PartialFASTElementDefinition;

package/dist/esm/text-input/text-input.definition-async.js

@@ -0,0 +1,20 @@
+import { declarativeTemplate } from '@microsoft/fast-element/declarative.js';
+import { FluentDesignSystem } from '../fluent-design-system.js';
+import { tagName } from './text-input.options.js';
+/**
+ * The async definition configuration for the `<fluent-text-input>` element.
+ *
+ * @public
+ * @remarks
+ * This is used in server-side rendering (SSR) scenarios where the template
+ * is provided as a deferred option to be hydrated later.
+ */
+export const declarativeDefinition = {
+    name: tagName,
+    registry: FluentDesignSystem.registry,
+    shadowOptions: {
+        delegatesFocus: true,
+    },
+    template: declarativeTemplate(),
+};
+//# sourceMappingURL=text-input.definition-async.js.map

package/dist/esm/text-input/text-input.definition-async.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-input.definition-async.js","sourceRoot":"","sources":["../../../src/text-input/text-input.definition-async.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAqC,MAAM,wCAAwC,CAAC;AAChH,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAElD;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAiC;IACjE,IAAI,EAAE,OAAO;IACb,QAAQ,EAAE,kBAAkB,CAAC,QAAQ;IACrC,aAAa,EAAE;QACb,cAAc,EAAE,IAAI;KACrB;IACD,QAAQ,EAAE,mBAAmB,EAAE;CAChC,CAAC"}

package/dist/esm/text-input/text-input.definition.d.ts

@@ -1,9 +1,7 @@
-import { TextInput } from './text-input.js';
+import type { PartialFASTElementDefinition } from '@microsoft/fast-element';
 /**
- * The Fluent TextInput Element definition.
+ * The definition for the `<fluent-text-input>` element.
  *
  * @public
- * @remarks
- * HTML Element: `<fluent-text-input>`
  */
-export declare const definition: import("@microsoft/fast-element").FASTElementDefinition<typeof TextInput>;
+export declare const definition: PartialFASTElementDefinition;

package/dist/esm/text-input/text-input.definition.js

@@ -1,20 +1,19 @@
 import { FluentDesignSystem } from '../fluent-design-system.js';
-import { TextInput } from './text-input.js';
+import { tagName } from './text-input.options.js';
 import { styles } from './text-input.styles.js';
 import { template } from './text-input.template.js';
 /**
- * The Fluent TextInput Element definition.
+ * The definition for the `<fluent-text-input>` element.
  *
  * @public
- * @remarks
- * HTML Element: `<fluent-text-input>`
  */
-export const definition = TextInput.compose({
-    name: `${FluentDesignSystem.prefix}-text-input`,
-    template,
-    styles,
+export const definition = {
+    name: tagName,
+    registry: FluentDesignSystem.registry,
     shadowOptions: {
         delegatesFocus: true,
     },
-});
+    styles,
+    template,
+};
 //# sourceMappingURL=text-input.definition.js.map

package/dist/esm/text-input/text-input.definition.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-input.definition.js","sourceRoot":"","sources":["../../../src/text-input/text-input.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAEpD;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,SAAS,CAAC,OAAO,CAAC;IAC1C,IAAI,EAAE,GAAG,kBAAkB,CAAC,MAAM,aAAa;IAC/C,QAAQ;IACR,MAAM;IACN,aAAa,EAAE;QACb,cAAc,EAAE,IAAI;KACrB;CACF,CAAC,CAAC"}
+{"version":3,"file":"text-input.definition.js","sourceRoot":"","sources":["../../../src/text-input/text-input.definition.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAEpD;;;;GAIG;AACH,MAAM,CAAC,MAAM,UAAU,GAAiC;IACtD,IAAI,EAAE,OAAO;IACb,QAAQ,EAAE,kBAAkB,CAAC,QAAQ;IACrC,aAAa,EAAE;QACb,cAAc,EAAE,IAAI;KACrB;IACD,MAAM;IACN,QAAQ;CACT,CAAC"}

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

@@ -8,6 +8,8 @@ import { BaseTextInput } from './text-input.base.js';
  * Based on BaseTextInput and includes style and layout specific attributes
  *
  * @tag fluent-text-input
+ * @fires { Event } change - Fired when the input value is committed via a change event.
+ * @fires { Event } select - Fires when the `select()` method is called.
  *
  * @public
  */

package/dist/esm/text-input/text-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-input.js","sourceRoot":"","sources":["../../../src/text-input/text-input.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAGrD;;;;;;;GAOG;AACH,MAAM,OAAO,SAAU,SAAQ,aAAa;CAoB3C;AAXQ;IADN,IAAI;6CACmC;AAUjC;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;8CACM;AAY5C,WAAW,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC"}
+{"version":3,"file":"text-input.js","sourceRoot":"","sources":["../../../src/text-input/text-input.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAGrD;;;;;;;;;GASG;AACH,MAAM,OAAO,SAAU,SAAQ,aAAa;CAoB3C;AAXQ;IADN,IAAI;6CACmC;AAUjC;IADN,IAAI,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;8CACM;AAY5C,WAAW,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC"}

package/dist/esm/text-input/text-input.options.d.ts

@@ -49,3 +49,9 @@ export type TextInputType = ValuesOf<typeof TextInputType>;
  * @public
  */
 export declare const ImplicitSubmissionBlockingTypes: string[];
+/**
+ * The tag name for the text input element.
+ *
+ * @public
+ */
+export declare const tagName: "fluent-text-input";

package/dist/esm/text-input/text-input.options.js

@@ -1,3 +1,4 @@
+import { FluentDesignSystem } from '../fluent-design-system.js';
 /**
  * Values for the `control-size` attribute on TextInput elements.
  *
@@ -50,4 +51,10 @@ export const ImplicitSubmissionBlockingTypes = [
     'url',
     'week',
 ];
+/**
+ * The tag name for the text input element.
+ *
+ * @public
+ */
+export const tagName = `${FluentDesignSystem.prefix}-text-input`;
 //# sourceMappingURL=text-input.options.js.map

package/dist/esm/text-input/text-input.options.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-input.options.js","sourceRoot":"","sources":["../../../src/text-input/text-input.options.ts"],"names":[],"mappings":"AAWA;;;;GAIG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG;IAClC,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;CACN,CAAC;AAIX;;;;GAIG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,OAAO,EAAE,SAAS;IAClB,SAAS,EAAE,WAAW;IACtB,aAAa,EAAE,gBAAgB;IAC/B,YAAY,EAAE,eAAe;CACrB,CAAC;AAIX;;;;GAIG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG;IAC3B,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE,UAAU;IACpB,GAAG,EAAE,KAAK;IACV,IAAI,EAAE,MAAM;IACZ,GAAG,EAAE,KAAK;CACF,CAAC;AAIX;;;;GAIG;AACH,MAAM,CAAC,MAAM,+BAA+B,GAAG;IAC7C,MAAM;IACN,gBAAgB;IAChB,OAAO;IACP,OAAO;IACP,QAAQ;IACR,UAAU;IACV,QAAQ;IACR,KAAK;IACL,MAAM;IACN,MAAM;IACN,KAAK;IACL,MAAM;CACP,CAAC"}
+{"version":3,"file":"text-input.options.js","sourceRoot":"","sources":["../../../src/text-input/text-input.options.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAYhE;;;;GAIG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG;IAClC,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;CACN,CAAC;AAIX;;;;GAIG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,OAAO,EAAE,SAAS;IAClB,SAAS,EAAE,WAAW;IACtB,aAAa,EAAE,gBAAgB;IAC/B,YAAY,EAAE,eAAe;CACrB,CAAC;AAIX;;;;GAIG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG;IAC3B,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE,UAAU;IACpB,GAAG,EAAE,KAAK;IACV,IAAI,EAAE,MAAM;IACZ,GAAG,EAAE,KAAK;CACF,CAAC;AAIX;;;;GAIG;AACH,MAAM,CAAC,MAAM,+BAA+B,GAAG;IAC7C,MAAM;IACN,gBAAgB;IAChB,OAAO;IACP,OAAO;IACP,QAAQ;IACR,UAAU;IACV,QAAQ;IACR,KAAK;IACL,MAAM;IACN,MAAM;IACN,KAAK;IACL,MAAM;CACP,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,kBAAkB,CAAC,MAAM,aAAsB,CAAC"}

package/dist/esm/text-input/text-input.styles.css

@@ -0,0 +1,204 @@
+:host([hidden]) {
+  display: none;
+}
+:host {
+  display: block;
+}
+
+:host {
+  font-family: var(--fontFamilyBase);
+  font-size: var(--fontSizeBase300);
+  font-weight: var(--fontWeightRegular);
+  line-height: var(--lineHeightBase300);
+  max-width: 400px;
+}
+.label {
+  display: flex;
+  color: var(--colorNeutralForeground1);
+  padding-bottom: var(--spacingVerticalXS);
+  flex-shrink: 0;
+  padding-inline-end: var(--spacingHorizontalXS);
+}
+
+.label[hidden],
+:host(:empty) .label {
+  display: none;
+}
+
+.root {
+  align-items: center;
+  background-color: var(--colorNeutralBackground1);
+  border: var(--strokeWidthThin) solid var(--colorNeutralStroke1);
+  border-bottom-color: var(--colorNeutralStrokeAccessible);
+  border-radius: var(--borderRadiusMedium);
+  box-sizing: border-box;
+  height: 32px;
+  display: inline-flex;
+  flex-direction: row;
+  gap: var(--spacingHorizontalXXS);
+  padding: 0 var(--spacingHorizontalMNudge);
+  position: relative;
+  width: 100%;
+}
+
+:has(.control:user-invalid) {
+  border-color: var(--colorPaletteRedBorder2);
+}
+
+.root::after {
+  box-sizing: border-box;
+  content: '';
+  position: absolute;
+  left: -1px;
+  bottom: 0px;
+  right: -1px;
+  height: max(2px, var(--borderRadiusMedium));
+  border-radius: 0 0 var(--borderRadiusMedium) var(--borderRadiusMedium);
+  border-bottom: 2px solid var(--colorCompoundBrandStroke);
+  clip-path: inset(calc(100% - 2px) 1px 0px);
+  transform: scaleX(0);
+  transition-property: transform;
+  transition-duration: var(--durationUltraFast);
+  transition-delay: var(--curveAccelerateMid);
+}
+.control {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  color: var(--colorNeutralForeground1);
+  border-radius: var(--borderRadiusMedium);
+  background: var(--colorTransparentBackground);
+  font-family: var(--fontFamilyBase);
+  font-weight: var(--fontWeightRegular);
+  font-size: var(--fontSizeBase300);
+  border: none;
+  vertical-align: center;
+}
+.control:focus-visible {
+  outline: 0;
+  border: 0;
+}
+.control::placeholder {
+  color: var(--colorNeutralForeground4);
+}
+:host ::slotted([slot='start']),
+:host ::slotted([slot='end']) {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--colorNeutralForeground3);
+  font-size: var(--fontSizeBase500);
+}
+:host ::slotted([slot='start']) {
+  padding-right: var(--spacingHorizontalXXS);
+}
+:host ::slotted([slot='end']) {
+  padding-left: var(--spacingHorizontalXXS);
+  gap: var(--spacingHorizontalXS);
+}
+:host(:hover) .root {
+  border-color: var(--colorNeutralStroke1Hover);
+  border-bottom-color: var(--colorNeutralStrokeAccessibleHover);
+}
+:host(:active) .root {
+  border-color: var(--colorNeutralStroke1Pressed);
+}
+:host(:focus-within) .root {
+  outline: transparent solid 2px;
+  border-bottom: 0;
+}
+:host(:focus-within) .root::after {
+  transform: scaleX(1);
+  transition-property: transform;
+  transition-duration: var(--durationNormal);
+  transition-delay: var(--curveDecelerateMid);
+}
+:host(:focus-within:active) .root:after {
+  border-bottom-color: var(--colorCompoundBrandStrokePressed);
+}
+:host([appearance='outline']:focus-within) .root {
+  border: var(--strokeWidthThin) solid var(--colorNeutralStroke1);
+}
+:host(:focus-within) .control {
+  color: var(--colorNeutralForeground1);
+}
+:host([disabled]) .root {
+  background: var(--colorTransparentBackground);
+  border: var(--strokeWidthThin) solid var(--colorNeutralStrokeDisabled);
+}
+:host([disabled]) .control::placeholder,
+:host([disabled]) ::slotted([slot='start']),
+:host([disabled]) ::slotted([slot='end']) {
+  color: var(--colorNeutralForegroundDisabled);
+}
+::selection {
+  color: var(--colorNeutralForegroundInverted);
+  background-color: var(--colorNeutralBackgroundInverted);
+}
+:host([control-size='small']) .control {
+  font-size: var(--fontSizeBase200);
+  font-weight: var(--fontWeightRegular);
+  line-height: var(--lineHeightBase200);
+}
+:host([control-size='small']) .root {
+  height: 24px;
+  gap: var(--spacingHorizontalXXS);
+  padding: 0 var(--spacingHorizontalSNudge);
+}
+:host([control-size='small']) ::slotted([slot='start']),
+:host([control-size='small']) ::slotted([slot='end']) {
+  font-size: var(--fontSizeBase400);
+}
+:host([control-size='large']) .control {
+  font-size: var(--fontSizeBase400);
+  font-weight: var(--fontWeightRegular);
+  line-height: var(--lineHeightBase400);
+}
+:host([control-size='large']) .root {
+  height: 40px;
+  gap: var(--spacingHorizontalS);
+  padding: 0 var(--spacingHorizontalM);
+}
+:host([control-size='large']) ::slotted([slot='start']),
+:host([control-size='large']) ::slotted([slot='end']) {
+  font-size: var(--fontSizeBase600);
+}
+:host([appearance='underline']) .root {
+  background: var(--colorTransparentBackground);
+  border: 0;
+  border-radius: 0;
+  border-bottom: var(--strokeWidthThin) solid var(--colorNeutralStrokeAccessible);
+}
+:host([appearance='underline']:hover) .root {
+  border-bottom-color: var(--colorNeutralStrokeAccessibleHover);
+}
+:host([appearance='underline']:active) .root {
+  border-bottom-color: var(--colorNeutralStrokeAccessiblePressed);
+}
+:host([appearance='underline']:focus-within) .root {
+  border: 0;
+  border-bottom-color: var(--colorNeutralStrokeAccessiblePressed);
+}
+:host([appearance='underline'][disabled]) .root {
+  border-bottom-color: var(--colorNeutralStrokeDisabled);
+}
+:host([appearance='filled-lighter']) .root,
+:host([appearance='filled-darker']) .root {
+  border: var(--strokeWidthThin) solid var(--colorTransparentStroke);
+  box-shadow: var(--shadow2);
+}
+:host([appearance='filled-lighter']) .root {
+  background: var(--colorNeutralBackground1);
+}
+:host([appearance='filled-darker']) .root {
+  background: var(--colorNeutralBackground3);
+}
+:host([appearance='filled-lighter']:hover) .root,
+:host([appearance='filled-darker']:hover) .root {
+  border-color: var(--colorTransparentStrokeInteractive);
+}
+:host([appearance='filled-lighter']:active) .root,
+:host([appearance='filled-darker']:active) .root {
+  border-color: var(--colorTransparentStrokeInteractive);
+  background: var(--colorNeutralBackground3);
+}

package/dist/esm/text-input/text-input.template.d.ts

@@ -1,4 +1,4 @@
-import type { ElementViewTemplate } from '@microsoft/fast-element';
+import { type ElementViewTemplate } from '@microsoft/fast-element';
 import type { TextInput } from './text-input.js';
 import type { TextInputOptions } from './text-input.options.js';
 /**

package/dist/esm/text-input/text-input.template.html

@@ -0,0 +1,35 @@
+<f-template name="fluent-text-input" shadowrootmode="open" shadowrootdelegatesfocus>
+  <template @keydown="{keydownHandler($e)}">
+    {{styles}}
+    <label part="label" for="control" class="label" f-ref="{controlLabel}">
+      <slot f-slotted="{defaultSlottedNodes}"></slot>
+    </label>
+    <div class="root" part="root">
+      <slot name="start" f-ref="{start}"></slot>
+      <input
+        class="control"
+        part="control"
+        id="control"
+        @change="{changeHandler($e)}"
+        @input="{inputHandler($e)}"
+        autocomplete="{{autocomplete}}"
+        ?disabled="{{disabled}}"
+        list="{{list}}"
+        maxlength="{{maxlength}}"
+        minlength="{{minlength}}"
+        ?multiple="{{multiple}}"
+        name="{{name}}"
+        pattern="{{pattern}}"
+        placeholder="{{placeholder}}"
+        ?readonly="{{readOnly}}"
+        ?required="{{required}}"
+        size="{{size}}"
+        spellcheck="{{spellcheck}}"
+        type="{{type}}"
+        value="{{value}}"
+        f-ref="{control}"
+      />
+      <slot name="end" f-ref="{end}"></slot>
+    </div>
+  </template>
+</f-template>