@ni/nimble-components 21.10.2 → 22.0.1

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.
@@ -83,6 +83,10 @@ export const styles = css `
83
83
  color: ${linkProminentDisabledFontColor};
84
84
  }
85
85
 
86
+ .content {
87
+ pointer-events: none;
88
+ }
89
+
86
90
  [part='end'] {
87
91
  display: none;
88
92
  }
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EACH,2BAA2B,EAC3B,mBAAmB,EACnB,4BAA4B,EAC5B,qBAAqB,EACrB,QAAQ,EACR,aAAa,EACb,8BAA8B,EAC9B,sBAAsB,EACzB,MAAM,iCAAiC,CAAC;AAEzC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,QAAQ,CAAC;;;;gBAIP,QAAQ;;;;;;;;;;;;iBAYP,aAAa;;;;cAIhB,YAAY;;;qCAGW,aAAa;;;;iBAIjC,mBAAmB;;;;cAItB,YAAY;qCACW,mBAAmB;;;;iBAIvC,qBAAqB;;;;;iBAKrB,2BAA2B;;;;;;;;;;;wCAWJ,YAAY;;;;;;;;;iBASnC,sBAAsB;;;;iBAItB,4BAA4B;;;8CAGC,YAAY;qCACrB,sBAAsB;;;8CAGb,YAAY;qCACrB,4BAA4B;;;;iBAIhD,8BAA8B;;;;;;CAM9C,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\nimport { focusVisible } from '../utilities/style/focus';\nimport {\n linkActiveDisabledFontColor,\n linkActiveFontColor,\n linkActiveProminentFontColor,\n linkDisabledFontColor,\n linkFont,\n linkFontColor,\n linkProminentDisabledFontColor,\n linkProminentFontColor\n} from '../theme-provider/design-tokens';\n\nexport const styles = css`\n ${display('inline')}\n\n :host {\n box-sizing: border-box;\n font: ${linkFont};\n }\n\n .top-container {\n display: contents;\n }\n\n [part='start'] {\n display: none;\n }\n\n .control {\n color: ${linkFontColor};\n text-decoration: underline;\n }\n\n .control${focusVisible} {\n display: inline;\n outline: none;\n box-shadow: inset 0px -1px ${linkFontColor};\n }\n\n .control:active {\n color: ${linkActiveFontColor};\n text-decoration: underline;\n }\n\n .control${focusVisible}:active {\n box-shadow: inset 0px -1px ${linkActiveFontColor};\n }\n\n .control:not(:any-link) {\n color: ${linkDisabledFontColor};\n text-decoration: none;\n }\n\n .control:not(:any-link):active {\n color: ${linkActiveDisabledFontColor};\n }\n\n :host([underline-hidden]) .control {\n text-decoration: none;\n }\n\n :host([underline-hidden]) .control:hover {\n text-decoration: underline;\n }\n\n :host([underline-hidden]) .control${focusVisible} {\n text-decoration: underline;\n }\n\n :host([underline-hidden]) .control:not(:any-link) {\n text-decoration: none;\n }\n\n :host([appearance='prominent']) .control {\n color: ${linkProminentFontColor};\n }\n\n :host([appearance='prominent']) .control:active {\n color: ${linkActiveProminentFontColor};\n }\n\n :host([appearance='prominent']) .control${focusVisible} {\n box-shadow: inset 0px -1px ${linkProminentFontColor};\n }\n\n :host([appearance='prominent']) .control${focusVisible}:active {\n box-shadow: inset 0px -1px ${linkActiveProminentFontColor};\n }\n\n :host([appearance='prominent']) .control:not(:any-link) {\n color: ${linkProminentDisabledFontColor};\n }\n\n [part='end'] {\n display: none;\n }\n`;\n"]}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EACH,2BAA2B,EAC3B,mBAAmB,EACnB,4BAA4B,EAC5B,qBAAqB,EACrB,QAAQ,EACR,aAAa,EACb,8BAA8B,EAC9B,sBAAsB,EACzB,MAAM,iCAAiC,CAAC;AAEzC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,QAAQ,CAAC;;;;gBAIP,QAAQ;;;;;;;;;;;;iBAYP,aAAa;;;;cAIhB,YAAY;;;qCAGW,aAAa;;;;iBAIjC,mBAAmB;;;;cAItB,YAAY;qCACW,mBAAmB;;;;iBAIvC,qBAAqB;;;;;iBAKrB,2BAA2B;;;;;;;;;;;wCAWJ,YAAY;;;;;;;;;iBASnC,sBAAsB;;;;iBAItB,4BAA4B;;;8CAGC,YAAY;qCACrB,sBAAsB;;;8CAGb,YAAY;qCACrB,4BAA4B;;;;iBAIhD,8BAA8B;;;;;;;;;;CAU9C,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\nimport { focusVisible } from '../utilities/style/focus';\nimport {\n linkActiveDisabledFontColor,\n linkActiveFontColor,\n linkActiveProminentFontColor,\n linkDisabledFontColor,\n linkFont,\n linkFontColor,\n linkProminentDisabledFontColor,\n linkProminentFontColor\n} from '../theme-provider/design-tokens';\n\nexport const styles = css`\n ${display('inline')}\n\n :host {\n box-sizing: border-box;\n font: ${linkFont};\n }\n\n .top-container {\n display: contents;\n }\n\n [part='start'] {\n display: none;\n }\n\n .control {\n color: ${linkFontColor};\n text-decoration: underline;\n }\n\n .control${focusVisible} {\n display: inline;\n outline: none;\n box-shadow: inset 0px -1px ${linkFontColor};\n }\n\n .control:active {\n color: ${linkActiveFontColor};\n text-decoration: underline;\n }\n\n .control${focusVisible}:active {\n box-shadow: inset 0px -1px ${linkActiveFontColor};\n }\n\n .control:not(:any-link) {\n color: ${linkDisabledFontColor};\n text-decoration: none;\n }\n\n .control:not(:any-link):active {\n color: ${linkActiveDisabledFontColor};\n }\n\n :host([underline-hidden]) .control {\n text-decoration: none;\n }\n\n :host([underline-hidden]) .control:hover {\n text-decoration: underline;\n }\n\n :host([underline-hidden]) .control${focusVisible} {\n text-decoration: underline;\n }\n\n :host([underline-hidden]) .control:not(:any-link) {\n text-decoration: none;\n }\n\n :host([appearance='prominent']) .control {\n color: ${linkProminentFontColor};\n }\n\n :host([appearance='prominent']) .control:active {\n color: ${linkActiveProminentFontColor};\n }\n\n :host([appearance='prominent']) .control${focusVisible} {\n box-shadow: inset 0px -1px ${linkProminentFontColor};\n }\n\n :host([appearance='prominent']) .control${focusVisible}:active {\n box-shadow: inset 0px -1px ${linkActiveProminentFontColor};\n }\n\n :host([appearance='prominent']) .control:not(:any-link) {\n color: ${linkProminentDisabledFontColor};\n }\n\n .content {\n pointer-events: none;\n }\n\n [part='end'] {\n display: none;\n }\n`;\n"]}
@@ -7,5 +7,17 @@ export const styles = css `
7
7
  .control {
8
8
  text-decoration: none;
9
9
  }
10
+
11
+ [part='start'] {
12
+ pointer-events: none;
13
+ }
14
+
15
+ .content {
16
+ pointer-events: none;
17
+ }
18
+
19
+ [part='end'] {
20
+ pointer-events: none;
21
+ }
10
22
  `;
11
23
  //# sourceMappingURL=styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-button/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACH,6BAA6B,EAC7B,MAAM,IAAI,YAAY,EACzB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,YAAY;MACZ,6BAA6B;;;;;CAKlC,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport {\n buttonAppearanceVariantStyles,\n styles as buttonStyles\n} from '../patterns/button/styles';\n\nexport const styles = css`\n ${buttonStyles}\n ${buttonAppearanceVariantStyles}\n\n .control {\n text-decoration: none;\n }\n`;\n"]}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-button/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACH,6BAA6B,EAC7B,MAAM,IAAI,YAAY,EACzB,MAAM,2BAA2B,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,YAAY;MACZ,6BAA6B;;;;;;;;;;;;;;;;;CAiBlC,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport {\n buttonAppearanceVariantStyles,\n styles as buttonStyles\n} from '../patterns/button/styles';\n\nexport const styles = css`\n ${buttonStyles}\n ${buttonAppearanceVariantStyles}\n\n .control {\n text-decoration: none;\n }\n\n [part='start'] {\n pointer-events: none;\n }\n\n .content {\n pointer-events: none;\n }\n\n [part='end'] {\n pointer-events: none;\n }\n`;\n"]}
@@ -57,6 +57,7 @@ export const styles = css `
57
57
 
58
58
  [part='start'] {
59
59
  display: contents;
60
+ pointer-events: none;
60
61
  }
61
62
 
