@altinn/altinn-components 0.10.0 → 0.10.2

package/dist/lib/components/Button/IconButton.stories.d.ts

@@ -0,0 +1,16 @@
+import { StoryObj } from '@storybook/react';
+import { IconButtonProps } from './IconButton';
+declare const meta: {
+    title: string;
+    component: ({ variant, color, size, icon, iconSize, className, onClick, }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {
+        icon: "x-mark";
+        size: "sm";
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Sizes: (args: IconButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/{components → lib/components}/Byline/Byline.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { AvatarGroupProps, AvatarProps } from '..';
-export type BylineSize = 'xs' | 'sm' | 'lg';
+export type BylineSize = 'xs' | 'sm' | 'md' | 'lg';
 export interface BylineProps {
     size?: BylineSize;
     avatar?: AvatarProps;

package/dist/lib/components/Byline/Byline.stories.d.ts

@@ -0,0 +1,15 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ loading, size, avatar, avatarGroup, datetime, children }: import('./Byline').BylineProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {
+        datetime: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Avatar: Story;
+export declare const LargeAvatar: Story;

package/dist/lib/components/Dialog/Dialog.stories.d.ts

@@ -0,0 +1,57 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ backButton, menu, updatedAt, updatedAtLabel, dueAt, dueAtLabel, status, title, sender, recipient, recipientLabel, recipientGroup, summary, body, actions, attachments, seenBy, activityLog, history, timeline, additionalInfo, contactInfo, }: import('./Dialog').DialogProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    decorators: import('@storybook/csf').DecoratorFunction<import('@storybook/react').ReactRenderer>[];
+    argTypes: {
+        body: {
+            control: "text";
+        };
+    };
+    args: {
+        sender: {
+            type: "company";
+            name: string;
+            imageUrl: string;
+        };
+        recipientLabel: string;
+        recipient: {
+            type: "person";
+            name: string;
+        };
+        seenBy: {
+            as: "a";
+            href: string;
+            label: string;
+            seenByEndUser: true;
+            seenByOthersCount: number;
+        };
+        activityLog: {
+            as: "a";
+            href: string;
+            label: string;
+        };
+        backButton: {
+            label: string;
+        };
+        menu: import('..').ContextMenuProps;
+        updatedAt: string;
+        updatedAtLabel: string;
+        title: string;
+        summary: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const SimpleLetter: Story;
+export declare const ExtendedLetter: Story;
+export declare const TypographyMetadata: Story;
+export declare const ReportingRequired: Story;
+export declare const ReportingDraft: Story;
+export declare const ReportingInProgress: Story;
+export declare const ReportingCompleted: Story;
+export declare const Transmissions: Story;
+export declare const TransmissionsInProgress: Story;
+export declare const TransmissionsCompleted: Story;

package/dist/{components → lib/components}/Dialog/DialogByline.d.ts

@@ -1,6 +1,6 @@
 import { AvatarProps, BylineSize } from '..';
 export interface DialogBylineProps {
-    sender: AvatarProps;
+    sender?: AvatarProps;
     recipient?: AvatarProps;
     recipientLabel?: string;
     recipientGroup?: boolean;

package/dist/lib/components/Dialog/DialogContent.stories.d.ts

@@ -0,0 +1,22 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ updatedAt, updatedAtLabel, seenBy, activityLog, children }: import('./DialogContent').DialogContentProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    args: {
+        updatedAt: string;
+        updatedAtLabel: string;
+        children: string;
+        seenBy: {
+            seenByEndUser: true;
+            label: string;
+        };
+        activityLog: {
+            label: string;
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const ExtendedContent: Story;

package/dist/lib/components/Dialog/DialogDescription.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+import { DialogListItemSize } from './DialogListItem';
+export interface DialogDescriptionProps {
+    size: DialogListItemSize;
+    className?: string;
+    loading?: boolean;
+    children?: ReactNode;
+}
+/**
+ * Dialog summary
+ */
+export declare const DialogDescription: ({ size, loading, children }: DialogDescriptionProps) => import("react/jsx-runtime").JSX.Element;

package/dist/{components → lib/components}/Dialog/DialogHeading.d.ts

@@ -1,11 +1,11 @@
 import { ReactNode } from 'react';
-import { DialogListItemSize, DialogListItemVariant } from '..';
+import { DialogListItemSize, DialogListItemState } from '..';
 export type DialogHeadingProps = {
     loading?: boolean;
     /** Size */
     size?: DialogListItemSize;
-    /** Variant */
-    variant?: DialogListItemVariant;
+    /** Type */
+    state?: DialogListItemState;
     /** Label */
     label?: string;
     /** Variant */
@@ -16,4 +16,4 @@ export type DialogHeadingProps = {
 /**
  * Dialog heading
  */
-export declare const DialogHeading: ({ loading, size, seen, variant, label, children }: DialogHeadingProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DialogHeading: ({ loading, size, seen, state, label, children }: DialogHeadingProps) => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Dialog/DialogLabel.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+import { MetaItemSize } from '../Meta';
+export type DialogLabelType = 'normal' | 'trashed' | 'archived';
+export interface DialogLabelProps {
+    size?: MetaItemSize;
+    type?: DialogLabelType;
+    label?: string;
+    children?: ReactNode;
+}
+/**
+ * Dialog label.
+ */
+export declare const DialogLabel: ({ size, type, label, children }: DialogLabelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/{components → lib/components}/Dialog/DialogListItem.d.ts

@@ -1,32 +1,23 @@
-import { ElementType } from 'react';
-import { AvatarProps, DialogSeenByProps, DialogSelectProps, DialogStatusProps, DialogTouchedByActor, ListItemColor } from '..';
+import { AvatarProps, DialogSeenByProps, DialogSelectProps, DialogStatusProps, DialogTouchedByActor, ListItemBaseProps, ListItemLinkProps } from '..';
 export type DialogListItemSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-export type DialogListItemVariant = 'normal' | 'trashed' | 'archived';
-export interface DialogListItemProps {
+export type DialogListItemState = 'normal' | 'trashed' | 'archived';
+export interface DialogListItemProps extends ListItemBaseProps, ListItemLinkProps {
     /** Dialog title */
     title: string;
     /** Dialog sender */
-    sender: AvatarProps;
+    sender?: AvatarProps;
     /** Dialog description */
     description?: string;
     /** Dialog summary (will override description) */
     summary?: string;
-    /** Dialog is loading */
-    loading?: boolean;
-    /** Render as */
-    as?: ElementType;
-    /** Size */
+    /** Dialog size */
     size?: DialogListItemSize;
-    /** Variant */
-    variant?: DialogListItemVariant;
-    /** Link */
-    href?: string;
-    /** OnClick handler */
-    onClick?: () => void;
     /** Select: Use to support batch operations */
     select?: DialogSelectProps;
-    /** Dialog is selected */
+    /** Selected: Use to support batch operations */
     selected?: boolean;
+    /** Dialog state */
+    state?: DialogListItemState;
     /** Dialog status */
     status?: DialogStatusProps;
     /** Dialog Recipient  */
@@ -55,8 +46,6 @@ export interface DialogListItemProps {
     tabIndex?: number;
     /** Custom label */
     label?: string;
-    /** Custom color */
-    color?: ListItemColor;
     /** Dialog has been seen */
     seen?: boolean;
     /** Dialog is seen by the user */
@@ -73,4 +62,4 @@ export interface DialogListItemProps {
  * summary, sender, and receiver.
  * to mark the item as checked/unchecked and can visually indicate if it is unread.
  */
-export declare const DialogListItem: ({ size, variant, loading, select, status, sender, recipient, recipientLabel, recipientGroup, updatedAt, updatedAtLabel, archivedAt, archivedAtLabel, trashedAt, trashedAtLabel, label, dueAt, dueAtLabel, seen, seenBy, touchedBy, attachmentsCount, title, description, summary, ...rest }: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DialogListItem: ({ size, state, loading, select, status, sender, recipient, recipientLabel, recipientGroup, updatedAt, updatedAtLabel, archivedAt, archivedAtLabel, trashedAt, trashedAtLabel, label, dueAt, dueAtLabel, seen, seenBy, touchedBy, attachmentsCount, title, description, summary, ...rest }: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,34 @@
+import { DialogListItemProps } from './DialogListItem';
+declare const meta: {
+    title: string;
+    component: ({ size, state, loading, select, status, sender, recipient, recipientLabel, recipientGroup, updatedAt, updatedAtLabel, archivedAt, archivedAtLabel, trashedAt, trashedAtLabel, label, dueAt, dueAtLabel, seen, seenBy, touchedBy, attachmentsCount, title, description, summary, ...rest }: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    decorators: import('@storybook/csf').DecoratorFunction<import('@storybook/react').ReactRenderer>[];
+    argTypes: {};
+    args: {
+        title: string;
+        summary: string;
+        sender: {
+            type: "company";
+            name: string;
+        };
+        recipient: {
+            type: "person";
+            name: string;
+        };
+        updatedAt: string;
+        updatedAtLabel: string;
+        status: {};
+    };
+};
+export default meta;
+export declare const Statuses: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Loading: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Variants: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DueAt: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Attachments: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SeenBy: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TouchedBy: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TextLength: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Selectable: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Sizes: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Dialog/DialogSeenBy.stories.d.ts

@@ -0,0 +1,21 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ size, label, seenByEndUser, seenByOthersCount, onClick, ...rest }: import('./DialogSeenBy').DialogSeenByProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {
+        seenByEndUser: true;
+        seenByOthersCount: number;
+        label: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Unseen: Story;
+export declare const seenByEndUser: Story;
+export declare const seenByEndUserAndOthers: Story;
+export declare const ExampleLabel: ({ seenByEndUser, seenByOthersCount, }: {
+    seenByEndUser: boolean;
+    seenByOthersCount: number;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Dialog/DialogTouchedBy.stories.d.ts

@@ -0,0 +1,15 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ loading, size, touchedBy, className }: import('./DialogTouchedBy').DialogTouchedByProps) => import("react/jsx-runtime").JSX.Element | null;
+    tags: string[];
+    parameters: {};
+    args: {
+        touchedBy: {
+            name: string;
+        }[];
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/lib/components/Dialog/DialogTransmissions.stories.d.ts

@@ -0,0 +1,76 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ title, items, toolbar }: import('./DialogTransmissions').DialogTransmissionsProps) => import("react/jsx-runtime").JSX.Element | null;
+    tags: string[];
+    parameters: {};
+    args: {
+        title: string;
+        items: ({
+            createdAt: string;
+            createdAtLabel: string;
+            sender: {
+                type: "company";
+                name: string;
+                imageUrl: string;
+            };
+            badge: {
+                label: string;
+            };
+            title: string;
+            summary: string;
+            attachments: {
+                title: string;
+                items: {
+                    label: string;
+                    href: string;
+                }[];
+            };
+        } | {
+            sender: {
+                name: string;
+                type?: undefined;
+                imageUrl?: undefined;
+            };
+            title: string;
+            createdAtLabel: string;
+            summary: string;
+            createdAt?: undefined;
+            badge?: undefined;
+            attachments?: undefined;
+        })[];
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const WithSearch: {
+    args: {
+        toolbar: {
+            search: {
+                label: string;
+                placeholder: string;
+            };
+        };
+    };
+};
+export declare const WithFilters: {
+    args: {
+        toolbar: {
+            filters: {
+                name: string;
+                label: string;
+                optionType: string;
+                options: {
+                    groupId: string;
+                    label: string;
+                    value: string;
+                }[];
+            }[];
+            search: {
+                label: string;
+                placeholder: string;
+            };
+        };
+    };
+};

package/dist/lib/components/Dialog/DraftDialog.d.ts

@@ -0,0 +1,5 @@
+import { DialogProps } from '..';
+/**
+ * Draft dialog variant,
+ */
+export declare const DraftDialog: ({ backButton, menu, updatedAt, updatedAtLabel, dueAt, dueAtLabel, status, title, sender, recipient, recipientLabel, summary, body, actions, attachments, additionalInfo, contactInfo, }: DialogProps) => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Dialog/DraftDialog.stories.d.ts

@@ -0,0 +1,59 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ backButton, menu, updatedAt, updatedAtLabel, dueAt, dueAtLabel, status, title, sender, recipient, recipientLabel, summary, body, actions, attachments, additionalInfo, contactInfo, }: import('./Dialog').DialogProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    decorators: import('@storybook/csf').DecoratorFunction<import('@storybook/react').ReactRenderer>[];
+    argTypes: {
+        body: {
+            control: "text";
+        };
+    };
+    args: {
+        sender: {
+            type: "company";
+            name: string;
+            imageUrl: string;
+        };
+        recipientLabel: string;
+        recipient: {
+            type: "person";
+            name: string;
+        };
+        seenBy: {
+            as: "a";
+            href: string;
+            label: string;
+            seenByEndUser: true;
+            seenByOthersCount: number;
+        };
+        activityLog: {
+            as: "a";
+            href: string;
+            label: string;
+        };
+        backButton: {
+            label: string;
+        };
+        menu: import('..').ContextMenuProps;
+        updatedAt: string;
+        updatedAtLabel: string;
+        title: string;
+        summary: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const SimpleLetter: Story;
+export declare const ExtendedLetter: Story;
+export declare const TypographyMetadata: Story;
+export declare const ReportingRequired: Story;
+export declare const ReportingDraft: Story;
+export declare const ReportingInProgress: Story;
+export declare const ReportingCompleted: Story;
+export declare const Transmissions: Story;
+export declare const TransmissionsInProgress: Story;
+export declare const TransmissionsCompleted: Story;
+export declare const Draft: Story;
+export declare const Sent: Story;

package/dist/{components → lib/components}/Dialog/index.d.ts

@@ -6,7 +6,6 @@ export * from './DialogMetadata';
 export * from './DialogByline';
 export * from './DialogActions';
 export * from './DialogActivityLog';
-export * from './DialogBorder';
 export * from './DialogContent';
 export * from './DialogSection';
 export * from './DialogSeenBy';

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

@@ -0,0 +1,17 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ accounts, accountGroups, accountSearch, onSelectAccount, currentAccount, }: import('./AccountMenu').AccountMenuProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {
+        accounts?: import('./AccountMenu').AccountMenuItem[];
+        accountGroups?: import('..').MenuItemGroups;
+        accountSearch?: import('./AccountMenu').AccountSearchProps;
+        currentAccount?: import('./AccountMenu').AccountMenuItem;
+        onSelectAccount?: (id: string) => void;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/{components → lib/components}/GlobalMenu/GlobalMenu.d.ts

@@ -12,5 +12,6 @@ export interface GlobalMenuProps extends AccountMenuProps {
     className?: string;
     currentAccount?: Account;
     onSelectAccount?: (id: string) => void;
+    onClose?: () => void;
 }
-export declare const GlobalMenu: ({ accounts, accountGroups, accountSearch, items, groups, changeLabel, backLabel, currentAccount, onSelectAccount, logoutButton, }: GlobalMenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const GlobalMenu: ({ accounts, accountGroups, accountSearch, items, groups, changeLabel, backLabel, currentAccount, onSelectAccount, onClose, logoutButton, }: GlobalMenuProps) => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/GlobalMenu/GlobalMenu.stories.d.ts

@@ -0,0 +1,28 @@
+import { StoryObj } from '@storybook/react';
+import { Account } from './AccountButton.tsx';
+import { GlobalMenuProps } from './GlobalMenu';
+declare const meta: {
+    title: string;
+    component: ({ accounts, accountGroups, accountSearch, items, groups, changeLabel, backLabel, currentAccount, onSelectAccount, onClose, logoutButton, }: GlobalMenuProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {
+        items: import('../index.ts').MenuItemProps[];
+        groups?: import('../index.ts').MenuItemGroups;
+        menuLabel?: string;
+        backLabel?: string;
+        logoutButton?: import('./LogoutButton.tsx').LogoutButtonProps;
+        changeLabel?: string;
+        className?: string;
+        currentAccount?: Account;
+        onSelectAccount?: (id: string) => void;
+        onClose?: () => void;
+        accounts?: import('./AccountMenu.tsx').AccountMenuItem[];
+        accountGroups?: import('../index.ts').MenuItemGroups;
+        accountSearch?: import('./AccountMenu.tsx').AccountSearchProps;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: (args: GlobalMenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Login: Story;

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

@@ -0,0 +1,21 @@
+import { HeaderProps } from './Header';
+declare const meta: {
+    title: string;
+    component: ({ search, menu, currentAccount, logo, badge }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {
+        search: {
+            name: string;
+            placeholder: string;
+        };
+        menu: import('..').GlobalMenuProps;
+        currentAccount?: import('..').Account;
+        badge?: import('..').BadgeProps;
+        logo?: import('./HeaderLogo').HeaderLogoProps;
+    };
+};
+export default meta;
+export declare const Default: (args: HeaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Layout/Layout.stories.d.ts

@@ -0,0 +1,20 @@
+import { LayoutProps } from '../';
+declare const meta: {
+    title: string;
+    component: ({ theme, header, footer, sidebar, content, children }: LayoutProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {
+        theme: "person";
+        header: import('../Header').HeaderProps;
+        footer: import('../Footer').FooterProps;
+        sidebar: {
+            menu: import('../Menu').MenuProps;
+        };
+        children: import("react/jsx-runtime").JSX.Element;
+    };
+};
+export default meta;
+export declare const Default: (args: LayoutProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,13 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ hidden, children }: import('./ActionFooter').ActionFooterProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {};
+};
+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/lib/components/LayoutAction/ActionMenu.stories.d.ts

@@ -0,0 +1,30 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ theme, items }: import('./ActionMenu').ActionMenuProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {
+        theme: "global-dark";
+        items: ({
+            id: string;
+            icon: "arrow-redo";
+            title: string;
+        } | {
+            id: string;
+            icon: "eye";
+            title: string;
+        } | {
+            id: string;
+            icon: "archive";
+            title: string;
+        } | {
+            id: string;
+            icon: "trash";
+            title: string;
+        })[];
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

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

@@ -0,0 +1,11 @@
+import { ListSpacing, ListTheme } from '../List';
+import { ListItemProps } from './ListItem';
+import { ListItemColor, ListItemSize } from './ListItemBase';
+export interface ListProps {
+    spacing?: ListSpacing;
+    theme?: ListTheme;
+    items?: ListItemProps[];
+    defaultItemColor?: ListItemColor;
+    defaultItemSize?: ListItemSize;
+}
+export declare const List: ({ theme, defaultItemSize, defaultItemColor, spacing, items }: ListProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,18 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ theme, defaultItemSize, defaultItemColor, spacing, items }: import('./List').ListProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {
+        items: {
+            id: string;
+            title: string;
+            description: string;
+            href: string;
+        }[];
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/{components → lib/components}/List/ListItem.d.ts

@@ -6,6 +6,8 @@ import { IconName } from '../Icon';
 import { ListItemBaseProps } from './ListItemBase';
 import { ListItemHeaderProps } from './ListItemHeader';
 export interface ListItemProps extends ListItemBaseProps, ListItemHeaderProps {
+    /** List item id */
+    id?: string;
     /** Custom className */
     className?: string;
     /** Element is loading, display a placeholder */