@norges-domstoler/dds-components 2.5.1 → 4.0.0

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

@@ -1,9 +1,14 @@
-import { HTMLAttributes } from 'react';
-export declare type BreadcrumbsProps = {
+/// <reference types="react" />
+import { BaseComponentPropsWithChildren } from '../../types';
+export declare type BreadcrumbsProps = BaseComponentPropsWithChildren<HTMLElement, {
     /** Spesifiserer om versjonen for små skjermer skal vises; den viser `<Breadcrumb />` kun til den forrige siden.  */
     smallScreen?: boolean;
-} & HTMLAttributes<HTMLElement>;
+}>;
 export declare const Breadcrumbs: import("react").ForwardRefExoticComponent<{
+    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;
-} & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLElement>>;

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

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

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

@@ -1,5 +1,7 @@
 /// <reference types="react" />
 export declare const Button: import("react").ForwardRefExoticComponent<{
+    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;
@@ -10,4 +12,8 @@ export declare const Button: import("react").ForwardRefExoticComponent<{
     fullWidth?: boolean | undefined;
     href?: string | undefined;
     target?: string | undefined;
-} & import("react").ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>;
+} & {
+    onClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onFocus?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+    onBlur?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+} & import("react").RefAttributes<HTMLButtonElement>>;

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

