@momentum-design/components 0.127.0 → 0.127.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.
@@ -1,7 +1,8 @@
1
- import type { CSSResult, TemplateResult } from 'lit';
1
+ import type { CSSResult, PropertyValues, TemplateResult } from 'lit';
2
2
  import MenuItem from '../menuitem/menuitem.component';
3
3
  import type { IconNames } from '../icon/icon.types';
4
4
  import type { PopoverPlacement } from '../popover/popover.types';
5
+ import type { TooltipType } from '../tooltip/tooltip.types';
5
6
  import type { BadgeType } from './navmenuitem.types';
6
7
  /**
7
8
  * `mdc-navmenuitem` is a menuitem styled to work as a navigation tab.
@@ -129,6 +130,15 @@ declare class NavMenuItem extends MenuItem {
129
130
  * @default 'right'
130
131
  */
131
132
  tooltipPlacement: PopoverPlacement;
133
+ /**
134
+ * The type of tooltip to display.
135
+ * Options are 'description', 'label', or 'none'.
136
+ *
137
+ * Choose none to not apply any aria-attributes - this
138
+ * is useful if the navmenuitem has a aria-label already set.
139
+ * @default undefined
140
+ */
141
+ tooltipType?: TooltipType;
132
142
  /**
133
143
  * The appearance behavior of the tooltip.
134
144
  * Options are 'when-collapsed' (default) or 'always'.
@@ -163,6 +173,7 @@ declare class NavMenuItem extends MenuItem {
163
173
  constructor();
164
174
  connectedCallback(): void;
165
175
  disconnectedCallback(): void;
176
+ protected firstUpdated(_changedProperties: PropertyValues): void;
166
177
  protected updated(changedProperties: Map<string, any>): void;
167
178
  private renderDynamicTooltip;
168
179
  private removeTooltip;
@@ -138,6 +138,13 @@ class NavMenuItem extends MenuItem {
138
138
  super.disconnectedCallback();
139
139
  this.removeTooltip();
140
140
  }
141
+ firstUpdated(_changedProperties) {
142
+ super.firstUpdated(_changedProperties);
143
+ // if active on initial render, set aria-current
144
+ if (this.active && !this.disableAriaCurrent && !this.cannotActivate) {
145
+ this.setAttribute('aria-current', 'page');
146
+ }
147
+ }
141
148
  updated(changedProperties) {
142
149
  var _a;
143
150
  super.updated(changedProperties);
@@ -177,6 +184,9 @@ class NavMenuItem extends MenuItem {
177
184
  tooltip.setAttribute('triggerid', this.id);
178
185
  tooltip.setAttribute('show-arrow', '');
179
186
  tooltip.setAttribute('placement', this.tooltipPlacement);
187
+ if (this.tooltipType) {
188
+ tooltip.setAttribute('tooltip-type', this.tooltipType);
189
+ }
180
190
  tooltip.setAttribute('boundary-padding', ((_a = this.tooltipBoundaryPadding) === null || _a === void 0 ? void 0 : _a.toString()) || '0');
181
191
  // Set the slot attribute if the parent element has a slot.
182
192
  if (this.hasAttribute('slot')) {
@@ -322,6 +332,10 @@ __decorate([
322
332
  property({ type: String, reflect: true, attribute: 'tooltip-placement' }),
323
333
  __metadata("design:type", String)
324
334
  ], NavMenuItem.prototype, "tooltipPlacement", void 0);
335
+ __decorate([
336
+ property({ type: String, reflect: true, attribute: 'tooltip-type' }),
337
+ __metadata("design:type", String)
338
+ ], NavMenuItem.prototype, "tooltipType", void 0);
325
339
  __decorate([
326
340
  property({ type: String, reflect: true, attribute: 'tooltip-appearance' }),
327
341
  __metadata("design:type", String)
@@ -1,8 +1,8 @@
1
1
  declare const TAG_NAME: "mdc-tooltip";
2
2
  declare const TOOLTIP_TYPES: {
3
- DESCRIPTION: string;
4
- LABEL: string;
5
- NONE: string;
3
+ readonly DESCRIPTION: "description";
4
+ readonly LABEL: "label";
5
+ readonly NONE: "none";
6
6
  };
7
7
  declare const DEFAULTS: {
8
8
  readonly BACKDROP: false;
@@ -10,6 +10,6 @@ declare const DEFAULTS: {
10
10
  readonly OFFSET: 4;
11
11
  readonly PLACEMENT: "top";
12
12
  readonly SHOW_ARROW: true;
13
- readonly TOOLTIP_TYPE: string;
13
+ readonly TOOLTIP_TYPE: "description";
14
14
  };
15
15
  export { DEFAULTS, TAG_NAME, TOOLTIP_TYPES };