@ni/nimble-components 11.8.0 → 11.8.3

package/dist/esm/breadcrumb/styles.js

@@ -2,6 +2,7 @@ import { css } from '@microsoft/fast-element';
 import { display } from '@microsoft/fast-foundation';
 import { DigitalGreenDark, PowerGreen, White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';
 import { bodyEmphasizedFont, bodyFont, bodyFontColor } from '../theme-provider/design-tokens';
+import { Theme } from '../theme-provider/types';
 import { hexToRgbaCssColor } from '../utilities/style/colors';
 import { themeBehavior } from '../utilities/style/theme';
 export const styles = css `
@@ -29,8 +30,7 @@ export const styles = css `
     ::slotted(*:not([href]):last-child) {
         font: ${bodyEmphasizedFont};
     }
-`.withBehaviors(themeBehavior(css `
-            ${'' /* Light theme */}
+`.withBehaviors(themeBehavior(Theme.light, css `
             :host {
                 --ni-private-breadcrumb-link-active-font-color: ${DigitalGreenDark};
             }
@@ -38,8 +38,7 @@ export const styles = css `
             :host(.prominent-links) {
                 --ni-private-breadcrumb-link-font-color: ${DigitalGreenDark};
             }
-        `, css `
-            ${'' /* Dark theme */}
+        `), themeBehavior(Theme.dark, css `
             :host {
                 --ni-private-breadcrumb-link-active-font-color: ${PowerGreen};
             }
@@ -47,8 +46,7 @@ export const styles = css `
             :host(.prominent-links) {
                 --ni-private-breadcrumb-link-font-color: ${PowerGreen};
             }
-        `, css `
-            ${'' /* Color theme */}
+        `), themeBehavior(Theme.color, css `
             :host {
                 --ni-private-breadcrumb-link-active-font-color: ${hexToRgbaCssColor(White, 0.6)};
             }

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/breadcrumb/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,gBAAgB,EAChB,UAAU,EACV,KAAK,EACR,MAAM,kDAAkD,CAAC;AAC1D,OAAO,EACH,kBAAkB,EAClB,QAAQ,EACR,aAAa,EAChB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,cAAc,CAAC;;;;gBAIb,QAAQ;mDAC2B,aAAa;;;;;;;;;0DASN,aAAa;;;;;;;;gBAQvD,kBAAkB;;CAEjC,CAAC,aAAa,CACP,aAAa,CACT,GAAG,CAAA;cACD,EAAE,CAAC,iBAAiB;;kEAEgC,gBAAgB;;;;2DAIvB,gBAAgB;;SAElE,EACG,GAAG,CAAA;cACD,EAAE,CAAC,gBAAgB;;kEAEiC,UAAU;;;;2DAIjB,UAAU;;SAE5D,EACG,GAAG,CAAA;cACD,EAAE,CAAC,iBAAiB;;kEAEgC,iBAAiB,CACnE,KAAK,EACL,GAAG,CACN;;;;2DAI8C,UAAU;;SAE5D,CACA,CACJ,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/breadcrumb/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,gBAAgB,EAChB,UAAU,EACV,KAAK,EACR,MAAM,kDAAkD,CAAC;AAC1D,OAAO,EACH,kBAAkB,EAClB,QAAQ,EACR,aAAa,EAChB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,cAAc,CAAC;;;;gBAIb,QAAQ;mDAC2B,aAAa;;;;;;;;;0DASN,aAAa;;;;;;;;gBAQvD,kBAAkB;;CAEjC,CAAC,aAAa,CACP,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;kEAEmD,gBAAgB;;;;2DAIvB,gBAAgB;;SAElE,CACA,EACD,aAAa,CACT,KAAK,CAAC,IAAI,EACV,GAAG,CAAA;;kEAEmD,UAAU;;;;2DAIjB,UAAU;;SAE5D,CACA,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;kEAEmD,iBAAiB,CACnE,KAAK,EACL,GAAG,CACN;;;;2DAI8C,UAAU;;SAE5D,CACA,CACJ,CAAC"}

package/dist/esm/breadcrumb-item/styles.js

@@ -28,7 +28,7 @@ export const styles = css `
         padding-right: calc(4px - ${borderWidth});
     }
 
-    .control:link {
+    .control:any-link {
         cursor: pointer;
         text-decoration: none;
     }
@@ -42,7 +42,7 @@ export const styles = css `
         text-decoration: underline;
     }
 
-    .control:link${focusVisible} {
+    .control:any-link${focusVisible} {
         border: ${borderWidth} solid ${borderHoverColor};
         outline: 2px solid ${borderHoverColor};
         outline-offset: 1px;

package/dist/esm/breadcrumb-item/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/breadcrumb-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,oBAAoB,EACvB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAExD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;kBAGV,aAAa;;gBAEf,QAAQ;iBACP,aAAa;mCACK,WAAW;;;;;;;;;;;;;;kBAc5B,WAAW;oCACO,WAAW;;;;;;;;;;;;;;;;;mBAiB5B,YAAY;kBACb,WAAW,UAAU,gBAAgB;6BAC1B,gBAAgB;;;;;;;;;;;;;;;;;;;;iBAoB5B,QAAQ;kBACP,QAAQ;;;;gBAIV,oBAAoB;;CAEnC,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/breadcrumb-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,oBAAoB,EACvB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAExD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;kBAGV,aAAa;;gBAEf,QAAQ;iBACP,aAAa;mCACK,WAAW;;;;;;;;;;;;;;kBAc5B,WAAW;oCACO,WAAW;;;;;;;;;;;;;;;;;uBAiBxB,YAAY;kBACjB,WAAW,UAAU,gBAAgB;6BAC1B,gBAAgB;;;;;;;;;;;;;;;;;;;;iBAoB5B,QAAQ;kBACP,QAAQ;;;;gBAIV,oBAAoB;;CAEnC,CAAC"}

package/dist/esm/card-button/styles.js

@@ -5,6 +5,7 @@ import { focusVisible } from '../utilities/style/focus';
 import { borderWidth, smallDelay, buttonLabelFont, buttonLabelFontColor, borderHoverColor } from '../theme-provider/design-tokens';
 import { themeBehavior } from '../utilities/style/theme';
 import { hexToRgbaCssColor } from '../utilities/style/colors';
+import { Theme } from '../theme-provider/types';
 // prettier-ignore
 export const styles = css `
     ${display('inline-flex')}
@@ -114,10 +115,7 @@ export const styles = css `
             transition-duration: 0s;
         }
     }
