@norges-domstoler/dds-components 5.4.1 → 5.5.0

package/dist/components/Modal/ModalBody.js

@@ -2,8 +2,10 @@ import { __rest } from 'tslib';
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import styled from 'styled-components';
-import { ScrollableContainer } from '../ScrollableContainer/ScrollableContainer.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import '../ScrollableContainer/Scrollbar.js';
+import { ScrollableContainer } from '../ScrollableContainer/ScrollableContainer.js';
+import '../ScrollableContainer/ScrollableContainer.tokens.js';
 
 var Container = styled.div.withConfig({
   displayName: "ModalBody__Container",

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

@@ -4,9 +4,7 @@ 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<{
-    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
+export declare const OverflowMenu: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     items?: OverflowMenuContextItem[] | undefined;
     userProps?: ({
         name: string;
@@ -18,5 +16,7 @@ export declare const OverflowMenu: import("react").ForwardRefExoticComponent<{
     anchorRef?: import("react").RefObject<HTMLButtonElement> | undefined;
     placement?: import("../../hooks").Placement | undefined;
     offset?: number | undefined;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
 } & import("react").RefAttributes<HTMLDivElement>>;
 export {};

package/dist/components/OverflowMenu/OverflowMenu.js

@@ -3,20 +3,28 @@ import { __rest } from 'tslib';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { forwardRef, useEffect } from 'react';
 import styled from 'styled-components';
-import { OverflowMenuItem } from './OverflowMenuItem.js';
-import { overflowMenuTokens } from './OverflowMenu.tokens.js';
-import { typographyTokens } from '../Typography/Typography.tokens.js';
 import { visibilityTransition } from '../../helpers/styling/visibilityTransition.js';
-import { Divider } from '../Divider/Divider.js';
-import { useFloatPosition } from '../../hooks/useFloatPosition.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';
+import '../ScrollableContainer/Scrollbar.js';
+import '../ScrollableContainer/ScrollableContainer.js';
+import { scrollbarStyling } from '../ScrollableContainer/scrollbarStyling.js';
+import { useCombinedRef } from '../../hooks/useCombinedRefs.js';
 import { useOnClickOutside } from '../../hooks/useOnClickOutside.js';
 import { useOnKeyDown } from '../../hooks/useOnKeyDown.js';
+import { useFloatPosition } from '../../hooks/useFloatPosition.js';
 import { useRoveFocus } from '../../hooks/useRoveFocus.js';
-import { PersonIcon } from '../../icons/tsx/person.js';
 import { useId } from '../../hooks/useId.js';
-import { scrollbarStyling } from '../ScrollableContainer/scrollbarStyling.js';
-import { useCombinedRef } from '../../hooks/useCombinedRefs.js';
+import '../../hooks/useScreenSize.js';
+import { OverflowMenuItem } from './OverflowMenuItem.js';
+import { overflowMenuTokens } from './OverflowMenu.tokens.js';
+import { Divider } from '../Divider/Divider.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import '../../icons/utils/StyledSvg.js';
+import { PersonIcon } from '../../icons/tsx/person.js';
 
 var container = overflowMenuTokens.container,
     divider = overflowMenuTokens.divider;
@@ -26,7 +34,7 @@ var Container = styled.div.withConfig({
 })(["box-sizing:border-box;z-index:3;overflow-y:auto;min-width:180px;max-width:300px;", " border:", ";background-color:", ";border-radius:", ";", " ", " *::selection{", "}"], function (_ref) {
   var isOpen = _ref.isOpen;
   return visibilityTransition(isOpen);
-}, container.border, container.backgroundColor, container.borderRadius, scrollbarStyling.webkit, scrollbarStyling.firefox, typographyTokens.selection.base);
+}, container.border, container.backgroundColor, container.borderRadius, scrollbarStyling.webkit, scrollbarStyling.firefox, selection);
 var OverflowMenuList = styled.ul.withConfig({
   displayName: "OverflowMenu__OverflowMenuList",
   componentId: "sc-kh744b-1"

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

@@ -1,9 +1,7 @@
 import { OverflowMenuProps, OverflowMenuContextItem, OverflowMenuNavItem } 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"> & {
         items?: OverflowMenuContextItem[] | undefined;
         userProps?: ({
             name: string;
@@ -15,6 +13,8 @@ declare const _default: {
         anchorRef?: import("react").RefObject<HTMLButtonElement> | undefined;
         placement?: import("../../hooks").Placement | undefined;
         offset?: number | undefined;
+    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
 };
 export default _default;

package/dist/components/OverflowMenu/OverflowMenuItem.js

@@ -3,10 +3,16 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef, useRef, useEffect, useCallback } from 'react';
 import styled, { css } from 'styled-components';
 import { overflowMenuTokens } from './OverflowMenu.tokens.js';
-import { useCombinedRef } from '../../hooks/useCombinedRefs.js';
-import { focusVisibleLink } from '../../helpers/styling/focusVisible.js';
 import { Icon } from '../Icon/Icon.js';
+import { useCombinedRef } from '../../hooks/useCombinedRefs.js';
+import '../../hooks/useFloatPosition.js';
+import '../../hooks/useScreenSize.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import { focusVisibleLink } 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 element = overflowMenuTokens.element,
     link = overflowMenuTokens.link;

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

@@ -26,9 +26,7 @@ export declare type PaginationProps = BaseComponentProps<HTMLElement, {
     /**Spesifiserer om versjonen for små skjermer skal vises; den viser færre sideknapper og stacker subkomponentene. */
     smallScreen?: boolean;
 }, Omit<HTMLAttributes<HTMLElement>, 'onChange'>>;
-export declare const Pagination: import("react").ForwardRefExoticComponent<{
-    htmlProps?: Omit<HTMLAttributes<HTMLElement>, "onChange"> | undefined;
-} & Pick<Omit<HTMLAttributes<HTMLElement>, "onChange">, "className" | "id"> & {
+export declare const Pagination: import("react").ForwardRefExoticComponent<Pick<Omit<HTMLAttributes<HTMLElement>, "onChange">, "className" | "id"> & {
     /**Totalt antall elementer å paginere. */
     itemsAmount: number;
     /**Antall elementer per side ved innlastning av komponenten. */
@@ -49,4 +47,6 @@ export declare const Pagination: import("react").ForwardRefExoticComponent<{
     onSelectOptionChange?: ((option: PaginationOption | null) => void) | undefined;
     /**Spesifiserer om versjonen for små skjermer skal vises; den viser færre sideknapper og stacker subkomponentene. */
     smallScreen?: boolean | undefined;
+} & {
+    htmlProps?: Omit<HTMLAttributes<HTMLElement>, "onChange"> | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/dist/components/Pagination/Pagination.js

@@ -3,18 +3,20 @@ import { __rest } from 'tslib';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef, useState } from 'react';
 import styled, { css } from 'styled-components';
+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 { Select } from '../Select/Select.js';
 import { PaginationGenerator } from './paginationGenerator.js';
+import { Icon } from '../Icon/Icon.js';
 import { paginationTokens } from './Pagination.tokens.js';
-import { MoreHorizontalIcon } from '../../icons/tsx/moreHorizontal.js';
-import { ChevronLeftIcon } from '../../icons/tsx/chevronLeft.js';
+import '../../icons/utils/StyledSvg.js';
 import { ChevronFirstIcon } from '../../icons/tsx/chevronFirst.js';
 import { ChevronLastIcon } from '../../icons/tsx/chevronLast.js';
-import { Select } from '../Select/Select.js';
-import { Button } from '../Button/Button.js';
-import { Icon } from '../Icon/Icon.js';
+import { ChevronLeftIcon } from '../../icons/tsx/chevronLeft.js';
 import { ChevronRightIcon } from '../../icons/tsx/chevronRight.js';
-import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
-import { Typography } from '../Typography/Typography.js';
+import { MoreHorizontalIcon } from '../../icons/tsx/moreHorizontal.js';
 
 var Nav = styled.nav.withConfig({
   displayName: "Pagination__Nav",

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

@@ -1,9 +1,7 @@
 import { PaginationProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<{
-        htmlProps?: Omit<import("react").HTMLAttributes<HTMLElement>, "onChange"> | undefined;
-    } & Pick<Omit<import("react").HTMLAttributes<HTMLElement>, "onChange">, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<Omit<import("react").HTMLAttributes<HTMLElement>, "onChange">, "id" | "className"> & {
         itemsAmount: number;
         defaultItemsPerPage?: number | undefined;
         defaultActivePage?: number | undefined;
@@ -14,6 +12,8 @@ declare const _default: {
         onChange?: ((event: import("react").MouseEvent<HTMLButtonElement, MouseEvent>, page: number) => void) | undefined;
         onSelectOptionChange?: ((option: import("./Pagination").PaginationOption | null) => void) | undefined;
         smallScreen?: boolean | undefined;
+    } & {
+        htmlProps?: Omit<import("react").HTMLAttributes<HTMLElement>, "onChange"> | undefined;
     } & import("react").RefAttributes<HTMLElement>>;
     argTypes: {
         withCounter: {

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

@@ -30,9 +30,7 @@ export declare type PopoverProps = BaseComponentPropsWithChildren<HTMLDivElement
     /**Custom størrelse. */
     sizeProps?: PopoverSizeProps;
 }>;
-export declare const Popover: import("react").ForwardRefExoticComponent<{
-    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
+export declare const Popover: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & {
     /**Tittel. */
     title?: string | ReactNode;
     /** **OBS!** Propen settes automatisk av `<PopoverGroup />`. Spesifiserer om `<Popover />` skal vises. */
@@ -53,4 +51,6 @@ export declare const Popover: import("react").ForwardRefExoticComponent<{
     sizeProps?: PopoverSizeProps | undefined;
 } & {
     children?: ReactNode;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Popover/Popover.js

@@ -3,13 +3,21 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
 import { forwardRef, useEffect } from 'react';
 import styled, { css } from 'styled-components';
-import { popoverTokens } from './Popover.tokens.js';
 import { visibilityTransition } from '../../helpers/styling/visibilityTransition.js';
-import { Button } from '../Button/Button.js';
-import { useFloatPosition } from '../../hooks/useFloatPosition.js';
+import '../../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 { useCombinedRef } from '../../hooks/useCombinedRefs.js';
+import { useFloatPosition } from '../../hooks/useFloatPosition.js';
+import '../../hooks/useScreenSize.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
-import { Typography } from '../Typography/Typography.js';
+import { Button } from '../Button/Button.js';
+import { Typography } from '../Typography/Typography/Typography.js';
+import '../Typography/Link/Link.js';
+import { popoverTokens } from './Popover.tokens.js';
+import '../../icons/utils/StyledSvg.js';
 import { CloseIcon } from '../../icons/tsx/close.js';
 
 var Spacing = ddsBaseTokens.spacing;

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

@@ -2,9 +2,7 @@ import { PopoverProps } from '.';
 import { Placement } from '../../hooks';
 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"> & {
         title?: import("react").ReactNode;
         isOpen?: boolean | undefined;
         withCloseButton?: boolean | undefined;
@@ -16,6 +14,8 @@ declare const _default: {
         sizeProps?: import("./Popover").PopoverSizeProps | undefined;
     } & {
         children?: import("react").ReactNode;
+    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
     argTypes: {
         withCloseButton: {

package/dist/components/Popover/PopoverGroup.js

@@ -1,8 +1,10 @@
 import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { jsx, Fragment } from 'react/jsx-runtime';
 import { useState, useEffect, useId, useRef, Children, isValidElement, cloneElement } from 'react';
-import { useOnKeyDown } from '../../hooks/useOnKeyDown.js';
 import { useOnClickOutside } from '../../hooks/useOnClickOutside.js';
+import { useOnKeyDown } from '../../hooks/useOnKeyDown.js';
+import '../../hooks/useFloatPosition.js';
+import '../../hooks/useScreenSize.js';
 
 var PopoverGroup = function PopoverGroup(_ref) {
   var _ref$isOpen = _ref.isOpen,

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

@@ -1,6 +1,4 @@
-export declare const RadioButton: import("react").ForwardRefExoticComponent<{
-    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"> & {
+export declare const RadioButton: import("react").ForwardRefExoticComponent<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;
@@ -14,4 +12,6 @@ export declare const RadioButton: import("react").ForwardRefExoticComponent<{
     'aria-describedby'?: string | undefined;
 } & {
     children?: import("react").ReactNode;
+} & {
+    htmlProps?: Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "name" | "readOnly" | "checked" | "value" | "required" | "onChange" | "aria-describedby"> | undefined;
 } & import("react").RefAttributes<HTMLInputElement>>;

package/dist/components/RadioButton/RadioButton.js

@@ -1,11 +1,18 @@
 import { __rest } from 'tslib';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef, useId } from 'react';
+import { Typography } from '../Typography/Typography/Typography.js';
+import { getBaseHTMLProps, joinClassNames } from '../../types/BaseComponentProps.js';
+import '../Typography/Link/Link.js';
 import { useRadioButtonGroup } from './RadioButtonGroupContext.js';
 import { Container, CustomRadioButton } from './RadioButton.styles.js';
-import { getBaseHTMLProps, joinClassNames } from '../../types/BaseComponentProps.js';
+import '../../helpers/Backdrop/Backdrop.js';
+import '../../helpers/Chevron/AnimatedChevronUpDown.styles.js';
 import { HiddenInput } from '../../helpers/HiddenInput/HiddenInput.js';
-import { Typography } from '../Typography/Typography.js';
+import '../../helpers/Input/Input.styles.js';
+import '../../helpers/Input/Input.tokens.js';
+import '../../helpers/Paper/Paper.js';
+import '../../helpers/RequiredMarker/RequiredMarker.js';
 
 var isValueEqualToGroupValueOrFalsy = function isValueEqualToGroupValueOrFalsy(value, group) {
   if (typeof value !== 'undefined' && value !== null && group) {

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

@@ -1,9 +1,7 @@
 import { RadioButtonProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<{
-        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"> & {
+    component: import("react").ForwardRefExoticComponent<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;
@@ -17,6 +15,8 @@ declare const _default: {
         required?: boolean | undefined;
     } & {
         children?: import("react").ReactNode;
+    } & {
+        htmlProps?: Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-describedby" | "onChange" | "name" | "value" | "checked" | "readOnly" | "required"> | undefined;
     } & import("react").RefAttributes<HTMLInputElement>>;
     argTypes: {
         label: {

package/dist/components/RadioButton/RadioButton.styles.js

@@ -1,6 +1,10 @@
 import styled, { css } from 'styled-components';
 import { radioButtonTokens } from './RadioButton.tokens.js';
 import { focusVisibleTransitionValue } 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 CustomRadioButton = styled.span.withConfig({
   displayName: "RadioButtonstyles__CustomRadioButton",

package/dist/components/RadioButton/RadioButton.tokens.js

@@ -1,7 +1,10 @@
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
+import 'styled-components';
+import { focusVisible } from '../../helpers/styling/focusVisible.js';
 import { hoverInputfield, hoverDangerInputfield } from '../../helpers/styling/hover.js';
+import '../../helpers/styling/focus.js';
 import { dangerInputfield } from '../../helpers/styling/danger.js';
-import { focusVisible } from '../../helpers/styling/focusVisible.js';
+import '../../helpers/styling/selection.js';
 
 var Colors = ddsBaseTokens.colors,
     Spacing = ddsBaseTokens.spacing,

package/dist/components/RadioButton/RadioButtonGroup.js

@@ -3,13 +3,21 @@ import { __rest } from 'tslib';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useId } from 'react';
 import styled, { css } from 'styled-components';
-import { radioButtonGroupTokens } from './RadioButtonGroup.tokens.js';
-import { RadioButtonGroupContext } from './RadioButtonGroupContext.js';
-import { combineHandlers } from '../../utils/combineHandlers.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 '../../helpers/Paper/Paper.js';
 import { RequiredMarker } from '../../helpers/RequiredMarker/RequiredMarker.js';
 import { InputMessage } from '../InputMessage/InputMessage.js';
-import { Typography } from '../Typography/Typography.js';
+import { radioButtonGroupTokens } from './RadioButtonGroup.tokens.js';
+import { RadioButtonGroupContext } from './RadioButtonGroupContext.js';
+import { Typography } from '../Typography/Typography/Typography.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import '../Typography/Link/Link.js';
+import { combineHandlers } from '../../utils/combineHandlers.js';
+import '../../utils/color.js';
 
 var Container = styled.div.withConfig({
   displayName: "RadioButtonGroup__Container",

package/dist/components/ScrollableContainer/ScrollableContainer.js

@@ -2,10 +2,14 @@ import { __rest } from 'tslib';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useRef } from 'react';
 import styled from 'styled-components';
+import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
 import { Scrollbar } from './Scrollbar.js';
 import { scrollbarTokens } from './ScrollableContainer.tokens.js';
 import { focusVisibleTransitionValue, focusVisible } from '../../helpers/styling/focusVisible.js';
-import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import '../../helpers/styling/hover.js';
+import '../../helpers/styling/focus.js';
+import '../../helpers/styling/danger.js';
+import '../../helpers/styling/selection.js';
 
 var track = scrollbarTokens.track,
     content = scrollbarTokens.content,

package/dist/components/ScrollableContainer/Scrollbar.js

@@ -3,8 +3,8 @@ import { __rest } from 'tslib';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useRef, useState, useCallback, useEffect } from 'react';
 import styled from 'styled-components';
-import { scrollbarTokens } from './ScrollableContainer.tokens.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
+import { scrollbarTokens } from './ScrollableContainer.tokens.js';
 
 var track = scrollbarTokens.track,
     thumb = scrollbarTokens.thumb,

package/dist/components/Search/Search.js

@@ -2,13 +2,21 @@ import { __rest } from 'tslib';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef, useId } from 'react';
 import styled, { css } from 'styled-components';
+import { Button } from '../Button/Button.js';
 import { searchTokens } from './Search.tokens.js';
+import '../../helpers/Backdrop/Backdrop.js';
+import '../../helpers/Chevron/AnimatedChevronUpDown.styles.js';
+import '../../helpers/HiddenInput/HiddenInput.js';
 import { Input as Input$1, OuterInputContainer, InputContainer } from '../../helpers/Input/Input.styles.js';
-import { SearchIcon } from '../../icons/tsx/search.js';
-import { Icon } from '../Icon/Icon.js';
-import { derivativeIdGenerator, spaceSeparatedIdListGenerator } from '../../utils/idGenerator.js';
+import '../../helpers/Input/Input.tokens.js';
+import '../../helpers/Paper/Paper.js';
+import '../../helpers/RequiredMarker/RequiredMarker.js';
 import { InputMessage } from '../InputMessage/InputMessage.js';
-import { Button } from '../Button/Button.js';
+import { spaceSeparatedIdListGenerator, derivativeIdGenerator } from '../../utils/idGenerator.js';
+import '../../utils/color.js';
+import { Icon } from '../Icon/Icon.js';
+import '../../icons/utils/StyledSvg.js';
+import { SearchIcon } from '../../icons/tsx/search.js';
 
 var Input = styled(Input$1).withConfig({
   displayName: "Search__Input",

package/dist/components/Select/Select.js

@@ -2,15 +2,23 @@ import { __rest } from 'tslib';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useId } from 'react';
 import ReactSelect, { components } from 'react-select';
-import { prefix, getCustomStyles, Wrapper, Container, Label, InnerSingleValue } from './Select.styles.js';
-import { selectTokens } from './Select.tokens.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 '../../helpers/Paper/Paper.js';
+import { RequiredMarker } from '../../helpers/RequiredMarker/RequiredMarker.js';
+import '../../icons/utils/StyledSvg.js';
 import { CheckIcon } from '../../icons/tsx/check.js';
-import { CloseSmallIcon } from '../../icons/tsx/closeSmall.js';
 import { ChevronDownIcon } from '../../icons/tsx/chevronDown.js';
+import { CloseSmallIcon } from '../../icons/tsx/closeSmall.js';
 import { spaceSeparatedIdListGenerator, derivativeIdGenerator } from '../../utils/idGenerator.js';
-import { RequiredMarker } from '../../helpers/RequiredMarker/RequiredMarker.js';
-import { InputMessage } from '../InputMessage/InputMessage.js';
+import '../../utils/color.js';
 import { Icon } from '../Icon/Icon.js';
+import { InputMessage } from '../InputMessage/InputMessage.js';
+import { prefix, getCustomStyles, Wrapper, Container, Label, InnerSingleValue } from './Select.styles.js';
+import { selectTokens } from './Select.tokens.js';
 
 var DdsOption = components.Option,
     NoOptionsMessage = components.NoOptionsMessage,

package/dist/components/Select/Select.styles.js

@@ -1,9 +1,18 @@
 import styled, { css } from 'styled-components';
-import { typographyTokens } from '../Typography/Typography.tokens.js';
-import { selectTokens } from './Select.tokens.js';
-import { Typography } from '../Typography/Typography.js';
-import { scrollbarStyling } from '../ScrollableContainer/scrollbarStyling.js';
 import { focusVisibleLink } from '../../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';
+import '../ScrollableContainer/Scrollbar.js';
+import '../ScrollableContainer/ScrollableContainer.js';
+import { scrollbarStyling } from '../ScrollableContainer/scrollbarStyling.js';
+import { Typography } from '../Typography/Typography/Typography.js';
+import 'tslib';
+import 'react/jsx-runtime';
+import 'react';
+import '../Typography/Link/Link.js';
+import { selectTokens } from './Select.tokens.js';
 
 var prefix = 'dds-select';
 var Label = styled(Typography).withConfig({
@@ -13,7 +22,7 @@ var Label = styled(Typography).withConfig({
 var Container = styled.div.withConfig({
   displayName: "Selectstyles__Container",
   componentId: "sc-19jkd5s-1"
-})(["@media (prefers-reduced-motion:no-preference){transition:box-shadow 0.2s,border-color 0.2s,background-color 0.2s;}position:relative;", " *::selection{", "}", " &:hover{", " ", "{", "}}&:focus-within{", " ", "{", "}}", " .", "__menu-list{", " ", "}&:hover .", "__dropdown-indicator,&:focus-within .", "__dropdown-indicator{", "}", " ", ""], selectTokens.container.base, typographyTokens.selection.base, function (_ref) {
+})(["@media (prefers-reduced-motion:no-preference){transition:box-shadow 0.2s,border-color 0.2s,background-color 0.2s;}position:relative;", " *::selection{", "}", " &:hover{", " ", "{", "}}&:focus-within{", " ", "{", "}}", " .", "__menu-list{", " ", "}&:hover .", "__dropdown-indicator,&:focus-within .", "__dropdown-indicator{", "}", " ", ""], selectTokens.container.base, selection, function (_ref) {
   var hasLabel = _ref.hasLabel,
       isMulti = _ref.isMulti;
   return isMulti && hasLabel ? css([".", "__value-container{", "}.", "__indicators{", "}"], prefix, selectTokens.valueContainer.isMulti.withLabel.base, prefix, selectTokens.indicatorsContainer.isMulti.withLabel.base) : isMulti && !hasLabel ? css([".", "__control{", "}.", "__value-container{", "}.", "__indicators{", "}"], prefix, selectTokens.input.isMulti.noLabel.base, prefix, selectTokens.valueContainer.isMulti.noLabel.base, prefix, selectTokens.indicatorsContainer.isMulti.noLabel.base) : hasLabel ? css([".", "__value-container{", "}.", "__indicators{", "}"], prefix, selectTokens.valueContainer.withLabel.base, prefix, selectTokens.indicatorsContainer.withLabel.base) : css([".", "__control{", "}.", "__value-container{", "}.", "__indicators{", "}"], prefix, selectTokens.input.noLabel.base, prefix, selectTokens.valueContainer.noLabel.base, prefix, selectTokens.indicatorsContainer.noLabel.base);

package/dist/components/Select/Select.tokens.js

@@ -1,8 +1,12 @@
 import { ddsBaseTokens, ddsReferenceTokens } from '@norges-domstoler/dds-design-tokens';
 import { calculateHeightWithLineHeight } from '../../utils/text.js';
+import '../../utils/color.js';
+import 'styled-components';
+import '../../helpers/styling/focusVisible.js';
 import { hoverInputfield, hoverDangerInputfield } from '../../helpers/styling/hover.js';
 import { focusInputfield, focusDangerInputfield } from '../../helpers/styling/focus.js';
 import { dangerInputfield } from '../../helpers/styling/danger.js';
+import '../../helpers/styling/selection.js';
 
 var Colors = ddsBaseTokens.colors,
     Spacing = ddsBaseTokens.spacing,

package/dist/components/SkipToContent/SkipToContent.d.ts

@@ -8,13 +8,13 @@ export declare type SkipToContentProps = BaseComponentProps<HTMLAnchorElement, {
     /**Avstand fra top i nærmeste posisjonert container. */
     top?: Property.Top<string | number>;
 }>;
-export declare const SkipToContent: import("react").ForwardRefExoticComponent<{
-    htmlProps?: import("react").HTMLAttributes<HTMLAnchorElement> | undefined;
-} & Pick<import("react").HTMLAttributes<HTMLAnchorElement>, "className" | "id"> & {
+export declare const SkipToContent: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLAnchorElement>, "className" | "id"> & {
     /** Teksten som vises i lenka. */
     text?: string | undefined;
     /**Spesifiserer hvor det skal hoppes til via `id`-attributtet til innholdet. */
     href: string;
     /**Avstand fra top i nærmeste posisjonert container. */
     top?: Property.Top<string | number> | undefined;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLAnchorElement> | undefined;
 } & import("react").RefAttributes<HTMLAnchorElement>>;

package/dist/components/SkipToContent/SkipToContent.js

@@ -4,6 +4,10 @@ import { forwardRef } from 'react';
 import styled from 'styled-components';
 import { skipToContentTokens } from './SkipToContent.tokens.js';
 import { focusVisibleTransitionValue } 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 { joinClassNames, getBaseHTMLProps } from '../../types/BaseComponentProps.js';
 
 var Wrapper = styled.div.withConfig({

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

@@ -1,12 +1,12 @@
 import { SkipToContentProps } from '.';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<{
-        htmlProps?: import("react").HTMLAttributes<HTMLAnchorElement> | undefined;
-    } & Pick<import("react").HTMLAttributes<HTMLAnchorElement>, "id" | "className"> & {
+    component: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLAnchorElement>, "id" | "className"> & {
         text?: string | undefined;
         href: string;
         top?: import("csstype").Property.Top<string | number> | undefined;
+    } & {
+        htmlProps?: import("react").HTMLAttributes<HTMLAnchorElement> | undefined;
     } & import("react").RefAttributes<HTMLAnchorElement>>;
     argTypes: {
         text: {

package/dist/components/SkipToContent/SkipToContent.tokens.js

@@ -1,5 +1,10 @@
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
+import 'styled-components';
 import { focusVisibleOnDark } 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 Colors = ddsBaseTokens.colors,
     Spacing = ddsBaseTokens.spacing,

package/dist/components/Spinner/Spinner.d.ts

@@ -1,5 +1,5 @@
 import { Property } from 'csstype';
-import { TextColor } from '../Typography';
+import { TextColor } from '../../utils';
 import { BaseComponentProps } from '../../types';
 export declare type SpinnerProps = BaseComponentProps<SVGElement, {
     /**Farge på spinneren. */

package/dist/components/Spinner/Spinner.js

@@ -2,9 +2,9 @@ import { __rest } from 'tslib';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useId } from 'react';
 import styled from 'styled-components';
+import { getTextColor } from '../../utils/color.js';
 import { ddsBaseTokens } from '@norges-domstoler/dds-design-tokens';
 import { spinnerTokens } from './Spinner.tokens.js';
-import { getTextColor } from '../Typography/Typography.js';
 import { getBaseHTMLProps } from '../../types/BaseComponentProps.js';
 
 var StyledSpinner = styled.svg.withConfig({

package/dist/components/Stepper/Step.js

@@ -1,9 +1,13 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import styled, { css } from 'styled-components';
+import { focusVisibleTransitionValue, 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 { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
 import { useStepperContext } from './Stepper.context.js';
 import { stepperTokens } from './Stepper.tokens.js';
-import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
-import { focusVisibleTransitionValue, focusVisible } from '../../helpers/styling/focusVisible.js';
 
 var toStepState = function toStepState(active, completed) {
   return active ? completed ? 'activeCompleted' : 'activeIncomplete' : completed ? 'inactiveCompleted' : 'inactiveIncomplete';