@loadsmart/miranda-react 3.9.0 → 3.11.0

package/dist/index.d.ts

@@ -30,7 +30,7 @@ import { FilePickerFile } from '@loadsmart/miranda-wc';
 import { FileStatus } from '@loadsmart/miranda-wc';
 import { ForwardRefExoticComponent } from 'react';
 import { HeaderTabs as HeaderTabs_2 } from '@loadsmart/miranda-wc';
-import { IconName } from '@loadsmart/miranda-wc';
+import { IconName } from '@loadsmart/miranda-icons';
 import { InputHTMLAttributes } from 'react';
 import { JustifyContentValue } from '@loadsmart/miranda-wc';
 import { LinkReferrerPolicy } from '@loadsmart/miranda-wc';
@@ -87,6 +87,9 @@ import { TimelineItemVariant } from '@loadsmart/miranda-wc';
 import { ToggleSize } from '@loadsmart/miranda-wc';
 import { TooltipPlacement } from '@loadsmart/miranda-wc';
 import { TooltipTrigger } from '@loadsmart/miranda-wc';
+import { TopNavigation as TopNavigation_2 } from '@loadsmart/miranda-wc';
+import { TopNavigationActions as TopNavigationActions_2 } from '@loadsmart/miranda-wc';
+import { TopNavigationItem as TopNavigationItem_2 } from '@loadsmart/miranda-wc';
 import { TypographyVariant } from '@loadsmart/miranda-wc';
 import { Accordion as WCAccordion } from '@loadsmart/miranda-wc';
 import { AccordionContent as WCAccordionContent } from '@loadsmart/miranda-wc';
@@ -869,6 +872,58 @@ export declare type SidebarProps = ComponentProps<typeof Sidebar>;
 
 export declare type SidebarSideProps = Omit<BoxProps, 'slot'>;
 
+export declare const SideNavigation: ReactWebComponent<WCSideNavigation, {}> & {
+    Body: ReactWebComponent<WCSideNavigationBody, {}>;
+    Divider: ReactWebComponent<WCSideNavigationDivider, {}>;
+    Footer: ReactWebComponent<WCSideNavigationFooter, {}>;
+    Header: ReactWebComponent<WCSideNavigationHeader, {}>;
+    Item: ForwardRefExoticComponent<Omit<SideNavigationItemProps, "ref"> & RefAttributes<WCSideNavigationItem>>;
+    SubNav: ReactWebComponent<WCSideNavigationSubNav, {}>;
+    SubNavContent: ReactWebComponent<WCSideNavigationSubNavContent, {}>;
+    SubNavItem: ReactWebComponent<WCSideNavigationSubNavItem, {}>;
+    SubNavTitle: ReactWebComponent<WCSideNavigationSubNavTitle, {}>;
+};
+
+export declare const SideNavigationBody: ReactWebComponent<WCSideNavigationBody, {}>;
+
+export declare type SideNavigationBodyProps = ComponentProps<typeof SideNavigationBody>;
+
+export declare const SideNavigationDivider: ReactWebComponent<WCSideNavigationDivider, {}>;
+
+export declare type SideNavigationDividerProps = ComponentProps<typeof SideNavigationDivider>;
+
+export declare const SideNavigationFooter: ReactWebComponent<WCSideNavigationFooter, {}>;
+
+export declare type SideNavigationFooterProps = ComponentProps<typeof SideNavigationFooter>;
+
+export declare const SideNavigationHeader: ReactWebComponent<WCSideNavigationHeader, {}>;
+
+export declare type SideNavigationHeaderProps = ComponentProps<typeof SideNavigationHeader>;
+
+export declare const SideNavigationItem: default_2.ForwardRefExoticComponent<Omit<SideNavigationItemProps, "ref"> & default_2.RefAttributes<WCSideNavigationItem>>;
+
+export declare interface SideNavigationItemProps extends ComponentProps<typeof WiredSideNavigationItem> {
+    leading?: ReactNode;
+}
+
+export declare type SideNavigationProps = ComponentProps<typeof SideNavigation>;
+
+export declare const SideNavigationSubNav: ReactWebComponent<WCSideNavigationSubNav, {}>;
+
+export declare const SideNavigationSubNavContent: ReactWebComponent<WCSideNavigationSubNavContent, {}>;
+
+export declare type SideNavigationSubNavContentProps = ComponentProps<typeof SideNavigationSubNavContent>;
+
+export declare const SideNavigationSubNavItem: ReactWebComponent<WCSideNavigationSubNavItem, {}>;
+
+export declare type SideNavigationSubNavItemProps = ComponentProps<typeof SideNavigationSubNavItem>;
+
+export declare type SideNavigationSubNavProps = ComponentProps<typeof SideNavigationSubNav>;
+
+export declare const SideNavigationSubNavTitle: ReactWebComponent<WCSideNavigationSubNavTitle, {}>;
+
+export declare type SideNavigationSubNavTitleProps = ComponentProps<typeof SideNavigationSubNavTitle>;
+
 export declare const SpinnerWheel: ReactWebComponent<WCSpinnerWheel, {}>;
 
 export declare type SpinnerWheelProps = ComponentProps<typeof SpinnerWheel>;
