@altinn/altinn-components 0.52.6 → 0.53.0

package/dist/components/Searchbar/SearchbarField.js

@@ -1,52 +1,52 @@
 "use client";
-import { jsxs as S, jsx as t } from "react/jsx-runtime";
-import { c as g } from "../../index-p1eeF8LQ.js";
-import { useRef as I } from "react";
-import { Icon as N } from "../Icon/Icon.js";
-import { IconButton as r } from "../Button/IconButton.js";
+import { jsxs as k, jsx as e } from "react/jsx-runtime";
+import { c as S } from "../../index-p1eeF8LQ.js";
+import { useRef as N } from "react";
+import { Icon as v } from "../Icon/Icon.js";
+import { Button as o } from "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import { S as v } from "../../MagnifyingGlass-bwVhw07z.js";
-import { S as c } from "../../XMark-tKk6aExO.js";
-import '../../assets/SearchbarField.css';const T = "_field_uxhly_1", z = "_icon_uxhly_10", E = "_input_uxhly_17", K = "_clear_uxhly_45", j = "_dismiss_uxhly_62", e = {
-  field: T,
-  icon: z,
-  input: E,
-  clear: K,
-  dismiss: j
-}, R = ({
-  className: n,
-  expanded: i,
-  name: l = "q",
-  value: o,
+import { S as z } from "../../MagnifyingGlass-bwVhw07z.js";
+import { S as l } from "../../XMark-tKk6aExO.js";
+import '../../assets/SearchbarField.css';const E = "_field_uxhly_1", K = "_icon_uxhly_10", j = "_input_uxhly_17", I = "_clear_uxhly_45", M = "_dismiss_uxhly_62", t = {
+  field: E,
+  icon: K,
+  input: j,
+  clear: I,
+  dismiss: M
+}, w = ({
+  className: c,
+  expanded: a,
+  name: n = "q",
+  value: i,
   placeholder: m = "Search",
-  closeButtonAltText: p = "Close search",
-  clearButtonAltText: u = "Clear search",
-  onFocus: f,
-  onBlur: d,
+  closeButtonAltText: u = "Close search",
+  clearButtonAltText: d = "Clear search",
+  onFocus: p,
+  onBlur: f,
   onChange: h,
-  onClear: x,
-  onClose: _,
+  onClear: _,
+  onClose: x,
   onEnter: y,
   tabIndex: b,
   controlsId: C
 }) => {
-  const s = I(null), k = (a) => {
-    a.key === "Escape" && s.current?.blur(), a.key === "Enter" && (s.current?.blur(), y?.());
+  const s = N(null), g = (r) => {
+    r.key === "Escape" && s.current?.blur(), r.key === "Enter" && (s.current?.blur(), y?.());
   };
-  return /* @__PURE__ */ S("div", { className: g(e.field, n), children: [
-    /* @__PURE__ */ t(
+  return /* @__PURE__ */ k("div", { className: S(t.field, c), children: [
+    /* @__PURE__ */ e(
       "input",
       {
         ref: s,
-        onFocus: f,
-        onBlur: d,
-        name: l,
-        value: o,
+        onFocus: p,
+        onBlur: f,
+        name: n,
+        value: i,
         onChange: h,
         placeholder: m,
-        className: e.input,
-        onKeyUp: k,
+        className: t.input,
+        onKeyUp: g,
         type: "text",
         autoComplete: "off",
         autoCapitalize: "off",
@@ -54,38 +54,39 @@ import '../../assets/SearchbarField.css';const T = "_field_uxhly_1", z = "_icon_
         spellCheck: !1,
         "aria-autocomplete": "list",
         tabIndex: b ?? 0,
-        "aria-expanded": i,
+        "aria-expanded": a,
         "data-testid": "searchbar-input",
         "aria-controls": C,
         role: "combobox"
       }
     ),
-    /* @__PURE__ */ t(N, { svgElement: v, className: e.icon }),
-    o && /* @__PURE__ */ t(
-      r,
+    /* @__PURE__ */ e(v, { svgElement: z, className: t.icon }),
+    i && /* @__PURE__ */ e(
+      o,
       {
-        icon: c,
-        variant: "solid",
+        rounded: !0,
         size: "xs",
-        className: e.clear,
-        onClick: x,
-        dataTestId: "search-button-clear",
-        iconAltText: u
+        variant: "tinted",
+        className: t.clear,
+        onClick: _,
+        "data-testid": "search-button-clear",
+        "aria-label": d,
+        children: /* @__PURE__ */ e(l, {})
       }
-    ) || i && /* @__PURE__ */ t(
-      r,
+    ) || a && /* @__PURE__ */ e(
+      o,
       {
-        icon: c,
         size: "sm",
-        variant: "text",
-        className: e.dismiss,
-        onClick: _,
-        dataTestId: "search-button-close",
-        iconAltText: p
+        variant: "ghost",
+        className: t.dismiss,
+        onClick: x,
+        "data-testid": "search-button-close",
+        "aria-label": u,
+        children: /* @__PURE__ */ e(l, {})
       }
     )
   ] });
 };
 export {
-  R as SearchbarField
+  w as SearchbarField
 };

package/dist/components/Settings/BookmarksSettingsList.js

@@ -3,6 +3,7 @@ import { createElement as c } from "react";
 import "../../index-p1eeF8LQ.js";
 import { Typography as g } from "../Typography/Typography.js";
 import { Heading as h } from "../Typography/Heading.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { Divider as f } from "../Divider/Divider.js";
 import { List as k } from "../List/List.js";
@@ -10,13 +11,13 @@ import "../Snackbar/useSnackbar.js";
 import { Flex as x } from "../Page/Flex.js";
 import { SettingsSection as S } from "./SettingsSection.js";
 import { BookmarksSettingsItem as u } from "./BookmarksSettingsItem.js";
-const I = ({
+const U = ({
   loading: n,
   title: m,
   description: l,
   items: t,
-  untitled: d = "Untitled bookmark",
-  expandedId: p,
+  untitled: p = "Untitled bookmark",
+  expandedId: d,
   onToggle: s
 }) => /* @__PURE__ */ i(e, { children: [
   /* @__PURE__ */ o(h, { size: "lg", children: m }),
@@ -28,10 +29,10 @@ const I = ({
         {
           ...r,
           key: r.id,
-          title: r?.title || d,
+          title: r?.title || p,
           loading: n || r.loading,
           onToggle: () => s?.(r.id),
-          expanded: p === r.id
+          expanded: d === r.id
         }
       )
     ] })) }) }),
@@ -39,5 +40,5 @@ const I = ({
   ] })
 ] });
 export {
-  I as BookmarksSettingsList
+  U as BookmarksSettingsList
 };

package/dist/components/Settings/SettingsItem.js

@@ -1,12 +1,13 @@
 import { jsx as e } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import { useState as s } from "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { Input as f } from "../Forms/Input.js";
 import "../Snackbar/useSnackbar.js";
 import { SettingsItemBase as i } from "./SettingsItemBase.js";
 import { SettingsModal as v } from "./SettingsModal.js";
-const j = ({
+const C = ({
   loading: c,
   variant: o = "default",
   id: a = "settings",
@@ -101,5 +102,5 @@ const j = ({
   }
 };
 export {
-  j as SettingsItem
+  C as SettingsItem
 };

package/dist/components/Settings/SettingsItemBase.js

@@ -1,6 +1,7 @@
 import { jsxs as d, jsx as i } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { getAriaLabelFromTitle as f } from "../Menu/MenuItemLabel.js";
 import { ListItemBase as g } from "../List/ListItemBase.js";
@@ -11,7 +12,7 @@ import '../../assets/SettingsItemBase.css';const N = "_item_lk1g7_1", j = "_labe
   item: N,
   label: j,
   header: x
-}, v = ({
+}, w = ({
   ref: s,
   loading: t,
   color: l,
@@ -22,8 +23,8 @@ import '../../assets/SettingsItemBase.css';const N = "_item_lk1g7_1", j = "_labe
   title: m,
   value: _,
   description: b,
-  children: h,
-  highlightWords: p,
+  children: p,
+  highlightWords: h,
   ...a
 }) => {
   const L = a.ariaLabel || f(m);
@@ -32,7 +33,7 @@ import '../../assets/SettingsItemBase.css';const N = "_item_lk1g7_1", j = "_labe
       k,
       {
         loading: t,
-        highlightWords: p,
+        highlightWords: h,
         className: e.label,
         title: m,
         value: _,
@@ -40,9 +41,9 @@ import '../../assets/SettingsItemBase.css';const N = "_item_lk1g7_1", j = "_labe
         children: n
       }
     ) }),
-    r && h
+    r && p
   ] });
 };
 export {
-  v as SettingsItemBase
+  w as SettingsItemBase
 };