-`
-    .withBehaviors(themeBehavior(
-// Light theme
-css `
+`.withBehaviors(themeBehavior(Theme.light, css `
                 :host {
                     --ni-private-card-button-box-shadow-hover-color: ${hexToRgbaCssColor(Black, 0.3)};
                     --ni-private-card-button-background-hover-color: ${hexToRgbaCssColor(White, 0.3)};
@@ -125,9 +123,7 @@ css `
                     --ni-private-card-button-border-active-color: ${hexToRgbaCssColor(Black91, 0.2)};
                     --ni-private-card-button-border-selected-color: ${hexToRgbaCssColor(Black91, 0.6)};
                 }
-            `, 
-// Dark theme
-css `
+            `), themeBehavior(Theme.dark, css `
                 :host {
                     --ni-private-card-button-box-shadow-hover-color: ${hexToRgbaCssColor(Black, 0.77)};
                     --ni-private-card-button-background-hover-color: ${hexToRgbaCssColor(Black15, 0.07)};
@@ -135,9 +131,7 @@ css `
                     --ni-private-card-button-border-active-color: ${hexToRgbaCssColor(Black15, 0.2)};
                     --ni-private-card-button-border-selected-color: ${Black15};
                 }
-            `, 
-// Color theme
-css `
+            `), themeBehavior(Theme.color, css `
                 :host {
                     --ni-private-card-button-box-shadow-hover-color: ${hexToRgbaCssColor(White, 0.77)};
                     --ni-private-card-button-background-hover-color: ${hexToRgbaCssColor(White, 0.2)};

package/dist/esm/card-button/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/card-button/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACH,KAAK,EACL,OAAO,EACP,OAAO,EACP,KAAK,EACR,MAAM,kDAAkD,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAExD,OAAO,EACH,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,gBAAgB,EACnB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9D,kBAAkB;AAClB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;;iBAIX,oBAAoB;gBACrB,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;kBAyBb,WAAW;;;;;;;iCAOI,UAAU;;;;;;;;cAQ7B,YAAY;kCACQ,WAAW,IAAI,gBAAgB;wBACzC,gBAAgB;mBACrB,WAAW,UAAU,gBAAgB;;;;;;;;;;;;;;;;gCAgBxB,YAAY;wBACpB,gBAAgB;;;;;;;gCAOR,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmC3C;KACI,aAAa,CACV,aAAa;AACT,cAAc;AACd,GAAG,CAAA;;uEAEwD,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;uEAC7B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;wEAC5B,KAAK;oEACT,iBAAiB,CAAC,OAAO,EAAE,GAAG,CAAC;sEAC7B,iBAAiB,CAAC,OAAO,EAAE,GAAG,CAAC;;aAExF;AACD,aAAa;AACb,GAAG,CAAA;;uEAEwD,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;uEAC9B,iBAAiB,CAAC,OAAO,EAAE,IAAI,CAAC;wEAC/B,iBAAiB,CAAC,OAAO,EAAE,IAAI,CAAC;oEACpC,iBAAiB,CAAC,OAAO,EAAE,GAAG,CAAC;sEAC7B,OAAO;;aAEhE;AACD,cAAc;AACd,GAAG,CAAA;;uEAEwD,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;uEAC9B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;wEAC5B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;oEACjC,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;sEAC3B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;;aAEtF,CACJ,CACJ,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/card-button/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACH,KAAK,EACL,OAAO,EACP,OAAO,EACP,KAAK,EACR,MAAM,kDAAkD,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAExD,OAAO,EACH,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,gBAAgB,EACnB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAEhD,kBAAkB;AAClB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;;iBAIX,oBAAoB;gBACrB,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;kBAyBb,WAAW;;;;;;;iCAOI,UAAU;;;;;;;;cAQ7B,YAAY;kCACQ,WAAW,IAAI,gBAAgB;wBACzC,gBAAgB;mBACrB,WAAW,UAAU,gBAAgB;;;;;;;;;;;;;;;;gCAgBxB,YAAY;wBACpB,gBAAgB;;;;;;;gCAOR,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmC3C,CAAC,aAAa,CACP,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;uEAEwD,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;uEAC7B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;wEAC5B,KAAK;oEACT,iBAAiB,CAAC,OAAO,EAAE,GAAG,CAAC;sEAC7B,iBAAiB,CAAC,OAAO,EAAE,GAAG,CAAC;;aAExF,CACJ,EAAE,aAAa,CACZ,KAAK,CAAC,IAAI,EACV,GAAG,CAAA;;uEAEwD,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;uEAC9B,iBAAiB,CAAC,OAAO,EAAE,IAAI,CAAC;wEAC/B,iBAAiB,CAAC,OAAO,EAAE,IAAI,CAAC;oEACpC,iBAAiB,CAAC,OAAO,EAAE,GAAG,CAAC;sEAC7B,OAAO;;aAEhE,CACJ,EAAE,aAAa,CACZ,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;uEAEwD,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;uEAC9B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;wEAC5B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;oEACjC,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;sEAC3B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;;aAEtF,CACJ,CACJ,CAAC"}

package/dist/esm/combobox/index.js

@@ -121,6 +121,7 @@ const nimbleCombobox = Combobox.compose({
                 part="button"
                 aria-haspopup="true"
                 aria-expanded="${x => x.open}"
+                tabindex="-1"
             >
                 <nimble-icon-arrow-expander-down
                     slot="start"

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

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

package/dist/esm/switch/styles.js

@@ -2,6 +2,7 @@ import { css } from '@microsoft/fast-element';
 import { display } from '@microsoft/fast-foundation';
 import { Black15, Black7, Black91, White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';
 import { borderHoverColor, borderWidth, buttonLabelDisabledFontColor, buttonLabelFont, buttonLabelFontColor, controlHeight, controlLabelDisabledFontColor, controlLabelFont, controlLabelFontColor, fillHoverColor, smallDelay } from '../theme-provider/design-tokens';
+import { Theme } from '../theme-provider/types';
 import { hexToRgbaCssColor } from '../utilities/style/colors';
 import { focusVisible } from '../utilities/style/focus';
 import { themeBehavior } from '../utilities/style/theme';
@@ -143,8 +144,7 @@ export const styles = css `
             transition-duration: 0s;
         }
     }
-`.withBehaviors(themeBehavior(css `
-            ${'' /* Light theme */}
+`.withBehaviors(themeBehavior(Theme.light, css `
             :host {
                 --ni-private-switch-background-disabled-color: ${hexToRgbaCssColor(Black91, 0.07)};
                 --ni-private-switch-indicator-background-color: ${White};
@@ -152,8 +152,7 @@ export const styles = css `
                 --ni-private-switch-indicator-border-color: ${Black91};
                 --ni-private-switch-indicator-border-disabled-color: ${hexToRgbaCssColor(Black91, 0.3)};
             }
-        `, css `
-            ${'' /* Dark theme */}
+        `), themeBehavior(Theme.dark, css `
             :host {
                 --ni-private-switch-background-disabled-color: ${hexToRgbaCssColor(Black15, 0.07)};
                 --ni-private-switch-indicator-background-color: ${hexToRgbaCssColor(Black91, 0.3)};
@@ -161,8 +160,7 @@ export const styles = css `
                 --ni-private-switch-indicator-border-color: ${Black7};
                 --ni-private-switch-indicator-border-disabled-color: ${hexToRgbaCssColor(Black7, 0.3)};
             }
-        `, css `
-            ${'' /* Color theme */}
+        `), themeBehavior(Theme.color, css `
             :host {
                 --ni-private-switch-background-disabled-color: ${hexToRgbaCssColor(White, 0.07)};
                 --ni-private-switch-indicator-background-color: ${hexToRgbaCssColor(White, 0.1)};

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/switch/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,OAAO,EACP,MAAM,EACN,OAAO,EACP,KAAK,EACR,MAAM,kDAAkD,CAAC;AAC1D,OAAO,EACH,gBAAgB,EAChB,WAAW,EACX,4BAA4B,EAC5B,eAAe,EACf,oBAAoB,EACpB,aAAa,EACb,6BAA6B,EAC7B,gBAAgB,EAChB,qBAAqB,EACrB,cAAc,EACd,UAAU,EACb,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;;gBAIZ,eAAe;iBACd,oBAAoB;;;;;;cAMvB,aAAa;;;;;;iBAMV,4BAA4B;;;;iBAI5B,qBAAqB;gBACtB,gBAAgB;;;;iBAIf,6BAA6B;;;;;;;;;;;;;;;;;;;;;;4BAsBlB,cAAc;;;uBAGnB,WAAW;;;;;;;YAOtB,YAAY;wBACA,gBAAgB;;;;;gCAKR,UAAU;;;;;gCAKV,UAAU;;;;;;;;;;;;;;;;;;kBAkBxB,WAAW;;;;;uBAKN,WAAW,eAAe,gBAAgB;;;;;;;kBAO/C,WAAW;;;;YAIjB,YAAY;kBACN,WAAW,UAAU,gBAAgB;;;;;;;;;8BASzB,UAAU;;;;;;;;;;;8BAWV,UAAU;;;;;;;;;;;;;CAavC,CAAC,aAAa,CACP,aAAa,CACT,GAAG,CAAA;cACD,EAAE,CAAC,iBAAiB;;iEAE+B,iBAAiB,CAClE,OAAO,EACP,IAAI,CACP;kEACqD,KAAK;2EACI,iBAAiB,CAC5E,KAAK,EACL,GAAG,CACN;8DACiD,OAAO;uEACE,iBAAiB,CACxE,OAAO,EACP,GAAG,CACN;;SAEJ,EACG,GAAG,CAAA;cACD,EAAE,CAAC,gBAAgB;;iEAEgC,iBAAiB,CAClE,OAAO,EACP,IAAI,CACP;kEACqD,iBAAiB,CACnE,OAAO,EACP,GAAG,CACN;2EAC8D,iBAAiB,CAC5E,OAAO,EACP,GAAG,CACN;8DACiD,MAAM;uEACG,iBAAiB,CACxE,MAAM,EACN,GAAG,CACN;;SAEJ,EACG,GAAG,CAAA;cACD,EAAE,CAAC,iBAAiB;;iEAE+B,iBAAiB,CAClE,KAAK,EACL,IAAI,CACP;kEACqD,iBAAiB,CACnE,KAAK,EACL,GAAG,CACN;2EAC8D,iBAAiB,CAC5E,KAAK,EACL,GAAG,CACN;8DACiD,KAAK;uEACI,iBAAiB,CACxE,KAAK,EACL,GAAG,CACN;;SAEJ,CACA,CACJ,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/switch/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,OAAO,EACP,MAAM,EACN,OAAO,EACP,KAAK,EACR,MAAM,kDAAkD,CAAC;AAC1D,OAAO,EACH,gBAAgB,EAChB,WAAW,EACX,4BAA4B,EAC5B,eAAe,EACf,oBAAoB,EACpB,aAAa,EACb,6BAA6B,EAC7B,gBAAgB,EAChB,qBAAqB,EACrB,cAAc,EACd,UAAU,EACb,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;;gBAIZ,eAAe;iBACd,oBAAoB;;;;;;cAMvB,aAAa;;;;;;iBAMV,4BAA4B;;;;iBAI5B,qBAAqB;gBACtB,gBAAgB;;;;iBAIf,6BAA6B;;;;;;;;;;;;;;;;;;;;;;4BAsBlB,cAAc;;;uBAGnB,WAAW;;;;;;;YAOtB,YAAY;wBACA,gBAAgB;;;;;gCAKR,UAAU;;;;;gCAKV,UAAU;;;;;;;;;;;;;;;;;;kBAkBxB,WAAW;;;;;uBAKN,WAAW,eAAe,gBAAgB;;;;;;;kBAO/C,WAAW;;;;YAIjB,YAAY;kBACN,WAAW,UAAU,gBAAgB;;;;;;;;;8BASzB,UAAU;;;;;;;;;;;8BAWV,UAAU;;;;;;;;;;;;;CAavC,CAAC,aAAa,CACP,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;iEAEkD,iBAAiB,CAClE,OAAO,EACP,IAAI,CACP;kEACqD,KAAK;2EACI,iBAAiB,CAC5E,KAAK,EACL,GAAG,CACN;8DACiD,OAAO;uEACE,iBAAiB,CACxE,OAAO,EACP,GAAG,CACN;;SAEJ,CACA,EACD,aAAa,CACT,KAAK,CAAC,IAAI,EACV,GAAG,CAAA;;iEAEkD,iBAAiB,CAClE,OAAO,EACP,IAAI,CACP;kEACqD,iBAAiB,CACnE,OAAO,EACP,GAAG,CACN;2EAC8D,iBAAiB,CAC5E,OAAO,EACP,GAAG,CACN;8DACiD,MAAM;uEACG,iBAAiB,CACxE,MAAM,EACN,GAAG,CACN;;SAEJ,CACA,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;iEAEkD,iBAAiB,CAClE,KAAK,EACL,IAAI,CACP;kEACqD,iBAAiB,CACnE,KAAK,EACL,GAAG,CACN;2EAC8D,iBAAiB,CAC5E,KAAK,EACL,GAAG,CACN;8DACiD,KAAK;uEACI,iBAAiB,CACxE,KAAK,EACL,GAAG,CACN;;SAEJ,CACA,CACJ,CAAC"}

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

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/indent */
 import { css } from '@microsoft/fast-element';
 import { display } from '@microsoft/fast-foundation';
 import { borderRgbPartialColor, borderHoverColor, borderWidth, bodyFontColor, bodyDisabledFontColor, controlHeight, failColor, fillSelectedRgbPartialColor, labelHeight, smallDelay, controlLabelFont, bodyFont, controlLabelFontColor, controlLabelDisabledFontColor, standardPadding } from '../theme-provider/design-tokens';
@@ -234,17 +235,13 @@ export const styles = css `
             :host([readonly]) .root {
                 border-color: transparent;
             }
-        `), themeBehavior(css `
-            ${'' /* Light theme */}
+        `), themeBehavior(Theme.light, css `
             .control::-ms-reveal {
                 filter: invert(0%);
             }
-        `, css `
-            ${'' /* Dark theme */}
+        `), themeBehavior([Theme.dark, Theme.color], css `
             .control::-ms-reveal {
                 filter: invert(100%);
             }
-        `, 
-// Color theme
-Theme.dark));
+        `));
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/text-field/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,OAAO,EACH,qBAAqB,EACrB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,qBAAqB,EACrB,aAAa,EACb,SAAS,EACT,2BAA2B,EAC3B,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,QAAQ,EACR,qBAAqB,EACrB,6BAA6B,EAC7B,eAAe,EAClB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEjE,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,cAAc,CAAC;MACvB,WAAW;;;gBAGD,QAAQ;;;;iBAIP,aAAa;uBACP,WAAW,MAAM,aAAa;mDACF,WAAW;;cAEhD,aAAa,UAAU,WAAW;;;;;iBAK/B,qBAAqB;;;;;iBAKrB,qBAAqB;gBACtB,gBAAgB;;;;iBAIf,6BAA6B;;;;;;;;;;;;iCAYb,qBAAqB;oBAClC,eAAe;mBAChB,WAAW;;;;6BAID,qBAAqB;;;;6BAIrB,qBAAqB;;;;+BAInB,SAAS;;;;+BAIT,gBAAgB;;;;;;;;;UASrC,CAAA,yCAA0C,EAAE;;;;;;;;;;;;UAY5C,CAAA,yCAA0C,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAyC5C;AACE;;6CAE6C,CAAC,EAClD;;;;;iBAKS,qBAAqB;2BACX,2BAA2B;;;;iBAIrC,qBAAqB;;;;iBAIrB,qBAAqB;;;;;;;;;;4BAUV,WAAW;;;yBAGd,gBAAgB;;4BAEb,UAAU;;;;;;;;;;+BAUP,SAAS;;;;;;;;;;;;;;;;;UAiB9B,aAAa,CAAC,iBAAiB;;CAExC,CAAC,aAAa,CACC,kBAAkB,CACd,mBAAmB,CAAC,SAAS,EAC7B,GAAG,CAAA;;uCAEgB,WAAW;;;SAGzC,CACQ,EACD,kBAAkB,CACd,mBAAmB,CAAC,KAAK,EACzB,GAAG,CAAA;;yCAEkB,qBAAqB;;;;gCAI9B,WAAW;iCACV,WAAW;;;;;uCAKL,WAAW;;;;;;;;;yCAST,qBAAqB;;;;;yCAKrB,qBAAqB;;SAErD,CACQ,EACD,kBAAkB,CACd,mBAAmB,CAAC,OAAO,EAC3B,GAAG,CAAA;;gCAES,WAAW;;;SAGlC,CACQ,EACD,kBAAkB,CACd,mBAAmB,CAAC,SAAS,EAC7B,GAAG,CAAA;;gCAES,WAAW;iCACV,WAAW;;;;;;SAMnC,CACQ,EACD,aAAa,CACT,GAAG,CAAA;cACT,EAAE,CAAC,iBAAiB;;;;SAIzB,EACW,GAAG,CAAA;cACT,EAAE,CAAC,gBAAgB;;;;SAIxB;AACW,cAAc;AACd,KAAK,CAAC,IAAI,CACb,CACJ,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/text-field/styles.ts"],"names":[],"mappings":"AAAA,8CAA8C;AAC9C,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,OAAO,EACH,qBAAqB,EACrB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,qBAAqB,EACrB,aAAa,EACb,SAAS,EACT,2BAA2B,EAC3B,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,QAAQ,EACR,qBAAqB,EACrB,6BAA6B,EAC7B,eAAe,EAClB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEjE,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,cAAc,CAAC;MACvB,WAAW;;;gBAGD,QAAQ;;;;iBAIP,aAAa;uBACP,WAAW,MAAM,aAAa;mDACF,WAAW;;cAEhD,aAAa,UAAU,WAAW;;;;;iBAK/B,qBAAqB;;;;;iBAKrB,qBAAqB;gBACtB,gBAAgB;;;;iBAIf,6BAA6B;;;;;;;;;;;;iCAYb,qBAAqB;oBAClC,eAAe;mBAChB,WAAW;;;;6BAID,qBAAqB;;;;6BAIrB,qBAAqB;;;;+BAInB,SAAS;;;;+BAIT,gBAAgB;;;;;;;;;UASrC,CAAA,yCAA0C,EAAE;;;;;;;;;;;;UAY5C,CAAA,yCAA0C,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAyC5C;AACE;;6CAE6C,CAAC,EAClD;;;;;iBAKS,qBAAqB;2BACX,2BAA2B;;;;iBAIrC,qBAAqB;;;;iBAIrB,qBAAqB;;;;;;;;;;4BAUV,WAAW;;;yBAGd,gBAAgB;;4BAEb,UAAU;;;;;;;;;;+BAUP,SAAS;;;;;;;;;;;;;;;;;UAiB9B,aAAa,CAAC,iBAAiB;;CAExC,CAAC,aAAa,CACX,kBAAkB,CACd,mBAAmB,CAAC,SAAS,EAC7B,GAAG,CAAA;;uCAE4B,WAAW;;;SAGzC,CACJ,EACD,kBAAkB,CACd,mBAAmB,CAAC,KAAK,EACzB,GAAG,CAAA;;yCAE8B,qBAAqB;;;;gCAI9B,WAAW;iCACV,WAAW;;;;;uCAKL,WAAW;;;;;;;;;yCAST,qBAAqB;;;;;yCAKrB,qBAAqB;;SAErD,CACJ,EACD,kBAAkB,CACd,mBAAmB,CAAC,OAAO,EAC3B,GAAG,CAAA;;gCAEqB,WAAW;;;SAGlC,CACJ,EACD,kBAAkB,CACd,mBAAmB,CAAC,SAAS,EAC7B,GAAG,CAAA;;gCAEqB,WAAW;iCACV,WAAW;;;;;;SAMnC,CACJ,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;;;SAIF,CACJ,EACD,aAAa,CACT,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,EACzB,GAAG,CAAA;;;;SAIF,CACJ,CACJ,CAAC"}

package/dist/esm/tooltip/styles.js

@@ -2,6 +2,7 @@ import { css } from '@microsoft/fast-element';
 import { display } from '@microsoft/fast-foundation';
 import { BannerFail100DarkUi, Black15, Black85, Black91, ForestGreen, Information100DarkUi, Information100LightUi, White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';
 import { tooltipCaptionFont, tooltipCaptionFontColor, popupBoxShadowColor, borderWidth, standardPadding, smallPadding } from '../theme-provider/design-tokens';
+import { Theme } from '../theme-provider/types';
 import { hexToRgbaCssColor } from '../utilities/style/colors';
 import { themeBehavior } from '../utilities/style/theme';
 export const styles = css `
@@ -45,11 +46,7 @@ export const styles = css `
         display: flex;
         flex: 0 0 auto;
     }
-`.withBehaviors(
-/* Local Theme Behaviors for tooltip borders and backgrounds */
-themeBehavior(
-// Light Theme
-css `
+`.withBehaviors(themeBehavior(Theme.light, css `
             :host(.fail) {
                 --ni-private-tooltip-border-color: ${BannerFail100DarkUi};
                 --ni-private-tooltip-background-color: ${White};
@@ -59,9 +56,7 @@ css `
                 --ni-private-tooltip-border-color: ${Information100LightUi};
                 --ni-private-tooltip-background-color: ${White};
             }
-        `, 
-// Dark Theme
-css `
+        `), themeBehavior(Theme.dark, css `
             :host {
                 --ni-private-tooltip-border-color: ${hexToRgbaCssColor(Black15, 0.3)};
                 --ni-private-tooltip-background-color: ${Black85};
@@ -74,9 +69,7 @@ css `
             :host(.fail) {
                 --ni-private-tooltip-border-color: ${BannerFail100DarkUi};
             }
-        `, 
-// Color Theme
-css `
+        `), themeBehavior(Theme.color, css `
             .anchored-region {
                 background-color: ${ForestGreen};
             }

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/tooltip/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,mBAAmB,EACnB,OAAO,EACP,OAAO,EACP,OAAO,EACP,WAAW,EACX,oBAAoB,EACpB,qBAAqB,EACrB,KAAK,EACR,MAAM,kDAAkD,CAAC;AAC1D,OAAO,EACH,kBAAkB,EAClB,uBAAuB,EACvB,mBAAmB,EACnB,WAAW,EACX,eAAe,EACf,YAAY,EACf,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;gBAGZ,kBAAkB;iBACjB,uBAAuB;;6CAEK,iBAAiB,CAAC,OAAO,EAAE,GAAG,CAAC;iDAC3B,OAAO;;;;;;;kCAOtB,mBAAmB;;kBAEnC,WAAW;;;6BAGA,eAAe;8BACd,eAAe;uBACtB,YAAY;;;;;;;;;;;;;;;;;;;CAmBlC,CAAC,aAAa;AACX,+DAA+D;AAC3D,aAAa;AACb,cAAc;AACV,GAAG,CAAA;;qDAEsC,mBAAmB;yDACf,KAAK;;;;qDAIT,qBAAqB;yDACjB,KAAK;;SAErD;AACG,aAAa;AACb,GAAG,CAAA;;qDAEsC,iBAAiB,CACtD,OAAO,EACP,GAAG,CACN;yDAC4C,OAAO;;;;qDAIX,oBAAoB;;;;qDAIpB,mBAAmB;;SAE/D;AACG,cAAc;AACd,GAAG,CAAA;;oCAEqB,WAAW;;;;qDAIM,iBAAiB,CACtD,KAAK,EACL,GAAG,CACN;yDAC4C,iBAAiB,CAC1D,KAAK,EACL,IAAI,CACP;;;;qDAIwC,KAAK;;;;qDAIL,KAAK;;;;;;SAMjD,CACA,CACJ,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/tooltip/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,mBAAmB,EACnB,OAAO,EACP,OAAO,EACP,OAAO,EACP,WAAW,EACX,oBAAoB,EACpB,qBAAqB,EACrB,KAAK,EACR,MAAM,kDAAkD,CAAC;AAC1D,OAAO,EACH,kBAAkB,EAClB,uBAAuB,EACvB,mBAAmB,EACnB,WAAW,EACX,eAAe,EACf,YAAY,EACf,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;gBAGZ,kBAAkB;iBACjB,uBAAuB;;6CAEK,iBAAiB,CAAC,OAAO,EAAE,GAAG,CAAC;iDAC3B,OAAO;;;;;;;kCAOtB,mBAAmB;;kBAEnC,WAAW;;;6BAGA,eAAe;8BACd,eAAe;uBACtB,YAAY;;;;;;;;;;;;;;;;;;;CAmBlC,CAAC,aAAa,CACP,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;qDAEsC,mBAAmB;yDACf,KAAK;;;;qDAIT,qBAAqB;yDACjB,KAAK;;SAErD,CACA,EACD,aAAa,CACT,KAAK,CAAC,IAAI,EACV,GAAG,CAAA;;qDAEsC,iBAAiB,CACtD,OAAO,EACP,GAAG,CACN;yDAC4C,OAAO;;;;qDAIX,oBAAoB;;;;qDAIpB,mBAAmB;;SAE/D,CACA,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;oCAEqB,WAAW;;;;qDAIM,iBAAiB,CACtD,KAAK,EACL,GAAG,CACN;yDAC4C,iBAAiB,CAC1D,KAAK,EACL,IAAI,CACP;;;;qDAIwC,KAAK;;;;qDAIL,KAAK;;;;;;SAMjD,CACA,CACJ,CAAC"}

package/dist/esm/utilities/style/appearance.d.ts

@@ -3,9 +3,9 @@ import type { Behavior, ElementStyles } from '@microsoft/fast-element';
  * Behavior that will conditionally apply a stylesheet based on the element's
  * appearance property
  *
- * @param value - The value of the appearance property
+ * @param value - The value or values of the appearance property
  * @param styles - The styles to be applied when condition matches
  *
  * @public
  */
-export declare function appearanceBehavior<AppearanceType>(value: AppearanceType, styles: ElementStyles): Behavior;
+export declare function appearanceBehavior<AppearanceType>(value: AppearanceType | AppearanceType[], styles: ElementStyles): Behavior;

package/dist/esm/utilities/style/appearance.js

@@ -1,14 +1,14 @@
-import { PropertyStyleSheetBehavior } from '@microsoft/fast-foundation';
+import { MultivaluePropertyStyleSheetBehavior } from './multivalue-property-stylesheet-behavior';
 /**
  * Behavior that will conditionally apply a stylesheet based on the element's
  * appearance property
  *
- * @param value - The value of the appearance property
+ * @param value - The value or values of the appearance property
  * @param styles - The styles to be applied when condition matches
  *
  * @public
  */
 export function appearanceBehavior(value, styles) {
-    return new PropertyStyleSheetBehavior('appearance', value, styles);
+    return new MultivaluePropertyStyleSheetBehavior('appearance', value, styles);
 }
 //# sourceMappingURL=appearance.js.map

package/dist/esm/utilities/style/appearance.js.map

@@ -1 +1 @@
-{"version":3,"file":"appearance.js","sourceRoot":"","sources":["../../../../src/utilities/style/appearance.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AAGxE;;;;;;;;GAQG;AACH,MAAM,UAAU,kBAAkB,CAC9B,KAAqB,EACrB,MAAqB;IAErB,OAAO,IAAI,0BAA0B,CAAC,YAAY,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;AACvE,CAAC"}
+{"version":3,"file":"appearance.js","sourceRoot":"","sources":["../../../../src/utilities/style/appearance.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oCAAoC,EAAE,MAAM,2CAA2C,CAAC;AAEjG;;;;;;;;GAQG;AACH,MAAM,UAAU,kBAAkB,CAC9B,KAAwC,EACxC,MAAqB;IAErB,OAAO,IAAI,oCAAoC,CAC3C,YAAY,EACZ,KAAK,EACL,MAAM,CACT,CAAC;AACN,CAAC"}

package/dist/esm/utilities/style/multivalue-property-stylesheet-behavior.d.ts

@@ -0,0 +1,37 @@
+import { Behavior, ElementStyles, FASTElement } from '@microsoft/fast-element';
+/**
+ * A behavior to add or remove a stylesheet from an element based on a property. The behavior ensures that
+ * styles are applied while the property matches and that styles are not applied if the property does
+ * not match.
+ *
+ * @public
+ */
+export declare class MultivaluePropertyStyleSheetBehavior<PropertyType> implements Behavior {
+    private readonly propertyName;
+    private readonly value;
+    private readonly styles;
+    /**
+     * Constructs a {@link MultivaluePropertyStyleSheetBehavior} instance.
+     * @param propertyName - The property name to operate from.
+     * @param value - The property value or values to operate from.
+     * @param styles - The styles to coordinate with the property.
+     */
+    constructor(propertyName: string, value: PropertyType | PropertyType[], styles: ElementStyles);
+    /**
+     * Binds the behavior to the element.
+     * @param elementInstance - The element for which the property is applied.
+     */
+    bind(elementInstance: FASTElement): void;
+    /**
+     * Unbinds the behavior from the element.
+     * @param source - The element for which the behavior is unbinding.
+     */
+    unbind(source: FASTElement & HTMLElement): void;
+    /**
+     * Change event for the provided element.
+     * @param source - the element for which to attach or detach styles.
+     * @param key - the key to lookup to know if the element already has the styles
+     * @internal
+     */
+    handleChange(source: FASTElement, key: string): void;
+}

package/dist/esm/utilities/style/multivalue-property-stylesheet-behavior.js

@@ -0,0 +1,56 @@
+import { Observable } from '@microsoft/fast-element';
+/**
+ * A behavior to add or remove a stylesheet from an element based on a property. The behavior ensures that
+ * styles are applied while the property matches and that styles are not applied if the property does
+ * not match.
+ *
+ * @public
+ */
+export class MultivaluePropertyStyleSheetBehavior {
+    /**
+     * Constructs a {@link MultivaluePropertyStyleSheetBehavior} instance.
+     * @param propertyName - The property name to operate from.
+     * @param value - The property value or values to operate from.
+     * @param styles - The styles to coordinate with the property.
+     */
+    constructor(propertyName, value, styles) {
+        this.propertyName = propertyName;
+        this.value = value;
+        this.styles = styles;
+    }
+    /**
+     * Binds the behavior to the element.
+     * @param elementInstance - The element for which the property is applied.
+     */
+    bind(elementInstance) {
+        Observable.getNotifier(elementInstance).subscribe(this, this.propertyName);
+        this.handleChange(elementInstance, this.propertyName);
+    }
+    /**
+     * Unbinds the behavior from the element.
+     * @param source - The element for which the behavior is unbinding.
+     */
+    unbind(source) {
+        Observable.getNotifier(source).unsubscribe(this, this.propertyName);
+        source.$fastController.removeStyles(this.styles);
+    }
+    /**
+     * Change event for the provided element.
+     * @param source - the element for which to attach or detach styles.
+     * @param key - the key to lookup to know if the element already has the styles
+     * @internal
+     */
+    handleChange(source, key) {
+        // @ts-expect-error Accessing arbitrary property of an element
+        const currentValue = source[key];
+        if (Array.isArray(this.value)
+            ? this.value.includes(currentValue)
+            : this.value === currentValue) {
+            source.$fastController.addStyles(this.styles);
+        }
+        else {
+            source.$fastController.removeStyles(this.styles);
+        }
+    }
+}
+//# sourceMappingURL=multivalue-property-stylesheet-behavior.js.map

package/dist/esm/utilities/style/multivalue-property-stylesheet-behavior.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"multivalue-property-stylesheet-behavior.js","sourceRoot":"","sources":["../../../../src/utilities/style/multivalue-property-stylesheet-behavior.ts"],"names":[],"mappings":"AAAA,OAAO,EAIH,UAAU,EACb,MAAM,yBAAyB,CAAC;AAEjC;;;;;;GAMG;AACH,MAAM,OAAO,oCAAoC;IAE7C;;;;;OAKG;IACH,YACqB,YAAoB,EACpB,KAAoC,EACpC,MAAqB;QAFrB,iBAAY,GAAZ,YAAY,CAAQ;QACpB,UAAK,GAAL,KAAK,CAA+B;QACpC,WAAM,GAAN,MAAM,CAAe;IACvC,CAAC;IAEJ;;;OAGG;IACI,IAAI,CAAC,eAA4B;QACpC,UAAU,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC,SAAS,CAC7C,IAAI,EACJ,IAAI,CAAC,YAAY,CACpB,CAAC;QACF,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;IAC1D,CAAC;IAED;;;OAGG;IACI,MAAM,CAAC,MAAiC;QAC3C,UAAU,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QACpE,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACrD,CAAC;IAED;;;;;OAKG;IACI,YAAY,CAAC,MAAmB,EAAE,GAAW;QAChD,8DAA8D;QAC9D,MAAM,YAAY,GAAiB,MAAM,CAAC,GAAG,CAAiB,CAAC;QAC/D,IACI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;YACrB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,YAAY,CAAC;YACnC,CAAC,CAAC,IAAI,CAAC,KAAK,KAAK,YAAY,EACnC;YACE,MAAM,CAAC,eAAe,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SACjD;aAAM;YACH,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SACpD;IACL,CAAC;CACJ"}

package/dist/esm/utilities/style/theme.d.ts

@@ -1,16 +1,13 @@
-import { Behavior, ElementStyles, FASTElement } from '@microsoft/fast-element';
+import type { Behavior, ElementStyles, FASTElement } from '@microsoft/fast-element';
 import type { Theme } from '../../theme-provider/types';
-export declare type LightStyle = ElementStyles | null;
-export declare type DarkStyleOrAlias = ElementStyles | null | Extract<Theme, 'light'>;
-export declare type ColorStyleOrAlias = ElementStyles | null | Extract<Theme, 'light' | 'dark'>;
 /**
  * Behavior to conditionally apply theme-based stylesheets.
  */
 declare class ThemeStyleSheetBehavior implements Behavior {
-    private readonly themeStyles;
+    private readonly theme;
+    private readonly styles;
     private readonly cache;
-    constructor(lightStyle: LightStyle, darkStyleOrAlias: DarkStyleOrAlias, colorStyleOrAlias: ColorStyleOrAlias);
-    private static resolveTheme;
+    constructor(theme: Theme | Theme[], styles: ElementStyles);
     /**
      * @internal
      */
@@ -23,20 +20,18 @@ declare class ThemeStyleSheetBehavior implements Behavior {
 /**
  * Behavior to conditionally apply theme-based stylesheets. To determine which to apply,
  * the behavior will use the nearest ThemeProvider's 'theme' design system value.
- * To re-use the same style for multiple themes you can specify the name of an already
- * defined theme to alias them together.
  *
  * @public
  * @example
  * ```ts
  * css`
- *  // ...
- * `.withBehaviors(new ThemeStyleSheetBehavior(
- *   css`:host { ... Theme.light style... }`),
- *   null, // No style needed for Theme.dark style
- *   Theme.light // For the Theme.color style, re-use the previously set Theme.light style
+ *     // ...
+ * `.withBehaviors(
+ *     themeBehavior(Theme.light, css` ... `),
+ *     // Apply style for both dark and color theme
+ *     themeBehavior([Theme.dark, Theme.color], css` ... `)
  * )
  * ```
  */
-export declare const themeBehavior: (lightStyle: LightStyle, darkStyleOrAlias: DarkStyleOrAlias, colorStyleOrAlias: ColorStyleOrAlias) => ThemeStyleSheetBehavior;
+export declare const themeBehavior: (theme: Theme | Theme[], styles: ElementStyles) => ThemeStyleSheetBehavior;
 export {};

package/dist/esm/utilities/style/theme.js

@@ -1,27 +1,22 @@
-/* eslint-disable max-classes-per-file */
-import { ElementStyles } from '@microsoft/fast-element';
 import { theme as themeToken } from '../../theme-provider';
 /**
  * Subscription for {@link ThemeStyleSheetBehavior}
  */
 class ThemeStyleSheetBehaviorSubscription {
-    constructor(themeStyles, source) {
-        this.themeStyles = themeStyles;
+    constructor(value, styles, source) {
+        this.value = value;
+        this.styles = styles;
         this.source = source;
-        this.attached = null;
     }
-    handleChange({ target, token }) {
-        this.attach(token.getValueFor(target));
-    }
-    attach(theme) {
-        if (this.attached !== this.themeStyles[theme]) {
-            if (this.attached !== null) {
-                this.source.$fastController.removeStyles(this.attached);
-            }
-            this.attached = this.themeStyles[theme];
-            if (this.attached !== null) {
-                this.source.$fastController.addStyles(this.attached);
-            }
+    handleChange() {
+        const theme = themeToken.getValueFor(this.source);
+        if (Array.isArray(this.value)
+            ? this.value.includes(theme)
+            : this.value === theme) {
+            this.source.$fastController.addStyles(this.styles);
+        }
+        else {
+            this.source.$fastController.removeStyles(this.styles);
         }
     }
 }
@@ -29,47 +24,22 @@ class ThemeStyleSheetBehaviorSubscription {
  * Behavior to conditionally apply theme-based stylesheets.
  */
 class ThemeStyleSheetBehavior {
-    constructor(lightStyle, darkStyleOrAlias, colorStyleOrAlias) {
+    constructor(theme, styles) {
+        this.theme = theme;
+        this.styles = styles;
         this.cache = new WeakMap();
-        const light = lightStyle;
-        const dark = ThemeStyleSheetBehavior.resolveTheme(darkStyleOrAlias, {
-            light,
-            dark: null,
-            color: null
-        });
-        const color = ThemeStyleSheetBehavior.resolveTheme(colorStyleOrAlias, {
-            light,
-            dark,
-            color: null
-        });
-        this.themeStyles = {
-            light,
-            dark,
-            color
-        };
-    }
-    static resolveTheme(value, currentThemeStyles) {
-        if (value instanceof ElementStyles || value === null) {
-            return value;
-        }
-        const currentStyle = currentThemeStyles[value];
-        if (currentStyle === null) {
-            throw new Error(`Tried to alias to theme '${value}' but the theme value is not set to a style.`);
-        }
-        return currentStyle;
     }
     /**
      * @internal
      */
     bind(source) {
         const subscriber = this.cache.get(source)
-            || new ThemeStyleSheetBehaviorSubscription(this.themeStyles, source);
-        const value = themeToken.getValueFor(source);
+            || new ThemeStyleSheetBehaviorSubscription(this.theme, this.styles, source);
         // Currently subscriber from cache may have gone through unbind
         // but still be in cache so always resubscribe
         // See: https://github.com/microsoft/fast/issues/3246#issuecomment-1030424876
         themeToken.subscribe(subscriber, source);
-        subscriber.attach(value);
+        subscriber.handleChange();
         this.cache.set(source, subscriber);
     }
     /**
@@ -87,20 +57,18 @@ class ThemeStyleSheetBehavior {
 /**
  * Behavior to conditionally apply theme-based stylesheets. To determine which to apply,
  * the behavior will use the nearest ThemeProvider's 'theme' design system value.
- * To re-use the same style for multiple themes you can specify the name of an already
- * defined theme to alias them together.
  *
  * @public
  * @example
  * ```ts
  * css`
- *  // ...
- * `.withBehaviors(new ThemeStyleSheetBehavior(
- *   css`:host { ... Theme.light style... }`),
- *   null, // No style needed for Theme.dark style
- *   Theme.light // For the Theme.color style, re-use the previously set Theme.light style
+ *     // ...
+ * `.withBehaviors(
+ *     themeBehavior(Theme.light, css` ... `),
+ *     // Apply style for both dark and color theme
+ *     themeBehavior([Theme.dark, Theme.color], css` ... `)
  * )
  * ```
  */
-export const themeBehavior = (lightStyle, darkStyleOrAlias, colorStyleOrAlias) => new ThemeStyleSheetBehavior(lightStyle, darkStyleOrAlias, colorStyleOrAlias);
+export const themeBehavior = (theme, styles) => new ThemeStyleSheetBehavior(theme, styles);
 //# sourceMappingURL=theme.js.map

package/dist/esm/utilities/style/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","sourceRoot":"","sources":["../../../../src/utilities/style/theme.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"theme.js","sourceRoot":"","sources":["../../../../src/utilities/style/theme.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,IAAI,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAE3D;;GAEG;AACH,MAAM,mCAAmC;IACrC,YACqB,KAAsB,EACtB,MAAqB,EACrB,MAAiC;QAFjC,UAAK,GAAL,KAAK,CAAiB;QACtB,WAAM,GAAN,MAAM,CAAe;QACrB,WAAM,GAAN,MAAM,CAA2B;IACnD,CAAC;IAEG,YAAY;QACf,MAAM,KAAK,GAAG,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAClD,IACI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;YACrB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC;YAC5B,CAAC,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,EAC5B;YACE,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SACtD;aAAM;YACH,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SACzD;IACL,CAAC;CACJ;AAED;;GAEG;AACH,MAAM,uBAAuB;IAMzB,YACqB,KAAsB,EACtB,MAAqB;QADrB,UAAK,GAAL,KAAK,CAAiB;QACtB,WAAM,GAAN,MAAM,CAAe;QAPzB,UAAK,GAGlB,IAAI,OAAO,EAAE,CAAC;IAKf,CAAC;IAEJ;;OAEG;IACI,IAAI,CAAC,MAAiC;QACzC,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC;eAClC,IAAI,mCAAmC,CACtC,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,MAAM,EACX,MAAM,CACT,CAAC;QAEN,+DAA+D;QAC/D,8CAA8C;QAC9C,6EAA6E;QAC7E,UAAU,CAAC,SAAS,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;QACzC,UAAU,CAAC,YAAY,EAAE,CAAC;QAE1B,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACvC,CAAC;IAED;;OAEG;IACI,MAAM,CAAC,MAAiC;QAC3C,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;QAE1C,IAAI,UAAU,EAAE;YACZ,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;SACtC;QAED,iDAAiD;QACjD,6EAA6E;IACjF,CAAC;CACJ;AAED;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CACzB,KAAsB,EACtB,MAAqB,EACE,EAAE,CAAC,IAAI,uBAAuB,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ni/nimble-components",
-  "version": "11.8.0",
+  "version": "11.8.3",
   "description": "Styled web components for the NI Nimble Design System",
   "scripts": {
     "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook",