@fluentui/web-components 3.0.0-beta.7 → 3.0.0-beta.70

package/dist/esm/tabs/tabs.styles.js

@@ -1,45 +1,45 @@
 import { css } from '@microsoft/fast-element';
-import { display } from '@microsoft/fast-foundation/utilities.js';
+import { display } from '../utils/index.js';
 import { borderRadiusCircular, borderRadiusMedium, colorCompoundBrandForeground1Hover, colorNeutralForeground1, colorNeutralForeground1Hover, colorNeutralForeground2, colorNeutralForegroundDisabled, colorSubtleBackgroundHover, colorSubtleBackgroundPressed, curveDecelerateMax, durationSlow, fontFamilyBase, fontSizeBase300, fontSizeBase400, lineHeightBase300, lineHeightBase400, spacingHorizontalMNudge, spacingHorizontalSNudge, spacingVerticalL, spacingVerticalMNudge, spacingVerticalS, spacingVerticalSNudge, spacingVerticalXXS, strokeWidthThicker, } from '../theme/design-tokens.js';
 export const styles = css `
   ${display('grid')}
 
   :host {
     box-sizing: border-box;
-    font-family: var(${fontFamilyBase});
-    font-size: var(${fontSizeBase300});
-    line-height: var(${lineHeightBase300});
-    color: var(${colorNeutralForeground2});
+    font-family: ${fontFamilyBase};
+    font-size: ${fontSizeBase300};
+    line-height: ${lineHeightBase300};
+    color: ${colorNeutralForeground2};
     grid-template-columns: auto 1fr auto;
     grid-template-rows: auto 1fr;
   }
 
   :host([disabled]) {
     cursor: not-allowed;
-    color: var(${colorNeutralForegroundDisabled});
+    color: ${colorNeutralForegroundDisabled};
   }
 
   :host([disabled]) ::slotted(fluent-tab) {
     pointer-events: none;
     cursor: not-allowed;
-    color: var(${colorNeutralForegroundDisabled});
+    color: ${colorNeutralForegroundDisabled};
   }
   :host([disabled]) ::slotted(fluent-tab:after) {
-    background-color: var(${colorNeutralForegroundDisabled});
+    background-color: ${colorNeutralForegroundDisabled};
   }
   :host([disabled]) ::slotted(fluent-tab[aria-selected='true'])::after {
-    background-color: var(${colorNeutralForegroundDisabled});
+    background-color: ${colorNeutralForegroundDisabled};
   }
   :host([disabled]) ::slotted(fluent-tab:hover):before {
     content: unset;
   }
 
   :host ::slotted(fluent-tab) {
-    border-radius: var(${borderRadiusMedium});
+    border-radius: ${borderRadiusMedium};
   }
 
   :host ::slotted(fluent-tab[aria-selected='true'])::before {
-    background-color: var(${colorNeutralForegroundDisabled});
+    background-color: ${colorNeutralForegroundDisabled};
   }
 
   .tablist {
@@ -95,43 +95,43 @@ export const styles = css `
   }
 
   :host([appearance='subtle']) ::slotted(fluent-tab:hover) {
-    background-color: var(${colorSubtleBackgroundHover});
-    color: var(${colorNeutralForeground1Hover});
-    fill: var(${colorCompoundBrandForeground1Hover});
+    background-color: ${colorSubtleBackgroundHover};
+    color: ${colorNeutralForeground1Hover};
+    fill: ${colorCompoundBrandForeground1Hover};
   }
 
   :host([appearance='subtle']) ::slotted(fluent-tab:active) {
-    background-color: var(${colorSubtleBackgroundPressed});
-    fill: var(${colorSubtleBackgroundPressed});
-    color: var(${colorNeutralForeground1});
+    background-color: ${colorSubtleBackgroundPressed};
+    fill: ${colorSubtleBackgroundPressed};
+    color: ${colorNeutralForeground1};
   }
 
   :host([size='small']) ::slotted(fluent-tab) {
-    font-size: var(${fontSizeBase300});
-    line-height: var(${lineHeightBase300});
-    padding: var(${spacingVerticalSNudge}) var(${spacingHorizontalSNudge});
+    font-size: ${fontSizeBase300};
+    line-height: ${lineHeightBase300};
+    padding: ${spacingVerticalSNudge} ${spacingHorizontalSNudge};
   }
 
   :host([size='large']) ::slotted(fluent-tab) {
-    font-size: var(${fontSizeBase400});
-    line-height: var(${lineHeightBase400});
-    padding: var(${spacingVerticalL}) var(${spacingHorizontalMNudge});
+    font-size: ${fontSizeBase400};
+    line-height: ${lineHeightBase400};
+    padding: ${spacingVerticalL} ${spacingHorizontalMNudge};
   }
 
   /* indicator animation  */
   :host ::slotted(fluent-tab[data-animate='true'])::after {
     transition-property: transform;
-    transition-duration: var(${durationSlow});
-    transition-timing-function: var(${curveDecelerateMax});
+    transition-duration: ${durationSlow};
+    transition-timing-function: ${curveDecelerateMax};
   }
   :host ::slotted(fluent-tab)::after {
-    height: var(${strokeWidthThicker});
+    height: ${strokeWidthThicker};
     margin-top: auto;
     transform-origin: left;
     transform: translateX(var(--tabIndicatorOffset)) scaleX(var(--tabIndicatorScale));
   }
   :host([orientation='vertical']) ::slotted(fluent-tab)::after {
-    width: var(${strokeWidthThicker});
+    width: ${strokeWidthThicker};
     height: unset;
     margin-top: unset;
     transform-origin: top;
@@ -140,8 +140,8 @@ export const styles = css `
 
   /* ::before adds a secondary indicator placeholder that appears right after click on the active tab */
   :host ::slotted(fluent-tab)::before {
-    height: var(${strokeWidthThicker});
-    border-radius: var(${borderRadiusCircular});
+    height: ${strokeWidthThicker};
+    border-radius: ${borderRadiusCircular};
     content: '';
     inset: 0;
     position: absolute;
@@ -149,13 +149,13 @@ export const styles = css `
   }
   :host([orientation='vertical']) ::slotted(fluent-tab)::before {
     height: unset;
-    width: var(${strokeWidthThicker});
+    width: ${strokeWidthThicker};
     margin-inline-end: auto;
     transform-origin: top;
   }
 
   :host ::slotted(fluent-tab[aria-selected='false']:hover)::after {
-    height: var(${strokeWidthThicker});
+    height: ${strokeWidthThicker};
     margin-top: auto;
     transform-origin: left;
   }
@@ -163,42 +163,42 @@ export const styles = css `
     height: unset;
     margin-inline-end: auto;
     transform-origin: top;
-    width: var(${strokeWidthThicker});
+    width: ${strokeWidthThicker};
   }
 
   :host([orientation='vertical']) ::slotted(fluent-tab) {
     align-items: flex-start;
     grid-column: 2;
-    padding-top: var(${spacingVerticalSNudge});
-    padding-bottom: var(${spacingVerticalSNudge});
+    padding-top: ${spacingVerticalSNudge};
+    padding-bottom: ${spacingVerticalSNudge};
   }
   :host([orientation='vertical'][size='small']) ::slotted(fluent-tab) {
-    padding-top: var(${spacingVerticalXXS});
-    padding-bottom: var(${spacingVerticalXXS});
+    padding-top: ${spacingVerticalXXS};
+    padding-bottom: ${spacingVerticalXXS};
   }
   :host([orientation='vertical'][size='large']) ::slotted(fluent-tab) {
-    padding-top: var(${spacingVerticalS});
-    padding-bottom: var(${spacingVerticalS});
+    padding-top: ${spacingVerticalS};
+    padding-bottom: ${spacingVerticalS};
   }
 
   /* horizontal spacing for indicator */
   :host([size='small']) ::slotted(fluent-tab)::after,
   :host([size='small']) ::slotted(fluent-tab)::before,
   :host([size='small']) ::slotted(fluent-tab:hover)::after {
-    right: var(${spacingHorizontalSNudge});
-    left: var(${spacingHorizontalSNudge});
+    right: ${spacingHorizontalSNudge};
+    left: ${spacingHorizontalSNudge};
   }
   :host ::slotted(fluent-tab)::after,
   :host ::slotted(fluent-tab)::before,
   :host ::slotted(fluent-tab:hover)::after {
-    right: var(${spacingHorizontalMNudge});
-    left: var(${spacingHorizontalMNudge});
+    right: ${spacingHorizontalMNudge};
+    left: ${spacingHorizontalMNudge};
   }
   :host([size='large']) ::slotted(fluent-tab)::after,
   :host([size='large']) ::slotted(fluent-tab)::before,
   :host([size='large']) ::slotted(fluent-tab:hover)::after {
-    right: var(${spacingHorizontalMNudge});
-    left: var(${spacingHorizontalMNudge});
+    right: ${spacingHorizontalMNudge};
+    left: ${spacingHorizontalMNudge};
   }
 
   /* vertical spacing for indicator */
@@ -207,24 +207,24 @@ export const styles = css `
   :host([orientation='vertical'][size='small']) ::slotted(fluent-tab:hover)::after {
     right: 0;
     left: 0;
-    top: var(${spacingVerticalSNudge});
-    bottom: var(${spacingVerticalSNudge});
+    top: ${spacingVerticalSNudge};
+    bottom: ${spacingVerticalSNudge};
   }
   :host([orientation='vertical']) ::slotted(fluent-tab)::after,
   :host([orientation='vertical']) ::slotted(fluent-tab)::before,
   :host([orientation='vertical']) ::slotted(fluent-tab:hover)::after {
     right: 0;
     left: 0;
-    top: var(${spacingVerticalS});
-    bottom: var(${spacingVerticalS});
+    top: ${spacingVerticalS};
+    bottom: ${spacingVerticalS};
   }
   :host([orientation='vertical'][size='large']) ::slotted(fluent-tab)::after,
   :host([orientation='vertical'][size='large']) ::slotted(fluent-tab)::before,
   :host([orientation='vertical'][size='large']) ::slotted(fluent-tab:hover)::after {
     right: 0;
     left: 0;
-    top: var(${spacingVerticalMNudge});
-    bottom: var(${spacingVerticalMNudge});
+    top: ${spacingVerticalMNudge};
+    bottom: ${spacingVerticalMNudge};
   }
 `;
 //# sourceMappingURL=tabs.styles.js.map

package/dist/esm/tabs/tabs.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.styles.js","sourceRoot":"","sources":["../../../src/tabs/tabs.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,yCAAyC,CAAC;AAClE,OAAO,EACL,oBAAoB,EACpB,kBAAkB,EAClB,kCAAkC,EAClC,uBAAuB,EACvB,4BAA4B,EAC5B,uBAAuB,EACvB,8BAA8B,EAC9B,0BAA0B,EAC1B,4BAA4B,EAC5B,kBAAkB,EAClB,YAAY,EACZ,cAAc,EACd,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,uBAAuB,EACvB,uBAAuB,EACvB,gBAAgB,EAChB,qBAAqB,EACrB,gBAAgB,EAChB,qBAAqB,EACrB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,MAAM,CAAC;;;;uBAII,cAAc;qBAChB,eAAe;uBACb,iBAAiB;iBACvB,uBAAuB;;;;;;;iBAOvB,8BAA8B;;;;;;iBAM9B,8BAA8B;;;4BAGnB,8BAA8B;;;4BAG9B,8BAA8B;;;;;;;yBAOjC,kBAAkB;;;;4BAIf,8BAA8B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BAwD9B,0BAA0B;iBACrC,4BAA4B;gBAC7B,kCAAkC;;;;4BAItB,4BAA4B;gBACxC,4BAA4B;iBAC3B,uBAAuB;;;;qBAInB,eAAe;uBACb,iBAAiB;mBACrB,qBAAqB,SAAS,uBAAuB;;;;qBAInD,eAAe;uBACb,iBAAiB;mBACrB,gBAAgB,SAAS,uBAAuB;;;;;;+BAMpC,YAAY;sCACL,kBAAkB;;;kBAGtC,kBAAkB;;;;;;iBAMnB,kBAAkB;;;;;;;;;kBASjB,kBAAkB;yBACX,oBAAoB;;;;;;;;iBAQ5B,kBAAkB;;;;;;kBAMjB,kBAAkB;;;;;;;;iBAQnB,kBAAkB;;;;;;uBAMZ,qBAAqB;0BAClB,qBAAqB;;;uBAGxB,kBAAkB;0BACf,kBAAkB;;;uBAGrB,gBAAgB;0BACb,gBAAgB;;;;;;;iBAOzB,uBAAuB;gBACxB,uBAAuB;;;;;iBAKtB,uBAAuB;gBACxB,uBAAuB;;;;;iBAKtB,uBAAuB;gBACxB,uBAAuB;;;;;;;;;eASxB,qBAAqB;kBAClB,qBAAqB;;;;;;;eAOxB,gBAAgB;kBACb,gBAAgB;;;;;;;eAOnB,qBAAqB;kBAClB,qBAAqB;;CAEtC,CAAC"}
+{"version":3,"file":"tabs.styles.js","sourceRoot":"","sources":["../../../src/tabs/tabs.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EACL,oBAAoB,EACpB,kBAAkB,EAClB,kCAAkC,EAClC,uBAAuB,EACvB,4BAA4B,EAC5B,uBAAuB,EACvB,8BAA8B,EAC9B,0BAA0B,EAC1B,4BAA4B,EAC5B,kBAAkB,EAClB,YAAY,EACZ,cAAc,EACd,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,uBAAuB,EACvB,uBAAuB,EACvB,gBAAgB,EAChB,qBAAqB,EACrB,gBAAgB,EAChB,qBAAqB,EACrB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,MAAM,CAAC;;;;mBAIA,cAAc;iBAChB,eAAe;mBACb,iBAAiB;aACvB,uBAAuB;;;;;;;aAOvB,8BAA8B;;;;;;aAM9B,8BAA8B;;;wBAGnB,8BAA8B;;;wBAG9B,8BAA8B;;;;;;;qBAOjC,kBAAkB;;;;wBAIf,8BAA8B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAwD9B,0BAA0B;aACrC,4BAA4B;YAC7B,kCAAkC;;;;wBAItB,4BAA4B;YACxC,4BAA4B;aAC3B,uBAAuB;;;;iBAInB,eAAe;mBACb,iBAAiB;eACrB,qBAAqB,IAAI,uBAAuB;;;;iBAI9C,eAAe;mBACb,iBAAiB;eACrB,gBAAgB,IAAI,uBAAuB;;;;;;2BAM/B,YAAY;kCACL,kBAAkB;;;cAGtC,kBAAkB;;;;;;aAMnB,kBAAkB;;;;;;;;;cASjB,kBAAkB;qBACX,oBAAoB;;;;;;;;aAQ5B,kBAAkB;;;;;;cAMjB,kBAAkB;;;;;;;;aAQnB,kBAAkB;;;;;;mBAMZ,qBAAqB;sBAClB,qBAAqB;;;mBAGxB,kBAAkB;sBACf,kBAAkB;;;mBAGrB,gBAAgB;sBACb,gBAAgB;;;;;;;aAOzB,uBAAuB;YACxB,uBAAuB;;;;;aAKtB,uBAAuB;YACxB,uBAAuB;;;;;aAKtB,uBAAuB;YACxB,uBAAuB;;;;;;;;;WASxB,qBAAqB;cAClB,qBAAqB;;;;;;;WAOxB,gBAAgB;cACb,gBAAgB;;;;;;;WAOnB,qBAAqB;cAClB,qBAAqB;;CAElC,CAAC"}

package/dist/esm/tabs/tabs.template.js

@@ -1,3 +1,16 @@
-import { tabsTemplate } from '@microsoft/fast-foundation/tabs.js';
+import { html, slotted } from '@microsoft/fast-element';
+import { endSlotTemplate, startSlotTemplate } from '../patterns/index.js';
+export function tabsTemplate(options = {}) {
+    return html `
+    ${startSlotTemplate(options)}
+    <div class="tablist" part="tablist" role="tablist">
+      <slot name="tab" ${slotted('tabs')}></slot>
+    </div>
+    ${endSlotTemplate(options)}
+    <div class="tabpanel" part="tabpanel">
+      <slot name="tabpanel" ${slotted('tabpanels')}></slot>
+    </div>
+  `;
+}
 export const template = tabsTemplate({});
 //# sourceMappingURL=tabs.template.js.map

package/dist/esm/tabs/tabs.template.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.template.js","sourceRoot":"","sources":["../../../src/tabs/tabs.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAElE,MAAM,CAAC,MAAM,QAAQ,GAAG,YAAY,CAAC,EAAE,CAAC,CAAC"}
+{"version":3,"file":"tabs.template.js","sourceRoot":"","sources":["../../../src/tabs/tabs.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAC7E,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAI1E,MAAM,UAAU,YAAY,CAAiB,UAAuB,EAAE;IACpE,OAAO,IAAI,CAAG;MACV,iBAAiB,CAAC,OAAO,CAAC;;yBAEP,OAAO,CAAC,MAAM,CAAC;;MAElC,eAAe,CAAC,OAAO,CAAC;;8BAEA,OAAO,CAAC,WAAW,CAAC;;GAE/C,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,YAAY,CAAC,EAAE,CAAC,CAAC"}

package/dist/esm/text/index.js

@@ -1,5 +1,5 @@
-export * from './text.js';
-export * from './text.options.js';
+export { Text } from './text.js';
+export { TextAlign, TextFont, TextSize, TextWeight } from './text.options.js';
 export { template as TextTemplate } from './text.template.js';
 export { styles as TextStyles } from './text.styles.js';
 export { definition as TextDefinition } from './text.definition.js';

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/text/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,mBAAmB,CAAC;AAClC,OAAO,EAAE,QAAQ,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/text/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC9E,OAAO,EAAE,QAAQ,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC"}

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

@@ -0,0 +1,13 @@
+import { FluentDesignSystem } from '../fluent-design-system.js';
+import { definition } from './text.definition.js';
+definition.define(FluentDesignSystem.registry);
+const itemRenderer = () => {
+    const text = document.createElement('fluent-text');
+    const p = document.createElement('p');
+    p.appendChild(document.createTextNode('text'));
+    text.appendChild(p);
+    return text;
+};
+export default itemRenderer;
+export { tests } from '../utils/benchmark-wrapper.js';
+//# sourceMappingURL=text.bench.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"text.bench.js","sourceRoot":"","sources":["../../../src/text/text.bench.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,UAAU,CAAC,MAAM,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;AAE/C,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;IACnD,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IACtC,CAAC,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IAC/C,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;IACpB,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC;AAC5B,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/esm/text/text.js

@@ -1,10 +1,6 @@
-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, FASTElement } from '@microsoft/fast-element';
+import { __decorate } from "tslib";
+import { attr, FASTElement, Observable } from '@microsoft/fast-element';
+import { toggleState } from '../utils/element-internals.js';
 /**
  * The base class used for constructing a fluent-text custom element
  * @public
@@ -12,6 +8,12 @@ import { attr, FASTElement } from '@microsoft/fast-element';
 export class Text extends FASTElement {
     constructor() {
         super(...arguments);
+        /**
+         * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
+         *
+         * @internal
+         */
+        this.elementInternals = this.attachInternals();
         /**
          * The text will not wrap
          * NOTE: In Fluent UI React v9 this is "wrap"
@@ -63,6 +65,89 @@ export class Text extends FASTElement {
          */
         this.block = false;
     }
+    /**
+     * Handles changes to size attribute custom states
+     * @param prev - the previous state
+     * @param next - the next state
+     */
+    sizeChanged(prev, next) {
+        if (prev) {
+            toggleState(this.elementInternals, `size-${prev}`, false);
+        }
+        if (next) {
+            toggleState(this.elementInternals, `size-${next}`, true);
+        }
+    }
+    /**
+     * Handles changes to font attribute custom states
+     * @param prev - the previous state
+     * @param next - the next state
+     */
+    fontChanged(prev, next) {
+        if (prev) {
+            toggleState(this.elementInternals, prev, false);
+        }
+        if (next) {
+            toggleState(this.elementInternals, next, true);
+        }
+    }
+    /**
+     * Handles changes to weight attribute custom states
+     * @param prev - the previous state
+     * @param next - the next state
+     */
+    weightChanged(prev, next) {
+        if (prev) {
+            toggleState(this.elementInternals, prev, false);
+        }
+        if (next) {
+            toggleState(this.elementInternals, next, true);
+        }
+    }
+    /**
+     * Handles changes to align attribute custom states
+     * @param prev - the previous state
+     * @param next - the next state
+     */
+    alignChanged(prev, next) {
+        if (prev) {
+            toggleState(this.elementInternals, prev, false);
+        }
+        if (next) {
+            toggleState(this.elementInternals, next, true);
+        }
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        Observable.getNotifier(this).subscribe(this);
+        Object.keys(this.$fastController.definition.attributeLookup).forEach(key => {
+            this.handleChange(this, key);
+        });
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        Observable.getNotifier(this).unsubscribe(this);
+    }
+    /**
+     * Handles changes to observable properties
+     * @internal
+     * @param source - the source of the change
+     * @param propertyName - the property name being changed
+     */
+    handleChange(source, propertyName) {
+        switch (propertyName) {
+            case 'nowrap':
+            case 'truncate':
+            case 'italic':
+            case 'underline':
+            case 'strikethrough':
+            case 'block':
+                toggleState(this.elementInternals, propertyName, !!this[propertyName]);
+                break;
+            default:
+                break;
+        }
+    }
 }
 __decorate([
     attr({ mode: 'boolean' })

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

@@ -1 +1 @@
-{"version":3,"file":"text.js","sourceRoot":"","sources":["../../../src/text/text.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAG5D;;;GAGG;AACH,MAAM,OAAO,IAAK,SAAQ,WAAW;IAArC;;QACE;;;;;;;;WAQG;QAEH,WAAM,GAAY,KAAK,CAAC;QAExB;;;;;;WAMG;QAEH,aAAQ,GAAY,KAAK,CAAC;QAE1B;;;;;;WAMG;QAEH,WAAM,GAAY,KAAK,CAAC;QAExB;;;;;;WAMG;QAEH,cAAS,GAAY,KAAK,CAAC;QAE3B;;;;;;WAMG;QAEH,kBAAa,GAAY,KAAK,CAAC;QAE/B;;;;;;WAMG;QAEH,UAAK,GAAY,KAAK,CAAC;IA0CzB,CAAC;CAAA;AA5FC;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;oCACF;AAUxB;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;sCACA;AAU1B;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;oCACF;AAUxB;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;uCACC;AAU3B;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;2CACK;AAU/B;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;mCACH;AAWvB;IADC,IAAI;kCACW;AAUhB;IADC,IAAI;kCACW;AAUhB;IADC,IAAI;oCACe;AAUpB;IADC,IAAI;mCACa"}
+{"version":3,"file":"text.js","sourceRoot":"","sources":["../../../src/text/text.ts"],"names":[],"mappings":"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"}

package/dist/esm/text/text.styles.js

@@ -1,6 +1,26 @@
 import { css } from '@microsoft/fast-element';
-import { display } from '@microsoft/fast-foundation/utilities.js';
+import { display } from '../utils/index.js';
 import { fontFamilyBase, fontFamilyMonospace, fontFamilyNumeric, fontSizeBase100, fontSizeBase200, fontSizeBase300, fontSizeBase400, fontSizeBase500, fontSizeBase600, fontSizeHero1000, fontSizeHero700, fontSizeHero800, fontSizeHero900, fontWeightBold, fontWeightMedium, fontWeightRegular, fontWeightSemibold, lineHeightBase100, lineHeightBase200, lineHeightBase300, lineHeightBase400, lineHeightBase500, lineHeightBase600, lineHeightHero1000, lineHeightHero700, lineHeightHero800, lineHeightHero900, } from '../theme/design-tokens.js';
+/**
+ * Selector for the `nowrap` state.
+ * @public
+ */
+const nowrapState = css.partial `:is([state--nowrap], :state(nowrap))`;
+/**
+ * Selector for the `truncate` state.
+ * @public
+ */
+const truncateState = css.partial `:is([state--truncate], :state(truncate))`;
+/**
+ * Selector for the `underline` state.
+ * @public
+ */
+const underlineState = css.partial `:is([state--underline], :state(underline))`;
+/**
+ * Selector for the `strikethrough` state.
+ * @public
+ */
+const strikethroughState = css.partial `:is([state--strikethrough], :state(strikethrough))`;
 /** Text styles
  * @public
  */
@@ -9,103 +29,105 @@ export const styles = css `
 
   :host {
     contain: content;
-  }
-
-  ::slotted(*) {
-    font-family: var(${fontFamilyBase});
-    font-size: var(${fontSizeBase300});
-    line-height: var(${lineHeightBase300});
-    font-weight: var(${fontWeightRegular});
+    font-family: ${fontFamilyBase};
+    font-size: ${fontSizeBase300};
+    line-height: ${lineHeightBase300};
+    font-weight: ${fontWeightRegular};
     text-align: start;
-    white-space: normal;
-    overflow: visible;
-    text-overflow: clip;
-    margin: 0;
-    display: inline;
   }
 
