@momentum-design/components 0.104.14 → 0.104.16

package/dist/react/index.d.ts

@@ -1,5 +1,5 @@
-export { default as Accordion } from './accordion';
 export { default as AccordionButton } from './accordionbutton';
+export { default as Accordion } from './accordion';
 export { default as AccordionGroup } from './accordiongroup';
 export { default as AlertChip } from './alertchip';
 export { default as Animation } from './animation';
@@ -26,9 +26,9 @@ export { default as Divider } from './divider';
 export { default as FilterChip } from './filterchip';
 export { default as FormfieldGroup } from './formfieldgroup';
 export { default as FormfieldWrapper } from './formfieldwrapper';
-export { default as Icon } from './icon';
 export { default as IconProvider } from './iconprovider';
 export { default as Input } from './input';
+export { default as Icon } from './icon';
 export { default as InputChip } from './inputchip';
 export { default as Link } from './link';
 export { default as LinkButton } from './linkbutton';
@@ -73,8 +73,8 @@ export { default as Text } from './text';
 export { default as Textarea } from './textarea';
 export { default as ThemeProvider } from './themeprovider';
 export { default as Toast } from './toast';
-export { default as Toggle } from './toggle';
-export { default as ToggleTip } from './toggletip';
 export { default as Tooltip } from './tooltip';
+export { default as ToggleTip } from './toggletip';
+export { default as Toggle } from './toggle';
 export { default as Typewriter } from './typewriter';
 export { default as VirtualizedList } from './virtualizedlist';

package/dist/react/index.js

@@ -1,5 +1,5 @@
-export { default as Accordion } from './accordion';
 export { default as AccordionButton } from './accordionbutton';
+export { default as Accordion } from './accordion';
 export { default as AccordionGroup } from './accordiongroup';
 export { default as AlertChip } from './alertchip';
 export { default as Animation } from './animation';
@@ -26,9 +26,9 @@ export { default as Divider } from './divider';
 export { default as FilterChip } from './filterchip';
 export { default as FormfieldGroup } from './formfieldgroup';
 export { default as FormfieldWrapper } from './formfieldwrapper';
-export { default as Icon } from './icon';
 export { default as IconProvider } from './iconprovider';
 export { default as Input } from './input';
+export { default as Icon } from './icon';
 export { default as InputChip } from './inputchip';
 export { default as Link } from './link';
 export { default as LinkButton } from './linkbutton';
@@ -73,8 +73,8 @@ export { default as Text } from './text';
 export { default as Textarea } from './textarea';
 export { default as ThemeProvider } from './themeprovider';
 export { default as Toast } from './toast';
-export { default as Toggle } from './toggle';
-export { default as ToggleTip } from './toggletip';
 export { default as Tooltip } from './tooltip';
+export { default as ToggleTip } from './toggletip';
+export { default as Toggle } from './toggle';
 export { default as Typewriter } from './typewriter';
 export { default as VirtualizedList } from './virtualizedlist';

package/dist/react/sidenavigation/index.d.ts

@@ -48,13 +48,33 @@ import Component from '../../components/sidenavigation';
  * @slot fixed-section - Slot for the fixed content area of the side navigation.
  * @slot brand-logo - Slot for the brand logo (e.g., icon or img).
  *
+ * @csspart side-navigation-container - The main container wrapping the entire side navigation.
+ * @csspart scrollable-section - The scrollable section of the side navigation.
+ * @csspart fixed-section - The fixed section of the side navigation.
+ * @csspart separator - The divider between the scrollable and fixed sections.
+ * @csspart brand-logo-container - The container wrapping the brand logo and footer text.
+ * @csspart footer-text - The footer text label in the fixed section.
+ * @csspart vertical-divider - The vertical divider between the scrollable and fixed sections.
+ * @csspart vertical-divider-button - The button inside the vertical divider used to toggle expand/collapse.
+ *
+ * @event toggle - (React: onToggle) Dispatched when the grabber button is clicked to expand/collapse the sidenavigation.
+ * @event activechange - (React: onActiveChange) Dispatched when the active state of a nested navmenuitem changes.
+ *
  * @cssproperty --mdc-sidenavigation-expanded-width - width of the sideNavigation when expanded
- * @cssproperty --mdc-sidenavigation-collapsed-width - width of the sideNavigation when collpased
+ * @cssproperty --mdc-sidenavigation-collapsed-width - width of the sideNavigation when collapsed
+ * @cssproperty --mdc-sidenavigation-vertical-divider-button-z-index - z-index of the vertical divider button
  */
 declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
-    onActiveChange: EventName<import("../../utils/types").TypedCustomEvent<Component, {
+    onToggle: EventName<CustomEvent<{
+        expanded: boolean;
+    }> & {
+        target: Component;
+    }>;
+    onActiveChange: EventName<CustomEvent<{
         navId: string;
         active: boolean;
-    }>>;
+    }> & {
+        target: Component;
+    }>;
 }>;
 export default reactWrapper;

package/dist/react/sidenavigation/index.js

@@ -50,14 +50,28 @@ import { TAG_NAME } from '../../components/sidenavigation/sidenavigation.constan
  * @slot fixed-section - Slot for the fixed content area of the side navigation.
  * @slot brand-logo - Slot for the brand logo (e.g., icon or img).
  *
+ * @csspart side-navigation-container - The main container wrapping the entire side navigation.
+ * @csspart scrollable-section - The scrollable section of the side navigation.
+ * @csspart fixed-section - The fixed section of the side navigation.
+ * @csspart separator - The divider between the scrollable and fixed sections.
+ * @csspart brand-logo-container - The container wrapping the brand logo and footer text.
+ * @csspart footer-text - The footer text label in the fixed section.
+ * @csspart vertical-divider - The vertical divider between the scrollable and fixed sections.
+ * @csspart vertical-divider-button - The button inside the vertical divider used to toggle expand/collapse.
+ *
+ * @event toggle - (React: onToggle) Dispatched when the grabber button is clicked to expand/collapse the sidenavigation.
+ * @event activechange - (React: onActiveChange) Dispatched when the active state of a nested navmenuitem changes.
+ *
  * @cssproperty --mdc-sidenavigation-expanded-width - width of the sideNavigation when expanded
- * @cssproperty --mdc-sidenavigation-collapsed-width - width of the sideNavigation when collpased
+ * @cssproperty --mdc-sidenavigation-collapsed-width - width of the sideNavigation when collapsed
+ * @cssproperty --mdc-sidenavigation-vertical-divider-button-z-index - z-index of the vertical divider button
  */
 const reactWrapper = createComponent({
     tagName: TAG_NAME,
     elementClass: Component,
     react: React,
     events: {
+        onToggle: 'toggle',
         onActiveChange: 'activechange',
     },
     displayName: 'SideNavigation',

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@momentum-design/components",
   "packageManager": "yarn@3.2.4",
-  "version": "0.104.14",
+  "version": "0.104.16",
   "engines": {
     "node": ">=20.0.0",
     "npm": ">=8.0.0"