@altinn/altinn-components 0.27.1 → 0.28.1

package/dist/types/lib/components/Settings/SettingsItem.stories.d.ts

@@ -0,0 +1,51 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ color, size, expanded, icon, label, title, value, description, children, ...item }: import('./SettingsItem').SettingsItemProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {};
+    args: {};
+    decorators: ((Story: import('@storybook/core/csf').PartialStoryFn<import('@storybook/react').ReactRenderer, {
+        id?: string | undefined;
+        collapsible?: boolean | undefined;
+        expanded?: boolean | undefined;
+        icon?: import('..').SvgElement | import('..').IconProps | React.ReactNode | import('..').AvatarProps | import('..').AvatarGroupProps;
+        label?: React.ReactNode;
+        value?: string | number | undefined;
+        title?: string | undefined;
+        description?: string | undefined;
+        interactive?: boolean | undefined;
+        as?: React.ElementType | undefined;
+        tabIndex?: number | undefined;
+        color?: import('..').ListItemColor | undefined;
+        variant?: string | undefined;
+        size?: import('..').ListItemSize | undefined;
+        shadow?: import('..').Shadow | undefined;
+        border?: import('..').ListItemBorder | undefined;
+        className?: string | undefined;
+        loading?: boolean | undefined;
+        disabled?: boolean | undefined;
+        hidden?: boolean | undefined;
+        active?: boolean | undefined;
+        selected?: boolean | undefined;
+        onMouseEnter?: React.MouseEventHandler<HTMLDivElement> | undefined;
+        children?: React.ReactNode;
+        select?: import('..').ListItemSelectProps | undefined;
+        linkIcon?: boolean | undefined;
+        badge?: React.ReactNode | import('..').BadgeProps;
+        controls?: React.ReactNode;
+        ariaLabel?: string | undefined;
+        href?: string | undefined;
+        onClick?: (() => void) | undefined;
+        onKeyPress?: React.KeyboardEventHandler | undefined;
+        describedby?: string | undefined;
+    }>) => import("react/jsx-runtime").JSX.Element)[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Title: Story;
+export declare const TitleDescription: Story;
+export declare const TitleValue: Story;
+export declare const CustomLabel: Story;
+export declare const Company: Story;
+export declare const Person: Story;

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

@@ -0,0 +1,2 @@
+export * from './Settings';
+export * from './SettingsItem';

package/dist/types/lib/components/Timeline/TimelineActivity.stories.d.ts

@@ -13,5 +13,4 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
-export declare const Avatar: Story;
 export declare const Loading: Story;

package/dist/types/lib/components/Timeline/TimelineBase.d.ts

@@ -1,5 +1,5 @@
 import { ElementType, ReactNode } from 'react';
-import { AvatarProps, Color, SvgElement, Theme } from '..';
+import { TimelineIconProps, Color, Theme } from '..';
 export type TimelineTheme = 'base' | 'surface';
 export type TimelineBorder = 'strong' | 'solid' | 'dashed' | 'hidden';
 export type TimelineBorderWidth = 1 | 2;
@@ -10,10 +10,10 @@ export interface TimelineBaseProps {
     border?: TimelineBorder;
     color?: Color;
     theme?: Theme;
-    icon?: SvgElement;
-    iconColor?: Color;
-    avatar?: AvatarProps;
+    icon?: TimelineIconProps['icon'];
+    iconColor?: TimelineIconProps['color'];
+    iconTheme?: TimelineIconProps['theme'];
     children?: ReactNode;
     id?: string;
 }
-export declare const TimelineBase: ({ as, loading, border, level, color, icon, iconColor, avatar, children, id, ...props }: TimelineBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TimelineBase: ({ as, loading, border, level, color, icon, iconColor, iconTheme, children, id, ...props }: TimelineBaseProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Timeline/TimelineHeader.d.ts

@@ -1,13 +1,11 @@
 import { ReactNode } from 'react';
-import { Color, FlexProps, IconOrAvatarProps } from '..';
+import { Color, FlexProps, TimelineIconProps } from '..';
 export type TimelineHeaderSize = 'sm' | 'lg';
 export interface TimelineHeaderProps {
     as?: FlexProps['as'];
     loading?: boolean;
     color?: Color;
-    avatar?: IconOrAvatarProps['avatar'];
-    icon?: IconOrAvatarProps['icon'];
-    iconTheme?: IconOrAvatarProps['iconTheme'];
+    icon?: TimelineIconProps['icon'];
     children?: ReactNode;
 }
-export declare const TimelineHeader: ({ as, loading, color, icon, iconTheme, avatar, children, }: TimelineHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TimelineHeader: ({ as, loading, color, icon, children }: TimelineHeaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Timeline/TimelineHeader.stories.d.ts

@@ -1,12 +1,12 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ as, loading, color, icon, iconTheme, avatar, children, }: import('./TimelineHeader').TimelineHeaderProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ as, loading, color, icon, children }: import('./TimelineHeader').TimelineHeaderProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {
         as: "header";
-        avatar: import('..').AvatarProps;
+        icon: import('..').AvatarProps;
         children: import("react/jsx-runtime").JSX.Element;
     };
 };

package/dist/types/lib/components/Timeline/TimelineIcon.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { AvatarGroupProps, AvatarProps, Color, IconProps, SvgElement, Theme } from '..';
+export type TimelineIconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export interface TimelineIconProps {
+    loading?: boolean;
+    size?: TimelineIconSize;
+    icon?: AvatarProps | AvatarGroupProps | IconProps | SvgElement | ReactNode;
+    color?: Color;
+    theme?: Theme;
+}
+export declare const TimelineIcon: ({ loading, size, color, theme, icon }: TimelineIconProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/types/lib/components/Timeline/TimelineSegment.d.ts

@@ -1,9 +1,9 @@
 import { ReactNode } from 'react';
-import { FlexMargin, FlexSpacing, SvgElement, TimelineBaseProps, TimelineBorder, TypographyProps } from '..';
+import { FlexMargin, FlexSpacing, TimelineBaseProps, TimelineBorder, TypographyProps } from '..';
 export interface TimelineSegmentProps extends TimelineBaseProps {
     id?: string;
     loading?: boolean;
-    icon?: SvgElement;
+    icon?: TimelineBaseProps['icon'];
     datetime?: string;
     border?: TimelineBorder;
     byline?: ReactNode;

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

@@ -5,4 +5,5 @@ export * from './TimelineBase';
 export * from './TimelineSection';
 export * from './TimelineHeader';
 export * from './TimelineFooter';
+export * from './TimelineIcon';
 export * from './TimelineLink';

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

@@ -15,4 +15,4 @@ export interface TransmissionProps extends Omit<ListItemProps, 'children'> {
     type?: TransmissionType;
     children?: ReactNode | (() => ReactElement);
 }
-export declare const Transmission: ({ size, theme, color, title, createdAt, createdAtLabel, badge, sender, summary, attachments, type, children, ...item }: TransmissionProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Transmission: ({ size, variant, color, title, createdAt, createdAtLabel, badge, sender, summary, attachments, type, children, ...item }: TransmissionProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,7 +1,7 @@
 import { TransmissionProps } from '..';
 declare const meta: {
     title: string;
-    component: ({ size, theme, color, title, createdAt, createdAtLabel, badge, sender, summary, attachments, type, children, ...item }: TransmissionProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ size, variant, color, title, createdAt, createdAtLabel, badge, sender, summary, attachments, type, children, ...item }: TransmissionProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {
@@ -17,32 +17,29 @@ declare const meta: {
         attachments?: import('..').AttachmentListProps;
         type?: import('./Transmission').TransmissionType;
         children?: React.ReactNode | (() => React.ReactElement);
+        border?: import('..').ListItemBorder | undefined;
         loading?: boolean | undefined;
+        variant?: import('..').ListItemVariant | undefined;
         size?: import('..').ListItemSize | undefined;
         color?: import('..').ListItemColor | undefined;
-        theme?: import('..').ListItemTheme | undefined;
         className?: string | undefined;
+        icon?: import('..').SvgElement | import('..').IconProps | React.ReactNode | import('..').AvatarProps | import('..').AvatarGroupProps;
         as?: React.ElementType | undefined;
         label?: React.ReactNode | (() => React.ReactElement);
         select?: import('..').ListItemSelectProps | undefined;
-        variant?: import('..').ListItemVariant | undefined;
-        icon?: import('..').SvgElement | import('..').IconProps | React.ReactNode;
         hidden?: boolean | undefined;
         expanded?: boolean | undefined;
         active?: boolean | undefined;
         disabled?: boolean | undefined;
-        avatar?: import('..').AvatarProps | undefined;
-        avatarGroup?: import('..').AvatarGroupProps | undefined;
         href?: string | undefined;
         controls?: React.ReactNode;
         selected?: boolean | undefined;
         ariaLabel?: string | undefined;
-        titleAs?: React.ElementType | undefined;
-        description?: string | undefined;
+        description?: React.ReactNode | import('..').HeadingProps;
         linkIcon?: boolean | undefined;
         interactive?: boolean | undefined;
         tabIndex?: number | undefined;
-        shadow?: import('..').ListItemShadow | undefined;
+        shadow?: import('..').Shadow | undefined;
         onMouseEnter?: React.MouseEventHandler<HTMLDivElement> | undefined;
         collapsible?: boolean | undefined;
         onClick?: (() => void) | undefined;

package/dist/types/lib/components/Typography/Heading.d.ts

@@ -1,16 +1,20 @@
-import { ReactNode } from 'react';
+import { CSSProperties, ReactNode } from 'react';
 import { TypographyProps } from '..';
-export type HeadingSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type HeadingSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'inherit';
 export type HeadingWeight = 'normal' | 'medium' | 'bold';
-export type HeadingComponent = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div' | 'span';
+export type HeadingLeading = 'none' | 'tight' | 'normal';
+export type HeadingComponent = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'div' | 'span';
 export interface HeadingProps {
     loading?: boolean;
     as?: HeadingComponent;
     size?: HeadingSize;
     weight?: HeadingWeight;
+    leading?: HeadingLeading;
     color?: TypographyProps['color'];
-    theme?: TypographyProps['theme'];
+    variant?: TypographyProps['variant'];
+    maxRows?: 2 | undefined;
     className?: string;
+    style?: CSSProperties;
     children?: ReactNode;
 }
-export declare const Heading: ({ loading, as, size, weight, color, theme, className, children, }: HeadingProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Heading: ({ loading, as, size, leading, weight, color, variant, maxRows, className, style, children, }: HeadingProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Typography/Heading.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ loading, as, size, weight, color, theme, className, children, }: import('./Heading').HeadingProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ loading, as, size, leading, weight, color, variant, maxRows, className, style, children, }: import('./Heading').HeadingProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {

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

@@ -1,6 +1,6 @@
 import { CSSProperties, ElementType, ReactNode } from 'react';
 export type TypographyColor = 'neutral' | 'company' | 'person' | 'article';
-export type TypographyTheme = 'default' | 'subtle';
+export type TypographyVariant = 'default' | 'subtle';
 export type TypographySize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export interface TypographyProps {
     loading?: boolean;
@@ -8,11 +8,11 @@ export interface TypographyProps {
     as?: ElementType;
     size?: TypographySize;
     color?: TypographyColor;
-    theme?: TypographyTheme;
+    variant?: TypographyVariant;
     className?: string;
     children?: ReactNode;
     href?: string;
     style?: CSSProperties;
     maxWidth?: string;
 }
-export declare const Typography: ({ loading, loadingText, as, size, color, theme, className, style, maxWidth, children, ...restProps }: TypographyProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Typography: ({ loading, loadingText, as, size, color, variant, className, style, maxWidth, children, ...restProps }: TypographyProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ loading, loadingText, as, size, color, theme, className, style, maxWidth, children, ...restProps }: import('./Typography').TypographyProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ loading, loadingText, as, size, color, variant, className, style, maxWidth, children, ...restProps }: import('./Typography').TypographyProps) => import("react/jsx-runtime").JSX.Element;
     tags: string[];
     parameters: {};
     args: {

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

@@ -7,6 +7,7 @@ export * from './Button';
 export * from './Byline';
 export * from './ContextMenu';
 export * from './Dialog';
+export * from './Divider';
 export * from './Dropdown';
 export * from './Footer';
 export * from './GlobalMenu';
@@ -16,10 +17,11 @@ export * from './Layout';
 export * from './LayoutAction';
 export * from './List';
 export * from './Menu';
-export * from './Meta';
+export * from './Metadata';
 export * from './Profile';
 export * from './RootProvider';
 export * from './Search';
+export * from './Searchbar';
 export * from './Snackbar';
 export * from './Skeleton';
 export * from './Timeline';
@@ -31,4 +33,8 @@ export * from './ResourceList';
 export * from './AccessAreaList';
 export * from './AccessPackageList';
 export * from './Forms';
+export * from './Settings';
+export * from './Dashboard';
+export * from './ActivityLog';
+export * from './Article';
 export * from './DsComponents';

package/dist/types/lib/stories/Admin/Settings.stories.d.ts

@@ -0,0 +1,10 @@
+declare const meta: {
+    title: string;
+    tags: string[];
+    parameters: {};
+    args: {};
+};
+export default meta;
+export declare const PrimarySettings: () => import("react/jsx-runtime").JSX.Element;
+export declare const SecondarySettings: () => import("react/jsx-runtime").JSX.Element;
+export declare const RoleSettings: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/stories/Admin.stories.d.ts

@@ -0,0 +1,18 @@
+declare const meta: {
+    title: string;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {};
+};
+export default meta;
+export declare const Dashboard: () => import("react/jsx-runtime").JSX.Element;
+export declare const Users: () => import("react/jsx-runtime").JSX.Element;
+export declare const Access: () => import("react/jsx-runtime").JSX.Element;
+export declare const Requests: () => import("react/jsx-runtime").JSX.Element;
+export declare const ApiSettings: () => import("react/jsx-runtime").JSX.Element;
+export declare const ReverseAccess: () => import("react/jsx-runtime").JSX.Element;
+export declare const ClientAdmin: () => import("react/jsx-runtime").JSX.Element;
+export declare const Settings: () => import("react/jsx-runtime").JSX.Element;
+export declare const Log: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/stories/Inbox.stories.d.ts

@@ -0,0 +1,20 @@
+declare const meta: {
+    title: string;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {};
+};
+export default meta;
+export declare const Inbox: () => import("react/jsx-runtime").JSX.Element;
+export declare const Search: () => import("react/jsx-runtime").JSX.Element;
+export declare const Drafts: () => import("react/jsx-runtime").JSX.Element;
+export declare const Sent: () => import("react/jsx-runtime").JSX.Element;
+export declare const Bookmarks: () => import("react/jsx-runtime").JSX.Element;
+export declare const Dialog: ({ tabId }: {
+    tabId?: string | undefined;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const DialogInfo: () => import("react/jsx-runtime").JSX.Element;
+export declare const DialogActivityLog: () => import("react/jsx-runtime").JSX.Element;
+export declare const DialogContact: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/stories/Portal.stories.d.ts

@@ -0,0 +1,14 @@
+declare const meta: {
+    title: string;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {};
+};
+export default meta;
+export declare const Home: () => import("react/jsx-runtime").JSX.Element;
+export declare const Search: () => import("react/jsx-runtime").JSX.Element;
+export declare const Category: () => import("react/jsx-runtime").JSX.Element;
+export declare const Topic: () => import("react/jsx-runtime").JSX.Element;
+export declare const Service: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/stories/Profile/Accounts.stories.d.ts

@@ -0,0 +1,19 @@
+import { AccountListItemProps } from '../../components';
+declare const meta: {
+    title: string;
+    tags: string[];
+    parameters: {};
+    args: {
+        items: AccountListItemProps[];
+    };
+};
+export default meta;
+export declare const Accounts: () => import("react/jsx-runtime").JSX.Element;
+interface AccountDetailsProps {
+    type?: AccountListItemProps["type"];
+    favourite?: AccountListItemProps["favourite"];
+}
+export declare const AccountDetails: ({ type, favourite }: AccountDetailsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CompanyDetails: () => import("react/jsx-runtime").JSX.Element;
+export declare const PersonDetails: () => import("react/jsx-runtime").JSX.Element;
+export declare const GroupDetails: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/stories/Profile/Settings.stories.d.ts

@@ -0,0 +1,16 @@
+declare const meta: {
+    title: string;
+    tags: string[];
+    parameters: {};
+    args: {};
+};
+export default meta;
+export declare const ContactSettings: () => import("react/jsx-runtime").JSX.Element;
+export declare const MoreSettings: () => import("react/jsx-runtime").JSX.Element;
+export declare const AccountSettings: () => import("react/jsx-runtime").JSX.Element;
+export declare const NotificationSettings: () => import("react/jsx-runtime").JSX.Element;
+export declare const SettingsList: () => import("react/jsx-runtime").JSX.Element;
+export declare const CollapsibleList: () => import("react/jsx-runtime").JSX.Element;
+export declare const CompanySettings: () => import("react/jsx-runtime").JSX.Element;
+export declare const PersonSettings: () => import("react/jsx-runtime").JSX.Element;
+export declare const CompanyNotifications: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/stories/Profile.stories.d.ts

@@ -0,0 +1,16 @@
+declare const meta: {
+    title: string;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {};
+};
+export default meta;
+export declare const Dashboard: () => import("react/jsx-runtime").JSX.Element;
+export declare const Accounts: () => import("react/jsx-runtime").JSX.Element;
+export declare const Users: () => import("react/jsx-runtime").JSX.Element;
+export declare const Access: () => import("react/jsx-runtime").JSX.Element;
+export declare const Settings: () => import("react/jsx-runtime").JSX.Element;
+export declare const Notifications: () => import("react/jsx-runtime").JSX.Element;
+export declare const Log: () => import("react/jsx-runtime").JSX.Element;

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

@@ -1,2 +1,2 @@
-export type Color = 'inherit' | 'accent' | 'company' | 'person' | 'neutral' | 'success' | 'warning' | 'error' | 'danger' | 'info' | 'alert';
-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';
+export type Color = 'inherit' | 'accent' | 'company' | 'person' | 'neutral' | 'article' | 'success' | 'warning' | 'error' | 'danger' | 'info' | 'alert';
+export type Theme = 'transparent' | 'default' | 'tinted' | 'subtle' | 'surface' | 'surface-default' | 'surface-hover' | 'surface-active' | 'border' | 'border-subtle' | 'border-default' | 'border-strong' | 'base' | 'base-default' | 'base-hover' | 'base-active';

package/dist/useId-BVFxCjkq.js

@@ -0,0 +1,16 @@
+import c, { useState as d, useEffect as o } from "react";
+let a = 0;
+function s(t) {
+  const [e, u] = d(t), l = t || e;
+  return o(() => {
+    e == null && (a += 1, u(`aksel-icon-${a}`));
+  }, [e]), l;
+}
+const n = c.useId;
+function r(t) {
+  var e;
+  return n !== void 0 ? n().replace(/(:)/g, "") : (e = s(t)) !== null && e !== void 0 ? e : "";
+}
+export {
+  r as u
+};

package/dist/useMergeRefs-DOnoWyUH.js

@@ -0,0 +1,29 @@
+"use client";
+import { useRef as f, useCallback as i, useMemo as s } from "react";
+function a(e) {
+  const r = f(void 0), l = i((u) => {
+    const o = e.map((n) => {
+      if (n != null) {
+        if (typeof n == "function") {
+          const t = n, c = t(u);
+          return typeof c == "function" ? c : () => {
+            t(null);
+          };
+        }
+        return n.current = u, () => {
+          n.current = null;
+        };
+      }
+    });
+    return () => {
+      for (const n of o)
+        n == null || n();
+    };
+  }, e);
+  return s(() => e.every((u) => u == null) ? null : (u) => {
+    r.current && (r.current(), r.current = void 0), u != null && (r.current = l(u));
+  }, e);
+}
+export {
+  a as u
+};