@norges-domstoler/dds-components 13.7.0 → 13.8.1

package/dist/cjs/components/AppShell/AppShell.d.ts

@@ -1,13 +1,38 @@
 import { PropsWithChildren, ReactElement } from 'react';
+import { User } from './Navigation/TopBar';
+import { OverflowMenuProps } from '../OverflowMenu';
+import { Environment } from '@norges-domstoler/development-utils';
 export type AppShellProps = PropsWithChildren<{
-    /**Versjon på appen på formatet 0.0.0 */
+    /**
+     * Versjon på appen på formatet 0.0.0
+     */
     version?: string;
     navigation: AppShellNavigationProps;
+    /**
+     * Den innloggede brukeren.
+     */
+    user: User;
+    /**
+     * Menyvalg som skal vises i OverflowMenu knyttet til "bruker"-knappen.
+     */
+    userMenuItems?: OverflowMenuProps['items'];
+    /**
+     * `environment` brukes for å  vise en banner øverst i appen som viser hvilket miljø du er i.
+     * Når environment er undefined eller `"PROD"` så vises ikke banneret.
+     */
+    environment?: Environment;
 }>;
 export type AppShellNavigationProps = {
-    /**Interne lenker i navigasjonen. */
+    /**
+     * Interne lenker i navigasjonen.
+     */
     internal?: ReactElement[];
-    /**Eksterne lenker i navigasjonen. */
+    /**
+     * Eksterne lenker i navigasjonen.
+     */
     external?: ReactElement[];
 };