package/dist/components/Settings/SettingsList.js

@@ -3,6 +3,7 @@ import { Fragment as m, createElement as d } from "react";
 import "../../index-p1eeF8LQ.js";
 import { useMenu as f } from "../../hooks/useMenu.js";
 import { Heading as u } from "../Typography/Heading.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { Divider as h } from "../Divider/Divider.js";
 import { List as y } from "../List/List.js";
@@ -10,7 +11,7 @@ import "../Snackbar/useSnackbar.js";
 import { Flex as S } from "../Page/Flex.js";
 import { SettingsItem as v } from "./SettingsItem.js";
 import { SettingsSection as j } from "./SettingsSection.js";
-const K = ({ items: s, groups: p = {}, sortGroupBy: n }) => {
+const M = ({ items: s, groups: p = {}, sortGroupBy: n }) => {
   const { menu: c } = f({
     items: s,
     groups: p,
@@ -18,11 +19,11 @@ const K = ({ items: s, groups: p = {}, sortGroupBy: n }) => {
     keyboardEvents: !1,
     sortGroupBy: n
   });
-  return /* @__PURE__ */ r(S, { as: "div", spacing: "page", direction: "col", children: c?.map((e, l) => {
-    const i = e.props || {};
+  return /* @__PURE__ */ r(S, { as: "div", spacing: "page", direction: "col", children: c?.map((i, l) => {
+    const e = i.props || {};
     return /* @__PURE__ */ o(m, { children: [
-      i?.title && /* @__PURE__ */ r(u, { size: "lg", children: i.title }),
-      /* @__PURE__ */ r(j, { children: /* @__PURE__ */ r(y, { size: "sm", children: e?.items.map((a, t) => {
+      e?.title && /* @__PURE__ */ r(u, { size: "lg", children: e.title }),
+      /* @__PURE__ */ r(j, { children: /* @__PURE__ */ r(y, { size: "sm", children: i?.items.map((a, t) => {
         const g = a.props || {};
         return /* @__PURE__ */ o(m, { children: [
           t > 0 && /* @__PURE__ */ r(h, { as: "li" }),
@@ -33,5 +34,5 @@ const K = ({ items: s, groups: p = {}, sortGroupBy: n }) => {
   }) });
 };
 export {
-  K as SettingsList
+  M as SettingsList
 };

package/dist/components/Settings/SettingsModal.js

@@ -1,38 +1,45 @@
-import { jsxs as i, jsx as t } from "react/jsx-runtime";
-import { createElement as h } from "react";
+import { jsxs as e, jsx as o } from "react/jsx-runtime";
+import { createElement as u } from "react";
 import "../../index-p1eeF8LQ.js";
-import { Button as s } from "../Button/Button.js";
-import { ButtonGroup as B } from "../Button/ButtonGroup.js";
+import { Button as M } from "../Button/Button.js";
+import { ButtonIcon as k } from "../Button/ButtonIcon.js";
+import { ButtonLabel as x } from "../Button/ButtonLabel.js";
+import { ButtonGroup as g } from "../Button/ButtonGroup.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import { ModalBase as M } from "../Modal/ModalBase.js";
-import { ModalHeader as k } from "../Modal/ModalHeader.js";
-import { ModalBody as x } from "../Modal/ModalBody.js";
-const w = ({
-  icon: e,
+import { ModalBase as j } from "../Modal/ModalBase.js";
+import { ModalHeader as y } from "../Modal/ModalHeader.js";
+import { ModalBody as E } from "../Modal/ModalBody.js";
+const C = ({
+  icon: n,
   title: p,
-  description: l,
-  open: d,
+  description: c,
+  open: l,
   onClose: r,
   buttons: m,
   children: a,
-  ...c
-}) => /* @__PURE__ */ i(M, { ...c, open: d, onClose: r, children: [
-  /* @__PURE__ */ t(k, { icon: e, title: p, description: l, onClose: r }),
-  /* @__PURE__ */ i(x, { children: [
+  ...d
+}) => /* @__PURE__ */ e(j, { ...d, open: l, onClose: r, children: [
+  /* @__PURE__ */ o(y, { icon: n, title: p, description: c, onClose: r }),
+  /* @__PURE__ */ e(E, { children: [
     a,
-    m?.length && /* @__PURE__ */ t(B, { children: m?.map((o, f) => /* @__PURE__ */ h(
-      s,
-      {
-        ...o,
-        key: f,
-        onClick: (n) => {
-          o?.onClick?.(n), o?.close && r?.();
-        }
-      }
-    )) })
+    m?.length && /* @__PURE__ */ o(g, { children: m?.map((t, f) => {
+      const { icon: i, label: s, ...B } = t;
+      return /* @__PURE__ */ u(
+        M,
+        {
+          ...B,
+          key: f,
+          onClick: (h) => {
+            t?.onClick?.(h), t?.close && r?.();
+          }
+        },
+        i && /* @__PURE__ */ o(k, { icon: i }),
+        /* @__PURE__ */ o(x, { children: s })
+      );
+    }) })
   ] })
 ] });
 export {
-  w as SettingsModal
+  C as SettingsModal
 };

package/dist/components/Settings/SettingsSection.js

@@ -1,12 +1,13 @@
 import { jsx as n } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as r } from "../Page/Section.js";
 import '../../assets/SettingsSection.css';const m = "_section_kd6sc_1", p = {
   section: m
-}, d = ({
+}, g = ({
   size: t = "sm",
   theme: o = "default",
   shadow: s = "xs",
@@ -15,5 +16,5 @@ import '../../assets/SettingsSection.css';const m = "_section_kd6sc_1", p = {
   children: e
 }) => /* @__PURE__ */ n(r, { as: i, size: t, color: c, theme: o, shadow: s, className: p.section, spacing: 2, children: e });
 export {
-  d as SettingsSection
+  g as SettingsSection
 };

package/dist/components/Settings/UsedByLog.js

@@ -2,6 +2,7 @@
 import { jsx as o, jsxs as a } from "react/jsx-runtime";
 import { useState as y, createElement as B, useMemo as L, Fragment as S } from "react";
 import "../../index-p1eeF8LQ.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { SeenByLogButton as s } from "../Dialog/SeenByLogButton.js";
 import { Divider as d } from "../Divider/Divider.js";
@@ -10,7 +11,7 @@ import "../Snackbar/useSnackbar.js";
 import { Flex as j } from "../Page/Flex.js";
 import { Section as g } from "../Page/Section.js";
 import { UsedByLogItem as f } from "./UsedByLogItem.js";
-const q = ({
+const w = ({
   collapsible: i = !0,
   expanded: h,
   title: t,
@@ -18,12 +19,12 @@ const q = ({
   size: e = "sm",
   endUserLabel: m
 }) => {
-  const [c, l] = y(h || !i && !0), v = () => {
+  const [p, l] = y(h || !i && !0), v = () => {
     l((r) => !r);
   };
   if (n?.length === 1)
     return /* @__PURE__ */ o(g, { spacing: 1, children: /* @__PURE__ */ o(u, { size: e, spacing: 1, children: n?.map((r) => /* @__PURE__ */ B(f, { ...r, key: r.id, size: e, endUserLabel: m })) }) });
-  const p = L(
+  const c = L(
     () => n.map((r) => ({
       ...r,
       ...r.avatar
@@ -31,14 +32,14 @@ const q = ({
     [n]
   );
   return /* @__PURE__ */ a(g, { spacing: 1, children: [
-    t && /* @__PURE__ */ o(j, { children: i ? /* @__PURE__ */ o(s, { icon: { items: p }, as: "button", onClick: v, children: t }) : /* @__PURE__ */ o(s, { icon: { items: p }, as: "div", children: t }) }),
-    t && c && /* @__PURE__ */ o(d, {}),
-    c && /* @__PURE__ */ o(u, { size: e, spacing: 1, children: n?.map((r, x) => /* @__PURE__ */ a(S, { children: [
+    t && /* @__PURE__ */ o(j, { children: i ? /* @__PURE__ */ o(s, { icon: { items: c }, as: "button", onClick: v, children: t }) : /* @__PURE__ */ o(s, { icon: { items: c }, as: "div", children: t }) }),
+    t && p && /* @__PURE__ */ o(d, {}),
+    p && /* @__PURE__ */ o(u, { size: e, spacing: 1, children: n?.map((r, x) => /* @__PURE__ */ a(S, { children: [
       x > 0 && /* @__PURE__ */ o(d, {}),
       /* @__PURE__ */ o(f, { ...r, size: e, endUserLabel: m })
     ] }, r.id)) })
   ] });
 };
 export {
-  q as UsedByLog
+  w as UsedByLog
 };

package/dist/components/Settings/UsedByLogItem.js

@@ -1,23 +1,24 @@
-import { jsxs as r, jsx as s } from "react/jsx-runtime";
-import { Badge as p } from "../Badge/Badge.js";
+import { jsxs as r, jsx as p } from "react/jsx-runtime";
+import { Badge as s } from "../Badge/Badge.js";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import { Byline as c } from "../Byline/Byline.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { Flex as g } from "../Page/Flex.js";
-const v = ({
-  type: e,
+const y = ({
+  type: m,
   name: t,
   description: o,
-  isEndUser: m,
+  isEndUser: e,
   endUserLabel: a,
   avatar: l,
   size: n = "sm"
 }) => {
-  const i = m && { label: a };
+  const i = e && { label: a };
   return /* @__PURE__ */ r(g, { align: "center", spacing: 2, as: "li", children: [
-    /* @__PURE__ */ r(c, { size: n, avatar: { name: t, type: e, ...l }, children: [
+    /* @__PURE__ */ r(c, { size: n, avatar: { name: t, type: m, ...l }, children: [
       /* @__PURE__ */ r("strong", { children: [
         t,
         o && NaN
@@ -25,9 +26,9 @@ const v = ({
       " ",
       o
     ] }),
-    i && /* @__PURE__ */ s(p, { variant: "subtle", ...i })
+    i && /* @__PURE__ */ p(s, { variant: "subtle", ...i })
   ] });
 };
 export {
-  v as UsedByLogItem
+  y as UsedByLogItem
 };

package/dist/components/Snackbar/SnackbarItem.js

@@ -1,9 +1,9 @@
 "use client";
-import { jsxs as f, jsx as c } from "react/jsx-runtime";
+import { jsxs as f, jsx as l } from "react/jsx-runtime";
 import { c as p } from "../../index-p1eeF8LQ.js";
 import { Icon as u } from "../Icon/Icon.js";
 import a, { forwardRef as v } from "react";
-import { IconButton as _ } from "../Button/IconButton.js";
+import { Button as _ } from "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "./useSnackbar.js";
 import { u as g } from "../../useId-BVFxCjkq.js";
@@ -25,14 +25,14 @@ const w = v((e, i) => {
     o ? a.createElement("title", { id: r }, o) : null,
     a.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M12.75 2.5a.75.75 0 0 0-1.5 0v1.273c-2.222.14-3.655.92-4.499 2.186-.887 1.33-1.001 3.04-1.001 4.541v3c0 .809-.424 1.92-.92 2.915a18 18 0 0 1-.936 1.641l-.014.022-.004.006A.75.75 0 0 0 4.5 19.25h4.338a3.25 3.25 0 0 0 6.324 0H19.5a.75.75 0 0 0 .624-1.166l-.004-.006-.014-.022-.06-.091c-.05-.081-.125-.2-.215-.35-.18-.301-.42-.722-.66-1.2-.497-.994-.921-2.106-.921-2.915v-3c0-1.501-.114-3.21-1.001-4.541-.844-1.266-2.277-2.046-4.499-2.186zm-1.987 17.237a1.8 1.8 0 0 1-.344-.487h3.162a1.75 1.75 0 0 1-1.581 1 1.75 1.75 0 0 1-1.237-.513", clipRule: "evenodd" })
   );
-}), x = "_item_1a13i_1", O = "_icon_1a13i_23", I = "_content_1a13i_33", b = "_action_1a13i_41", l = {
-  item: x,
-  icon: O,
-  content: I,
-  action: b
+}), O = "_item_1a13i_1", b = "_icon_1a13i_23", x = "_content_1a13i_33", I = "_action_1a13i_41", c = {
+  item: O,
+  icon: b,
+  content: x,
+  action: I
 };
 var j = /* @__PURE__ */ ((e) => (e.company = "company", e.success = "success", e.warning = "warning", e.danger = "danger", e.info = "info", e))(j || {});
-const F = ({
+const H = ({
   as: e,
   message: i,
   className: o,
@@ -42,21 +42,12 @@ const F = ({
   dismissable: s = !0,
   onDismiss: m,
   ...d
-}) => /* @__PURE__ */ f(e || "div", { className: p(l.item, o), "data-color": t, role: "alert", ...d, children: [
-  /* @__PURE__ */ c(u, { svgElement: n, className: l.icon, "aria-hidden": "true" }),
-  /* @__PURE__ */ c("div", { className: l.content, children: i }),
-  s && /* @__PURE__ */ c("div", { className: l.action, children: /* @__PURE__ */ c(
-    _,
-    {
-      icon: h,
-      variant: "solid",
-      onClick: m,
-      className: l.dismiss,
-      iconAltText: "close"
-    }
-  ) })
+}) => /* @__PURE__ */ f(e || "div", { className: p(c.item, o), "data-color": t, role: "alert", ...d, children: [
+  /* @__PURE__ */ l(u, { svgElement: n, className: c.icon, "aria-hidden": "true" }),
+  /* @__PURE__ */ l("div", { className: c.content, children: i }),
+  s && /* @__PURE__ */ l("div", { className: c.action, children: /* @__PURE__ */ l(_, { variant: "solid", onClick: m, "aria-label": "close", children: /* @__PURE__ */ l(h, { style: { fontSize: "1.5em" } }) }) })
 ] });
 export {
   j as SnackbarColorEnum,
-  F as SnackbarItem
+  H as SnackbarItem
 };

package/dist/components/Timeline/Timeline.js

@@ -1,10 +1,11 @@
 import { jsx as i } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as m } from "../Page/Section.js";
-const f = ({ as: t = "ul", spacing: o = 2, children: r }) => /* @__PURE__ */ i(m, { as: t, spacing: o, style: { width: "100%" }, children: r });
+const u = ({ as: t = "ul", spacing: o = 2, children: r }) => /* @__PURE__ */ i(m, { as: t, spacing: o, style: { width: "100%" }, children: r });
 export {
-  f as Timeline
+  u as Timeline
 };

package/dist/components/Timeline/TimelineActivity.js

@@ -2,12 +2,13 @@ import { jsxs as c, jsx as i } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Typography as n } from "../Typography/Typography.js";
+import "../Button/Button.js";
 import { Byline as l } from "../Byline/Byline.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as y } from "../Page/Section.js";
 import { S as a } from "../../CircleFill-yFbEHBRX.js";
-const h = ({
+const k = ({
   loading: r,
   byline: t,
   icon: x = a,
@@ -24,5 +25,5 @@ const h = ({
   o && typeof o == "string" ? /* @__PURE__ */ i(n, { as: "p", loading: r, size: "md", ...m, children: o }) : o
 ] });
 export {
-  h as TimelineActivity
+  k as TimelineActivity
 };

package/dist/components/Timeline/TimelineBase.js

@@ -1,6 +1,7 @@
 import { jsxs as i, jsx as t } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import { TimelineIcon as v } from "./TimelineIcon.js";
 import "../Snackbar/useSnackbar.js";
@@ -10,26 +11,26 @@ import '../../assets/TimelineBase.css';const N = "_section_4e55r_1", f = "_sideb
   sidebar: f,
   content: h,
   border: j
-}, g = ({
+}, k = ({
   as: n = "section",
   loading: o,
   border: a = "solid",
   borderColor: c,
-  level: d = 1,
+  level: m = 1,
   color: r,
   icon: s,
-  iconColor: m,
+  iconColor: d,
   iconTheme: l,
   children: _,
-  id: b,
-  ...p
-}) => /* @__PURE__ */ i(x, { as: n, className: e.section, color: r, ...p, id: b, children: [
-  /* @__PURE__ */ i("aside", { className: e.sidebar, "data-level": d, children: [
-    s && /* @__PURE__ */ t(v, { loading: o, icon: s, theme: l, color: m, size: "sm" }),
+  id: p,
+  ...b
+}) => /* @__PURE__ */ i(x, { as: n, className: e.section, color: r, ...b, id: p, children: [
+  /* @__PURE__ */ i("aside", { className: e.sidebar, "data-level": m, children: [
+    s && /* @__PURE__ */ t(v, { loading: o, icon: s, theme: l, color: d, size: "sm" }),
     /* @__PURE__ */ t("div", { className: e.border, "data-loading": o, "data-variant": a, "data-color": c || r })
   ] }),
   /* @__PURE__ */ t("div", { className: e.content, children: _ })
 ] });
 export {
-  g as TimelineBase
+  k as TimelineBase
 };