@norges-domstoler/dds-components 10.2.1 → 10.3.1

package/dist/cjs/types/BaseComponentProps.d.ts

@@ -10,7 +10,7 @@ import { HTMLAttributes, PropsWithChildren } from 'react';
  * @template TOtherProps Andre props komponenten skal eksponere til konsumenter.
  * @template THTMLAttributesProps Standard `HTMLAttributes<T>` men kan overstyres for f.eks knapper hvis man trenger en annen basetype for `htmlProps`.
  */
-export declare type BaseComponentProps<TElement extends Element, TOtherProps extends Record<string, unknown> = Record<string, unknown>, THTMLAttributesProps extends HTMLAttributes<TElement> = HTMLAttributes<TElement>> = Pick<THTMLAttributesProps, 'id' | 'className'> & TOtherProps & {
+export type BaseComponentProps<TElement extends Element, TOtherProps extends Record<string, unknown> = Record<string, unknown>, THTMLAttributesProps extends HTMLAttributes<TElement> = HTMLAttributes<TElement>> = Pick<THTMLAttributesProps, 'id' | 'className'> & TOtherProps & {
     /**Ekstra HTML-attributter som vil settes på elementet som genereres. Untatt `id` og `className` som settes på toppnivå. */
     htmlProps?: THTMLAttributesProps;
 };
@@ -19,9 +19,9 @@ export declare type BaseComponentProps<TElement extends Element, TOtherProps ext
  *
  * {@link BaseComponentProps}
  */
-export declare type BaseComponentPropsWithChildren<T extends Element, TProps extends Record<string, unknown> = Record<string, unknown>, THTMLProps extends HTMLAttributes<T> = HTMLAttributes<T>> = BaseComponentProps<T, PropsWithChildren<TProps>, THTMLProps>;
+export type BaseComponentPropsWithChildren<T extends Element, TProps extends Record<string, unknown> = Record<string, unknown>, THTMLProps extends HTMLAttributes<T> = HTMLAttributes<T>> = BaseComponentProps<T, PropsWithChildren<TProps>, THTMLProps>;
 export declare const joinClassNames: (...classNames: (string | undefined)[]) => string;
-declare type GetBaseHTMLProps = {
+type GetBaseHTMLProps = {
     <T extends Element>(id: HTMLAttributes<T>['id'], className: HTMLAttributes<T>['className'], htmlProps: HTMLAttributes<T> | undefined, unknownProps: object): HTMLAttributes<T> & object;
     <T extends Element>(id: HTMLAttributes<T>['id'], htmlProps: HTMLAttributes<T> | undefined, unknownProps: object): HTMLAttributes<T> & object;
 };

package/dist/cjs/types/CheckboxPickedHTMLAttributes.d.ts

@@ -1,2 +1,2 @@
 import { InputHTMLAttributes } from 'react';
-export declare type CheckboxPickedHTMLAttributes = Pick<InputHTMLAttributes<HTMLInputElement>, 'aria-describedby' | 'name' | 'checked' | 'defaultChecked' | 'value' | 'defaultValue' | 'onChange' | 'onBlur'>;
+export type CheckboxPickedHTMLAttributes = Pick<InputHTMLAttributes<HTMLInputElement>, 'aria-describedby' | 'name' | 'checked' | 'defaultChecked' | 'value' | 'defaultValue' | 'onChange' | 'onBlur'>;

package/dist/cjs/types/Direction.d.ts

@@ -1 +1 @@
-export declare type Direction = 'row' | 'column';
+export type Direction = 'row' | 'column';

package/dist/cjs/types/utils.d.ts

@@ -5,11 +5,11 @@
  * @template T
  * @template K
  */
-export declare type WithRequiredIf<Condition extends boolean, T, K extends keyof T> = Omit<T, K> & Pick<true extends Condition ? Required<T> : T, K>;
+export type WithRequiredIf<Condition extends boolean, T, K extends keyof T> = Omit<T, K> & Pick<true extends Condition ? Required<T> : T, K>;
 /**
  * Gir tilbake typer fra `T` som matcher `U`
  *
  * @template T en union type
  * @template U delmengde av `T`
  */
-export declare type ExtractStrict<T, U extends T> = U;
+export type ExtractStrict<T, U extends T> = U;

package/dist/cjs/utils/color.d.ts

@@ -1,5 +1,5 @@
 import { Property } from 'csstype';
-export declare type ColorAlphaFormat = 'hex8' | 'decimal';
+export type ColorAlphaFormat = 'hex8' | 'decimal';
 export declare const convertAlpha: (value: number | string, typeFrom: ColorAlphaFormat, typeTo: ColorAlphaFormat) => string | number | undefined;
 export declare const hexToRGBA: (hex: string) => string;
 export declare const addAlphaToRGB: (rgb: string, alpha: number | string) => string;
@@ -23,8 +23,8 @@ export declare const textColors: {
     gray8: string;
     gray9: string;
 };
-export declare type DDSTextColor = 'interactive' | 'primary' | 'danger' | 'warning' | 'success' | 'onLight' | 'onDark' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'gray6' | 'gray7' | 'gray8' | 'gray9';
+export type DDSTextColor = 'interactive' | 'primary' | 'danger' | 'warning' | 'success' | 'onLight' | 'onDark' | 'gray1' | 'gray2' | 'gray3' | 'gray4' | 'gray5' | 'gray6' | 'gray7' | 'gray8' | 'gray9';
 export declare const textColorsArray: string[];
-export declare type TextColor = DDSTextColor | Property.Color;
+export type TextColor = DDSTextColor | Property.Color;
 export declare function isTextColor(color: string): color is DDSTextColor;
 export declare const getTextColor: (color: TextColor) => TextColor;

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

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

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

@@ -1,5 +1,5 @@
 import { BaseComponentPropsWithChildren } from '../../types';
-export declare type BreadcrumbsProps = BaseComponentPropsWithChildren<HTMLElement, {
+export type BreadcrumbsProps = BaseComponentPropsWithChildren<HTMLElement, {
     /** Spesifiserer om versjonen for små skjermer skal vises; den viser `<Breadcrumb />` kun til den forrige siden.  */
     smallScreen?: boolean;
 }>;

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

@@ -1,5 +1,5 @@
 import { ButtonAppearance, ButtonPurpose, ButtonSize, IconPosition } from './Button.types';
-declare type ButtonWrapperProps = {
+type ButtonWrapperProps = {
     appearance: ButtonAppearance;
     purpose: ButtonPurpose;
     size: ButtonSize;
@@ -10,7 +10,7 @@ declare type ButtonWrapperProps = {
     iconPosition?: IconPosition;
 };
 export declare const ButtonWrapper: import("styled-components").StyledComponent<"button", any, ButtonWrapperProps, never>;
-declare type StyledIconWrapperSpanProps = {
+type StyledIconWrapperSpanProps = {
     iconPosition?: IconPosition;
     size: ButtonSize;
     absolutePosition?: boolean;
@@ -18,7 +18,7 @@ declare type StyledIconWrapperSpanProps = {
     justIcon?: boolean;
 };
 export declare const StyledIconWrapperSpan: import("styled-components").StyledComponent<"span", any, StyledIconWrapperSpanProps, never>;
-declare type LabelProps = {
+type LabelProps = {
     isHidden?: boolean;
 };
 export declare const Label: import("styled-components").StyledComponent<"span", any, LabelProps, never>;

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

@@ -1,12 +1,12 @@
 import { ButtonHTMLAttributes } from 'react';
 import { SvgIcon } from '../../icons/utils/propTypes';
 import { BaseComponentProps } from '../../types';
-export declare type ButtonPurpose = 'primary' | 'secondary' | 'danger';
-export declare type ButtonSize = 'tiny' | 'small' | 'medium' | 'large';
-export declare type ButtonAppearance = 'filled' | 'ghost' | 'rounded' | 'borderless';
-export declare type IconPosition = 'left' | 'right';
-declare type PickedHTMLAttributes = Pick<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'onFocus' | 'onBlur' | 'type'>;
-export declare type ButtonProps = BaseComponentProps<HTMLButtonElement, {
+export type ButtonPurpose = 'primary' | 'secondary' | 'danger';
+export type ButtonSize = 'tiny' | 'small' | 'medium' | 'large';
+export type ButtonAppearance = 'filled' | 'ghost' | 'rounded' | 'borderless';
+export type IconPosition = 'left' | 'right';
+type PickedHTMLAttributes = Pick<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'onFocus' | 'onBlur' | 'type'>;
+export type ButtonProps = BaseComponentProps<HTMLButtonElement, {
     /**Størrelsen på knappen. */
     size?: ButtonSize;
     /**Tekst i knappen. */

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

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

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

@@ -1,5 +1,5 @@
 import { BaseComponentPropsWithChildren } from '../../../types';
-export declare type CardAccordionProps = BaseComponentPropsWithChildren<HTMLDivElement, {
+export type CardAccordionProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Spesifiserer om body skal være utvidet ved innlastning. */
     isExpanded?: boolean;
     /**For å lytte til endringer i expanded-state. */

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

@@ -1,6 +1,6 @@
 import { Property } from 'csstype';
 import { BaseComponentPropsWithChildren } from '../../../types';
-export declare type CardAccordionBodyProps = BaseComponentPropsWithChildren<HTMLDivElement, {
+export type CardAccordionBodyProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller komponenten om den skal utvides.  */
     isExpanded?: boolean;
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller `id` til `<CardAccordionHeader />`.  */

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

@@ -1,6 +1,6 @@
 import { ButtonHTMLAttributes } from 'react';
 import { BaseComponentPropsWithChildren } from '../../../types';
-export declare type CardAccordionHeaderProps = BaseComponentPropsWithChildren<HTMLButtonElement, {
+export type CardAccordionHeaderProps = BaseComponentPropsWithChildren<HTMLButtonElement, {
     /** **OBS!** denne propen blir satt automatisk av forelder. Forteller body er utvidet.  */
     isExpanded?: boolean;
     /** **OBS!** denne propen blir satt automatisk av forelder. Callback for å styre utvidelse og sammentrukking.  */

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

@@ -1,7 +1,7 @@
 import { InputHTMLAttributes } from 'react';
 import { BaseComponentProps } from '../../types';
 import { CheckboxPickedHTMLAttributes } from '../../types/CheckboxPickedHTMLAttributes';
-export declare type CheckboxProps = BaseComponentProps<HTMLInputElement, {
+export type CheckboxProps = BaseComponentProps<HTMLInputElement, {
     /** Ledetekst for inputelementet. */
     label?: string;
     /**Indikererr ugyldig input, endrer styling. */

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

@@ -1,5 +1,5 @@
 import { BaseComponentPropsWithChildren, Direction } from '../../types';
-export declare type CheckboxGroupProps = BaseComponentPropsWithChildren<HTMLDivElement, {
+export type CheckboxGroupProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Ledetekst for gruppen. */
     label?: string;
     /**Retningen barna gjengis i. */

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

@@ -1,5 +1,5 @@
 import { BaseComponentProps } from '../../types';
-export declare type ChipProps = BaseComponentProps<HTMLDivElement, {
+export type ChipProps = BaseComponentProps<HTMLDivElement, {
     /** Teksten som vises i komponenten. */
     text?: string;
     /** Ekstra logikk når `<Chip />` lukkes. */

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

@@ -1,3 +1,3 @@
 import { HTMLAttributes } from 'react';
-export declare type ChipGroupProps = HTMLAttributes<HTMLUListElement>;
+export type ChipGroupProps = HTMLAttributes<HTMLUListElement>;
 export declare const ChipGroup: import("react").ForwardRefExoticComponent<ChipGroupProps & import("react").RefAttributes<HTMLUListElement>>;

package/dist/components/Datepicker/Datepicker.d.ts

@@ -1,6 +1,6 @@
 import { InputProps } from '../../helpers';
-declare type DatepickerType = 'date' | 'datetime-local';
-export declare type DatepickerProps = Omit<InputProps, 'type'> & {
+type DatepickerType = 'date' | 'datetime-local';
+export type DatepickerProps = Omit<InputProps, 'type'> & {
     /** Angi dato-input med eller uten klokkeslett. */
     type?: DatepickerType;
 };

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

@@ -1,6 +1,6 @@
 import { BaseComponentPropsWithChildren } from '../../types';
-export declare type DescriptionListAppearance = 'small' | 'bold';
-export declare type DescriptionListProps = BaseComponentPropsWithChildren<HTMLDListElement, {
+export type DescriptionListAppearance = 'small' | 'bold';
+export type DescriptionListProps = BaseComponentPropsWithChildren<HTMLDListElement, {
     /**Påvirker tekst styling. */
     appearance?: DescriptionListAppearance;
 }>;

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

@@ -1,6 +1,6 @@
 import { BaseComponentPropsWithChildren } from '../../types';
 import { SvgIcon } from '../../icons/utils';
-export declare type DescriptionListDescProps = BaseComponentPropsWithChildren<HTMLElement, {
+export type DescriptionListDescProps = BaseComponentPropsWithChildren<HTMLElement, {
     /**Ikon som vises ved siden av teksten. */
     icon?: SvgIcon;
 }>;

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

@@ -1,6 +1,6 @@
 import { Property } from 'csstype';
 import { BaseComponentPropsWithChildren } from '../../types';
-export declare type DescriptionListGroupProps = BaseComponentPropsWithChildren<HTMLDivElement, {
+export type DescriptionListGroupProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Custom margin. */
     margin?: Property.Margin<string>;
 }>;

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

@@ -1,3 +1,3 @@
 import { HTMLAttributes } from 'react';
-export declare type DescriptionListTermProps = HTMLAttributes<HTMLElement>;
+export type DescriptionListTermProps = HTMLAttributes<HTMLElement>;
 export declare const DescriptionListTerm: import("react").ForwardRefExoticComponent<DescriptionListTermProps & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,6 +1,6 @@
 import { BaseComponentProps } from '../../types';
-export declare type DividerColor = 'primary' | 'primaryLighter';
-export declare type DividerProps = BaseComponentProps<HTMLHRElement, {
+export type DividerColor = 'primary' | 'primaryLighter';
+export type DividerProps = BaseComponentProps<HTMLHRElement, {
     /** Farge på horisontal linje. */
     color?: DividerColor;
 }>;

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

@@ -1,14 +1,14 @@
 import { ReactNode, RefObject } from 'react';
 import { Property } from 'csstype';
 import { BaseComponentPropsWithChildren } from '../../types';
-export declare type DrawerSize = 'small' | 'large';
-export declare type DrawerPlacement = 'left' | 'right';
-export declare type WidthProps = {
+export type DrawerSize = 'small' | 'large';
+export type DrawerPlacement = 'left' | 'right';
+export type WidthProps = {
     minWidth?: Property.MinWidth<string>;
     maxWidth?: Property.MaxWidth<string>;
     width?: Property.Width<string>;
 };
-export declare type DrawerProps = BaseComponentPropsWithChildren<HTMLDivElement, {
+export type DrawerProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**Størrelsen på `<Drawer />`. */
     size?: DrawerSize;
     /** Plasseringen til `<Drawer />`. */

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

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-declare type DrawerGroupProps = {
+type DrawerGroupProps = {
     /**Barna til komponenten. */
     children: ReactNode;
     /**`id` til `<Drawer />`. */

package/dist/components/FileUploader/ErrorList.d.ts

@@ -1,4 +1,4 @@
-declare type ErrorListProps = {
+type ErrorListProps = {
     errors: {
         id: string | undefined;
         message: string;

package/dist/components/FileUploader/File.d.ts

@@ -1,5 +1,5 @@
 import { FileUploaderFile } from './fileUploaderReducer';
-declare type FileProps = {
+type FileProps = {
     parentId: string;
     index: number;
     isValid: boolean;

package/dist/components/FileUploader/FileUploader.d.ts

@@ -1,7 +1,7 @@
 import { FileList } from './types';
 import { FileUploaderHookProps } from './useFileUploader';
 import { Property } from 'csstype';
-declare type FileUploaderProps = {
+type FileUploaderProps = {
     /**Id til filopplasteren. */
     id?: string;
     /**Ledetekst for filopplaster. */
@@ -14,6 +14,6 @@ declare type FileUploaderProps = {
     onChange: (newFiles: FileList) => void;
     /**Bredde for filopplasteren. */
     width?: Property.Width<string>;
-} & Pick<FileUploaderHookProps, 'initialFiles' | 'accept' | 'maxFiles' | 'disabled'>;
+} & Partial<FileUploaderHookProps>;
 export declare const FileUploader: (props: FileUploaderProps) => JSX.Element;
 export {};

package/dist/components/FileUploader/FileUploader.js

@@ -62,7 +62,8 @@ var FileUploader = function FileUploader(props) {
     maxFiles = props.maxFiles,
     disabled = props.disabled,
     onChange = props.onChange,
-    width = props.width;
+    width = props.width,
+    errorMessage = props.errorMessage;
   var generatedId = useId();
   var uniqueId = id !== null && id !== void 0 ? id : "".concat(generatedId, "-fileUploader");
   var _useFileUploader = useFileUploader({
@@ -70,7 +71,8 @@ var FileUploader = function FileUploader(props) {
       initialFiles: initialFiles,
       accept: accept,
       disabled: disabled,
-      maxFiles: maxFiles
+      maxFiles: maxFiles,
+      errorMessage: errorMessage
     }),
     _useFileUploader$stat = _useFileUploader.state,
     stateFiles = _useFileUploader$stat.files,
@@ -121,7 +123,7 @@ var FileUploader = function FileUploader(props) {
       messageType: "tip"
     }), jsxs(Root, Object.assign({}, getRootProps(), {
       isDragActive: isDragActive,
-      hasRootErrors: rootErrors.length > 0
+      hasRootErrors: hasRootErrors
     }, {
       children: [jsx(FileUploaderInput, Object.assign({}, getInputProps())), "Dra og slipp filer her eller", ' ', jsx(VisuallyHidden, Object.assign({
         as: "span"

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

@@ -7,7 +7,7 @@ declare const _default: {
         required?: boolean | undefined;
         onChange: (newFiles: import("./types").FileList) => void;
         width?: import("csstype").Property.Width<string> | undefined;
-    } & Pick<import("./useFileUploader").FileUploaderHookProps, "disabled" | "accept" | "initialFiles" | "maxFiles">) => JSX.Element;
+    } & Partial<import("./useFileUploader").FileUploaderHookProps>) => JSX.Element;
     argTypes: {
         color: {
             control: {

package/dist/components/FileUploader/fileUploaderReducer.d.ts

@@ -1,15 +1,15 @@
 import { FileWithPath } from 'file-selector';
 import { Reducer } from 'react';
-export declare type FileUploaderFile = {
+export type FileUploaderFile = {
     file: FileWithPath;
     errors: string[];
 };
-declare type FileChangePayload = {
+type FileChangePayload = {
     rootErrors: RootErrorList;
     files: FileUploaderFile[];
 };
-export declare type RootErrorList = string[];
-export declare type FileUploaderAction = {
+export type RootErrorList = string[];
+export type FileUploaderAction = {
     type: 'focus';
 } | {
     type: 'blur';
@@ -23,8 +23,11 @@ export declare type FileUploaderAction = {
 } | {
     type: 'onRemoveFile';
     payload: FileChangePayload;
+} | {
+    type: 'setRootErrors';
+    payload: RootErrorList;
 };
-export declare type FileUploaderState = {
+export type FileUploaderState = {
     files: FileUploaderFile[];
     isFocused: boolean;
     isFileDialogActive: boolean;

package/dist/components/FileUploader/fileUploaderReducer.js

@@ -27,6 +27,10 @@ var fileUploaderReducer = function fileUploaderReducer(state, action) {
         rootErrors: action.payload.rootErrors,
         files: action.payload.files
       });
+    case 'setRootErrors':
+      return Object.assign(Object.assign({}, state), {
+        rootErrors: action.payload
+      });
     default:
       return state;
   }

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

@@ -1,10 +1,10 @@
-declare type FileExtensionAccept = `.${string}`;
-declare type AnyMimeType = '*';
-declare type ImageMimeType = 'png' | 'jpeg' | 'bmp' | 'gif' | 'svg+xml' | 'tiff' | 'webp';
-declare type VideoMimeType = 'x-msvideo' | 'mp4' | 'mpeg' | 'ogg' | 'mp2t' | 'webm' | '3gpp' | '3gpp2';
-declare type AudioMimeType = 'aac' | 'midi' | 'x-midi' | 'mpeg' | 'ogg' | 'opus' | 'wav' | 'webm' | '3gpp' | '3gpp2';
-declare type ApplicationMimeType = 'octet-stream' | 'msword' | 'vnd.openxmlformats-officedocument.wordprocessingml.document' | 'epub+zip' | 'gzip' | 'java-archive' | 'json' | 'vnd.oasis.opendocument.presentation' | 'vnd.oasis.opendocument.spreadsheet' | 'vnd.oasis.opendocument.text' | 'pdf' | 'vnd.ms-powerpoint' | 'vnd.openxmlformats-officedocument.presentationml.presentation' | 'rtf' | 'x-sh' | 'x-tar' | 'vnd.visio' | 'xhtml+xml' | 'vnd.ms-excel' | 'vnd.openxmlformats-officedocument.spreadsheetml.sheet' | 'xml' | 'vnd.mozilla.xul+xml' | 'zip';
-declare type MimeType = `image/${ImageMimeType | AnyMimeType}` | `video/${VideoMimeType | AnyMimeType}` | `audio/${AudioMimeType | AnyMimeType}` | `application/${ApplicationMimeType}`;
-export declare type Accept = MimeType | FileExtensionAccept;
-export declare type FileList = File[];
+type FileExtensionAccept = `.${string}`;
+type AnyMimeType = '*';
+type ImageMimeType = 'png' | 'jpeg' | 'bmp' | 'gif' | 'svg+xml' | 'tiff' | 'webp';
+type VideoMimeType = 'x-msvideo' | 'mp4' | 'mpeg' | 'ogg' | 'mp2t' | 'webm' | '3gpp' | '3gpp2';
+type AudioMimeType = 'aac' | 'midi' | 'x-midi' | 'mpeg' | 'ogg' | 'opus' | 'wav' | 'webm' | '3gpp' | '3gpp2';
+type ApplicationMimeType = 'octet-stream' | 'msword' | 'vnd.openxmlformats-officedocument.wordprocessingml.document' | 'epub+zip' | 'gzip' | 'java-archive' | 'json' | 'vnd.oasis.opendocument.presentation' | 'vnd.oasis.opendocument.spreadsheet' | 'vnd.oasis.opendocument.text' | 'pdf' | 'vnd.ms-powerpoint' | 'vnd.openxmlformats-officedocument.presentationml.presentation' | 'rtf' | 'x-sh' | 'x-tar' | 'vnd.visio' | 'xhtml+xml' | 'vnd.ms-excel' | 'vnd.openxmlformats-officedocument.spreadsheetml.sheet' | 'xml' | 'vnd.mozilla.xul+xml' | 'zip';
+type MimeType = `image/${ImageMimeType | AnyMimeType}` | `video/${VideoMimeType | AnyMimeType}` | `audio/${AudioMimeType | AnyMimeType}` | `application/${ApplicationMimeType}`;
+export type Accept = MimeType | FileExtensionAccept;
+export type FileList = File[];
 export {};

package/dist/components/FileUploader/useFileUploader.d.ts

@@ -1,16 +1,18 @@
 import React, { ButtonHTMLAttributes, HTMLAttributes, InputHTMLAttributes, Ref } from 'react';
 import { FileUploaderFile } from './fileUploaderReducer';
 import { Accept, FileList } from './types';
-export declare type FileUploaderHookProps = {
-    id?: string;
+export type FileUploaderHookProps = {
+    id: string | undefined;
     /**Dersom komponenten styres utenfra. En liste over filer som skal være med ved første render. */
-    initialFiles?: FileList;
+    initialFiles: FileList | undefined;
     /**Hvilke filendelser eller mime-typer som filopplasteren skal akseptere. */
-    accept?: Accept[];
+    accept: Accept[] | undefined;
     /**Om filopplasteren er avslått eller ikke */
-    disabled?: boolean;
+    disabled: boolean | undefined;
     /**Maks antall filer som tillates. */
-    maxFiles?: number;
+    maxFiles: number | undefined;
+    /**Feilmelding. Setter også error state. */
+    errorMessage: string | undefined;
 };
 export declare const useFileUploader: <TRootElement extends HTMLElement>(props: FileUploaderHookProps) => {
     state: import("./fileUploaderReducer").FileUploaderState;

package/dist/components/FileUploader/useFileUploader.js

@@ -1,15 +1,18 @@
 import { slicedToArray as _slicedToArray, regeneratorRuntime as _regeneratorRuntime, toConsumableArray as _toConsumableArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { __awaiter } from 'tslib';
-import { useRef, useReducer, useCallback } from 'react';
+import { useRef, useMemo, useReducer, useEffect, useCallback } from 'react';
 import { fileUploaderReducer } from './fileUploaderReducer.js';
 import { fromEvent } from 'file-selector';
 import { preventDefaults, isEventWithFiles, isFileAccepted, getInvalidFileTypeErrorMessage, getTooManyFilesErrorMessage } from './utils.js';
 
-var calcRootErrors = function calcRootErrors(files, maxFiles) {
+var calcRootErrors = function calcRootErrors(files, maxFiles, errorMessage) {
   var errors = [];
   if (maxFiles && maxFiles >= 1 && files.length > maxFiles) {
     errors.push(getTooManyFilesErrorMessage(maxFiles));
   }
+  if (errorMessage) {
+    errors.push(errorMessage);
+  }
   return errors;
 };
 var useFileUploader = function useFileUploader(props) {
@@ -17,25 +20,35 @@ var useFileUploader = function useFileUploader(props) {
     initialFiles = _props$initialFiles === void 0 ? [] : _props$initialFiles,
     accept = props.accept,
     maxFiles = props.maxFiles,
-    disabled = props.disabled;
+    disabled = props.disabled,
+    errorMessage = props.errorMessage;
   var rootRef = useRef(null);
   var inputRef = useRef(null);
   var buttonRef = useRef(null);
+  var initialFileUploaderFiles = useMemo(function () {
+    return initialFiles.map(function (f) {
+      return {
+        file: f,
+        errors: []
+      };
+    });
+  }, [initialFiles]);
   var _useReducer = useReducer(fileUploaderReducer, {
-      files: initialFiles.map(function (f) {
-        return {
-          file: f,
-          errors: []
-        };
-      }),
+      files: initialFileUploaderFiles,
       isFocused: false,
       isFileDialogActive: false,
       isDragActive: false,
-      rootErrors: []
+      rootErrors: calcRootErrors(initialFileUploaderFiles, maxFiles, errorMessage)
     }),
     _useReducer2 = _slicedToArray(_useReducer, 2),
     state = _useReducer2[0],
     dispatch = _useReducer2[1];
+  useEffect(function () {
+    dispatch({
+      type: 'setRootErrors',
+      payload: calcRootErrors(initialFileUploaderFiles, maxFiles, errorMessage)
+    });
+  }, [dispatch, initialFileUploaderFiles, maxFiles, errorMessage]);
   var stateFiles = state.files;
   var onRootFocus = useCallback(function () {
     return dispatch({
@@ -125,7 +138,7 @@ var useFileUploader = function useFileUploader(props) {
                   errors: accepted ? [] : [getInvalidFileTypeErrorMessage()]
                 };
               }).concat(stateFiles);
-              rootErrors = calcRootErrors(newFiles, maxFiles);
+              rootErrors = calcRootErrors(newFiles, maxFiles, errorMessage);
               dispatch({
                 type: 'onSetFiles',
                 payload: {
@@ -140,7 +153,7 @@ var useFileUploader = function useFileUploader(props) {
         }
       }, _callee2);
     }));
-  }, [stateFiles, maxFiles, accept, dispatch]);
+  }, [stateFiles, maxFiles, accept, errorMessage, dispatch]);
   var openFileDialog = useCallback(function () {
     if (inputRef.current) {
       inputRef.current.value = '';
@@ -150,7 +163,7 @@ var useFileUploader = function useFileUploader(props) {
   var removeFile = useCallback(function (file) {
     var newFiles = _toConsumableArray(stateFiles);
     newFiles.splice(stateFiles.indexOf(file), 1);
-    var rootErrors = calcRootErrors(newFiles, maxFiles);
+    var rootErrors = calcRootErrors(newFiles, maxFiles, errorMessage);
     dispatch({
       type: 'onRemoveFile',
       payload: {
@@ -158,7 +171,7 @@ var useFileUploader = function useFileUploader(props) {
         files: newFiles
       }
     });
-  }, [stateFiles, maxFiles]);
+  }, [stateFiles, maxFiles, errorMessage]);
   var getRootProps = useCallback(function () {
     return {
       onBlur: onRootBlur,