npm - @ni/nimble-components - Versions diffs - 30.0.8 → 30.1.0 - Mend

@ni/nimble-components 30.0.8 → 30.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (36) hide show

package/dist/esm/patterns/dropdown/styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/patterns/dropdown/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EACH,0BAA0B,EAC1B,QAAQ,EACR,aAAa,EACb,qBAAqB,EACrB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,UAAU,EACV,YAAY,EACZ,qBAAqB,EACrB,aAAa,EACb,SAAS,EACT,mBAAmB,EACtB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAEnE,kBAAkB;AAClB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;iBAGX,aAAa;gBACd,QAAQ;kBACN,aAAa;;;UAGrB,cAAc;qBACH,YAAY;;;mDAGkB,WAAW;;;;;;;;uBAQvC,WAAW;;;;yBAIT,gBAAgB;;4BAEb,UAAU;;;;;;;;;YAS1B,YAAY;;;;;+BAKO,SAAS;;;;;;4BAMZ,WAAW;;;;yBAId,gBAAgB;;4BAEb,UAAU;;;;;;;;;;YAU1B,YAAY;;;;;+BAKO,SAAS;;;;;;;;;;;;;;;;;iCAiBP,qBAAqB;;mBAEnC,WAAW;;;;+BAIC,gBAAgB;;;;;iBAK9B,qBAAqB;6BACT,qBAAqB;;;;;;+BAMnB,SAAS;;;;;;;;;mDASW,YAAY;wCACvB,YAAY;;;;;;sBAM9B,WAAW;;kBAEf,aAAa;;;;;;;;;sBAST,mBAAmB;kBACvB,WAAW,UAAU,gBAAgB;4BAC3B,0BAA0B;;;;8CAIR,aAAa;;;;yDAIF,aAAa;;;;;;;;;;;;;;;;;;;;0BAoB5C,YAAY;;;;uBAIf,YAAY;;;;;;;;;;;wBAWX,aAAa;;;;iBAIpB,qBAAqB;;;;;uBAKf,YAAY;;;;;;;;iBAQlB,QAAQ;kBACP,QAAQ;gBACV,aAAa;;;;gBAIb,qBAAqB;;;;;;;;;;;CAWpC,CAAC,aAAa,CACX,kBAAkB,CACd,kBAAkB,CAAC,SAAS,EAC5B,GAAG,CAAA;;uCAE4B,WAAW;;;;;qCAKb,qBAAqB;;SAEjD,CACJ,EACD,kBAAkB,CACd,kBAAkB,CAAC,OAAO,EAC1B,GAAG,CAAA;;gCAEqB,WAAW;;;SAGlC,CACJ,EACD,kBAAkB,CACd,kBAAkB,CAAC,KAAK,EACxB,GAAG,CAAA;;yCAE8B,qBAAqB;;;;uCAIvB,WAAW;;;;;yCAKT,qBAAqB;;SAErD,CACJ,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;8BAEmB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;SAEnD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { display } from '../../utilities/style/display';\nimport {\n applicationBackgroundColor,\n bodyFont,\n bodyFontColor,\n bodyDisabledFontColor,\n borderHoverColor,\n borderWidth,\n controlHeight,\n iconSize,\n menuMinWidth,\n popupBorderColor,\n smallDelay,\n smallPadding,\n borderRgbPartialColor,\n mediumPadding,\n failColor,\n elevation2BoxShadow\n} from '../../theme-provider/design-tokens';\nimport { Theme } from '../../theme-provider/types';\nimport { appearanceBehavior } from '../../utilities/style/appearance';\nimport { hexToRgbaCssColor } from '../../utilities/style/colors';\nimport { focusVisible } from '../../utilities/style/focus';\nimport { themeBehavior } from '../../utilities/style/theme';\nimport { DropdownAppearance } from './types';\nimport { userSelectNone } from '../../utilities/style/user-select';\n\n// prettier-ignore\nexport const styles = css`\n ${display('inline-flex')}\n\n :host {\n color: ${bodyFontColor};\n font: ${bodyFont};\n height: ${controlHeight};\n position: relative;\n justify-content: center;\n ${userSelectNone}\n min-width: ${menuMinWidth};\n outline: none;\n vertical-align: top;\n --ni-private-hover-indicator-width: calc(${borderWidth} + 1px);\n --ni-private-focus-indicator-width: 1px;\n --ni-private-indicator-lines-gap: 1px;\n }\n\n :host::before {\n content: '';\n position: absolute;\n bottom: calc(${borderWidth} + var(--ni-private-indicator-lines-gap));\n width: 0px;\n height: 0px;\n justify-self: center;\n border-bottom: ${borderHoverColor}\n var(--ni-private-focus-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n :host::before {\n transition-duration: 0s;\n }\n }\n\n :host(${focusVisible})::before {\n width: calc(100% - 8px);\n }\n\n :host([error-visible]):before {\n border-bottom-color: ${failColor};\n }\n\n :host::after {\n content: '';\n position: absolute;\n bottom: calc(-1 * ${borderWidth});\n width: 0px;\n height: 0px;\n justify-self: center;\n border-bottom: ${borderHoverColor}\n var(--ni-private-hover-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n :host::after {\n transition-duration: 0s;\n }\n }\n\n :host(:hover)::after,\n :host(${focusVisible})::after {\n width: 100%;\n }\n\n :host([error-visible]):after {\n border-bottom-color: ${failColor};\n }\n\n :host([disabled]:hover)::after {\n width: 0px;\n }\n\n [part='start'] {\n display: none;\n }\n\n .control {\n align-items: center;\n cursor: pointer;\n display: flex;\n min-height: 100%;\n width: 100%;\n border: 0px solid rgba(${borderRgbPartialColor}, 0.3);\n background-color: transparent;\n padding: ${borderWidth};\n }\n\n :host([open]:not(:hover)) .control {\n border-bottom-color: ${borderHoverColor};\n }\n\n :host([disabled]) .control {\n cursor: default;\n color: ${bodyDisabledFontColor};\n border-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n\n :host([error-visible]) .control,\n :host([error-visible][open]) .control,\n :host([error-visible][disabled]) .control {\n border-bottom-color: ${failColor};\n }\n\n .listbox {\n display: inline-flex;\n flex-direction: column;\n overflow-y: auto;\n width: 100%;\n --ni-private-listbox-visible-option-count: 10.5;\n --ni-private-listbox-anchor-element-gap: ${smallPadding};\n --ni-private-listbox-padding: ${smallPadding};\n --ni-private-listbox-filter-height: 0px;\n --ni-private-listbox-loading-indicator-height: 0px;\n max-height: min(\n calc(\n var(--ni-private-listbox-anchor-element-gap) + \n 2 * ${borderWidth} + \n var(--ni-private-listbox-padding) +\n ${controlHeight} * var(--ni-private-listbox-visible-option-count) +\n var(--ni-private-listbox-filter-height) +\n var(--ni-private-listbox-loading-indicator-height)\n ),\n calc(\n var(--ni-private-listbox-available-viewport-height) - \n var(--ni-private-listbox-anchor-element-gap)\n )\n );\n box-shadow: ${elevation2BoxShadow};\n border: ${borderWidth} solid ${popupBorderColor};\n background-color: ${applicationBackgroundColor};\n }\n\n .listbox:has(.filter-field) {\n --ni-private-listbox-filter-height: ${controlHeight};\n }\n\n .listbox:has(.loading-container) {\n --ni-private-listbox-loading-indicator-height: ${controlHeight};\n }\n\n .listbox slot {\n display: block;\n background: transparent;\n padding: var(--ni-private-listbox-padding);\n }\n\n :host([open][position='above']) .listbox {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n :host([open][position='below']) .listbox {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n\n :host([open][position='above']) .anchored-region {\n padding-bottom: ${smallPadding};\n }\n\n :host([open][position='below']) .anchored-region {\n padding-top: ${smallPadding};\n }\n\n .selected-value {\n flex: auto;\n font-family: inherit;\n text-align: start;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n padding: 0px;\n padding-left: ${mediumPadding};\n }\n\n .selected-value[disabled]::placeholder {\n color: ${bodyDisabledFontColor};\n }\n\n .indicator {\n flex: none;\n margin-left: ${smallPadding};\n padding-right: 8px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .indicator slot[name='indicator'] svg {\n width: ${iconSize};\n height: ${iconSize};\n fill: ${bodyFontColor};\n }\n\n :host([disabled]) .indicator slot[name='indicator'] svg {\n fill: ${bodyDisabledFontColor};\n }\n\n [part='end'] {\n margin-inline-start: auto;\n }\n\n ::slotted([role='option']),\n ::slotted(option) {\n flex: none;\n }\n`.withBehaviors(\n appearanceBehavior(\n DropdownAppearance.underline,\n css`\n .control {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n\n :host([disabled]) .control {\n border-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n `\n ),\n appearanceBehavior(\n DropdownAppearance.outline,\n css`\n .control {\n border-width: ${borderWidth};\n padding: 0;\n }\n `\n ),\n appearanceBehavior(\n DropdownAppearance.block,\n css`\n .control {\n background-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n\n .control:focus-within {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n\n :host([disabled]) .control {\n background-color: rgba(${borderRgbPartialColor}, 0.07);\n }\n `\n ),\n themeBehavior(\n Theme.color,\n css`\n .listbox slot {\n background: ${hexToRgbaCssColor(White, 0.15)};\n }\n `\n )\n);\n"]}
1	+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/patterns/dropdown/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EACH,0BAA0B,EAC1B,QAAQ,EACR,aAAa,EACb,qBAAqB,EACrB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,UAAU,EACV,YAAY,EACZ,qBAAqB,EACrB,aAAa,EACb,SAAS,EACT,mBAAmB,EACnB,oBAAoB,EACvB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAEnE,kBAAkB;AAClB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;iBAGX,aAAa;gBACd,QAAQ;kBACN,aAAa;;;UAGrB,cAAc;qBACH,YAAY;;;mDAGkB,WAAW;;;;;;;;uBAQvC,WAAW;;;;yBAIT,gBAAgB;;4BAEb,UAAU;;;;;;;;;YAS1B,YAAY;;;;;+BAKO,SAAS;;;;;;4BAMZ,WAAW;;;;yBAId,gBAAgB;;4BAEb,UAAU;;;;;;;;;;YAU1B,YAAY;;;;;+BAKO,SAAS;;;;;;;;;;;;;iCAaP,qBAAqB;;mBAEnC,WAAW;;;;+BAIC,gBAAgB;;;;;iBAK9B,qBAAqB;6BACT,qBAAqB;;;;;;+BAMnB,SAAS;;;;;;;;;;;;;;;wBAehB,aAAa;;;;iBAIpB,qBAAqB;;;;;uBAKf,YAAY;;;;;;;;iBAQlB,QAAQ;kBACP,QAAQ;gBACV,aAAa;;;;gBAIb,qBAAqB;;;;;;;;0BAQX,YAAY;;;;uBAIf,YAAY;;;;;;;;mDAQgB,YAAY;wCACvB,YAAY;;;;;;sBAM9B,WAAW;;kBAEf,aAAa;;;;;;;;;sBAST,mBAAmB;kBACvB,WAAW,UAAU,gBAAgB;4BAC3B,0BAA0B;;;;8CAIR,aAAa;;;;yDAIF,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAiCrD,oBAAoB;kBACnB,aAAa;;;;;mBAKZ,YAAY,IAAI,aAAa;;CAE/C,CAAC,aAAa,CACX,kBAAkB,CACd,kBAAkB,CAAC,SAAS,EAC5B,GAAG,CAAA;;uCAE4B,WAAW;;;;;qCAKb,qBAAqB;;SAEjD,CACJ,EACD,kBAAkB,CACd,kBAAkB,CAAC,OAAO,EAC1B,GAAG,CAAA;;gCAEqB,WAAW;;;SAGlC,CACJ,EACD,kBAAkB,CACd,kBAAkB,CAAC,KAAK,EACxB,GAAG,CAAA;;yCAE8B,qBAAqB;;;;uCAIvB,WAAW;;;;;yCAKT,qBAAqB;;SAErD,CACJ,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;8BAEmB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;SAEnD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { display } from '../../utilities/style/display';\nimport {\n applicationBackgroundColor,\n bodyFont,\n bodyFontColor,\n bodyDisabledFontColor,\n borderHoverColor,\n borderWidth,\n controlHeight,\n iconSize,\n menuMinWidth,\n popupBorderColor,\n smallDelay,\n smallPadding,\n borderRgbPartialColor,\n mediumPadding,\n failColor,\n elevation2BoxShadow,\n placeholderFontColor\n} from '../../theme-provider/design-tokens';\nimport { Theme } from '../../theme-provider/types';\nimport { appearanceBehavior } from '../../utilities/style/appearance';\nimport { hexToRgbaCssColor } from '../../utilities/style/colors';\nimport { focusVisible } from '../../utilities/style/focus';\nimport { themeBehavior } from '../../utilities/style/theme';\nimport { DropdownAppearance } from './types';\nimport { userSelectNone } from '../../utilities/style/user-select';\n\n// prettier-ignore\nexport const styles = css`\n ${display('inline-flex')}\n\n :host {\n color: ${bodyFontColor};\n font: ${bodyFont};\n height: ${controlHeight};\n position: relative;\n justify-content: center;\n ${userSelectNone}\n min-width: ${menuMinWidth};\n outline: none;\n vertical-align: top;\n --ni-private-hover-indicator-width: calc(${borderWidth} + 1px);\n --ni-private-focus-indicator-width: 1px;\n --ni-private-indicator-lines-gap: 1px;\n }\n\n :host::before {\n content: '';\n position: absolute;\n bottom: calc(${borderWidth} + var(--ni-private-indicator-lines-gap));\n width: 0px;\n height: 0px;\n justify-self: center;\n border-bottom: ${borderHoverColor}\n var(--ni-private-focus-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n :host::before {\n transition-duration: 0s;\n }\n }\n\n :host(${focusVisible})::before {\n width: calc(100% - 8px);\n }\n\n :host([error-visible]):before {\n border-bottom-color: ${failColor};\n }\n\n :host::after {\n content: '';\n position: absolute;\n bottom: calc(-1 * ${borderWidth});\n width: 0px;\n height: 0px;\n justify-self: center;\n border-bottom: ${borderHoverColor}\n var(--ni-private-hover-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n :host::after {\n transition-duration: 0s;\n }\n }\n\n :host(:hover)::after,\n :host(${focusVisible})::after {\n width: 100%;\n }\n\n :host([error-visible]):after {\n border-bottom-color: ${failColor};\n }\n\n :host([disabled]:hover)::after {\n width: 0px;\n }\n\n .control {\n align-items: center;\n cursor: pointer;\n display: flex;\n min-height: 100%;\n width: 100%;\n border: 0px solid rgba(${borderRgbPartialColor}, 0.3);\n background-color: transparent;\n padding: ${borderWidth};\n }\n\n :host([open]:not(:hover)) .control {\n border-bottom-color: ${borderHoverColor};\n }\n\n :host([disabled]) .control {\n cursor: default;\n color: ${bodyDisabledFontColor};\n border-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n\n :host([error-visible]) .control,\n :host([error-visible][open]) .control,\n :host([error-visible][disabled]) .control {\n border-bottom-color: ${failColor};\n }\n\n [part='start'] {\n display: none;\n }\n\n .selected-value {\n flex: auto;\n font-family: inherit;\n text-align: start;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n padding: 0px;\n padding-left: ${mediumPadding};\n }\n\n .selected-value[disabled]::placeholder {\n color: ${bodyDisabledFontColor};\n }\n\n .indicator {\n flex: none;\n margin-left: ${smallPadding};\n padding-right: 8px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .indicator slot[name='indicator'] svg {\n width: ${iconSize};\n height: ${iconSize};\n fill: ${bodyFontColor};\n }\n\n :host([disabled]) .indicator slot[name='indicator'] svg {\n fill: ${bodyDisabledFontColor};\n }\n\n [part='end'] {\n margin-inline-start: auto;\n }\n\n :host([open][position='above']) .anchored-region {\n padding-bottom: ${smallPadding};\n }\n\n :host([open][position='below']) .anchored-region {\n padding-top: ${smallPadding};\n }\n\n .listbox {\n display: inline-flex;\n flex-direction: column;\n width: 100%;\n --ni-private-listbox-visible-option-count: 10.5;\n --ni-private-listbox-anchor-element-gap: ${smallPadding};\n --ni-private-listbox-padding: ${smallPadding};\n --ni-private-listbox-filter-height: 0px;\n --ni-private-listbox-loading-indicator-height: 0px;\n max-height: min(\n calc(\n var(--ni-private-listbox-anchor-element-gap) + \n 2 * ${borderWidth} + \n var(--ni-private-listbox-padding) +\n ${controlHeight} * var(--ni-private-listbox-visible-option-count) +\n var(--ni-private-listbox-filter-height) +\n var(--ni-private-listbox-loading-indicator-height)\n ),\n calc(\n var(--ni-private-listbox-available-viewport-height) - \n var(--ni-private-listbox-anchor-element-gap)\n )\n );\n box-shadow: ${elevation2BoxShadow};\n border: ${borderWidth} solid ${popupBorderColor};\n background-color: ${applicationBackgroundColor};\n }\n\n .listbox:has(.filter-field) {\n --ni-private-listbox-filter-height: ${controlHeight};\n }\n\n .listbox:has(.loading-container) {\n --ni-private-listbox-loading-indicator-height: ${controlHeight};\n }\n\n :host([open][position='above']) .listbox {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n :host([open][position='below']) .listbox {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n\n .scrollable-region {\n overflow-y: auto;\n }\n\n .listbox slot {\n display: block;\n background: transparent;\n padding: var(--ni-private-listbox-padding);\n }\n\n .listbox.empty slot {\n display: none;\n }\n\n ::slotted([role='option']),\n ::slotted(option) {\n flex: none;\n }\n\n .no-results-label {\n color: ${placeholderFontColor};\n height: ${controlHeight};\n display: inline-flex;\n display: flex;\n flex: 1 0 auto;\n align-items: center;\n padding: ${smallPadding} ${mediumPadding};\n }\n`.withBehaviors(\n appearanceBehavior(\n DropdownAppearance.underline,\n css`\n .control {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n\n :host([disabled]) .control {\n border-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n `\n ),\n appearanceBehavior(\n DropdownAppearance.outline,\n css`\n .control {\n border-width: ${borderWidth};\n padding: 0;\n }\n `\n ),\n appearanceBehavior(\n DropdownAppearance.block,\n css`\n .control {\n background-color: rgba(${borderRgbPartialColor}, 0.1);\n }\n\n .control:focus-within {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n\n :host([disabled]) .control {\n background-color: rgba(${borderRgbPartialColor}, 0.07);\n }\n `\n ),\n themeBehavior(\n Theme.color,\n css`\n .listbox slot {\n background: ${hexToRgbaCssColor(White, 0.15)};\n }\n `\n )\n);\n"]}

