@altinn/altinn-components 0.11.0 → 0.13.0

package/dist/types/lib/components/Bookmarks/BookmarksListItem.d.ts

@@ -20,5 +20,7 @@ export interface BookmarksListItemProps extends ListItemInputProps {
     saveButton?: ButtonProps;
     /** Delete button */
     removeButton?: ButtonProps;
+    /** Render as **/
+    as?: React.ElementType;
 }
-export declare const BookmarksListItem: ({ size, icon, expanded, loading, title, titleField, untitled, params, onToggle, saveButton, removeButton, ...rest }: BookmarksListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BookmarksListItem: ({ size, icon, expanded, loading, title, titleField, untitled, params, onToggle, saveButton, removeButton, as, ...rest }: BookmarksListItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Bookmarks/BookmarksListItem.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ size, icon, expanded, loading, title, titleField, untitled, params, onToggle, saveButton, removeButton, ...rest }: import('./BookmarksListItem').BookmarksListItemProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ size, icon, expanded, loading, title, titleField, untitled, params, onToggle, saveButton, removeButton, as, ...rest }: import('./BookmarksListItem').BookmarksListItemProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {
@@ -13,7 +13,6 @@ declare const meta: {
             type: "filter";
             label: string;
         })[];
-        href: string;
     };
 };
 export default meta;

package/dist/types/lib/components/Bookmarks/BookmarksSection.d.ts

@@ -1,14 +1,12 @@
-import { BookmarksListItemProps, ButtonProps, TextFieldProps } from '../';
+import { BookmarksListItemProps, TextFieldProps } from '../';
 export interface BookmarksSectionProps {
     title?: string;
     description?: string;
     items: BookmarksListItemProps[];
     untitled?: string;
     titleField?: TextFieldProps;
-    saveButton?: ButtonProps;
-    removeButton?: ButtonProps;
     expandedId?: string;
     onToggle?: (id: string) => void;
     loading?: boolean;
 }