62
63
  slot[name='start']::slotted(*) {
@@ -69,6 +70,10 @@ export const styles = css `
69
70
  grid-column: 1;
70
71
  }
71
72
 
73
+ .content {
74
+ pointer-events: none;
75
+ }
76
+
72
77
  :host(.indent-1) .content {
73
78
  grid-column: 2;
74
79
  }
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-menu-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,OAAO,EACH,qBAAqB,EACrB,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,aAAa,EACb,cAAc,EACd,iBAAiB,EACjB,SAAS,EACT,QAAQ,EACX,MAAM,iCAAiC,CAAC;AAEzC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;;;gBAGL,QAAQ;;;;6BAIK,gBAAgB;;;;;sBAKvB,cAAc;;;;sBAId,iBAAiB;;;;;;;;;;;;kBAYrB,aAAa;;;;;;;;iBAQd,aAAa;;;;;;;;iBAQb,qBAAqB;;;;;;iCAML,QAAQ;;;;;;;;UAQ/B,SAAS,CAAC,iBAAiB;iBACpB,QAAQ;kBACP,QAAQ;;;;;;;;;;;;;;CAczB,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\n\nimport {\n bodyDisabledFontColor,\n bodyFont,\n bodyFontColor,\n borderHoverColor,\n controlHeight,\n fillHoverColor,\n fillSelectedColor,\n iconColor,\n iconSize\n} from '../theme-provider/design-tokens';\n\nexport const styles = css`\n ${display('grid')}\n\n :host {\n font: ${bodyFont};\n }\n\n :host(:focus-within:not(:active)) {\n outline: 2px solid ${borderHoverColor};\n outline-offset: -2px;\n }\n\n :host(:hover) {\n background: ${fillHoverColor};\n }\n\n :host(:active) {\n background: ${fillSelectedColor};\n }\n\n :host([disabled]) {\n background: transparent;\n }\n\n a {\n display: grid;\n contain: layout;\n overflow: visible;\n box-sizing: border-box;\n height: ${controlHeight};\n grid-template-columns: 1fr;\n column-gap: 8px;\n grid-template-rows: 1fr;\n justify-items: start;\n align-items: center;\n margin: 0 0;\n white-space: nowrap;\n color: ${bodyFontColor};\n fill: currentcolor;\n cursor: pointer;\n text-decoration: none;\n outline: none;\n }\n\n :host([disabled]) a {\n color: ${bodyDisabledFontColor};\n fill: currentcolor;\n cursor: default;\n }\n\n :host(.indent-1) a {\n grid-template-columns: ${iconSize} 1fr;\n }\n\n [part='start'] {\n display: contents;\n }\n\n slot[name='start']::slotted(*) {\n ${iconColor.cssCustomProperty}: currentcolor;\n width: ${iconSize};\n height: ${iconSize};\n }\n\n :host(.indent-1) [part='start'] {\n grid-column: 1;\n }\n\n :host(.indent-1) .content {\n grid-column: 2;\n }\n\n [part='end'] {\n display: none;\n }\n`;\n"]}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-menu-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,OAAO,EACH,qBAAqB,EACrB,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,aAAa,EACb,cAAc,EACd,iBAAiB,EACjB,SAAS,EACT,QAAQ,EACX,MAAM,iCAAiC,CAAC;AAEzC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;;;gBAGL,QAAQ;;;;6BAIK,gBAAgB;;;;;sBAKvB,cAAc;;;;sBAId,iBAAiB;;;;;;;;;;;;kBAYrB,aAAa;;;;;;;;iBAQd,aAAa;;;;;;;;iBAQb,qBAAqB;;;;;;iCAML,QAAQ;;;;;;;;;UAS/B,SAAS,CAAC,iBAAiB;iBACpB,QAAQ;kBACP,QAAQ;;;;;;;;;;;;;;;;;;CAkBzB,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\n\nimport {\n bodyDisabledFontColor,\n bodyFont,\n bodyFontColor,\n borderHoverColor,\n controlHeight,\n fillHoverColor,\n fillSelectedColor,\n iconColor,\n iconSize\n} from '../theme-provider/design-tokens';\n\nexport const styles = css`\n ${display('grid')}\n\n :host {\n font: ${bodyFont};\n }\n\n :host(:focus-within:not(:active)) {\n outline: 2px solid ${borderHoverColor};\n outline-offset: -2px;\n }\n\n :host(:hover) {\n background: ${fillHoverColor};\n }\n\n :host(:active) {\n background: ${fillSelectedColor};\n }\n\n :host([disabled]) {\n background: transparent;\n }\n\n a {\n display: grid;\n contain: layout;\n overflow: visible;\n box-sizing: border-box;\n height: ${controlHeight};\n grid-template-columns: 1fr;\n column-gap: 8px;\n grid-template-rows: 1fr;\n justify-items: start;\n align-items: center;\n margin: 0 0;\n white-space: nowrap;\n color: ${bodyFontColor};\n fill: currentcolor;\n cursor: pointer;\n text-decoration: none;\n outline: none;\n }\n\n :host([disabled]) a {\n color: ${bodyDisabledFontColor};\n fill: currentcolor;\n cursor: default;\n }\n\n :host(.indent-1) a {\n grid-template-columns: ${iconSize} 1fr;\n }\n\n [part='start'] {\n display: contents;\n pointer-events: none;\n }\n\n slot[name='start']::slotted(*) {\n ${iconColor.cssCustomProperty}: currentcolor;\n width: ${iconSize};\n height: ${iconSize};\n }\n\n :host(.indent-1) [part='start'] {\n grid-column: 1;\n }\n\n .content {\n pointer-events: none;\n }\n\n :host(.indent-1) .content {\n grid-column: 2;\n }\n\n [part='end'] {\n display: none;\n }\n`;\n"]}
@@ -39,6 +39,7 @@ export const styles = css `
39
39
  }
40
40
 