@@ -1203,6 +1258,21 @@ export declare type TooltipProps = ComponentProps<typeof WiredTooltip> & {
 
 export { TooltipTrigger }
 
+export declare const TopNavigation: ReactWebComponent<TopNavigation_2, {}> & {
+    Actions: ReactWebComponent<TopNavigationActions_2, {}>;
+    Item: ReactWebComponent<TopNavigationItem_2, {}>;
+};
+
+export declare const TopNavigationActions: ReactWebComponent<TopNavigationActions_2, {}>;
+
+export declare type TopNavigationActionsProps = ComponentProps<typeof TopNavigationActions>;
+
+export declare const TopNavigationItem: ReactWebComponent<TopNavigationItem_2, {}>;
+
+export declare type TopNavigationItemProps = ComponentProps<typeof TopNavigationItem>;
+
+export declare type TopNavigationProps = ComponentProps<typeof TopNavigation>;
+
 export { TypographyVariant }
 
 export declare function useSteps(): {
@@ -1646,6 +1716,8 @@ onChange: EventName<MirandaChangeEvent<WCSelect>>;
 
 declare const WiredSelectOption: ReactWebComponent<WCSelectOption, {}>;
 
+declare const WiredSideNavigationItem: ReactWebComponent<WCSideNavigationItem, {}>;
+
 declare const WiredTab: ReactWebComponent<WCTab, {}>;
 
 declare const WiredTag: ReactWebComponent<WCTag, {}>;
@@ -1674,37 +1746,40 @@ export { }
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-divider-margin-top'?: string;
-        '--m-divider-margin-bottom'?: string;
-        '--m-divider-margin-y'?: string;
+        '--m-card-body-padding'?: string;
+        '--m-card-border-top'?: string;
+        '--m-card-border-left'?: string;
+        '--m-card-border-bottom'?: string;
+        '--m-card-border-right'?: string;
+        '--m-card-border-radius'?: string;
     }
 }
 
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-icon-size'?: string;
-        '--m-icon-color'?: string;
+        '--m-divider-margin-top'?: string;
+        '--m-divider-margin-bottom'?: string;
+        '--m-divider-margin-y'?: string;
     }
 }
 
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-card-body-padding'?: string;
-        '--m-card-border-top'?: string;
-        '--m-card-border-left'?: string;
-        '--m-card-border-bottom'?: string;
-        '--m-card-border-right'?: string;
-        '--m-card-border-radius'?: string;
+        '--m-icon-size'?: string;
+        '--m-icon-color'?: string;
     }
 }
 
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-text-display'?: string;
-        '--m-text-max-width'?: string;
+        '--m-table-border-radius'?: string;
+        '--m-table-border-top-left-radius'?: string;
+        '--m-table-border-top-right-radius'?: string;
+        '--m-table-border-bottom-left-radius'?: string;
+        '--m-table-border-bottom-right-radius'?: string;
     }
 }
 
@@ -1734,10 +1809,7 @@ declare module 'react' {
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-table-border-radius'?: string;
-        '--m-table-border-top-left-radius'?: string;
-        '--m-table-border-top-right-radius'?: string;
-        '--m-table-border-bottom-left-radius'?: string;
-        '--m-table-border-bottom-right-radius'?: string;
+        '--m-text-display'?: string;
+        '--m-text-max-width'?: string;
     }
 }

package/dist/index.js

