@altinn/altinn-components 0.28.2 → 0.29.0

package/dist/components/Searchbar/Searchbar.js

@@ -2,10 +2,10 @@ import { jsxs as e, jsx as t } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
 import "../RootProvider/RootProvider.js";
-import { SearchbarBase as f } from "./SearchbarBase.js";
-import { SearchField as s } from "./SearchField.js";
+import { SearchbarBase as a } from "./SearchbarBase.js";
+import { SearchbarField as f } from "./SearchbarField.js";
 import "./AutocompleteBase.js";
-import { Autocomplete as a } from "./Autocomplete.js";
+import { Autocomplete as s } from "./Autocomplete.js";
 import "../Snackbar/useSnackbar.js";
 const B = ({
   className: i,
@@ -14,9 +14,9 @@ const B = ({
   onClose: m,
   tabIndex: p,
   ...c
-}) => /* @__PURE__ */ e(f, { className: i, expanded: o, autocomplete: !!r, children: [
-  /* @__PURE__ */ t(s, { ...c, expanded: o, onClose: m, tabIndex: p }),
-  r && /* @__PURE__ */ t(a, { ...r, expanded: o, onSelect: m })
+}) => /* @__PURE__ */ e(a, { className: i, expanded: o, autocomplete: !!r, children: [
+  /* @__PURE__ */ t(f, { ...c, expanded: o, onClose: m, tabIndex: p }),
+  r && /* @__PURE__ */ t(s, { ...r, expanded: o, onSelect: m })
 ] });
 export {
   B as Searchbar

package/dist/components/Searchbar/{SearchField.js → SearchbarField.js}

@@ -9,7 +9,7 @@ import "./AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
 import { S as N } from "../../MagnifyingGlass-3Ln1MufI.js";
 import { S as l } from "../../XMark-DIqxCTTQ.js";
-import '../../assets/SearchField.css';const v = "_field_ljqfn_1", T = "_icon_ljqfn_10", A = "_input_ljqfn_17", K = "_dismiss_ljqfn_41", M = "_clear_ljqfn_47", s = {
+import '../../assets/SearchbarField.css';const v = "_field_ljqfn_1", T = "_icon_ljqfn_10", A = "_input_ljqfn_17", K = "_dismiss_ljqfn_41", M = "_clear_ljqfn_47", s = {
   field: v,
   icon: T,
   input: A,
@@ -25,9 +25,9 @@ import '../../assets/SearchField.css';const v = "_field_ljqfn_1", T = "_icon_ljq
   clearButtonAltText: _ = "Clear search",
   onFocus: h,
   onBlur: x,
-  onChange: j,
-  onClear: y,
-  onClose: b,
+  onChange: b,
+  onClear: j,
+  onClose: y,
   onEnter: i,
   tabIndex: q
 }) => {
@@ -44,7 +44,7 @@ import '../../assets/SearchField.css';const v = "_field_ljqfn_1", T = "_icon_ljq
         onBlur: x,
         name: f,
         value: a,
-        onChange: j,
+        onChange: b,
         placeholder: u,
         className: s.input,
         onKeyUp: S,
@@ -64,7 +64,7 @@ import '../../assets/SearchField.css';const v = "_field_ljqfn_1", T = "_icon_ljq
         variant: "solid",
         size: "custom",
         className: s.clear,
-        onClick: y,
+        onClick: j,
         dataTestId: "search-button-clear",
         iconAltText: _
       }
@@ -74,7 +74,7 @@ import '../../assets/SearchField.css';const v = "_field_ljqfn_1", T = "_icon_ljq
         icon: l,
         variant: "text",
         className: s.dismiss,
-        onClick: b,
+        onClick: y,
         dataTestId: "search-button-close",
         iconAltText: d
       }
@@ -82,5 +82,5 @@ import '../../assets/SearchField.css';const v = "_field_ljqfn_1", T = "_icon_ljq
   ] });
 };
 export {
-  H as SearchField
+  H as SearchbarField
 };

package/dist/components/Searchbar/index.js

@@ -1,23 +1,23 @@
 import { Searchbar as r } from "./Searchbar.js";
 import { SearchbarBase as m } from "./SearchbarBase.js";
-import { SearchField as f } from "./SearchField.js";
+import { SearchbarField as f } from "./SearchbarField.js";
 import { AutocompleteBase as a } from "./AutocompleteBase.js";
 import { AutocompleteGroup as u } from "./AutocompleteGroup.js";
 import { Autocomplete as s } from "./Autocomplete.js";