@@ -3,6 +3,8 @@ import { ButtonProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
+        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;
@@ -13,7 +15,11 @@ declare const _default: {
         fullWidth?: boolean | undefined;
         href?: string | undefined;
         target?: string | undefined;
-    } & import("react").ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>;
+    } & {
+        onFocus?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+        onBlur?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+        onClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    } & import("react").RefAttributes<HTMLButtonElement>>;
     argTypes: {
         label: {
             control: {

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

@@ -1,11 +1,13 @@
 import { SvgIconTypeMap } from '@mui/material/SvgIcon';
 import { OverridableComponent } from '@mui/material/OverridableComponent';
 import { ButtonHTMLAttributes } from 'react';
+import { BaseComponentProps } from '../../types';
 export declare type ButtonPurpose = 'primary' | 'secondary' | 'danger';
 export declare type ButtonSize = 'tiny' | 'small' | 'medium' | 'large';
 export declare type ButtonAppearance = 'filled' | 'ghost' | 'rounded' | 'borderless';
 export declare type IconPosition = 'left' | 'right';
-export declare type ButtonProps = {
+declare type PickedHTMLAttributes = Pick<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'onFocus' | 'onBlur'>;
+export declare type ButtonProps = BaseComponentProps<HTMLButtonElement, {
     /**Størrelsen på knappen. */
     size?: ButtonSize;
     /**Tekst i knappen. */
@@ -26,4 +28,5 @@ export declare type ButtonProps = {
     href?: string;
     /**Nativt target-attributt som kan spesifiseres når knappen er et `<a>`-element.  */
     target?: string;
-} & ButtonHTMLAttributes<HTMLButtonElement>;
+} & PickedHTMLAttributes, Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof PickedHTMLAttributes>>;
+export {};

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

@@ -1,23 +1,23 @@
-import { AnchorHTMLAttributes, HTMLAttributes, RefObject } from 'react';
+import { AnchorHTMLAttributes, RefObject } from 'react';
+import { BaseComponentPropsWithChildren } from '../../types';
 export declare type CardColor = 'filledDark' | 'filledLight' | 'strokeDark' | 'strokeLight';
 export declare type CardType = 'info' | 'navigation' | 'expandable';
-export declare type InfoCardProps = {
+declare type BaseCardProps<T extends HTMLElement> = BaseComponentPropsWithChildren<T, {
     /** Fargepalett i komponenten. */
     color?: CardColor;
+    /** Referanse til komponenten. */
+    cardRef?: RefObject<T>;
+}>;
+export declare type InfoCardProps = BaseCardProps<HTMLDivElement> & {
     /** Spesifiserer funksjonalitet og formål med komponenten. **OBS!** ved `'navigation'` må `href` oppgis. Ved `'expandable'` må alle `<Card />` grupperte sammen ligge egen `<div>` container. */
     cardType: 'info';
-    /** Referanse til komponenten. */
-    cardRef?: RefObject<HTMLDivElement>;
-} & HTMLAttributes<HTMLDivElement>;
-export declare type NavigationCardProps = {
-    color?: CardColor;
+};
+export declare type NavigationCardProps = BaseCardProps<HTMLAnchorElement> & {
     cardType: 'navigation';
-    cardRef?: RefObject<HTMLAnchorElement>;
-} & AnchorHTMLAttributes<HTMLAnchorElement>;
-export declare type ExpandableCardProps = {
-    color?: CardColor;
+} & Pick<AnchorHTMLAttributes<HTMLAnchorElement>, 'href' | 'target'>;
+export declare type ExpandableCardProps = BaseCardProps<HTMLDivElement> & {
     cardType: 'expandable';
-    cardRef?: RefObject<HTMLDivElement>;
-} & HTMLAttributes<HTMLDivElement>;
+};
 export declare type CardProps = InfoCardProps | NavigationCardProps | ExpandableCardProps;
 export declare const Card: (props: CardProps) => JSX.Element;
+export {};

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

@@ -1,9 +1,14 @@
-import { HTMLAttributes } from 'react';
-export declare type CardAccordionProps = {
+/// <reference types="react" />
+import { BaseComponentPropsWithChildren } from '../../../types';
+export declare type CardAccordionProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Spesifiserer om body skal være utvidet ved innlastning. */
     isExpanded?: boolean;
-} & HTMLAttributes<HTMLDivElement>;
+}>;
 export declare const CardAccordion: import("react").ForwardRefExoticComponent<{
+    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;
-} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

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

@@ -1,18 +1,23 @@
-import { HTMLAttributes } from 'react';
+/// <reference types="react" />
 import { Property } from 'csstype';
-export declare type CardAccordionBodyProps = {
+import { BaseComponentPropsWithChildren } from '../../../types';
+export declare type CardAccordionBodyProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller komponenten om den skal utvides.  */
     isExpanded?: boolean;
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller `id` til `<CardAccordionHeader />`.  */
     headerId?: string;
     /**Overskriver default padding på toppen. Brukes når barn har spacing på toppen, f.eks. en overskrift. */
     paddingTop?: Property.PaddingTop<string>;
-} & HTMLAttributes<HTMLDivElement>;
+}>;
 export declare const CardAccordionBody: import("react").ForwardRefExoticComponent<{
+    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 />`.  */
     headerId?: string | undefined;
     /**Overskriver default padding på toppen. Brukes når barn har spacing på toppen, f.eks. en overskrift. */
     paddingTop?: Property.PaddingTop<string> | undefined;
-} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

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

@@ -1,17 +1,22 @@
 import { ButtonHTMLAttributes } from 'react';
-export declare type CardAccordionHeaderProps = {
+import { BaseComponentPropsWithChildren } from '../../../types';
+export declare type CardAccordionHeaderProps = BaseComponentPropsWithChildren<HTMLButtonElement, {
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller body er utvidet.  */
     isExpanded?: boolean;
     /** **OBS!** denne propen blir satt automatisk av forelder. Callback for å styre utvidelse og sammentrukking.  */
     toggleExpanded?: () => void;
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller `id` til `<CardAccordionBody />`.  */
     bodyId?: string;
-} & ButtonHTMLAttributes<HTMLButtonElement>;
+}, ButtonHTMLAttributes<HTMLButtonElement>>;
 export declare const CardAccordionHeader: import("react").ForwardRefExoticComponent<{
+    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.  */
     toggleExpanded?: (() => void) | undefined;
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller `id` til `<CardAccordionBody />`.  */
     bodyId?: string | undefined;
-} & ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLButtonElement>>;

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

@@ -1,8 +1,15 @@
 /// <reference types="react" />
 export declare const Checkbox: import("react").ForwardRefExoticComponent<{
+    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;
     readOnly?: boolean | undefined;
     indeterminate?: boolean | undefined;
-} & import("react").InputHTMLAttributes<HTMLInputElement> & import("react").RefAttributes<HTMLInputElement>>;
+} & {
+    'aria-describedby'?: string | undefined;
+    name?: string | undefined;
+    checked?: boolean | undefined;
+    onChange?: import("react").ChangeEventHandler<HTMLInputElement> | undefined;
+} & import("react").RefAttributes<HTMLInputElement>>;

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

@@ -3,12 +3,19 @@ import { CheckboxProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
+        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;
         readOnly?: boolean | undefined;
         indeterminate?: boolean | undefined;
-    } & import("react").InputHTMLAttributes<HTMLInputElement> & import("react").RefAttributes<HTMLInputElement>>;
+    } & {
+        'aria-describedby'?: string | undefined;
+        onChange?: import("react").ChangeEventHandler<HTMLInputElement> | undefined;
+        name?: string | undefined;
+        checked?: boolean | undefined;
+    } & import("react").RefAttributes<HTMLInputElement>>;
     argTypes: {
         label: {
             control: {

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

@@ -1,5 +1,7 @@
 import { InputHTMLAttributes } from 'react';
-export declare type CheckboxProps = {
+import { BaseComponentProps } from '../../types';
+declare type PickedHTMLAttributes = Pick<InputHTMLAttributes<HTMLInputElement>, 'aria-describedby' | 'name' | 'checked' | 'onChange'>;
+export declare type CheckboxProps = BaseComponentProps<HTMLInputElement, {
     /** Ledetekst for inputelementet. */
     label?: string;
     /**Indikererr ugyldig input, endrer styling. */
@@ -10,4 +12,5 @@ export declare type CheckboxProps = {
     readOnly?: boolean;
     /**Brukes ved nøstet struktur der alle Checkbox som hører til en gruppe kan bli valgt ved å trykke på en forelder Checkbox. Hvis enkelte <Checkbox /> blir valgt men ikke alle skal forelder <Checkbox /> få tilstanden indeterminate - verken checked eller ikke. */
     indeterminate?: boolean;
-} & InputHTMLAttributes<HTMLInputElement>;
+} & PickedHTMLAttributes, Omit<InputHTMLAttributes<HTMLInputElement>, keyof PickedHTMLAttributes>>;
+export {};

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

@@ -1,13 +1,16 @@
-import { HTMLAttributes } from 'react';
-export declare type ChipProps = {
+/// <reference types="react" />
+import { BaseComponentProps } from '../../types';
+export declare type ChipProps = BaseComponentProps<HTMLDivElement, {
     /** Teksten som vises i komponenten. */
     text?: string;
     /** Ekstra logikk når `<Chip />` lukkes. */
     onClose?: () => void;
-} & HTMLAttributes<HTMLDivElement>;
+}>;
 export declare const Chip: import("react").ForwardRefExoticComponent<{
+    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. */
     onClose?: (() => void) | undefined;
-} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+} & import("react").RefAttributes<HTMLDivElement>>;

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

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

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

@@ -1,10 +1,15 @@
-import { HTMLAttributes } from 'react';
+/// <reference types="react" />
+import { BaseComponentPropsWithChildren } from '../../types';
 export declare type DescriptionListAppearance = 'small' | 'bold';
-export declare type DescriptionListProps = {
+export declare type DescriptionListProps = BaseComponentPropsWithChildren<HTMLDListElement, {
     /**Påvirker tekst styling. */
     appearance?: DescriptionListAppearance;
-} & HTMLAttributes<HTMLDListElement>;
+}>;
 export declare const DescriptionList: import("react").ForwardRefExoticComponent<{
+    htmlProps?: import("react").HTMLAttributes<HTMLDListElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDListElement>, "id" | "className"> & {
     /**Påvirker tekst styling. */
     appearance?: DescriptionListAppearance | undefined;
-} & HTMLAttributes<HTMLDListElement> & import("react").RefAttributes<HTMLDListElement>>;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDListElement>>;

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

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

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

@@ -1,11 +1,16 @@
-import { HTMLAttributes } from 'react';
+/// <reference types="react" />
 import { OverridableComponent } from '@mui/material/OverridableComponent';
 import { SvgIconTypeMap } from '@mui/material';
-export declare type DescriptionListDescProps = {
+import { BaseComponentPropsWithChildren } from '../../types';
+export declare type DescriptionListDescProps = BaseComponentPropsWithChildren<HTMLElement, {
     /**Ikon som vises ved siden av teksten. */
     Icon?: OverridableComponent<SvgIconTypeMap<Record<string, unknown>, 'svg'>>;
-} & HTMLAttributes<HTMLElement>;
+}>;
 export declare const DescriptionListDesc: import("react").ForwardRefExoticComponent<{
+    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;
-} & HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,10 +1,15 @@
-import { HTMLAttributes } from 'react';
+/// <reference types="react" />
 import { Property } from 'csstype';
-export declare type DescriptionListGroupProps = {
+import { BaseComponentPropsWithChildren } from '../../types';
+export declare type DescriptionListGroupProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Custom margin. */
     margin?: Property.Margin<string>;
-} & HTMLAttributes<HTMLDivElement>;
+}>;
 export declare const DescriptionListGroup: import("react").ForwardRefExoticComponent<{
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
     /**Custom margin. */
     margin?: Property.Margin<string> | undefined;
-} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

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

@@ -1,10 +1,13 @@
-import { HTMLAttributes } from 'react';
+/// <reference types="react" />
+import { BaseComponentProps } from '../../types';
 export declare type DividerColor = 'primary' | 'primaryLighter';
-export declare type DividerProps = {
+export declare type DividerProps = BaseComponentProps<HTMLHRElement, {
     /** Farge på horisontal linje. */
     color?: DividerColor;
-} & HTMLAttributes<HTMLHRElement>;
+}>;
 export declare const Divider: import("react").ForwardRefExoticComponent<{
+    htmlProps?: import("react").HTMLAttributes<HTMLHRElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLHRElement>, "id" | "className"> & {
     /** Farge på horisontal linje. */
     color?: DividerColor | undefined;
-} & HTMLAttributes<HTMLHRElement> & import("react").RefAttributes<HTMLHRElement>>;
+} & import("react").RefAttributes<HTMLHRElement>>;

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

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

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

@@ -1,5 +1,6 @@
-import { HTMLAttributes, ReactNode, RefObject } from 'react';
+import { ReactNode, RefObject } from 'react';
 import { Property } from 'csstype';
+import { BaseComponentPropsWithChildren } from '../../types';
 export declare type DrawerSize = 'small' | 'large';
 export declare type DrawerPlacement = 'left' | 'right';
 export declare type WidthProps = {
@@ -7,7 +8,7 @@ export declare type WidthProps = {
     maxWidth?: Property.MaxWidth<string>;
     width?: Property.Width<string>;
 };
-export declare type DrawerProps = {
+export declare type DrawerProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Størrelsen på `<Drawer />`. */
     size?: DrawerSize;
     /** Plasseringen til `<Drawer />`. */
@@ -24,8 +25,10 @@ export declare type DrawerProps = {
     widthProps?: WidthProps;
     /**Ref til elementet som åpner `<Drawer />`.  **OBS!** nødvendig kun hvis `<DrawerGroup />` ikke er i bruk. */
     triggerRef?: RefObject<HTMLElement>;
-} & HTMLAttributes<HTMLDivElement>;
+}>;
 export declare const Drawer: import("react").ForwardRefExoticComponent<{
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /**Størrelsen på `<Drawer />`. */
     size?: DrawerSize | undefined;
     /** Plasseringen til `<Drawer />`. */
@@ -42,4 +45,6 @@ export declare const Drawer: import("react").ForwardRefExoticComponent<{
     widthProps?: WidthProps | undefined;
     /**Ref til elementet som åpner `<Drawer />`.  **OBS!** nødvendig kun hvis `<DrawerGroup />` ikke er i bruk. */
     triggerRef?: RefObject<HTMLElement> | undefined;
-} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+} & {
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

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

@@ -3,6 +3,8 @@ import { DrawerProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
+        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;
@@ -11,7 +13,9 @@ declare const _default: {
         parentElement?: HTMLElement | undefined;
         widthProps?: import("./Drawer").WidthProps | undefined;
         triggerRef?: import("react").RefObject<HTMLElement> | undefined;
-    } & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+    } & {
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<HTMLDivElement>>;
 };
 export default _default;
 export declare const OverviewPlacement: (args: DrawerProps) => JSX.Element;

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

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-declare type drawerGroupProps = {
+declare type DrawerGroupProps = {
     /**Barna til komponenten. */
     children: ReactNode;
     /**`id` til `<Drawer />`. */
@@ -9,5 +9,5 @@ declare type drawerGroupProps = {
     /**Ekstra logikk som kjøres når `<Drawer />` lukkes. */
     onClose?: () => void;
 };
-export declare const DrawerGroup: ({ children, drawerId, onOpen, onClose }: drawerGroupProps) => JSX.Element;
+export declare const DrawerGroup: ({ children, drawerId, onOpen, onClose }: DrawerGroupProps) => JSX.Element;
 export {};

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

@@ -1,6 +1,7 @@
-import { HTMLAttributes } from 'react';
+/// <reference types="react" />
+import { BaseComponentPropsWithChildren } from '../../types';
 export declare type GlobalMessagePurpose = 'info' | 'warning' | 'danger';
-export declare type GlobalMessageProps = {
+export declare type GlobalMessageProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Meldingen som vises til brukeren. Brukes kun når meldingen er en `string`. */
     message?: string;
     /**Formålet med meldingen. Påvirker styling. */
@@ -9,8 +10,10 @@ export declare type GlobalMessageProps = {
     closable?: boolean;
     /**Ekstra logikk å kjøre når meldingen lukkes. */
     onClose?: () => void;
-} & HTMLAttributes<HTMLDivElement>;
+}>;
 export declare const GlobalMessage: import("react").ForwardRefExoticComponent<{
+    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. */
@@ -19,4 +22,6 @@ export declare const GlobalMessage: import("react").ForwardRefExoticComponent<{
     closable?: boolean | undefined;
     /**Ekstra logikk å kjøre når meldingen lukkes. */
     onClose?: (() => void) | undefined;
-} & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

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

@@ -3,11 +3,15 @@ import { GlobalMessageProps } from './GlobalMessage';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<{
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         message?: string | undefined;
         purpose?: import("./GlobalMessage").GlobalMessagePurpose | undefined;
         closable?: boolean | undefined;
         onClose?: (() => void) | undefined;
-    } & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+    } & {
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<HTMLDivElement>>;
     argTypes: {
         message: {
             control: {

package/dist/components/IconWrapper/IconWrapper.d.ts

@@ -3,12 +3,17 @@ import { OverridableComponent } from '@mui/material/OverridableComponent';
 import { HTMLAttributes } from 'react';
 import { Property } from 'csstype';
 export declare type IconSize = 'small' | 'medium' | 'large' | 'inline';
+declare type SvgIconTypeProps = SvgIconTypeMap<Record<string, unknown>, 'svg'>;
 export declare type IconWrapperProps = {
     /**Ikon. */
-    Icon: OverridableComponent<SvgIconTypeMap<Record<string, unknown>, 'svg'>>;
+    Icon: OverridableComponent<SvgIconTypeProps>;
     /**Størrelsen til ikonet. */
     iconSize?: IconSize;
     /**Fargen til ikonet. */
     color?: Property.Color;
-} & HTMLAttributes<SVGElement>;
-export declare function IconWrapper({ Icon, iconSize, color, className, style, ...rest }: IconWrapperProps): JSX.Element;
+    className?: HTMLAttributes<SVGElement>['className'];
+    style?: HTMLAttributes<SVGElement>['style'];
+    svgProps?: SvgIconTypeProps['props'];
+};
+export declare function IconWrapper({ Icon, iconSize, color, className, style, svgProps }: IconWrapperProps): JSX.Element;
+export {};