@norges-domstoler/dds-components 5.4.1 → 5.5.0

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

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

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

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

package/dist/components/Divider/Divider.js

@@ -2,8 +2,8 @@ import { __rest } from 'tslib';
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import styled, { css } from 'styled-components';
-import { dividerTokens, dividerColors } from './Divider.tokens.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import { dividerTokens, dividerColors } from './Divider.tokens.js';
 
 var DividerLine = styled.hr.withConfig({
   displayName: "Divider__DividerLine",

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

@@ -1,10 +1,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"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLHRElement>, "id" | "className"> & {
         color?: import("./Divider").DividerColor | undefined;
+    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLHRElement> | undefined;
     } & import("react").RefAttributes<HTMLHRElement>>;
     argTypes: {};
 };

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

@@ -26,9 +26,7 @@ export declare type DrawerProps = BaseComponentPropsWithChildren<HTMLDivElement,
     /**Ref til elementet som åpner `<Drawer />`.  **OBS!** nødvendig kun hvis `<DrawerGroup />` ikke er i bruk. */
     triggerRef?: RefObject<HTMLElement>;
 }>;
-export declare const Drawer: import("react").ForwardRefExoticComponent<{
-    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
+export declare const Drawer: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /**Størrelsen på `<Drawer />`. */
     size?: DrawerSize | undefined;
     /** Plasseringen til `<Drawer />`. */
@@ -47,4 +45,6 @@ export declare const Drawer: import("react").ForwardRefExoticComponent<{
     triggerRef?: RefObject<HTMLElement> | undefined;
 } & {
     children?: ReactNode;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Drawer/Drawer.js

@@ -3,19 +3,35 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef, useId } from 'react';
 import { createPortal } from 'react-dom';
 import styled, { css } from 'styled-components';
-import { drawerTokens } from './Drawer.tokens.js';
-import { Paper } from '../../helpers/Paper/Paper.js';
-import { useMountTransition } from '../../hooks/useMountTransition.js';
-import { focusVisible } from '../../helpers/styling/focusVisible.js';
 import { Button } from '../Button/Button.js';
-import { useFocusTrap } from '../../hooks/useFocusTrap.js';
+import { Typography } from '../Typography/Typography/Typography.js';
+import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import '../Typography/Link/Link.js';
 import { useCombinedRef } from '../../hooks/useCombinedRefs.js';
-import { useOnKeyDown } from '../../hooks/useOnKeyDown.js';
 import { useOnClickOutside } from '../../hooks/useOnClickOutside.js';
-import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
-import { ScrollableContainer } from '../ScrollableContainer/ScrollableContainer.js';
-import { Typography } from '../Typography/Typography.js';
+import { useOnKeyDown } from '../../hooks/useOnKeyDown.js';
+import '../../hooks/useFloatPosition.js';
+import { useFocusTrap } from '../../hooks/useFocusTrap.js';
+import { useMountTransition } from '../../hooks/useMountTransition.js';
+import '../../hooks/useScreenSize.js';
+import { drawerTokens } from './Drawer.tokens.js';
+import { focusVisible } from '../../helpers/styling/focusVisible.js';
+import '../../helpers/styling/hover.js';
+import '../../helpers/styling/focus.js';
+import '../../helpers/styling/danger.js';
+import '../../helpers/styling/selection.js';
+import '../../helpers/Backdrop/Backdrop.js';
+import '../../helpers/Chevron/AnimatedChevronUpDown.styles.js';
+import '../../helpers/HiddenInput/HiddenInput.js';
+import '../../helpers/Input/Input.styles.js';
+import '../../helpers/Input/Input.tokens.js';
+import { Paper } from '../../helpers/Paper/Paper.js';
+import '../../helpers/RequiredMarker/RequiredMarker.js';
+import '../../icons/utils/StyledSvg.js';
 import { CloseIcon } from '../../icons/tsx/close.js';
+import '../ScrollableContainer/Scrollbar.js';
+import { ScrollableContainer } from '../ScrollableContainer/ScrollableContainer.js';
+import '../ScrollableContainer/ScrollableContainer.tokens.js';
 
 var Container = styled(Paper).withConfig({
   displayName: "Drawer__Container",

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

@@ -1,9 +1,7 @@
 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"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         size?: import("./Drawer").DrawerSize | undefined;
         placement?: import("./Drawer").DrawerPlacement | undefined;
         header?: import("react").ReactNode;
@@ -14,6 +12,8 @@ declare const _default: {
         triggerRef?: import("react").RefObject<HTMLElement> | undefined;
     } & {
         children?: import("react").ReactNode;
+    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
 };
 export default _default;

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

@@ -10,9 +10,7 @@ export declare type GlobalMessageProps = BaseComponentPropsWithChildren<HTMLDivE
     /**Ekstra logikk å kjøre når meldingen lukkes. */
     onClose?: () => void;
 }>;
-export declare const GlobalMessage: import("react").ForwardRefExoticComponent<{
-    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
+export declare const GlobalMessage: import("react").ForwardRefExoticComponent<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. */
@@ -23,4 +21,6 @@ export declare const GlobalMessage: import("react").ForwardRefExoticComponent<{
     onClose?: (() => void) | undefined;
 } & {
     children?: import("react").ReactNode;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/GlobalMessage/GlobalMessage.js

@@ -2,13 +2,15 @@ import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBab
 import { __rest } from 'tslib';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import styled, { css } from 'styled-components';
+import { Button } from '../Button/Button.js';
 import { forwardRef, useState } from 'react';
 import { globalMessageTokens } from './GlobalMessage.tokens.js';
-import { Button } from '../Button/Button.js';
-import { CloseIcon } from '../../icons/tsx/close.js';
 import { Icon } from '../Icon/Icon.js';
+import { Typography } from '../Typography/Typography/Typography.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
-import { Typography } from '../Typography/Typography.js';
+import '../Typography/Link/Link.js';
+import '../../icons/utils/StyledSvg.js';
+import { CloseIcon } from '../../icons/tsx/close.js';
 
 var Container = styled.div.withConfig({
   displayName: "GlobalMessage__Container",

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

@@ -1,15 +1,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"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         message?: string | undefined;
         purpose?: import("./GlobalMessage").GlobalMessagePurpose | undefined;
         closable?: boolean | undefined;
         onClose?: (() => void) | undefined;
     } & {
         children?: import("react").ReactNode;
+    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
     argTypes: {
         message: {

package/dist/components/GlobalMessage/GlobalMessage.tokens.js

@@ -1,7 +1,10 @@
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
+import 'tslib';
+import 'react/jsx-runtime';
+import '../../icons/utils/StyledSvg.js';
+import { ErrorIcon } from '../../icons/tsx/error.js';
 import { InfoIcon } from '../../icons/tsx/info.js';
 import { WarningIcon } from '../../icons/tsx/warning.js';
-import { ErrorIcon } from '../../icons/tsx/error.js';
 
 var Colors = ddsBaseTokens.colors,
     Spacing = ddsBaseTokens.spacing,

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

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

package/dist/components/InputMessage/InputMessage.js

@@ -1,12 +1,14 @@
 import { __rest } from 'tslib';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import styled, { css } from 'styled-components';
+import { Icon } from '../Icon/Icon.js';
 import { inputMessageTokens } from './InputMessage.tokens.js';
+import { Typography } from '../Typography/Typography/Typography.js';
 import { forwardRef } from 'react';
-import { ErrorIcon } from '../../icons/tsx/error.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
-import { Icon } from '../Icon/Icon.js';
-import { Typography } from '../Typography/Typography.js';
+import '../Typography/Link/Link.js';
+import '../../icons/utils/StyledSvg.js';
+import { ErrorIcon } from '../../icons/tsx/error.js';
 
 var InputMessageWrapper = styled.div.withConfig({
   displayName: "InputMessage__InputMessageWrapper",

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

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

package/dist/components/InternalHeader/InternalHeader.js

@@ -2,14 +2,16 @@ import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBab
 import { __rest } from 'tslib';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useRef } from 'react';
+import { Typography } from '../Typography/Typography/Typography.js';
+import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import '../Typography/Link/Link.js';
+import { Button } from '../Button/Button.js';
 import { Navigation, NavigationList, OuterContainer, BannerWrapper, BannerLeftWrapper, LovisaWrapper, ApplicationNameWrapper, ContextMenuGroup, StyledOverflowMenu } from './InternalHeader.styles.js';
 import { NavigationItem } from './NavigationItem.js';
 import { InternalHeaderListItem } from './InternalHeaderListItem.js';
+import '../../icons/utils/StyledSvg.js';
 import { MenuIcon } from '../../icons/tsx/menu.js';
 import { MoreVerticalIcon } from '../../icons/tsx/moreVertical.js';
-import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
-import { Typography } from '../Typography/Typography.js';
-import { Button } from '../Button/Button.js';
 
 var InternalHeader = function InternalHeader(props) {
   var applicationDesc = props.applicationDesc,

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

@@ -11,9 +11,7 @@ export declare const Navigation: import("styled-components").StyledComponent<"na
 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<{
-    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
+export declare const StyledOverflowMenu: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     items?: import("../OverflowMenu").OverflowMenuContextItem[] | undefined;
     userProps?: ({
         name: string;
@@ -25,5 +23,7 @@ export declare const StyledOverflowMenu: import("styled-components").StyledCompo
     anchorRef?: import("react").RefObject<HTMLButtonElement> | undefined;
     placement?: import("../../hooks").Placement | undefined;
     offset?: number | undefined;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
 } & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
 export {};

package/dist/components/InternalHeader/InternalHeader.styles.js

@@ -1,7 +1,13 @@
-import { typographyTokens } from '../Typography/Typography.tokens.js';
 import styled, { css } from 'styled-components';
 import { internalHeaderTokens } from './InternalHeader.tokens.js';
 import { OverflowMenu } from '../OverflowMenu/OverflowMenu.js';
+import 'react/jsx-runtime';
+import 'react';
+import '../../helpers/styling/focusVisible.js';
+import '../../helpers/styling/hover.js';
+import '../../helpers/styling/focus.js';
+import '../../helpers/styling/danger.js';
+import { selection } from '../../helpers/styling/selection.js';
 
 var outerContainer = internalHeaderTokens.outerContainer,
     applicationNameWrapper = internalHeaderTokens.applicationNameWrapper,
@@ -12,7 +18,7 @@ var outerContainer = internalHeaderTokens.outerContainer,
 var OuterContainer = styled.div.withConfig({
   displayName: "InternalHeaderstyles__OuterContainer",
   componentId: "sc-91bnca-0"
-})(["position:relative;*::selection{", "}background-color:", ";"], typographyTokens.selection.base, outerContainer.backgroundColor);
+})(["position:relative;*::selection{", "}background-color:", ";"], selection, outerContainer.backgroundColor);
 var BannerWrapper = styled.div.withConfig({
   displayName: "InternalHeaderstyles__BannerWrapper",
   componentId: "sc-91bnca-1"

package/dist/components/InternalHeader/NavigationItem.js

@@ -2,8 +2,12 @@ import { __rest } from 'tslib';
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import styled, { css } from 'styled-components';
-import { internalHeaderTokens } from './InternalHeader.tokens.js';
 import { focusVisible } from '../../helpers/styling/focusVisible.js';
+import '../../helpers/styling/hover.js';
+import '../../helpers/styling/focus.js';
+import '../../helpers/styling/danger.js';
+import '../../helpers/styling/selection.js';
+import { internalHeaderTokens } from './InternalHeader.tokens.js';
 
 var navLink = internalHeaderTokens.navLink;
 var Link = styled.a.withConfig({

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

@@ -8,13 +8,13 @@ export declare type ListProps = BaseComponentPropsWithChildren<HTMLUListElement
     /**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. */
     typographyType?: ListTypographyType;
 }>;
-export declare const List: import("react").ForwardRefExoticComponent<{
-    htmlProps?: import("react").HTMLAttributes<HTMLUListElement | HTMLOListElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLUListElement | HTMLOListElement>, "id" | "className"> & {
+export declare const List: import("react").ForwardRefExoticComponent<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. */
     typographyType?: ListTypographyType | undefined;
 } & {
     children?: import("react").ReactNode;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLUListElement | HTMLOListElement> | undefined;
 } & import("react").RefAttributes<HTMLUListElement | HTMLOListElement>>;

package/dist/components/List/List.js

@@ -5,17 +5,21 @@ import styled, { css } from 'styled-components';
 import bullet from '../../assets/svg/bullets/jordskifterett_bullet1.svg.js';
 import bulletLvl2 from '../../assets/svg/bullets/lagmannsrett_bullet2.svg.js';
 import bulletLvl3 from '../../assets/svg/bullets/tingrett_bullet3.svg.js';
-import { typographyTokens } from '../Typography/Typography.tokens.js';
 import { listItemTokens } from './ListItem.tokens.js';
 import { listTokens } from './List.tokens.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import '../../helpers/styling/focusVisible.js';
+import '../../helpers/styling/hover.js';
+import '../../helpers/styling/focus.js';
+import '../../helpers/styling/danger.js';
+import { selection } from '../../helpers/styling/selection.js';
 
 var liTextPadding = "1em + ".concat(listItemTokens.bulletSpacing);
 var ulPaddingLeft = "".concat(listTokens.spaceLeft, " - (").concat(liTextPadding, ")");
 var StyledList = styled.ul.withConfig({
   displayName: "List__StyledList",
   componentId: "sc-1f1c7eb-0"
-})(["", " ul,ol{margin:0;}*::selection{", "}", " ", ""], listTokens.base, typographyTokens.selection.base, function (_ref) {
+})(["", " ul,ol{margin:0;}*::selection{", "}", " ", ""], listTokens.base, selection, function (_ref) {
   var typographyType = _ref.typographyType;
   return typographyType && css(["", " ul,ol{", "}"], listTokens.sizes[typographyType], listTokens.sizes[typographyType]);
 }, function (_ref2) {

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

@@ -1,13 +1,13 @@
 import { ListProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<{
-        htmlProps?: import("react").HTMLAttributes<HTMLOListElement | HTMLUListElement> | undefined;
-    } & Pick<import("react").HTMLAttributes<HTMLOListElement | HTMLUListElement>, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLOListElement | HTMLUListElement>, "id" | "className"> & {
         listType?: import("./List").ListType | undefined;
         typographyType?: import("./List").ListTypographyType | undefined;
     } & {
         children?: import("react").ReactNode;
+    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLOListElement | HTMLUListElement> | undefined;
     } & import("react").RefAttributes<HTMLOListElement | HTMLUListElement>>;
 };
 export default _default;

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

@@ -16,9 +16,7 @@ export declare type LocalMessageProps = BaseComponentPropsWithChildren<HTMLDivEl
     /**Custom bredde ved behov. */
     width?: Property.Width<string>;
 }>;
-export declare const LocalMessage: import("react").ForwardRefExoticComponent<{
-    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
+export declare const LocalMessage: import("react").ForwardRefExoticComponent<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. */
@@ -33,4 +31,6 @@ export declare const LocalMessage: import("react").ForwardRefExoticComponent<{
     width?: Property.Width<string> | undefined;
 } & {
     children?: import("react").ReactNode;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/LocalMessage/LocalMessage.js

@@ -2,14 +2,20 @@ import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBab
 import { __rest } from 'tslib';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import styled, { css } from 'styled-components';
+import { Button } from '../Button/Button.js';
 import { forwardRef, useState } from 'react';
 import { localMessageTokens } from './LocalMessage.tokens.js';
-import { typographyTokens } from '../Typography/Typography.tokens.js';
 import { Icon } from '../Icon/Icon.js';
+import { Typography } from '../Typography/Typography/Typography.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
-import { Typography } from '../Typography/Typography.js';
-import { Button } from '../Button/Button.js';
+import '../Typography/Link/Link.js';
+import '../../icons/utils/StyledSvg.js';
 import { CloseIcon } from '../../icons/tsx/close.js';
+import '../../helpers/styling/focusVisible.js';
+import '../../helpers/styling/hover.js';
+import '../../helpers/styling/focus.js';
+import '../../helpers/styling/danger.js';
+import { selection } from '../../helpers/styling/selection.js';
 
 var Container = styled.div.withConfig({
   displayName: "LocalMessage__Container",
@@ -20,7 +26,7 @@ var Container = styled.div.withConfig({
 }, function (_ref2) {
   var layout = _ref2.layout;
   return layout === 'horisontal' && css(["align-items:center;justify-content:space-between;"]);
-}, typographyTokens.selection.base, function (_ref3) {
+}, selection, function (_ref3) {
   var purpose = _ref3.purpose;
   return purpose && css(["", " ", ""], localMessageTokens.container.base, localMessageTokens.container[purpose].base);
 }, function (_ref4) {

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

@@ -1,9 +1,7 @@
 import { LocalMessageProps } from './LocalMessage';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<{
-        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         message?: string | undefined;
         purpose?: import("./LocalMessage").LocalMessagePurpose | undefined;
         closable?: boolean | undefined;
@@ -12,6 +10,8 @@ declare const _default: {
         width?: import("csstype").Property.Width<string> | undefined;
     } & {
         children?: import("react").ReactNode;
+    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
     argTypes: {
         message: {

package/dist/components/LocalMessage/LocalMessage.tokens.js

@@ -1,8 +1,11 @@
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
+import 'tslib';
+import 'react/jsx-runtime';
+import '../../icons/utils/StyledSvg.js';
 import { CheckCircledIcon } from '../../icons/tsx/checkCircled.js';
-import { TipIcon } from '../../icons/tsx/tip.js';
-import { InfoIcon } from '../../icons/tsx/info.js';
 import { ErrorIcon } from '../../icons/tsx/error.js';
+import { InfoIcon } from '../../icons/tsx/info.js';
+import { TipIcon } from '../../icons/tsx/tip.js';
 import { WarningIcon } from '../../icons/tsx/warning.js';
 
 var Colors = ddsBaseTokens.colors,

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

@@ -12,9 +12,7 @@ export declare type ModalProps = BaseComponentPropsWithChildren<HTMLDivElement,
     /**Ref som brukes til returnering av fokus. */
     triggerRef?: RefObject<HTMLElement>;
 }>;
-export declare const Modal: import("react").ForwardRefExoticComponent<{
-    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
+export declare const Modal: import("react").ForwardRefExoticComponent<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. */
@@ -27,4 +25,6 @@ export declare const Modal: import("react").ForwardRefExoticComponent<{
     triggerRef?: RefObject<HTMLElement> | undefined;
 } & {
     children?: ReactNode;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Modal/Modal.js

@@ -2,25 +2,39 @@ import { __rest } from 'tslib';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef, useId, useEffect } from 'react';
 import styled from 'styled-components';
-import { modalTokens } from './Modal.tokens.js';
-import { createPortal } from 'react-dom';
-import { useMountTransition } from '../../hooks/useMountTransition.js';
-import { typographyTokens } from '../Typography/Typography.tokens.js';
-import { useFocusTrap } from '../../hooks/useFocusTrap.js';
-import { handleElementWithBackdropMount, handleElementWithBackdropUnmount } from '../../helpers/Backdrop/Backdrop.utils.js';
-import { Backdrop } from '../../helpers/Backdrop/Backdrop.js';
 import { Button } from '../Button/Button.js';
+import { modalTokens } from './Modal.tokens.js';
 import { useCombinedRef } from '../../hooks/useCombinedRefs.js';
 import { useOnClickOutside } from '../../hooks/useOnClickOutside.js';
 import { useOnKeyDown } from '../../hooks/useOnKeyDown.js';
+import '../../hooks/useFloatPosition.js';
+import { useFocusTrap } from '../../hooks/useFocusTrap.js';
+import { useMountTransition } from '../../hooks/useMountTransition.js';
+import '../../hooks/useScreenSize.js';
+import { createPortal } from 'react-dom';
+import { Typography } from '../Typography/Typography/Typography.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
-import { Typography } from '../Typography/Typography.js';
+import '../Typography/Link/Link.js';
+import { Backdrop } from '../../helpers/Backdrop/Backdrop.js';
+import { handleElementWithBackdropMount, handleElementWithBackdropUnmount } from '../../helpers/Backdrop/Backdrop.utils.js';
+import '../../helpers/Chevron/AnimatedChevronUpDown.styles.js';
+import '../../helpers/HiddenInput/HiddenInput.js';
+import '../../helpers/Input/Input.styles.js';
+import '../../helpers/Input/Input.tokens.js';
+import '../../helpers/Paper/Paper.js';
+import '../../helpers/RequiredMarker/RequiredMarker.js';
+import '../../icons/utils/StyledSvg.js';
 import { CloseIcon } from '../../icons/tsx/close.js';
+import '../../helpers/styling/focusVisible.js';
+import '../../helpers/styling/hover.js';
+import '../../helpers/styling/focus.js';
+import '../../helpers/styling/danger.js';
+import { selection } from '../../helpers/styling/selection.js';
 
 var Container = styled.div.withConfig({
   displayName: "Modal__Container",
   componentId: "sc-12c14zx-0"
-})(["display:flex;flex-direction:column-reverse;box-sizing:border-box;margin:0;min-width:200px;&::selection,*::selection{", "}", " :focus-visible,&.focus-visible{", "}"], typographyTokens.selection.base, modalTokens.base, modalTokens.focus.base);
+})(["display:flex;flex-direction:column-reverse;box-sizing:border-box;margin:0;min-width:200px;&::selection,*::selection{", "}", " :focus-visible,&.focus-visible{", "}"], selection, modalTokens.base, modalTokens.focus.base);
 var ContentContainer = styled.div.withConfig({
   displayName: "Modal__ContentContainer",
   componentId: "sc-12c14zx-1"

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

@@ -1,9 +1,7 @@
 import { ModalProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<{
-        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
         isOpen?: boolean | undefined;
         onClose?: (() => void) | undefined;
         parentElement?: HTMLElement | undefined;
@@ -11,6 +9,8 @@ declare const _default: {
         triggerRef?: import("react").RefObject<HTMLElement> | undefined;
     } & {
         children?: import("react").ReactNode;
+    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
     argTypes: {
         header: {

package/dist/components/Modal/Modal.tokens.js

@@ -1,5 +1,10 @@
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
+import 'styled-components';
 import { focusVisible } from '../../helpers/styling/focusVisible.js';
+import '../../helpers/styling/hover.js';
+import '../../helpers/styling/focus.js';
+import '../../helpers/styling/danger.js';
+import '../../helpers/styling/selection.js';
 
 var BorderRadius = ddsBaseTokens.borderRadius,
     Colors = ddsBaseTokens.colors,

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

@@ -6,13 +6,13 @@ export declare type ModalBodyProps = BaseComponentPropsWithChildren<HTMLDivEleme
     /**Høyde på container. */
     height?: Property.Height;
 }>;
-export declare const ModalBody: import("react").ForwardRefExoticComponent<{
-    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
+export declare const ModalBody: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & {
     /**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;
     /**Høyde på container. */
     height?: Property.Height<0 | (string & {})> | undefined;
 } & {
     children?: import("react").ReactNode;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
 } & import("react").RefAttributes<HTMLDivElement>>;