@altinn/altinn-components 0.21.0 → 0.21.2

package/dist/assets/DialogListItem.css

@@ -1 +1 @@
-._link_6y5ya_1[data-size=xl]{padding:1em}._link_6y5ya_1[data-size=lg]{padding:.875em}._link_6y5ya_1[data-size=md]{padding:.75em}._link_6y5ya_1[data-size=sm],._link_6y5ya_1[data-size=xs]{padding:.625em}._border_6y5ya_22{position:relative;border-left:.25rem solid;border-color:var(--ds-color-surface-active);display:flex;flex-direction:column}._border_6y5ya_22[data-seen=true]{border-color:var(--ds-color-neutral-surface-default)}._border_6y5ya_22[data-variant=draft]{border-color:var(--ds-color-neutral-surface-active);border-left-width:.125rem;margin-left:.125rem;border-left-style:dashed}._border_6y5ya_22[data-variant=sent]{border-color:var(--ds-color-neutral-surface-default)}._border_6y5ya_22[data-loading=true]{border-color:var(--ds-color-surface-default)}._border_6y5ya_22[data-size=xs],._border_6y5ya_22[data-size=sm]{width:100%;flex-direction:row;align-items:center;padding-left:.75rem}._border_6y5ya_22[data-size=md]{padding-left:.75rem;row-gap:.5rem}._border_6y5ya_22[data-size=lg]{padding-left:.875rem;row-gap:.875rem}._border_6y5ya_22[data-size=xl]{padding-left:1rem;row-gap:1rem}._select_6y5ya_72{position:absolute;top:0;right:0;margin:.375rem}._header_6y5ya_79{display:flex;flex-direction:column;row-gap:.25rem}._header_6y5ya_79[data-size=xs],._header_6y5ya_79[data-size=sm]{display:flex;flex-direction:row}._summary_6y5ya_91{font-size:1rem;font-weight:400;line-height:1.25;color:var(--ds-color-text-default);display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;margin:0}._summary_6y5ya_91[data-size=xs],._summary_6y5ya_91[data-size=sm],._summary_6y5ya_91[data-size=md]{font-size:.875rem}._summary_6y5ya_91[data-size=lg],._summary_6y5ya_91[data-size=xl]{font-size:1rem}._footer_6y5ya_119{width:100%}._touchedBy_6y5ya_123{position:absolute;right:0;bottom:0;margin:8px}._heading_6y5ya_132{padding-right:1.25rem;display:inline-flex;column-gap:.5em}._title_6y5ya_138{line-height:1.25;font-weight:600;margin:0}._title_6y5ya_138[data-size=xs],._title_6y5ya_138[data-size=sm]{font-size:1rem}._title_6y5ya_138[data-size=md],._title_6y5ya_138[data-size=lg],._title_6y5ya_138[data-size=xl]{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}._title_6y5ya_138[data-size=md]{font-size:1rem}._title_6y5ya_138[data-size=lg],._title_6y5ya_138[data-size=xl]{font-size:1.25rem;line-height:1.25}._title_6y5ya_138[data-seen=true],._title_6y5ya_138[data-state=archived]{font-weight:400}._title_6y5ya_138[data-state=trashed]{font-weight:400;text-decoration:line-through}
+._link_2hfa5_1[data-size=xl]{padding:1em}._link_2hfa5_1[data-size=lg]{padding:.875em}._link_2hfa5_1[data-size=md]{padding:.75em}._link_2hfa5_1[data-size=sm],._link_2hfa5_1[data-size=xs]{padding:.625em}._border_2hfa5_22{position:relative;border-left:.25rem solid;border-color:var(--ds-color-surface-active);display:flex;flex-direction:column}._border_2hfa5_22[data-seen=true]{border-color:var(--ds-color-neutral-surface-default)}._border_2hfa5_22[data-variant=draft]{border-color:var(--ds-color-neutral-surface-active);border-left-width:.125rem;margin-left:.125rem;border-left-style:dashed}._border_2hfa5_22[data-variant=sent]{border-color:var(--ds-color-neutral-surface-default)}._border_2hfa5_22[data-loading=true]{border-color:var(--ds-color-surface-default)}._border_2hfa5_22[data-size=xs],._border_2hfa5_22[data-size=sm]{width:100%;flex-direction:row;align-items:center;padding-left:.75rem}._border_2hfa5_22[data-size=md]{padding-left:.75rem;row-gap:.5rem}._border_2hfa5_22[data-size=lg]{padding-left:.875rem;row-gap:.875rem}._border_2hfa5_22[data-size=xl]{padding-left:1rem;row-gap:1rem}._select_2hfa5_72{position:absolute;top:0;right:0;margin:.375rem}._header_2hfa5_79{display:flex;flex-direction:column;row-gap:.25rem}._header_2hfa5_79[data-size=xs],._header_2hfa5_79[data-size=sm]{display:flex;flex-direction:row}._summary_2hfa5_91{font-size:1rem;font-weight:400;line-height:1.375;color:var(--ds-color-text-default);display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;margin:0}._summary_2hfa5_91[data-size=xs],._summary_2hfa5_91[data-size=sm],._summary_2hfa5_91[data-size=md]{font-size:.875rem}._summary_2hfa5_91[data-size=lg],._summary_2hfa5_91[data-size=xl]{font-size:1rem}._footer_2hfa5_119{width:100%}._touchedBy_2hfa5_123{position:absolute;right:0;bottom:0;margin:8px}._heading_2hfa5_132{padding-right:1.25rem;display:inline-flex;column-gap:.5em}._title_2hfa5_138{line-height:1.25;font-weight:600;margin:0}._title_2hfa5_138[data-size=xs],._title_2hfa5_138[data-size=sm]{font-size:1rem}._title_2hfa5_138[data-size=md],._title_2hfa5_138[data-size=lg],._title_2hfa5_138[data-size=xl]{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}._title_2hfa5_138[data-size=md]{font-size:1rem}._title_2hfa5_138[data-size=lg],._title_2hfa5_138[data-size=xl]{font-size:1.25rem;line-height:1.25}._title_2hfa5_138[data-seen=true],._title_2hfa5_138[data-state=archived]{font-weight:400}._title_2hfa5_138[data-state=trashed]{font-weight:400;text-decoration:line-through}