-import { AutocompleteItem as A } from "./AutocompleteItem.js";
-import { ScopeListItem as b } from "./ScopeListItem.js";
+import { AutocompleteItem as b } from "./AutocompleteItem.js";
+import { ScopeListItem as I } from "./ScopeListItem.js";
 import { SuggestListItem as i } from "./SuggestListItem.js";
 import { QueryItem as g, QueryLabel as y } from "./QueryLabel.js";
 export {
   s as Autocomplete,
   a as AutocompleteBase,
   u as AutocompleteGroup,
-  A as AutocompleteItem,
+  b as AutocompleteItem,
   g as QueryItem,
   y as QueryLabel,
-  b as ScopeListItem,
-  f as SearchField,
+  I as ScopeListItem,
   r as Searchbar,
   m as SearchbarBase,
+  f as SearchbarField,
   i as SuggestListItem
 };

package/dist/components/Settings/SettingsItem.js

@@ -1,37 +1,34 @@
-import { jsxs as s, jsx as e, Fragment as o } from "react/jsx-runtime";
+import { jsxs as L, jsx as i } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
 import "../RootProvider/RootProvider.js";
-import { ListItemBase as g } from "../List/ListItemBase.js";
-import { ListItemHeader as x } from "../List/ListItemHeader.js";
-import { ListItemLabel as _ } from "../List/ListItemLabel.js";
-import { Heading as i } from "../Typography/Heading.js";
+import { ListItemBase as _ } from "../List/ListItemBase.js";
+import { ListItemHeader as f } from "../List/ListItemHeader.js";
+import { ListItemLabel as h } from "../List/ListItemLabel.js";
+import { getAriaLabelFromTitle as j } from "../Menu/MenuItemLabel.js";
 import "../Searchbar/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/SettingsItem.css';const f = "_item_jqpsx_1", L = "_label_jqpsx_12", t = {
-  item: f,
-  label: L
-}, F = ({
-  color: n,
-  size: h,
-  expanded: a,
-  icon: c,
-  label: p,
-  title: r,
-  value: m,
-  description: l,
-  children: d,
-  ...b
-}) => /* @__PURE__ */ s(g, { className: t.item, color: n, size: h, expanded: a, children: [
-  /* @__PURE__ */ e(x, { ariaLabel: r, ...b, className: t.header, icon: c, children: /* @__PURE__ */ e(_, { className: t.label, children: r && m ? /* @__PURE__ */ s(o, { children: [
-    /* @__PURE__ */ e(i, { as: "h3", size: "xs", variant: "subtle", weight: "normal", children: r }),
-    /* @__PURE__ */ e(i, { weight: "normal", size: "sm", children: m })
-  ] }) : r ? /* @__PURE__ */ s(o, { children: [
-    /* @__PURE__ */ e(i, { weight: "normal", size: "sm", children: r || m }),
-    l && /* @__PURE__ */ e(i, { as: "h3", size: "xs", variant: "subtle", weight: "normal", children: l })
-  ] }) : p }) }),
-  a && d
-] });
+import '../../assets/SettingsItem.css';const x = "_item_jqpsx_1", I = "_label_jqpsx_12", t = {
+  item: x,
+  label: I
+}, S = ({
+  color: s,
+  size: a,
+  expanded: e,
+  icon: o,
+  label: l,
+  title: m,
+  value: c,
+  description: p,
+  children: n,
+  ...r
+}) => {
+  const b = r.ariaLabel || j(m);
+  return /* @__PURE__ */ L(_, { className: t.item, color: s, size: a, expanded: e, children: [
+    /* @__PURE__ */ i(f, { ...r, ariaLabel: b, className: t.header, icon: o, children: /* @__PURE__ */ i(h, { className: t.label, title: m, value: c, description: p, children: l }) }),
+    e && n
+  ] });
+};
 export {
-  F as SettingsItem
+  S as SettingsItem
 };

package/dist/components/Toolbar/ToolbarAccountMenu.js

@@ -1,9 +1,9 @@
 import { jsxs as f, jsx as p } from "react/jsx-runtime";
 import { createElement as n } from "react";
 import "../../index-L8X2o7IH.js";
-import { useRootContext as x } from "../RootProvider/RootProvider.js";
-import { DrawerOrDropdown as T } from "../Dropdown/DrawerOrDropdown.js";
-import { AccountMenu as b } from "../GlobalMenu/AccountMenu.js";
+import { AccountMenu as x } from "../Account/AccountMenu.js";
+import { useRootContext as T } from "../RootProvider/RootProvider.js";
+import { DrawerOrDropdown as b } from "../Dropdown/DrawerOrDropdown.js";
 import "../Searchbar/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
 import { ToolbarButton as g } from "./ToolbarButton.js";
