@momentum-design/components 0.104.6 → 0.104.8

package/dist/components/combobox/combobox.component.d.ts

@@ -0,0 +1,16 @@
+import { CSSResult } from 'lit';
+import { Component } from '../../models';
+/**
+ * combobox component, which ...
+ *
+ * @tagname mdc-combobox
+ *
+ * @slot default - This is a default/unnamed slot
+ *
+ * @cssproperty --custom-property-name - Description of the CSS custom property
+ */
+declare class Combobox extends Component {
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: Array<CSSResult>;
+}
+export default Combobox;

package/dist/components/combobox/combobox.component.js

@@ -0,0 +1,20 @@
+import { html } from 'lit';
+import { Component } from '../../models';
+import styles from './combobox.styles';
+/**
+ * combobox component, which ...
+ *
+ * @tagname mdc-combobox
+ *
+ * @slot default - This is a default/unnamed slot
+ *
+ * @cssproperty --custom-property-name - Description of the CSS custom property
+ */
+class Combobox extends Component {
+    render() {
+        return html `<p>This is a dummy combobox component!</p>
+      <slot></slot>`;
+    }
+}
+Combobox.styles = [...Component.styles, ...styles];
+export default Combobox;

package/dist/components/combobox/combobox.constants.d.ts

@@ -0,0 +1,2 @@
+declare const TAG_NAME: "mdc-combobox";
+export { TAG_NAME };

package/dist/components/combobox/combobox.constants.js

@@ -0,0 +1,3 @@
+import utils from '../../utils/tag-name';
+const TAG_NAME = utils.constructTagName('combobox');
+export { TAG_NAME };

package/dist/components/combobox/combobox.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult[];
+export default _default;

package/dist/components/combobox/combobox.styles.js

@@ -0,0 +1,7 @@
+import { css } from 'lit';
+const styles = css `
+  :host {
+    display: block;
+  }
+`;
+export default [styles];

package/dist/components/combobox/combobox.types.d.ts

@@ -0,0 +1,3 @@
+interface Events {
+}
+export type { Events };

package/dist/components/combobox/combobox.types.js

@@ -0,0 +1,2 @@
+// import type { ValueOf } from '../../utils/types';
+export {};

package/dist/components/combobox/index.d.ts

@@ -0,0 +1,7 @@
+import Combobox from './combobox.component';
+declare global {
+    interface HTMLElementTagNameMap {
+        ['mdc-combobox']: Combobox;
+    }
+}
+export default Combobox;

package/dist/components/combobox/index.js

@@ -0,0 +1,4 @@
+import Combobox from './combobox.component';
+import { TAG_NAME } from './combobox.constants';
+Combobox.register(TAG_NAME);
+export default Combobox;

package/dist/components/menuitemcheckbox/menuitemcheckbox.component.js

@@ -154,23 +154,25 @@ class MenuItemCheckbox extends MenuItem {
     }
     render() {
         return html `
-      <div part="leading">
-        ${this.staticCheckbox()}
-        <slot name="leading-controls"></slot>
-        <div part="leading-text">
-          ${this.getText('leading-text-primary-label', TYPE.BODY_MIDSIZE_REGULAR, this.label)}
-          ${this.getText('leading-text-secondary-label', TYPE.BODY_SMALL_REGULAR, this.secondaryLabel)}
-          ${this.getText('leading-text-tertiary-label', TYPE.BODY_SMALL_REGULAR, this.tertiaryLabel)}
+      <slot name="content">
+        <div part="leading">
+          ${this.staticCheckbox()}
+          <slot name="leading-controls"></slot>
+          <div part="leading-text">
+            ${this.getText('leading-text-primary-label', TYPE.BODY_MIDSIZE_REGULAR, this.label)}
+            ${this.getText('leading-text-secondary-label', TYPE.BODY_SMALL_REGULAR, this.secondaryLabel)}
+            ${this.getText('leading-text-tertiary-label', TYPE.BODY_SMALL_REGULAR, this.tertiaryLabel)}
+          </div>
         </div>
-      </div>
-      <div part="trailing">
-        <div part="trailing-text">
-          ${this.getText('trailing-text-side-header', TYPE.BODY_MIDSIZE_REGULAR, this.sideHeaderText)}
-          ${this.getText('trailing-text-subline', TYPE.BODY_SMALL_REGULAR, this.sublineText)}
+        <div part="trailing">
+          <div part="trailing-text">
+            ${this.getText('trailing-text-side-header', TYPE.BODY_MIDSIZE_REGULAR, this.sideHeaderText)}
+            ${this.getText('trailing-text-subline', TYPE.BODY_SMALL_REGULAR, this.sublineText)}
+          </div>
+          <slot name="trailing-controls"></slot>
+          ${this.staticToggle()} ${this.getCheckmarkIcon()}
         </div>
-        <slot name="trailing-controls"></slot>
-        ${this.staticToggle()} ${this.getCheckmarkIcon()}
-      </div>
+      </slot>
     `;
     }
 }

