@ni/nimble-components 30.1.5 → 30.1.6
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.
- package/dist/all-components-bundle.js +7 -4
- package/dist/all-components-bundle.js.map +1 -1
- package/dist/all-components-bundle.min.js +6 -3
- package/dist/all-components-bundle.min.js.map +1 -1
- package/dist/esm/table/components/row/styles.js +6 -2
- package/dist/esm/table/components/row/styles.js.map +1 -1
- package/dist/esm/table-column/menu-button/cell-view/styles.js +0 -2
- package/dist/esm/table-column/menu-button/cell-view/styles.js.map +1 -1
- package/package.json +1 -1
|
@@ -42,8 +42,12 @@ export const styles = css `
|
|
|
42
42
|
}
|
|
43
43
|
|
|
44
44
|
:host(${focusVisible}) {
|
|
45
|
-
outline:
|
|
46
|
-
|
|
45
|
+
outline: none;
|
|
46
|
+
box-shadow:
|
|
47
|
+
inset calc(2 * ${borderWidth}) calc(2 * ${borderWidth})
|
|
48
|
+
${borderHoverColor},
|
|
49
|
+
inset calc(-2 * ${borderWidth}) calc(-2 * ${borderWidth})
|
|
50
|
+
${borderHoverColor};
|
|
47
51
|
}
|
|
48
52
|
|
|
49
53
|
.expand-collapse-button {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table/components/row/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,kCAAkC,CAAC;AAC3D,OAAO,EACH,0BAA0B,EAC1B,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,sBAAsB,EACtB,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,eAAe,EAClB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,OAAO,EAAE,MAAM,IAAI,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAC1F,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;MACf,oBAAoB;;;;;4BAKE,0BAA0B;uBAC/B,aAAa,UAAU,WAAW;+BAC1B,WAAW;;;;;;;kBAOxB,aAAa;;;;;;;4BAOH,cAAc;;;;4BAId,iBAAiB;;;;4BAIjB,sBAAsB;;;YAGtC,YAAY
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table/components/row/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,kCAAkC,CAAC;AAC3D,OAAO,EACH,0BAA0B,EAC1B,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,sBAAsB,EACtB,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,eAAe,EAClB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAC/D,OAAO,EAAE,MAAM,IAAI,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAC1F,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;MACf,oBAAoB;;;;;4BAKE,0BAA0B;uBAC/B,aAAa,UAAU,WAAW;+BAC1B,WAAW;;;;;;;kBAOxB,aAAa;;;;;;;4BAOH,cAAc;;;;4BAId,iBAAiB;;;;4BAIjB,sBAAsB;;;YAGtC,YAAY;;;6BAGK,WAAW,cAAc,WAAW;kBAC/C,gBAAgB;8BACJ,WAAW,eAAe,WAAW;kBACjD,gBAAgB;;;;;;;kBAOhB,aAAa;;sBAET,aAAa;;;;;;;;iBAQlB,iBAAiB;kBAChB,iBAAiB;;;;;;;kBAOjB,aAAa;;sBAET,aAAa;;;;;;;;;;;;uBAYZ,eAAe;;;;;;;;iBAQrB,aAAa;;;;;iBAKb,aAAa;;;;;;;;;;;;;eAaf,aAAa;;;;;;;;;;;;uBAYL,YAAY;;;;qCAIE,YAAY;;oBAE7B,aAAa,MAAM,YAAY;;;eAGpC,aAAa,MAAM,aAAa;;kBAE7B,aAAa;;;;qCAIM,YAAY;;;;;sBAK3B,aAAa;;0BAET,YAAY;;;kBAGpB,aAAa;;;;;;;;;;;YAWnB,YAAY;;;CAGvB,CAAC,aAAa,CACX,aAAa,CACT,KAAK,CAAC,KAAK,EACX,GAAG,CAAA;;oCAEyB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;;;oCAI9B,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC;;;;oCAI9B,iBAAiB,CAAC,KAAK,EAAE,GAAG,CAAC;;SAExD,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 borderHoverColor,\n borderWidth,\n controlHeight,\n controlSlimHeight,\n fillHoverColor,\n fillHoverSelectedColor,\n fillSelectedColor,\n mediumPadding,\n smallPadding,\n standardPadding\n} from '../../../theme-provider/design-tokens';\nimport { Theme } from '../../../theme-provider/types';\nimport { hexToRgbaCssColor } from '../../../utilities/style/colors';\nimport { themeBehavior } from '../../../utilities/style/theme';\nimport { styles as expandCollapseStyles } from '../../../patterns/expand-collapse/styles';\nimport { focusVisible } from '../../../utilities/style/focus';\n\nexport const styles = css`\n ${display('flex')}\n ${expandCollapseStyles}\n\n :host {\n width: fit-content;\n min-width: 100%;\n background-color: ${applicationBackgroundColor};\n height: calc(${controlHeight} + 2 * ${borderWidth});\n border-top: calc(2 * ${borderWidth}) solid transparent;\n background-clip: padding-box;\n }\n\n :host::before {\n content: '';\n width: 100%;\n height: ${controlHeight};\n pointer-events: none;\n bottom: 0px;\n position: absolute;\n }\n\n :host([selectable]:not([selected]):hover)::before {\n background-color: ${fillHoverColor};\n }\n\n :host([selected])::before {\n background-color: ${fillSelectedColor};\n }\n\n :host([selected]:hover)::before {\n background-color: ${fillHoverSelectedColor};\n }\n\n :host(${focusVisible}) {\n outline: none;\n box-shadow:\n inset calc(2 * ${borderWidth}) calc(2 * ${borderWidth})\n ${borderHoverColor},\n inset calc(-2 * ${borderWidth}) calc(-2 * ${borderWidth})\n ${borderHoverColor};\n }\n\n .expand-collapse-button {\n flex: 0 0 auto;\n margin-left: max(\n calc(\n ${mediumPadding} +\n (var(--ni-private-table-row-indent-level) - 1) *\n ${controlHeight}\n ),\n 0px\n );\n }\n\n .spinner-container {\n flex: 0 0 auto;\n width: ${controlSlimHeight};\n height: ${controlSlimHeight};\n align-self: center;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-left: max(\n calc(\n ${mediumPadding} +\n (var(--ni-private-table-row-indent-level) - 1) *\n ${controlHeight}\n ),\n 0px\n );\n }\n\n .row-operations-container {\n flex: 0 0 auto;\n display: flex;\n }\n\n .selection-checkbox {\n margin-left: ${standardPadding};\n }\n\n .selection-checkbox::part(label) {\n padding-left: 0px;\n }\n\n .row-front-spacer {\n width: ${controlHeight};\n flex: 0 0 auto;\n }\n\n .row-front-spacer.reduced-size-spacer {\n width: ${mediumPadding};\n }\n\n .cell-container {\n display: grid;\n width: 100%;\n grid-auto-flow: column;\n grid-auto-columns: 1fr;\n grid-template-columns: var(--ni-private-table-row-grid-columns) auto;\n }\n\n .cell-container.nested-parent {\n margin-left: calc(\n (${controlHeight} * var(--ni-private-table-row-indent-level)) * -1\n );\n }\n\n nimble-table-cell {\n --ni-private-table-cell-action-menu-display: none;\n }\n\n nimble-table-cell[menu-open] {\n --ni-private-table-cell-action-menu-display: block;\n }\n\n nimble-table-cell${focusVisible} {\n --ni-private-table-cell-action-menu-display: block;\n }\n\n nimble-table-cell:first-of-type${focusVisible} {\n margin-left: calc(\n -1 * (${controlHeight} - ${smallPadding}) * var(--ni-private-table-cell-focus-offset-multiplier)\n );\n padding-left: calc(\n (${controlHeight} - ${mediumPadding}) *\n var(--ni-private-table-cell-focus-offset-multiplier) +\n ${mediumPadding}\n );\n }\n\n nimble-table-cell:first-of-type${focusVisible}::before {\n content: '';\n display: block;\n width: calc(\n (\n ${controlHeight} *\n var(--ni-private-table-cell-nesting-level) +\n ${smallPadding}\n ) * var(--ni-private-table-cell-focus-offset-multiplier)\n );\n height: ${controlHeight};\n }\n\n :host(:hover) nimble-table-cell {\n --ni-private-table-cell-action-menu-display: block;\n }\n\n :host([selected]) nimble-table-cell {\n --ni-private-table-cell-action-menu-display: block;\n }\n\n :host(${focusVisible}) nimble-table-cell {\n --ni-private-table-cell-action-menu-display: block;\n }\n`.withBehaviors(\n themeBehavior(\n Theme.color,\n css`\n :host([selectable]:not([selected]):hover)::before {\n background-color: ${hexToRgbaCssColor(White, 0.05)};\n }\n\n :host([selected])::before {\n background-color: ${hexToRgbaCssColor(White, 0.25)};\n }\n\n :host([selected]:hover)::before {\n background-color: ${hexToRgbaCssColor(White, 0.2)};\n }\n `\n )\n);\n"]}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { css } from '@microsoft/fast-element';
|
|
2
|
-
import { controlSlimHeight } from '../../../theme-provider/design-tokens';
|
|
3
2
|
export const styles = css `
|
|
4
3
|
:host {
|
|
5
4
|
align-self: center;
|
|
@@ -7,7 +6,6 @@ export const styles = css `
|
|
|
7
6
|
}
|
|
8
7
|
|
|
9
8
|
nimble-menu-button {
|
|
10
|
-
height: ${controlSlimHeight};
|
|
11
9
|
width: 100%;
|
|
12
10
|
}
|
|
13
11
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table-column/menu-button/cell-view/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../src/table-column/menu-button/cell-view/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAE9C,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;CAgBxB,CAAC","sourcesContent":["import { css } from '@microsoft/fast-element';\n\nexport const styles = css`\n :host {\n align-self: center;\n width: 100%;\n }\n\n nimble-menu-button {\n width: 100%;\n }\n\n .value-label {\n margin-right: auto;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n`;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ni/nimble-components",
|
|
3
|
-
"version": "30.1.
|
|
3
|
+
"version": "30.1.6",
|
|
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",
|