@altinn/altinn-components 0.15.3 → 0.15.4

package/dist/components/Menu/MenuSearch.js

@@ -1,32 +1,32 @@
-import { jsxs as e, jsx as i } from "react/jsx-runtime";
-import { Icon as r } from "../Icon/Icon.js";
+import { jsxs as r, jsx as o } from "react/jsx-runtime";
+import { Icon as m } from "../Icon/Icon.js";
 import "../Icon/SvgIcon.js";
 import "../../index-L8X2o7IH.js";
 import "react";
-import { IconButton as m } from "../Button/IconButton.js";
+import { IconButton as a } from "../Button/IconButton.js";
 import "../RootProvider/RootProvider.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/MenuSearch.css';const l = "_field_15uca_1", p = "_icon_15uca_6", u = "_input_15uca_15", _ = "_clear_15uca_31", o = {
+import '../../assets/MenuSearch.css';const l = "_field_8g6tu_1", p = "_icon_8g6tu_6", u = "_input_8g6tu_15", _ = "_clear_8g6tu_31", t = {
   field: l,
   icon: p,
   input: u,
   clear: _
-}, v = ({ value: t, name: n, placeholder: s = "Søk", onChange: a, onClear: c }) => /* @__PURE__ */ e("div", { className: o.field, children: [
-  /* @__PURE__ */ i(
+}, v = ({ value: c, name: n, placeholder: s = "Søk", onChange: e, onClear: i }) => /* @__PURE__ */ r("div", { className: t.field, children: [
+  /* @__PURE__ */ o(
     "input",
     {
       type: "search",
-      value: t,
+      value: c,
       name: n,
       placeholder: s,
-      className: o.input,
-      onChange: a,
+      className: t.input,
+      onChange: e,
       autoComplete: "off"
     }
   ),
-  /* @__PURE__ */ i(r, { name: "magnifying-glass", className: o.icon }),
-  c && /* @__PURE__ */ i(m, { icon: "x-mark", variant: "solid", size: "custom", className: o.clear, onClick: c })
+  /* @__PURE__ */ o(m, { name: "magnifying-glass", className: t.icon }),
+  i && /* @__PURE__ */ o(a, { icon: "x-mark", variant: "solid", size: "custom", className: t.clear, onClick: i })
 ] });
 export {
   v as MenuSearch

package/dist/components/Meta/MetaItem.js

@@ -11,7 +11,7 @@ const n = ({
   icon: o,
   children: f,
   ...x
-}) => /* @__PURE__ */ e(s, { reverse: p, variant: r, size: t, ...x, children: /* @__PURE__ */ M(a, { loading: m, children: [
+}) => /* @__PURE__ */ e(a, { loading: m, children: /* @__PURE__ */ M(s, { reverse: p, variant: r, size: t, ...x, children: [
   !m && o && /* @__PURE__ */ e(i, { size: t, icon: o }),
   /* @__PURE__ */ e(I, { variant: r, size: t, children: f })
 ] }) });

package/dist/components/Meta/MetaTimestamp.js

@@ -10,7 +10,7 @@ const j = ({
   datetime: p,
   icon: o,
   children: a
-}) => /* @__PURE__ */ e(i, { as: "time", variant: r, datetime: p, size: t, children: /* @__PURE__ */ s(f, { loading: m, children: [
+}) => /* @__PURE__ */ e(f, { loading: m, children: /* @__PURE__ */ s(i, { as: "time", variant: r, datetime: p, size: t, children: [
   !m && o && /* @__PURE__ */ e(M, { size: t, icon: o }),
   /* @__PURE__ */ e(x, { variant: r, size: t, children: a })
 ] }) });

package/dist/components/Search/SearchField.js

@@ -4,7 +4,7 @@ import { c as I } from "../../index-L8X2o7IH.js";
 import { useRef as N } from "react";
 import { Icon as g } from "../Icon/Icon.js";
 import "../Icon/SvgIcon.js";
-import { IconButton as l } from "../Button/IconButton.js";
+import { IconButton as n } from "../Button/IconButton.js";
 import "../RootProvider/RootProvider.js";
 import "./AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
@@ -15,32 +15,32 @@ import '../../assets/SearchField.css';const C = "_field_1y3oc_1", j = "_icon_1y3
   dismiss: S,
   clear: T
 }, A = ({
-  className: m,
-  expanded: c,
+  className: l,
+  expanded: m,
   name: p = "q",
-  value: a,
+  value: t,
   placeholder: u = "Søk",
   onFocus: d,
   onBlur: f,
   onChange: _,
   onClear: y,
   onClose: x,
-  onEnter: o,
+  onEnter: c,
   tabIndex: h
 }) => {
-  const t = N(null), k = (e) => {
-    var r, n;
-    e.key === "Escape" && ((r = t.current) == null || r.blur()), e.key === "Enter" && ((n = t.current) == null || n.blur(), o == null || o());
+  const o = N(null), k = (e) => {
+    var a, r;
+    e.key === "Escape" && ((a = o.current) == null || a.blur()), e.key === "Enter" && ((r = o.current) == null || r.blur(), c == null || c());
   };
-  return /* @__PURE__ */ b("div", { className: I(s.field, m), "aria-expanded": c, children: [
+  return /* @__PURE__ */ b("div", { className: I(s.field, l), children: [
     /* @__PURE__ */ i(
       "input",
       {
-        ref: t,
+        ref: o,
         onFocus: d,
         onBlur: f,
         name: p,
-        value: a,
+        value: t,
         onChange: _,
         placeholder: u,
         className: s.input,
@@ -49,13 +49,12 @@ import '../../assets/SearchField.css';const C = "_field_1y3oc_1", j = "_icon_1y3
         "aria-haspopup": !0,
         autoComplete: "off",
         "aria-autocomplete": "list",
-        "aria-expanded": c,
         tabIndex: h ?? 0
       }
     ),
     /* @__PURE__ */ i(g, { name: "magnifying-glass", className: s.icon }),
-    a && /* @__PURE__ */ i(
-      l,
+    t && /* @__PURE__ */ i(
+      n,
       {
         icon: "x-mark",
         variant: "solid",
@@ -64,8 +63,8 @@ import '../../assets/SearchField.css';const C = "_field_1y3oc_1", j = "_icon_1y3
         onClick: y,
         dataTestId: "search-button-clear"
       }
-    ) || c && /* @__PURE__ */ i(
-      l,
+    ) || m && /* @__PURE__ */ i(
+      n,
       {
         icon: "x-mark",
         variant: "text",

package/dist/components/Search/SearchbarBase.js

@@ -1,17 +1,12 @@
-import { jsx as c } from "react/jsx-runtime";
-import { c as t } from "../../index-L8X2o7IH.js";
-import '../../assets/SearchbarBase.css';const o = "_searchbar_1jrvc_1", l = {
-  searchbar: o
-}, b = ({ className: a, children: r, expanded: e = !1, autocomplete: s = !1 }) => /* @__PURE__ */ c(
-  "div",
-  {
-    className: t(l.searchbar, a),
-    "aria-expanded": e,
-    "data-autocomplete": s,
-    "data-color": "neutral",
-    children: r
-  }
-);
+import { jsx as o } from "react/jsx-runtime";
+import { c as n } from "../../index-L8X2o7IH.js";
+import '../../assets/SearchbarBase.css';const b = "_searchbar_1qnvb_1", d = "_searchbarExpanded_1qnvb_14", a = {
+  searchbar: b,
+  searchbarExpanded: d
+}, p = ({ className: r, children: e, expanded: s = !1, autocomplete: c = !1 }) => {
+  const t = n(a.searchbar, r, s && a.searchbarExpanded);
+  return /* @__PURE__ */ o("div", { className: t, "data-autocomplete": c, "data-color": "neutral", children: e });
+};
 export {
-  b as SearchbarBase
+  p as SearchbarBase
 };

package/dist/components/Skeleton/Skeleton.js

@@ -1,9 +1,19 @@
 import { jsx as n } from "react/jsx-runtime";
 import { c as r } from "../../index-L8X2o7IH.js";
-import '../../assets/Skeleton.css';const f = "_skelaton_10sb8_1", l = "_fade_10sb8_1", c = {
-  skelaton: f,
-  fade: l
-}, k = ({ loading: t = !1, size: s, variant: e = "text", className: o, children: a }) => t ? /* @__PURE__ */ n("span", { className: r(c.skelaton, o), "data-size": s, "data-loading": t, "data-variant": e, children: a }) : a;
+import '../../assets/Skeleton.css';const d = "_skelaton_10sb8_1", f = "_fade_10sb8_1", l = {
+  skelaton: d,
+  fade: f
+}, _ = ({ loading: a = !1, size: s, variant: e = "text", className: o, children: t }) => a ? /* @__PURE__ */ n(
+  "span",
+  {
+    className: r(l.skelaton, o),
+    "data-size": s,
+    "data-loading": a,
+    "data-variant": e,
+    "aria-hidden": "true",
+    children: t
+  }
+) : t;
 export {
-  k as Skeleton
+  _ as Skeleton
 };

package/dist/components/Toolbar/ToolbarFilterBase.js

@@ -1,7 +1,12 @@
-import { jsx as a } from "react/jsx-runtime";
-import '../../assets/ToolbarFilterBase.css';const o = "_base_l7znv_1", r = {
-  base: o
-}, l = ({ expanded: s = !1, children: e }) => /* @__PURE__ */ a("div", { className: r.base, "aria-expanded": s, children: e });
+import { jsx as n } from "react/jsx-runtime";
+import { c as o } from "../../index-L8X2o7IH.js";
+import '../../assets/ToolbarFilterBase.css';const r = "_base_4n04w_1", d = "_expanded_4n04w_5", e = {
+  base: r,
+  expanded: d
+}, p = ({ expanded: s = !1, children: a }) => {
+  const t = o(e.base, s && e.expanded);
+  return /* @__PURE__ */ n("div", { className: t, children: a });
+};
 export {
-  l as ToolbarFilterBase
+  p as ToolbarFilterBase
 };

package/dist/components/Typography/Heading.js

@@ -3,7 +3,7 @@ import { c as s } from "../../index-L8X2o7IH.js";
 import { Skeleton as d } from "../Skeleton/Skeleton.js";
 import '../../assets/Heading.css';const r = "_heading_mt0g8_1", c = {
   heading: r
-}, f = ({ loading: t, as: a = "h2", size: i = "md", weight: n = "medium", className: o, children: m }) => /* @__PURE__ */ e(a, { className: s(c.heading, o), "data-size": i, "data-weight": n, children: /* @__PURE__ */ e(d, { loading: t, children: m }) });
+}, f = ({ loading: t, as: a = "h2", size: i = "md", weight: n = "medium", className: o, children: m }) => /* @__PURE__ */ e(d, { loading: t, children: /* @__PURE__ */ e(a, { className: s(c.heading, o), "data-size": i, "data-weight": n, children: m }) });
 export {
   f as Heading
 };

package/dist/types/lib/components/Dialog/DialogListItem.stories.d.ts

@@ -12,7 +12,13 @@ export declare const InboxStatuses: (args: DialogListItemProps) => import("react
 export declare const DraftAndSent: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
 export declare const ArchivedAndTrashed: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
 export declare const Statuses: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
-export declare const Loading: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
+declare const Loading: {
+    (args: DialogListItemProps): import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        tags: string[];
+    };
+};
+export { Loading };
 export declare const Variants: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
 export declare const DueAt: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;
 export declare const Attachments: (args: DialogListItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/Header/HeaderMenu.d.ts

@@ -4,4 +4,4 @@ export interface HeaderMenuProps {
     expanded?: boolean;
     children?: ReactNode;
 }
-export declare const HeaderMenu: ({ expanded, className, children }: HeaderMenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const HeaderMenu: ({ className, children }: HeaderMenuProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/List/ListItemBase.d.ts

@@ -6,6 +6,7 @@ export type ListItemShadow = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type ListItemColor = Color;
 export type ListItemTheme = 'transparent' | 'default' | 'subtle' | 'surface' | 'base';
 export interface ListItemBaseProps {
+    title?: string;
     interactive?: boolean;
     as?: ElementType;
     href?: string;
@@ -26,4 +27,4 @@ export interface ListItemBaseProps {
     expanded?: boolean;
     children?: ReactNode;
 }
-export declare const ListItemBase: ({ interactive, as, href, onClick, onKeyPress, tabIndex, size, variant, color, theme, shadow, loading, disabled, hidden, active, selected, expanded, className, children, }: ListItemBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ListItemBase: ({ title, interactive, as, href, onClick, onKeyPress, tabIndex, size, variant, color, theme, shadow, loading, disabled, hidden, active, selected, className, children, }: ListItemBaseProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/lib/components/List/ListItemLink.d.ts

@@ -14,4 +14,4 @@ export interface ListItemLinkProps {
     className?: string;
     children?: ReactNode;
 }
-export declare const ListItemLink: ({ interactive, size, as, loading, disabled, selected, href, onClick, onKeyPress, tabIndex, className, children, }: ListItemLinkProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ListItemLink: ({ interactive, size, as, loading, disabled, selected, href, onClick, onKeyPress, className, children, }: ListItemLinkProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -26,5 +26,5 @@ export interface MenuListItemProps {
     children?: ReactNode;
 }
 export declare const MenuBase: ({ as, color, theme, className, children }: MenuBaseProps) => import("react/jsx-runtime").JSX.Element;
-export declare const MenuList: ({ as, role, expanded, className, children }: MenuListProps) => import("react/jsx-runtime").JSX.Element;
-export declare const MenuListItem: ({ as, role, expanded, className, children, }: MenuListItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuList: ({ as, role, className, children }: MenuListProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuListItem: ({ as, role, className, children }: MenuListItemProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -23,4 +23,4 @@ export interface MenuItemBaseProps {
     linkIcon?: IconName;
     linkText?: string;
 }
-export declare const MenuItemBase: ({ as, color, theme, size, className, href, onClick, onKeyPress, tabIndex, hidden, disabled, active, selected, expanded, linkIcon, linkText, badge, children, }: MenuItemBaseProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuItemBase: ({ as, color, theme, size, className, href, onClick, onKeyPress, tabIndex, hidden, disabled, linkIcon, linkText, badge, children, }: MenuItemBaseProps) => import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@altinn/altinn-components",
-  "version": "0.15.3",
+  "version": "0.15.4",
   "main": "dist/index.js",
   "files": [
     "dist/",
@@ -28,11 +28,11 @@
   "devDependencies": {
     "@biomejs/biome": "1.9.4",
     "@chromatic-com/storybook": "^3.2.4",
-    "@storybook/addon-mdx-gfm": "^8.5.0",
     "@storybook/addon-a11y": "^8.5.0",
     "@storybook/addon-essentials": "^8.5.0",
     "@storybook/addon-interactions": "^8.5.0",
     "@storybook/addon-links": "^8.5.0",
+    "@storybook/addon-mdx-gfm": "^8.5.0",
     "@storybook/addon-themes": "^8.5.0",
     "@storybook/blocks": "^8.5.0",
     "@storybook/react": "^8.5.0",
@@ -43,6 +43,7 @@
     "@types/react-dom": "^18.3.5",
     "@vitejs/plugin-react-swc": "^3.7.2",
     "axe-core": "^4.10.2",
+    "axe-playwright": "^2.0.3",
     "glob": "^11.0.1",
     "lint-staged": "^15.4.1",
     "playwright": "^1.49.1",