@@ -14,11 +14,11 @@ const v = ({
   onSelectAccount: r,
   ...l
 }) => {
-  const { currentId: m, toggleId: s, closeAll: t } = x(), a = () => s(e), i = m === e;
+  const { currentId: m, toggleId: s, closeAll: t } = T(), a = () => s(e), i = m === e;
   return /* @__PURE__ */ f(h, { expanded: i, children: [
     /* @__PURE__ */ p(g, { type: "switch", onToggle: a, active: !!o, children: o == null ? void 0 : o.name }),
-    /* @__PURE__ */ p(T, { open: i, drawerTitle: "Endre konto", onClose: t, children: /* @__PURE__ */ n(
-      b,
+    /* @__PURE__ */ p(b, { open: i, drawerTitle: "Endre konto", onClose: t, children: /* @__PURE__ */ n(
+      x,
       {
         ...l,
         key: m,

package/dist/components/Toolbar/ToolbarSearch.js

@@ -1,50 +1,29 @@
-import { jsxs as a, jsx as i } from "react/jsx-runtime";
-import { Icon as m } from "../Icon/Icon.js";
+import { jsx as p } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
-import { IconButton as p } from "../Button/IconButton.js";
 import "../RootProvider/RootProvider.js";
 import "../Searchbar/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import { S as l } from "../../MagnifyingGlass-3Ln1MufI.js";
-import { S as _ } from "../../XMark-DIqxCTTQ.js";
-import '../../assets/ToolbarSearch.css';const u = "_field_3uyps_1", f = "_icon_3uyps_5", d = "_input_3uyps_14", y = "_clear_3uyps_31", o = {
-  field: u,
-  icon: f,
-  input: d,
-  clear: y
-}, T = ({
-  value: s,
-  name: r,
-  placeholder: c = "Search",
-  clearButtonAltText: n = "Clear search",
-  onChange: e,
-  onClear: t
-}) => /* @__PURE__ */ a("div", { className: o.field, children: [
-  /* @__PURE__ */ i(
-    "input",
-    {
-      type: "search",
-      value: s,
-      name: r,
-      placeholder: c,
-      className: o.input,
-      onChange: e
-    }
-  ),
-  /* @__PURE__ */ i(m, { svgElement: l, className: o.icon }),
-  t && !!s && /* @__PURE__ */ i(
-    p,
-    {
-      icon: _,
-      variant: "solid",
-      size: "custom",
-      className: o.clear,
-      onClick: t,
-      iconAltText: n
-    }
-  )
-] });
+import { SearchField as a } from "../Forms/SearchField.js";
+const n = ({
+  value: r,
+  name: o,
+  placeholder: t = "Search",
+  clearButtonAltText: e = "Clear search",
+  onChange: i,
+  onClear: m
+}) => /* @__PURE__ */ p(
+  a,
+  {
+    size: "xs",
+    value: r,
+    name: o,
+    placeholder: t,
+    clearButtonAltText: e,
+    onChange: i,
+    onClear: m
+  }
+);
 export {
-  T as ToolbarSearch
+  n as ToolbarSearch
 };

package/dist/components/Typography/Heading.js

@@ -1,16 +1,16 @@
-import { jsx as t } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import { c as h } from "../../index-L8X2o7IH.js";
 import "react";
 import { Skeleton as p } from "../Skeleton/Skeleton.js";
 import "../RootProvider/RootProvider.js";
 import "../Searchbar/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/Heading.css';const l = "_heading_11tuc_1", x = {
+import '../../assets/Heading.css';const l = "_heading_16r67_1", x = {
   heading: l
 }, y = ({
-  loading: a,
+  loading: o,
   as: i = "h2",
-  size: o,
+  size: t,
   leading: r = "tight",
   weight: e = "medium",
   color: d,
@@ -19,16 +19,16 @@ import '../../assets/Heading.css';const l = "_heading_11tuc_1", x = {
   className: s,
   style: c,
   children: g
-}) => /* @__PURE__ */ t(p, { loading: a, children: /* @__PURE__ */ t(
+}) => /* @__PURE__ */ a(p, { loading: o, children: /* @__PURE__ */ a(
   i,
   {
     className: h(x.heading, s),
     style: c,
-    "data-size": o,
+    "data-size": t,
     "data-leading": r,
     "data-weight": e,
     "data-color": d,
-    "data-variant": m,
+    "data-variant": t === "xxs" && "default" || m,
     "data-max-rows": n,
     children: g
   }