package/dist/esm/rich-text/mention-listbox/index.js CHANGED Viewed

@@ -228,6 +228,9 @@ __decorate([
 __decorate([
     observable
 ], RichTextMentionListbox.prototype, "availableViewportHeight", void 0);
+__decorate([
+    observable
+], RichTextMentionListbox.prototype, "filteredOptions", void 0);
 __decorate([
     observable
 ], RichTextMentionListbox.prototype, "anchorElement", void 0);

package/dist/esm/rich-text/mention-listbox/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/rich-text/mention-listbox/index.ts"],"names":[],"mappings":"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","sourcesContent":["import { Notifier, Observable, observable } from '@microsoft/fast-element';\nimport {\n DesignSystem,\n ListboxElement as FoundationListbox,\n ListboxOption\n} from '@microsoft/fast-foundation';\nimport { keyEnter, keyEscape, keyTab } from '@microsoft/fast-web-utilities';\nimport type { MentionDetail } from '../editor/types';\nimport { styles } from './styles';\nimport { template } from './template';\nimport type { AnchoredRegion } from '../../anchored-region';\nimport { diacriticInsensitiveStringNormalizer } from '../../utilities/models/string-normalizers';\nimport type { ListOption } from '../../list-option';\nimport type { MentionListboxShowOptions } from './types';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-rich-text-mention-listbox': RichTextMentionListbox;\n }\n}\n\n/*\n A rich text mention listbox which acts as a popup for \"@mention\" support in editor\n /\nexport class RichTextMentionListbox extends FoundationListbox {\n /\n @internal\n /\n @observable\n public open?: boolean;\n\n /\n @internal\n /\n @observable\n public region?: AnchoredRegion;\n\n /\n The space available in the viewport for the listbox when opened.\n \n @internal\n /\n @observable\n public availableViewportHeight = 0;\n\n /\n @internal\n /\n public filter = '';\n\n /\n The collection of currently filtered options.\n * The approach is defined based on the `Combobox.filteredOptions` implementation.\n \n @internal\n /\n public filteredOptions: ListboxOption[] = [];\n\n /\n Reference to the internal listbox element.\n \n @internal\n /\n public listbox!: HTMLDivElement;\n\n @observable\n private anchorElement?: HTMLElement;\n\n private regionNotifier?: Notifier;\n\n private readonly anchorElementIntersectionObserver: IntersectionObserver = new IntersectionObserver(\n entries => {\n if (!entries[0]?.isIntersecting) {\n this.setOpen(false);\n }\n },\n { threshold: 1.0, root: document }\n );\n\n /\n @public\n /\n public close(): void {\n this.setOpen(false);\n }\n\n /\n The list of options.\n \n @public\n * @remarks\n * Overrides `Listbox.options`.\n /\n public override get options(): ListboxOption[] {\n Observable.track(this, 'options');\n return this.filteredOptions?.length ? this.filteredOptions : [];\n }\n\n public override set options(value: ListboxOption[]) {\n this._options = value;\n Observable.notify(this, 'options');\n }\n\n /\n Triggers when the mention plugin is activated upon pressing the `key`\n \n @public\n /\n public show(options: MentionListboxShowOptions): void {\n const listboxTop = options.anchorNode.getBoundingClientRect().bottom;\n this.availableViewportHeight = Math.trunc(\n window.innerHeight - listboxTop\n );\n this.filter = options.filter;\n this.anchorElement = options.anchorNode;\n this.setOpen(true);\n this.filterOptions();\n }\n\n /\n Handle keydown actions for listbox navigation and selection.\n \n @param e - the keyboard event\n * @public\n /\n public override keydownHandler(event: KeyboardEvent): boolean {\n if (!this.open) {\n return false;\n }\n switch (event.key) {\n case keyTab:\n case keyEnter: {\n if (!this.hasSelectableOptions) {\n return false;\n }\n const mentionDetail: MentionDetail = {\n href: this.firstSelectedOption.value,\n displayName: this.firstSelectedOption.text\n };\n this.$emit('mention-selected', mentionDetail);\n this.setOpen(false);\n return true;\n }\n case keyEscape: {\n this.setOpen(false);\n return false;\n }\n default: {\n super.keydownHandler(event);\n return false;\n }\n }\n }\n\n /\n Filter available options by filter value.\n * The method is defined based on the `Combobox.filterOptions` and `Combobox.inputHandler` implementation.\n \n @internal\n /\n public filterOptions(): void {\n if (!this.filter) {\n this.filteredOptions = this._options;\n } else {\n const normalizedFilter = diacriticInsensitiveStringNormalizer(\n this.filter\n );\n this.filteredOptions = this._options.filter(o => diacriticInsensitiveStringNormalizer(o.text).includes(\n normalizedFilter\n ));\n }\n\n this._options.forEach(o => {\n o.hidden = !this.filteredOptions.includes(o);\n });\n\n if (this.filteredOptions.length) {\n this.selectedOptions = [this.filteredOptions[0]!];\n this.selectedIndex = this.options.indexOf(this.firstSelectedOption);\n } else {\n this.selectedOptions = [];\n this.selectedIndex = -1;\n }\n }\n\n /\n Synchronize the form-associated proxy and update the value property of the element.\n \n @param prev - the previous collection of slotted option elements\n * @param next - the next collection of slotted option elements\n \n @internal\n /\n public override slottedOptionsChanged(\n prev: Element[] \| undefined,\n next: Element[]\n ): void {\n super.slottedOptionsChanged(prev, next);\n this.filterOptions();\n }\n\n /\n Triggers the `suggestionProps` command to notify the tiptap editor to select the option.\n * The method is defined based on the `Listbox.clickHandler` implementation.\n \n @internal\n /\n public override clickHandler(e: MouseEvent): boolean {\n const capturedElement = (e.target as HTMLElement).closest(\n 'option,[role=option]'\n );\n\n const capturedListOption = capturedElement as ListOption \| null;\n\n if (!capturedListOption \|\| capturedListOption.disabled) {\n return false;\n }\n const mentionDetail: MentionDetail = {\n href: capturedListOption.value,\n displayName: capturedListOption.text\n };\n this.$emit('mention-selected', mentionDetail);\n this.setOpen(false);\n return true;\n }\n\n /\n Observes the anchor element using intersection observer.\n * Once the anchor element intersects, the anchor region will be closed.\n \n @internal\n /\n public anchorElementChanged(prev: HTMLElement, next: HTMLElement): void {\n if (prev) {\n this.anchorElementIntersectionObserver.unobserve(prev);\n }\n if (this.region && this.anchorElement) {\n this.region.anchorElement = this.anchorElement;\n this.region.update();\n this.anchorElementIntersectionObserver.observe(next);\n }\n }\n\n /\n Observes the anchor region.\n \n @internal\n /\n public regionChanged(): void {\n if (this.regionNotifier) {\n this.regionNotifier.unsubscribe(this);\n }\n this.regionNotifier = Observable.getNotifier(this.region);\n this.regionNotifier.subscribe(this);\n }\n\n /\n Handles the events of the anchored region.\n * Repositions the listbox scroll bar when the `initialLayoutComplete` event is triggered.\n * Other events will be passed to the base class.\n \n @internal\n /\n public override handleChange(source: unknown, args: string): void {\n super.handleChange(source, args);\n if (args === 'initialLayoutComplete') {\n this.focusAndScrollOptionIntoView();\n }\n }\n\n /\n Focus the control and scroll the first selected option into view.\n \n @internal\n * @remarks\n * Overrides: `Listbox.focusAndScrollOptionIntoView`\n */\n protected override focusAndScrollOptionIntoView(): void {\n if (this.open && this.firstSelectedOption) {\n requestAnimationFrame(() => {\n this.firstSelectedOption?.scrollIntoView({ block: 'nearest' });\n });\n }\n }\n\n private setOpen(value: boolean): void {\n this.open = value;\n }\n}\n\nconst nimbleRichTextMentionListbox = RichTextMentionListbox.compose({\n baseName: 'rich-text-mention-listbox',\n template,\n styles\n});\n\nDesignSystem.getOrCreate()\n .withPrefix('nimble')\n .register(nimbleRichTextMentionListbox());\nexport const richTextMentionListboxTag = 'nimble-rich-text-mention-listbox';\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/rich-text/mention-listbox/index.ts"],"names":[],"mappings":"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","sourcesContent":["import { Notifier, Observable, observable } from '@microsoft/fast-element';\nimport {\n DesignSystem,\n ListboxElement as FoundationListbox,\n ListboxOption\n} from '@microsoft/fast-foundation';\nimport { keyEnter, keyEscape, keyTab } from '@microsoft/fast-web-utilities';\nimport type { MentionDetail } from '../editor/types';\nimport { styles } from './styles';\nimport { template } from './template';\nimport type { AnchoredRegion } from '../../anchored-region';\nimport { diacriticInsensitiveStringNormalizer } from '../../utilities/models/string-normalizers';\nimport type { ListOption } from '../../list-option';\nimport type { MentionListboxShowOptions } from './types';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-rich-text-mention-listbox': RichTextMentionListbox;\n }\n}\n\n/*\n A rich text mention listbox which acts as a popup for \"@mention\" support in editor\n /\nexport class RichTextMentionListbox extends FoundationListbox {\n /\n @internal\n /\n @observable\n public open?: boolean;\n\n /\n @internal\n /\n @observable\n public region?: AnchoredRegion;\n\n /\n The space available in the viewport for the listbox when opened.\n \n @internal\n /\n @observable\n public availableViewportHeight = 0;\n\n /\n @internal\n /\n public filter = '';\n\n /\n The collection of currently filtered options.\n * The approach is defined based on the `Combobox.filteredOptions` implementation.\n \n @internal\n /\n @observable\n public filteredOptions: ListboxOption[] = [];\n\n /\n Reference to the internal listbox element.\n \n @internal\n /\n public listbox!: HTMLDivElement;\n\n @observable\n private anchorElement?: HTMLElement;\n\n private regionNotifier?: Notifier;\n\n private readonly anchorElementIntersectionObserver: IntersectionObserver = new IntersectionObserver(\n entries => {\n if (!entries[0]?.isIntersecting) {\n this.setOpen(false);\n }\n },\n { threshold: 1.0, root: document }\n );\n\n /\n @public\n /\n public close(): void {\n this.setOpen(false);\n }\n\n /\n The list of options.\n \n @public\n * @remarks\n * Overrides `Listbox.options`.\n /\n public override get options(): ListboxOption[] {\n Observable.track(this, 'options');\n return this.filteredOptions?.length ? this.filteredOptions : [];\n }\n\n public override set options(value: ListboxOption[]) {\n this._options = value;\n Observable.notify(this, 'options');\n }\n\n /\n Triggers when the mention plugin is activated upon pressing the `key`\n \n @public\n /\n public show(options: MentionListboxShowOptions): void {\n const listboxTop = options.anchorNode.getBoundingClientRect().bottom;\n this.availableViewportHeight = Math.trunc(\n window.innerHeight - listboxTop\n );\n this.filter = options.filter;\n this.anchorElement = options.anchorNode;\n this.setOpen(true);\n this.filterOptions();\n }\n\n /\n Handle keydown actions for listbox navigation and selection.\n \n @param e - the keyboard event\n * @public\n /\n public override keydownHandler(event: KeyboardEvent): boolean {\n if (!this.open) {\n return false;\n }\n switch (event.key) {\n case keyTab:\n case keyEnter: {\n if (!this.hasSelectableOptions) {\n return false;\n }\n const mentionDetail: MentionDetail = {\n href: this.firstSelectedOption.value,\n displayName: this.firstSelectedOption.text\n };\n this.$emit('mention-selected', mentionDetail);\n this.setOpen(false);\n return true;\n }\n case keyEscape: {\n this.setOpen(false);\n return false;\n }\n default: {\n super.keydownHandler(event);\n return false;\n }\n }\n }\n\n /\n Filter available options by filter value.\n * The method is defined based on the `Combobox.filterOptions` and `Combobox.inputHandler` implementation.\n \n @internal\n /\n public filterOptions(): void {\n if (!this.filter) {\n this.filteredOptions = this._options;\n } else {\n const normalizedFilter = diacriticInsensitiveStringNormalizer(\n this.filter\n );\n this.filteredOptions = this._options.filter(o => diacriticInsensitiveStringNormalizer(o.text).includes(\n normalizedFilter\n ));\n }\n\n this._options.forEach(o => {\n o.hidden = !this.filteredOptions.includes(o);\n });\n\n if (this.filteredOptions.length) {\n this.selectedOptions = [this.filteredOptions[0]!];\n this.selectedIndex = this.options.indexOf(this.firstSelectedOption);\n } else {\n this.selectedOptions = [];\n this.selectedIndex = -1;\n }\n }\n\n /\n Synchronize the form-associated proxy and update the value property of the element.\n \n @param prev - the previous collection of slotted option elements\n * @param next - the next collection of slotted option elements\n \n @internal\n /\n public override slottedOptionsChanged(\n prev: Element[] \| undefined,\n next: Element[]\n ): void {\n super.slottedOptionsChanged(prev, next);\n this.filterOptions();\n }\n\n /\n Triggers the `suggestionProps` command to notify the tiptap editor to select the option.\n * The method is defined based on the `Listbox.clickHandler` implementation.\n \n @internal\n /\n public override clickHandler(e: MouseEvent): boolean {\n const capturedElement = (e.target as HTMLElement).closest(\n 'option,[role=option]'\n );\n\n const capturedListOption = capturedElement as ListOption \| null;\n\n if (!capturedListOption \|\| capturedListOption.disabled) {\n return false;\n }\n const mentionDetail: MentionDetail = {\n href: capturedListOption.value,\n displayName: capturedListOption.text\n };\n this.$emit('mention-selected', mentionDetail);\n this.setOpen(false);\n return true;\n }\n\n /\n Observes the anchor element using intersection observer.\n * Once the anchor element intersects, the anchor region will be closed.\n \n @internal\n /\n public anchorElementChanged(prev: HTMLElement, next: HTMLElement): void {\n if (prev) {\n this.anchorElementIntersectionObserver.unobserve(prev);\n }\n if (this.region && this.anchorElement) {\n this.region.anchorElement = this.anchorElement;\n this.region.update();\n this.anchorElementIntersectionObserver.observe(next);\n }\n }\n\n /\n Observes the anchor region.\n \n @internal\n /\n public regionChanged(): void {\n if (this.regionNotifier) {\n this.regionNotifier.unsubscribe(this);\n }\n this.regionNotifier = Observable.getNotifier(this.region);\n this.regionNotifier.subscribe(this);\n }\n\n /\n Handles the events of the anchored region.\n * Repositions the listbox scroll bar when the `initialLayoutComplete` event is triggered.\n * Other events will be passed to the base class.\n \n @internal\n /\n public override handleChange(source: unknown, args: string): void {\n super.handleChange(source, args);\n if (args === 'initialLayoutComplete') {\n this.focusAndScrollOptionIntoView();\n }\n }\n\n /\n Focus the control and scroll the first selected option into view.\n \n @internal\n * @remarks\n * Overrides: `Listbox.focusAndScrollOptionIntoView`\n */\n protected override focusAndScrollOptionIntoView(): void {\n if (this.open && this.firstSelectedOption) {\n requestAnimationFrame(() => {\n this.firstSelectedOption?.scrollIntoView({ block: 'nearest' });\n });\n }\n }\n\n private setOpen(value: boolean): void {\n this.open = value;\n }\n}\n\nconst nimbleRichTextMentionListbox = RichTextMentionListbox.compose({\n baseName: 'rich-text-mention-listbox',\n template,\n styles\n});\n\nDesignSystem.getOrCreate()\n .withPrefix('nimble')\n .register(nimbleRichTextMentionListbox());\nexport const richTextMentionListboxTag = 'nimble-rich-text-mention-listbox';\n"]}

