@momentum-design/components 0.104.7 → 0.104.8
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/browser/index.js +35 -31
- package/dist/browser/index.js.map +2 -2
- package/dist/components/menuitemcheckbox/menuitemcheckbox.component.js +17 -15
- package/dist/components/menuitemradio/menuitemradio.component.js +17 -15
- package/dist/components/menusection/menusection.component.d.ts +1 -0
- package/dist/components/menusection/menusection.component.js +2 -1
- package/dist/components/menusection/menusection.types.d.ts +2 -0
- package/dist/custom-elements.json +1162 -1157
- package/dist/react/index.d.ts +1 -1
- package/dist/react/index.js +1 -1
- package/dist/react/menusection/index.d.ts +2 -0
- package/dist/react/menusection/index.js +2 -0
- package/package.json +1 -1
@@ -154,23 +154,25 @@ class MenuItemCheckbox extends MenuItem {
|
|
154
154
|
}
|
155
155
|
render() {
|
156
156
|
return html `
|
157
|
-
<
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
157
|
+
<slot name="content">
|
158
|
+
<div part="leading">
|
159
|
+
${this.staticCheckbox()}
|
160
|
+
<slot name="leading-controls"></slot>
|
161
|
+
<div part="leading-text">
|
162
|
+
${this.getText('leading-text-primary-label', TYPE.BODY_MIDSIZE_REGULAR, this.label)}
|
163
|
+
${this.getText('leading-text-secondary-label', TYPE.BODY_SMALL_REGULAR, this.secondaryLabel)}
|
164
|
+
${this.getText('leading-text-tertiary-label', TYPE.BODY_SMALL_REGULAR, this.tertiaryLabel)}
|
165
|
+
</div>
|
164
166
|
</div>
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
167
|
+
<div part="trailing">
|
168
|
+
<div part="trailing-text">
|
169
|
+
${this.getText('trailing-text-side-header', TYPE.BODY_MIDSIZE_REGULAR, this.sideHeaderText)}
|
170
|
+
${this.getText('trailing-text-subline', TYPE.BODY_SMALL_REGULAR, this.sublineText)}
|
171
|
+
</div>
|
172
|
+
<slot name="trailing-controls"></slot>
|
173
|
+
${this.staticToggle()} ${this.getCheckmarkIcon()}
|
170
174
|
</div>
|
171
|
-
|
172
|
-
${this.staticToggle()} ${this.getCheckmarkIcon()}
|
173
|
-
</div>
|
175
|
+
</slot>
|
174
176
|
`;
|
175
177
|
}
|
176
178
|
}
|
@@ -163,23 +163,25 @@ class MenuItemRadio extends MenuItem {
|
|
163
163
|
}
|
164
164
|
render() {
|
165
165
|
return html `
|
166
|
-
<
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
166
|
+
<slot name="content">
|
167
|
+
<div part="leading">
|
168
|
+
${this.renderStaticRadio()}
|
169
|
+
<slot name="leading-controls"></slot>
|
170
|
+
<div part="leading-text">
|
171
|
+
${this.getText('leading-text-primary-label', TYPE.BODY_MIDSIZE_REGULAR, this.label)}
|
172
|
+
${this.getText('leading-text-secondary-label', TYPE.BODY_SMALL_REGULAR, this.secondaryLabel)}
|
173
|
+
${this.getText('leading-text-tertiary-label', TYPE.BODY_SMALL_REGULAR, this.tertiaryLabel)}
|
174
|
+
</div>
|
173
175
|
</div>
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
176
|
+
<div part="trailing">
|
177
|
+
<div part="trailing-text">
|
178
|
+
${this.getText('trailing-text-side-header', TYPE.BODY_MIDSIZE_REGULAR, this.sideHeaderText)}
|
179
|
+
${this.getText('trailing-text-subline', TYPE.BODY_SMALL_REGULAR, this.sublineText)}
|
180
|
+
</div>
|
181
|
+
<slot name="trailing-controls"></slot>
|
182
|
+
${this.renderCheckmarkIcon()}
|
179
183
|
</div>
|
180
|
-
|
181
|
-
${this.renderCheckmarkIcon()}
|
182
|
-
</div>
|
184
|
+
</slot>
|
183
185
|
`;
|
184
186
|
}
|
185
187
|
}
|
@@ -15,6 +15,7 @@ import type { IconNames } from '../icon/icon.types';
|
|
15
15
|
* @slot - Default slot for inserting `menuitem`, `menuitemcheckbox`, or `menuitemradio`
|
16
16
|
*
|
17
17
|
* @event change - (React: onChange) This event is dispatched when a `menuitemcheckbox`, or `menuitemradio` changes.
|
18
|
+
* @event action - (React: onAction) This event is dispatched when a `menuitem` selected.
|
18
19
|
*/
|
19
20
|
declare class MenuSection extends Component {
|
20
21
|
/**
|
@@ -30,6 +30,7 @@ import { DEFAULTS } from './menusection.constants';
|
|
30
30
|
* @slot - Default slot for inserting `menuitem`, `menuitemcheckbox`, or `menuitemradio`
|
31
31
|
*
|
32
32
|
* @event change - (React: onChange) This event is dispatched when a `menuitemcheckbox`, or `menuitemradio` changes.
|
33
|
+
* @event action - (React: onAction) This event is dispatched when a `menuitem` selected.
|
33
34
|
*/
|
34
35
|
class MenuSection extends Component {
|
35
36
|
constructor() {
|
@@ -106,7 +107,7 @@ class MenuSection extends Component {
|
|
106
107
|
render() {
|
107
108
|
return html `
|
108
109
|
${!this.hideHeaderText ? this.renderHeader() : null}
|
109
|
-
<slot></slot>
|
110
|
+
<slot part="container"></slot>
|
110
111
|
${this.showDivider ? html `<mdc-divider variant="${this.dividerVariant}" part="divider"></mdc-divider>` : null}
|
111
112
|
`;
|
112
113
|
}
|
@@ -1,6 +1,8 @@
|
|
1
1
|
import type { TypedCustomEvent } from '../../utils/types';
|
2
2
|
import type MenuItem from '../menuitem/menuitem.component';
|
3
3
|
export type MenuSectionChangeEvent = TypedCustomEvent<MenuItem>;
|
4
|
+
export type MenuSectionActionEvent = TypedCustomEvent<MenuItem>;
|
4
5
|
export interface Events {
|
5
6
|
onChangeEvent: MenuSectionChangeEvent;
|
7
|
+
onActionEvent: MenuSectionActionEvent;
|
6
8
|
}
|