@norges-domstoler/dds-components 14.2.0 → 14.3.0

package/dist/index.d.mts

@@ -4,16 +4,16 @@ import { Property, StandardProperties } from 'csstype';
 import * as styled_components from 'styled-components';
 import * as styled_components_dist_types from 'styled-components/dist/types';
 import * as react from 'react';
-import react__default, { CSSProperties, PropsWithChildren, HTMLAttributes, ElementType, ComponentPropsWithoutRef, AnchorHTMLAttributes, LabelHTMLAttributes, InputHTMLAttributes, RefCallback, RefObject, KeyboardEvent as KeyboardEvent$1, Dispatch, SetStateAction, SVGAttributes, ButtonHTMLAttributes, ReactNode, ReactElement, MouseEventHandler, ChangeEvent, Ref, MouseEvent as MouseEvent$1, TdHTMLAttributes, ThHTMLAttributes, ForwardRefExoticComponent, TextareaHTMLAttributes } from 'react';
+import react__default, { HTMLAttributes, PropsWithChildren, ElementType, ComponentPropsWithoutRef, CSSProperties, AnchorHTMLAttributes, LabelHTMLAttributes, InputHTMLAttributes, RefCallback, RefObject, KeyboardEvent as KeyboardEvent$1, Dispatch, SetStateAction, SVGAttributes, ButtonHTMLAttributes, ReactNode, ReactElement, MouseEventHandler, ChangeEvent, Ref, MouseEvent as MouseEvent$1, TdHTMLAttributes, ThHTMLAttributes, ForwardRefExoticComponent, TextareaHTMLAttributes } from 'react';
 import { TextColor as TextColor$1 } from '@norges-domstoler/dds-components/src/utils';
 import * as _floating_ui_react_dom from '@floating-ui/react-dom';
 import { Strategy, Placement as Placement$1 } from '@floating-ui/react-dom';
 import { Environment } from '@norges-domstoler/development-utils';
 import { OptionProps, GroupBase, SingleValueProps, Props, SelectInstance } from 'react-select';
 import { DateValue, AriaCalendarProps } from '@react-aria/calendar';
+import { DateValue as DateValue$1, CalendarDate, Time } from '@internationalized/date';
 import { AriaDatePickerProps } from '@react-types/datepicker';
 import { AriaDateFieldOptions, useDatePicker, AriaTimeFieldProps } from '@react-aria/datepicker';