package/dist/esm/rich-text/mention-listbox/template.js CHANGED Viewed

@@ -1,6 +1,8 @@
-import { html, ref, slotted } from '@microsoft/fast-element';
+import { html, ref, slotted, when } from '@microsoft/fast-element';
 import { Listbox } from '@microsoft/fast-foundation';
 import { anchoredRegionTag } from '../../anchored-region';
+import { filterNoResultsLabel } from '../../label-provider/core/label-tokens';
+/* eslint-disable @typescript-eslint/indent */
 // prettier-ignore
 export const template = html `
     <template>
@@ -16,7 +18,11 @@ export const template = html `
             horizontal-scaling="anchor"
             ?hidden="${x => !x.open}">
             <div
-                class="listbox"
+                class="
+                    listbox
+                    scrollable-region
+                    ${x => (x.filteredOptions.length === 0 ? 'empty' : '')}
+                "
                 part="listbox"
                 role="listbox"
                 @click="${(x, c) => x.clickHandler(c.event)}"
@@ -25,9 +31,18 @@ export const template = html `
                 ${ref('listbox')}
             >
                 <slot name="option"
-                    ${slotted({ filter: (n) => n instanceof HTMLElement && Listbox.slottedOptionFilter(n), flatten: true, property: 'slottedOptions' })}
+                    ${slotted({
+    filter: (n) => n instanceof HTMLElement && Listbox.slottedOptionFilter(n),
+    flatten: true,
+    property: 'slottedOptions'
+})}
                 >
                 </slot>
+                ${when(x => x.filteredOptions.length === 0, html `
+                    <span class="no-results-label">
+                        ${x => filterNoResultsLabel.getValueFor(x)}
+                    </span>
+                `)}
             </div>
         </${anchoredRegionTag}>
     </template>

package/dist/esm/rich-text/mention-listbox/template.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../src/rich-text/mention-listbox/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;~~AAC7D~~,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;~~AAE1D~~,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAwB;;WAEzC,iBAAiB;cACd,GAAG,CAAC,QAAQ,CAAC;;;;;;;;;uBASJ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI;;;;;~~0BAKT~~,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAmB,CAAC;6BAC5C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ;yEAC6B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,uBAAuB;kBACrF,GAAG,CAAC,SAAS,CAAC;;;sBAGV,OAAO,CAAC,~~EAAE,~~MAAM,EAAE,CAAC,CAAO,EAAE,EAAE,CAAC,CAAC,YAAY,WAAW,IAAI,OAAO,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,~~OAAO~~,EAAE,IAAI,EAAE,~~QAAQ~~,EAAE,~~gBAAgB~~,EAAE,CAAC~~;;;;YAIjJ~~,iBAAiB;;CAE5B,CAAC","sourcesContent":["import { html, ref, slotted } from '@microsoft/fast-element';\nimport { Listbox } from '@microsoft/fast-foundation';\nimport type { RichTextMentionListbox } from '.';\nimport { anchoredRegionTag } from '../../anchored-region';\n\n// prettier-ignore\nexport const template = html<RichTextMentionListbox>`\n <template>\n <${anchoredRegionTag}\n ${ref('region')}\n class=\"anchored-region\"\n fixed-placement\n auto-update-mode=\"auto\"\n vertical-default-position=\"bottom\"\n vertical-positioning-mode=\"locktodefault\"\n horizontal-default-position=\"center\"\n horizontal-positioning-mode=\"locktodefault\"\n horizontal-scaling=\"anchor\"\n ?hidden=\"${x => !x.open}\">\n <div\n class=\"listbox\"\n part=\"listbox\"\n role=\"listbox\"\n @click=\"${(x, c) => x.clickHandler(c.event as MouseEvent)}\"\n ?disabled=\"${x => x.disabled}\"\n style=\"--ni-private-listbox-available-viewport-height: ${x => x.availableViewportHeight}px;\"\n ${ref('listbox')}\n >\n <slot name=\"option\"\n ${slotted({ filter: (n: Node) => n instanceof HTMLElement && Listbox.slottedOptionFilter(n), flatten: true, property: 'slottedOptions' })}\n >\n </slot>\n </div>\n </${anchoredRegionTag}>\n </template>\n`;\n"]}
1	+ {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../src/rich-text/mention-listbox/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AACnE,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wCAAwC,CAAC;AAE9E,8CAA8C;AAC9C,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAwB;;WAEzC,iBAAiB;cACd,GAAG,CAAC,QAAQ,CAAC;;;;;;;;;uBASJ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI;;;;;sBAKb,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;;;;0BAIhD,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAmB,CAAC;6BAC5C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ;yEAC6B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,uBAAuB;kBACrF,GAAG,CAAC,SAAS,CAAC;;;sBAGV,OAAO,CAAC;IACN,MAAM,EAAE,CAAC,CAAO,EAAE,EAAE,CAAC,CAAC,YAAY,WAAW,IAAI,OAAO,CAAC,mBAAmB,CAAC,CAAC,CAAC;IAC/E,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,gBAAgB;CAC7B,CAAC;;;kBAGJ,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,EAAE,IAAI,CAAwB;;0BAE9D,CAAC,CAAC,EAAE,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC;;iBAEjD,CAAC;;YAEN,iBAAiB;;CAE5B,CAAC","sourcesContent":["import { html, ref, slotted, when } from '@microsoft/fast-element';\nimport { Listbox } from '@microsoft/fast-foundation';\nimport type { RichTextMentionListbox } from '.';\nimport { anchoredRegionTag } from '../../anchored-region';\nimport { filterNoResultsLabel } from '../../label-provider/core/label-tokens';\n\n/* eslint-disable @typescript-eslint/indent */\n// prettier-ignore\nexport const template = html<RichTextMentionListbox>`\n <template>\n <${anchoredRegionTag}\n ${ref('region')}\n class=\"anchored-region\"\n fixed-placement\n auto-update-mode=\"auto\"\n vertical-default-position=\"bottom\"\n vertical-positioning-mode=\"locktodefault\"\n horizontal-default-position=\"center\"\n horizontal-positioning-mode=\"locktodefault\"\n horizontal-scaling=\"anchor\"\n ?hidden=\"${x => !x.open}\">\n <div\n class=\"\n listbox\n scrollable-region\n ${x => (x.filteredOptions.length === 0 ? 'empty' : '')}\n \"\n part=\"listbox\"\n role=\"listbox\"\n @click=\"${(x, c) => x.clickHandler(c.event as MouseEvent)}\"\n ?disabled=\"${x => x.disabled}\"\n style=\"--ni-private-listbox-available-viewport-height: ${x => x.availableViewportHeight}px;\"\n ${ref('listbox')}\n >\n <slot name=\"option\"\n ${slotted({\n filter: (n: Node) => n instanceof HTMLElement && Listbox.slottedOptionFilter(n),\n flatten: true,\n property: 'slottedOptions'\n })}\n >\n </slot>\n ${when(x => x.filteredOptions.length === 0, html<RichTextMentionListbox>`\n <span class=\"no-results-label\">\n ${x => filterNoResultsLabel.getValueFor(x)}\n </span>\n `)}\n </div>\n </${anchoredRegionTag}>\n </template>\n`;\n"]}

package/dist/esm/select/models/select-form-associated.js CHANGED Viewed

@@ -16,4 +16,5 @@ export class FormAssociatedSelect extends FormAssociated(Select) {
         this.proxy = document.createElement('select');
     }
 }
+/* eslint-enable max-classes-per-file */
 //# sourceMappingURL=select-form-associated.js.map

package/dist/esm/select/models/select-form-associated.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-form-associated.js","sourceRoot":"","sources":["../../../../src/select/models/select-form-associated.ts"],"names":[],"mappings":"AAAA,qKAAqK;AACrK,yCAAyC;AACzC,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAE5E,+CAA+C;AAC/C,MAAM,MAAO,SAAQ,cAAc;CAAG;AAItC;;;;;GAKG;AACH,MAAM,OAAO,oBAAqB,SAAQ,cAAc,CAAC,MAAM,CAAC;IAAhE;;QACW,UAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACpD,CAAC;CAAA","sourcesContent":["// Based on: https://github.com/microsoft/fast/blob/%40microsoft/fast-foundation_v2.49.5/packages/web-components/fast-foundation/src/select/select.form-associated.ts\n/* eslint-disable max-classes-per-file /\nimport { FormAssociated, ListboxElement } from '@microsoft/fast-foundation';\n\n// eslint-disable-next-line jsdoc/require-jsdoc\nclass Select extends ListboxElement {}\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface Select extends FormAssociated {}\n\n/\n A form-associated base class for the Select component. This was copied from the\n * FAST FormAssociatedSelect (which is not exported by fast-foundation)\n \n @internal\n */\nexport class FormAssociatedSelect extends FormAssociated(Select) {\n public proxy = document.createElement('select');\n}\n"]}
1	+ {"version":3,"file":"select-form-associated.js","sourceRoot":"","sources":["../../../../src/select/models/select-form-associated.ts"],"names":[],"mappings":"AAAA,qKAAqK;AACrK,yCAAyC;AACzC,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAE5E,+CAA+C;AAC/C,MAAM,MAAO,SAAQ,cAAc;CAAG;AAItC;;;;;GAKG;AACH,MAAM,OAAO,oBAAqB,SAAQ,cAAc,CAAC,MAAM,CAAC;IAAhE;;QACW,UAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACpD,CAAC;CAAA;AACD,wCAAwC","sourcesContent":["// Based on: https://github.com/microsoft/fast/blob/%40microsoft/fast-foundation_v2.49.5/packages/web-components/fast-foundation/src/select/select.form-associated.ts\n/* eslint-disable max-classes-per-file /\nimport { FormAssociated, ListboxElement } from '@microsoft/fast-foundation';\n\n// eslint-disable-next-line jsdoc/require-jsdoc\nclass Select extends ListboxElement {}\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface Select extends FormAssociated {}\n\n/\n A form-associated base class for the Select component. This was copied from the\n * FAST FormAssociatedSelect (which is not exported by fast-foundation)\n \n @internal\n /\nexport class FormAssociatedSelect extends FormAssociated(Select) {\n public proxy = document.createElement('select');\n}\n/ eslint-enable max-classes-per-file */\n"]}