-export declare const BookmarksSection: ({ loading, title, description, items, untitled, titleField, saveButton, removeButton, expandedId, onToggle, }: BookmarksSectionProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BookmarksSection: ({ loading, title, description, items, untitled, titleField, expandedId, onToggle, }: BookmarksSectionProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Bookmarks/BookmarksSection.stories.d.ts

@@ -2,7 +2,7 @@ import { StoryObj } from '@storybook/react';
 import { BookmarksSectionProps } from './BookmarksSection';
 declare const meta: {
     title: string;
-    component: ({ loading, title, description, items, untitled, titleField, saveButton, removeButton, expandedId, onToggle, }: BookmarksSectionProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ loading, title, description, items, untitled, titleField, expandedId, onToggle, }: BookmarksSectionProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {
@@ -13,16 +13,17 @@ declare const meta: {
             placeholder: string;
             helperText: string;
         };
-        saveButton: {
-            label: string;
-        };
-        removeButton: {
-            label: string;
-        };
         description: string;
         items: ({
             id: string;
             title: string;
+            saveButton: {
+                label: string;
+            };
+            removeButton: {
+                label: string;
+                onClick: () => void;
+            };
             params: ({
                 type: "search";
                 label: string;
@@ -39,6 +40,27 @@ declare const meta: {
                 type: "filter";
                 label: string;
             })[];
+            saveButton: {
+                label: string;
+            };
+            removeButton: {
+                label: string;
+                onClick: () => void;
+            };
+            title?: undefined;
+        } | {
+            id: string;
+            params: {
+                type: "filter";
+                label: string;
+            }[];
+            saveButton: {
+                label: string;
+            };
+            removeButton: {
+                label: string;
+                onClick?: undefined;
+            };
             title?: undefined;
         })[];
     };
@@ -50,3 +72,4 @@ export declare const ExpandedItem: Story;
 export declare const ControlledState: (args: BookmarksSectionProps) => import("react/jsx-runtime").JSX.Element;
 export declare const LoadingState: Story;
 export declare const EmptyState: Story;
+export declare const AsLink: Story;

package/dist/types/lib/components/Dialog/DialogListItem.d.ts

@@ -4,6 +4,8 @@ export type DialogListItemState = 'normal' | 'trashed' | 'archived';
 export interface DialogListItemProps extends ListItemBaseProps, ListItemLinkProps {
     /** Dialog title */
     title: string;
+    /** Dialog id */
+    id?: string;
     /** Dialog sender */
     sender?: AvatarProps;
     /** Dialog description */

package/dist/types/lib/components/GlobalMenu/AccountMenu.d.ts

@@ -11,7 +11,8 @@ export interface AccountMenuItem {
     groupId?: string;
     selected?: boolean;
     accountNames?: string[];
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
+    alertBadge?: BadgeProps | undefined;
 }
 export interface AccountMenuProps {
     accounts?: AccountMenuItem[];

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

@@ -6,7 +6,7 @@ export interface HeaderProps {
     menu: GlobalMenuProps;
     search?: SearchbarProps;
     currentAccount?: Account;
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
     logo?: HeaderLogoProps;
 }
 export declare const Header: ({ search, menu, currentAccount, logo, badge }: HeaderProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -13,7 +13,7 @@ declare const meta: {
         };
         menu: import('..').GlobalMenuProps;
         currentAccount?: import('..').Account;
-        badge?: import('..').BadgeProps;
+        badge?: import('..').BadgeProps | undefined;
         logo?: import('./HeaderLogo').HeaderLogoProps;
     };
 };

package/dist/types/lib/components/Header/HeaderButton.d.ts

@@ -11,7 +11,7 @@ export interface HeaderButtonProps extends ButtonProps {
     className?: string;
     expanded?: boolean;
     icon?: IconName;
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
     tabIndex?: number;
 }
 export declare const HeaderButton: ({ className, as, avatar, avatarGroup, icon, expanded, label, badge, ...buttonProps }: HeaderButtonProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -9,5 +9,3 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Menu: Story;
-export declare const Snackbars: Story;
-export declare const MenuAndSnackbar: Story;

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

@@ -29,7 +29,7 @@ export interface ListItemProps extends ListItemBaseProps, ListItemHeaderProps {
     /** Custom label */
     label?: ReactNode | (() => ReactElement);
     /** Optional badge */
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
     /** Optional context menu */
     menu?: ContextMenuProps;
 }

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

@@ -4,7 +4,7 @@ import { ContextMenuProps } from '../ContextMenu';
 import { IconName } from '../Icon';
 interface ListItemControlsProps {
     className?: string;
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
     linkText?: string;
     linkIcon?: IconName;
     menu?: ContextMenuProps;

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

@@ -34,7 +34,7 @@ export interface ListItemHeaderProps extends ListItemLinkProps {
     /** Optional icon indicating behaviour */
     linkIcon?: IconName;
     /** Optional badge */
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
     /** Context menu */
     menu?: ContextMenuProps;
     /** Custom controls */

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

@@ -24,11 +24,12 @@ export interface MenuItemProps {
     icon?: IconName;
     avatar?: AvatarProps;
     avatarGroup?: AvatarGroupProps;
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
+    alertBadge?: BadgeProps | undefined;
     linkIcon?: IconName;
     linkText?: string;
     className?: string;
     label?: ReactNode;
     items?: MenuItemProps[];
 }
-export declare const MenuItem: ({ as, color, size, collapsible, expanded, icon, avatar, avatarGroup, title, description, badge, linkText, linkIcon, label, ...rest }: MenuItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuItem: ({ as, color, size, collapsible, expanded, icon, avatar, avatarGroup, title, description, badge, alertBadge, linkText, linkIcon, label, ...rest }: MenuItemProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ as, color, size, collapsible, expanded, icon, avatar, avatarGroup, title, description, badge, linkText, linkIcon, label, ...rest }: import('./MenuItem').MenuItemProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ as, color, size, collapsible, expanded, icon, avatar, avatarGroup, title, description, badge, alertBadge, linkText, linkIcon, label, ...rest }: import('./MenuItem').MenuItemProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {
@@ -12,7 +12,8 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
-export declare const DefaultBadge: Story;
+export declare const Badge: Story;
+export declare const BadgeXs: Story;
 export declare const Large: Story;
 export declare const AlertBadge: Story;
 export declare const Person: Story;

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

@@ -18,7 +18,7 @@ export interface MenuItemBaseProps {
     selected?: boolean;
     expanded?: boolean;
     children?: ReactNode;
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
     linkIcon?: IconName;
     linkText?: string;
 }

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

@@ -1,14 +1,13 @@
 import { ReactNode } from 'react';
-import { AvatarGroupProps, AvatarProps } from '../Avatar';
-import { IconName } from '../Icon';
-import { MenuItemColor, MenuItemSize } from './MenuItemBase';
+import { AvatarGroupProps, AvatarProps, BadgeProps, IconName, MenuItemColor, MenuItemSize } from '..';
 interface MenuItemMediaProps {
     color?: MenuItemColor;
     size?: MenuItemSize;
     icon?: IconName;
     avatar?: AvatarProps;
     avatarGroup?: AvatarGroupProps;
+    badge?: BadgeProps | undefined;
     children?: ReactNode;
 }
-export declare const MenuItemMedia: ({ size, color, icon, avatar, avatarGroup, children }: MenuItemMediaProps) => false | import("react/jsx-runtime").JSX.Element;
+export declare const MenuItemMedia: ({ size, color, icon, avatar, avatarGroup, badge, children, }: MenuItemMediaProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

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

@@ -10,7 +10,7 @@ export interface MenuOptionProps {
     name?: string;
     title?: string;
     description?: string;
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
     checked?: boolean;
     disabled?: boolean;
     onChange?: ChangeEventHandler;

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

@@ -1,7 +1,5 @@
 import { CSSProperties, ReactNode } from 'react';
 export type FlexElement = 'div' | 'section' | 'article' | 'header' | 'footer' | 'nav';
-export type FlexTheme = 'inherit' | 'neutral' | 'company' | 'person';
-export type FlexColor = 'transparent' | 'subtle' | 'surface' | 'accent';
 export type FlexDirection = 'col' | 'row';
 export type FlexAlign = 'initial' | 'start' | 'end' | 'center' | 'stretch';
 export type FlexJustify = 'initial' | 'start' | 'end' | 'center' | 'between';
@@ -11,8 +9,6 @@ export type FlexMargin = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type FlexShadow = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export interface FlexProps {
     as?: FlexElement;
-    theme?: FlexTheme;
-    color?: FlexColor;
     direction?: FlexDirection;
     reverse?: boolean;
     align?: FlexAlign;
@@ -26,4 +22,4 @@ export interface FlexProps {
     className?: string;
     style?: CSSProperties;
 }
-export declare const Flex: ({ as, theme, color, direction, reverse, align, justify, spacing, padding, margin, inset, className, style, children, ...rest }: FlexProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Flex: ({ as, direction, reverse, align, justify, spacing, padding, margin, inset, className, style, children, ...rest }: FlexProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,9 +1,11 @@
 import { FlexProps } from '..';
-export type SectionBg = 'transparent' | 'subtle' | 'surface' | 'accent';
+export type SectionBg = 'transparent' | 'default' | 'subtle' | 'surface' | 'border' | 'base';
 export type SectionShadow = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type SectionColor = 'inherit' | 'company' | 'person' | 'neutral' | 'success' | 'warning' | 'danger' | 'info';
 export interface SectionProps extends FlexProps {
     inset?: boolean;
+    color?: SectionColor;
     bg?: SectionBg;
     shadow?: SectionShadow;
 }
-export declare const Section: ({ as, className, bg, shadow, children, ...rest }: SectionProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Section: ({ as, className, bg, color, shadow, children, ...rest }: SectionProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,20 +1,5 @@
-import { ElementType } from 'react';
-import { IconName } from '../Icon';
-import { SnackbarColor } from './SnackbarBase';
 export interface SnackbarProps {
-    /** Element type to render */
-    as?: ElementType;
-    /** Color */
-    color?: SnackbarColor;
-    /** Message */
-    message?: string;
-    /** Icon */
-    icon?: IconName;
-    /** Dismissable */
-    dismissable?: boolean;
-    /** onDismiss */
-    onDismiss?: () => void;
     /** Optional classname */
     className?: string;
 }
-export declare const Snackbar: ({ as, color, message, icon, ...rest }: SnackbarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Snackbar: ({ className }: SnackbarProps) => import("react/jsx-runtime").JSX.Element | null;

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

@@ -1,14 +1,9 @@
-import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ as, color, message, icon, ...rest }: import('./Snackbar').SnackbarProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ className }: import('./Snackbar.tsx').SnackbarProps) => import("react/jsx-runtime").JSX.Element | null;
     tags: string[];
     parameters: {};
-    args: {
-        icon: "bell";
-        message: string;
-    };
+    args: {};
 };
 export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Snackbar/SnackbarBase.d.ts

@@ -1,13 +1,8 @@
-import { ElementType, ReactNode } from 'react';
-export type SnackbarColor = 'default' | 'accent';
-interface SnackbarBaseProps {
-    as?: ElementType;
-    color?: SnackbarColor;
-    href?: string;
+import { ReactNode } from 'react';
+export interface SnackbarBaseProps {
+    /** Optional classname */
     className?: string;
-    dismissable?: boolean;
-    onDismiss?: () => void;
-    children?: ReactNode;
+    /** Children */
+    children: string | ReactNode;
 }
-export declare const SnackbarBase: ({ as, children, className, color, dismissable, onDismiss, ...rest }: SnackbarBaseProps) => import("react/jsx-runtime").JSX.Element;
-export {};
+export declare const SnackbarBase: ({ children }: SnackbarBaseProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Snackbar/SnackbarItem.d.ts

@@ -0,0 +1,24 @@
+import { ElementType, ReactNode } from 'react';
+import { IconName } from '..';
+export declare enum SnackbarColorEnum {
+    accent = "accent",
+    neutral = "neutral",
+    alert = "alert",
+    success = "success",
+    warning = "warning",
+    danger = "danger",
+    info = "info"
+}
+export type SnackbarColor = keyof typeof SnackbarColorEnum;
+export interface SnackbarItemProps {
+    as?: ElementType;
+    color?: SnackbarColor;
+    icon?: IconName;
+    message: string | ReactNode;
+    href?: string;
+    className?: string;
+    dismissable?: boolean;
+    onDismiss?: () => void;
+    children?: ReactNode;
+}
+export declare const SnackbarItem: ({ as, message, className, color, icon, dismissable, onDismiss, ...rest }: SnackbarItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Snackbar/SnackbarItem.stories.d.ts

@@ -0,0 +1,15 @@
+import { StoryObj } from '@storybook/react';
+import { SnackbarItemProps } from '..';
+declare const meta: {
+    title: string;
+    component: ({ as, message, className, color, icon, dismissable, onDismiss, ...rest }: SnackbarItemProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {
+        message: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Colors: (args: SnackbarItemProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,4 +1,2 @@
-export * from './Snackbar';
-export * from './SnackbarBase';
-export * from './SnackbarMedia';
-export * from './SnackbarLabel';
+export * from './Snackbar.tsx';
+export * from './SnackbarItem';

package/dist/types/lib/components/Snackbar/useSnackbar.d.ts

@@ -0,0 +1,39 @@
+import { ElementType, ReactNode } from 'react';
+import { IconName } from '../Icon';
+import { SnackbarColor } from './SnackbarItem.tsx';
+export declare enum SnackbarDuration {
+    infinite = 0,
+    short = 1000,
+    normal = 3000,
+    long = 5000
+}
+export interface OpenSnackbarInput extends Omit<SnackbarQueueItem, 'id'> {
+}
+export interface SnackbarQueueItem extends SnackbarItemProps {
+    id: string;
+    message: string;
+    color: SnackbarColor;
+    duration?: number;
+    icon?: IconName;
+}
+interface SnackbarItemProps {
+    as?: ElementType;
+    color?: SnackbarColor;
+    href?: string;
+    className?: string;
+    dismissable?: boolean;
+    onDismiss?: () => void;
+    children?: ReactNode;
+}
+interface SnackbarContextValue {
+    open: boolean;
+    storedMessages: SnackbarQueueItem[];
+    openSnackbar: (input: OpenSnackbarInput) => string;
+    closeSnackbarItem: (id: string) => void;
+    dismissSnackbar: () => void;
+}
+export declare const SnackbarProvider: React.FC<{
+    children: React.ReactNode;
+}>;
+export declare const useSnackbar: () => SnackbarContextValue;
+export {};

package/dist/types/lib/components/Transmission/TransmissionItem.d.ts

@@ -9,7 +9,7 @@ export interface TransmissionItemProps {
     sender: AvatarProps;
     createdAt?: string;
     createdAtLabel?: string;
-    badge?: BadgeProps;
+    badge?: BadgeProps | undefined;
     title?: string;
     description?: string | undefined;
     summary?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@altinn/altinn-components",
-  "version": "0.11.0",
+  "version": "0.13.0",
   "main": "dist/index.js",
   "files": [
     "dist/",