package/dist/assets/DrawerBase.css

@@ -1 +1 @@
-._drawer_vej3t_1{display:none}._drawer_vej3t_1[data-expanded=true]{display:block;width:100%}._drawer_vej3t_1[data-placement=bottom]{position:fixed;top:5.5rem;bottom:0;left:0;right:0}
+._drawer_18fhf_1{display:none}._drawer_18fhf_1[data-expanded=true]{display:block;width:100%;z-index:2}._drawer_18fhf_1[data-placement=bottom]{position:fixed;top:5.5rem;bottom:0;left:0;right:0}@media (max-width: 1023px){._drawer_18fhf_1[data-expanded=true][data-layout=desktop]{display:none}}@media (min-width: 1024px){._drawer_18fhf_1[data-expanded=true][data-layout=mobile]{display:none}}

package/dist/assets/DropdownBase.css

@@ -1 +1 @@
-._dropdown_1hh2v_1{display:none}._dropdown_1hh2v_1[data-expanded=true]{display:block;position:absolute;z-index:2}._dropdown_1hh2v_1[data-placement=left]{left:0}._dropdown_1hh2v_1[data-placement=right]{right:0}._dropdown_1hh2v_1[data-padding=true]{padding:0 .5rem}._dropdown_1hh2v_1{min-width:16rem;max-width:24rem;margin-top:.5rem;border-radius:.375rem;overflow:hidden}._drawer_1hh2v_31 ._button_1hh2v_31{border-radius:50%}
+._dropdown_1x5d7_1{display:none}._dropdown_1x5d7_1[data-expanded=true]{display:block;position:absolute;z-index:2}._dropdown_1x5d7_1[data-placement=left]{left:0}._dropdown_1x5d7_1[data-placement=right]{right:0}._dropdown_1x5d7_1[data-padding=true]{padding:0 .5rem}._dropdown_1x5d7_1{min-width:16rem;max-width:24rem;margin-top:.5rem;border-radius:.375rem;overflow:hidden}@media (max-width: 1023px){._dropdown_1x5d7_1[data-expanded=true][data-layout=desktop]{display:none}}@media (min-width: 1024px){._dropdown_1x5d7_1[data-expanded=true][data-layout=mobile]{display:none}}

package/dist/assets/MenuItemBase.css

@@ -1 +1 @@
-._item_kevew_1{padding:0;border:0;color:inherit;font:inherit;text-align:inherit;text-decoration:none;line-height:normal;-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-user-select:none;user-select:none;cursor:pointer;position:relative;width:100%;display:flex;align-items:center;column-gap:.25rem;margin:.5rem 0;border-radius:2px}._item_kevew_1[aria-disabled=true]{opacity:.5;pointer-events:none}._item_kevew_1[data-size=md]{min-height:56px}._item_kevew_1[data-size=md]{min-height:44px}._item_kevew_1[data-size=sm]{min-height:40px}._content_kevew_45{display:flex;width:100%;align-items:center;column-gap:6px;padding:6px}._action_kevew_53{display:flex;justify-content:center;align-items:center;padding:10px}._linkText_kevew_60{font-size:.875rem;white-space:nowrap}._linkIcon_kevew_65{font-size:1.5rem}._item_kevew_1,._item_kevew_1[data-theme]{background-color:transparent}[data-theme=subtle] ._item_kevew_1:hover{background-color:var(--ds-color-surface-hover)}[data-theme=subtle] ._item_kevew_1:active{background-color:var(--ds-color-surface-active)}[data-theme=subtle] ._item_kevew_1[data-selected=true]{background-color:var(--ds-color-background-default)}[data-theme=default] ._item_kevew_1:hover{background-color:var(--ds-color-surface-hover)}[data-theme=default] ._item_kevew_1:active{background-color:var(--ds-color-surface-active)}[data-theme=default] ._item_kevew_1[data-selected=true]{background-color:var(--ds-color-background-subtle)}
+._item_7rzvi_1{padding:0;border:0;text-align:inherit;text-decoration:none;line-height:normal;-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-user-select:none;user-select:none;cursor:pointer;position:relative;width:100%;display:flex;align-items:center;column-gap:.25rem;margin:.5rem 0;border-radius:2px}._item_7rzvi_1[aria-disabled=true]{opacity:.5;pointer-events:none}._item_7rzvi_1[data-size=md]{min-height:56px}._item_7rzvi_1[data-size=md]{min-height:44px}._item_7rzvi_1[data-size=sm]{min-height:40px}._content_7rzvi_43{display:flex;width:100%;align-items:center;column-gap:6px;padding:6px}._action_7rzvi_51{display:flex;justify-content:center;align-items:center;padding:10px}._linkText_7rzvi_58{font-size:.875rem;white-space:nowrap}._linkIcon_7rzvi_63{font-size:1.5rem}._item_7rzvi_1,._item_7rzvi_1[data-theme]{background-color:transparent}[data-theme=subtle] ._item_7rzvi_1:hover{background-color:var(--ds-color-surface-hover)}[data-theme=subtle] ._item_7rzvi_1:active{background-color:var(--ds-color-surface-active)}[data-theme=subtle] ._item_7rzvi_1[data-selected=true]{background-color:var(--ds-color-background-default)}[data-theme=default] ._item_7rzvi_1:hover{background-color:var(--ds-color-surface-hover)}[data-theme=default] ._item_7rzvi_1:active{background-color:var(--ds-color-surface-active)}[data-theme=default] ._item_7rzvi_1[data-selected=true]{background-color:var(--ds-color-background-subtle)}