package/dist/esm/select/styles.js CHANGED Viewed

@@ -47,10 +47,6 @@ export const styles = css `
         overflow-x: clip;
     }
-    .listbox.empty slot {
-        display: none;
-    }
     .listbox.above {
         flex-flow: column-reverse;
     }
@@ -110,10 +106,6 @@ export const styles = css `
         outline: 0px;
     }
-    .scrollable-region {
-        overflow: auto;
-    }
     ::slotted([role='option']) {
         background-color: transparent;
     }
@@ -130,14 +122,6 @@ export const styles = css `
         background-color: ${fillHoverSelectedColor};
     }
-    .no-results-label {
-        color: ${placeholderFontColor};
-        height: ${controlHeight};
-        display: inline-flex;
-        align-items: center;
-        padding: ${smallPadding} ${mediumPadding};
-    }
     .loading-container {
         padding-left: ${mediumPadding};
         padding-right: ${mediumPadding};

package/dist/esm/select/styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/select/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,6BAA6B,CAAC;AACvE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,EACH,qBAAqB,EACrB,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,sBAAsB,EACtB,iBAAiB,EACjB,SAAS,EACT,aAAa,EACb,oBAAoB,EACpB,YAAY,EACf,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,cAAc;MACd,WAAW;;MAEX;AACE;gGACgG,CAAC,EACrG;;;iBAGa,oBAAoB;;;;;;;;;kBASnB,iBAAiB;uBACZ,YAAY~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBA+BjB~~,aAAa;;;;;;;;8BAQD,qBAAqB;uBAC5B,aAAa,MAAM,YAAY,MAAM,WAAW;;;;kCAIrC,WAAW;;;;;;;8BAOf,qBAAqB;oBAC/B,aAAa,MAAM,YAAY,MAAM,WAAW;;;;kCAIlC,WAAW;;;;wBAIrB,YAAY;UAC1B,SAAS,CAAC,iBAAiB,KAAK,oBAAoB;;;;;;;;;qBASzC,YAAY,MAAM,aAAa;;;;;iBAKnC,oBAAoB;;;mBAGlB,YAAY~~;;;;;;;;;;;;;4BAaH~~,cAAc;;;;4BAId,iBAAiB;;;;4BAIjB,sBAAsB;;;;~~iBAIjC~~,~~oBAAoB;kBACnB,~~aAAa~~;;;mBAGZ,YAAY,IAAI,aAAa;;;;wBAIxB,aAAa~~;yBACZ,aAAa;;kBAEpB,aAAa;;;;;;0BAML,YAAY;;;;;uBAKf,YAAY;;;;mBAIhB,YAAY,IAAI,aAAa;;;;;iBAK/B,oBAAoB;;;;;;CAMpC,CAAC,aAAa,CACX,kBAAkB,CACd,kBAAkB,CAAC,KAAK,EACxB,GAAG,CAAA;;uCAE4B,WAAW;;;SAGzC,CACJ,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;;;8BAImB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;SAEnD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { styles as dropdownStyles } from '../patterns/dropdown/styles';\nimport { styles as errorStyles } from '../patterns/error/styles';\nimport {\n borderRgbPartialColor,\n borderWidth,\n controlHeight,\n controlSlimHeight,\n fillHoverColor,\n fillHoverSelectedColor,\n fillSelectedColor,\n iconColor,\n mediumPadding,\n placeholderFontColor,\n smallPadding\n} from '../theme-provider/design-tokens';\nimport { appearanceBehavior } from '../utilities/style/appearance';\nimport { DropdownAppearance } from './types';\nimport { focusVisible } from '../utilities/style/focus';\nimport { themeBehavior } from '../utilities/style/theme';\nimport { Theme } from '../theme-provider/types';\nimport { hexToRgbaCssColor } from '../utilities/style/colors';\n\nexport const styles = css`\n ${dropdownStyles}\n ${errorStyles}\n\n ${\n /* We are using flex `order` to define the visual ordering of the selected value,\n error icon, and dropdown arrow because they are not \"interactive\" i.e. part of the tab order / ''\n }\n\n .selected-value.placeholder {\n color: ${placeholderFontColor};\n }\n\n .selected-value {\n order: 1;\n }\n\n .clear-button {\n order: 3;\n height: ${controlSlimHeight};\n margin-left: ${smallPadding};\n }\n\n [part='indicator'] {\n order: 4;\n }\n\n .error-icon {\n order: 2;\n }\n\n [part='end'] {\n display: contents;\n }\n\n .listbox {\n overflow-x: clip;\n }\n\n .listbox.~~empty slot {\n display: none;\n }\n\n .listbox.~~above {\n flex-flow: column-reverse;\n }\n\n .filter-field {\n display: flex;\n flex-direction: row;\n align-items: center;\n height: ${controlHeight};\n background: transparent;\n }\n\n .filter-field::before {\n content: '';\n position: absolute;\n height: 0px;\n border-bottom: rgba(${borderRgbPartialColor}, 0.1) 2px solid;\n bottom: calc(${controlHeight} + ${smallPadding} - ${borderWidth});\n }\n\n .filter-field.above::before {\n width: calc(100% - (2 ${borderWidth}));\n }\n\n .filter-field::after {\n content: '';\n position: absolute;\n height: 0px;\n border-bottom: rgba(${borderRgbPartialColor}, 0.1) 2px solid;\n top: calc(${controlHeight} + ${smallPadding} - ${borderWidth});\n }\n\n .filter-field:not(.above)::after {\n width: calc(100% - (2 * ${borderWidth}));\n }\n\n .filter-icon {\n padding-left: ${smallPadding};\n ${iconColor.cssCustomProperty}: ${placeholderFontColor};\n }\n\n .filter-input {\n background: transparent;\n border: none;\n color: inherit;\n font: inherit;\n height: var(--ni-nimble-control-height);\n padding: 0 ${smallPadding} 0 ${mediumPadding};\n width: 100%;\n }\n\n .filter-input::placeholder {\n color: ${placeholderFontColor};\n }\n\n .filter-input${focusVisible} {\n outline: 0px;\n }\n\n ~~.scrollable-region {\n overflow: auto;\n }\n\n~~ ::slotted([role='option']) {\n background-color: transparent;\n }\n\n ::slotted([role='option']:hover) {\n background-color: ${fillHoverColor};\n }\n\n ::slotted([role='option'][active-option]) {\n background-color: ${fillSelectedColor};\n }\n\n ::slotted([role='option'][active-option]:hover) {\n background-color: ${fillHoverSelectedColor};\n }\n\n .no-results-label {\n color: ${placeholderFontColor};\n height: ${controlHeight};\n display: inline-flex;\n align-items: center;\n padding: ${smallPadding} ${mediumPadding};\n }\n\n .loading-container {\n padding-left: ${mediumPadding};\n padding-right: ${mediumPadding};\n display: flex;\n height: ${controlHeight};\n flex: 1 0 auto;\n }\n\n .loading-container.above {\n align-items: end;\n padding-bottom: ${smallPadding};\n }\n\n .loading-container.below {\n align-items: normal;\n padding-top: ${smallPadding};\n }\n\n .loading-container.empty {\n padding: ${smallPadding} ${mediumPadding};\n align-items: center;\n }\n\n .loading-label {\n color: ${placeholderFontColor};\n }\n\n .loading-spinner {\n margin-left: auto;\n }\n`.withBehaviors(\n appearanceBehavior(\n DropdownAppearance.block,\n css`\n :host([error-visible]) .control {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n `\n ),\n themeBehavior(\n Theme.color,\n css`\n .filter-field,\n .no-results-label,\n .loading-container {\n background: ${hexToRgbaCssColor(White, 0.15)};\n }\n `\n )\n);\n"]}
1	+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/select/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,6BAA6B,CAAC;AACvE,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,EACH,qBAAqB,EACrB,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,sBAAsB,EACtB,iBAAiB,EACjB,SAAS,EACT,aAAa,EACb,oBAAoB,EACpB,YAAY,EACf,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,cAAc;MACd,WAAW;;MAEX;AACE;gGACgG,CAAC,EACrG;;;iBAGa,oBAAoB;;;;;;;;;kBASnB,iBAAiB;uBACZ,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;kBA2BjB,aAAa;;;;;;;;8BAQD,qBAAqB;uBAC5B,aAAa,MAAM,YAAY,MAAM,WAAW;;;;kCAIrC,WAAW;;;;;;;8BAOf,qBAAqB;oBAC/B,aAAa,MAAM,YAAY,MAAM,WAAW;;;;kCAIlC,WAAW;;;;wBAIrB,YAAY;UAC1B,SAAS,CAAC,iBAAiB,KAAK,oBAAoB;;;;;;;;;qBASzC,YAAY,MAAM,aAAa;;;;;iBAKnC,oBAAoB;;;mBAGlB,YAAY;;;;;;;;;4BASH,cAAc;;;;4BAId,iBAAiB;;;;4BAIjB,sBAAsB;;;;wBAI1B,aAAa;yBACZ,aAAa;;kBAEpB,aAAa;;;;;;0BAML,YAAY;;;;;uBAKf,YAAY;;;;mBAIhB,YAAY,IAAI,aAAa;;;;;iBAK/B,oBAAoB;;;;;;CAMpC,CAAC,aAAa,CACX,kBAAkB,CACd,kBAAkB,CAAC,KAAK,EACxB,GAAG,CAAA;;uCAE4B,WAAW;;;SAGzC,CACJ,EACD,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;;;8BAImB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;SAEnD,CACJ,CACJ,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { White } from '@ni/nimble-tokens/dist/styledictionary/js/tokens';\nimport { styles as dropdownStyles } from '../patterns/dropdown/styles';\nimport { styles as errorStyles } from '../patterns/error/styles';\nimport {\n borderRgbPartialColor,\n borderWidth,\n controlHeight,\n controlSlimHeight,\n fillHoverColor,\n fillHoverSelectedColor,\n fillSelectedColor,\n iconColor,\n mediumPadding,\n placeholderFontColor,\n smallPadding\n} from '../theme-provider/design-tokens';\nimport { appearanceBehavior } from '../utilities/style/appearance';\nimport { DropdownAppearance } from './types';\nimport { focusVisible } from '../utilities/style/focus';\nimport { themeBehavior } from '../utilities/style/theme';\nimport { Theme } from '../theme-provider/types';\nimport { hexToRgbaCssColor } from '../utilities/style/colors';\n\nexport const styles = css`\n ${dropdownStyles}\n ${errorStyles}\n\n ${\n /* We are using flex `order` to define the visual ordering of the selected value,\n error icon, and dropdown arrow because they are not \"interactive\" i.e. part of the tab order / ''\n }\n\n .selected-value.placeholder {\n color: ${placeholderFontColor};\n }\n\n .selected-value {\n order: 1;\n }\n\n .clear-button {\n order: 3;\n height: ${controlSlimHeight};\n margin-left: ${smallPadding};\n }\n\n [part='indicator'] {\n order: 4;\n }\n\n .error-icon {\n order: 2;\n }\n\n [part='end'] {\n display: contents;\n }\n\n .listbox {\n overflow-x: clip;\n }\n\n .listbox.above {\n flex-flow: column-reverse;\n }\n\n .filter-field {\n display: flex;\n flex-direction: row;\n align-items: center;\n height: ${controlHeight};\n background: transparent;\n }\n\n .filter-field::before {\n content: '';\n position: absolute;\n height: 0px;\n border-bottom: rgba(${borderRgbPartialColor}, 0.1) 2px solid;\n bottom: calc(${controlHeight} + ${smallPadding} - ${borderWidth});\n }\n\n .filter-field.above::before {\n width: calc(100% - (2 ${borderWidth}));\n }\n\n .filter-field::after {\n content: '';\n position: absolute;\n height: 0px;\n border-bottom: rgba(${borderRgbPartialColor}, 0.1) 2px solid;\n top: calc(${controlHeight} + ${smallPadding} - ${borderWidth});\n }\n\n .filter-field:not(.above)::after {\n width: calc(100% - (2 * ${borderWidth}));\n }\n\n .filter-icon {\n padding-left: ${smallPadding};\n ${iconColor.cssCustomProperty}: ${placeholderFontColor};\n }\n\n .filter-input {\n background: transparent;\n border: none;\n color: inherit;\n font: inherit;\n height: var(--ni-nimble-control-height);\n padding: 0 ${smallPadding} 0 ${mediumPadding};\n width: 100%;\n }\n\n .filter-input::placeholder {\n color: ${placeholderFontColor};\n }\n\n .filter-input${focusVisible} {\n outline: 0px;\n }\n\n ::slotted([role='option']) {\n background-color: transparent;\n }\n\n ::slotted([role='option']:hover) {\n background-color: ${fillHoverColor};\n }\n\n ::slotted([role='option'][active-option]) {\n background-color: ${fillSelectedColor};\n }\n\n ::slotted([role='option'][active-option]:hover) {\n background-color: ${fillHoverSelectedColor};\n }\n\n .loading-container {\n padding-left: ${mediumPadding};\n padding-right: ${mediumPadding};\n display: flex;\n height: ${controlHeight};\n flex: 1 0 auto;\n }\n\n .loading-container.above {\n align-items: end;\n padding-bottom: ${smallPadding};\n }\n\n .loading-container.below {\n align-items: normal;\n padding-top: ${smallPadding};\n }\n\n .loading-container.empty {\n padding: ${smallPadding} ${mediumPadding};\n align-items: center;\n }\n\n .loading-label {\n color: ${placeholderFontColor};\n }\n\n .loading-spinner {\n margin-left: auto;\n }\n`.withBehaviors(\n appearanceBehavior(\n DropdownAppearance.block,\n css`\n :host([error-visible]) .control {\n border-bottom-width: ${borderWidth};\n padding-bottom: 0;\n }\n `\n ),\n themeBehavior(\n Theme.color,\n css`\n .filter-field,\n .no-results-label,\n .loading-container {\n background: ${hexToRgbaCssColor(White, 0.15)};\n }\n `\n )\n);\n"]}

package/dist/esm/select/template.js CHANGED Viewed

@@ -90,7 +90,7 @@ export const template = (context, definition) => html `
             <div class="listbox-background">
                 <div
                     class="
-                        listbox
+                        listbox
                         ${x => (x.filteredOptions.length === 0 ? 'empty' : '')}
                         ${x => x.positionAttribute}
                     "
@@ -126,12 +126,12 @@ export const template = (context, definition) => html `
     property: 'slottedOptions',
 })}
                         ></slot>
+                        ${when(x => (x.filterMode !== FilterMode.none && x.filteredOptions.length === 0 && !x.loadingVisible), html `
+                            <span class="no-results-label">
+                                ${x => filterNoResultsLabel.getValueFor(x)}
+                            </span>
+                        `)}
                     </div>
-                    ${when(x => (x.filterMode !== FilterMode.none && x.filteredOptions.length === 0 && !x.loadingVisible), html `
-                        <span class="no-results-label ${x => x.positionAttribute}">
-                            ${x => filterNoResultsLabel.getValueFor(x)}
-                        </span>
-                    `)}
                     ${when(x => x.loadingVisible, html `
                         <div class="loading-container ${x => x.positionAttribute} ${x => (x.filteredOptions.length === 0 ? 'empty' : '')}"
                             @click="${(x, c) => x.ignoreClickHandler(c.event)}">
@@ -146,4 +146,5 @@ export const template = (context, definition) => html `
         </${anchoredRegionTag}>
     </template>
 `;
+/* eslint-enable @typescript-eslint/indent */
 //# sourceMappingURL=template.js.map

package/dist/esm/select/template.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/select/template.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n html,\n ref,\n slotted,\n ViewTemplate,\n when\n} from '@microsoft/fast-element';\nimport {\n endSlotTemplate,\n FoundationElementTemplate,\n SelectOptions,\n startSlotTemplate\n} from '@microsoft/fast-foundation';\nimport type { Select } from '.';\nimport { anchoredRegionTag } from '../anchored-region';\nimport { DropdownPosition } from '../patterns/dropdown/types';\nimport { overflow } from '../utilities/directive/overflow';\nimport { iconMagnifyingGlassTag } from '../icons/magnifying-glass';\nimport {\n filterNoResultsLabel,\n filterSearchLabel,\n loadingLabel\n} from '../label-provider/core/label-tokens';\nimport { FilterMode } from './types';\nimport { ListOptionGroup } from '../list-option-group';\nimport { buttonTag } from '../button';\nimport { iconTimesTag } from '../icons/times';\nimport { ListOption } from '../list-option';\nimport { spinnerTag } from '../spinner';\n\nexport const isListOption = (\n el: Element \| undefined \| null\n): el is ListOption => {\n return el instanceof ListOption;\n};\n\nexport const isListOptionGroup = (\n n: Element \| undefined \| null\n): n is ListOptionGroup => {\n return n instanceof ListOptionGroup;\n};\n\n/* eslint-disable @typescript-eslint/indent */\n// prettier-ignore\nexport const template: FoundationElementTemplate<\nViewTemplate<Select>,\nSelectOptions\n> = (context, definition) => html<Select>`\n <template\n class=\"${x => [\n x.collapsible && 'collapsible',\n x.collapsible && x.open && 'open',\n x.disabled && 'disabled',\n x.collapsible && x.position,\n ].filter(Boolean).join(' ')}\"\n aria-activedescendant=\"${x => (x.filterMode === FilterMode.none ? x.ariaActiveDescendant : null)}\"\n aria-controls=\"${x => (x.filterMode === FilterMode.none ? x.ariaControls : null)}\"\n aria-disabled=\"${x => x.ariaDisabled}\"\n aria-expanded=\"${x => x.ariaExpanded}\"\n aria-haspopup=\"${x => (x.collapsible ? 'listbox' : null)}\"\n aria-multiselectable=\"${x => x.ariaMultiSelectable}\"\n ?open=\"${x => x.open}\"\n role=\"combobox\"\n tabindex=\"${x => (!x.disabled ? '0' : null)}\"\n @click=\"${(x, c) => x.clickHandler(c.event as MouseEvent)}\"\n @contentchange=\"${x => x.updateDisplayValue()}\"\n @focusin=\"${(x, c) => x.focusinHandler(c.event as FocusEvent)}\"\n @focusout=\"${(x, c) => x.focusoutHandler(c.event as FocusEvent)}\"\n @keydown=\"${(x, c) => x.keydownHandler(c.event as KeyboardEvent)}\"\n @mousedown=\"${(x, c) => x.mousedownHandler(c.event as MouseEvent)}\"\n >\n ${when(x => x.collapsible, html<Select>`\n <div\n class=\"control\"\n part=\"control\"\n ?disabled=\"${x => x.disabled}\"\n ${ref('control')}\n >\n ${startSlotTemplate(context, definition)}\n <slot name=\"button-container\">\n <div class=\"selected-value ${x => (x.displayPlaceholder ? 'placeholder' : '')}\" part=\"selected-value\" ${overflow('hasOverflow')} title=${x => (x.hasOverflow && x.displayValue ? x.displayValue : null)}>\n <slot name=\"selected-value\">${x => x.displayValue}</slot>\n </div>\n ${when(x => !x.disabled && x.clearable && !x.displayPlaceholder && x.selectedIndex >= 0, html<Select>`\n <${buttonTag} \n class=\"clear-button\"\n tabindex=\"-1\"\n part=\"clear-button\"\n content-hidden\n appearance=\"ghost\"\n @click=\"${(x, c) => x.clearClickHandler(c.event as MouseEvent)}\">\n <${iconTimesTag} slot=\"start\"></${iconTimesTag}>\n </${buttonTag}>\n `)}\n <div aria-hidden=\"true\" class=\"indicator\" part=\"indicator\">\n <slot name=\"indicator\">\n ${definition.indicator \|\| ''}\n </slot>\n </div>\n </slot>\n ${endSlotTemplate(context, definition)}\n </div>\n `)\n }\n <${anchoredRegionTag}\n ${ref('anchoredRegion')}\n class=\"anchored-region\"\n fixed-placement\n auto-update-mode=\"auto\"\n vertical-default-position=\"${x => (x.positionAttribute === DropdownPosition.above ? 'top' : 'bottom')}\"\n vertical-positioning-mode=\"${x => (!x.positionAttribute ? 'dynamic' : 'locktodefault')}\"\n horizontal-default-position=\"center\"\n horizontal-positioning-mode=\"locktodefault\"\n horizontal-scaling=\"anchor\"\n @loaded=\"${x => x.regionLoadedHandler()}\"\n ?hidden=\"${x => (x.collapsible ? !x.open : false)}\">\n <div class=\"listbox-background\">\n <div\n class=\"\n listbox \n ${x => (x.filteredOptions.length === 0 ? 'empty' : '')}\n ${x => x.positionAttribute}\n \"\n id=\"${x => x.listboxId}\"\n part=\"listbox\"\n role=\"listbox\"\n ?disabled=\"${x => x.disabled}\"\n style=\"--ni-private-listbox-available-viewport-height: ${x => x.availableViewportHeight}px;\"\n ${ref('listbox')}\n >\n ${when(x => x.filterMode !== FilterMode.none, html<Select>`\n <div class=\"filter-field ${x => x.positionAttribute}\">\n <${iconMagnifyingGlassTag} class=\"filter-icon\"></${iconMagnifyingGlassTag}>\n <input\n ${ref('filterInput')}\n class=\"filter-input\"\n aria-controls=\"${x => x.ariaControls}\"\n aria-activedescendant=\"${x => x.ariaActiveDescendant}\"\n @input=\"${(x, c) => x.inputHandler(c.event as InputEvent)}\"\n @click=\"${(x, c) => x.ignoreClickHandler(c.event as MouseEvent)}\"\n placeholder=\"${x => filterSearchLabel.getValueFor(x)}\"\n value=\"${x => x.filter}\"\n />\n </div>\n `)}\n <div ${ref('scrollableRegion')}\n class=\"scrollable-region\">\n <slot\n name=\"option\"\n ${slotted({\n filter: (n: Node) => n instanceof HTMLElement && (isListOption(n) \|\| isListOptionGroup(n)),\n flatten: true,\n property: 'slottedOptions',\n })}\n ></slot>\n </div>\n ${when(x => (x.filterMode !== FilterMode.none && x.filteredOptions.length === 0 && !x.loadingVisible), html<Select>`\n <span class=\"no-results-label ${x => x.positionAttribute}\">\n ${x => filterNoResultsLabel.getValueFor(x)}\n </span>\n `)}\n ${when(x => x.loadingVisible, html<Select>`\n <div class=\"loading-container ${x => x.positionAttribute} ${x => (x.filteredOptions.length === 0 ? 'empty' : '')}\"\n @click=\"${(x, c) => x.ignoreClickHandler(c.event as MouseEvent)}\">\n <span class=\"loading-label\">\n ${x => loadingLabel.getValueFor(x)}\n </span>\n <${spinnerTag} class=\"loading-spinner\" appearance=\"accent\"></${spinnerTag}>\n </div>\n `)}\n </div>\n </div>\n </${anchoredRegionTag}>\n </template>\n`;\n"]}
1	+ {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/select/template.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n html,\n ref,\n slotted,\n ViewTemplate,\n when\n} from '@microsoft/fast-element';\nimport {\n endSlotTemplate,\n FoundationElementTemplate,\n SelectOptions,\n startSlotTemplate\n} from '@microsoft/fast-foundation';\nimport type { Select } from '.';\nimport { anchoredRegionTag } from '../anchored-region';\nimport { DropdownPosition } from '../patterns/dropdown/types';\nimport { overflow } from '../utilities/directive/overflow';\nimport { iconMagnifyingGlassTag } from '../icons/magnifying-glass';\nimport {\n filterNoResultsLabel,\n filterSearchLabel,\n loadingLabel\n} from '../label-provider/core/label-tokens';\nimport { FilterMode } from './types';\nimport { ListOptionGroup } from '../list-option-group';\nimport { buttonTag } from '../button';\nimport { iconTimesTag } from '../icons/times';\nimport { ListOption } from '../list-option';\nimport { spinnerTag } from '../spinner';\n\nexport const isListOption = (\n el: Element \| undefined \| null\n): el is ListOption => {\n return el instanceof ListOption;\n};\n\nexport const isListOptionGroup = (\n n: Element \| undefined \| null\n): n is ListOptionGroup => {\n return n instanceof ListOptionGroup;\n};\n\n/* eslint-disable @typescript-eslint/indent /\n// prettier-ignore\nexport const template: FoundationElementTemplate<\nViewTemplate<Select>,\nSelectOptions\n> = (context, definition) => html<Select>`\n <template\n class=\"${x => [\n x.collapsible && 'collapsible',\n x.collapsible && x.open && 'open',\n x.disabled && 'disabled',\n x.collapsible && x.position,\n ].filter(Boolean).join(' ')}\"\n aria-activedescendant=\"${x => (x.filterMode === FilterMode.none ? x.ariaActiveDescendant : null)}\"\n aria-controls=\"${x => (x.filterMode === FilterMode.none ? x.ariaControls : null)}\"\n aria-disabled=\"${x => x.ariaDisabled}\"\n aria-expanded=\"${x => x.ariaExpanded}\"\n aria-haspopup=\"${x => (x.collapsible ? 'listbox' : null)}\"\n aria-multiselectable=\"${x => x.ariaMultiSelectable}\"\n ?open=\"${x => x.open}\"\n role=\"combobox\"\n tabindex=\"${x => (!x.disabled ? '0' : null)}\"\n @click=\"${(x, c) => x.clickHandler(c.event as MouseEvent)}\"\n @contentchange=\"${x => x.updateDisplayValue()}\"\n @focusin=\"${(x, c) => x.focusinHandler(c.event as FocusEvent)}\"\n @focusout=\"${(x, c) => x.focusoutHandler(c.event as FocusEvent)}\"\n @keydown=\"${(x, c) => x.keydownHandler(c.event as KeyboardEvent)}\"\n @mousedown=\"${(x, c) => x.mousedownHandler(c.event as MouseEvent)}\"\n >\n ${when(x => x.collapsible, html<Select>`\n <div\n class=\"control\"\n part=\"control\"\n ?disabled=\"${x => x.disabled}\"\n ${ref('control')}\n >\n ${startSlotTemplate(context, definition)}\n <slot name=\"button-container\">\n <div class=\"selected-value ${x => (x.displayPlaceholder ? 'placeholder' : '')}\" part=\"selected-value\" ${overflow('hasOverflow')} title=${x => (x.hasOverflow && x.displayValue ? x.displayValue : null)}>\n <slot name=\"selected-value\">${x => x.displayValue}</slot>\n </div>\n ${when(x => !x.disabled && x.clearable && !x.displayPlaceholder && x.selectedIndex >= 0, html<Select>`\n <${buttonTag} \n class=\"clear-button\"\n tabindex=\"-1\"\n part=\"clear-button\"\n content-hidden\n appearance=\"ghost\"\n @click=\"${(x, c) => x.clearClickHandler(c.event as MouseEvent)}\">\n <${iconTimesTag} slot=\"start\"></${iconTimesTag}>\n </${buttonTag}>\n `)}\n <div aria-hidden=\"true\" class=\"indicator\" part=\"indicator\">\n <slot name=\"indicator\">\n ${definition.indicator \|\| ''}\n </slot>\n </div>\n </slot>\n ${endSlotTemplate(context, definition)}\n </div>\n `)\n }\n <${anchoredRegionTag}\n ${ref('anchoredRegion')}\n class=\"anchored-region\"\n fixed-placement\n auto-update-mode=\"auto\"\n vertical-default-position=\"${x => (x.positionAttribute === DropdownPosition.above ? 'top' : 'bottom')}\"\n vertical-positioning-mode=\"${x => (!x.positionAttribute ? 'dynamic' : 'locktodefault')}\"\n horizontal-default-position=\"center\"\n horizontal-positioning-mode=\"locktodefault\"\n horizontal-scaling=\"anchor\"\n @loaded=\"${x => x.regionLoadedHandler()}\"\n ?hidden=\"${x => (x.collapsible ? !x.open : false)}\">\n <div class=\"listbox-background\">\n <div\n class=\"\n listbox\n ${x => (x.filteredOptions.length === 0 ? 'empty' : '')}\n ${x => x.positionAttribute}\n \"\n id=\"${x => x.listboxId}\"\n part=\"listbox\"\n role=\"listbox\"\n ?disabled=\"${x => x.disabled}\"\n style=\"--ni-private-listbox-available-viewport-height: ${x => x.availableViewportHeight}px;\"\n ${ref('listbox')}\n >\n ${when(x => x.filterMode !== FilterMode.none, html<Select>`\n <div class=\"filter-field ${x => x.positionAttribute}\">\n <${iconMagnifyingGlassTag} class=\"filter-icon\"></${iconMagnifyingGlassTag}>\n <input\n ${ref('filterInput')}\n class=\"filter-input\"\n aria-controls=\"${x => x.ariaControls}\"\n aria-activedescendant=\"${x => x.ariaActiveDescendant}\"\n @input=\"${(x, c) => x.inputHandler(c.event as InputEvent)}\"\n @click=\"${(x, c) => x.ignoreClickHandler(c.event as MouseEvent)}\"\n placeholder=\"${x => filterSearchLabel.getValueFor(x)}\"\n value=\"${x => x.filter}\"\n />\n </div>\n `)}\n <div ${ref('scrollableRegion')}\n class=\"scrollable-region\">\n <slot\n name=\"option\"\n ${slotted({\n filter: (n: Node) => n instanceof HTMLElement && (isListOption(n) \|\| isListOptionGroup(n)),\n flatten: true,\n property: 'slottedOptions',\n })}\n ></slot>\n ${when(x => (x.filterMode !== FilterMode.none && x.filteredOptions.length === 0 && !x.loadingVisible), html<Select>`\n <span class=\"no-results-label\">\n ${x => filterNoResultsLabel.getValueFor(x)}\n </span>\n `)}\n </div>\n ${when(x => x.loadingVisible, html<Select>`\n <div class=\"loading-container ${x => x.positionAttribute} ${x => (x.filteredOptions.length === 0 ? 'empty' : '')}\"\n @click=\"${(x, c) => x.ignoreClickHandler(c.event as MouseEvent)}\">\n <span class=\"loading-label\">\n ${x => loadingLabel.getValueFor(x)}\n </span>\n <${spinnerTag} class=\"loading-spinner\" appearance=\"accent\"></${spinnerTag}>\n </div>\n `)}\n </div>\n </div>\n </${anchoredRegionTag}>\n </template>\n`;\n/ eslint-enable @typescript-eslint/indent */\n"]}