-  :host([nowrap]) ::slotted(*) {
+  :host(${nowrapState}),
+  :host(${nowrapState}) ::slotted(*) {
     white-space: nowrap;
     overflow: hidden;
   }
-  :host([truncate]) ::slotted(*) {
+  :host(${truncateState}),
+  :host(${truncateState}) ::slotted(*) {
     text-overflow: ellipsis;
   }
-  :host([block]),
-  :host([block]) ::slotted(*) {
+  :host(:is([state--block], :state(block))) {
     display: block;
   }
-  :host([italic]) ::slotted(*) {
+  :host(:is([state--italic], :state(italic))) {
     font-style: italic;
   }
-  :host([underline]) ::slotted(*) {
+  :host(${underlineState}) {
     text-decoration-line: underline;
   }
-  :host([strikethrough]) ::slotted(*) {
+  :host(${strikethroughState}) {
     text-decoration-line: line-through;
   }
-  :host([underline][strikethrough]) ::slotted(*) {
+  :host(${underlineState}${strikethroughState}) {
     text-decoration-line: line-through underline;
   }
-  :host([size='100']) ::slotted(*) {
-    font-size: var(${fontSizeBase100});
-    line-height: var(${lineHeightBase100});
+  :host(:is([state--size-100], :state(size-100))) {
+    font-size: ${fontSizeBase100};
+    line-height: ${lineHeightBase100};
   }
-  :host([size='200']) ::slotted(*) {
-    font-size: var(${fontSizeBase200});
-    line-height: var(${lineHeightBase200});
+  :host(:is([state--size-200], :state(size-200))) {
+    font-size: ${fontSizeBase200};
+    line-height: ${lineHeightBase200};
   }
-  :host([size='400']) ::slotted(*) {
-    font-size: var(${fontSizeBase400});
-    line-height: var(${lineHeightBase400});
+  :host(:is([state--size-400], :state(size-400))) {
+    font-size: ${fontSizeBase400};
+    line-height: ${lineHeightBase400};
   }
-  :host([size='500']) ::slotted(*) {
-    font-size: var(${fontSizeBase500});
-    line-height: var(${lineHeightBase500});
+  :host(:is([state--size-500], :state(size-500))) {
+    font-size: ${fontSizeBase500};
+    line-height: ${lineHeightBase500};
   }
-  :host([size='600']) ::slotted(*) {
-    font-size: var(${fontSizeBase600});
-    line-height: var(${lineHeightBase600});
+  :host(:is([state--size-600], :state(size-600))) {
+    font-size: ${fontSizeBase600};
+    line-height: ${lineHeightBase600};
   }
-  :host([size='700']) ::slotted(*) {
-    font-size: var(${fontSizeHero700});
-    line-height: var(${lineHeightHero700});
+  :host(:is([state--size-700], :state(size-700))) {
+    font-size: ${fontSizeHero700};
+    line-height: ${lineHeightHero700};
   }
-  :host([size='800']) ::slotted(*) {
-    font-size: var(${fontSizeHero800});
-    line-height: var(${lineHeightHero800});
+  :host(:is([state--size-800], :state(size-800))) {
+    font-size: ${fontSizeHero800};
+    line-height: ${lineHeightHero800};
   }
-  :host([size='900']) ::slotted(*) {
-    font-size: var(${fontSizeHero900});
-    line-height: var(${lineHeightHero900});
+  :host(:is([state--size-900], :state(size-900))) {
+    font-size: ${fontSizeHero900};
+    line-height: ${lineHeightHero900};
   }
-  :host([size='1000']) ::slotted(*) {
-    font-size: var(${fontSizeHero1000});
-    line-height: var(${lineHeightHero1000});
+  :host(:is([state--size-1000], :state(size-1000))) {
+    font-size: ${fontSizeHero1000};
+    line-height: ${lineHeightHero1000};
   }
-  :host([font='monospace']) ::slotted(*) {
-    font-family: var(${fontFamilyMonospace});
+  :host(:is([state--monospace], :state(monospace))) {
+    font-family: ${fontFamilyMonospace};
   }
-  :host([font='numeric']) ::slotted(*) {
-    font-family: var(${fontFamilyNumeric});
+  :host(:is([state--numeric], :state(numeric))) {
+    font-family: ${fontFamilyNumeric};
   }
-  :host([weight='medium']) ::slotted(*) {
-    font-weight: var(${fontWeightMedium});
+  :host(:is([state--medium], :state(medium))) {
+    font-weight: ${fontWeightMedium};
   }
-  :host([weight='semibold']) ::slotted(*) {
-    font-weight: var(${fontWeightSemibold});
+  :host(:is([state--semibold], :state(semibold))) {
+    font-weight: ${fontWeightSemibold};
   }
-  :host([weight='bold']) ::slotted(*) {
-    font-weight: var(${fontWeightBold});
+  :host(:is([state--bold], :state(bold))) {
+    font-weight: ${fontWeightBold};
   }
-  :host([align='center']) ::slotted(*) {
+  :host(:is([state--center], :state(center))) {
     text-align: center;
   }
-  :host([align='end']) ::slotted(*) {
+  :host(:is([state--end], :state(end))) {
     text-align: end;
   }
-  :host([align='justify']) ::slotted(*) {
+  :host(:is([state--justify], :state(justify))) {
     text-align: justify;
   }
+
+  ::slotted(*) {
+    font: inherit;
+    line-height: inherit;
+    text-decoration-line: inherit;
+    text-align: inherit;
+    text-decoration-line: inherit;
+    margin: 0;
+  }
 `;
 //# sourceMappingURL=text.styles.js.map

package/dist/esm/text/text.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"text.styles.js","sourceRoot":"","sources":["../../../src/text/text.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,yCAAyC,CAAC;AAClE,OAAO,EACL,cAAc,EACd,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,2BAA2B,CAAC;AAEnC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,QAAQ,CAAC;;;;;;;uBAOE,cAAc;qBAChB,eAAe;uBACb,iBAAiB;uBACjB,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAiCnB,eAAe;uBACb,iBAAiB;;;qBAGnB,eAAe;uBACb,iBAAiB;;;qBAGnB,eAAe;uBACb,iBAAiB;;;qBAGnB,eAAe;uBACb,iBAAiB;;;qBAGnB,eAAe;uBACb,iBAAiB;;;qBAGnB,eAAe;uBACb,iBAAiB;;;qBAGnB,eAAe;uBACb,iBAAiB;;;qBAGnB,eAAe;uBACb,iBAAiB;;;qBAGnB,gBAAgB;uBACd,kBAAkB;;;uBAGlB,mBAAmB;;;uBAGnB,iBAAiB;;;uBAGjB,gBAAgB;;;uBAGhB,kBAAkB;;;uBAGlB,cAAc;;;;;;;;;;;CAWpC,CAAC"}
+{"version":3,"file":"text.styles.js","sourceRoot":"","sources":["../../../src/text/text.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EACL,cAAc,EACd,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,eAAe,EACf,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,2BAA2B,CAAC;AAEnC;;;GAGG;AACH,MAAM,WAAW,GAAG,GAAG,CAAC,OAAO,CAAA,sCAAsC,CAAC;AAEtE;;;GAGG;AACH,MAAM,aAAa,GAAG,GAAG,CAAC,OAAO,CAAA,0CAA0C,CAAC;AAE5E;;;GAGG;AACH,MAAM,cAAc,GAAG,GAAG,CAAC,OAAO,CAAA,4CAA4C,CAAC;AAE/E;;;GAGG;AACH,MAAM,kBAAkB,GAAG,GAAG,CAAC,OAAO,CAAA,oDAAoD,CAAC;AAE3F;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,QAAQ,CAAC;;;;mBAIF,cAAc;iBAChB,eAAe;mBACb,iBAAiB;mBACjB,iBAAiB;;;;UAI1B,WAAW;UACX,WAAW;;;;UAIX,aAAa;UACb,aAAa;;;;;;;;;UASb,cAAc;;;UAGd,kBAAkB;;;UAGlB,cAAc,GAAG,kBAAkB;;;;iBAI5B,eAAe;mBACb,iBAAiB;;;iBAGnB,eAAe;mBACb,iBAAiB;;;iBAGnB,eAAe;mBACb,iBAAiB;;;iBAGnB,eAAe;mBACb,iBAAiB;;;iBAGnB,eAAe;mBACb,iBAAiB;;;iBAGnB,eAAe;mBACb,iBAAiB;;;iBAGnB,eAAe;mBACb,iBAAiB;;;iBAGnB,eAAe;mBACb,iBAAiB;;;iBAGnB,gBAAgB;mBACd,kBAAkB;;;mBAGlB,mBAAmB;;;mBAGnB,iBAAiB;;;mBAGjB,gBAAgB;;;mBAGhB,kBAAkB;;;mBAGlB,cAAc;;;;;;;;;;;;;;;;;;;;CAoBhC,CAAC"}

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

@@ -1,7 +1,6 @@
-export * from './text-input.js';
-export * from './text-input.options.js';
-export { template as TextInputTemplate } from './text-input.template.js';
-export { styles as TextInputStyles } from './text-input.styles.js';
 export { definition as TextInputDefinition } from './text-input.definition.js';
-export { TextFieldType as TextInputType } from '@microsoft/fast-foundation/text-field.js';
+export { BaseTextInput, TextInput } from './text-input.js';
+export { TextInputAppearance, TextInputControlSize, TextInputType } from './text-input.options.js';
+export { styles as TextInputStyles } from './text-input.styles.js';
+export { template as TextInputTemplate } from './text-input.template.js';
 //# sourceMappingURL=index.js.map

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,cAAc,iBAAiB,CAAC;AAChC,cAAc,yBAAyB,CAAC;AACxC,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAAE,UAAU,IAAI,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAC/E,OAAO,EAAE,aAAa,IAAI,aAAa,EAAE,MAAM,0CAA0C,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,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC3D,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"}