@@ -1,4 +1,4 @@
-import { AccordionTitle as AccordionTitle$1, AccordionContent as AccordionContent$1, Accordion as Accordion$1, BackButton as BackButton$1, Badge as Badge$1, BannerActionPrimary as BannerActionPrimary$1, BannerActions as BannerActions$1, BannerActionSecondary as BannerActionSecondary$1, BannerDescription as BannerDescription$1, BannerIcon as BannerIcon$1, BannerTitle as BannerTitle$1, Banner as Banner$1, Button as Button$1, CardTitle as CardTitle$1, CardSubtitle as CardSubtitle$1, CardBody as CardBody$1, CardDivider as CardDivider$1, CardActionPrimary as CardActionPrimary$1, CardActionSecondary as CardActionSecondary$1, CardActionTertiary as CardActionTertiary$1, CardFooter as CardFooter$1, Card as Card$1, Checkbox as Checkbox$1, DialogActionPrimary as DialogActionPrimary$1, DialogActionSecondary as DialogActionSecondary$1, DialogActionTertiary as DialogActionTertiary$1, DialogActions as DialogActions$1, DialogBody as DialogBody$1, DialogClose as DialogClose$1, DialogFooter as DialogFooter$1, DialogHeader as DialogHeader$1, Dialog as Dialog$1, Divider as Divider$1, DrawerActionPrimary as DrawerActionPrimary$1, DrawerActionSecondary as DrawerActionSecondary$1, DrawerActionTertiary as DrawerActionTertiary$1, DrawerActions as DrawerActions$1, DrawerBody as DrawerBody$1, DrawerClose as DrawerClose$1, DrawerHeader as DrawerHeader$1, Drawer as Drawer$1, DropdownItem as DropdownItem$1, DropdownDivider as DropdownDivider$1, DropdownMenu as DropdownMenu$1, DropdownTrigger as DropdownTrigger$1, Dropdown as Dropdown$1, EmptyStateIllustration as EmptyStateIllustration$1, EmptyStateHeader as EmptyStateHeader$1, EmptyStateMessage as EmptyStateMessage$1, EmptyStateAction as EmptyStateAction$1, EmptyState as EmptyState$1, FieldLabel as FieldLabel$1, FieldHint as FieldHint$1, Field as Field$1, HeaderActions as HeaderActions$1, HeaderContent as HeaderContent$1, HeaderTitle as HeaderTitle$1, SubHeader as SubHeader$1, HeaderTabs as HeaderTabs$1, Header as Header$1, Icon as Icon$1, LabeledValueLabel as LabeledValueLabel$1, LabeledValueValue as LabeledValueValue$1, LabeledValue as LabeledValue$1, Box as Box$1, Group as Group$1, Stack as Stack$1, Grid as Grid$1, Sidebar as Sidebar$1, Switcher as Switcher$1, Container as Container$1, Row as Row$1, Column as Column$1, Link as Link$1, Body as Body$1, PageContent as PageContent$1, Pagination as Pagination$1, ProgressBar as ProgressBar$1, ProgressBarCountdown as ProgressBarCountdown$1, Radio as Radio$1, RadioGroup as RadioGroup$1, SectionTitle as SectionTitle$1, Section as Section$1, SelectOption as SelectOption$1, Select as Select$1, SpinnerWheel as SpinnerWheel$1, Step as Step$1, Steps as Steps$1, Switch as Switch$1, TableHead as TableHead$2, TableBody as TableBody$2, TableFoot as TableFoot$2, TableRow as TableRow$2, TableCell as TableCell$2, TableToolbar as TableToolbar$1, TableHeadCell as TableHeadCell$2, TableFeedback as TableFeedback$1, TableActions as TableActions$1, TableSelectionCell as TableSelectionCell$1, Table as Table$2, TableHeadV2, TableBodyV2, TableFootV2, TableRowV2, TableCellV2, TableHeadCellV2, TableRowSelectV2, TableRowExpandV2, TableV2, TableLayoutToolbar as TableLayoutToolbar$1, TableLayoutFeedback as TableLayoutFeedback$1, TableLayoutActions as TableLayoutActions$1, TableLayout as TableLayout$1, Tab as Tab$1, TabPanel as TabPanel$1, Tabs as Tabs$1, Tag as Tag$1, ActionableTag as ActionableTag$1, Text as Text$1, TextArea as TextArea$1, TextField as TextField$1, TimelineItem as TimelineItem$1, TimelineExpandableItem as TimelineExpandableItem$1, TimelineItemBody as TimelineItemBody$1, TimelineItemFooter as TimelineItemFooter$1, TimelineItemHeader as TimelineItemHeader$1, TimelineItemHeaderSubtitle as TimelineItemHeaderSubtitle$1, TimelineItemHeaderTitle as TimelineItemHeaderTitle$1, TimelineItemIcon as TimelineItemIcon$1, Timeline as Timeline$1, Toggle as Toggle$1, ToggleGroup as ToggleGroup$1, Tooltip as Tooltip$1, LogoLoader as LogoLoader$1, DotsLoader as DotsLoader$1, FileItem, FilePicker as FilePicker$1 } from "@loadsmart/miranda-wc";
+import { AccordionTitle as AccordionTitle$1, AccordionContent as AccordionContent$1, Accordion as Accordion$1, BackButton as BackButton$1, Badge as Badge$1, BannerActionPrimary as BannerActionPrimary$1, BannerActions as BannerActions$1, BannerActionSecondary as BannerActionSecondary$1, BannerDescription as BannerDescription$1, BannerIcon as BannerIcon$1, BannerTitle as BannerTitle$1, Banner as Banner$1, Button as Button$1, CardTitle as CardTitle$1, CardSubtitle as CardSubtitle$1, CardBody as CardBody$1, CardDivider as CardDivider$1, CardActionPrimary as CardActionPrimary$1, CardActionSecondary as CardActionSecondary$1, CardActionTertiary as CardActionTertiary$1, CardFooter as CardFooter$1, Card as Card$1, Checkbox as Checkbox$1, DialogActionPrimary as DialogActionPrimary$1, DialogActionSecondary as DialogActionSecondary$1, DialogActionTertiary as DialogActionTertiary$1, DialogActions as DialogActions$1, DialogBody as DialogBody$1, DialogClose as DialogClose$1, DialogFooter as DialogFooter$1, DialogHeader as DialogHeader$1, Dialog as Dialog$1, Divider as Divider$1, DrawerActionPrimary as DrawerActionPrimary$1, DrawerActionSecondary as DrawerActionSecondary$1, DrawerActionTertiary as DrawerActionTertiary$1, DrawerActions as DrawerActions$1, DrawerBody as DrawerBody$1, DrawerClose as DrawerClose$1, DrawerHeader as DrawerHeader$1, Drawer as Drawer$1, DropdownItem as DropdownItem$1, DropdownDivider as DropdownDivider$1, DropdownMenu as DropdownMenu$1, DropdownTrigger as DropdownTrigger$1, Dropdown as Dropdown$1, EmptyStateIllustration as EmptyStateIllustration$1, EmptyStateHeader as EmptyStateHeader$1, EmptyStateMessage as EmptyStateMessage$1, EmptyStateAction as EmptyStateAction$1, EmptyState as EmptyState$1, FieldLabel as FieldLabel$1, FieldHint as FieldHint$1, Field as Field$1, HeaderActions as HeaderActions$1, HeaderContent as HeaderContent$1, HeaderTitle as HeaderTitle$1, SubHeader as SubHeader$1, HeaderTabs as HeaderTabs$1, Header as Header$1, Icon as Icon$1, LabeledValueLabel as LabeledValueLabel$1, LabeledValueValue as LabeledValueValue$1, LabeledValue as LabeledValue$1, Box as Box$1, Group as Group$1, Stack as Stack$1, Grid as Grid$1, Sidebar as Sidebar$1, Switcher as Switcher$1, Container as Container$1, Row as Row$1, Column as Column$1, Link as Link$1, Body as Body$1, PageContent as PageContent$1, Pagination as Pagination$1, ProgressBar as ProgressBar$1, ProgressBarCountdown as ProgressBarCountdown$1, Radio as Radio$1, RadioGroup as RadioGroup$1, SectionTitle as SectionTitle$1, Section as Section$1, SelectOption as SelectOption$1, Select as Select$1, SideNavigationBody as SideNavigationBody$1, SideNavigationDivider as SideNavigationDivider$1, SideNavigationFooter as SideNavigationFooter$1, SideNavigationHeader as SideNavigationHeader$1, SideNavigationItem as SideNavigationItem$1, SideNavigationSubNav as SideNavigationSubNav$1, SideNavigationSubNavContent as SideNavigationSubNavContent$1, SideNavigationSubNavItem as SideNavigationSubNavItem$1, SideNavigationSubNavTitle as SideNavigationSubNavTitle$1, SideNavigation as SideNavigation$1, SpinnerWheel as SpinnerWheel$1, Step as Step$1, Steps as Steps$1, Switch as Switch$1, TableHead as TableHead$2, TableBody as TableBody$2, TableFoot as TableFoot$2, TableRow as TableRow$2, TableCell as TableCell$2, TableToolbar as TableToolbar$1, TableHeadCell as TableHeadCell$2, TableFeedback as TableFeedback$1, TableActions as TableActions$1, TableSelectionCell as TableSelectionCell$1, Table as Table$2, TableHeadV2, TableBodyV2, TableFootV2, TableRowV2, TableCellV2, TableHeadCellV2, TableRowSelectV2, TableRowExpandV2, TableV2, TableLayoutToolbar as TableLayoutToolbar$1, TableLayoutFeedback as TableLayoutFeedback$1, TableLayoutActions as TableLayoutActions$1, TableLayout as TableLayout$1, Tab as Tab$1, TabPanel as TabPanel$1, Tabs as Tabs$1, Tag as Tag$1, ActionableTag as ActionableTag$1, Text as Text$1, TextArea as TextArea$1, TextField as TextField$1, TimelineItem as TimelineItem$1, TimelineExpandableItem as TimelineExpandableItem$1, TimelineItemBody as TimelineItemBody$1, TimelineItemFooter as TimelineItemFooter$1, TimelineItemHeader as TimelineItemHeader$1, TimelineItemHeaderSubtitle as TimelineItemHeaderSubtitle$1, TimelineItemHeaderTitle as TimelineItemHeaderTitle$1, TimelineItemIcon as TimelineItemIcon$1, Timeline as Timeline$1, Toggle as Toggle$1, ToggleGroup as ToggleGroup$1, Tooltip as Tooltip$1, TopNavigationActions as TopNavigationActions$1, TopNavigationItem as TopNavigationItem$1, TopNavigation as TopNavigation$1, LogoLoader as LogoLoader$1, DotsLoader as DotsLoader$1, FileItem, FilePicker as FilePicker$1 } from "@loadsmart/miranda-wc";
 import { DIALOG_SIZES, DIALOG_VARIANTS, DRAWER_SIZES, EMPTY_STATE_VARIANTS, Accordion, AccordionContent, AccordionTitle, ActionableTag, BackButton, Badge, Banner, BannerActionPrimary, BannerActionSecondary, BannerActions, BannerDescription, BannerIcon, BannerTitle, Body, Box, Button, Card, CardActionPrimary, CardActionSecondary, CardActionTertiary, CardBody, CardDivider, CardFooter, CardSubtitle, CardTitle, CaretButton, Checkbox, CloseButton, Column, Container, Dialog, DialogActionPrimary, DialogActionSecondary, DialogActionTertiary, DialogActions, DialogBody, DialogClose, DialogFooter, DialogHeader, Divider, Drawer, DrawerActionPrimary, DrawerActionSecondary, DrawerActionTertiary, DrawerActions, DrawerBody, DrawerClose, DrawerHeader, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, EmptyState, EmptyStateAction, EmptyStateHeader, EmptyStateIllustration, EmptyStateMessage, Field, FieldHint, FieldLabel, FilePicker, Grid, Group, Header, HeaderActions, HeaderContent, HeaderTitle, Icon, Label, LabeledValue, LabeledValueLabel, LabeledValueValue, Link, LogoLoader, PageContent, Pagination, ProgressBar, ProgressBarCountdown, Radio, RadioGroup, Row, Section, SectionTitle, Select, SelectOption, SideNavigation, SideNavigationBody, SideNavigationDivider, SideNavigationFooter, SideNavigationHeader, SideNavigationItem, SideNavigationSubNav, SideNavigationSubNavContent, SideNavigationSubNavItem, SideNavigationSubNavTitle, Sidebar, SpinnerWheel, Stack, Step, Steps, SubHeader, Switch, Switcher, Tab, TabPanel, Table, TableActions, TableBody, TableCell, TableFeedback, TableFoot, TableHead, TableHeadCell, TableRow, TableToolbar, TableV2 as TableV22, Tabs, Tag, Text, TextArea, TextField, Timeline, TimelineExpandableItem, TimelineItem, TimelineItemBody, TimelineItemFooter, TimelineItemHeader, TimelineItemHeaderSubtitle, TimelineItemHeaderTitle, TimelineItemIcon, Toggle, ToggleGroup, Tooltip } from "@loadsmart/miranda-wc";
 import * as React from "react";
 import React__default, { forwardRef, useState, useCallback, Children, isValidElement, cloneElement } from "react";