package/dist/esm/spinner/template.js CHANGED Viewed

@@ -18,4 +18,5 @@ export const template = html `
         </div>
     </template>
 `;
+/* eslint-enable @typescript-eslint/indent */
 //# sourceMappingURL=template.js.map

package/dist/esm/spinner/template.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/spinner/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAG/C,8CAA8C;AAC9C,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAS;;UAE3B,EAAE;AACA;;;;GAIG;AACP;;;;;;;;CAQP,CAAC","sourcesContent":["import { html } from '@microsoft/fast-element';\nimport type { Spinner } from '.';\n\n/* eslint-disable @typescript-eslint/indent /\n// prettier-ignore\nexport const template = html<Spinner>`\n <template role=\"progressbar\">\n ${''\n /\n In Firefox, the 'title' set on the spinner is very finicky when\n * the spinner is animating. Therefore, put a transparent overlay on\n * top of the spinning bits so that the title displays as expected.\n */\n }\n <div class=\"overlay\"></div>\n\n <div class=\"container\">\n <div class=\"bit1\"></div>\n <div class=\"bit2\"></div>\n </div>\n </template>\n`;\n"]}
1	+ {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/spinner/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAG/C,8CAA8C;AAC9C,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAS;;UAE3B,EAAE;AACA;;;;GAIG;AACP;;;;;;;;CAQP,CAAC;AACF,6CAA6C","sourcesContent":["import { html } from '@microsoft/fast-element';\nimport type { Spinner } from '.';\n\n/* eslint-disable @typescript-eslint/indent /\n// prettier-ignore\nexport const template = html<Spinner>`\n <template role=\"progressbar\">\n ${''\n /\n In Firefox, the 'title' set on the spinner is very finicky when\n * the spinner is animating. Therefore, put a transparent overlay on\n * top of the spinning bits so that the title displays as expected.\n /\n }\n <div class=\"overlay\"></div>\n\n <div class=\"container\">\n <div class=\"bit1\"></div>\n <div class=\"bit2\"></div>\n </div>\n </template>\n`;\n/ eslint-enable @typescript-eslint/indent */\n"]}

package/dist/esm/table/components/group-row/template.js CHANGED Viewed

@@ -46,4 +46,5 @@ export const template = html `
         </div>
     </template>
 `;
+/* eslint-enable @typescript-eslint/indent */
 //# sourceMappingURL=template.js.map

package/dist/esm/table/components/group-row/template.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../../src/table/components/group-row/template.ts"],"names":[],"mappings":"AAAA,8CAA8C;AAC9C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,qCAAqC,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EACH,uBAAuB,EACvB,qBAAqB,EACrB,wBAAwB,EAC3B,MAAM,4CAA4C,CAAC;AAEpD,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAe;;;iBAG1B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB,EAAE;wBACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ;4DACqB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY;;UAErE,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI,CAAe;;mBAElC,WAAW;sBACR,GAAG,CAAC,mBAAmB,CAAC;;+BAEf,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,KAAoB,CAAC;8BAC9D,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,eAAe,EAAE;6BACpC,CAAC,CAAC,EAAE,CAAC,wBAAwB,CAAC,WAAW,CAAC,CAAC,CAAC;kCACvC,CAAC,CAAC,EAAE,CAAC,wBAAwB,CAAC,WAAW,CAAC,CAAC,CAAC;;oBAE1D,WAAW;;SAEtB,CAAC;;;eAGK,SAAS;8BACM,gBAAgB,CAAC,KAAK;;;;yBAI3B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,uBAAuB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;;;mBAGvG,yBAAyB,IAAI,GAAG,CAAC,YAAY,CAAC,sCAAsC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc,OAAO,yBAAyB;gBAC5I,SAAS;;;;cAIX,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,eAAe,CAAC,uBAAuB;mDACtB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB;;;CAG5E,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/indent */\nimport { html, ref, when } from '@microsoft/fast-element';\nimport type { TableGroupRow } from '.';\nimport { buttonTag } from '../../../button';\nimport { ButtonAppearance } from '../../../button/types';\nimport { iconArrowExpanderRightTag } from '../../../icons/arrow-expander-right';\nimport { checkboxTag } from '../../../checkbox';\nimport {\n tableGroupCollapseLabel,\n tableGroupExpandLabel,\n tableGroupSelectAllLabel\n} from '../../../label-provider/table/label-tokens';\n\n// prettier-ignore\nexport const template = html<TableGroupRow>`\n <template\n role=\"row\"\n @click=${x => x.onGroupExpandToggle()}\n aria-expanded=${x => x.expanded}\n style=\"--ni-private-table-group-row-indent-level: ${x => x.nestingLevel};\"\n >\n ${when(x => x.selectable, html<TableGroupRow>`\n <span role=\"gridcell\" class=\"checkbox-container\">\n <${checkboxTag}\n ${ref('selectionCheckbox')}\n class=\"selection-checkbox\"\n @change=\"${(x, c) => x.onSelectionCheckboxChange(c.event as CustomEvent)}\"\n @click=\"${(_, c) => c.event.stopPropagation()}\"\n title=\"${x => tableGroupSelectAllLabel.getValueFor(x)}\"\n aria-label=\"${x => tableGroupSelectAllLabel.getValueFor(x)}\"\n >\n </${checkboxTag}>\n </span>\n `)}\n\n <span role=\"gridcell\">\n <${buttonTag}\n appearance=\"${ButtonAppearance.ghost}\"\n content-hidden\n class=\"expand-collapse-button\"\n tabindex=\"-1\"\n title=\"${x => (x.expanded ? tableGroupCollapseLabel.getValueFor(x) : tableGroupExpandLabel.getValueFor(x))}\"\n aria-hidden=\"true\"\n >\n <${iconArrowExpanderRightTag} ${ref('expandIcon')} slot=\"start\" class=\"expander-icon ${x => x.animationClass}\"></${iconArrowExpanderRightTag}>\n </${buttonTag}>\n </span>\n\n <div class=\"group-row-header-content\">\n ${x => x.groupColumn?.columnInternals.groupHeaderViewTemplate}\n <span class=\"group-row-child-count\">(${x => x.immediateChildCount})</span>\n </div>\n </template>\n`;\n"]}
1	+ {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../../src/table/components/group-row/template.ts"],"names":[],"mappings":"AAAA,8CAA8C;AAC9C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,qCAAqC,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EACH,uBAAuB,EACvB,qBAAqB,EACrB,wBAAwB,EAC3B,MAAM,4CAA4C,CAAC;AAEpD,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAe;;;iBAG1B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB,EAAE;wBACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ;4DACqB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY;;UAErE,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI,CAAe;;mBAElC,WAAW;sBACR,GAAG,CAAC,mBAAmB,CAAC;;+BAEf,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,KAAoB,CAAC;8BAC9D,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,eAAe,EAAE;6BACpC,CAAC,CAAC,EAAE,CAAC,wBAAwB,CAAC,WAAW,CAAC,CAAC,CAAC;kCACvC,CAAC,CAAC,EAAE,CAAC,wBAAwB,CAAC,WAAW,CAAC,CAAC,CAAC;;oBAE1D,WAAW;;SAEtB,CAAC;;;eAGK,SAAS;8BACM,gBAAgB,CAAC,KAAK;;;;yBAI3B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,uBAAuB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;;;mBAGvG,yBAAyB,IAAI,GAAG,CAAC,YAAY,CAAC,sCAAsC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc,OAAO,yBAAyB;gBAC5I,SAAS;;;;cAIX,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,eAAe,CAAC,uBAAuB;mDACtB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB;;;CAG5E,CAAC;AACF,6CAA6C","sourcesContent":["/* eslint-disable @typescript-eslint/indent /\nimport { html, ref, when } from '@microsoft/fast-element';\nimport type { TableGroupRow } from '.';\nimport { buttonTag } from '../../../button';\nimport { ButtonAppearance } from '../../../button/types';\nimport { iconArrowExpanderRightTag } from '../../../icons/arrow-expander-right';\nimport { checkboxTag } from '../../../checkbox';\nimport {\n tableGroupCollapseLabel,\n tableGroupExpandLabel,\n tableGroupSelectAllLabel\n} from '../../../label-provider/table/label-tokens';\n\n// prettier-ignore\nexport const template = html<TableGroupRow>`\n <template\n role=\"row\"\n @click=${x => x.onGroupExpandToggle()}\n aria-expanded=${x => x.expanded}\n style=\"--ni-private-table-group-row-indent-level: ${x => x.nestingLevel};\"\n >\n ${when(x => x.selectable, html<TableGroupRow>`\n <span role=\"gridcell\" class=\"checkbox-container\">\n <${checkboxTag}\n ${ref('selectionCheckbox')}\n class=\"selection-checkbox\"\n @change=\"${(x, c) => x.onSelectionCheckboxChange(c.event as CustomEvent)}\"\n @click=\"${(_, c) => c.event.stopPropagation()}\"\n title=\"${x => tableGroupSelectAllLabel.getValueFor(x)}\"\n aria-label=\"${x => tableGroupSelectAllLabel.getValueFor(x)}\"\n >\n </${checkboxTag}>\n </span>\n `)}\n\n <span role=\"gridcell\">\n <${buttonTag}\n appearance=\"${ButtonAppearance.ghost}\"\n content-hidden\n class=\"expand-collapse-button\"\n tabindex=\"-1\"\n title=\"${x => (x.expanded ? tableGroupCollapseLabel.getValueFor(x) : tableGroupExpandLabel.getValueFor(x))}\"\n aria-hidden=\"true\"\n >\n <${iconArrowExpanderRightTag} ${ref('expandIcon')} slot=\"start\" class=\"expander-icon ${x => x.animationClass}\"></${iconArrowExpanderRightTag}>\n </${buttonTag}>\n </span>\n\n <div class=\"group-row-header-content\">\n ${x => x.groupColumn?.columnInternals.groupHeaderViewTemplate}\n <span class=\"group-row-child-count\">(${x => x.immediateChildCount})</span>\n </div>\n </template>\n`;\n/ eslint-enable @typescript-eslint/indent */\n"]}

package/dist/esm/table-column/anchor/cell-view/template.js CHANGED Viewed

@@ -42,4 +42,5 @@ export const template = html `
             </span>`)}
     </template>
 `;
+/* eslint-enable @typescript-eslint/indent */
 //# sourceMappingURL=template.js.map

package/dist/esm/table-column/anchor/cell-view/template.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../../src/table-column/anchor/cell-view/template.ts"],"names":[],"mappings":"AAAA,8CAA8C;AAC9C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AAEjE,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAA2B;;kBAErC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;IACf,IAAI,OAAO,CAAC,CAAC,UAAU,EAAE,IAAI,KAAK,QAAQ,EAAE,CAAC;QACzC,CAAC,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;IAC9B,CAAC;IACD,OAAO,IAAI,CAAC;AAChB,CAAC;iBACQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;;UAElD,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI,CAA2B;eAClD,SAAS;kBACN,GAAG,CAAC,QAAQ,CAAC;kBACb,QAAQ,CAAC,aAAa,CAAC;kBACvB,EAAE,CAAC,+DAA+D;;wBAE5D,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI;4BACnB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ;wBACjC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,IAAI;kCACf,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,cAAc;uBAC9C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,GAAG;0BACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,MAAM;wBAC7B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,IAAI;4BACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ;qCACpB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,eAAe;8BAC3C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,UAAU;wBACrC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;;kBAE1C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;gBACb,SAAS,GAAG,CAAC;UACnB,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI,CAA2B;;kBAEhD,QAAQ,CAAC,aAAa,CAAC;wBACjB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;;kBAE1C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;oBACT,CAAC;;CAEpB,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/indent /\nimport { html, ref, when } from '@microsoft/fast-element';\nimport type { TableColumnAnchorCellView } from '.';\nimport { anchorTag } from '../../../anchor';\nimport { overflow } from '../../../utilities/directive/overflow';\n\n// prettier-ignore\nexport const template = html<TableColumnAnchorCellView>`\n <template\n @click=\"${(x, c) => {\n if (typeof x.cellRecord?.href === 'string') {\n c.event.stopPropagation();\n }\n return true;\n }}\"\n class=\"${x => (x.isPlaceholder ? 'placeholder' : '')}\"\n >\n ${when(x => x.showAnchor, html<TableColumnAnchorCellView>`\n <${anchorTag}\n ${ref('anchor')}\n ${overflow('hasOverflow')}\n ${'' / tabindex managed dynamically by KeyboardNavigationManager */}\n tabindex=\"-1\"\n href=\"${x => x.cellRecord?.href}\"\n hreflang=\"${x => x.columnConfig?.hreflang}\"\n ping=\"${x => x.columnConfig?.ping}\"\n referrerpolicy=\"${x => x.columnConfig?.referrerpolicy}\"\n rel=\"${x => x.columnConfig?.rel}\"\n target=\"${x => x.columnConfig?.target}\"\n type=\"${x => x.columnConfig?.type}\"\n download=\"${x => x.columnConfig?.download}\"\n ?underline-hidden=\"${x => x.columnConfig?.underlineHidden}\"\n appearance=\"${x => x.columnConfig?.appearance}\"\n title=${x => (x.hasOverflow ? x.text : null)}\n >\n ${x => x.text}\n </${anchorTag}>`)}\n ${when(x => !x.showAnchor, html<TableColumnAnchorCellView>`\n <span\n ${overflow('hasOverflow')}\n title=${x => (x.hasOverflow ? x.text : null)}\n >\n ${x => x.text}\n </span>`)}\n </template>\n`;\n"]}
1	+ {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../../src/table-column/anchor/cell-view/template.ts"],"names":[],"mappings":"AAAA,8CAA8C;AAC9C,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AAEjE,kBAAkB;AAClB,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAA2B;;kBAErC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;IACf,IAAI,OAAO,CAAC,CAAC,UAAU,EAAE,IAAI,KAAK,QAAQ,EAAE,CAAC;QACzC,CAAC,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;IAC9B,CAAC;IACD,OAAO,IAAI,CAAC;AAChB,CAAC;iBACQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;;UAElD,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI,CAA2B;eAClD,SAAS;kBACN,GAAG,CAAC,QAAQ,CAAC;kBACb,QAAQ,CAAC,aAAa,CAAC;kBACvB,EAAE,CAAC,+DAA+D;;wBAE5D,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI;4BACnB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ;wBACjC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,IAAI;kCACf,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,cAAc;uBAC9C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,GAAG;0BACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,MAAM;wBAC7B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,IAAI;4BACrB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ;qCACpB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,eAAe;8BAC3C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,UAAU;wBACrC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;;kBAE1C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;gBACb,SAAS,GAAG,CAAC;UACnB,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,UAAU,EAAE,IAAI,CAA2B;;kBAEhD,QAAQ,CAAC,aAAa,CAAC;wBACjB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;;kBAE1C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;oBACT,CAAC;;CAEpB,CAAC;AACF,6CAA6C","sourcesContent":["/* eslint-disable @typescript-eslint/indent /\nimport { html, ref, when } from '@microsoft/fast-element';\nimport type { TableColumnAnchorCellView } from '.';\nimport { anchorTag } from '../../../anchor';\nimport { overflow } from '../../../utilities/directive/overflow';\n\n// prettier-ignore\nexport const template = html<TableColumnAnchorCellView>`\n <template\n @click=\"${(x, c) => {\n if (typeof x.cellRecord?.href === 'string') {\n c.event.stopPropagation();\n }\n return true;\n }}\"\n class=\"${x => (x.isPlaceholder ? 'placeholder' : '')}\"\n >\n ${when(x => x.showAnchor, html<TableColumnAnchorCellView>`\n <${anchorTag}\n ${ref('anchor')}\n ${overflow('hasOverflow')}\n ${'' / tabindex managed dynamically by KeyboardNavigationManager /}\n tabindex=\"-1\"\n href=\"${x => x.cellRecord?.href}\"\n hreflang=\"${x => x.columnConfig?.hreflang}\"\n ping=\"${x => x.columnConfig?.ping}\"\n referrerpolicy=\"${x => x.columnConfig?.referrerpolicy}\"\n rel=\"${x => x.columnConfig?.rel}\"\n target=\"${x => x.columnConfig?.target}\"\n type=\"${x => x.columnConfig?.type}\"\n download=\"${x => x.columnConfig?.download}\"\n ?underline-hidden=\"${x => x.columnConfig?.underlineHidden}\"\n appearance=\"${x => x.columnConfig?.appearance}\"\n title=${x => (x.hasOverflow ? x.text : null)}\n >\n ${x => x.text}\n </${anchorTag}>`)}\n ${when(x => !x.showAnchor, html<TableColumnAnchorCellView>`\n <span\n ${overflow('hasOverflow')}\n title=${x => (x.hasOverflow ? x.text : null)}\n >\n ${x => x.text}\n </span>`)}\n </template>\n`;\n/ eslint-enable @typescript-eslint/indent */\n"]}

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

@@ -71,4 +71,5 @@ class ThemeStyleSheetBehavior {
  * ```
  */
 export const themeBehavior = (theme, styles) => new ThemeStyleSheetBehavior(theme, styles);
+/* eslint-enable max-classes-per-file */
 //# sourceMappingURL=theme.js.map

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

	@@ -1 +1 @@
1	- {"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,CAAC;YACC,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACvD,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAC1D,CAAC;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,CAAC;YACb,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;QACvC,CAAC;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","sourcesContent":["/* eslint-disable max-classes-per-file /\nimport type {\n Behavior,\n ElementStyles,\n FASTElement,\n Subscriber\n} from '@microsoft/fast-element';\nimport type { Theme } from '../../theme-provider/types';\nimport { theme as themeToken } from '../../theme-provider';\n\n/\n Subscription for {@link ThemeStyleSheetBehavior}\n /\nclass ThemeStyleSheetBehaviorSubscription implements Subscriber {\n public constructor(\n private readonly value: Theme \| Theme[],\n private readonly styles: ElementStyles,\n private readonly source: HTMLElement & FASTElement\n ) {}\n\n public handleChange(): void {\n const theme = themeToken.getValueFor(this.source);\n if (\n Array.isArray(this.value)\n ? this.value.includes(theme)\n : this.value === theme\n ) {\n this.source.$fastController.addStyles(this.styles);\n } else {\n this.source.$fastController.removeStyles(this.styles);\n }\n }\n}\n\n/\n Behavior to conditionally apply theme-based stylesheets.\n /\nclass ThemeStyleSheetBehavior implements Behavior {\n private readonly cache: WeakMap<\n HTMLElement,\n ThemeStyleSheetBehaviorSubscription\n > = new WeakMap();\n\n public constructor(\n private readonly theme: Theme \| Theme[],\n private readonly styles: ElementStyles\n ) {}\n\n /\n @internal\n /\n public bind(source: FASTElement & HTMLElement): void {\n const subscriber = this.cache.get(source)\n \|\| new ThemeStyleSheetBehaviorSubscription(\n this.theme,\n this.styles,\n source\n );\n\n // Currently subscriber from cache may have gone through unbind\n // but still be in cache so always resubscribe\n // See: https://github.com/microsoft/fast/issues/3246#issuecomment-1030424876\n themeToken.subscribe(subscriber, source);\n subscriber.handleChange();\n\n this.cache.set(source, subscriber);\n }\n\n /\n @internal\n /\n public unbind(source: FASTElement & HTMLElement): void {\n const subscriber = this.cache.get(source);\n\n if (subscriber) {\n themeToken.unsubscribe(subscriber);\n }\n\n // Currently does not evict subscriber from cache\n // See: https://github.com/microsoft/fast/issues/3246#issuecomment-1030424876\n }\n}\n\n/\n Behavior to conditionally apply theme-based stylesheets. To determine which to apply,\n * the behavior will use the nearest ThemeProvider's 'theme' design system value.\n \n @public\n * @example\n * ```ts\n * css`\n * // ...\n * `.withBehaviors(\n * themeBehavior(Theme.light, css` ... `),\n * // Apply style for both dark and color theme\n * themeBehavior([Theme.dark, Theme.color], css` ... `)\n * )\n * ```\n */\nexport const themeBehavior = (\n theme: Theme \| Theme[],\n styles: ElementStyles\n): ThemeStyleSheetBehavior => new ThemeStyleSheetBehavior(theme, styles);\n"]}
1	+ {"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,CAAC;YACC,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACvD,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAC1D,CAAC;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,CAAC;YACb,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;QACvC,CAAC;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;AACzE,wCAAwC","sourcesContent":["/* eslint-disable max-classes-per-file /\nimport type {\n Behavior,\n ElementStyles,\n FASTElement,\n Subscriber\n} from '@microsoft/fast-element';\nimport type { Theme } from '../../theme-provider/types';\nimport { theme as themeToken } from '../../theme-provider';\n\n/\n Subscription for {@link ThemeStyleSheetBehavior}\n /\nclass ThemeStyleSheetBehaviorSubscription implements Subscriber {\n public constructor(\n private readonly value: Theme \| Theme[],\n private readonly styles: ElementStyles,\n private readonly source: HTMLElement & FASTElement\n ) {}\n\n public handleChange(): void {\n const theme = themeToken.getValueFor(this.source);\n if (\n Array.isArray(this.value)\n ? this.value.includes(theme)\n : this.value === theme\n ) {\n this.source.$fastController.addStyles(this.styles);\n } else {\n this.source.$fastController.removeStyles(this.styles);\n }\n }\n}\n\n/\n Behavior to conditionally apply theme-based stylesheets.\n /\nclass ThemeStyleSheetBehavior implements Behavior {\n private readonly cache: WeakMap<\n HTMLElement,\n ThemeStyleSheetBehaviorSubscription\n > = new WeakMap();\n\n public constructor(\n private readonly theme: Theme \| Theme[],\n private readonly styles: ElementStyles\n ) {}\n\n /\n @internal\n /\n public bind(source: FASTElement & HTMLElement): void {\n const subscriber = this.cache.get(source)\n \|\| new ThemeStyleSheetBehaviorSubscription(\n this.theme,\n this.styles,\n source\n );\n\n // Currently subscriber from cache may have gone through unbind\n // but still be in cache so always resubscribe\n // See: https://github.com/microsoft/fast/issues/3246#issuecomment-1030424876\n themeToken.subscribe(subscriber, source);\n subscriber.handleChange();\n\n this.cache.set(source, subscriber);\n }\n\n /\n @internal\n /\n public unbind(source: FASTElement & HTMLElement): void {\n const subscriber = this.cache.get(source);\n\n if (subscriber) {\n themeToken.unsubscribe(subscriber);\n }\n\n // Currently does not evict subscriber from cache\n // See: https://github.com/microsoft/fast/issues/3246#issuecomment-1030424876\n }\n}\n\n/\n Behavior to conditionally apply theme-based stylesheets. To determine which to apply,\n * the behavior will use the nearest ThemeProvider's 'theme' design system value.\n \n @public\n * @example\n * ```ts\n * css`\n * // ...\n * `.withBehaviors(\n * themeBehavior(Theme.light, css` ... `),\n * // Apply style for both dark and color theme\n * themeBehavior([Theme.dark, Theme.color], css` ... `)\n * )\n * ```\n /\nexport const themeBehavior = (\n theme: Theme \| Theme[],\n styles: ElementStyles\n): ThemeStyleSheetBehavior => new ThemeStyleSheetBehavior(theme, styles);\n/ eslint-enable max-classes-per-file */\n"]}

package/dist/esm/utilities/unit-format/scaled-unit-format/manually-translated-scaled-unit-format.js CHANGED Viewed

@@ -59,4 +59,5 @@ export class ManuallyTranslatedScaledUnitFormat extends ScaledUnitFormat {
             ?? unitTranslations.get('en'));
     }
 }
+/* eslint-enable max-classes-per-file */
 //# sourceMappingURL=manually-translated-scaled-unit-format.js.map

package/dist/esm/utilities/unit-format/scaled-unit-format/manually-translated-scaled-unit-format.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"manually-translated-scaled-unit-format.js","sourceRoot":"","sources":["../../../../../src/utilities/unit-format/scaled-unit-format/manually-translated-scaled-unit-format.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAExD;;GAEG;AACH,MAAM,OAAO,eAAe;IACxB,YACoB,QAAgB,EAChB,MAAc,EACd,MAAc;QAFd,aAAQ,GAAR,QAAQ,CAAQ;QAChB,WAAM,GAAN,MAAM,CAAQ;QACd,WAAM,GAAN,MAAM,CAAQ;IAC/B,CAAC;CACP;AAqBD;;GAEG;AACH,MAAM,OAAO,kCAAmC,SAAQ,gBAAgB;IAMpE,YACI,8BAA8D,EAC9D,EACI,gBAAgB,EAChB,gBAAgB,EACwB;QAE5C,KAAK,CAAC,8BAA8B,CAAC,CAAC;QACtC,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;YAC9B,MAAM,IAAI,KAAK,CACX,yDAAyD,CAC5D,CAAC;QACN,CAAC;QACD,IAAI,CAAC,WAAW,GAAG,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACrD,IAAI,CAAC,SAAS,GAAG,IAAI,IAAI,CAAC,YAAY,CAClC,IAAI,CAAC,MAAM,EACX,IAAI,CAAC,uBAAuB,CAC/B,CAAC;QACF,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,mBAAmB,CAC3C,gBAAgB,EAChB,IAAI,CAAC,MAAM,CACd,CAAC;QACF,IAAI,CAAC,gBAAgB,GAAG,gBAAgB,CAAC;IAC7C,CAAC;IAEM,MAAM,CAAC,aAAa,CACvB,yCAAoF;QAEpF,OAAO,CACH,8BAA8D,EAC5B,EAAE,CAAC,IAAI,kCAAkC,CAC3E,8BAA8B,EAC9B,yCAAyC,CAC5C,CAAC;IACN,CAAC;IAEM,MAAM,CAAC,KAAa;QACvB,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC/C,sEAAsE;QACtE,IAAI,IAAI,CAAC,gBAAgB,KAAK,EAAE,EAAE,CAAC;YAC/B,OAAO,GAAG,SAAS,IAAI,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,eAAe,CAAC,MAAM,EAAE,CAAC;QACjF,CAAC;QAED,wEAAwE;QACxE,6EAA6E;QAC7E,oHAAoH;QACpH,EAAE;QACF,sFAAsF;QACtF,iFAAiF;QACjF,wFAAwF;QACxF,kFAAkF;QAClF,mFAAmF;QACnF,qEAAqE;QACrE,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,KAAK;YACtD,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,QAAQ;YAC/B,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC;QAClC,OAAO,GAAG,SAAS,IAAI,SAAS,EAAE,CAAC;IACvC,CAAC;IAEO,mBAAmB,CACvB,gBAAkC,EAClC,MAAc;QAEd,MAAM,YAAY,GAAG,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,IAAI,CAAC,CAAC;QACrD,MAAM,QAAQ,GAAG,YAAY,CAAC,QAAQ,CAAC;QACvC,MAAM,MAAM,GAAG,YAAY,CAAC,MAAM,CAAC;QACnC,MAAM,iCAAiC,GAAG,MAAM;YAC5C,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,GAAG,QAAQ,IAAI,MAAM,EAAE,CAAC;YAC/C,CAAC,CAAC,SAAS,CAAC;QAChB,OAAO,CACH,iCAAiC;eAC9B,gBAAgB,CAAC,GAAG,CAAC,QAAQ,CAAC;eAC9B,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAE,CACjC,CAAC;IACN,CAAC;CACJ","sourcesContent":["/* eslint-disable max-classes-per-file /\nimport type { ScaledUnitFormatFactoryOptions } from '../scaled-unit/scaled-unit';\nimport { ScaledUnitFormat } from './scaled-unit-format';\n\n/\n Representations of a unit in a particular language\n /\nexport class UnitTranslation {\n public constructor(\n public readonly singular: string,\n public readonly plural: string,\n public readonly symbol: string\n ) {}\n}\n/\n A map of locales of string format \"[lang]\" or \"[lang]-[region]\", for example \"en\" and / or \"en-us\", to UnitTranslation objects\n /\nexport type UnitTranslations = ReadonlyMap<string, UnitTranslation>;\nexport interface ManuallyTranslatedScaledUnitFormatOptions {\n /\n Translations for the unit by locale string.\n * The locale strings must be of the form [lang] or [lang]-[region], for example \"en\" and / or \"en-us\".\n * Other subtags besides lang and region are not supported.\n * Translations for \"en\" must be provided.\n /\n readonly unitTranslations: UnitTranslations;\n /\n String for prefix of this scaled unit, for example \"k\" (for kilo-).\n * Assumed the same across languages.\n * Base unit must use \"\", i.e. empty string, as the scaled prefix text.\n /\n readonly scaledPrefixText: string;\n}\n\n/\n A formatter for units that are not supported by Intl.NumberFormat\n */\nexport class ManuallyTranslatedScaledUnitFormat extends ScaledUnitFormat {\n private readonly pluralRules: Intl.PluralRules;\n private readonly formatter: Intl.NumberFormat;\n private readonly unitTranslation: UnitTranslation;\n private readonly scaledPrefixText: string;\n\n protected constructor(\n scaledUnitFormatFactoryOptions: ScaledUnitFormatFactoryOptions,\n {\n unitTranslations,\n scaledPrefixText\n }: ManuallyTranslatedScaledUnitFormatOptions\n ) {\n super(scaledUnitFormatFactoryOptions);\n if (!unitTranslations.get('en')) {\n throw new Error(\n 'English translations must exist with locale string \"en\"'\n );\n }\n this.pluralRules = new Intl.PluralRules(this.locale);\n this.formatter = new Intl.NumberFormat(\n this.locale,\n this.intlNumberFormatOptions\n );\n this.unitTranslation = this.getTranslationToUse(\n unitTranslations,\n this.locale\n );\n this.scaledPrefixText = scaledPrefixText;\n }\n\n public static createFactory(\n manuallyTranslatedScaledUnitFormatOptions: ManuallyTranslatedScaledUnitFormatOptions\n ) {\n return (\n scaledUnitFormatFactoryOptions: ScaledUnitFormatFactoryOptions\n ): ManuallyTranslatedScaledUnitFormat => new ManuallyTranslatedScaledUnitFormat(\n scaledUnitFormatFactoryOptions,\n manuallyTranslatedScaledUnitFormatOptions\n );\n }\n\n public format(value: number): string {\n const formatted = this.formatter.format(value);\n // For non-base units (which are a scaled prefix text of empty string)\n if (this.scaledPrefixText !== '') {\n return `${formatted} ${this.scaledPrefixText}${this.unitTranslation.symbol}`;\n }\n\n // Some languages have more than two forms (singular/plural) of cardinal\n // numbers, but we are treating anything other than the 'one' form as plural.\n // See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/PluralRules#description\n //\n // Because PluralRules.select() takes a number (not a string), it cannot differentiate\n // between 1 and 1.0. When NumberFormat is configured to format with a set number\n // of fractional digits, those fractional digits can have an effect on the pluralization\n // of the unit. E.g. in English, it formats \"1 byte\" vs \"1.0 bytes\". Thus there is\n // sometimes an inconsistency between unit pluralization for the same number, based\n // on whether it's supported by NumberFormat, or manually translated.\n const unitLabel = this.pluralRules.select(value) === 'one'\n ? this.unitTranslation.singular\n : this.unitTranslation.plural;\n return `${formatted} ${unitLabel}`;\n }\n\n private getTranslationToUse(\n unitTranslations: UnitTranslations,\n locale: string\n ): UnitTranslation {\n const localeObject = new Intl.Locale(locale ?? 'en');\n const language = localeObject.language;\n const region = localeObject.region;\n const regionSpecificMatchedTranslations = region\n ? unitTranslations.get(`${language}-${region}`)\n : undefined;\n return (\n regionSpecificMatchedTranslations\n ?? unitTranslations.get(language)\n ?? unitTranslations.get('en')!\n );\n }\n}\n"]}
1	+ {"version":3,"file":"manually-translated-scaled-unit-format.js","sourceRoot":"","sources":["../../../../../src/utilities/unit-format/scaled-unit-format/manually-translated-scaled-unit-format.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAExD;;GAEG;AACH,MAAM,OAAO,eAAe;IACxB,YACoB,QAAgB,EAChB,MAAc,EACd,MAAc;QAFd,aAAQ,GAAR,QAAQ,CAAQ;QAChB,WAAM,GAAN,MAAM,CAAQ;QACd,WAAM,GAAN,MAAM,CAAQ;IAC/B,CAAC;CACP;AAqBD;;GAEG;AACH,MAAM,OAAO,kCAAmC,SAAQ,gBAAgB;IAMpE,YACI,8BAA8D,EAC9D,EACI,gBAAgB,EAChB,gBAAgB,EACwB;QAE5C,KAAK,CAAC,8BAA8B,CAAC,CAAC;QACtC,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;YAC9B,MAAM,IAAI,KAAK,CACX,yDAAyD,CAC5D,CAAC;QACN,CAAC;QACD,IAAI,CAAC,WAAW,GAAG,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACrD,IAAI,CAAC,SAAS,GAAG,IAAI,IAAI,CAAC,YAAY,CAClC,IAAI,CAAC,MAAM,EACX,IAAI,CAAC,uBAAuB,CAC/B,CAAC;QACF,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,mBAAmB,CAC3C,gBAAgB,EAChB,IAAI,CAAC,MAAM,CACd,CAAC;QACF,IAAI,CAAC,gBAAgB,GAAG,gBAAgB,CAAC;IAC7C,CAAC;IAEM,MAAM,CAAC,aAAa,CACvB,yCAAoF;QAEpF,OAAO,CACH,8BAA8D,EAC5B,EAAE,CAAC,IAAI,kCAAkC,CAC3E,8BAA8B,EAC9B,yCAAyC,CAC5C,CAAC;IACN,CAAC;IAEM,MAAM,CAAC,KAAa;QACvB,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC/C,sEAAsE;QACtE,IAAI,IAAI,CAAC,gBAAgB,KAAK,EAAE,EAAE,CAAC;YAC/B,OAAO,GAAG,SAAS,IAAI,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,eAAe,CAAC,MAAM,EAAE,CAAC;QACjF,CAAC;QAED,wEAAwE;QACxE,6EAA6E;QAC7E,oHAAoH;QACpH,EAAE;QACF,sFAAsF;QACtF,iFAAiF;QACjF,wFAAwF;QACxF,kFAAkF;QAClF,mFAAmF;QACnF,qEAAqE;QACrE,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,KAAK;YACtD,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,QAAQ;YAC/B,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC;QAClC,OAAO,GAAG,SAAS,IAAI,SAAS,EAAE,CAAC;IACvC,CAAC;IAEO,mBAAmB,CACvB,gBAAkC,EAClC,MAAc;QAEd,MAAM,YAAY,GAAG,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,IAAI,CAAC,CAAC;QACrD,MAAM,QAAQ,GAAG,YAAY,CAAC,QAAQ,CAAC;QACvC,MAAM,MAAM,GAAG,YAAY,CAAC,MAAM,CAAC;QACnC,MAAM,iCAAiC,GAAG,MAAM;YAC5C,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,GAAG,QAAQ,IAAI,MAAM,EAAE,CAAC;YAC/C,CAAC,CAAC,SAAS,CAAC;QAChB,OAAO,CACH,iCAAiC;eAC9B,gBAAgB,CAAC,GAAG,CAAC,QAAQ,CAAC;eAC9B,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAE,CACjC,CAAC;IACN,CAAC;CACJ;AACD,wCAAwC","sourcesContent":["/* eslint-disable max-classes-per-file /\nimport type { ScaledUnitFormatFactoryOptions } from '../scaled-unit/scaled-unit';\nimport { ScaledUnitFormat } from './scaled-unit-format';\n\n/\n Representations of a unit in a particular language\n /\nexport class UnitTranslation {\n public constructor(\n public readonly singular: string,\n public readonly plural: string,\n public readonly symbol: string\n ) {}\n}\n/\n A map of locales of string format \"[lang]\" or \"[lang]-[region]\", for example \"en\" and / or \"en-us\", to UnitTranslation objects\n /\nexport type UnitTranslations = ReadonlyMap<string, UnitTranslation>;\nexport interface ManuallyTranslatedScaledUnitFormatOptions {\n /\n Translations for the unit by locale string.\n * The locale strings must be of the form [lang] or [lang]-[region], for example \"en\" and / or \"en-us\".\n * Other subtags besides lang and region are not supported.\n * Translations for \"en\" must be provided.\n /\n readonly unitTranslations: UnitTranslations;\n /\n String for prefix of this scaled unit, for example \"k\" (for kilo-).\n * Assumed the same across languages.\n * Base unit must use \"\", i.e. empty string, as the scaled prefix text.\n /\n readonly scaledPrefixText: string;\n}\n\n/\n A formatter for units that are not supported by Intl.NumberFormat\n /\nexport class ManuallyTranslatedScaledUnitFormat extends ScaledUnitFormat {\n private readonly pluralRules: Intl.PluralRules;\n private readonly formatter: Intl.NumberFormat;\n private readonly unitTranslation: UnitTranslation;\n private readonly scaledPrefixText: string;\n\n protected constructor(\n scaledUnitFormatFactoryOptions: ScaledUnitFormatFactoryOptions,\n {\n unitTranslations,\n scaledPrefixText\n }: ManuallyTranslatedScaledUnitFormatOptions\n ) {\n super(scaledUnitFormatFactoryOptions);\n if (!unitTranslations.get('en')) {\n throw new Error(\n 'English translations must exist with locale string \"en\"'\n );\n }\n this.pluralRules = new Intl.PluralRules(this.locale);\n this.formatter = new Intl.NumberFormat(\n this.locale,\n this.intlNumberFormatOptions\n );\n this.unitTranslation = this.getTranslationToUse(\n unitTranslations,\n this.locale\n );\n this.scaledPrefixText = scaledPrefixText;\n }\n\n public static createFactory(\n manuallyTranslatedScaledUnitFormatOptions: ManuallyTranslatedScaledUnitFormatOptions\n ) {\n return (\n scaledUnitFormatFactoryOptions: ScaledUnitFormatFactoryOptions\n ): ManuallyTranslatedScaledUnitFormat => new ManuallyTranslatedScaledUnitFormat(\n scaledUnitFormatFactoryOptions,\n manuallyTranslatedScaledUnitFormatOptions\n );\n }\n\n public format(value: number): string {\n const formatted = this.formatter.format(value);\n // For non-base units (which are a scaled prefix text of empty string)\n if (this.scaledPrefixText !== '') {\n return `${formatted} ${this.scaledPrefixText}${this.unitTranslation.symbol}`;\n }\n\n // Some languages have more than two forms (singular/plural) of cardinal\n // numbers, but we are treating anything other than the 'one' form as plural.\n // See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/PluralRules#description\n //\n // Because PluralRules.select() takes a number (not a string), it cannot differentiate\n // between 1 and 1.0. When NumberFormat is configured to format with a set number\n // of fractional digits, those fractional digits can have an effect on the pluralization\n // of the unit. E.g. in English, it formats \"1 byte\" vs \"1.0 bytes\". Thus there is\n // sometimes an inconsistency between unit pluralization for the same number, based\n // on whether it's supported by NumberFormat, or manually translated.\n const unitLabel = this.pluralRules.select(value) === 'one'\n ? this.unitTranslation.singular\n : this.unitTranslation.plural;\n return `${formatted} ${unitLabel}`;\n }\n\n private getTranslationToUse(\n unitTranslations: UnitTranslations,\n locale: string\n ): UnitTranslation {\n const localeObject = new Intl.Locale(locale ?? 'en');\n const language = localeObject.language;\n const region = localeObject.region;\n const regionSpecificMatchedTranslations = region\n ? unitTranslations.get(`${language}-${region}`)\n : undefined;\n return (\n regionSpecificMatchedTranslations\n ?? unitTranslations.get(language)\n ?? unitTranslations.get('en')!\n );\n }\n}\n/ eslint-enable max-classes-per-file */\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@ni/nimble-components",
-  "version": "30.0.8",
+  "version": "30.1.0",
   "description": "Styled web components for the NI Nimble Design System",
   "scripts": {
     "build": "npm run generate-icons && npm run generate-workers && npm run build-components && npm run bundle-components && npm run generate-scss",
@@ -105,7 +105,7 @@
   },
   "devDependencies": {
     "@ni-private/eslint-config-nimble": "*",
-    "@ni/jasmine-parameterized": "^0.3.1",
+    "@ni/jasmine-parameterized": "^1.0.0",
     "@rollup/plugin-commonjs": "^25.0.7",
     "@rollup/plugin-node-resolve": "^15.0.1",
     "@rollup/plugin-replace": "^5.0.1",