package/dist/assets/ProgressIcon.css

@@ -1 +1 @@
-._progress_e618l_1{--size: 16px;width:var(--size);height:var(--size);aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--ds-color-border-strong) var(--progress, 0),var(--ds-color-surface-default) 0);display:grid;place-content:center;transform:scaleX(-1)}._progress_e618l_1:after{width:calc(var(--size) * .5);height:calc(var(--size) * .5);aspect-ratio:1;content:attr(data-value);display:grid;background:#fff;border-radius:50%;font-size:0;place-content:center}._complete_e618l_25{width:var(--size);height:var(--size);color:var(--ds-color-border-strong)}
+._progress_1usqp_1{--size: 16px;width:var(--size);height:var(--size);aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--ds-color-base-default) var(--progress, 0),var(--ds-color-surface-default) 0);display:grid;place-content:center;transform:scaleX(-1)}._progress_1usqp_1:after{width:calc(var(--size) * .5);height:calc(var(--size) * .5);aspect-ratio:1;content:attr(data-value);display:grid;background:#fff;border-radius:50%;font-size:0;place-content:center}._complete_1usqp_25{width:var(--size);height:var(--size);color:var(--ds-color-base-default)}

package/dist/components/Dialog/DialogHeading.js

@@ -1,18 +1,18 @@
 import { jsxs as n, jsx as t } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
+import { Badge as l } from "../Badge/Badge.js";
 import "../RootProvider/RootProvider.js";
-import { Skeleton as l } from "../Skeleton/Skeleton.js";
-import { DialogLabel as d } from "./DialogLabel.js";
+import { Skeleton as d } from "../Skeleton/Skeleton.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/DialogHeading.css';const p = "_heading_rx9gi_1", c = "_title_rx9gi_7", s = {
+import '../../assets/DialogHeading.css';const p = "_heading_rx9gi_1", c = "_title_rx9gi_7", r = {
   heading: p,
   title: c
-}, D = ({ loading: i, size: o = "sm", seen: a = !1, state: e, label: r, children: m }) => /* @__PURE__ */ n("div", { className: s.heading, children: [
-  /* @__PURE__ */ t(l, { loading: i, children: /* @__PURE__ */ t("h2", { className: s.title, "data-seen": a, "data-size": o, "data-state": e, children: m }) }),
-  !i && r && /* @__PURE__ */ t(d, { type: e, size: "xs", children: r })
+}, u = ({ loading: e, size: s = "sm", seen: a = !1, state: o, badge: i, children: m }) => /* @__PURE__ */ n("div", { className: r.heading, children: [
+  /* @__PURE__ */ t(d, { loading: e, children: /* @__PURE__ */ t("h2", { className: r.title, "data-seen": a, "data-size": s, "data-state": o, children: m }) }),
+  !e && i && /* @__PURE__ */ t(l, { ...i })
 ] });
 export {
-  D as DialogHeading
+  u as DialogHeading
 };

package/dist/components/Dialog/DialogListItem.js

@@ -11,7 +11,7 @@ import { ListItemLabel as G } from "../List/ListItemLabel.js";
 import { ListItemSelect as J } from "../List/ListItemSelect.js";
 import { ListItem as x } from "../List/ListItem.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/DialogListItem.css';const K = "_link_6y5ya_1", O = "_border_6y5ya_22", P = "_select_6y5ya_72", Q = "_header_6y5ya_79", R = "_summary_6y5ya_91", U = "_footer_6y5ya_119", W = "_touchedBy_6y5ya_123", X = "_heading_6y5ya_132", Y = "_title_6y5ya_138", o = {
+import '../../assets/DialogListItem.css';const K = "_link_2hfa5_1", O = "_border_2hfa5_22", P = "_select_2hfa5_72", Q = "_header_2hfa5_79", R = "_summary_2hfa5_91", U = "_footer_2hfa5_119", W = "_touchedBy_2hfa5_123", X = "_heading_2hfa5_132", Y = "_title_2hfa5_138", o = {
   link: K,
   border: O,
   select: P,
@@ -32,13 +32,13 @@ import '../../assets/DialogListItem.css';const K = "_link_6y5ya_1", O = "_border
   recipient: v,
   recipientLabel: k = "to",
   grouped: D = !1,
-  updatedAt: n,
-  updatedAtLabel: d,
-  archivedAt: y,
+  updatedAt: h,
+  updatedAtLabel: n,
+  archivedAt: d,
   archivedAtLabel: I,
   trashedAt: _,
   trashedAtLabel: L,
-  label: S,
+  badge: S,
   dueAt: j,
   dueAtLabel: H,
   seen: c = !1,
@@ -46,19 +46,19 @@ import '../../assets/DialogListItem.css';const K = "_link_6y5ya_1", O = "_border
   touchedBy: T,
   attachmentsCount: V,
   title: m,
-  description: h,
+  description: f,
   summary: p,
   theme: q = "default",
-  ...f
+  ...b
 }) => {
-  const w = _ ? "trashed" : y ? "archived" : B, b = l ? "subtle" : q, N = r == null ? void 0 : r.value;
+  const w = _ ? "trashed" : d ? "archived" : B, y = l ? "subtle" : q, N = r == null ? void 0 : r.value;
   return a === "xs" || a === "sm" ? /* @__PURE__ */ e(
     x,
     {
-      ...f,
+      ...b,
       size: a,
       selected: l,
-      theme: b,
+      theme: y,
       label: /* @__PURE__ */ e(
         "div",
         {
@@ -67,19 +67,19 @@ import '../../assets/DialogListItem.css';const K = "_link_6y5ya_1", O = "_border
           "data-size": a,
           "data-seen": c,
           "data-loading": t,
-          children: /* @__PURE__ */ e(G, { loading: t, size: a, title: m, description: p || h })
+          children: /* @__PURE__ */ e(G, { loading: t, size: a, title: m, description: p || f })
         }
       ),
-      badge: /* @__PURE__ */ e(u, { loading: t, sender: s, updatedAt: n, updatedAtLabel: d }),
+      badge: /* @__PURE__ */ e(u, { loading: t, sender: s, updatedAt: h, updatedAtLabel: n }),
       title: m
     }
   ) : /* @__PURE__ */ e(
     x,
     {
-      ...f,
+      ...b,
       size: a,
       selected: l,
-      theme: b,
+      theme: y,
       controls: i && /* @__PURE__ */ e(J, { className: o.select, ...i, size: "xl" }),
       title: m,
       label: /* @__PURE__ */ g(
@@ -92,7 +92,7 @@ import '../../assets/DialogListItem.css';const K = "_link_6y5ya_1", O = "_border
           "data-loading": t,
           children: [
             /* @__PURE__ */ g("header", { className: o.header, "data-size": a, children: [
-              /* @__PURE__ */ e(F, { loading: t, size: a, state: w, label: S, seen: c, children: m }),
+              /* @__PURE__ */ e(F, { loading: t, size: a, state: w, badge: S, seen: c, children: m }),
               /* @__PURE__ */ e(
                 C,
                 {
@@ -104,7 +104,7 @@ import '../../assets/DialogListItem.css';const K = "_link_6y5ya_1", O = "_border
                   grouped: D
                 }
               ),
-              a === "lg" && /* @__PURE__ */ e(E, { loading: t, children: /* @__PURE__ */ e("p", { "data-size": a, className: o.summary, children: p || h }) })
+              a === "lg" && /* @__PURE__ */ e(E, { loading: t, children: /* @__PURE__ */ e("p", { "data-size": a, className: o.summary, children: p || f }) })
             ] }),
             /* @__PURE__ */ e(
               u,
@@ -112,9 +112,9 @@ import '../../assets/DialogListItem.css';const K = "_link_6y5ya_1", O = "_border
                 className: o.footer,
                 loading: t,
                 status: r,
-                updatedAt: n,
-                updatedAtLabel: d,
-                archivedAt: y,
+                updatedAt: h,
+                updatedAtLabel: n,
+                archivedAt: d,
                 archivedAtLabel: I,
                 trashedAt: _,
                 trashedAtLabel: L,

package/dist/components/Dialog/DialogMetadata.js

@@ -8,10 +8,10 @@ import { DialogActivityLog as j } from "./DialogActivityLog.js";
 import { DialogSeenBy as I } from "./DialogSeenBy.js";
 import { DialogStatus as E } from "./DialogStatus.js";
 import { DialogTouchedBy as _ } from "./DialogTouchedBy.js";
+import "../Search/AutocompleteBase.js";
 import { MetaBase as M } from "../Meta/MetaBase.js";
 import { MetaItem as b } from "../Meta/MetaItem.js";
 import { MetaTimestamp as m } from "../Meta/MetaTimestamp.js";
-import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
 import { S as P } from "../../ClockDashed-PQgzLSPC.js";
 import { u as S } from "../../useId-CsCRkvK3.js";

package/dist/components/Dialog/index.js

@@ -1,45 +1,43 @@
 import { Dialog as t } from "./Dialog.js";
 import { DialogHeader as i } from "./DialogHeader.js";
 import { DialogBody as g } from "./DialogBody.js";
-import { DialogList as m } from "./DialogList.js";
+import { DialogList as l } from "./DialogList.js";
 import { DialogListGroup as f } from "./DialogListGroup.js";
 import { DialogListItem as D } from "./DialogListItem.js";
 import { DialogMetadata as s } from "./DialogMetadata.js";
 import { DialogByline as c } from "./DialogByline.js";
-import { DialogActions as S } from "./DialogActions.js";
-import { DialogActivityLog as u } from "./DialogActivityLog.js";
+import { DialogActions as d } from "./DialogActions.js";
+import { DialogActivityLog as B } from "./DialogActivityLog.js";
 import { DialogSection as A } from "./DialogSection.js";
 import { DialogSeenBy as h } from "./DialogSeenBy.js";
-import { DialogSelect as b } from "./DialogSelect.js";
-import { DialogStatus as G, DialogStatusEnum as I } from "./DialogStatus.js";
-import { DialogHeading as T } from "./DialogHeading.js";
+import { DialogSelect as E } from "./DialogSelect.js";
+import { DialogStatus as I, DialogStatusEnum as M } from "./DialogStatus.js";
+import { DialogHeading as b } from "./DialogHeading.js";
 import { DialogTouchedBy as k } from "./DialogTouchedBy.js";
-import { DialogLabel as w } from "./DialogLabel.js";
-import { DialogAttachments as C } from "./DialogAttachments.js";
-import { DialogHistory as J } from "./DialogHistory.js";
-import { DialogActivity as N } from "./DialogActivity.js";
-import { SeenByLog as P } from "./SeenByLog.js";
+import { DialogAttachments as w } from "./DialogAttachments.js";
+import { DialogHistory as C } from "./DialogHistory.js";
+import { DialogActivity as J } from "./DialogActivity.js";
+import { SeenByLog as N } from "./SeenByLog.js";
 export {
   t as Dialog,
-  S as DialogActions,
-  N as DialogActivity,
-  u as DialogActivityLog,
-  C as DialogAttachments,
+  d as DialogActions,
+  J as DialogActivity,
+  B as DialogActivityLog,
+  w as DialogAttachments,
   g as DialogBody,
   c as DialogByline,
   i as DialogHeader,
-  T as DialogHeading,
-  J as DialogHistory,
-  w as DialogLabel,
-  m as DialogList,
+  b as DialogHeading,
+  C as DialogHistory,
+  l as DialogList,
   f as DialogListGroup,
   D as DialogListItem,
   s as DialogMetadata,
   A as DialogSection,
   h as DialogSeenBy,
-  b as DialogSelect,
-  G as DialogStatus,
-  I as DialogStatusEnum,
+  E as DialogSelect,
+  I as DialogStatus,
+  M as DialogStatusEnum,
   k as DialogTouchedBy,
-  P as SeenByLog
+  N as SeenByLog
 };

package/dist/components/Dropdown/DrawerBase.js

@@ -1,18 +1,19 @@
-import { jsx as d } from "react/jsx-runtime";
-import { c as o } from "../../index-L8X2o7IH.js";
-import '../../assets/DrawerBase.css';const s = "_drawer_vej3t_1", c = {
-  drawer: s
-}, l = ({ placement: a = "inline", open: e = !1, className: r, children: t }) => /* @__PURE__ */ d(
+import { jsx as o } from "react/jsx-runtime";
+import { c as s } from "../../index-L8X2o7IH.js";
+import '../../assets/DrawerBase.css';const c = "_drawer_18fhf_1", n = {
+  drawer: c
+}, f = ({ layout: a, placement: e = "inline", open: r = !1, className: t, children: d }) => /* @__PURE__ */ o(
   "div",
   {
-    className: o(c.drawer, r),
-    "data-placement": a,
+    className: s(n.drawer, t),
+    "data-placement": e,
+    "data-layout": a,
     "data-theme": "default",
     "data-color": "company",
-    "data-expanded": e,
-    children: t
+    "data-expanded": r,
+    children: d
   }
 );
 export {
-  l as DrawerBase
+  f as DrawerBase
 };

package/dist/components/Dropdown/DrawerOrDropdown.js

@@ -1,32 +1,29 @@
-import { jsxs as e, Fragment as a, jsx as o } from "react/jsx-runtime";
+import { jsxs as l, Fragment as c, jsx as r } from "react/jsx-runtime";
 import "../../index-L8X2o7IH.js";
 import "react";
 import "../RootProvider/RootProvider.js";
-import { DropdownBase as l } from "./DropdownBase.js";
-import { Backdrop as d } from "./Backdrop.js";
-import { DrawerBase as t } from "./DrawerBase.js";
-import { DrawerHeader as f } from "./DrawerHeader.js";
-import { DrawerFooter as n } from "./DrawerFooter.js";
-import { DrawerButton as D } from "./DrawerButton.js";
-import { DrawerBody as w } from "./DrawerBody.js";
+import { DropdownBase as f } from "./DropdownBase.js";
+import { Backdrop as t } from "./Backdrop.js";
+import { DrawerBase as D } from "./DrawerBase.js";
+import { DrawerHeader as a } from "./DrawerHeader.js";
+import { DrawerFooter as s } from "./DrawerFooter.js";
+import { DrawerButton as k } from "./DrawerButton.js";
+import { DrawerBody as b } from "./DrawerBody.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/DrawerOrDropdown.css';const _ = "_dropdown_oo71i_1", k = "_drawer_oo71i_5", s = {
-  dropdown: _,
-  drawer: k
-}, z = ({
+const z = ({
   open: m = !1,
   onClose: i,
-  drawerButton: r,
+  drawerButton: o,
   children: p,
-  drawerTitle: c
-}) => /* @__PURE__ */ e(a, { children: [
-  m && /* @__PURE__ */ o(d, { onClick: i }),
-  /* @__PURE__ */ o(l, { className: s.dropdown, padding: !0, open: m, children: p }),
-  /* @__PURE__ */ e(t, { className: s.drawer, placement: "bottom", open: m, children: [
-    /* @__PURE__ */ o(f, { title: c, onClose: i }),
-    /* @__PURE__ */ o(w, { children: p }),
-    /* @__PURE__ */ o(n, { children: r && /* @__PURE__ */ o(D, { onClick: r == null ? void 0 : r.onClick, children: r == null ? void 0 : r.label }) })
+  drawerTitle: e
+}) => /* @__PURE__ */ l(c, { children: [
+  m && /* @__PURE__ */ r(t, { onClick: i }),
+  /* @__PURE__ */ r(f, { layout: "desktop", padding: !0, open: m, children: p }),
+  /* @__PURE__ */ l(D, { layout: "mobile", placement: "bottom", open: m, children: [
+    /* @__PURE__ */ r(a, { title: e, onClose: i }),
+    /* @__PURE__ */ r(b, { children: p }),
+    /* @__PURE__ */ r(s, { children: o && /* @__PURE__ */ r(k, { onClick: o == null ? void 0 : o.onClick, children: o == null ? void 0 : o.label }) })
   ] })
 ] });
 export {

package/dist/components/Dropdown/DropdownBase.js

@@ -1,36 +1,36 @@
-import { jsx as s } from "react/jsx-runtime";
-import { c as m } from "../../index-L8X2o7IH.js";
-import { useRef as p } from "react";
+import { jsx as m } from "react/jsx-runtime";
+import { c as p } from "../../index-L8X2o7IH.js";
+import { useRef as l } from "react";
 import { useClickOutside as c } from "../../hooks/useClickOutside.js";
-import '../../assets/DropdownBase.css';const l = "_dropdown_1hh2v_1", u = "_drawer_1hh2v_31", f = "_button_1hh2v_31", w = {
-  dropdown: l,
-  drawer: u,
-  button: f
-}, x = ({
-  placement: t = "left",
-  padding: d = !0,
-  open: a = !1,
+import '../../assets/DropdownBase.css';const f = "_dropdown_1x5d7_1", u = {
+  dropdown: f
+}, _ = ({
+  layout: a,
+  placement: d = "left",
+  padding: t = !0,
+  open: e = !1,
   className: r,
-  children: e,
-  onClose: n
+  children: n,
+  onClose: s
 }) => {
-  const o = p(null);
-  return c(o, n), /* @__PURE__ */ s(
+  const o = l(null);
+  return c(o, s), /* @__PURE__ */ m(
     "div",
     {
       ref: o,
-      className: m(w.dropdown, r),
+      className: p(u.dropdown, r),
+      "data-layout": a,
       "data-theme": "default",
       "data-color": "company",
       "data-shadow": "md",
-      "data-placement": t,
-      "data-padding": d,
+      "data-placement": d,
+      "data-padding": t,
       role: "menu",
-      "data-expanded": a,
-      children: e
+      "data-expanded": e,
+      children: n
     }
   );
 };
 export {
-  x as DropdownBase
+  _ as DropdownBase
 };

package/dist/components/Header/Header.js

@@ -1,35 +1,35 @@
 "use client";
-import { jsxs as p, jsx as e } from "react/jsx-runtime";
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import { DropdownBase as g } from "../Dropdown/DropdownBase.js";
 import "../../index-L8X2o7IH.js";
 import { DrawerBase as x } from "../Dropdown/DrawerBase.js";
 import "react";
 import { useRootContext as C } from "../RootProvider/RootProvider.js";
-import { GlobalMenu as t } from "../GlobalMenu/GlobalMenu.js";
-import { HeaderBase as H } from "./HeaderBase.js";
-import { HeaderLogo as _ } from "./HeaderLogo.js";
-import { HeaderButton as b } from "./HeaderButton.js";
-import { Searchbar as y } from "../Search/Searchbar.js";
+import { GlobalMenu as m } from "../GlobalMenu/GlobalMenu.js";
+import { HeaderBase as y } from "./HeaderBase.js";
+import { HeaderLogo as H } from "./HeaderLogo.js";
+import { HeaderButton as _ } from "./HeaderButton.js";
+import { Searchbar as b } from "../Search/Searchbar.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import { HeaderMenu as B } from "./HeaderMenu.js";
-import { HeaderSearch as N } from "./HeaderSearch.js";
-import '../../assets/Header.css';const S = "_drawer_d2s9o_1", I = "_dropdown_d2s9o_5", s = {
-  drawer: S,
-  dropdown: I
-}, K = ({ search: d, menu: r, currentAccount: a, logo: l = {}, badge: i }) => {
-  const { currentId: o, toggleId: m, openId: c, closeAll: n } = C(), h = () => {
+import { HeaderMenu as u } from "./HeaderMenu.js";
+import { HeaderSearch as B } from "./HeaderSearch.js";
+import '../../assets/Header.css';const N = "_drawer_d2s9o_1", S = "_dropdown_d2s9o_5", s = {
+  drawer: N,
+  dropdown: S
+}, K = ({ search: n, menu: r, currentAccount: a, logo: p = {}, badge: i }) => {
+  const { currentId: o, toggleId: t, openId: c, closeAll: d } = C(), h = () => {
     c("search");
   }, f = () => {
-    m("search");
+    t("search");
   }, w = () => {
-    m("menu");
+    t("menu");
   };
-  return /* @__PURE__ */ p(H, { currentId: o, open: o === "search" || o === "menu", onClose: n, children: [
-    /* @__PURE__ */ e(_, { ...l, className: s.logo }),
-    /* @__PURE__ */ p(B, { className: s.menu, children: [
+  return /* @__PURE__ */ l(y, { currentId: o, open: o === "search" || o === "menu", onClose: d, children: [
+    /* @__PURE__ */ e(H, { ...p, className: s.logo }),
+    /* @__PURE__ */ l(u, { className: s.menu, children: [
       /* @__PURE__ */ e(
-        b,
+        _,
         {
           color: "company",
           variant: "solid",
@@ -43,10 +43,20 @@ import '../../assets/Header.css';const S = "_drawer_d2s9o_1", I = "_dropdown_d2s
           label: r == null ? void 0 : r.menuLabel
         }
       ),
-      r && /* @__PURE__ */ e(g, { padding: !0, placement: "right", open: o === "menu", className: s.dropdown, children: /* @__PURE__ */ e(t, { ...r, currentAccount: a, onClose: n }) })
+      r && /* @__PURE__ */ e(
+        g,
+        {
+          layout: "desktop",
+          padding: !0,
+          placement: "right",
+          open: o === "menu",
+          className: s.dropdown,
+          children: /* @__PURE__ */ e(m, { ...r, currentAccount: a, onClose: d })
+        }
+      )
     ] }),
-    d && /* @__PURE__ */ e(N, { expanded: o === "search", children: /* @__PURE__ */ e(y, { ...d, expanded: o === "search", onClose: f, onFocus: h }) }),
-    r && /* @__PURE__ */ e(x, { open: o === "menu", className: s.drawer, children: /* @__PURE__ */ e(t, { ...r, currentAccount: a, onClose: n }) })
+    n && /* @__PURE__ */ e(B, { expanded: o === "search", children: /* @__PURE__ */ e(b, { ...n, expanded: o === "search", onClose: f, onFocus: h }) }),
+    r && /* @__PURE__ */ e(x, { layout: "mobile", open: o === "menu", className: s.drawer, children: /* @__PURE__ */ e(m, { ...r, currentAccount: a, onClose: d }) })
   ] });
 };
 export {

package/dist/components/Icon/ProgressIcon.js

@@ -1,9 +1,9 @@
 import { jsxs as o, jsx as t } from "react/jsx-runtime";
 import { c as p } from "../../index-L8X2o7IH.js";
-import '../../assets/ProgressIcon.css';const i = "_progress_e618l_1", g = "_complete_e618l_25", l = {
+import '../../assets/ProgressIcon.css';const i = "_progress_1usqp_1", g = "_complete_1usqp_25", c = {
   progress: i,
   complete: g
-}, C = ({ value: e = 0, total: s = 100, className: c }) => {
+}, C = ({ value: e = 0, total: s = 100, className: l }) => {
   const r = Math.round(e / s * 100);
   if (e === s)
     return /* @__PURE__ */ o(
@@ -14,7 +14,7 @@ import '../../assets/ProgressIcon.css';const i = "_progress_e618l_1", g = "_comp
         viewBox: "0 0 16 16",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg",
-        className: l.complete,
+        className: c.complete,
         children: [
           /* @__PURE__ */ o("title", { children: [
             "Progress ",
@@ -37,7 +37,7 @@ import '../../assets/ProgressIcon.css';const i = "_progress_e618l_1", g = "_comp
   const n = {
     "--progress": `${r}%`
   };
-  return /* @__PURE__ */ t("div", { className: p(l.progress, c), style: n, "data-value": `${r}%` });
+  return /* @__PURE__ */ t("div", { className: p(c.progress, l), style: n, "data-value": `${r}%` });
 };
 export {
   C as ProgressIcon

package/dist/components/Menu/MenuItemBase.js

@@ -1,17 +1,17 @@
-import { jsxs as c, jsx as m } from "react/jsx-runtime";
-import { c as I } from "../../index-L8X2o7IH.js";
-import { Icon as N } from "../Icon/Icon.js";
+import { jsxs as a, jsx as c } from "react/jsx-runtime";
+import { c as N } from "../../index-L8X2o7IH.js";
+import { Icon as u } from "../Icon/Icon.js";
 import "react";
-import { Badge as u } from "../Badge/Badge.js";
+import { Badge as T } from "../Badge/Badge.js";
 import "../RootProvider/RootProvider.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
-import '../../assets/MenuItemBase.css';const T = "_item_kevew_1", j = "_content_kevew_45", B = "_action_kevew_53", E = "_linkText_kevew_60", z = "_linkIcon_kevew_65", e = {
-  item: T,
-  content: j,
-  action: B,
-  linkText: E,
-  linkIcon: z
+import '../../assets/MenuItemBase.css';const j = "_item_7rzvi_1", B = "_content_7rzvi_43", E = "_action_7rzvi_51", k = "_linkText_7rzvi_58", M = "_linkIcon_7rzvi_63", n = {
+  item: j,
+  content: B,
+  action: E,
+  linkText: k,
+  linkIcon: M
 }, O = ({
   as: _,
   color: l,
@@ -19,40 +19,40 @@ import '../../assets/MenuItemBase.css';const T = "_item_kevew_1", j = "_content_
   size: d,
   className: h,
   href: v,
-  onClick: n,
-  onKeyPress: o,
+  onClick: e,
+  onKeyPress: i,
   tabIndex: x = 0,
   hidden: f,
-  selected: k,
-  disabled: i = !1,
-  linkIcon: a,
-  linkText: s,
+  selected: z,
+  disabled: m = !1,
+  linkIcon: o,
+  linkText: r,
   badge: t,
-  children: w
-}) => /* @__PURE__ */ c(
+  children: I
+}) => /* @__PURE__ */ a(
   _ || "a",
   {
-    tabIndex: i ? "-1" : x ?? 0,
-    className: I(e.item, h),
+    tabIndex: m ? "-1" : x ?? 0,
+    className: N(h, n.item),
     "data-size": d,
     "data-color": l,
     "data-theme": p,
     "aria-hidden": f,
-    "aria-disabled": i,
-    "data-selected": k,
+    "aria-disabled": m,
+    "data-selected": z,
     href: v,
-    onKeyPress: (r) => {
-      r.key === "Enter" && (n == null || n()), o == null || o(r);
+    onKeyPress: (s) => {
+      s.key === "Enter" && (e == null || e()), i == null || i(s);
     },
-    onClick: n,
+    onClick: e,
     children: [
-      /* @__PURE__ */ c("div", { className: e.content, children: [
-        w,
-        t && /* @__PURE__ */ m(u, { ...t, theme: (t == null ? void 0 : t.theme) || "surface" })
+      /* @__PURE__ */ a("div", { className: n.content, children: [
+        I,
+        t && /* @__PURE__ */ c(T, { ...t, theme: (t == null ? void 0 : t.theme) || "surface" })
       ] }),
-      a && /* @__PURE__ */ c("div", { className: e.action, children: [
-        s && /* @__PURE__ */ m("span", { className: e.linkText, children: s }),
-        a && /* @__PURE__ */ m(N, { svgElement: a, className: e.linkIcon })
+      o && /* @__PURE__ */ a("div", { className: n.action, children: [
+        r && /* @__PURE__ */ c("span", { className: n.linkText, children: r }),
+        o && /* @__PURE__ */ c(u, { svgElement: o, className: n.linkIcon })
       ] })
     ]
   }

package/dist/components/Page/PageTabs.js

@@ -6,10 +6,10 @@ import { MenuItem as p } from "../Menu/MenuItem.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
 import { Flex as l } from "./Flex.js";
-import '../../assets/PageTabs.css';const n = "_list_gp6cp_1", c = "_item_gp6cp_21", i = {
-  list: n,
-  item: c
-}, N = ({ theme: m = "transparent", color: e, items: s = [], padding: o = 0 }) => /* @__PURE__ */ t(l, { theme: m, color: e, padding: o, children: /* @__PURE__ */ t("ul", { className: i.list, children: s.map((r) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(p, { ...r, className: i.item }) }, r.id)) }) });
+import '../../assets/PageTabs.css';const c = "_list_gp6cp_1", n = "_item_gp6cp_21", r = {
+  list: c,
+  item: n
+}, N = ({ theme: m, color: e, items: o = [], padding: s = 0 }) => /* @__PURE__ */ t(l, { theme: m, color: e, padding: s, children: /* @__PURE__ */ t("ul", { className: r.list, children: o.map((i) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(p, { ...i, className: r.item }) }, i.id)) }) });
 export {
   N as PageTabs
 };