@@ -745,6 +745,71 @@ function Select2(props) {
   );
 }
 Select2.Option = SelectOption2;
+const SideNavigationBody2 = createComponent({
+  tagName: "m-side-navigation-body",
+  elementClass: SideNavigationBody$1,
+  displayName: "SideNavigationBody"
+});
+const SideNavigationDivider2 = createComponent({
+  tagName: "m-side-navigation-divider",
+  elementClass: SideNavigationDivider$1,
+  displayName: "SideNavigationDivider"
+});
+const SideNavigationFooter2 = createComponent({
+  tagName: "m-side-navigation-footer",
+  elementClass: SideNavigationFooter$1,
+  displayName: "SideNavigationFooter"
+});
+const SideNavigationHeader2 = createComponent({
+  tagName: "m-side-navigation-header",
+  elementClass: SideNavigationHeader$1,
+  displayName: "SideNavigationHeader"
+});
+const WiredSideNavigationItem = createComponent({
+  tagName: "m-side-navigation-item",
+  elementClass: SideNavigationItem$1,
+  displayName: "SideNavigationItem"
+});
+const SideNavigationItem2 = forwardRef((props, ref) => {
+  const { leading, children, ...rest } = props;
+  return /* @__PURE__ */ React__default.createElement(WiredSideNavigationItem, { ...rest, ref }, leading != null && /* @__PURE__ */ React__default.createElement("span", { slot: "leading" }, leading), children);
+});
+const SideNavigationSubNav2 = createComponent({
+  tagName: "m-side-navigation-sub-nav",
+  elementClass: SideNavigationSubNav$1,
+  displayName: "SideNavigationSubNav"
+});
+const SideNavigationSubNavContent2 = createComponent({
+  tagName: "m-side-navigation-sub-nav-content",
+  elementClass: SideNavigationSubNavContent$1,
+  displayName: "SideNavigationSubNavContent"
+});
+const SideNavigationSubNavItem2 = createComponent({
+  tagName: "m-side-navigation-sub-nav-item",
+  elementClass: SideNavigationSubNavItem$1,
+  displayName: "SideNavigationSubNavItem"
+});
+const SideNavigationSubNavTitle2 = createComponent({
+  tagName: "m-side-navigation-sub-nav-title",
+  elementClass: SideNavigationSubNavTitle$1,
+  displayName: "SideNavigationSubNavTitle"
+});
+const SideNavigation2 = createComponent({
+  tagName: "m-side-navigation",
+  elementClass: SideNavigation$1,
+  displayName: "SideNavigation",
+  subComponents: {
+    Body: SideNavigationBody2,
+    Divider: SideNavigationDivider2,
+    Footer: SideNavigationFooter2,
+    Header: SideNavigationHeader2,
+    Item: SideNavigationItem2,
+    SubNav: SideNavigationSubNav2,
+    SubNavContent: SideNavigationSubNavContent2,
+    SubNavItem: SideNavigationSubNavItem2,
+    SubNavTitle: SideNavigationSubNavTitle2
+  }
+});
 const SpinnerWheel2 = createComponent({
   tagName: "m-spinner-wheel",
   elementClass: SpinnerWheel$1,
@@ -1246,6 +1311,25 @@ function Tooltip2(props) {
   })();
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(WiredTooltip, { anchor: anchorId, ...rest }, message), childWithId);
 }
