@altinn/altinn-components 0.38.2 → 0.38.4

package/dist/components/Menu/MenuBase.js

@@ -1,19 +1,50 @@
-import { jsx as a } from "react/jsx-runtime";
-import { c } from "../../index-L8X2o7IH.js";
-import '../../assets/MenuBase.css';const r = "_menu_sxyub_1", l = "_list_sxyub_16", p = "_item_sxyub_22", i = {
-  menu: r,
-  list: l,
-  item: p
-}, C = ({ as: t = "nav", color: n, theme: e, className: o, children: s }) => /* @__PURE__ */ a(t, { className: c(i.menu, o), "data-color": n, "data-theme": e, children: s }), d = ({ as: t = "ul", role: n = "group", className: e, children: o, ref: s, onMouseEnter: m }) => /* @__PURE__ */ a(t, { className: c(i.list, e), role: n, ref: s, onMouseEnter: m, children: o }), y = ({
+import { jsx as c } from "react/jsx-runtime";
+import { c as i } from "../../index-L8X2o7IH.js";
+import '../../assets/MenuBase.css';const l = "_menu_sxyub_1", p = "_list_sxyub_16", _ = "_item_sxyub_22", u = {
+  menu: l,
+  list: p,
+  item: _
+}, y = ({ as: t = "nav", color: n, theme: e, className: o, children: s }) => /* @__PURE__ */ c(t, { className: i(u.menu, o), "data-color": n, "data-theme": e, children: s }), b = ({
+  as: t = "ul",
+  role: n = "group",
+  className: e,
+  children: o,
+  ref: s,
+  onMouseEnter: m,
+  onMouseLeave: a
+}) => /* @__PURE__ */ c(
+  t,
+  {
+    className: i(u.list, e),
+    role: n,
+    ref: s,
+    onMouseEnter: m,
+    onMouseLeave: a,
+    children: o
+  }
+), M = ({
   as: t = "li",
   role: n = "presentation",
   className: e,
   children: o,
   style: s,
-  dataIndex: m
-}) => /* @__PURE__ */ a(t, { className: c(i.item, e), role: n, style: s, "data-index": m, children: o });
+  dataIndex: m,
+  onMouseEnter: a,
+  onMouseLeave: r
+}) => /* @__PURE__ */ c(
+  t,
+  {
+    className: i(u.item, e),
+    role: n,
+    style: s,
+    "data-index": m,
+    onMouseEnter: a,
+    onMouseLeave: r,
+    children: o
+  }
+);
 export {
-  C as MenuBase,
-  d as MenuList,
-  y as MenuListItem
+  y as MenuBase,
+  b as MenuList,
+  M as MenuListItem
 };

package/dist/components/Menu/MenuItems.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsxs as c, jsx as d, Fragment as K } from "react/jsx-runtime";
+import { jsxs as m, jsx as d, Fragment as K } from "react/jsx-runtime";
 import { useRef as R, Fragment as S } from "react";
 import "../../index-L8X2o7IH.js";
 import { useMenu as _ } from "../../hooks/useMenu.js";
@@ -7,44 +7,44 @@ import "../RootProvider/RootProvider.js";
 import { MenuItem as $ } from "./MenuItem.js";
 import { MenuSearch as q } from "./MenuSearch.js";
 import { MenuHeader as w } from "./MenuHeader.js";
-import { MenuList as A, MenuListItem as i } from "./MenuBase.js";
+import { MenuList as C, MenuListItem as i } from "./MenuBase.js";
 import "../Snackbar/useSnackbar.js";
