@altinn/altinn-components 0.14.2 → 0.15.0

package/dist/types/lib/components/LayoutAction/LayoutAction.stories.d.ts

@@ -8,23 +8,11 @@ declare const meta: {
     args: {
         title: string;
         menu: {
-            items: ({
+            items: {
                 id: string;
-                icon: "arrow-redo";
+                icon: string;
                 title: string;
-            } | {
-                id: string;
-                icon: "eye";
-                title: string;
-            } | {
-                id: string;
-                icon: "archive";
-                title: string;
-            } | {
-                id: string;
-                icon: "trash";
-                title: string;
-            })[];
+            }[];
         };
     };
 };

package/dist/types/lib/components/List/List.d.ts

@@ -1,5 +1,5 @@
 import { ListBaseProps, ListItemColor, ListItemProps, ListItemSize, ListItemTheme } from '..';
-export interface ListProps extends ListBaseProps {
+export interface ListProps extends Omit<ListBaseProps, 'children'> {
     items?: ListItemProps[];
     defaultItemColor?: ListItemColor;
     defaultItemTheme?: ListItemTheme;

package/dist/types/lib/components/List/ListBase.d.ts

@@ -1,5 +1,9 @@
-import { FlexProps } from '..';
-export interface ListBaseProps extends FlexProps {
-    direction?: 'col';
+import { ReactNode } from 'react';
+import { Color, FlexPadding, FlexSpacing } from '..';
+export interface ListBaseProps {
+    children: ReactNode;
+    spacing?: FlexSpacing;
+    padding?: FlexPadding;
+    color?: Color;
 }
-export declare const ListBase: ({ direction, spacing, children, ...rest }: ListBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ListBase: ({ spacing, children, ...rest }: ListBaseProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/{Header/HeaderLogo.stories.d.ts → List/ListBase.stories.d.ts}

@@ -1,10 +1,12 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ className, as, title, href }: import('./HeaderLogo').HeaderLogoProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ spacing, children, ...rest }: import('./ListBase').ListBaseProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
-    args: {};
+    args: {
+        children: import("react/jsx-runtime").JSX.Element;
+    };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;

package/dist/types/lib/components/List/ListItem.d.ts

@@ -1,8 +1,7 @@
 import { ReactElement, ReactNode } from 'react';
 import { AvatarGroupProps, AvatarProps } from '../Avatar';
 import { BadgeProps } from '../Badge';
-import { ContextMenuProps } from '../ContextMenu';
-import { IconName } from '../Icon';
+import { IconName, IconProps } from '../Icon';
 import { ListItemBaseProps } from './ListItemBase';
 import { ListItemHeaderProps } from './ListItemHeader';
 export interface ListItemProps extends ListItemBaseProps, ListItemHeaderProps {
@@ -17,25 +16,21 @@ export interface ListItemProps extends ListItemBaseProps, ListItemHeaderProps {
     /** Optional description */
     description?: string;
     /** List item icon */
-    icon?: IconName;
+    icon?: IconName | IconProps | ReactNode | undefined;
     /** List item avatar */
     avatar?: AvatarProps;
     /** List item avatarGroup */
     avatarGroup?: AvatarGroupProps;
-    /** Optional text indicating behaviour */
-    linkText?: string;
     /** Optional icon indicating behaviour */
-    linkIcon?: IconName;
+    linkIcon?: IconName | undefined;
     /** Custom label */
     label?: ReactNode | (() => ReactElement);
     /** Optional badge */
-    badge?: BadgeProps | undefined;
-    /** Optional context menu */
-    menu?: ContextMenuProps;
+    badge?: BadgeProps | ReactNode | undefined;
 }
 export interface ListItemInputProps extends ListItemProps {
     id: string;
     /** Child items */
     items?: ListItemProps[];
 }
-export declare const ListItem: ({ className, color, loading, collapsible, expanded, size, icon, avatar, avatarGroup, title, description, badge, linkText, linkIcon, label, menu, select, controls, children, ...rest }: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ListItem: ({ className, variant, color, theme, shadow, loading, collapsible, expanded, size, icon, avatar, avatarGroup, title, description, badge, linkIcon, label, select, controls, children, ...rest }: ListItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/List/ListItem.stories.d.ts

@@ -2,23 +2,28 @@ import { StoryObj } from '@storybook/react';
 import { ListItemProps } from '../';
 declare const meta: {
     title: string;
-    component: ({ className, color, loading, collapsible, expanded, size, icon, avatar, avatarGroup, title, description, badge, linkText, linkIcon, label, menu, select, controls, children, ...rest }: ListItemProps) => import("react/jsx-runtime").JSX.Element;
-    tags: string[];
+    component: ({ className, variant, color, theme, shadow, loading, collapsible, expanded, size, icon, avatar, avatarGroup, title, description, badge, linkIcon, label, select, controls, children, ...rest }: ListItemProps) => import("react/jsx-runtime").JSX.Element;
     parameters: {};
     args: {
         id: string;
+        as: "button";
         title: string;
-        description: string;
-        size: "sm";
+        onClick: () => void;
     };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
-export declare const MediaTypes: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
-export declare const Loading: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
-export declare const Controls: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const IconTypes: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Avatars: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AvatarGroups: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Badges: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const LoadingState: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
 export declare const Selectable: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
-export declare const Themes: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
-export declare const Sizes: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
 export declare const Collapsible: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Theme: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Size: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const OverridingIcon: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const OverridingBadge: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const OverridingLabel: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CustomControls: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/List/ListItemBase.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { ElementType, KeyboardEventHandler, ReactNode } from 'react';
 import { Color } from '..';
 export type ListItemSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type ListItemVariant = 'solid' | 'dotted';
@@ -6,6 +6,12 @@ export type ListItemShadow = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type ListItemColor = Color;
 export type ListItemTheme = 'transparent' | 'default' | 'subtle' | 'surface' | 'base';
 export interface ListItemBaseProps {
+    interactive?: boolean;
+    as?: ElementType;
+    href?: string;
+    onClick?: () => void;
+    onKeyPress?: KeyboardEventHandler;
+    tabIndex?: number;
     color?: ListItemColor;
     theme?: ListItemTheme;
     variant?: ListItemVariant;
@@ -20,4 +26,4 @@ export interface ListItemBaseProps {
     expanded?: boolean;
     children?: ReactNode;
 }
-export declare const ListItemBase: ({ size, variant, color, theme, shadow, loading, disabled, hidden, active, selected, expanded, className, children, }: ListItemBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ListItemBase: ({ interactive, as, href, onClick, onKeyPress, tabIndex, size, variant, color, theme, shadow, loading, disabled, hidden, active, selected, expanded, className, children, }: ListItemBaseProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/List/ListItemControls.d.ts

@@ -1,14 +1,7 @@
 import { ReactNode } from 'react';
-import { BadgeProps } from '../Badge';
-import { ContextMenuProps } from '../ContextMenu';
-import { IconName } from '../Icon';
 interface ListItemControlsProps {
     className?: string;
-    badge?: BadgeProps | undefined;
-    linkText?: string;
-    linkIcon?: IconName;
-    menu?: ContextMenuProps;
     children?: ReactNode;
 }
-export declare const ListItemControls: ({ className, badge, linkText, linkIcon, menu, children }: ListItemControlsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ListItemControls: ({ className, children }: ListItemControlsProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/types/lib/components/List/ListItemHeader.d.ts

@@ -1,11 +1,5 @@
 import { ReactNode } from 'react';
-import { AvatarGroupProps, AvatarProps } from '../Avatar';
-import { BadgeProps } from '../Badge';
-import { ContextMenuProps } from '../ContextMenu';
-import { IconName } from '../Icon';
-import { ListItemSize } from './ListItemBase';
-import { ListItemLinkProps } from './ListItemLink';
-import { ListItemSelectProps } from './ListItemSelect';
+import { AvatarGroupProps, AvatarProps, BadgeProps, IconName, IconProps, ListItemLinkProps, ListItemSelectProps, ListItemSize } from '..';
 export interface ListItemHeaderProps extends ListItemLinkProps {
     /** Header is loading */
     loading?: boolean;
@@ -24,22 +18,18 @@ export interface ListItemHeaderProps extends ListItemLinkProps {
     /** Description */
     description?: string;
     /** List item icon */
-    icon?: IconName;
+    icon?: IconName | IconProps | ReactNode | undefined;
     /** List item avatar */
     avatar?: AvatarProps;
     /** List item avatarGroup */
     avatarGroup?: AvatarGroupProps;
-    /** Optional text indicating behaviour */
-    linkText?: string;
     /** Optional icon indicating behaviour */
-    linkIcon?: IconName;
+    linkIcon?: IconName | undefined;
     /** Optional badge */
-    badge?: BadgeProps | undefined;
-    /** Context menu */
-    menu?: ContextMenuProps;
+    badge?: BadgeProps | ReactNode | undefined;
     /** Custom controls */
     controls?: ReactNode;
     /** Custom label */
     children?: ReactNode;
 }
-export declare const ListItemHeader: ({ as, loading, disabled, select, href, onClick, onKeyPress, tabIndex, collapsible, expanded, size, title, description, icon, avatar, avatarGroup, linkIcon, linkText, badge, menu, controls, className, children, }: ListItemHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ListItemHeader: ({ as, loading, disabled, select, href, onClick, onKeyPress, tabIndex, size, title, description, icon, avatar, avatarGroup, linkIcon, badge, controls, className, children, }: ListItemHeaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/List/ListItemIcon.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+import { AvatarGroupProps, AvatarProps } from '../Avatar';
+import { IconName, IconProps } from '../Icon';
+export type ListItemIconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export interface ListItemIconProps {
+    loading?: boolean;
+    size?: ListItemIconSize;
+    icon?: IconProps | IconName | ReactNode;
+    avatar?: AvatarProps;
+    avatarGroup?: AvatarGroupProps;
+    children?: ReactNode;
+}
+export declare const ListItemIcon: ({ loading, size, icon, avatar, avatarGroup, children }: ListItemIconProps) => import("react/jsx-runtime").JSX.Element | null | undefined;

package/dist/types/lib/components/List/ListItemLink.d.ts

@@ -1,6 +1,7 @@
 import { ElementType, KeyboardEventHandler, ReactNode } from 'react';
 import { ListItemSize } from './ListItemBase';
 export interface ListItemLinkProps {
+    interactive?: boolean;
     size?: ListItemSize;
     as?: ElementType;
     href?: string;
@@ -13,4 +14,4 @@ export interface ListItemLinkProps {
     className?: string;
     children?: ReactNode;
 }
-export declare const ListItemLink: ({ size, as, loading, disabled, selected, href, onClick, onKeyPress, tabIndex, className, children, }: ListItemLinkProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ListItemLink: ({ interactive, size, as, loading, disabled, selected, href, onClick, onKeyPress, tabIndex, className, children, }: ListItemLinkProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/List/MultilevelList.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta } from '@storybook/react';
+import { List } from '../';
+declare const meta: Meta<typeof List>;
+export default meta;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/List/Specimens.stories.d.ts

@@ -0,0 +1,13 @@
+import { ListItemProps } from '../';
+declare const meta: {
+    title: string;
+    component: ({ className, variant, color, theme, shadow, loading, collapsible, expanded, size, icon, avatar, avatarGroup, title, description, badge, linkIcon, label, select, controls, children, ...rest }: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+    parameters: {};
+    args: {
+        id: string;
+        title: string;
+    };
+};
+export default meta;
+export declare const Theme: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Size: (args: ListItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/List/index.d.ts

@@ -2,7 +2,7 @@ export * from './ListItemBase';
 export * from './ListItemLink';
 export * from './ListItemHeader';
 export * from './ListItemLabel';
-export * from './ListItemMedia';
+export * from './ListItemIcon';
 export * from './ListItemControls';
 export * from './ListItemSelect';
 export * from './ListItem';

package/dist/types/lib/components/Menu/Menu.d.ts

@@ -5,4 +5,4 @@ export interface MenuProps extends MenuItemsProps {
     color?: MenuItemColor;
     theme?: MenuTheme;
 }
-export declare const Menu: ({ color, theme, defaultItemColor, defaultItemTheme, defaultItemSize, groups, items, search, }: MenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Menu: ({ color, theme, defaultItemColor, defaultItemTheme, defaultItemSize, defaultIconTheme, groups, items, search, }: MenuProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Menu/Menu.stories.d.ts

@@ -1,35 +1,12 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ color, theme, defaultItemColor, defaultItemTheme, defaultItemSize, groups, items, search, }: import('./Menu').MenuProps) => import("react/jsx-runtime").JSX.Element;
-    tags: string[];
+    component: ({ color, theme, defaultItemColor, defaultItemTheme, defaultItemSize, defaultIconTheme, groups, items, search, }: import('./Menu').MenuProps) => import("react/jsx-runtime").JSX.Element;
     parameters: {};
     args: {};
 };
 export default meta;
 type Story = StoryObj<typeof meta>;
-export declare const GlobalMenu: Story;
-export declare const CollapsibleGlobalMenu: Story;
-export declare const ExpandedGlobalMenu: Story;
-export declare const DrilldownMenu: Story;
-export declare const InboxMenu: Story;
-export declare const InboxMenuWithShortcuts: {
-    args: {
-        groups: {
-            shortcuts: {
-                title: string;
-                defaultItemTheme: string;
-            };
-        };
-        items: (import('./MenuItem.tsx').MenuItemProps | {
-            id: string;
-            groupId: string;
-            icon: string;
-            title: string;
-        })[];
-    };
-};
-export declare const PersonMenu: Story;
-export declare const CompanyMenu: Story;
-export declare const AccountMenu: Story;
-export declare const AccountMenuWithSearch: Story;
+export declare const Default: Story;
+export declare const CreatingHiearchy: Story;
+export declare const NestingItems: Story;

package/dist/types/lib/components/Menu/MenuBase.d.ts

@@ -1,12 +1,13 @@
 import { ElementType, ReactNode } from 'react';
-import { MenuItemColor } from './MenuItemBase.tsx';
+import { Color } from '..';
+export type MenuColor = Color;
 export type MenuTheme = 'transparent' | 'default' | 'subtle';
 export type MenuListRole = 'presentation' | 'group';
 export type MenuListItemRole = 'presentation' | 'group' | 'separator';
 export interface MenuBaseProps {
     as?: ElementType;
     theme?: MenuTheme;
-    color?: MenuItemColor;
+    color?: MenuColor;
     className?: string;
     children?: ReactNode;
 }
@@ -24,6 +25,6 @@ export interface MenuListItemProps {
     className?: string;
     children?: ReactNode;
 }
-export declare const MenuBase: ({ as, theme, className, children }: MenuBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuBase: ({ as, color, theme, className, children }: MenuBaseProps) => import("react/jsx-runtime").JSX.Element;
 export declare const MenuList: ({ as, role, expanded, className, children }: MenuListProps) => import("react/jsx-runtime").JSX.Element;
 export declare const MenuListItem: ({ as, role, expanded, className, children, }: MenuListItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Menu/MenuItem.d.ts

@@ -1,14 +1,14 @@
 import { ElementType, ReactNode } from 'react';
-import { AvatarGroupProps, AvatarProps, BadgeProps, IconName, IconVariant } from '..';
-import { MenuItemColor, MenuItemSize, MenuItemTheme } from './MenuItemBase';
+import { AvatarGroupProps, AvatarProps, BadgeProps, IconName, IconProps, IconTheme } from '..';
+import { MenuItemColor, MenuItemSize, MenuItemTheme } from './';
 export interface MenuItemProps {
     id: string;
     type?: string;
     tabIndex?: number;
     as?: ElementType;
+    size?: MenuItemSize;
     color?: MenuItemColor;
     theme?: MenuItemTheme;
-    size?: MenuItemSize;
     href?: string;
     onClick?: () => void;
     hidden?: boolean;
@@ -20,16 +20,16 @@ export interface MenuItemProps {
     groupId?: string | number;
     title?: string;
     description?: string;
-    icon?: IconName;
-    iconVariant?: IconVariant;
+    icon?: IconName | IconProps | ReactNode;
+    iconTheme?: IconTheme;
+    iconBadge?: BadgeProps | undefined;
     avatar?: AvatarProps;
     avatarGroup?: AvatarGroupProps;
     badge?: BadgeProps | undefined;
-    alertBadge?: BadgeProps | undefined;
     linkIcon?: IconName;
     linkText?: string;
     className?: string;
     label?: ReactNode;
     items?: MenuItemProps[];
 }
-export declare const MenuItem: ({ as, size, color, theme, collapsible, expanded, icon, iconVariant, avatar, avatarGroup, title, description, badge, alertBadge, linkText, linkIcon, label, ...rest }: MenuItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuItem: ({ as, size, color, theme, collapsible, expanded, icon, iconTheme, iconBadge, avatar, avatarGroup, title, description, badge, linkText, linkIcon, label, ...rest }: MenuItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Menu/MenuItemBase.d.ts

@@ -2,7 +2,7 @@ import { ElementType, KeyboardEventHandler, ReactNode } from 'react';
 import { BadgeProps, Color, IconName } from '..';
 export type MenuItemColor = Color;
 export type MenuItemSize = 'xs' | 'sm' | 'md' | 'lg';
-export type MenuItemTheme = 'transparent' | 'default' | 'surface' | 'base';
+export type MenuItemTheme = 'default' | 'subtle' | 'surface' | 'base';
 export interface MenuItemBaseProps {
     as?: ElementType;
     color?: MenuItemColor;

package/dist/types/lib/components/Menu/MenuItemIcon.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+import { BadgeProps, IconOrAvatarProps } from '..';
+interface MenuItemIconProps extends IconOrAvatarProps {
+    iconBadge?: BadgeProps | undefined;
+    children?: ReactNode;
+}
+export declare const MenuItemIcon: ({ size, icon, iconTheme, iconBadge, avatar, avatarGroup, children, }: MenuItemIconProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/types/lib/components/Menu/MenuItems.d.ts

@@ -1,11 +1,12 @@
-import { MenuItemColor, MenuItemProps, MenuItemSize, MenuItemTheme } from '../';
+import { IconTheme, MenuItemColor, MenuItemProps, MenuItemSize, MenuItemTheme } from '../';
 import { MenuSearchProps } from './MenuSearch';
 export interface MenuGroupProps {
     title?: string;
     divider?: boolean;
-    defaultItemColor?: MenuItemColor;
     defaultItemSize?: MenuItemSize;
+    defaultItemColor?: MenuItemColor;
     defaultItemTheme?: MenuItemTheme;
+    defaultIconTheme?: IconTheme;
 }
 export type MenuItemGroups = Record<string, MenuGroupProps>;
 export interface MenuItemsProps {
@@ -14,8 +15,9 @@ export interface MenuItemsProps {
     search?: MenuSearchProps;
     items: MenuItemProps[];
     groups?: MenuItemGroups;
-    defaultItemColor?: MenuItemColor;
     defaultItemSize?: MenuItemSize;
+    defaultItemColor?: MenuItemColor;
     defaultItemTheme?: MenuItemTheme;
+    defaultIconTheme?: IconTheme;
 }
-export declare const MenuItems: ({ level, expanded, search, items, groups, defaultItemColor, defaultItemTheme, defaultItemSize, }: MenuItemsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuItems: ({ level, expanded, search, items, groups, defaultItemSize, defaultItemColor, defaultItemTheme, defaultIconTheme, }: MenuItemsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Menu/Patterns.stories.d.ts

@@ -0,0 +1,72 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ color, theme, defaultItemColor, defaultItemTheme, defaultItemSize, defaultIconTheme, groups, items, search, }: import('./Menu').MenuProps) => import("react/jsx-runtime").JSX.Element;
+    parameters: {};
+    args: {};
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const InboxMenu: Story;
+export declare const CompanyInboxMenu: {
+    args: {
+        color: string;
+        theme: string;
+        level?: number;
+        expanded?: boolean;
+        search?: import('./MenuSearch').MenuSearchProps;
+        items: import('./MenuItem').MenuItemProps[];
+        groups?: import('./MenuItems').MenuItemGroups;
+        defaultItemSize?: import('./MenuItemBase').MenuItemSize;
+        defaultItemColor?: import('./MenuItemBase').MenuItemColor;
+        defaultItemTheme?: import('./MenuItemBase').MenuItemTheme;
+        defaultIconTheme?: import('..').IconTheme;
+    };
+};
+export declare const PersonInboxMenu: {
+    args: {
+        color: string;
+        theme: string;
+        level?: number;
+        expanded?: boolean;
+        search?: import('./MenuSearch').MenuSearchProps;
+        items: import('./MenuItem').MenuItemProps[];
+        groups?: import('./MenuItems').MenuItemGroups;
+        defaultItemSize?: import('./MenuItemBase').MenuItemSize;
+        defaultItemColor?: import('./MenuItemBase').MenuItemColor;
+        defaultItemTheme?: import('./MenuItemBase').MenuItemTheme;
+        defaultIconTheme?: import('..').IconTheme;
+    };
+};
+export declare const CompanyMenu: Story;
+export declare const NeutralCompanyMenu: {
+    args: {
+        color: string;
+        theme?: import('./MenuBase').MenuTheme;
+        level?: number;
+        expanded?: boolean;
+        search?: import('./MenuSearch').MenuSearchProps;
+        items: import('./MenuItem').MenuItemProps[];
+        groups?: import('./MenuItems').MenuItemGroups;
+        defaultItemSize?: import('./MenuItemBase').MenuItemSize;
+        defaultItemColor?: import('./MenuItemBase').MenuItemColor;
+        defaultItemTheme?: import('./MenuItemBase').MenuItemTheme;
+        defaultIconTheme?: import('..').IconTheme;
+    };
+};
+export declare const PersonMenu: Story;
+export declare const NeutralPersonMenu: {
+    args: {
+        color: string;
+        theme?: import('./MenuBase').MenuTheme;
+        level?: number;
+        expanded?: boolean;
+        search?: import('./MenuSearch').MenuSearchProps;
+        items: import('./MenuItem').MenuItemProps[];
+        groups?: import('./MenuItems').MenuItemGroups;
+        defaultItemSize?: import('./MenuItemBase').MenuItemSize;
+        defaultItemColor?: import('./MenuItemBase').MenuItemColor;
+        defaultItemTheme?: import('./MenuItemBase').MenuItemTheme;
+        defaultIconTheme?: import('..').IconTheme;
+    };
+};

package/dist/types/lib/components/Menu/index.d.ts

@@ -1,6 +1,6 @@
 export * from './MenuItemBase';
 export * from './MenuItemLabel';
-export * from './MenuItemMedia';
+export * from './MenuItemIcon';
 export * from './MenuItem';
 export * from './MenuInputField';
 export * from './MenuOption';

package/dist/types/lib/components/Page/PageHeader.d.ts

@@ -1,9 +1,14 @@
-import { AvatarGroupProps, AvatarProps, IconName, SectionProps } from '..';
+import { AvatarGroupProps, AvatarProps, IconName, PageTabsProps, SectionProps } from '..';
+export type PageHeaderVariant = 'card' | undefined;
+export type PageHeaderSize = 'lg' | 'xl';
 export interface PageHeaderProps extends SectionProps {
+    variant?: PageHeaderVariant;
+    size?: PageHeaderSize;
     title?: string;
     description?: string;
     icon?: IconName;
     avatar?: AvatarProps;
     avatarGroup?: AvatarGroupProps;
+    tabs?: PageTabsProps;
 }
-export declare const PageHeader: ({ title, icon, avatar, avatarGroup, children, ...rest }: PageHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PageHeader: ({ variant, size, title, description, icon, avatar, avatarGroup, tabs, theme, padding, shadow, bleed, children, ...rest }: PageHeaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Page/PageHeader.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ title, icon, avatar, avatarGroup, children, ...rest }: import('./PageHeader').PageHeaderProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ variant, size, title, description, icon, avatar, avatarGroup, tabs, theme, padding, shadow, bleed, children, ...rest }: import('./PageHeader').PageHeaderProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {

package/dist/types/lib/components/Page/PageMenu.stories.d.ts

@@ -5,23 +5,11 @@ declare const meta: {
     tags: string[];
     parameters: {};
     args: {
-        items: ({
+        items: {
             id: string;
-            icon: "arrow-redo";
+            icon: string;
             title: string;
-        } | {
-            id: string;
-            icon: "eye";
-            title: string;
-        } | {
-            id: string;
-            icon: "archive";
-            title: string;
-        } | {
-            id: string;
-            icon: "trash";
-            title: string;
-        })[];
+        }[];
     };
 };
 export default meta;

package/dist/types/lib/components/Page/PageTabs.d.ts

@@ -0,0 +1,8 @@
+import { MenuItemColor, MenuItemProps } from '..';
+export type PageTabsTheme = 'transparent' | 'base';
+export interface PageTabsProps {
+    theme?: PageTabsTheme;
+    color?: MenuItemColor;
+    items?: MenuItemProps[];
+}
+export declare const PageTabs: ({ theme, color, items }: PageTabsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Page/index.d.ts

@@ -1,6 +1,7 @@
 export * from './PageBase';
 export * from './PageNav';
 export * from './PageMenu';
+export * from './PageTabs';
 export * from './PageHeader';
 export * from './Article';
 export * from './Section';

package/dist/types/lib/types/color.d.ts

@@ -1,2 +1,2 @@
 export type Color = 'accent' | 'company' | 'person' | 'neutral' | 'success' | 'warning' | 'danger' | 'info' | 'alert';
-export type Theme = 'transparent' | 'default' | 'subtle' | 'surface-default' | 'surface-hover' | 'surface-active' | 'border-subtle' | 'border-default' | 'border-strong' | 'base-default' | 'base-hover' | 'base-active';
+export type Theme = 'transparent' | 'default' | 'subtle' | 'surface' | 'surface-default' | 'surface-hover' | 'surface-active' | 'border' | 'border-subtle' | 'border-default' | 'border-strong' | 'base' | 'base-default' | 'base-hover' | 'base-active';