@ni/nimble-components 9.0.1 → 9.0.4
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 +32 -7
- package/dist/all-components-bundle.js.map +1 -1
- package/dist/all-components-bundle.min.js +31 -7
- package/dist/all-components-bundle.min.js.map +1 -1
- package/dist/esm/menu/styles.js +7 -4
- package/dist/esm/menu/styles.js.map +1 -1
- package/dist/esm/menu-button/template.d.ts +3 -1
- package/dist/esm/menu-button/template.js +7 -5
- package/dist/esm/menu-button/template.js.map +1 -1
- package/dist/esm/menu-item/index.js +3 -1
- package/dist/esm/menu-item/index.js.map +1 -1
- package/dist/esm/menu-item/styles.js +24 -3
- package/dist/esm/menu-item/styles.js.map +1 -1
- package/dist/esm/nimble-components/src/menu-button/template.d.ts +3 -1
- package/dist/tokens.scss +1 -1
- package/package.json +1 -1
|
@@ -18056,6 +18056,9 @@
|
|
|
18056
18056
|
width: max-content;
|
|
18057
18057
|
box-shadow: 0px 2px 3px ${popupBoxShadowColor};
|
|
18058
18058
|
}
|
|
18059
|
+
:host([slot='submenu']) {
|
|
18060
|
+
margin: 0 calc(${smallPadding} * 2);
|
|
18061
|
+
}
|
|
18059
18062
|
::slotted(*) {
|
|
18060
18063
|
padding-left: 8px;
|
|
18061
18064
|
padding-right: 8px;
|
|
@@ -18063,7 +18066,7 @@
|
|
|
18063
18066
|
::slotted(hr) {
|
|
18064
18067
|
box-sizing: content-box;
|
|
18065
18068
|
height: 2px;
|
|
18066
|
-
margin:
|
|
18069
|
+
margin: ${smallPadding};
|
|
18067
18070
|
border: none;
|
|
18068
18071
|
background: ${borderColor};
|
|
18069
18072
|
opacity: 0.1;
|
|
@@ -18073,8 +18076,8 @@
|
|
|
18073
18076
|
font: ${groupHeaderFont};
|
|
18074
18077
|
color: ${groupHeaderFontColor};
|
|
18075
18078
|
text-transform: ${groupHeaderTextTransform};
|
|
18076
|
-
padding-top:
|
|
18077
|
-
padding-bottom:
|
|
18079
|
+
padding-top: ${smallPadding};
|
|
18080
|
+
padding-bottom: ${smallPadding};
|
|
18078
18081
|
}
|
|
18079
18082
|
`;
|
|
18080
18083
|
|
|
@@ -18108,7 +18111,8 @@
|
|
|
18108
18111
|
overflow: visible;
|
|
18109
18112
|
box-sizing: border-box;
|
|
18110
18113
|
height: ${controlHeight};
|
|
18111
|
-
grid-template-columns:
|
|
18114
|
+
grid-template-columns: 1fr;
|
|
18115
|
+
column-gap: 8px;
|
|
18112
18116
|
grid-template-rows: 1fr;
|
|
18113
18117
|
justify-items: start;
|
|
18114
18118
|
align-items: center;
|
|
@@ -18125,10 +18129,13 @@
|
|
|
18125
18129
|
outline: 2px solid ${borderHoverColor};
|
|
18126
18130
|
outline-offset: -2px;
|
|
18127
18131
|
}
|
|
18132
|
+
:host([expanded]) {
|
|
18133
|
+
background: ${fillHoverColor};
|
|
18134
|
+
}
|
|
18128
18135
|
:host(:hover) {
|
|
18129
18136
|
background: ${fillHoverColor};
|
|
18130
18137
|
}
|
|
18131
|
-
:host(:active) {
|
|
18138
|
+
:host(:active:not([expanded])) {
|
|
18132
18139
|
background: ${fillSelectedColor};
|
|
18133
18140
|
}
|
|
18134
18141
|
:host([disabled]) {
|
|
@@ -18139,9 +18146,14 @@
|
|
|
18139
18146
|
:host([disabled]:hover) {
|
|
18140
18147
|
background: transparent;
|
|
18141
18148
|
}
|
|
18149
|
+
:host(.indent-0[aria-haspopup='menu']) {
|
|
18150
|
+
grid-template-columns: 1fr ${iconSize};
|
|
18151
|
+
}
|
|
18142
18152
|
:host(.indent-1) {
|
|
18143
18153
|
grid-template-columns: ${iconSize} 1fr;
|
|
18144
|
-
|
|
18154
|
+
}
|
|
18155
|
+
:host(.indent-1[aria-haspopup='menu']) {
|
|
18156
|
+
grid-template-columns: ${iconSize} 1fr ${iconSize};
|
|
18145
18157
|
}
|
|
18146
18158
|
[part='start'] {
|
|
18147
18159
|
display: contents;
|
|
@@ -18157,6 +18169,18 @@
|
|
|
18157
18169
|
:host(.indent-1) .content {
|
|
18158
18170
|
grid-column: 2;
|
|
18159
18171
|
}
|
|
18172
|
+
.expand-collapse-glyph-container {
|
|
18173
|
+
grid-row: 1;
|
|
18174
|
+
fill: currentcolor;
|
|
18175
|
+
width: ${iconSize};
|
|
18176
|
+
height: ${iconSize};
|
|
18177
|
+
}
|
|
18178
|
+
:host(.indent-0) .expand-collapse-glyph-container {
|
|
18179
|
+
grid-column: 2;
|
|
18180
|
+
}
|
|
18181
|
+
:host(.indent-1) .expand-collapse-glyph-container {
|
|
18182
|
+
grid-column: 3;
|
|
18183
|
+
}
|
|
18160
18184
|
`;
|
|
18161
18185
|
|
|
18162
18186
|
/**
|
|
@@ -18177,7 +18201,8 @@
|
|
|
18177
18201
|
baseName: 'menu-item',
|
|
18178
18202
|
baseClass: MenuItem$1,
|
|
18179
18203
|
template: menuItemTemplate,
|
|
18180
|
-
styles: styles$d
|
|
18204
|
+
styles: styles$d,
|
|
18205
|
+
expandCollapseGlyph: arrowExpanderRight16X16.data
|
|
18181
18206
|
});
|
|
18182
18207
|
DesignSystem.getOrCreate().withPrefix('nimble').register(nimbleMenuItem());
|
|
18183
18208
|
|