41
41
  slot:not([name]) {
42
+ pointer-events: none;
42
43
  display: block;
43
44
  padding: ${mediumPadding} ${standardPadding}
44
45
  calc(${mediumPadding} - ${borderWidth});
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-tab/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EACH,qBAAqB,EACrB,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,eAAe,EACf,aAAa,EACb,cAAc,EACd,sBAAsB,EACtB,UAAU,EACV,aAAa,EACb,eAAe,EAClB,MAAM,iCAAiC,CAAC;AAEzC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;;;gBAKZ,eAAe;kBACb,aAAa;iBACd,aAAa;;;;;;;;;;;4BAWF,cAAc;;;;4BAId,sBAAsB;;;;;;;;;iBASjC,qBAAqB;;;;;;mBAMnB,aAAa,IAAI,eAAe;mBAChC,aAAa,MAAM,WAAW;;;;;;;;;;;;yBAYxB,gBAAgB;;4BAEb,UAAU;;;;;;;;;OAS/B,YAAY;;;;;;;;;;;;;;;;;;;;yBAoBM,gBAAgB;;4BAEb,UAAU;;;;;;;;;OAS/B,YAAY;;;;;;;;;;;oCAWiB,gBAAgB;;;;;;;;;;CAUnD,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\nimport { focusVisible } from '../utilities/style/focus';\nimport {\n bodyDisabledFontColor,\n bodyFontColor,\n borderHoverColor,\n borderWidth,\n buttonLabelFont,\n controlHeight,\n fillHoverColor,\n fillHoverSelectedColor,\n smallDelay,\n mediumPadding,\n standardPadding\n} from '../theme-provider/design-tokens';\n\nexport const styles = css`\n ${display('inline-flex')}\n\n :host {\n position: relative;\n box-sizing: border-box;\n font: ${buttonLabelFont};\n height: ${controlHeight};\n color: ${bodyFontColor};\n align-items: center;\n justify-content: center;\n cursor: pointer;\n --ni-private-active-indicator-width: 2px;\n --ni-private-focus-indicator-width: 1px;\n --ni-private-indicator-lines-gap: 1px;\n --ni-private-focus-indicator-inset-width: 3px;\n }\n\n :host(:hover) {\n background-color: ${fillHoverColor};\n }\n\n :host(:hover[aria-current]) {\n background-color: ${fillHoverSelectedColor};\n }\n\n :host(:active) {\n background: none;\n }\n\n :host([disabled]) {\n cursor: default;\n color: ${bodyDisabledFontColor};\n background: none;\n }\n\n slot:not([name]) {\n display: block;\n padding: ${mediumPadding} ${standardPadding}\n calc(${mediumPadding} - ${borderWidth});\n }\n\n a::before {\n content: '';\n position: absolute;\n bottom: calc(\n var(--ni-private-active-indicator-width) +\n var(--ni-private-indicator-lines-gap)\n );\n width: 0px;\n height: 0px;\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 a::before {\n transition-duration: 0s;\n }\n }\n\n a${focusVisible}::before {\n width: calc(100% - 2 * var(--ni-private-focus-indicator-inset-width));\n }\n\n a {\n display: inline-flex;\n text-decoration: none;\n color: inherit;\n cursor: inherit;\n outline: none;\n align-items: center;\n justify-content: center;\n }\n\n a::after {\n content: '';\n position: absolute;\n bottom: 0px;\n width: 0px;\n height: 0px;\n border-bottom: ${borderHoverColor}\n var(--ni-private-active-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n a::after {\n transition-duration: 0s;\n }\n }\n\n a${focusVisible}::after {\n width: 100%;\n border-bottom-width: var(--ni-private-focus-indicator-width);\n }\n\n :host([aria-current]) a::after {\n width: 100%;\n border-bottom-width: var(--ni-private-active-indicator-width);\n }\n\n :host([disabled][aria-current]) a::after {\n border-bottom-color: rgba(${borderHoverColor}, 0.3);\n }\n\n [part='start'] {\n display: none;\n }\n\n [part='end'] {\n display: none;\n }\n`;\n"]}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-tab/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EACH,qBAAqB,EACrB,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,eAAe,EACf,aAAa,EACb,cAAc,EACd,sBAAsB,EACtB,UAAU,EACV,aAAa,EACb,eAAe,EAClB,MAAM,iCAAiC,CAAC;AAEzC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;;;gBAKZ,eAAe;kBACb,aAAa;iBACd,aAAa;;;;;;;;;;;4BAWF,cAAc;;;;4BAId,sBAAsB;;;;;;;;;iBASjC,qBAAqB;;;;;;;mBAOnB,aAAa,IAAI,eAAe;mBAChC,aAAa,MAAM,WAAW;;;;;;;;;;;;yBAYxB,gBAAgB;;4BAEb,UAAU;;;;;;;;;OAS/B,YAAY;;;;;;;;;;;;;;;;;;;;yBAoBM,gBAAgB;;4BAEb,UAAU;;;;;;;;;OAS/B,YAAY;;;;;;;;;;;oCAWiB,gBAAgB;;;;;;;;;;CAUnD,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\nimport { focusVisible } from '../utilities/style/focus';\nimport {\n bodyDisabledFontColor,\n bodyFontColor,\n borderHoverColor,\n borderWidth,\n buttonLabelFont,\n controlHeight,\n fillHoverColor,\n fillHoverSelectedColor,\n smallDelay,\n mediumPadding,\n standardPadding\n} from '../theme-provider/design-tokens';\n\nexport const styles = css`\n ${display('inline-flex')}\n\n :host {\n position: relative;\n box-sizing: border-box;\n font: ${buttonLabelFont};\n height: ${controlHeight};\n color: ${bodyFontColor};\n align-items: center;\n justify-content: center;\n cursor: pointer;\n --ni-private-active-indicator-width: 2px;\n --ni-private-focus-indicator-width: 1px;\n --ni-private-indicator-lines-gap: 1px;\n --ni-private-focus-indicator-inset-width: 3px;\n }\n\n :host(:hover) {\n background-color: ${fillHoverColor};\n }\n\n :host(:hover[aria-current]) {\n background-color: ${fillHoverSelectedColor};\n }\n\n :host(:active) {\n background: none;\n }\n\n :host([disabled]) {\n cursor: default;\n color: ${bodyDisabledFontColor};\n background: none;\n }\n\n slot:not([name]) {\n pointer-events: none;\n display: block;\n padding: ${mediumPadding} ${standardPadding}\n calc(${mediumPadding} - ${borderWidth});\n }\n\n a::before {\n content: '';\n position: absolute;\n bottom: calc(\n var(--ni-private-active-indicator-width) +\n var(--ni-private-indicator-lines-gap)\n );\n width: 0px;\n height: 0px;\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 a::before {\n transition-duration: 0s;\n }\n }\n\n a${focusVisible}::before {\n width: calc(100% - 2 * var(--ni-private-focus-indicator-inset-width));\n }\n\n a {\n display: inline-flex;\n text-decoration: none;\n color: inherit;\n cursor: inherit;\n outline: none;\n align-items: center;\n justify-content: center;\n }\n\n a::after {\n content: '';\n position: absolute;\n bottom: 0px;\n width: 0px;\n height: 0px;\n border-bottom: ${borderHoverColor}\n var(--ni-private-active-indicator-width) solid;\n transition: width ${smallDelay} ease-in;\n }\n\n @media (prefers-reduced-motion) {\n a::after {\n transition-duration: 0s;\n }\n }\n\n a${focusVisible}::after {\n width: 100%;\n border-bottom-width: var(--ni-private-focus-indicator-width);\n }\n\n :host([aria-current]) a::after {\n width: 100%;\n border-bottom-width: var(--ni-private-active-indicator-width);\n }\n\n :host([disabled][aria-current]) a::after {\n border-bottom-color: rgba(${borderHoverColor}, 0.3);\n }\n\n [part='start'] {\n display: none;\n }\n\n [part='end'] {\n display: none;\n }\n`;\n"]}
@@ -84,6 +84,7 @@ export const styles = css `
84
84
  /* this rule keeps children without an icon text aligned with parents */ ''}
85
85
  [part="start"] {
86
86
  width: ${iconSize};
87
+ pointer-events: none;
87
88
  }
88
89
 
89
90
  ${ /* the start class is applied when the corresponding slot is filled */''}
@@ -99,6 +100,10 @@ export const styles = css `
99
100
  height: ${iconSize};
100
101
  }
101
102
 