package/dist/components/menuitemradio/menuitemradio.component.js

@@ -163,23 +163,25 @@ class MenuItemRadio extends MenuItem {
     }
     render() {
         return html `
-      <div part="leading">
-        ${this.renderStaticRadio()}
-        <slot name="leading-controls"></slot>
-        <div part="leading-text">
-          ${this.getText('leading-text-primary-label', TYPE.BODY_MIDSIZE_REGULAR, this.label)}
-          ${this.getText('leading-text-secondary-label', TYPE.BODY_SMALL_REGULAR, this.secondaryLabel)}
-          ${this.getText('leading-text-tertiary-label', TYPE.BODY_SMALL_REGULAR, this.tertiaryLabel)}
+      <slot name="content">
+        <div part="leading">
+          ${this.renderStaticRadio()}
+          <slot name="leading-controls"></slot>
+          <div part="leading-text">
+            ${this.getText('leading-text-primary-label', TYPE.BODY_MIDSIZE_REGULAR, this.label)}
+            ${this.getText('leading-text-secondary-label', TYPE.BODY_SMALL_REGULAR, this.secondaryLabel)}
+            ${this.getText('leading-text-tertiary-label', TYPE.BODY_SMALL_REGULAR, this.tertiaryLabel)}
+          </div>
         </div>
-      </div>
-      <div part="trailing">
-        <div part="trailing-text">
-          ${this.getText('trailing-text-side-header', TYPE.BODY_MIDSIZE_REGULAR, this.sideHeaderText)}
-          ${this.getText('trailing-text-subline', TYPE.BODY_SMALL_REGULAR, this.sublineText)}
+        <div part="trailing">
+          <div part="trailing-text">
+            ${this.getText('trailing-text-side-header', TYPE.BODY_MIDSIZE_REGULAR, this.sideHeaderText)}
+            ${this.getText('trailing-text-subline', TYPE.BODY_SMALL_REGULAR, this.sublineText)}
+          </div>
+          <slot name="trailing-controls"></slot>
+          ${this.renderCheckmarkIcon()}
         </div>
-        <slot name="trailing-controls"></slot>
-        ${this.renderCheckmarkIcon()}
-      </div>
+      </slot>
     `;
     }
 }

package/dist/components/menusection/menusection.component.d.ts

@@ -15,6 +15,7 @@ import type { IconNames } from '../icon/icon.types';
  * @slot - Default slot for inserting `menuitem`, `menuitemcheckbox`, or `menuitemradio`
  *
  * @event change - (React: onChange) This event is dispatched when a `menuitemcheckbox`, or `menuitemradio` changes.
+ * @event action - (React: onAction) This event is dispatched when a `menuitem` selected.
  */
 declare class MenuSection extends Component {
     /**

package/dist/components/menusection/menusection.component.js

@@ -30,6 +30,7 @@ import { DEFAULTS } from './menusection.constants';
  * @slot - Default slot for inserting `menuitem`, `menuitemcheckbox`, or `menuitemradio`
  *
  * @event change - (React: onChange) This event is dispatched when a `menuitemcheckbox`, or `menuitemradio` changes.
+ * @event action - (React: onAction) This event is dispatched when a `menuitem` selected.
  */
 class MenuSection extends Component {
     constructor() {
@@ -106,7 +107,7 @@ class MenuSection extends Component {
     render() {
         return html `
       ${!this.hideHeaderText ? this.renderHeader() : null}
-      <slot></slot>
+      <slot part="container"></slot>
       ${this.showDivider ? html `<mdc-divider variant="${this.dividerVariant}" part="divider"></mdc-divider>` : null}
     `;
     }

package/dist/components/menusection/menusection.types.d.ts

@@ -1,6 +1,8 @@
 import type { TypedCustomEvent } from '../../utils/types';
 import type MenuItem from '../menuitem/menuitem.component';
 export type MenuSectionChangeEvent = TypedCustomEvent<MenuItem>;
+export type MenuSectionActionEvent = TypedCustomEvent<MenuItem>;
 export interface Events {
     onChangeEvent: MenuSectionChangeEvent;
+    onActionEvent: MenuSectionActionEvent;
 }