-export declare const AppShell: ({ children, version, navigation: { internal, external }, }: AppShellProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AppShell: {
+    ({ children, version, navigation: { internal, external }, user, userMenuItems, environment, }: AppShellProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/cjs/components/AppShell/AppShell.stories.d.ts

@@ -2,11 +2,14 @@ import { ComponentProps } from 'react';
 import { AppShell } from '.';
 declare const _default: {
     title: string;
-    component: (({ children, version, navigation: { internal, external }, }: import("./AppShell").AppShellProps) => import("react/jsx-runtime").JSX.Element) & {
+    component: {
+        ({ children, version, navigation: { internal, external }, user, userMenuItems, environment, }: import("./AppShell").AppShellProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    } & {
         NavItem: {
-            <T extends import("@norges-domstoler/dds-core").As = "a">({ as: _as, active, icon, external, children, ...rest }: import("react").PropsWithoutRef<ComponentProps<T>> & {
+            <T extends import("@norges-domstoler/dds-core").As = "a">({ as: _as, active, icon, external, children, onClick: propOnClick, ...rest }: import("react").PropsWithoutRef<ComponentProps<T>> & {
                 as?: T | undefined;
-            } & ({
+            } & (({
                 icon: import("@norges-domstoler/dds-icons").SvgIcon;
                 active?: boolean | undefined;
                 external?: false | undefined;
@@ -14,10 +17,12 @@ declare const _default: {
                 external: true;
                 active?: false | undefined;
                 icon?: undefined;
+            }) & {
+                onClick?: import("react").MouseEventHandler | undefined;
             })): import("react/jsx-runtime").JSX.Element;
             displayName: string;
         };
     };
 };
 export default _default;
-export declare const Default: (args: ComponentProps<typeof AppShell>) => import("react/jsx-runtime").JSX.Element;
+export declare const Default: (args: Partial<ComponentProps<typeof AppShell>>) => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/AppShell/AppShell.tokens.d.ts

@@ -35,6 +35,14 @@ export declare const appShellTokens: {
             color: string;
             logo: {
                 fontWeight: number;
+                small: {
+                    fontWeight: number;
+                    lineHeight: any;
+                    fontSize: string;
+                    letterSpacing: any;
+                    fontFamily: any;
+                    fontStyle: any;
+                };
                 lineHeight: any;
                 fontSize: string;
                 letterSpacing: any;
@@ -50,6 +58,12 @@ export declare const appShellTokens: {
                 fontStyle: any;
             };
         };
+        topBar: {
+            padding: string;
+            height: string;
+            buttonTextColor: string;
+            gap: string;
+        };
         color: string;
         backgroundColor: string;
         gap: string;
@@ -57,6 +71,7 @@ export declare const appShellTokens: {
         padding: string;
         width: string;
         mobile: {
+            breakpoint: string;
             iconColors: string;
         };
     };
@@ -64,5 +79,6 @@ export declare const appShellTokens: {
         gap: string;
         textColor: string;
         backgroundColor: string;
+        borderRadius: string;
     };
 };

package/dist/cjs/components/AppShell/AppShellContext.d.ts

@@ -0,0 +1,10 @@
+import { type ReactNode, type SetStateAction, type Dispatch } from 'react';
+type AppShellContextValues = {
+    isOpen: boolean;
+    setOpen: Dispatch<SetStateAction<boolean>>;
+};
+export declare const AppShellContextProvider: ({ children, }: {
+    children: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const useAppShellContext: () => AppShellContextValues;
+export {};

package/dist/cjs/components/AppShell/Navigation/EmbeteIcon.d.ts

@@ -0,0 +1,7 @@
+import { SvgProps } from '@norges-domstoler/dds-icons';
+export type EmbeteType = 'jordskifterett' | 'tingrett' | 'lagmannsrett' | 'høyesterett';
+type EmbeteIconProps = {
+    type?: EmbeteType;
+} & SvgProps;
+export declare const EmbeteIcon: ({ type, ...rest }: EmbeteIconProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/components/AppShell/Navigation/Navigation.d.ts

@@ -1,8 +1,13 @@
 import { ReactElement } from 'react';
+import { User } from './TopBar';
+import { OverflowMenuProps } from '../../OverflowMenu';
 export declare const NavigationItems: import("styled-components").StyledComponent<"nav", any, {}, never>;
 export type NavigationProps = {
     version: string;
     internal: ReactElement[];
     external: ReactElement[];
+    user: User;
+    userMenuItems?: OverflowMenuProps['items'];
+    environmentBannerActive: boolean;
 };
-export declare const Navigation: ({ version, internal, external, }: NavigationProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Navigation: ({ version, user, userMenuItems, internal, external, environmentBannerActive, }: NavigationProps) => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/AppShell/Navigation/NavigationItem.d.ts

@@ -1,6 +1,7 @@
 import { type PropsOf, type As } from '@norges-domstoler/dds-core';
 import { SvgIcon } from '@norges-domstoler/dds-icons';
-type BaseNavigationItemProps = {
+import { type MouseEventHandler } from 'react';
+type BaseNavigationItemProps = ({
     icon: SvgIcon;
     active?: boolean;
     external?: undefined | false;
@@ -8,10 +9,12 @@ type BaseNavigationItemProps = {
     external: true;
     active?: undefined | false;
     icon?: undefined;
+}) & {
+    onClick?: MouseEventHandler;
 };
 type NavigationItemProps<T extends As = 'a'> = PropsOf<T> & BaseNavigationItemProps;
 export declare const NavigationItem: {
-    <T extends As = "a">({ as: _as, active, icon, external, children, ...rest }: NavigationItemProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends As = "a">({ as: _as, active, icon, external, children, onClick: propOnClick, ...rest }: NavigationItemProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export {};

package/dist/cjs/components/AppShell/Navigation/NavigationLogo.d.ts

@@ -0,0 +1,3 @@
+export declare const NavigationLogo: import("styled-components").StyledComponent<"a", any, {
+    small?: boolean | undefined;
+}, never>;

package/dist/cjs/components/AppShell/Navigation/TopBar.d.ts

@@ -0,0 +1,23 @@
+import { EmbeteType } from './EmbeteIcon';
+import { OverflowMenuProps } from '../../OverflowMenu';
+type TopBarProps = {
+    user: User;
+    userMenuItems?: OverflowMenuProps['items'];
+    isNavigationOpen: boolean;
+    onNavigationOpenChange: (isOpen: boolean) => void;
+    environmentBannerActive: boolean;
+};
+export type User = {
+    /**Brukerens fulle navn (for- og etternavn). */
+    name: string;
+    /**Det aktive embetet til brukeren. */
+    embete: Embete;
+};
+export type Embete = {
+    /**Navnet på embetet. */
+    name: string;
+    /**Hvilken instans embetet er. */
+    type: EmbeteType;
+};
+export declare const TopBar: ({ user, userMenuItems, isNavigationOpen, onNavigationOpenChange, environmentBannerActive, }: TopBarProps) => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 export declare const Button: import("react").ForwardRefExoticComponent<Pick<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "onClick" | "onFocus" | "onBlur" | "type">, "id" | "className"> & {
     size?: import("./Button.types").ButtonSize | undefined;
-    label?: string | undefined;
+    label?: string | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
     purpose?: import("./Button.types").ButtonPurpose | undefined;
     iconPosition?: import("./Button.types").IconPosition | undefined;
     appearance?: import("./Button.types").ButtonAppearance | undefined;

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

@@ -4,7 +4,7 @@ declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<Pick<Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "type" | "onFocus" | "onBlur" | "onClick">, "className" | "id"> & {
         size?: import("./Button.types").ButtonSize | undefined;
-        label?: string | undefined;
+        label?: string | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
         purpose?: import("./Button.types").ButtonPurpose | undefined;
         iconPosition?: import("./Button.types").IconPosition | undefined;
         appearance?: import("./Button.types").ButtonAppearance | undefined;

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

@@ -1,4 +1,4 @@
-import { ButtonHTMLAttributes } from 'react';
+import { ButtonHTMLAttributes, ReactElement } from 'react';
 import { BaseComponentProps } from '@norges-domstoler/dds-core';
 import { SvgIcon } from '@norges-domstoler/dds-icons';
 export type ButtonPurpose = 'primary' | 'secondary' | 'danger';
@@ -10,7 +10,7 @@ export type ButtonProps = BaseComponentProps<HTMLButtonElement, {
     /**Størrelsen på knappen. */
     size?: ButtonSize;
     /**Tekst i knappen. */
-    label?: string;
+    label?: string | ReactElement;
     /**Bestemmer farger basert på formål. */
     purpose?: ButtonPurpose;
     /**	Posisjonen til ikonet i forhold til teksten.*/