+const TopNavigationActions = createComponent({
+  tagName: "m-top-navigation-actions",
+  elementClass: TopNavigationActions$1,
+  displayName: "TopNavigationActions"
+});
+const TopNavigationItem = createComponent({
+  tagName: "m-top-navigation-item",
+  elementClass: TopNavigationItem$1,
+  displayName: "TopNavigationItem"
+});
+const TopNavigation = createComponent({
+  tagName: "m-top-navigation",
+  elementClass: TopNavigation$1,
+  displayName: "TopNavigation",
+  subComponents: {
+    Actions: TopNavigationActions,
+    Item: TopNavigationItem
+  }
+});
 const LogoLoader2 = createComponent({
   tagName: "m-logo-loader",
   elementClass: LogoLoader$1,
@@ -1317,6 +1401,16 @@ export {
   Row2 as Row,
   Section2 as Section,
   Select2 as Select,
+  SideNavigation2 as SideNavigation,
+  SideNavigationBody2 as SideNavigationBody,
+  SideNavigationDivider2 as SideNavigationDivider,
+  SideNavigationFooter2 as SideNavigationFooter,
+  SideNavigationHeader2 as SideNavigationHeader,
+  SideNavigationItem2 as SideNavigationItem,
+  SideNavigationSubNav2 as SideNavigationSubNav,
+  SideNavigationSubNavContent2 as SideNavigationSubNavContent,
+  SideNavigationSubNavItem2 as SideNavigationSubNavItem,
+  SideNavigationSubNavTitle2 as SideNavigationSubNavTitle,
   Sidebar2 as Sidebar,
   SpinnerWheel2 as SpinnerWheel,
   Stack2 as Stack,
@@ -1368,6 +1462,9 @@ export {
   Toggle2 as Toggle,
   ToggleGroup2 as ToggleGroup,
   Tooltip2 as Tooltip,
+  TopNavigation,
+  TopNavigationActions,
+  TopNavigationItem,
   Accordion as WCAccordion,
   AccordionContent as WCAccordionContent,
   AccordionTitle as WCAccordionTitle,

package/dist/tokens.d.ts

@@ -7,37 +7,40 @@ export { }
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-divider-margin-top'?: string;
-        '--m-divider-margin-bottom'?: string;
-        '--m-divider-margin-y'?: string;
+        '--m-card-body-padding'?: string;
+        '--m-card-border-top'?: string;
+        '--m-card-border-left'?: string;
+        '--m-card-border-bottom'?: string;
+        '--m-card-border-right'?: string;
+        '--m-card-border-radius'?: string;
     }
 }
 
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-icon-size'?: string;
-        '--m-icon-color'?: string;
+        '--m-divider-margin-top'?: string;
+        '--m-divider-margin-bottom'?: string;
+        '--m-divider-margin-y'?: string;
     }
 }
 
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-card-body-padding'?: string;
-        '--m-card-border-top'?: string;
-        '--m-card-border-left'?: string;
-        '--m-card-border-bottom'?: string;
-        '--m-card-border-right'?: string;
-        '--m-card-border-radius'?: string;
+        '--m-icon-size'?: string;
+        '--m-icon-color'?: string;
     }
 }
 
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-text-display'?: string;
-        '--m-text-max-width'?: string;
+        '--m-table-border-radius'?: string;
+        '--m-table-border-top-left-radius'?: string;
+        '--m-table-border-top-right-radius'?: string;
+        '--m-table-border-bottom-left-radius'?: string;
+        '--m-table-border-bottom-right-radius'?: string;
     }
 }
 
@@ -67,10 +70,7 @@ declare module 'react' {
 
 declare module 'react' {
     interface CSSProperties {
-        '--m-table-border-radius'?: string;
-        '--m-table-border-top-left-radius'?: string;
-        '--m-table-border-top-right-radius'?: string;
-        '--m-table-border-bottom-left-radius'?: string;
-        '--m-table-border-bottom-right-radius'?: string;
+        '--m-text-display'?: string;
+        '--m-text-max-width'?: string;
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@loadsmart/miranda-react",
-	"version": "3.9.0",
+	"version": "3.11.0",
 	"description": "React component library based on Miranda Web Components",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",
@@ -49,8 +49,8 @@
 	"dependencies": {
 		"@figma/code-connect": "^1.3.3",
 		"@lit/react": "^1.0.5",
-		"@loadsmart/miranda-tokens": "4.9.0",
-		"@loadsmart/miranda-wc": "3.9.0",
+		"@loadsmart/miranda-tokens": "4.11.0",
+		"@loadsmart/miranda-wc": "3.11.0",
 		"react-is": "^18.3.1"
 	},
 	"directories": {