-const C = ({
+const D = ({
   level: f = 0,
   expanded: F,
   search: h,
-  items: j,
+  items: L,
   groups: r = {},
   defaultItemSize: x,
   defaultItemColor: M,
   defaultItemTheme: I,
-  defaultIconTheme: b,
-  as: z,
-  keyboardEvents: E,
-  onSelect: L = () => {
+  defaultIconTheme: o,
+  as: j,
+  keyboardEvents: z,
+  onSelect: E = () => {
   }
 }) => {
-  const o = R(null), { menu: v } = _({
-    items: j,
+  const v = R(null), { menu: b, setActiveIndex: T } = _({
+    items: L,
     groups: r,
     groupByKey: "groupId",
-    keyboardEvents: E ?? !1,
-    onSelect: L,
-    ref: o
+    keyboardEvents: z ?? !1,
+    onSelect: E,
+    ref: v
   });
-  return /* @__PURE__ */ c(A, { expanded: F, as: z, ref: o, children: [
+  return /* @__PURE__ */ m(C, { expanded: F, as: j, ref: v, children: [
     h && /* @__PURE__ */ d(q, { ...h }),
-    v.map((t, l) => {
-      const n = (t == null ? void 0 : t.props) || {}, { title: y, divider: T = !0 } = n, k = v[l + 1];
-      return /* @__PURE__ */ c(S, { children: [
-        (f > 0 || l) && T ? /* @__PURE__ */ d(i, { role: "separator" }) : "",
+    b.map((t, s) => {
+      const n = (t == null ? void 0 : t.props) || {}, { title: y, divider: k = !0 } = n, A = b[s + 1];
+      return /* @__PURE__ */ m(S, { children: [
+        (f > 0 || s) && k ? /* @__PURE__ */ d(i, { role: "separator" }) : "",
         y && /* @__PURE__ */ d(i, { children: /* @__PURE__ */ d(w, { title: y }) }),
-        t == null ? void 0 : t.items.filter((m) => {
+        t == null ? void 0 : t.items.filter((c) => {
           var a;
-          return !((a = m.props) != null && a.hidden);
-        }).map((m, a) => {
-          const { active: B, onMouseEnter: G } = m, { groupId: D, ...e } = m.props || {}, { expanded: s } = e, H = t == null ? void 0 : t.items[a + 1];
-          return /* @__PURE__ */ c(i, { expanded: s, children: [
+          return !((a = c.props) != null && a.hidden);
+        }).map((c, a) => {
+          const { active: B, onMouseEnter: G } = c, { groupId: J, ...e } = c.props || {}, { expanded: l } = e, H = t == null ? void 0 : t.items[a + 1];
+          return /* @__PURE__ */ m(i, { expanded: l, onMouseLeave: () => T(-1), children: [
             /* @__PURE__ */ d(
               $,
               {
@@ -52,34 +52,34 @@ const C = ({
                 size: (e == null ? void 0 : e.size) || (n == null ? void 0 : n.defaultItemSize) || x,
                 color: (e == null ? void 0 : e.color) || (n == null ? void 0 : n.defaultItemColor) || M,
                 theme: (e == null ? void 0 : e.theme) || (n == null ? void 0 : n.defaultItemTheme) || I,
-                iconTheme: (e == null ? void 0 : e.iconTheme) || (n == null ? void 0 : n.defaultIconTheme) || b,
+                iconTheme: (e == null ? void 0 : e.iconTheme) || (n == null ? void 0 : n.defaultIconTheme) || o,
                 active: B,
                 tabIndex: e != null && e.disabled ? -1 : e.tabIndex ?? 0,
                 onMouseEnter: G
               }
             ),
-            s && (e == null ? void 0 : e.items) && /* @__PURE__ */ c(K, { children: [
+            l && (e == null ? void 0 : e.items) && /* @__PURE__ */ m(K, { children: [
               /* @__PURE__ */ d(
-                C,
+                D,
                 {
-                  expanded: s,
+                  expanded: l,
                   level: f + 1,
                   items: e == null ? void 0 : e.items,
                   groups: r,
                   defaultItemSize: x,
                   defaultItemColor: M,
                   defaultItemTheme: I,
-                  defaultIconTheme: b
+                  defaultIconTheme: o
                 }
               ),
-              (k || H) && /* @__PURE__ */ d(i, { role: "separator", as: "div" })
+              (A || H) && /* @__PURE__ */ d(i, { role: "separator", as: "div" })
             ] })
           ] }, a);
         })
-      ] }, l);
+      ] }, s);
     })
   ] });
 };
 export {
-  C as MenuItems
+  D as MenuItems
 };

package/dist/components/Typography/Heading.js

@@ -1,45 +1,43 @@
 "use client";
-import { jsx as e } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import { c as x } from "../../index-L8X2o7IH.js";
 import "react";
 import { Skeleton as f } from "../Skeleton/Skeleton.js";
 import "../RootProvider/RootProvider.js";
 import { useHighlightedText as u } from "./useHighlightedText.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/Heading.css';const H = "_heading_1dyne_1", N = {
+import '../../assets/Heading.css';const H = "_heading_1dyne_1", _ = {
   heading: H
-}, L = ({
-  loading: i,
-  highlightWords: n = [],
-  as: r = "h2",
+}, T = ({
+  loading: e,
+  highlightWords: i = [],
+  as: o = "h2",
   size: t,
-  leading: d = "tight",
-  weight: s = "medium",
-  color: m,
-  variant: c,
-  maxRows: l,
-  className: g,
+  leading: n = "tight",
+  weight: r = "medium",
+  color: d,
+  variant: m,
+  maxRows: s,
+  className: c,
   style: h,
-  children: o
+  children: g
 }) => {
-  const p = r;
-  console.log("CHILDREN", o);
-  const a = u(o, n || []);
-  return console.log("CHILDREN", a), /* @__PURE__ */ e(f, { loading: i, children: /* @__PURE__ */ e(
-    p,
+  const l = o, p = u(g, i || []);
+  return /* @__PURE__ */ a(f, { loading: e, children: /* @__PURE__ */ a(
+    l,
     {
-      className: x(N.heading, g),
+      className: x(_.heading, c),
       style: h,
       "data-size": t,
-      "data-leading": d,
-      "data-weight": s,
-      "data-color": m,
-      "data-variant": t === "xxs" && "default" || c,
-      "data-max-rows": l,
-      children: a
+      "data-leading": n,
+      "data-weight": r,
+      "data-color": d,
+      "data-variant": t === "xxs" && "default" || m,
+      "data-max-rows": s,
+      children: p
     }
   ) });
 };
 export {
-  L as Heading
+  T as Heading
 };

package/dist/types/lib/components/Menu/MenuBase.d.ts

@@ -19,6 +19,7 @@ export interface MenuListProps {
     children?: ReactNode;
     ref?: React.Ref<HTMLUListElement>;
     onMouseEnter?: MouseEventHandler;
+    onMouseLeave?: MouseEventHandler;
 }
 export interface MenuListItemProps {
     as?: ElementType;
@@ -28,7 +29,9 @@ export interface MenuListItemProps {
     children?: ReactNode;
     style?: React.CSSProperties;
     dataIndex?: number;
+    onMouseEnter?: MouseEventHandler;
+    onMouseLeave?: MouseEventHandler;
 }
 export declare const MenuBase: ({ as, color, theme, className, children }: MenuBaseProps) => import("react/jsx-runtime").JSX.Element;
-export declare const MenuList: ({ as, role, className, children, ref, onMouseEnter }: MenuListProps) => import("react/jsx-runtime").JSX.Element;
-export declare const MenuListItem: ({ as, role, className, children, style, dataIndex, }: MenuListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuList: ({ as, role, className, children, ref, onMouseEnter, onMouseLeave, }: MenuListProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuListItem: ({ as, role, className, children, style, dataIndex, onMouseEnter, onMouseLeave, }: MenuListItemProps) => import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@altinn/altinn-components",
-  "version": "0.38.2",
+  "version": "0.38.4",
   "main": "dist/index.js",
   "files": [
     "dist/",