103
+ .content {
104
+ pointer-events: none;
105
+ }
106
+
102
107
  [part='end'] {
103
108
  display: none;
104
109
  }
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-tree-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,cAAc,EACd,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,QAAQ,EACR,cAAc,EACd,sBAAsB,EACtB,iBAAiB,EACjB,YAAY,EACZ,qBAAqB,EACrB,SAAS,EACZ,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAEhE,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,OAAO,CAAC;;;UAGZ;AACE,yEAAyE,CAAC,EAC9E;uBACe,cAAc;uBACd,cAAc;;;;iBAIpB,aAAa;;;;;;iBAMb,qBAAqB;;;;;;;;;;cAUxB,YAAY;kCACQ,WAAW,IAAI,gBAAgB;mBAC9C,WAAW,UAAU,gBAAgB;;;;;;;;uBAQjC,QAAQ;;;;;sBAKT,cAAc;;;;;;;;sBAQd,iBAAiB;;;;sBAIjB,sBAAsB;;;;;;;;;;;;;;;;;qBAiBvB,YAAY;UACvB,cAAc;;+BAEO,QAAQ;;;MAGjC;AACE,wEAAwE,CAAC,EAC7E;;iBAEa,QAAQ;;;MAGnB,CAAA,sEAAuE,EAAE;;;+BAGhD,QAAQ;6BACV,QAAQ;;;;UAI3B,SAAS,CAAC,iBAAiB;iBACpB,QAAQ;kBACP,QAAQ;;;;;;CAMzB,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\nimport {\n bodyFontFamily,\n bodyFontWeight,\n bodyFontColor,\n borderHoverColor,\n borderWidth,\n iconSize,\n fillHoverColor,\n fillHoverSelectedColor,\n fillSelectedColor,\n bodyFontSize,\n bodyDisabledFontColor,\n iconColor\n} from '../theme-provider/design-tokens';\nimport { focusVisible } from '../utilities/style/focus';\nimport { userSelectNone } from '../utilities/style/user-select';\n\nexport const styles = css`\n ${display('block')}\n\n :host {\n ${\n /* don't set font-size here or else it overrides what we set on .items */ ''\n }\n font-family: ${bodyFontFamily};\n font-weight: ${bodyFontWeight};\n contain: content;\n position: relative;\n outline: none;\n color: ${bodyFontColor};\n cursor: pointer;\n --ni-private-tree-item-nested-width: 0;\n }\n\n :host([disabled]) {\n color: ${bodyDisabledFontColor};\n cursor: default;\n }\n\n .control {\n display: flex;\n text-decoration: none;\n color: inherit;\n }\n\n .control${focusVisible} {\n box-shadow: 0px 0px 0px ${borderWidth} ${borderHoverColor} inset;\n outline: ${borderWidth} solid ${borderHoverColor};\n outline-offset: -2px;\n }\n\n .positioning-region {\n display: flex;\n position: relative;\n box-sizing: border-box;\n height: calc(${iconSize} * 2);\n width: 100%;\n }\n\n .positioning-region:hover {\n background: ${fillHoverColor};\n }\n\n :host([disabled]) .positioning-region:hover {\n background: transparent;\n }\n\n :host([selected]) .positioning-region {\n background: ${fillSelectedColor};\n }\n\n :host([selected]) .positioning-region:hover {\n background: ${fillHoverSelectedColor};\n }\n\n .positioning-region::before {\n content: '';\n display: block;\n width: var(--ni-private-tree-item-nested-width);\n flex-shrink: 0;\n }\n\n .content-region {\n display: inline-flex;\n align-items: center;\n white-space: nowrap;\n width: 100%;\n padding-left: 10px;\n font: inherit;\n font-size: ${bodyFontSize};\n ${userSelectNone}\n position: relative;\n margin-inline-start: ${iconSize};\n }\n\n ${\n /* this rule keeps children without an icon text aligned with parents */ ''\n }\n [part=\"start\"] {\n width: ${iconSize};\n }\n\n ${/* the start class is applied when the corresponding slot is filled */ ''}\n .start {\n display: flex;\n margin-inline-start: ${iconSize};\n margin-inline-end: ${iconSize};\n }\n\n slot[name='start']::slotted(*) {\n ${iconColor.cssCustomProperty}: currentcolor;\n width: ${iconSize};\n height: ${iconSize};\n }\n\n [part='end'] {\n display: none;\n }\n`;\n"]}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-tree-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,cAAc,EACd,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,QAAQ,EACR,cAAc,EACd,sBAAsB,EACtB,iBAAiB,EACjB,YAAY,EACZ,qBAAqB,EACrB,SAAS,EACZ,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAEhE,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,OAAO,CAAC;;;UAGZ;AACE,yEAAyE,CAAC,EAC9E;uBACe,cAAc;uBACd,cAAc;;;;iBAIpB,aAAa;;;;;;iBAMb,qBAAqB;;;;;;;;;;cAUxB,YAAY;kCACQ,WAAW,IAAI,gBAAgB;mBAC9C,WAAW,UAAU,gBAAgB;;;;;;;;uBAQjC,QAAQ;;;;;sBAKT,cAAc;;;;;;;;sBAQd,iBAAiB;;;;sBAIjB,sBAAsB;;;;;;;;;;;;;;;;;qBAiBvB,YAAY;UACvB,cAAc;;+BAEO,QAAQ;;;MAGjC;AACE,wEAAwE,CAAC,EAC7E;;iBAEa,QAAQ;;;;MAInB,CAAA,sEAAuE,EAAE;;;+BAGhD,QAAQ;6BACV,QAAQ;;;;UAI3B,SAAS,CAAC,iBAAiB;iBACpB,QAAQ;kBACP,QAAQ;;;;;;;;;;CAUzB,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\nimport {\n bodyFontFamily,\n bodyFontWeight,\n bodyFontColor,\n borderHoverColor,\n borderWidth,\n iconSize,\n fillHoverColor,\n fillHoverSelectedColor,\n fillSelectedColor,\n bodyFontSize,\n bodyDisabledFontColor,\n iconColor\n} from '../theme-provider/design-tokens';\nimport { focusVisible } from '../utilities/style/focus';\nimport { userSelectNone } from '../utilities/style/user-select';\n\nexport const styles = css`\n ${display('block')}\n\n :host {\n ${\n /* don't set font-size here or else it overrides what we set on .items */ ''\n }\n font-family: ${bodyFontFamily};\n font-weight: ${bodyFontWeight};\n contain: content;\n position: relative;\n outline: none;\n color: ${bodyFontColor};\n cursor: pointer;\n --ni-private-tree-item-nested-width: 0;\n }\n\n :host([disabled]) {\n color: ${bodyDisabledFontColor};\n cursor: default;\n }\n\n .control {\n display: flex;\n text-decoration: none;\n color: inherit;\n }\n\n .control${focusVisible} {\n box-shadow: 0px 0px 0px ${borderWidth} ${borderHoverColor} inset;\n outline: ${borderWidth} solid ${borderHoverColor};\n outline-offset: -2px;\n }\n\n .positioning-region {\n display: flex;\n position: relative;\n box-sizing: border-box;\n height: calc(${iconSize} * 2);\n width: 100%;\n }\n\n .positioning-region:hover {\n background: ${fillHoverColor};\n }\n\n :host([disabled]) .positioning-region:hover {\n background: transparent;\n }\n\n :host([selected]) .positioning-region {\n background: ${fillSelectedColor};\n }\n\n :host([selected]) .positioning-region:hover {\n background: ${fillHoverSelectedColor};\n }\n\n .positioning-region::before {\n content: '';\n display: block;\n width: var(--ni-private-tree-item-nested-width);\n flex-shrink: 0;\n }\n\n .content-region {\n display: inline-flex;\n align-items: center;\n white-space: nowrap;\n width: 100%;\n padding-left: 10px;\n font: inherit;\n font-size: ${bodyFontSize};\n ${userSelectNone}\n position: relative;\n margin-inline-start: ${iconSize};\n }\n\n ${\n /* this rule keeps children without an icon text aligned with parents */ ''\n }\n [part=\"start\"] {\n width: ${iconSize};\n pointer-events: none;\n }\n\n ${/* the start class is applied when the corresponding slot is filled */ ''}\n .start {\n display: flex;\n margin-inline-start: ${iconSize};\n margin-inline-end: ${iconSize};\n }\n\n slot[name='start']::slotted(*) {\n ${iconColor.cssCustomProperty}: currentcolor;\n width: ${iconSize};\n height: ${iconSize};\n }\n\n .content {\n pointer-events: none;\n }\n\n [part='end'] {\n display: none;\n }\n`;\n"]}
@@ -5,7 +5,7 @@ import { iconInfoTag } from '../icons/info';
5
5
  import { iconTriangleFilledTag } from '../icons/triangle-filled';
6
6
  import { iconXmarkTag } from '../icons/xmark';
7
7
  import { BannerSeverity } from './types';
8
- import { errorIconLabel, informationIconLabel, popupDismissLabel, warningIconLabel } from '../label-provider/core/label-tokens';
8
+ import { popupIconErrorLabel, popupIconInformationLabel, popupDismissLabel, popupIconWarningLabel } from '../label-provider/core/label-tokens';
9
9
  // prettier-ignore
10
10
  export const template = html `
11
11
  <div class="container"
@@ -33,13 +33,13 @@ export const template = html `
33
33
  >
34
34
  <div class="icon">
35
35
  ${when(x => x.severity === BannerSeverity.error, html `
36
- <${iconExclamationMarkTag} role="img" aria-label="${x => errorIconLabel.getValueFor(x)}"></${iconExclamationMarkTag}>
36
+ <${iconExclamationMarkTag} role="img" aria-label="${x => popupIconErrorLabel.getValueFor(x)}"></${iconExclamationMarkTag}>
37
37
  `)}
38
38
  ${when(x => x.severity === BannerSeverity.warning, html `
39
- <${iconTriangleFilledTag} role="img" aria-label="${x => warningIconLabel.getValueFor(x)}"></${iconTriangleFilledTag}>
39
+ <${iconTriangleFilledTag} role="img" aria-label="${x => popupIconWarningLabel.getValueFor(x)}"></${iconTriangleFilledTag}>
40
40
  `)}
41
41
  ${when(x => x.severity === BannerSeverity.information, html `
42
- <${iconInfoTag} role="img" aria-label="${x => informationIconLabel.getValueFor(x)}"></${iconInfoTag}>
42
+ <${iconInfoTag} role="img" aria-label="${x => popupIconInformationLabel.getValueFor(x)}"></${iconInfoTag}>
43
43
  `)}
44
44
  </div>
45
45
  <div class="text">