-import { DateValue as DateValue$1, CalendarDate, Time } from '@internationalized/date';
 import { InputProps as InputProps$1 } from '@norges-domstoler/dds-components';
 
 interface SvgChevronProps {
@@ -37,43 +37,6 @@ declare const OuterInputContainer: styled_components.IStyledComponent<"web", sty
 declare const InputContainer: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
 declare const InputAffixContainer: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
 
-declare const TextOverflowEllipsisWrapper: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
-declare const TextOverflowEllipsisInner: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
-
-type TypographyBodySansType = 'bodySans01' | 'bodySans02' | 'bodySans03' | 'bodySans04';
-type TypographyBodyType = TypographyBodySansType;
-type TypographyHeadingType = 'headingSans01' | 'headingSans02' | 'headingSans03' | 'headingSans04' | 'headingSans05' | 'headingSans06' | 'headingSans07' | 'headingSans08';
-type TypographyLeadType = 'leadSans01' | 'leadSans02' | 'leadSans03' | 'leadSans04' | 'leadSans05';
-type TypographySupportingType = 'supportingStyleHelperText01' | 'supportingStylePlaceholderText01' | 'supportingStylePlaceholderText02' | 'supportingStylePlaceholderText03' | 'supportingStyleTiny01' | 'supportingStyleTiny02';
-type AnchorTypographyType = 'a';
-type LabelTypographyType = 'supportingStyleLabel01';
-type OtherTypographyType = TypographyHeadingType | TypographyBodyType | TypographyLeadType | TypographySupportingType;
-type TypographyType = AnchorTypographyType | LabelTypographyType | OtherTypographyType;
-type StaticTypographyType = OtherTypographyType | LabelTypographyType;
-type InlineElement = 'a' | 'abbr' | 'audio' | 'b' | 'bdi' | 'bdo' | 'big' | 'br' | 'button' | 'canvas' | 'cite' | 'code' | 'data' | 'datalist' | 'del' | 'dfn' | 'em' | 'embed' | 'i' | 'iframe' | 'img' | 'input' | 'ins' | 'kbd' | 'label' | 'map' | 'mark' | 'meter' | 'noscript' | 'object' | 'output' | 'picture' | 'progress' | 'q' | 'ruby' | 's' | 'samp' | 'script' | 'select' | 'slot' | 'small' | 'span' | 'strong' | 'sub' | 'sup' | 'svg' | 'template' | 'textarea' | 'time' | 'u' | 'var' | 'video' | 'wbr';
-interface TypographyInteractionStyling {
-    hover?: CSSProperties;
-    active?: CSSProperties;
-}
-type BaseTypographyProps = PropsWithChildren<{
-    /**Spesifiserer om tekstelementet skal ha spacing definert i Elsa. Brukes hovedsakelig i artikler og lignende. **OBS!** har forskjellig virkning på ulike typografityper. `body` og `lead`-typer får margin på bunnen, `heading`-typer får margin på bunnen og padding på toppen mens `supportingStyles` får margin topp og bunn. */
-    withMargins?: boolean;
-}> & Pick<HTMLAttributes<HTMLElement>, 'style'>;
-type TypographyComponentProps = BaseTypographyProps & {
-    /**Tekstfarge fra utvalget eller custom. **OBS!** Bruk farger fra `@dds-design-tokens`. */
-    color?: TextColor$1;
-    /**Setter `bold` styling. */
-    bold?: boolean;
-    /**Setter `italic` styling. */
-    italic?: boolean;
-    /**Setter en linje under. */
-    underline?: boolean;
-    /**HTML tag som skal brukes istedenfor default definert via `typographyType`.  */
-    as?: ElementType;
-    /**Støtte for å enkelt kunne endre på hover- og active-styling. Bruk `@dds-design-tokens` til farger osv. */
-    interactionProps?: TypographyInteractionStyling;
-};
-
 type Direction$1 = 'row' | 'column';
 
 /**
@@ -155,6 +118,43 @@ type ExtractStrict<T, U extends T> = U;
 type Nullable<T> = T | null;
 type Callback<T> = (e: T) => void;
 
+declare const TextOverflowEllipsisWrapper: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
+declare const TextOverflowEllipsisInner: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
+
+type TypographyBodySansType = 'bodySans01' | 'bodySans02' | 'bodySans03' | 'bodySans04';
+type TypographyBodyType = TypographyBodySansType;
+type TypographyHeadingType = 'headingSans01' | 'headingSans02' | 'headingSans03' | 'headingSans04' | 'headingSans05' | 'headingSans06' | 'headingSans07' | 'headingSans08';
+type TypographyLeadType = 'leadSans01' | 'leadSans02' | 'leadSans03' | 'leadSans04' | 'leadSans05';
+type TypographySupportingType = 'supportingStyleHelperText01' | 'supportingStylePlaceholderText01' | 'supportingStylePlaceholderText02' | 'supportingStylePlaceholderText03' | 'supportingStyleTiny01' | 'supportingStyleTiny02';
+type AnchorTypographyType = 'a';
+type LabelTypographyType = 'supportingStyleLabel01';
+type OtherTypographyType = TypographyHeadingType | TypographyBodyType | TypographyLeadType | TypographySupportingType;
+type TypographyType = AnchorTypographyType | LabelTypographyType | OtherTypographyType;
+type StaticTypographyType = OtherTypographyType | LabelTypographyType;
+type InlineElement = 'a' | 'abbr' | 'audio' | 'b' | 'bdi' | 'bdo' | 'big' | 'br' | 'button' | 'canvas' | 'cite' | 'code' | 'data' | 'datalist' | 'del' | 'dfn' | 'em' | 'embed' | 'i' | 'iframe' | 'img' | 'input' | 'ins' | 'kbd' | 'label' | 'map' | 'mark' | 'meter' | 'noscript' | 'object' | 'output' | 'picture' | 'progress' | 'q' | 'ruby' | 's' | 'samp' | 'script' | 'select' | 'slot' | 'small' | 'span' | 'strong' | 'sub' | 'sup' | 'svg' | 'template' | 'textarea' | 'time' | 'u' | 'var' | 'video' | 'wbr';
+interface TypographyInteractionStyling {
+    hover?: CSSProperties;
+    active?: CSSProperties;
+}
+type BaseTypographyProps = PropsWithChildren<{
+    /**Spesifiserer om tekstelementet skal ha spacing definert i Elsa. Brukes hovedsakelig i artikler og lignende. **OBS!** har forskjellig virkning på ulike typografityper. `body` og `lead`-typer får margin på bunnen, `heading`-typer får margin på bunnen og padding på toppen mens `supportingStyles` får margin topp og bunn. */
+    withMargins?: boolean;
+}> & Pick<HTMLAttributes<HTMLElement>, 'style'>;
+type TypographyComponentProps = BaseTypographyProps & {
+    /**Tekstfarge fra utvalget eller custom. **OBS!** Bruk farger fra `@dds-design-tokens`. */
+    color?: TextColor$1;
+    /**Setter `bold` styling. */
+    bold?: boolean;
+    /**Setter `italic` styling. */
+    italic?: boolean;
+    /**Setter en linje under. */
+    underline?: boolean;
+    /**HTML tag som skal brukes istedenfor default definert via `typographyType`.  */
+    as?: ElementType;
+    /**Støtte for å enkelt kunne endre på hover- og active-styling. Bruk `@dds-design-tokens` til farger osv. */
+    interactionProps?: TypographyInteractionStyling;
+};
+
 type AnchorTypographyProps = BaseComponentProps<HTMLAnchorElement, TypographyComponentProps & {
     /**nativ `href`-prop ved `typographyType='a'`.  */
     href?: string | undefined;
@@ -1572,11 +1572,11 @@ type SelectProps<Option = unknown, IsMulti extends boolean = false> = {
     /** CSS klassenavn. */
     className?: string;
     /** Inline styling. */
-    style?: react__default.CSSProperties;
+    style?: React.CSSProperties;
     customOptionElement?: (props: OptionProps<Option, IsMulti, GroupBase<Option>>) => JSX.Element;
     customSingleValueElement?: (props: SingleValueProps<Option, IsMulti, GroupBase<Option>>) => JSX.Element;
 } & Pick<HTMLAttributes<HTMLInputElement>, 'aria-required'> & WrappedReactSelectProps<Option, IsMulti, GroupBase<Option>>;
-type ForwardRefType<Option, IsMulti extends boolean> = react__default.ForwardedRef<SelectInstance<Option, IsMulti, GroupBase<Option>>>;
+type ForwardRefType<Option, IsMulti extends boolean> = React.ForwardedRef<SelectInstance<Option, IsMulti, GroupBase<Option>>>;
 declare function SelectInner<Option = unknown, IsMulti extends boolean = false>(props: SelectProps<Option, IsMulti>, ref: ForwardRefType<Option, IsMulti>): react_jsx_runtime.JSX.Element;
 declare const Select: typeof SelectInner;
 
@@ -1729,6 +1729,27 @@ type SearchCompoundProps = typeof Search$1 & {
 };
 declare const Search: SearchCompoundProps;
 
+type TableBodyProps = HTMLAttributes<HTMLTableSectionElement>;
+declare const Body: react.ForwardRefExoticComponent<TableBodyProps & react.RefAttributes<HTMLTableSectionElement>>;
+
+type TableCellType = 'data' | 'head';
+type TableCellLayout = 'left' | 'right' | 'center' | 'text and icon';
+interface CollapsibleProps {
+    isCollapsibleChild?: boolean;
+}
+type TableCellProps = {
+    /**
+     * Type celle. Returnerer enten `<td>` eller `<th>`.
+     * @default 'data' hvis den er brukt i `<Table.Body>` eller `<Table.Foot>`, 'head' hvis den er i `<Table.Head>`.
+     */
+    type?: TableCellType;
+    /**Layout av innholdet i cellen. 'tekst and icon' legger `gap` mellom barna og andre barnet i cellen.  */
+    layout?: TableCellLayout;
+    /** Props ved bruk av `<CollapsibleRow>`. **OBS!** settes automatisk av forelder. */
+    collapsibleProps?: CollapsibleProps;
+} & (TdHTMLAttributes<HTMLTableCellElement> | ThHTMLAttributes<HTMLTableCellElement>);
+declare const Cell: react.ForwardRefExoticComponent<TableCellProps & react.RefAttributes<HTMLTableCellElement>>;
+
 type TableDensity = 'normal' | 'compact' | 'extraCompact';
 type TableProps = {
     /**Spesifiserer hvor romslige cellene i tabellen skal være. */
@@ -1756,7 +1777,10 @@ type CollapsibleTableProps = {
 type TableRowType = 'body' | 'head';
 type RowMode = 'normal' | 'sum';
 type TableRowProps = {
-    /**Spesifiserer om raden skal brukes i `<head>` eller `<body>`-seksjonen. */
+    /**
+     * Spesifiserer om raden skal brukes i `<head>` eller `<body>`-seksjonen.
+     * @default 'body' hvis den er brukt i `<Table.Body>` eller `<Table.Foot>`, 'head' hvis den er i `<Table.Head>`.
+     */
     type?: TableRowType;
     /**Custom modus for rader som har ytterligere semantisk betydning (f.eks. summeringsrad), definerer kun styling. Ved bruk av sum må `<Cell>` med tall i høyrestilles vha layout prop.  */
     mode?: RowMode;
@@ -1766,11 +1790,12 @@ type TableRowProps = {
     hoverable?: boolean;
 } & HTMLAttributes<HTMLTableRowElement>;
 
-declare const Table$1: react.ForwardRefExoticComponent<{
-    density?: TableDensity | undefined;
-    stickyHeader?: boolean | undefined;
-    withDividers?: boolean | undefined;
-} & react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
+declare const CollapsibleRow: react.ForwardRefExoticComponent<{
+    type?: TableRowType | undefined;
+    mode?: RowMode | undefined;
+    selected?: boolean | undefined;
+    hoverable?: boolean | undefined;
+} & react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
 
 declare const CollapsibleTable$1: react.ForwardRefExoticComponent<{
     isCollapsed?: boolean | undefined;
@@ -1782,44 +1807,19 @@ declare const CollapsibleTable$1: react.ForwardRefExoticComponent<{
     withDividers?: boolean | undefined;
 } & react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
 
-type TableHeadProps = HTMLAttributes<HTMLTableSectionElement>;
-declare const Head: react.ForwardRefExoticComponent<TableHeadProps & react.RefAttributes<HTMLTableSectionElement>>;
-
-type TableBodyProps = HTMLAttributes<HTMLTableSectionElement>;
-declare const Body: react.ForwardRefExoticComponent<TableBodyProps & react.RefAttributes<HTMLTableSectionElement>>;
-
 type TableFootProps = HTMLAttributes<HTMLTableSectionElement>;
 declare const Foot: react.ForwardRefExoticComponent<TableFootProps & react.RefAttributes<HTMLTableSectionElement>>;
 
-declare const Row: react.ForwardRefExoticComponent<{
-    type?: TableRowType | undefined;
-    mode?: RowMode | undefined;
-    selected?: boolean | undefined;
-    hoverable?: boolean | undefined;
-} & react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
+type TableHeadProps = HTMLAttributes<HTMLTableSectionElement>;
+declare const Head: react.ForwardRefExoticComponent<TableHeadProps & react.RefAttributes<HTMLTableSectionElement>>;
 
-declare const CollapsibleRow: react.ForwardRefExoticComponent<{
+declare const Row: react.ForwardRefExoticComponent<{
     type?: TableRowType | undefined;
     mode?: RowMode | undefined;
     selected?: boolean | undefined;
     hoverable?: boolean | undefined;
 } & react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
 
-type TableCellType = 'data' | 'head';
-type TableCellLayout = 'left' | 'right' | 'center' | 'text and icon';
-interface CollapsibleProps {
-    isCollapsibleChild?: boolean;
-}
-type TableCellProps = {
-    /**Type celle. Returnerer enten `<td>` eller `<th>`. */
-    type?: TableCellType;
-    /**Layout av innholdet i cellen. 'tekst and icon' legger `gap` mellom barna og andre barnet i cellen.  */
-    layout?: TableCellLayout;
-    /** Props ved bruk av `<CollapsibleRow>`. **OBS!** settes automatisk av forelder. */
-    collapsibleProps?: CollapsibleProps;
-} & (TdHTMLAttributes<HTMLTableCellElement> | ThHTMLAttributes<HTMLTableCellElement>);
-declare const Cell: react.ForwardRefExoticComponent<TableCellProps & react.RefAttributes<HTMLTableCellElement>>;
-
 type SortOrder = 'ascending' | 'descending';
 type TableSortCellProps = {
     /**Spesifiserer om kolonnen er sortert. */
@@ -1838,6 +1838,12 @@ declare const SortCell: react.ForwardRefExoticComponent<{
     onClick: (event: MouseEvent$1<HTMLButtonElement>) => void;
 } & Omit<TableCellProps, "type"> & react.RefAttributes<HTMLTableCellElement>>;
 
+declare const Table$1: react.ForwardRefExoticComponent<{
+    density?: TableDensity | undefined;
+    stickyHeader?: boolean | undefined;
+    withDividers?: boolean | undefined;
+} & react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
+
 type TableWrapperProps = HTMLAttributes<HTMLDivElement>;
 declare const TableWrapper: {
     ({ children, ...rest }: TableWrapperProps): react_jsx_runtime.JSX.Element;
@@ -2299,20 +2305,36 @@ declare namespace Calendar {
 type DateFieldProps<T extends DateValue$1 = CalendarDate> = AriaDateFieldOptions<T> & {
     className?: string;
     buttonProps?: ReturnType<typeof useDatePicker>['buttonProps'];
+    /**
+     * For å sette en egendefinert bredde på komponenten.
+     */
+    width?: CSS.Properties['width'];
 } & Pick<InputProps$1, 'componentSize' | 'errorMessage' | 'tip' | 'disabled' | 'style'>;
 
 interface DatePickerProps extends Omit<AriaDatePickerProps<CalendarDate>, 'granularity'>, Pick<DateFieldProps<CalendarDate>, 'componentSize' | 'tip' | 'style'> {
     label?: string;
     errorMessage?: string;
+    /**
+     * For å sette en egendefinert bredde på komponenten.
+     */
+    width?: CSS.Properties['width'];
 }
 declare const DatePicker: react.ForwardRefExoticComponent<DatePickerProps & react.RefAttributes<HTMLElement>>;
 
 type TimePickerProps = Omit<AriaTimeFieldProps<Time>, 'hideTimeZone'> & {
     className?: string;
-} & Pick<InputProps$1, 'componentSize' | 'errorMessage' | 'tip' | 'disabled' | 'style'>;
+    /**
+     * For å sette en egendefinert bredde på komponenten.
+     */
+    width?: CSS.Properties['width'];
+} & Pick<InputProps, 'componentSize' | 'errorMessage' | 'tip' | 'disabled' | 'style'>;
 declare const TimePicker: react.ForwardRefExoticComponent<Omit<AriaTimeFieldProps<Time>, "hideTimeZone"> & {
     className?: string | undefined;
-} & Pick<InputProps$1, "style" | "disabled" | "tip" | "errorMessage" | "componentSize"> & react.RefAttributes<HTMLDivElement>>;
+    /**
+     * For å sette en egendefinert bredde på komponenten.
+     */
+    width?: CSS.Properties['width'];
+} & Pick<InputProps, "style" | "disabled" | "tip" | "errorMessage" | "componentSize"> & react.RefAttributes<HTMLDivElement>>;
 
 declare function nativeDateToDateValue(date: Date, timeZone?: string | undefined): DateValue$1;
 declare function dateValueToNativeDate(date: DateValue$1, timeZone?: string | undefined): Date;

package/dist/index.d.ts

@@ -4,16 +4,16 @@ import { Property, StandardProperties } from 'csstype';
 import * as styled_components from 'styled-components';
 import * as styled_components_dist_types from 'styled-components/dist/types';
 import * as react from 'react';
-import react__default, { CSSProperties, PropsWithChildren, HTMLAttributes, ElementType, ComponentPropsWithoutRef, AnchorHTMLAttributes, LabelHTMLAttributes, InputHTMLAttributes, RefCallback, RefObject, KeyboardEvent as KeyboardEvent$1, Dispatch, SetStateAction, SVGAttributes, ButtonHTMLAttributes, ReactNode, ReactElement, MouseEventHandler, ChangeEvent, Ref, MouseEvent as MouseEvent$1, TdHTMLAttributes, ThHTMLAttributes, ForwardRefExoticComponent, TextareaHTMLAttributes } from 'react';
+import react__default, { HTMLAttributes, PropsWithChildren, ElementType, ComponentPropsWithoutRef, CSSProperties, AnchorHTMLAttributes, LabelHTMLAttributes, InputHTMLAttributes, RefCallback, RefObject, KeyboardEvent as KeyboardEvent$1, Dispatch, SetStateAction, SVGAttributes, ButtonHTMLAttributes, ReactNode, ReactElement, MouseEventHandler, ChangeEvent, Ref, MouseEvent as MouseEvent$1, TdHTMLAttributes, ThHTMLAttributes, ForwardRefExoticComponent, TextareaHTMLAttributes } from 'react';
 import { TextColor as TextColor$1 } from '@norges-domstoler/dds-components/src/utils';
 import * as _floating_ui_react_dom from '@floating-ui/react-dom';
 import { Strategy, Placement as Placement$1 } from '@floating-ui/react-dom';
 import { Environment } from '@norges-domstoler/development-utils';
 import { OptionProps, GroupBase, SingleValueProps, Props, SelectInstance } from 'react-select';
 import { DateValue, AriaCalendarProps } from '@react-aria/calendar';
+import { DateValue as DateValue$1, CalendarDate, Time } from '@internationalized/date';
 import { AriaDatePickerProps } from '@react-types/datepicker';
 import { AriaDateFieldOptions, useDatePicker, AriaTimeFieldProps } from '@react-aria/datepicker';
-import { DateValue as DateValue$1, CalendarDate, Time } from '@internationalized/date';
 import { InputProps as InputProps$1 } from '@norges-domstoler/dds-components';
 
 interface SvgChevronProps {
@@ -37,43 +37,6 @@ declare const OuterInputContainer: styled_components.IStyledComponent<"web", sty
 declare const InputContainer: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
 declare const InputAffixContainer: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
 
-declare const TextOverflowEllipsisWrapper: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
-declare const TextOverflowEllipsisInner: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
-
-type TypographyBodySansType = 'bodySans01' | 'bodySans02' | 'bodySans03' | 'bodySans04';
-type TypographyBodyType = TypographyBodySansType;
-type TypographyHeadingType = 'headingSans01' | 'headingSans02' | 'headingSans03' | 'headingSans04' | 'headingSans05' | 'headingSans06' | 'headingSans07' | 'headingSans08';
-type TypographyLeadType = 'leadSans01' | 'leadSans02' | 'leadSans03' | 'leadSans04' | 'leadSans05';
-type TypographySupportingType = 'supportingStyleHelperText01' | 'supportingStylePlaceholderText01' | 'supportingStylePlaceholderText02' | 'supportingStylePlaceholderText03' | 'supportingStyleTiny01' | 'supportingStyleTiny02';
-type AnchorTypographyType = 'a';
-type LabelTypographyType = 'supportingStyleLabel01';
-type OtherTypographyType = TypographyHeadingType | TypographyBodyType | TypographyLeadType | TypographySupportingType;
-type TypographyType = AnchorTypographyType | LabelTypographyType | OtherTypographyType;
-type StaticTypographyType = OtherTypographyType | LabelTypographyType;
-type InlineElement = 'a' | 'abbr' | 'audio' | 'b' | 'bdi' | 'bdo' | 'big' | 'br' | 'button' | 'canvas' | 'cite' | 'code' | 'data' | 'datalist' | 'del' | 'dfn' | 'em' | 'embed' | 'i' | 'iframe' | 'img' | 'input' | 'ins' | 'kbd' | 'label' | 'map' | 'mark' | 'meter' | 'noscript' | 'object' | 'output' | 'picture' | 'progress' | 'q' | 'ruby' | 's' | 'samp' | 'script' | 'select' | 'slot' | 'small' | 'span' | 'strong' | 'sub' | 'sup' | 'svg' | 'template' | 'textarea' | 'time' | 'u' | 'var' | 'video' | 'wbr';
-interface TypographyInteractionStyling {
-    hover?: CSSProperties;
-    active?: CSSProperties;
-}
-type BaseTypographyProps = PropsWithChildren<{
-    /**Spesifiserer om tekstelementet skal ha spacing definert i Elsa. Brukes hovedsakelig i artikler og lignende. **OBS!** har forskjellig virkning på ulike typografityper. `body` og `lead`-typer får margin på bunnen, `heading`-typer får margin på bunnen og padding på toppen mens `supportingStyles` får margin topp og bunn. */
-    withMargins?: boolean;
-}> & Pick<HTMLAttributes<HTMLElement>, 'style'>;
-type TypographyComponentProps = BaseTypographyProps & {
-    /**Tekstfarge fra utvalget eller custom. **OBS!** Bruk farger fra `@dds-design-tokens`. */
-    color?: TextColor$1;
-    /**Setter `bold` styling. */
-    bold?: boolean;
-    /**Setter `italic` styling. */
-    italic?: boolean;
-    /**Setter en linje under. */
-    underline?: boolean;
-    /**HTML tag som skal brukes istedenfor default definert via `typographyType`.  */
-    as?: ElementType;
-    /**Støtte for å enkelt kunne endre på hover- og active-styling. Bruk `@dds-design-tokens` til farger osv. */
-    interactionProps?: TypographyInteractionStyling;
-};
-
 type Direction$1 = 'row' | 'column';
 
 /**
@@ -155,6 +118,43 @@ type ExtractStrict<T, U extends T> = U;
 type Nullable<T> = T | null;
 type Callback<T> = (e: T) => void;
 
+declare const TextOverflowEllipsisWrapper: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
+declare const TextOverflowEllipsisInner: styled_components.IStyledComponent<"web", styled_components_dist_types.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
+
+type TypographyBodySansType = 'bodySans01' | 'bodySans02' | 'bodySans03' | 'bodySans04';
+type TypographyBodyType = TypographyBodySansType;
+type TypographyHeadingType = 'headingSans01' | 'headingSans02' | 'headingSans03' | 'headingSans04' | 'headingSans05' | 'headingSans06' | 'headingSans07' | 'headingSans08';
+type TypographyLeadType = 'leadSans01' | 'leadSans02' | 'leadSans03' | 'leadSans04' | 'leadSans05';
+type TypographySupportingType = 'supportingStyleHelperText01' | 'supportingStylePlaceholderText01' | 'supportingStylePlaceholderText02' | 'supportingStylePlaceholderText03' | 'supportingStyleTiny01' | 'supportingStyleTiny02';
+type AnchorTypographyType = 'a';
+type LabelTypographyType = 'supportingStyleLabel01';
+type OtherTypographyType = TypographyHeadingType | TypographyBodyType | TypographyLeadType | TypographySupportingType;
+type TypographyType = AnchorTypographyType | LabelTypographyType | OtherTypographyType;
+type StaticTypographyType = OtherTypographyType | LabelTypographyType;
+type InlineElement = 'a' | 'abbr' | 'audio' | 'b' | 'bdi' | 'bdo' | 'big' | 'br' | 'button' | 'canvas' | 'cite' | 'code' | 'data' | 'datalist' | 'del' | 'dfn' | 'em' | 'embed' | 'i' | 'iframe' | 'img' | 'input' | 'ins' | 'kbd' | 'label' | 'map' | 'mark' | 'meter' | 'noscript' | 'object' | 'output' | 'picture' | 'progress' | 'q' | 'ruby' | 's' | 'samp' | 'script' | 'select' | 'slot' | 'small' | 'span' | 'strong' | 'sub' | 'sup' | 'svg' | 'template' | 'textarea' | 'time' | 'u' | 'var' | 'video' | 'wbr';
+interface TypographyInteractionStyling {
+    hover?: CSSProperties;
+    active?: CSSProperties;
+}
+type BaseTypographyProps = PropsWithChildren<{
+    /**Spesifiserer om tekstelementet skal ha spacing definert i Elsa. Brukes hovedsakelig i artikler og lignende. **OBS!** har forskjellig virkning på ulike typografityper. `body` og `lead`-typer får margin på bunnen, `heading`-typer får margin på bunnen og padding på toppen mens `supportingStyles` får margin topp og bunn. */
+    withMargins?: boolean;
+}> & Pick<HTMLAttributes<HTMLElement>, 'style'>;
+type TypographyComponentProps = BaseTypographyProps & {
+    /**Tekstfarge fra utvalget eller custom. **OBS!** Bruk farger fra `@dds-design-tokens`. */
+    color?: TextColor$1;
+    /**Setter `bold` styling. */
+    bold?: boolean;
+    /**Setter `italic` styling. */
+    italic?: boolean;
+    /**Setter en linje under. */
+    underline?: boolean;
+    /**HTML tag som skal brukes istedenfor default definert via `typographyType`.  */
+    as?: ElementType;
+    /**Støtte for å enkelt kunne endre på hover- og active-styling. Bruk `@dds-design-tokens` til farger osv. */
+    interactionProps?: TypographyInteractionStyling;
+};
+
 type AnchorTypographyProps = BaseComponentProps<HTMLAnchorElement, TypographyComponentProps & {
     /**nativ `href`-prop ved `typographyType='a'`.  */
     href?: string | undefined;
@@ -1572,11 +1572,11 @@ type SelectProps<Option = unknown, IsMulti extends boolean = false> = {
     /** CSS klassenavn. */
     className?: string;
     /** Inline styling. */
-    style?: react__default.CSSProperties;
+    style?: React.CSSProperties;
     customOptionElement?: (props: OptionProps<Option, IsMulti, GroupBase<Option>>) => JSX.Element;
     customSingleValueElement?: (props: SingleValueProps<Option, IsMulti, GroupBase<Option>>) => JSX.Element;
 } & Pick<HTMLAttributes<HTMLInputElement>, 'aria-required'> & WrappedReactSelectProps<Option, IsMulti, GroupBase<Option>>;
-type ForwardRefType<Option, IsMulti extends boolean> = react__default.ForwardedRef<SelectInstance<Option, IsMulti, GroupBase<Option>>>;
+type ForwardRefType<Option, IsMulti extends boolean> = React.ForwardedRef<SelectInstance<Option, IsMulti, GroupBase<Option>>>;
 declare function SelectInner<Option = unknown, IsMulti extends boolean = false>(props: SelectProps<Option, IsMulti>, ref: ForwardRefType<Option, IsMulti>): react_jsx_runtime.JSX.Element;
 declare const Select: typeof SelectInner;
 
@@ -1729,6 +1729,27 @@ type SearchCompoundProps = typeof Search$1 & {
 };
 declare const Search: SearchCompoundProps;
 
+type TableBodyProps = HTMLAttributes<HTMLTableSectionElement>;
+declare const Body: react.ForwardRefExoticComponent<TableBodyProps & react.RefAttributes<HTMLTableSectionElement>>;
+
+type TableCellType = 'data' | 'head';
+type TableCellLayout = 'left' | 'right' | 'center' | 'text and icon';
+interface CollapsibleProps {
+    isCollapsibleChild?: boolean;
+}
+type TableCellProps = {
+    /**
+     * Type celle. Returnerer enten `<td>` eller `<th>`.
+     * @default 'data' hvis den er brukt i `<Table.Body>` eller `<Table.Foot>`, 'head' hvis den er i `<Table.Head>`.
+     */
+    type?: TableCellType;
+    /**Layout av innholdet i cellen. 'tekst and icon' legger `gap` mellom barna og andre barnet i cellen.  */
+    layout?: TableCellLayout;
+    /** Props ved bruk av `<CollapsibleRow>`. **OBS!** settes automatisk av forelder. */
+    collapsibleProps?: CollapsibleProps;
+} & (TdHTMLAttributes<HTMLTableCellElement> | ThHTMLAttributes<HTMLTableCellElement>);
+declare const Cell: react.ForwardRefExoticComponent<TableCellProps & react.RefAttributes<HTMLTableCellElement>>;
+
 type TableDensity = 'normal' | 'compact' | 'extraCompact';
 type TableProps = {
     /**Spesifiserer hvor romslige cellene i tabellen skal være. */
@@ -1756,7 +1777,10 @@ type CollapsibleTableProps = {
 type TableRowType = 'body' | 'head';
 type RowMode = 'normal' | 'sum';
 type TableRowProps = {
-    /**Spesifiserer om raden skal brukes i `<head>` eller `<body>`-seksjonen. */
+    /**
+     * Spesifiserer om raden skal brukes i `<head>` eller `<body>`-seksjonen.
+     * @default 'body' hvis den er brukt i `<Table.Body>` eller `<Table.Foot>`, 'head' hvis den er i `<Table.Head>`.
+     */
     type?: TableRowType;
     /**Custom modus for rader som har ytterligere semantisk betydning (f.eks. summeringsrad), definerer kun styling. Ved bruk av sum må `<Cell>` med tall i høyrestilles vha layout prop.  */
     mode?: RowMode;
@@ -1766,11 +1790,12 @@ type TableRowProps = {
     hoverable?: boolean;
 } & HTMLAttributes<HTMLTableRowElement>;
 
-declare const Table$1: react.ForwardRefExoticComponent<{
-    density?: TableDensity | undefined;
-    stickyHeader?: boolean | undefined;
-    withDividers?: boolean | undefined;
-} & react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
+declare const CollapsibleRow: react.ForwardRefExoticComponent<{
+    type?: TableRowType | undefined;
+    mode?: RowMode | undefined;
+    selected?: boolean | undefined;
+    hoverable?: boolean | undefined;
+} & react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
 
 declare const CollapsibleTable$1: react.ForwardRefExoticComponent<{
     isCollapsed?: boolean | undefined;
@@ -1782,44 +1807,19 @@ declare const CollapsibleTable$1: react.ForwardRefExoticComponent<{
     withDividers?: boolean | undefined;
 } & react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
 
-type TableHeadProps = HTMLAttributes<HTMLTableSectionElement>;
-declare const Head: react.ForwardRefExoticComponent<TableHeadProps & react.RefAttributes<HTMLTableSectionElement>>;
-
-type TableBodyProps = HTMLAttributes<HTMLTableSectionElement>;
-declare const Body: react.ForwardRefExoticComponent<TableBodyProps & react.RefAttributes<HTMLTableSectionElement>>;
-
 type TableFootProps = HTMLAttributes<HTMLTableSectionElement>;
 declare const Foot: react.ForwardRefExoticComponent<TableFootProps & react.RefAttributes<HTMLTableSectionElement>>;
 
-declare const Row: react.ForwardRefExoticComponent<{
-    type?: TableRowType | undefined;
-    mode?: RowMode | undefined;
-    selected?: boolean | undefined;
-    hoverable?: boolean | undefined;
-} & react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
+type TableHeadProps = HTMLAttributes<HTMLTableSectionElement>;
+declare const Head: react.ForwardRefExoticComponent<TableHeadProps & react.RefAttributes<HTMLTableSectionElement>>;
 
-declare const CollapsibleRow: react.ForwardRefExoticComponent<{
+declare const Row: react.ForwardRefExoticComponent<{
     type?: TableRowType | undefined;
     mode?: RowMode | undefined;
     selected?: boolean | undefined;
     hoverable?: boolean | undefined;
 } & react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
 
-type TableCellType = 'data' | 'head';
-type TableCellLayout = 'left' | 'right' | 'center' | 'text and icon';
-interface CollapsibleProps {
-    isCollapsibleChild?: boolean;
-}
-type TableCellProps = {
-    /**Type celle. Returnerer enten `<td>` eller `<th>`. */
-    type?: TableCellType;
-    /**Layout av innholdet i cellen. 'tekst and icon' legger `gap` mellom barna og andre barnet i cellen.  */
-    layout?: TableCellLayout;
-    /** Props ved bruk av `<CollapsibleRow>`. **OBS!** settes automatisk av forelder. */
-    collapsibleProps?: CollapsibleProps;
-} & (TdHTMLAttributes<HTMLTableCellElement> | ThHTMLAttributes<HTMLTableCellElement>);
-declare const Cell: react.ForwardRefExoticComponent<TableCellProps & react.RefAttributes<HTMLTableCellElement>>;
-
 type SortOrder = 'ascending' | 'descending';
 type TableSortCellProps = {
     /**Spesifiserer om kolonnen er sortert. */
@@ -1838,6 +1838,12 @@ declare const SortCell: react.ForwardRefExoticComponent<{
     onClick: (event: MouseEvent$1<HTMLButtonElement>) => void;
 } & Omit<TableCellProps, "type"> & react.RefAttributes<HTMLTableCellElement>>;
 
+declare const Table$1: react.ForwardRefExoticComponent<{
+    density?: TableDensity | undefined;
+    stickyHeader?: boolean | undefined;
+    withDividers?: boolean | undefined;
+} & react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
+
 type TableWrapperProps = HTMLAttributes<HTMLDivElement>;
 declare const TableWrapper: {
     ({ children, ...rest }: TableWrapperProps): react_jsx_runtime.JSX.Element;
@@ -2299,20 +2305,36 @@ declare namespace Calendar {
 type DateFieldProps<T extends DateValue$1 = CalendarDate> = AriaDateFieldOptions<T> & {
     className?: string;
     buttonProps?: ReturnType<typeof useDatePicker>['buttonProps'];
+    /**
+     * For å sette en egendefinert bredde på komponenten.
+     */
+    width?: CSS.Properties['width'];
 } & Pick<InputProps$1, 'componentSize' | 'errorMessage' | 'tip' | 'disabled' | 'style'>;
 
 interface DatePickerProps extends Omit<AriaDatePickerProps<CalendarDate>, 'granularity'>, Pick<DateFieldProps<CalendarDate>, 'componentSize' | 'tip' | 'style'> {
     label?: string;
     errorMessage?: string;
+    /**
+     * For å sette en egendefinert bredde på komponenten.
+     */
+    width?: CSS.Properties['width'];
 }
 declare const DatePicker: react.ForwardRefExoticComponent<DatePickerProps & react.RefAttributes<HTMLElement>>;
 
 type TimePickerProps = Omit<AriaTimeFieldProps<Time>, 'hideTimeZone'> & {
     className?: string;
-} & Pick<InputProps$1, 'componentSize' | 'errorMessage' | 'tip' | 'disabled' | 'style'>;
+    /**
+     * For å sette en egendefinert bredde på komponenten.
+     */
+    width?: CSS.Properties['width'];
+} & Pick<InputProps, 'componentSize' | 'errorMessage' | 'tip' | 'disabled' | 'style'>;
 declare const TimePicker: react.ForwardRefExoticComponent<Omit<AriaTimeFieldProps<Time>, "hideTimeZone"> & {
     className?: string | undefined;
-} & Pick<InputProps$1, "style" | "disabled" | "tip" | "errorMessage" | "componentSize"> & react.RefAttributes<HTMLDivElement>>;
+    /**
+     * For å sette en egendefinert bredde på komponenten.
+     */
+    width?: CSS.Properties['width'];
+} & Pick<InputProps, "style" | "disabled" | "tip" | "errorMessage" | "componentSize"> & react.RefAttributes<HTMLDivElement>>;
 
 declare function nativeDateToDateValue(date: Date, timeZone?: string | undefined): DateValue$1;
 declare function dateValueToNativeDate(date: DateValue$1, timeZone?: string | undefined): Date;