@norges-domstoler/dds-components 0.0.0-dev-20240822123852 → 0.0.0-dev-20240827073649

package/dist/index.d.mts

@@ -1895,17 +1895,17 @@ declare const InputMessage: react.ForwardRefExoticComponent<Pick<react.HTMLAttri
 declare const renderInputMessage: (tip?: string, tipId?: string, errorMessage?: string, errorMessageId?: string) => react_jsx_runtime.JSX.Element;
 
 type NavigationLinkProps = {
+    children: ReactNode;
     href: string;
-    title: string;
 } & AnchorHTMLAttributes<HTMLAnchorElement>;
 type ContextMenuElementProps = {
-    title: string;
+    children: ReactNode;
     href?: string;
     icon?: SvgIcon;
     onClick?: () => void;
 } & (AnchorHTMLAttributes<HTMLAnchorElement> | ButtonHTMLAttributes<HTMLButtonElement>);
 interface InternaHeaderUserProps {
-    name: string;
+    children: ReactNode;
     href?: string;
 }
 type InternalHeaderProps = BaseComponentProps<HTMLDivElement, {
@@ -1918,12 +1918,12 @@ type InternalHeaderProps = BaseComponentProps<HTMLDivElement, {
     /**Spesifiserer ved hvilket brekkpunkt og nedover versjonen for små skjermer skal vises; den justerer på spacing og legger navigasjonen i kontekstmenyen. */
     smallScreenBreakpoint?: ScreenSizeLiteral;
     /**Info om brukeren. Dukker opp som punkt på toppen av kontekstmenyen med tekst oppgitt i name. Blir en lenke hvis href er oppgitt. */
-    userProps?: InternaHeaderUserProps;
+    user?: InternaHeaderUserProps;
     /**Lenker som skal vises i navigasjonsmenyen. */
-    navigationElements?: Array<NavigationLinkProps>;
+    navItems?: Array<NavigationLinkProps>;
     /**Lenker eller knapper som skal vises i kontekstmenyen. Støtter ikon i tillegg til tekst. */
-    contextMenuElements?: Array<ContextMenuElementProps>;
-    /**URL til siden i navigasjonen brukeren er på. Gir highlight til navigasjonselementet i navigationElements med samme URL. */
+    contextMenuItems?: Array<ContextMenuElementProps>;
+    /**URL til siden i navigasjonen brukeren er på. Gir highlight til navigasjonselementet i navItems med samme URL. */
     currentPageHref?: string;
     /**Ekstra logikk som kjøres når currentPage endres. */
     onCurrentPageChange?: () => void;
@@ -2078,7 +2078,7 @@ declare const OverflowMenu: react.ForwardRefExoticComponent<Pick<react.HTMLAttri
 } & react.RefAttributes<HTMLDivElement>>;
 
 interface OverflowMenuListItemBaseProps {
-    /**Ikon som vises ved teksten. */
+    /**Ikon som vises ved teksten. **OBS!** Settes i tillegg til `children` for riktig layout. */
     icon?: SvgIcon;
 }
 type OverflowMenuButtonProps = OverflowMenuListItemBaseProps & ButtonHTMLAttributes<HTMLButtonElement>;

package/dist/index.d.ts

@@ -1895,17 +1895,17 @@ declare const InputMessage: react.ForwardRefExoticComponent<Pick<react.HTMLAttri
 declare const renderInputMessage: (tip?: string, tipId?: string, errorMessage?: string, errorMessageId?: string) => react_jsx_runtime.JSX.Element;
 
 type NavigationLinkProps = {
+    children: ReactNode;
     href: string;
-    title: string;
 } & AnchorHTMLAttributes<HTMLAnchorElement>;
 type ContextMenuElementProps = {
-    title: string;
+    children: ReactNode;
     href?: string;
     icon?: SvgIcon;
     onClick?: () => void;
 } & (AnchorHTMLAttributes<HTMLAnchorElement> | ButtonHTMLAttributes<HTMLButtonElement>);
 interface InternaHeaderUserProps {
-    name: string;
+    children: ReactNode;
     href?: string;
 }
 type InternalHeaderProps = BaseComponentProps<HTMLDivElement, {
@@ -1918,12 +1918,12 @@ type InternalHeaderProps = BaseComponentProps<HTMLDivElement, {
     /**Spesifiserer ved hvilket brekkpunkt og nedover versjonen for små skjermer skal vises; den justerer på spacing og legger navigasjonen i kontekstmenyen. */
     smallScreenBreakpoint?: ScreenSizeLiteral;
     /**Info om brukeren. Dukker opp som punkt på toppen av kontekstmenyen med tekst oppgitt i name. Blir en lenke hvis href er oppgitt. */
-    userProps?: InternaHeaderUserProps;
+    user?: InternaHeaderUserProps;
     /**Lenker som skal vises i navigasjonsmenyen. */
-    navigationElements?: Array<NavigationLinkProps>;
+    navItems?: Array<NavigationLinkProps>;
     /**Lenker eller knapper som skal vises i kontekstmenyen. Støtter ikon i tillegg til tekst. */
-    contextMenuElements?: Array<ContextMenuElementProps>;
-    /**URL til siden i navigasjonen brukeren er på. Gir highlight til navigasjonselementet i navigationElements med samme URL. */
+    contextMenuItems?: Array<ContextMenuElementProps>;
+    /**URL til siden i navigasjonen brukeren er på. Gir highlight til navigasjonselementet i navItems med samme URL. */
     currentPageHref?: string;
     /**Ekstra logikk som kjøres når currentPage endres. */
     onCurrentPageChange?: () => void;
@@ -2078,7 +2078,7 @@ declare const OverflowMenu: react.ForwardRefExoticComponent<Pick<react.HTMLAttri
 } & react.RefAttributes<HTMLDivElement>>;
 
 interface OverflowMenuListItemBaseProps {
-    /**Ikon som vises ved teksten. */
+    /**Ikon som vises ved teksten. **OBS!** Settes i tillegg til `children` for riktig layout. */
     icon?: SvgIcon;
 }
 type OverflowMenuButtonProps = OverflowMenuListItemBaseProps & ButtonHTMLAttributes<HTMLButtonElement>;

package/dist/index.js

@@ -3246,7 +3246,7 @@ var isPropValid = /* @__PURE__ */ memoize(
   /* Z+1 */
 );
 
-// ../../node_modules/.pnpm/styled-components@6.1.12_react-dom@18.3.1_react@18.3.1/node_modules/styled-components/dist/styled-components.esm.js
+// ../../node_modules/.pnpm/styled-components@6.1.12_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/styled-components/dist/styled-components.esm.js
 var import_react23 = __toESM(require("react"));
 var import_shallowequal = __toESM(require_shallowequal());
 
@@ -3842,7 +3842,7 @@ var unitlessKeys = {
   strokeWidth: 1
 };
 
-// ../../node_modules/.pnpm/styled-components@6.1.12_react-dom@18.3.1_react@18.3.1/node_modules/styled-components/dist/styled-components.esm.js
+// ../../node_modules/.pnpm/styled-components@6.1.12_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/styled-components/dist/styled-components.esm.js
 var f = "undefined" != typeof process && void 0 !== process.env && (process.env.REACT_APP_SC_ATTR || process.env.SC_ATTR) || "data-styled";
 var m = "active";
 var y = "data-styled-version";
@@ -8663,7 +8663,7 @@ var InternalHeader_default = {
 // src/components/InternalHeader/NavigationItem.tsx
 var import_react89 = require("react");
 var import_jsx_runtime248 = require("react/jsx-runtime");
-var NavigationItem = (0, import_react89.forwardRef)(({ title, isCurrent, ...rest }, ref) => {
+var NavigationItem = (0, import_react89.forwardRef)(({ isCurrent, ...rest }, ref) => {
   return /* @__PURE__ */ (0, import_jsx_runtime248.jsx)(
     "a",
     {
@@ -8675,8 +8675,7 @@ var NavigationItem = (0, import_react89.forwardRef)(({ title, isCurrent, ...rest
         isCurrent && InternalHeader_default["nav-list__item__link--active"],
         typographyStyles_default["body-sans-02"],
         focusable
-      ),
-      children: title
+      )
     }
   );
 });
@@ -8689,10 +8688,10 @@ var InternalHeader = (props) => {
     applicationName,
     applicationHref,
     smallScreenBreakpoint,
-    navigationElements,
-    contextMenuElements,
+    navItems,
+    contextMenuItems,
     currentPageHref,
-    userProps,
+    user,
     onCurrentPageChange,
     id,
     className,
@@ -8712,8 +8711,8 @@ var InternalHeader = (props) => {
     setContextMenuIsClosed(!contextMenuIsClosed);
   };
   const onOveflowMenuClose = () => setContextMenuIsClosed(true);
-  const hasNavigationElements = !!navigationElements && navigationElements.length > 0;
-  const hasContextMenuElements = !!contextMenuElements && contextMenuElements.length > 0;
+  const hasNavigationElements = !!navItems && navItems.length > 0;
+  const hasContextMenuElements = !!contextMenuItems && contextMenuItems.length > 0;
   const hasSmallScreenBreakpoint = !!smallScreenBreakpoint;
   const hasNavInContextMenu = hasSmallScreenBreakpoint && hasNavigationElements;
   const navigation = hasNavigationElements ? /* @__PURE__ */ (0, import_jsx_runtime249.jsx)("nav", { "aria-label": "sidenavigasjon", children: /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
@@ -8724,7 +8723,7 @@ var InternalHeader = (props) => {
         hasSmallScreenBreakpoint && InternalHeader_default[`nav-list--small-screen-${smallScreenBreakpoint}`],
         utilStyles_default["remove-list-styling"]
       ),
-      children: navigationElements.map((item, index) => {
+      children: navItems.map((item, index) => {
         const { href, ...rest2 } = item;
         const isCurrent = href === currentPage;
         return /* @__PURE__ */ (0, import_jsx_runtime249.jsx)("li", { className: InternalHeader_default["nav-list__item"], children: /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
@@ -8739,8 +8738,8 @@ var InternalHeader = (props) => {
       })
     }
   ) }) : null;
-  const hasContextMenu = hasContextMenuElements || !!userProps || hasNavInContextMenu;
-  const hasContextMenuLargeScreen = hasContextMenuElements || !!userProps;
+  const hasContextMenu = hasContextMenuElements || !!user || hasNavInContextMenu;
+  const hasContextMenuLargeScreen = hasContextMenuElements || !!user;
   return /* @__PURE__ */ (0, import_jsx_runtime249.jsxs)(
     "div",
     {
@@ -8797,7 +8796,7 @@ var InternalHeader = (props) => {
                   anchorRef: buttonRef,
                   className: InternalHeader_default["context-menu"],
                   children: [
-                    userProps && /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuList, { children: userProps.href ? /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuLink, { icon: PersonIcon, href: userProps.href, children: userProps.name }) : /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuSpan, { icon: PersonIcon, children: userProps.name }) }),
+                    user && /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuList, { children: user.href ? /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuLink, { icon: PersonIcon, ...user }) : /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuSpan, { icon: PersonIcon, ...user }) }),
                     hasNavInContextMenu && /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
                       "nav",
                       {
@@ -8806,7 +8805,7 @@ var InternalHeader = (props) => {
                           InternalHeader_default["nav--in-menu--small-screen"],
                           InternalHeader_default[`nav--in-menu--small-screen-${smallScreenBreakpoint}`]
                         ),
-                        children: /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuList, { children: navigationElements.map((item) => /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuLink, { ...item, children: item.title })) })
+                        children: /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuList, { children: navItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuLink, { ...item })) })
                       }
                     ),
                     hasNavInContextMenu && hasContextMenuElements && /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
@@ -8818,9 +8817,13 @@ var InternalHeader = (props) => {
                         )
                       }
                     ),
-                    hasContextMenuElements && /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuList, { children: contextMenuElements.map((item) => {
-                      const { title } = item;
-                      return item.href ? /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuLink, { ...item, children: title }) : /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuButton, { ...item, children: title });
+                    hasContextMenuElements && /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuList, { children: contextMenuItems.map((item) => {
+                      return item.href ? /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(OverflowMenuLink, { ...item }) : /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
+                        OverflowMenuButton,
+                        {
+                          ...item
+                        }
+                      );
                     }) })
                   ]
                 }