@@ -1 +1 @@
1
- {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/banner/template.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, when } from '@microsoft/fast-element';\nimport type { Banner } from '.';\nimport { buttonTag } from '../button';\nimport { iconExclamationMarkTag } from '../icons/exclamation-mark';\nimport { iconInfoTag } from '../icons/info';\nimport { iconTriangleFilledTag } from '../icons/triangle-filled';\nimport { iconXmarkTag } from '../icons/xmark';\nimport { BannerSeverity } from './types';\nimport {\n errorIconLabel,\n informationIconLabel,\n popupDismissLabel,\n warningIconLabel\n} from '../label-provider/core/label-tokens';\n\n// prettier-ignore\nexport const template = html<Banner>`\n <div class=\"container\"\n role=\"status\"\n aria-atomic=\"${x => x.ariaAtomic}\"\n aria-busy=\"${x => x.ariaBusy}\"\n aria-controls=\"${x => x.ariaControls}\"\n aria-current=\"${x => x.ariaCurrent}\"\n aria-describedby=\"${x => x.ariaDescribedby}\"\n aria-details=\"${x => x.ariaDetails}\"\n aria-disabled=\"${x => x.ariaDisabled}\"\n aria-errormessage=\"${x => x.ariaErrormessage}\"\n aria-expanded=\"${x => x.ariaExpanded}\"\n aria-flowto=\"${x => x.ariaFlowto}\"\n aria-haspopup=\"${x => x.ariaHaspopup}\"\n aria-hidden=\"${x => x.ariaHidden}\"\n aria-invalid=\"${x => x.ariaInvalid}\"\n aria-keyshortcuts=\"${x => x.ariaKeyshortcuts}\"\n aria-label=\"${x => x.ariaLabel}\"\n aria-labelledby=\"titleSlot\"\n aria-live=\"${x => x.ariaLive}\"\n aria-owns=\"${x => x.ariaOwns}\"\n aria-relevant=\"${x => x.ariaRelevant}\"\n aria-roledescription=\"${x => x.ariaRoledescription}\"\n >\n <div class=\"icon\">\n ${when(x => x.severity === BannerSeverity.error, html<Banner>`\n <${iconExclamationMarkTag} role=\"img\" aria-label=\"${x => errorIconLabel.getValueFor(x)}\"></${iconExclamationMarkTag}>\n `)}\n ${when(x => x.severity === BannerSeverity.warning, html<Banner>`\n <${iconTriangleFilledTag} role=\"img\" aria-label=\"${x => warningIconLabel.getValueFor(x)}\"></${iconTriangleFilledTag}>\n `)}\n ${when(x => x.severity === BannerSeverity.information, html<Banner>`\n <${iconInfoTag} role=\"img\" aria-label=\"${x => informationIconLabel.getValueFor(x)}\"></${iconInfoTag}>\n `)}\n </div>\n <div class=\"text\">\n <slot name=\"title\" id=\"titleSlot\"></slot>\n <slot></slot>\n </div>\n <div class=\"controls\">\n <slot name=\"action\"></slot>\n <div class=\"dismiss\">\n ${when(x => !x.preventDismiss, html<Banner>`\n <${buttonTag} appearance=\"ghost\" content-hidden @click=\"${x => x.dismissBanner()}\">\n <${iconXmarkTag} slot=\"start\"></${iconXmarkTag}>\n ${x => popupDismissLabel.getValueFor(x)}\n </${buttonTag}>\n `)}\n </div>\n </div>\n </div>\n`;\n"]}
1
+ {"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/banner/template.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, when } from '@microsoft/fast-element';\nimport type { Banner } from '.';\nimport { buttonTag } from '../button';\nimport { iconExclamationMarkTag } from '../icons/exclamation-mark';\nimport { iconInfoTag } from '../icons/info';\nimport { iconTriangleFilledTag } from '../icons/triangle-filled';\nimport { iconXmarkTag } from '../icons/xmark';\nimport { BannerSeverity } from './types';\nimport {\n popupIconErrorLabel,\n popupIconInformationLabel,\n popupDismissLabel,\n popupIconWarningLabel\n} from '../label-provider/core/label-tokens';\n\n// prettier-ignore\nexport const template = html<Banner>`\n <div class=\"container\"\n role=\"status\"\n aria-atomic=\"${x => x.ariaAtomic}\"\n aria-busy=\"${x => x.ariaBusy}\"\n aria-controls=\"${x => x.ariaControls}\"\n aria-current=\"${x => x.ariaCurrent}\"\n aria-describedby=\"${x => x.ariaDescribedby}\"\n aria-details=\"${x => x.ariaDetails}\"\n aria-disabled=\"${x => x.ariaDisabled}\"\n aria-errormessage=\"${x => x.ariaErrormessage}\"\n aria-expanded=\"${x => x.ariaExpanded}\"\n aria-flowto=\"${x => x.ariaFlowto}\"\n aria-haspopup=\"${x => x.ariaHaspopup}\"\n aria-hidden=\"${x => x.ariaHidden}\"\n aria-invalid=\"${x => x.ariaInvalid}\"\n aria-keyshortcuts=\"${x => x.ariaKeyshortcuts}\"\n aria-label=\"${x => x.ariaLabel}\"\n aria-labelledby=\"titleSlot\"\n aria-live=\"${x => x.ariaLive}\"\n aria-owns=\"${x => x.ariaOwns}\"\n aria-relevant=\"${x => x.ariaRelevant}\"\n aria-roledescription=\"${x => x.ariaRoledescription}\"\n >\n <div class=\"icon\">\n ${when(x => x.severity === BannerSeverity.error, html<Banner>`\n <${iconExclamationMarkTag} role=\"img\" aria-label=\"${x => popupIconErrorLabel.getValueFor(x)}\"></${iconExclamationMarkTag}>\n `)}\n ${when(x => x.severity === BannerSeverity.warning, html<Banner>`\n <${iconTriangleFilledTag} role=\"img\" aria-label=\"${x => popupIconWarningLabel.getValueFor(x)}\"></${iconTriangleFilledTag}>\n `)}\n ${when(x => x.severity === BannerSeverity.information, html<Banner>`\n <${iconInfoTag} role=\"img\" aria-label=\"${x => popupIconInformationLabel.getValueFor(x)}\"></${iconInfoTag}>\n `)}\n </div>\n <div class=\"text\">\n <slot name=\"title\" id=\"titleSlot\"></slot>\n <slot></slot>\n </div>\n <div class=\"controls\">\n <slot name=\"action\"></slot>\n <div class=\"dismiss\">\n ${when(x => !x.preventDismiss, html<Banner>`\n <${buttonTag} appearance=\"ghost\" content-hidden @click=\"${x => x.dismissBanner()}\">\n <${iconXmarkTag} slot=\"start\"></${iconXmarkTag}>\n ${x => popupDismissLabel.getValueFor(x)}\n </${buttonTag}>\n `)}\n </div>\n </div>\n </div>\n`;\n"]}
@@ -51,6 +51,10 @@ export const styles = css `
51
51
  display: none;
52
52
  }
53
53
 
54
+ .content {
55
+ pointer-events: none;
56
+ }
57
+
54
58
  [part='end'] {
55
59
  display: none;
56
60
  }
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/breadcrumb-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,QAAQ,EACR,oBAAoB,EACvB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAExD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;kBAGV,aAAa;;mCAEI,WAAW;;UAEpC;AACE;mDACmD,CAAC,EACxD;iBACS,aAAa;gBACd,QAAQ;;;;;;;;;;;;;kBAaN,WAAW;oCACO,WAAW;;;;;;;;cAQjC,YAAY;kBACR,WAAW,UAAU,gBAAgB;6BAC1B,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;iBAuB5B,QAAQ;kBACP,QAAQ;gBACV,oBAAoB;;CAEnC,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\nimport {\n bodyFontColor,\n borderHoverColor,\n borderWidth,\n controlHeight,\n iconSize,\n linkFont,\n placeholderFontColor\n} from '../theme-provider/design-tokens';\nimport { focusVisible } from '../utilities/style/focus';\n\nexport const styles = css`\n ${display('inline-flex')}\n\n :host {\n height: ${controlHeight};\n box-sizing: border-box;\n padding-left: calc(4px - ${borderWidth});\n\n ${\n /* When href removed the .control element is also removed\n so this becomes the fallback color for the slot */ ''\n }\n color: ${bodyFontColor};\n font: ${linkFont};\n }\n\n .listitem {\n display: flex;\n align-items: center;\n }\n\n .control {\n color: var(--ni-private-breadcrumb-link-font-color);\n display: flex;\n align-items: center;\n justify-content: center;\n border: ${borderWidth} solid transparent;\n padding-right: calc(4px - ${borderWidth});\n text-decoration: none;\n }\n\n .control:hover {\n text-decoration: underline;\n }\n\n .control${focusVisible} {\n border: ${borderWidth} solid ${borderHoverColor};\n outline: 2px solid ${borderHoverColor};\n outline-offset: 1px;\n }\n\n .control:active {\n color: var(--ni-private-breadcrumb-link-active-font-color);\n text-decoration: underline;\n }\n\n [part='start'] {\n display: none;\n }\n\n [part='end'] {\n display: none;\n }\n\n slot[name='separator'] {\n display: flex;\n align-items: center;\n }\n\n slot[name='separator'] svg {\n width: ${iconSize};\n height: ${iconSize};\n fill: ${placeholderFontColor};\n }\n`;\n"]}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/breadcrumb-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,QAAQ,EACR,oBAAoB,EACvB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAExD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;kBAGV,aAAa;;mCAEI,WAAW;;UAEpC;AACE;mDACmD,CAAC,EACxD;iBACS,aAAa;gBACd,QAAQ;;;;;;;;;;;;;kBAaN,WAAW;oCACO,WAAW;;;;;;;;cAQjC,YAAY;kBACR,WAAW,UAAU,gBAAgB;6BAC1B,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA2B5B,QAAQ;kBACP,QAAQ;gBACV,oBAAoB;;CAEnC,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\nimport { display } from '@microsoft/fast-foundation';\nimport {\n bodyFontColor,\n borderHoverColor,\n borderWidth,\n controlHeight,\n iconSize,\n linkFont,\n placeholderFontColor\n} from '../theme-provider/design-tokens';\nimport { focusVisible } from '../utilities/style/focus';\n\nexport const styles = css`\n ${display('inline-flex')}\n\n :host {\n height: ${controlHeight};\n box-sizing: border-box;\n padding-left: calc(4px - ${borderWidth});\n\n ${\n /* When href removed the .control element is also removed\n so this becomes the fallback color for the slot */ ''\n }\n color: ${bodyFontColor};\n font: ${linkFont};\n }\n\n .listitem {\n display: flex;\n align-items: center;\n }\n\n .control {\n color: var(--ni-private-breadcrumb-link-font-color);\n display: flex;\n align-items: center;\n justify-content: center;\n border: ${borderWidth} solid transparent;\n padding-right: calc(4px - ${borderWidth});\n text-decoration: none;\n }\n\n .control:hover {\n text-decoration: underline;\n }\n\n .control${focusVisible} {\n border: ${borderWidth} solid ${borderHoverColor};\n outline: 2px solid ${borderHoverColor};\n outline-offset: 1px;\n }\n\n .control:active {\n color: var(--ni-private-breadcrumb-link-active-font-color);\n text-decoration: underline;\n }\n\n [part='start'] {\n display: none;\n }\n\n .content {\n pointer-events: none;\n }\n\n [part='end'] {\n display: none;\n }\n\n slot[name='separator'] {\n display: flex;\n align-items: center;\n }\n\n slot[name='separator'] svg {\n width: ${iconSize};\n height: ${iconSize};\n fill: ${placeholderFontColor};\n }\n`;\n"]}
@@ -8,9 +8,9 @@ declare const supportedLabels: {
8
8
  readonly popupDismiss: import("@microsoft/fast-foundation").DesignToken<string>;
9
9
  readonly numericDecrement: import("@microsoft/fast-foundation").DesignToken<string>;
10
10
  readonly numericIncrement: import("@microsoft/fast-foundation").DesignToken<string>;
11
- readonly errorIcon: import("@microsoft/fast-foundation").DesignToken<string>;
12
- readonly warningIcon: import("@microsoft/fast-foundation").DesignToken<string>;
13
- readonly informationIcon: import("@microsoft/fast-foundation").DesignToken<string>;
11
+ readonly popupIconError: import("@microsoft/fast-foundation").DesignToken<string>;
12
+ readonly popupIconWarning: import("@microsoft/fast-foundation").DesignToken<string>;
13
+ readonly popupIconInformation: import("@microsoft/fast-foundation").DesignToken<string>;
14
14
  readonly filterSearch: import("@microsoft/fast-foundation").DesignToken<string>;
15
15
  readonly filterNoResults: import("@microsoft/fast-foundation").DesignToken<string>;
16
16
  };
@@ -21,18 +21,18 @@ export declare class LabelProviderCore extends LabelProviderBase<typeof supporte
21
21
  popupDismiss: string | undefined;
22
22
  numericDecrement: string | undefined;
23
23
  numericIncrement: string | undefined;
24
- errorIcon: string | undefined;
25
- warningIcon: string | undefined;
26
- informationIcon: string | undefined;
24
+ popupIconError: string | undefined;
25
+ popupIconWarning: string | undefined;
26
+ popupIconInformation: string | undefined;
27
27
  filterSearch: string | undefined;
28
28
  filterNoResults: string | undefined;
29
29
  protected readonly supportedLabels: {
30
30
  readonly popupDismiss: import("@microsoft/fast-foundation").DesignToken<string>;
31
31
  readonly numericDecrement: import("@microsoft/fast-foundation").DesignToken<string>;
32
32
  readonly numericIncrement: import("@microsoft/fast-foundation").DesignToken<string>;
33
- readonly errorIcon: import("@microsoft/fast-foundation").DesignToken<string>;
34
- readonly warningIcon: import("@microsoft/fast-foundation").DesignToken<string>;
35
- readonly informationIcon: import("@microsoft/fast-foundation").DesignToken<string>;
33
+ readonly popupIconError: import("@microsoft/fast-foundation").DesignToken<string>;
34
+ readonly popupIconWarning: import("@microsoft/fast-foundation").DesignToken<string>;
35
+ readonly popupIconInformation: import("@microsoft/fast-foundation").DesignToken<string>;
36
36
  readonly filterSearch: import("@microsoft/fast-foundation").DesignToken<string>;
37
37
  readonly filterNoResults: import("@microsoft/fast-foundation").DesignToken<string>;
38
38
  };
@@ -2,14 +2,14 @@ import { __decorate } from "tslib";
2
2
  import { attr } from '@microsoft/fast-element';
3
3
  import { DesignSystem } from '@microsoft/fast-foundation';
4
4
  import { LabelProviderBase } from '../base';
5
- import { popupDismissLabel, numericDecrementLabel, numericIncrementLabel, errorIconLabel, warningIconLabel, informationIconLabel, filterSearchLabel, filterNoResultsLabel } from './label-tokens';
5
+ import { popupDismissLabel, numericDecrementLabel, numericIncrementLabel, popupIconErrorLabel, popupIconWarningLabel, popupIconInformationLabel, filterSearchLabel, filterNoResultsLabel } from './label-tokens';
6
6
  const supportedLabels = {
7
7
  popupDismiss: popupDismissLabel,
8
8
  numericDecrement: numericDecrementLabel,
9
9
  numericIncrement: numericIncrementLabel,
10
- errorIcon: errorIconLabel,
11
- warningIcon: warningIconLabel,
12
- informationIcon: informationIconLabel,
10
+ popupIconError: popupIconErrorLabel,
11
+ popupIconWarning: popupIconWarningLabel,
12
+ popupIconInformation: popupIconInformationLabel,
13
13
  filterSearch: filterSearchLabel,
14
14
  filterNoResults: filterNoResultsLabel
15
15
  };
@@ -32,14 +32,14 @@ __decorate([
32
32
  attr({ attribute: 'numeric-increment' })
33
33
  ], LabelProviderCore.prototype, "numericIncrement", void 0);
34
34
  __decorate([
35
- attr({ attribute: 'error-icon' })
36
- ], LabelProviderCore.prototype, "errorIcon", void 0);
35
+ attr({ attribute: 'popup-icon-error' })
36
+ ], LabelProviderCore.prototype, "popupIconError", void 0);
37
37
  __decorate([
38
- attr({ attribute: 'warning-icon' })
39
- ], LabelProviderCore.prototype, "warningIcon", void 0);
38
+ attr({ attribute: 'popup-icon-warning' })
39
+ ], LabelProviderCore.prototype, "popupIconWarning", void 0);
40
40
  __decorate([
41
- attr({ attribute: 'information-icon' })
42
- ], LabelProviderCore.prototype, "informationIcon", void 0);
41
+ attr({ attribute: 'popup-icon-information' })
42
+ ], LabelProviderCore.prototype, "popupIconInformation", void 0);
43
43
  __decorate([
44
44
  attr({ attribute: 'filter-search' })
45
45
  ], LabelProviderCore.prototype, "filterSearch", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/label-provider/core/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAmB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAC7D,OAAO,EACH,iBAAiB,EACjB,qBAAqB,EACrB,qBAAqB,EACrB,cAAc,EACd,gBAAgB,EAChB,oBAAoB,EACpB,iBAAiB,EACjB,oBAAoB,EACvB,MAAM,gBAAgB,CAAC;AAQxB,MAAM,eAAe,GAAG;IACpB,YAAY,EAAE,iBAAiB;IAC/B,gBAAgB,EAAE,qBAAqB;IACvC,gBAAgB,EAAE,qBAAqB;IACvC,SAAS,EAAE,cAAc;IACzB,WAAW,EAAE,gBAAgB;IAC7B,eAAe,EAAE,oBAAoB;IACrC,YAAY,EAAE,iBAAiB;IAC/B,eAAe,EAAE,oBAAoB;CAC/B,CAAC;AAEX;;GAEG;AACH,MAAM,OAAO,iBACT,SAAQ,iBAAyC;IADrD;;QA2BgC,oBAAe,GAAG,eAAe,CAAC;IAClE,CAAC;CAAA;AAxBG;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;uDACG;AAGxC;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;2DACG;AAG5C;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;2DACG;AAG5C;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;oDACG;AAGrC;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;sDACG;AAGvC;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;0DACG;AAG3C;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;uDACG;AAGxC;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;0DACE;AAK/C,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,OAAO,CAAC;IACtD,QAAQ,EAAE,qBAAqB;CAClC,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE;KACrB,UAAU,CAAC,QAAQ,CAAC;KACpB,QAAQ,CAAC,uBAAuB,EAAE,CAAC,CAAC;AACzC,MAAM,CAAC,MAAM,oBAAoB,GAAG,4BAA4B,CAAC","sourcesContent":["import { attr } from '@microsoft/fast-element';\nimport { DesignSystem } from '@microsoft/fast-foundation';\nimport { DesignTokensFor, LabelProviderBase } from '../base';\nimport {\n popupDismissLabel,\n numericDecrementLabel,\n numericIncrementLabel,\n errorIconLabel,\n warningIconLabel,\n informationIconLabel,\n filterSearchLabel,\n filterNoResultsLabel\n} from './label-tokens';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-label-provider-core': LabelProviderCore;\n }\n}\n\nconst supportedLabels = {\n popupDismiss: popupDismissLabel,\n numericDecrement: numericDecrementLabel,\n numericIncrement: numericIncrementLabel,\n errorIcon: errorIconLabel,\n warningIcon: warningIconLabel,\n informationIcon: informationIconLabel,\n filterSearch: filterSearchLabel,\n filterNoResults: filterNoResultsLabel\n} as const;\n\n/**\n * Core label provider for Nimble\n */\nexport class LabelProviderCore\n extends LabelProviderBase<typeof supportedLabels>\n implements DesignTokensFor<typeof supportedLabels> {\n @attr({ attribute: 'popup-dismiss' })\n public popupDismiss: string | undefined;\n\n @attr({ attribute: 'numeric-decrement' })\n public numericDecrement: string | undefined;\n\n @attr({ attribute: 'numeric-increment' })\n public numericIncrement: string | undefined;\n\n @attr({ attribute: 'error-icon' })\n public errorIcon: string | undefined;\n\n @attr({ attribute: 'warning-icon' })\n public warningIcon: string | undefined;\n\n @attr({ attribute: 'information-icon' })\n public informationIcon: string | undefined;\n\n @attr({ attribute: 'filter-search' })\n public filterSearch: string | undefined;\n\n @attr({ attribute: 'filter-no-results' })\n public filterNoResults: string | undefined;\n\n protected override readonly supportedLabels = supportedLabels;\n}\n\nconst nimbleLabelProviderCore = LabelProviderCore.compose({\n baseName: 'label-provider-core'\n});\n\nDesignSystem.getOrCreate()\n .withPrefix('nimble')\n .register(nimbleLabelProviderCore());\nexport const labelProviderCoreTag = 'nimble-label-provider-core';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/label-provider/core/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAmB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAC7D,OAAO,EACH,iBAAiB,EACjB,qBAAqB,EACrB,qBAAqB,EACrB,mBAAmB,EACnB,qBAAqB,EACrB,yBAAyB,EACzB,iBAAiB,EACjB,oBAAoB,EACvB,MAAM,gBAAgB,CAAC;AAQxB,MAAM,eAAe,GAAG;IACpB,YAAY,EAAE,iBAAiB;IAC/B,gBAAgB,EAAE,qBAAqB;IACvC,gBAAgB,EAAE,qBAAqB;IACvC,cAAc,EAAE,mBAAmB;IACnC,gBAAgB,EAAE,qBAAqB;IACvC,oBAAoB,EAAE,yBAAyB;IAC/C,YAAY,EAAE,iBAAiB;IAC/B,eAAe,EAAE,oBAAoB;CAC/B,CAAC;AAEX;;GAEG;AACH,MAAM,OAAO,iBACT,SAAQ,iBAAyC;IADrD;;QA2BgC,oBAAe,GAAG,eAAe,CAAC;IAClE,CAAC;CAAA;AAxBG;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;uDACG;AAGxC;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;2DACG;AAG5C;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;2DACG;AAG5C;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;yDACE;AAG1C;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,oBAAoB,EAAE,CAAC;2DACE;AAG5C;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,wBAAwB,EAAE,CAAC;+DACE;AAGhD;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;uDACG;AAGxC;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;0DACE;AAK/C,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,OAAO,CAAC;IACtD,QAAQ,EAAE,qBAAqB;CAClC,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE;KACrB,UAAU,CAAC,QAAQ,CAAC;KACpB,QAAQ,CAAC,uBAAuB,EAAE,CAAC,CAAC;AACzC,MAAM,CAAC,MAAM,oBAAoB,GAAG,4BAA4B,CAAC","sourcesContent":["import { attr } from '@microsoft/fast-element';\nimport { DesignSystem } from '@microsoft/fast-foundation';\nimport { DesignTokensFor, LabelProviderBase } from '../base';\nimport {\n popupDismissLabel,\n numericDecrementLabel,\n numericIncrementLabel,\n popupIconErrorLabel,\n popupIconWarningLabel,\n popupIconInformationLabel,\n filterSearchLabel,\n filterNoResultsLabel\n} from './label-tokens';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nimble-label-provider-core': LabelProviderCore;\n }\n}\n\nconst supportedLabels = {\n popupDismiss: popupDismissLabel,\n numericDecrement: numericDecrementLabel,\n numericIncrement: numericIncrementLabel,\n popupIconError: popupIconErrorLabel,\n popupIconWarning: popupIconWarningLabel,\n popupIconInformation: popupIconInformationLabel,\n filterSearch: filterSearchLabel,\n filterNoResults: filterNoResultsLabel\n} as const;\n\n/**\n * Core label provider for Nimble\n */\nexport class LabelProviderCore\n extends LabelProviderBase<typeof supportedLabels>\n implements DesignTokensFor<typeof supportedLabels> {\n @attr({ attribute: 'popup-dismiss' })\n public popupDismiss: string | undefined;\n\n @attr({ attribute: 'numeric-decrement' })\n public numericDecrement: string | undefined;\n\n @attr({ attribute: 'numeric-increment' })\n public numericIncrement: string | undefined;\n\n @attr({ attribute: 'popup-icon-error' })\n public popupIconError: string | undefined;\n\n @attr({ attribute: 'popup-icon-warning' })\n public popupIconWarning: string | undefined;\n\n @attr({ attribute: 'popup-icon-information' })\n public popupIconInformation: string | undefined;\n\n @attr({ attribute: 'filter-search' })\n public filterSearch: string | undefined;\n\n @attr({ attribute: 'filter-no-results' })\n public filterNoResults: string | undefined;\n\n protected override readonly supportedLabels = supportedLabels;\n}\n\nconst nimbleLabelProviderCore = LabelProviderCore.compose({\n baseName: 'label-provider-core'\n});\n\nDesignSystem.getOrCreate()\n .withPrefix('nimble')\n .register(nimbleLabelProviderCore());\nexport const labelProviderCoreTag = 'nimble-label-provider-core';\n"]}
@@ -2,9 +2,9 @@ export const coreLabelDefaults = {
2
2
  popupDismissLabel: 'Close',
3
3
  numericIncrementLabel: 'Increment',
4
4
  numericDecrementLabel: 'Decrement',
5
- errorIconLabel: 'Error',
6
- warningIconLabel: 'Warning',
7
- informationIconLabel: 'Information',
5
+ popupIconErrorLabel: 'Error',
6
+ popupIconWarningLabel: 'Warning',
7
+ popupIconInformationLabel: 'Information',
8
8
  filterSearchLabel: 'Search',
9
9
  filterNoResultsLabel: 'No items found'
10
10
  };
@@ -1 +1 @@
1
- {"version":3,"file":"label-token-defaults.js","sourceRoot":"","sources":["../../../../src/label-provider/core/label-token-defaults.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,MAAM,iBAAiB,GAA4C;IACtE,iBAAiB,EAAE,OAAO;IAC1B,qBAAqB,EAAE,WAAW;IAClC,qBAAqB,EAAE,WAAW;IAClC,cAAc,EAAE,OAAO;IACvB,gBAAgB,EAAE,SAAS;IAC3B,oBAAoB,EAAE,aAAa;IACnC,iBAAiB,EAAE,QAAQ;IAC3B,oBAAoB,EAAE,gBAAgB;CACzC,CAAC","sourcesContent":["import type * as TokensNamespace from './label-tokens';\n\ntype TokenName = keyof typeof TokensNamespace;\n\nexport const coreLabelDefaults: { readonly [key in TokenName]: string } = {\n popupDismissLabel: 'Close',\n numericIncrementLabel: 'Increment',\n numericDecrementLabel: 'Decrement',\n errorIconLabel: 'Error',\n warningIconLabel: 'Warning',\n informationIconLabel: 'Information',\n filterSearchLabel: 'Search',\n filterNoResultsLabel: 'No items found'\n};\n"]}
1
+ {"version":3,"file":"label-token-defaults.js","sourceRoot":"","sources":["../../../../src/label-provider/core/label-token-defaults.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,MAAM,iBAAiB,GAA4C;IACtE,iBAAiB,EAAE,OAAO;IAC1B,qBAAqB,EAAE,WAAW;IAClC,qBAAqB,EAAE,WAAW;IAClC,mBAAmB,EAAE,OAAO;IAC5B,qBAAqB,EAAE,SAAS;IAChC,yBAAyB,EAAE,aAAa;IACxC,iBAAiB,EAAE,QAAQ;IAC3B,oBAAoB,EAAE,gBAAgB;CACzC,CAAC","sourcesContent":["import type * as TokensNamespace from './label-tokens';\n\ntype TokenName = keyof typeof TokensNamespace;\n\nexport const coreLabelDefaults: { readonly [key in TokenName]: string } = {\n popupDismissLabel: 'Close',\n numericIncrementLabel: 'Increment',\n numericDecrementLabel: 'Decrement',\n popupIconErrorLabel: 'Error',\n popupIconWarningLabel: 'Warning',\n popupIconInformationLabel: 'Information',\n filterSearchLabel: 'Search',\n filterNoResultsLabel: 'No items found'\n};\n"]}
@@ -2,8 +2,8 @@ import { DesignToken } from '@microsoft/fast-foundation';
2
2
  export declare const popupDismissLabel: DesignToken<string>;
3
3
  export declare const numericDecrementLabel: DesignToken<string>;
4
4
  export declare const numericIncrementLabel: DesignToken<string>;
5
- export declare const errorIconLabel: DesignToken<string>;
6
- export declare const warningIconLabel: DesignToken<string>;
7
- export declare const informationIconLabel: DesignToken<string>;
5
+ export declare const popupIconErrorLabel: DesignToken<string>;
6
+ export declare const popupIconWarningLabel: DesignToken<string>;
7
+ export declare const popupIconInformationLabel: DesignToken<string>;
8
8
  export declare const filterSearchLabel: DesignToken<string>;
9
9
  export declare const filterNoResultsLabel: DesignToken<string>;
@@ -12,18 +12,18 @@ export const numericIncrementLabel = DesignToken.create({
12
12
  name: 'numeric-increment-label',
13
13
  cssCustomPropertyName: null
14
14
  }).withDefault(coreLabelDefaults.numericIncrementLabel);
15
- export const errorIconLabel = DesignToken.create({
16
- name: 'error-icon-label',
15
+ export const popupIconErrorLabel = DesignToken.create({
16
+ name: 'popup-icon-error-label',
17
17
  cssCustomPropertyName: null
18
- }).withDefault(coreLabelDefaults.errorIconLabel);
19
- export const warningIconLabel = DesignToken.create({
20
- name: 'warning-icon-label',
18
+ }).withDefault(coreLabelDefaults.popupIconErrorLabel);
19
+ export const popupIconWarningLabel = DesignToken.create({
20
+ name: 'popup-icon-warning-label',
21
21
  cssCustomPropertyName: null
22
- }).withDefault(coreLabelDefaults.warningIconLabel);
23
- export const informationIconLabel = DesignToken.create({
24
- name: 'information-icon-label',
22
+ }).withDefault(coreLabelDefaults.popupIconWarningLabel);
23
+ export const popupIconInformationLabel = DesignToken.create({
24
+ name: 'popup-icon-information-label',
25
25
  cssCustomPropertyName: null
26
- }).withDefault(coreLabelDefaults.informationIconLabel);
26
+ }).withDefault(coreLabelDefaults.popupIconInformationLabel);
27
27
  export const filterSearchLabel = DesignToken.create({
28
28
  name: 'filter-search-label',
29
29
  cssCustomPropertyName: null
@@ -1 +1 @@
1
- {"version":3,"file":"label-tokens.js","sourceRoot":"","sources":["../../../../src/label-provider/core/label-tokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE3D,MAAM,CAAC,MAAM,iBAAiB,GAAG,WAAW,CAAC,MAAM,CAAS;IACxD,IAAI,EAAE,qBAAqB;IAC3B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;AAEpD,MAAM,CAAC,MAAM,qBAAqB,GAAG,WAAW,CAAC,MAAM,CAAS;IAC5D,IAAI,EAAE,yBAAyB;IAC/B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,CAAC;AAExD,MAAM,CAAC,MAAM,qBAAqB,GAAG,WAAW,CAAC,MAAM,CAAS;IAC5D,IAAI,EAAE,yBAAyB;IAC/B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,CAAC;AAExD,MAAM,CAAC,MAAM,cAAc,GAAG,WAAW,CAAC,MAAM,CAAS;IACrD,IAAI,EAAE,kBAAkB;IACxB,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;AAEjD,MAAM,CAAC,MAAM,gBAAgB,GAAG,WAAW,CAAC,MAAM,CAAS;IACvD,IAAI,EAAE,oBAAoB;IAC1B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;AAEnD,MAAM,CAAC,MAAM,oBAAoB,GAAG,WAAW,CAAC,MAAM,CAAS;IAC3D,IAAI,EAAE,wBAAwB;IAC9B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;AAEvD,MAAM,CAAC,MAAM,iBAAiB,GAAG,WAAW,CAAC,MAAM,CAAS;IACxD,IAAI,EAAE,qBAAqB;IAC3B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;AAEpD,MAAM,CAAC,MAAM,oBAAoB,GAAG,WAAW,CAAC,MAAM,CAAS;IAC3D,IAAI,EAAE,yBAAyB;IAC/B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAAC","sourcesContent":["import { DesignToken } from '@microsoft/fast-foundation';\nimport { coreLabelDefaults } from './label-token-defaults';\n\nexport const popupDismissLabel = DesignToken.create<string>({\n name: 'popup-dismiss-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.popupDismissLabel);\n\nexport const numericDecrementLabel = DesignToken.create<string>({\n name: 'numeric-decrement-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.numericDecrementLabel);\n\nexport const numericIncrementLabel = DesignToken.create<string>({\n name: 'numeric-increment-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.numericIncrementLabel);\n\nexport const errorIconLabel = DesignToken.create<string>({\n name: 'error-icon-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.errorIconLabel);\n\nexport const warningIconLabel = DesignToken.create<string>({\n name: 'warning-icon-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.warningIconLabel);\n\nexport const informationIconLabel = DesignToken.create<string>({\n name: 'information-icon-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.informationIconLabel);\n\nexport const filterSearchLabel = DesignToken.create<string>({\n name: 'filter-search-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.filterSearchLabel);\n\nexport const filterNoResultsLabel = DesignToken.create<string>({\n name: 'filter-no-results-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.filterNoResultsLabel);\n"]}
1
+ {"version":3,"file":"label-tokens.js","sourceRoot":"","sources":["../../../../src/label-provider/core/label-tokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE3D,MAAM,CAAC,MAAM,iBAAiB,GAAG,WAAW,CAAC,MAAM,CAAS;IACxD,IAAI,EAAE,qBAAqB;IAC3B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;AAEpD,MAAM,CAAC,MAAM,qBAAqB,GAAG,WAAW,CAAC,MAAM,CAAS;IAC5D,IAAI,EAAE,yBAAyB;IAC/B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,CAAC;AAExD,MAAM,CAAC,MAAM,qBAAqB,GAAG,WAAW,CAAC,MAAM,CAAS;IAC5D,IAAI,EAAE,yBAAyB;IAC/B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,CAAC;AAExD,MAAM,CAAC,MAAM,mBAAmB,GAAG,WAAW,CAAC,MAAM,CAAS;IAC1D,IAAI,EAAE,wBAAwB;IAC9B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,mBAAmB,CAAC,CAAC;AAEtD,MAAM,CAAC,MAAM,qBAAqB,GAAG,WAAW,CAAC,MAAM,CAAS;IAC5D,IAAI,EAAE,0BAA0B;IAChC,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,CAAC;AAExD,MAAM,CAAC,MAAM,yBAAyB,GAAG,WAAW,CAAC,MAAM,CAAS;IAChE,IAAI,EAAE,8BAA8B;IACpC,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,yBAAyB,CAAC,CAAC;AAE5D,MAAM,CAAC,MAAM,iBAAiB,GAAG,WAAW,CAAC,MAAM,CAAS;IACxD,IAAI,EAAE,qBAAqB;IAC3B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;AAEpD,MAAM,CAAC,MAAM,oBAAoB,GAAG,WAAW,CAAC,MAAM,CAAS;IAC3D,IAAI,EAAE,yBAAyB;IAC/B,qBAAqB,EAAE,IAAI;CAC9B,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAAC","sourcesContent":["import { DesignToken } from '@microsoft/fast-foundation';\nimport { coreLabelDefaults } from './label-token-defaults';\n\nexport const popupDismissLabel = DesignToken.create<string>({\n name: 'popup-dismiss-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.popupDismissLabel);\n\nexport const numericDecrementLabel = DesignToken.create<string>({\n name: 'numeric-decrement-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.numericDecrementLabel);\n\nexport const numericIncrementLabel = DesignToken.create<string>({\n name: 'numeric-increment-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.numericIncrementLabel);\n\nexport const popupIconErrorLabel = DesignToken.create<string>({\n name: 'popup-icon-error-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.popupIconErrorLabel);\n\nexport const popupIconWarningLabel = DesignToken.create<string>({\n name: 'popup-icon-warning-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.popupIconWarningLabel);\n\nexport const popupIconInformationLabel = DesignToken.create<string>({\n name: 'popup-icon-information-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.popupIconInformationLabel);\n\nexport const filterSearchLabel = DesignToken.create<string>({\n name: 'filter-search-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.filterSearchLabel);\n\nexport const filterNoResultsLabel = DesignToken.create<string>({\n name: 'filter-no-results-label',\n cssCustomPropertyName: null\n}).withDefault(coreLabelDefaults.filterNoResultsLabel);\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ni/nimble-components",
3
- "version": "21.10.2",
3
+ "version": "22.0.1",
4
4
  "description": "Styled web components for the NI Nimble Design System",
5
5
  "scripts": {
6
6
  "build": "npm run generate-icons && npm run generate-workers && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook",