@norges-domstoler/dds-components 3.0.0 → 4.0.1

package/dist/components/Breadcrumbs/Breadcrumb.d.ts

@@ -1,4 +1,3 @@
-import { AnchorHTMLAttributes } from 'react';
-import { TypographyProps } from '../Typography';
-export declare type BreadcrumbProps = TypographyProps & AnchorHTMLAttributes<HTMLAnchorElement>;
-export declare const Breadcrumb: import("react").ForwardRefExoticComponent<BreadcrumbProps & import("react").RefAttributes<HTMLAnchorElement>>;
+import { AnchorHTMLAttributes, HTMLAttributes } from 'react';
+export declare type BreadcrumbProps = HTMLAttributes<HTMLSpanElement> | AnchorHTMLAttributes<HTMLAnchorElement>;
+export declare const Breadcrumb: import("react").ForwardRefExoticComponent<BreadcrumbProps & import("react").RefAttributes<HTMLElement>>;

package/dist/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -5,9 +5,8 @@ export declare type BreadcrumbsProps = BaseComponentPropsWithChildren<HTMLElemen
     smallScreen?: boolean;
 }>;
 export declare const Breadcrumbs: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLElement>, "className" | "id"> & {
     /** Spesifiserer om versjonen for små skjermer skal vises; den viser `<Breadcrumb />` kun til den forrige siden.  */
     smallScreen?: boolean | undefined;
 } & {

package/dist/components/Breadcrumbs/Breadcrumbs.stories.d.ts

@@ -3,9 +3,8 @@ import { BreadcrumbsProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLElement>, "id" | "className"> & {
         smallScreen?: boolean | undefined;
     } & {
         children?: import("react").ReactNode;

package/dist/components/Button/Button.d.ts

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 export declare const Button: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onClick" | "onFocus" | "onBlur">, "id"> | undefined;
-} & {
+    htmlProps?: Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onClick" | "onFocus" | "onBlur"> | undefined;
+} & Pick<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onClick" | "onFocus" | "onBlur">, "id" | "className"> & {
     size?: import("./Button.types").ButtonSize | undefined;
     label?: string | undefined;
     purpose?: import("./Button.types").ButtonPurpose | undefined;

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

@@ -3,9 +3,8 @@ import { ButtonProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onFocus" | "onBlur" | "onClick">, "id"> | undefined;
-    } & {
+        htmlProps?: Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onFocus" | "onBlur" | "onClick"> | undefined;
+    } & Pick<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onFocus" | "onBlur" | "onClick">, "id" | "className"> & {
         size?: import("./Button.types").ButtonSize | undefined;
         label?: string | undefined;
         purpose?: import("./Button.types").ButtonPurpose | undefined;

package/dist/components/Card/CardAccordion/CardAccordion.d.ts

@@ -5,9 +5,8 @@ export declare type CardAccordionProps = BaseComponentPropsWithChildren<HTMLDivE
     isExpanded?: boolean;
 }>;
 export declare const CardAccordion: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
     /**Spesifiserer om body skal være utvidet ved innlastning. */
     isExpanded?: boolean | undefined;
 } & {

package/dist/components/Card/CardAccordion/CardAccordionBody.d.ts

@@ -10,9 +10,8 @@ export declare type CardAccordionBodyProps = BaseComponentPropsWithChildren<HTML
     paddingTop?: Property.PaddingTop<string>;
 }>;
 export declare const CardAccordionBody: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller komponenten om den skal utvides.  */
     isExpanded?: boolean | undefined;
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller `id` til `<CardAccordionHeader />`.  */

package/dist/components/Card/CardAccordion/CardAccordionHeader.d.ts

@@ -9,9 +9,8 @@ export declare type CardAccordionHeaderProps = BaseComponentPropsWithChildren<HT
     bodyId?: string;
 }, ButtonHTMLAttributes<HTMLButtonElement>>;
 export declare const CardAccordionHeader: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<ButtonHTMLAttributes<HTMLButtonElement>, "id"> | undefined;
-} & {
+    htmlProps?: ButtonHTMLAttributes<HTMLButtonElement> | undefined;
+} & Pick<ButtonHTMLAttributes<HTMLButtonElement>, "className" | "id"> & {
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller body er utvidet.  */
     isExpanded?: boolean | undefined;
     /** **OBS!** denne propen blir satt automatisk av forelder. Callback for å styre utvidelse og sammentrukking.  */

package/dist/components/Checkbox/Checkbox.d.ts

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 export declare const Checkbox: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "name" | "checked" | "onChange">, "id"> | undefined;
-} & {
+    htmlProps?: Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "name" | "checked" | "onChange"> | undefined;
+} & Pick<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "name" | "checked" | "onChange">, "id" | "className"> & {
     label?: string | undefined;
     error?: boolean | undefined;
     disabled?: boolean | undefined;

package/dist/components/Checkbox/Checkbox.stories.d.ts

@@ -3,9 +3,8 @@ import { CheckboxProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "onChange" | "name" | "checked">, "id"> | undefined;
-    } & {
+        htmlProps?: Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "onChange" | "name" | "checked"> | undefined;
+    } & Pick<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "onChange" | "name" | "checked">, "id" | "className"> & {
         label?: string | undefined;
         error?: boolean | undefined;
         disabled?: boolean | undefined;

package/dist/components/Checkbox/CheckboxGroup.d.ts

@@ -1,6 +1,7 @@
-import { HTMLAttributes } from 'react';
+/// <reference types="react" />
+import { BaseComponentPropsWithChildren } from '../../types';
 declare type Direction = 'column' | 'row';
-export declare type CheckboxGroupProps = {
+export declare type CheckboxGroupProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Ledetekst for gruppen. */
     label?: string;
     /**Retningen barna gjengis i. */
@@ -12,6 +13,6 @@ export declare type CheckboxGroupProps = {
     tip?: string;
     /**Indikerer at det er påkrevd å velge minst ett alternativ. Innebærer visuell endring. **OBS!** `required` må i tillegg gis til `<Checkbox />` manuelt. */
     required?: boolean;
-} & HTMLAttributes<HTMLDivElement>;
-export declare const CheckboxGroup: ({ label, direction, errorMessage, tip, required, groupId, children, className, style, ...rest }: CheckboxGroupProps) => JSX.Element;
+}>;
+export declare const CheckboxGroup: ({ label, direction, errorMessage, tip, required, groupId, children, id, className, htmlProps, ...rest }: CheckboxGroupProps) => JSX.Element;
 export {};

package/dist/components/Checkbox/CheckboxGroup.stories.d.ts

@@ -2,7 +2,7 @@
 import { CheckboxGroupProps } from '.';
 declare const _default: {
     title: string;
-    component: ({ label, direction, errorMessage, tip, required, groupId, children, className, style, ...rest }: CheckboxGroupProps) => JSX.Element;
+    component: ({ label, direction, errorMessage, tip, required, groupId, children, id, className, htmlProps, ...rest }: CheckboxGroupProps) => JSX.Element;
     argTypes: {
         label: {
             control: {

package/dist/components/Chip/Chip.d.ts

@@ -7,9 +7,8 @@ export declare type ChipProps = BaseComponentProps<HTMLDivElement, {
     onClose?: () => void;
 }>;
 export declare const Chip: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /** Teksten som vises i komponenten. */
     text?: string | undefined;
     /** Ekstra logikk når `<Chip />` lukkes. */

package/dist/components/Chip/Chip.stories.d.ts

@@ -3,9 +3,8 @@ import { ChipProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         text?: string | undefined;
         onClose?: (() => void) | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/DescriptionList/DescriptionList.d.ts

@@ -6,9 +6,8 @@ export declare type DescriptionListProps = BaseComponentPropsWithChildren<HTMLDL
     appearance?: DescriptionListAppearance;
 }>;
 export declare const DescriptionList: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDListElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDListElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDListElement>, "id" | "className"> & {
     /**Påvirker tekst styling. */
     appearance?: DescriptionListAppearance | undefined;
 } & {

package/dist/components/DescriptionList/DescriptionList.stories.d.ts

@@ -3,9 +3,8 @@ import { DescriptionListProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLDListElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDListElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDListElement>, "id" | "className"> & {
         appearance?: import("./DescriptionList").DescriptionListAppearance | undefined;
     } & {
         children?: import("react").ReactNode;

package/dist/components/DescriptionList/DescriptionListDesc.d.ts

@@ -7,9 +7,8 @@ export declare type DescriptionListDescProps = BaseComponentPropsWithChildren<HT
     Icon?: OverridableComponent<SvgIconTypeMap<Record<string, unknown>, 'svg'>>;
 }>;
 export declare const DescriptionListDesc: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLElement>, "className" | "id"> & {
     /**Ikon som vises ved siden av teksten. */
     Icon?: OverridableComponent<SvgIconTypeMap<Record<string, unknown>, "svg">> | undefined;
 } & {

package/dist/components/DescriptionList/DescriptionListGroup.d.ts

@@ -6,9 +6,8 @@ export declare type DescriptionListGroupProps = BaseComponentPropsWithChildren<H
     margin?: Property.Margin<string>;
 }>;
 export declare const DescriptionListGroup: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
     /**Custom margin. */
     margin?: Property.Margin<string> | undefined;
 } & {

package/dist/components/Divider/Divider.d.ts

@@ -6,9 +6,8 @@ export declare type DividerProps = BaseComponentProps<HTMLHRElement, {
     color?: DividerColor;
 }>;
 export declare const Divider: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLHRElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLHRElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLHRElement>, "id" | "className"> & {
     /** Farge på horisontal linje. */
     color?: DividerColor | undefined;
 } & import("react").RefAttributes<HTMLHRElement>>;

package/dist/components/Divider/Divider.stories.d.ts

@@ -3,9 +3,8 @@ import { DividerProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLHRElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLHRElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLHRElement>, "id" | "className"> & {
         color?: import("./Divider").DividerColor | undefined;
     } & import("react").RefAttributes<HTMLHRElement>>;
     argTypes: {};

package/dist/components/Drawer/Drawer.d.ts

@@ -27,9 +27,8 @@ export declare type DrawerProps = BaseComponentPropsWithChildren<HTMLDivElement,
     triggerRef?: RefObject<HTMLElement>;
 }>;
 export declare const Drawer: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /**Størrelsen på `<Drawer />`. */
     size?: DrawerSize | undefined;
     /** Plasseringen til `<Drawer />`. */

package/dist/components/Drawer/Drawer.stories.d.ts

@@ -3,9 +3,8 @@ import { DrawerProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         size?: import("./Drawer").DrawerSize | undefined;
         placement?: import("./Drawer").DrawerPlacement | undefined;
         header?: import("react").ReactNode;

package/dist/components/GlobalMessage/GlobalMessage.d.ts

@@ -12,9 +12,8 @@ export declare type GlobalMessageProps = BaseComponentPropsWithChildren<HTMLDivE
     onClose?: () => void;
 }>;
 export declare const GlobalMessage: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
     /**Meldingen som vises til brukeren. Brukes kun når meldingen er en `string`. */
     message?: string | undefined;
     /**Formålet med meldingen. Påvirker styling. */

package/dist/components/GlobalMessage/GlobalMessage.stories.d.ts

@@ -3,9 +3,8 @@ import { GlobalMessageProps } from './GlobalMessage';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         message?: string | undefined;
         purpose?: import("./GlobalMessage").GlobalMessagePurpose | undefined;
         closable?: boolean | undefined;

package/dist/components/InputMessage/InputMessage.d.ts

@@ -8,10 +8,8 @@ export declare type InputMessageProps = BaseComponentProps<HTMLDivElement, {
     messageType: InputMessageType;
 }>;
 export declare const InputMessage: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    /** Formålet med meldingen. Påvirker styling. */
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /** Meldingen som vises til brukeren. */
     message: string;
     /** Formålet med meldingen. Påvirker styling. */

package/dist/components/InputMessage/InputMessage.stories.d.ts

@@ -3,9 +3,8 @@ import { InputMessageProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         message: string;
         messageType: import("./InputMessage").InputMessageType;
     } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/InternalHeader/InternalHeader.styles.d.ts

@@ -13,9 +13,8 @@ declare type NavListProps = Pick<InternalHeaderProps, 'smallScreen'>;
 export declare const NavigationList: import("styled-components").StyledComponent<"ul", any, NavListProps, never>;
 export declare const ContextMenuGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const StyledOverflowMenu: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     items?: import("../OverflowMenu").OverflowMenuContextItem[] | undefined;
     userProps?: ({
         name: string;

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

@@ -10,9 +10,8 @@ export declare type ListProps = BaseComponentPropsWithChildren<HTMLUListElement
     typographyType?: ListTypographyType;
 }>;
 export declare const List: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLUListElement | HTMLOListElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLUListElement | HTMLOListElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLUListElement | HTMLOListElement>, "id" | "className"> & {
     /**Spesifiserer om komponenten skal returnere `<ul />` (punktliste) eller `<ol />` (nummerert liste). */
     listType?: ListType | undefined;
     /**Spesifiserer typografi for listen. Komponenten arver i utgangspunktet fra forelder, men hvis forelder stiller ikke med relevant styling  må det velges `TypographyBodyType` som brukes i `<body>` ellers på siden. */

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

@@ -3,9 +3,8 @@ import { ListProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLOListElement | HTMLUListElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLOListElement | HTMLUListElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLOListElement | HTMLUListElement>, "id" | "className"> & {
         listType?: import("./List").ListType | undefined;
         typographyType?: import("./List").ListTypographyType | undefined;
     } & {

package/dist/components/LocalMessage/LocalMessage.d.ts

@@ -18,9 +18,8 @@ export declare type LocalMessageProps = BaseComponentPropsWithChildren<HTMLDivEl
     width?: Property.Width<string>;
 }>;
 export declare const LocalMessage: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
     /**Meldingen som vises til brukeren. Brukes kun når meldingen er string. */
     message?: string | undefined;
     /**Formålet med meldingen. Påvirker styling. */

package/dist/components/LocalMessage/LocalMessage.stories.d.ts

@@ -3,9 +3,8 @@ import { LocalMessageProps } from './LocalMessage';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         message?: string | undefined;
         purpose?: import("./LocalMessage").LocalMessagePurpose | undefined;
         closable?: boolean | undefined;

package/dist/components/Modal/Modal.d.ts

@@ -13,9 +13,8 @@ export declare type ModalProps = BaseComponentPropsWithChildren<HTMLDivElement,
     triggerRef?: RefObject<HTMLElement>;
 }>;
 export declare const Modal: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /**Spesifiserer om modal skal vises. */
     isOpen?: boolean | undefined;
     /**Funksjon kjørt ved lukking; Settes hvis modal skal være lukkbar. Legger en lukkeknapp i hjørnet og kjøres ved Esc-trykk, lukkeknappklikk og museklikk utenfor. */

package/dist/components/Modal/Modal.stories.d.ts

@@ -3,9 +3,8 @@ import { ModalProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         isOpen?: boolean | undefined;
         onClose?: (() => void) | undefined;
         parentElement?: HTMLElement | undefined;

package/dist/components/Modal/ModalBody.d.ts

@@ -5,9 +5,8 @@ export declare type ModalBodyProps = BaseComponentPropsWithChildren<HTMLDivEleme
     scrollable?: boolean;
 }>;
 export declare const ModalBody: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /**Gjør at innholdet kan scrolles. Det må eventuelt settes (max)bredde og (max)høyde styling på både denne subkomponenten og `<Modal />`.  */
     scrollable?: boolean | undefined;
 } & {

package/dist/components/OverflowMenu/OverflowMenu.d.ts

@@ -6,9 +6,8 @@ declare type ContainerProps = {
 export declare const Container: import("styled-components").StyledComponent<"div", any, ContainerProps, never>;
 export declare const OverflowMenuList: import("styled-components").StyledComponent<"ul", any, {}, never>;
 export declare const OverflowMenu: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     items?: OverflowMenuContextItem[] | undefined;
     userProps?: ({
         name: string;

package/dist/components/OverflowMenu/OverflowMenu.stories.d.ts

@@ -3,9 +3,8 @@ import { OverflowMenuProps, OverflowMenuContextItem, OverflowMenuNavItem } from
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         items?: OverflowMenuContextItem[] | undefined;
         userProps?: ({
             name: string;

package/dist/components/Pagination/Pagination.d.ts

@@ -27,9 +27,8 @@ export declare type PaginationProps = BaseComponentProps<HTMLElement, {
     smallScreen?: boolean;
 }, Omit<HTMLAttributes<HTMLElement>, 'onChange'>>;
 export declare const Pagination: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<Omit<HTMLAttributes<HTMLElement>, "onChange">, "id"> | undefined;
-} & {
+    htmlProps?: Omit<HTMLAttributes<HTMLElement>, "onChange"> | undefined;
+} & Pick<Omit<HTMLAttributes<HTMLElement>, "onChange">, "className" | "id"> & {
     /**Totalt antall elementer å paginere. */
     itemsAmount: number;
     /**Antall elementer per side ved innlastning av komponenten. */

package/dist/components/Pagination/Pagination.stories.d.ts

@@ -3,9 +3,8 @@ import { PaginationProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<Omit<import("react").HTMLAttributes<HTMLElement>, "onChange">, "id"> | undefined;
-    } & {
+        htmlProps?: Omit<import("react").HTMLAttributes<HTMLElement>, "onChange"> | undefined;
+    } & Pick<Omit<import("react").HTMLAttributes<HTMLElement>, "onChange">, "id" | "className"> & {
         itemsAmount: number;
         defaultItemsPerPage?: number | undefined;
         defaultActivePage?: number | undefined;

package/dist/components/Popover/Popover.d.ts

@@ -31,9 +31,8 @@ export declare type PopoverProps = BaseComponentPropsWithChildren<HTMLDivElement
     sizeProps?: PopoverSizeProps;
 }>;
 export declare const Popover: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /**Tittel. */
     title?: string | ReactNode;
     /** **OBS!** Propen settes automatisk av `<PopoverGroup />`. Spesifiserer om `<Popover />` skal vises. */

package/dist/components/Popover/Popover.stories.d.ts

@@ -4,9 +4,8 @@ import { Placement } from '../../hooks';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLDivElement>, "id"> | undefined;
-    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         title?: import("react").ReactNode;
         isOpen?: boolean | undefined;
         withCloseButton?: boolean | undefined;

package/dist/components/RadioButton/RadioButton.d.ts

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 export declare const RadioButton: import("react").ForwardRefExoticComponent<{
-    id?: string | undefined;
-    htmlProps?: Omit<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "name" | "readOnly" | "checked" | "value" | "required" | "onChange" | "aria-describedby">, "id"> | undefined;
-} & {
+    htmlProps?: Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "name" | "readOnly" | "checked" | "value" | "required" | "onChange" | "aria-describedby"> | undefined;
+} & Pick<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "name" | "readOnly" | "checked" | "value" | "required" | "onChange" | "aria-describedby">, "id" | "className"> & {
     label?: string | undefined;
     disabled?: boolean | undefined;
     error?: boolean | undefined;

package/dist/components/RadioButton/RadioButton.stories.d.ts

@@ -3,9 +3,8 @@ import { RadioButtonProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
-        id?: string | undefined;
-        htmlProps?: Omit<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "onChange" | "name" | "value" | "checked" | "readOnly" | "required">, "id"> | undefined;
-    } & {
+        htmlProps?: Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "onChange" | "name" | "value" | "checked" | "readOnly" | "required"> | undefined;
+    } & Pick<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "onChange" | "name" | "value" | "checked" | "readOnly" | "required">, "id" | "className"> & {
         label?: string | undefined;
         disabled?: boolean | undefined;
         error?: boolean | undefined;

package/dist/components/RadioButton/RadioButtonGroup.d.ts

@@ -25,5 +25,5 @@ export declare type RadioButtonGroupProps<T extends string | number> = BaseCompo
     /**custom id for for gruppen, knytter `label` til gruppen via `aria-label`. */
     groupId?: string;
 }, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>>;
-export declare const RadioButtonGroup: <T extends string | number = string>({ name, label, groupId, errorMessage, tip, disabled, readOnly, direction, value, children, required, onChange, id, htmlProps, ...rest }: RadioButtonGroupProps<T>) => JSX.Element;
+export declare const RadioButtonGroup: <T extends string | number = string>({ name, label, groupId, errorMessage, tip, disabled, readOnly, direction, value, children, required, onChange, id, className, htmlProps, ...rest }: RadioButtonGroupProps<T>) => JSX.Element;
 export {};

package/dist/components/RadioButton/RadioButtonGroup.stories.d.ts

@@ -2,7 +2,7 @@
 import { RadioButtonGroupProps } from '.';
 declare const _default: {
     title: string;
-    component: <T extends string | number = string>({ name, label, groupId, errorMessage, tip, disabled, readOnly, direction, value, children, required, onChange, id, htmlProps, ...rest }: RadioButtonGroupProps<T>) => JSX.Element;
+    component: <T extends string | number = string>({ name, label, groupId, errorMessage, tip, disabled, readOnly, direction, value, children, required, onChange, id, className, htmlProps, ...rest }: RadioButtonGroupProps<T>) => JSX.Element;
     argTypes: {
         label: {
             control: {

package/dist/components/Select/MultiSelect.stories.d.ts

@@ -2,7 +2,7 @@
 import { SelectProps } from './Select';
 declare const _default: {
     title: string;
-    component: <TOption, IsMulti extends boolean = false>({ id, label, errorMessage, tip, required, readOnly, options, isMulti, value, defaultValue, width, closeMenuOnSelect, className, style, isDisabled, isClearable, placeholder, ...rest }: SelectProps<TOption, IsMulti>, ref: ((instance: import("react-select").SelectInstance<TOption, IsMulti, import("react-select").GroupBase<TOption>> | null) => void) | import("react").MutableRefObject<import("react-select").SelectInstance<TOption, IsMulti, import("react-select").GroupBase<TOption>> | null> | null) => JSX.Element;
+    component: <TOption extends Record<string, unknown>, IsMulti extends boolean = false>({ id, label, errorMessage, tip, required, readOnly, options, isMulti, value, defaultValue, width, closeMenuOnSelect, className, style, isDisabled, isClearable, placeholder, ...rest }: SelectProps<TOption, IsMulti>, ref: ((instance: import("react-select").SelectInstance<TOption, IsMulti, import("react-select").GroupBase<TOption>> | null) => void) | import("react").MutableRefObject<import("react-select").SelectInstance<TOption, IsMulti, import("react-select").GroupBase<TOption>> | null> | null) => JSX.Element;
     argTypes: {
         label: {
             control: {