@altinn/altinn-components 0.15.2 → 0.15.4

package/README.md

@@ -72,4 +72,41 @@ The tags are:
 - `@deprecated` - The component is deprecated and should not be used.
 
 The main motivation behind having tags is relieving the pressure of having to make everything stable before releasing it for use. 
-It also allows us to get feedback on the components in an early stage.
+It also allows us to get feedback on the components in an early stage.
+
+## Storybook test runner (accessibility)
+Config for the storybook test runner is placed under .storybook/test-runner.ts
+
+
+First you will need to run the storybook: 
+```
+pnpm storybook
+```
+-
+
+When that is done, in another terminal run following command to test all the stories for accessibility
+```
+pnpm test-storybook
+```
+ - 
+
+To test a specific file, run... 
+```
+pnpm test-storybook --watch
+```
+...and press 'p' to choose filtering by file name. Then start typing the name of the storybook file f.ex. 'badge'. The helper will list all the files matching your input. 
+
+Hit enter to test the file. 
+
+If there is more files matching your input, they will also be tested.
+
+- 
+If the storybook cli runs all the tests even with --watch flag, alternatively you can simply run: 
+
+```
+pnpm test-storybook --watch 'MyComponent.stories.tsx'
+```
+
+- 
+To skip the test add 'skip-test' string into the tags array for the test you want to exclude. That option is defined in the test-runner.ts file. 
+Currently all the tests under stories/Demo and docs are excluded as the accessibility test is not needed there.

package/dist/altinn-ds-overrides.css

@@ -17,6 +17,7 @@
 
   --ds-color-alert-contrast-default: var(--ds-color-neutral-contrast-default);
   --ds-color-alert-contrast-subtle: var(--ds-color-neutral-contrast-subtle);
+  --ds-color-alert-base-default: #d82c46;
 
   /* ACCENT = COMPANY */
 

package/dist/assets/ButtonBase.css

@@ -1 +1 @@
-._button_qkur6_1{border:1px solid;border-color:transparent;margin:0;padding:0;width:auto;overflow:visible;background:transparent;text-decoration:none;color:inherit;font:inherit;text-align:inherit;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}._button_qkur6_1:disabled{opacity:.5;pointer-events:none}._button_qkur6_1[data-size=xs]{height:1.875rem}._button_qkur6_1[data-size=sm]{height:2.25rem}._button_qkur6_1[data-size=md]{height:2.75rem}._button_qkur6_1[data-size=lg]{height:3.5rem}._button_qkur6_1[data-variant=solid]{background-color:var(--ds-color-base-default);border-color:var(--ds-color-base-default);color:var(--ds-color-contrast-default)}._button_qkur6_1[data-variant=solid]:hover{background-color:var(--ds-color-base-hover)}._button_qkur6_1[data-variant=solid]:active{background-color:var(--ds-color-base-active)}._button_qkur6_1[data-variant=outline],._button_qkur6_1[data-variant=dotted]{border-color:var(--ds-color-base-default)}._button_qkur6_1[data-variant=outline]{border-style:solid}._button_qkur6_1[data-variant=dotted]{border-style:dotted}._button_qkur6_1[data-variant=text]{border-color:transparent;color:var(--ds-color-text-subtle)}._button_qkur6_1[data-variant=outline]:hover,._button_qkur6_1[data-variant=dotted]:hover,._button_qkur6_1[data-variant=text]:hover{background-color:var(--ds-color-surface-default);color:var(--ds-color-text-default)}._button_qkur6_1[data-variant=outline]:active,._button_qkur6_1[data-variant=dotted]:active,._button_qkur6_1[data-variant=text]:active{background-color:var(--ds-color-surface-active)}._button_qkur6_1[aria-selected=true]{background-color:var(--ds-color-background-subtle);color:var(--ds-color-text-default)}
+._button_mffb6_1{border:1px solid;border-color:transparent;margin:0;padding:0;width:auto;overflow:visible;background:transparent;text-decoration:none;color:inherit;font:inherit;text-align:inherit;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}._button_mffb6_1:disabled{opacity:.5;pointer-events:none}._button_mffb6_1[data-size=xs]{height:1.875rem}._button_mffb6_1[data-size=sm]{height:2.25rem}._button_mffb6_1[data-size=md]{height:2.75rem}._button_mffb6_1[data-size=lg]{height:3.5rem}._button_mffb6_1[data-variant=solid]{background-color:var(--ds-color-base-default);border-color:var(--ds-color-base-default);color:var(--ds-color-contrast-default)}._button_mffb6_1[data-variant=solid]:hover{background-color:var(--ds-color-base-hover)}._button_mffb6_1[data-variant=solid]:active{background-color:var(--ds-color-base-active)}._button_mffb6_1[data-variant=outline],._button_mffb6_1[data-variant=dotted]{border-color:var(--ds-color-base-default)}._button_mffb6_1[data-variant=outline]{border-style:solid}._button_mffb6_1[data-variant=dotted]{border-style:dotted}._button_mffb6_1[data-variant=text]{border-color:transparent;color:var(--ds-color-text-subtle)}._button_mffb6_1[data-variant=outline]:hover,._button_mffb6_1[data-variant=dotted]:hover,._button_mffb6_1[data-variant=text]:hover{background-color:var(--ds-color-surface-default);color:var(--ds-color-text-default)}._button_mffb6_1[data-variant=outline]:active,._button_mffb6_1[data-variant=dotted]:active,._button_mffb6_1[data-variant=text]:active{background-color:var(--ds-color-surface-active)}

package/dist/assets/DialogSelect.css

@@ -1 +1 @@
-._label_p8gvr_1{display:inline-flex;align-items:center;justify-content:center;background-color:transparent;padding:.75rem;border-radius:50%;border:0}._label_p8gvr_1:hover{background-color:var(--ds-color-surface-default)}._input_p8gvr_15{position:absolute;opacity:0}._icon_p8gvr_20{font-size:1.25rem}._icon_p8gvr_20{color:var(--ds-color-base-default)}._icon_p8gvr_20 [data-hover=true]{opacity:0}._label_p8gvr_1:hover [data-hover=true]{opacity:1}
+._label_19rag_1{display:inline-flex;align-items:center;justify-content:center;background-color:transparent;padding:.75rem;border-radius:50%;border:0}._label_19rag_1:hover{background-color:var(--ds-color-surface-default)}._input_19rag_15{display:none}._icon_19rag_19{font-size:1.25rem}._icon_19rag_19{color:var(--ds-color-base-default)}._icon_19rag_19 [data-hover=true]{opacity:0}._label_19rag_1:hover [data-hover=true]{opacity:1}

package/dist/assets/DrawerBase.css

@@ -1 +1 @@
-._drawer_1j8cu_1{display:none}._drawer_1j8cu_1[aria-expanded=true]{display:block;width:100%}._drawer_1j8cu_1[data-placement=bottom]{position:fixed;top:5.5rem;bottom:0;left:0;right:0}
+._drawer_1b2ni_1{display:none}._drawerExpanded_1b2ni_5{display:block;width:100%}._drawer_1b2ni_1[data-placement=bottom]{position:fixed;top:5.5rem;bottom:0;left:0;right:0}

package/dist/assets/DropdownBase.css

@@ -1 +1 @@
-._dropdown_yae8p_1{display:none}._dropdown_yae8p_1[aria-expanded=true]{display:block;position:absolute;z-index:2}._dropdown_yae8p_1[data-placement=left]{left:0}._dropdown_yae8p_1[data-placement=right]{right:0}._dropdown_yae8p_1[data-padding=true]{padding:0 .5rem}._dropdown_yae8p_1{min-width:16rem;max-width:24rem;margin-top:.5rem;border-radius:.375rem;overflow:hidden}._drawer_yae8p_31 ._button_yae8p_31{border-radius:50%}
+._dropdown_1wuga_1{display:none}._dropdownExpanded_1wuga_5{display:block;position:absolute;z-index:2}._dropdown_1wuga_1[data-placement=left]{left:0}._dropdown_1wuga_1[data-placement=right]{right:0}._dropdown_1wuga_1[data-padding=true]{padding:0 .5rem}._dropdown_1wuga_1{min-width:16rem;max-width:24rem;margin-top:.5rem;border-radius:.375rem;overflow:hidden}._drawer_1wuga_31 ._button_1wuga_31{border-radius:50%}

package/dist/assets/HeaderSearch.css

@@ -1 +1 @@
-._search_15b0s_1{width:100%}._search_15b0s_1[aria-expanded=true]{z-index:2}@media (min-width: 1024px){._search_15b0s_1{position:absolute;left:0;right:0;margin:0 auto;max-width:320px}._search_15b0s_1[aria-expanded=true]{max-width:640px}}
+._search_1czaf_1{width:100%}._searchExpanded_1czaf_5{z-index:2}@media (min-width: 1024px){._search_1czaf_1{position:absolute;left:0;right:0;margin:0 auto;max-width:320px}._searchExpanded_1czaf_5{max-width:640px}}

package/dist/assets/ListItemBase.css

@@ -1 +1 @@
-._item_1slti_1{padding:0;border:0;background-color:transparent;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;position:relative;width:100%;display:flex;flex-direction:column}._item_1slti_1[data-shadow=xs]{box-shadow:var(--ds-shadow-xs)}._item_1slti_1[data-variant=outline],._item_1slti_1[data-variant=dotted]{outline-color:var(--ds-color-base-default)}._item_1slti_1[data-variant=outline]{outline-style:solid}._item_1slti_1[data-variant=dotted]{outline-color:var(--ds-color-border-subtle);outline-style:dashed}._item_1slti_1[data-theme=default]{background-color:var(--ds-color-background-default)}._item_1slti_1[data-theme=subtle]{background-color:var(--ds-color-background-subtle)}._interactive_1slti_53[data-theme=subtle]:hover,._item_1slti_1[data-theme=surface]{background-color:var(--ds-color-surface-hover)}._interactive_1slti_53[data-theme=surface]:hover{background-color:var(--ds-color-surface-active)}._item_1slti_1[data-theme=base]{background-color:var(--ds-color-base-default);color:var(--ds-color-contrast-default)}._interactive_1slti_53[data-theme=base]:hover{background-color:var(--ds-color-base-hover);color:var(--ds-color-contrast-default)}._item_1slti_1[data-active=true]{background-color:var(--ds-color-surface-default)}._item_1slti_1[aria-expanded=true],._item_1slti_1[aria-selected=true]{outline:2px solid}._item_1slti_1[aria-disabled=true]{pointer-events:none}._interactive_1slti_53:not([aria-selected=true]){cursor:pointer}._interactive_1slti_53:not([aria-expanded=true]):not([data-theme=transparent]):hover,._interactive_1slti_53:not([aria-selected=true]):not([data-theme=transparent]):hover,._interactive_1slti_53:not([aria-disabled=true]):not([data-theme=transparent]):hover{outline:2px solid var(--ds-color-border-strong)}
+._item_bqpwx_1{padding:0;border:0;background-color:transparent;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;position:relative;width:100%;display:flex;flex-direction:column}._item_bqpwx_1[data-shadow=xs]{box-shadow:var(--ds-shadow-xs)}._item_bqpwx_1[data-variant=outline],._item_bqpwx_1[data-variant=dotted]{outline-color:var(--ds-color-base-default)}._item_bqpwx_1[data-variant=outline]{outline-style:solid}._item_bqpwx_1[data-variant=dotted]{outline-color:var(--ds-color-border-subtle);outline-style:dashed}._item_bqpwx_1[data-theme=default]{background-color:var(--ds-color-background-default)}._item_bqpwx_1[data-theme=subtle]{background-color:var(--ds-color-background-subtle)}._interactive_bqpwx_53[data-theme=subtle]:hover,._item_bqpwx_1[data-theme=surface]{background-color:var(--ds-color-surface-hover)}._interactive_bqpwx_53[data-theme=surface]:hover{background-color:var(--ds-color-surface-active)}._item_bqpwx_1[data-theme=base]{background-color:var(--ds-color-base-default);color:var(--ds-color-contrast-default)}._interactive_bqpwx_53[data-theme=base]:hover{background-color:var(--ds-color-base-hover);color:var(--ds-color-contrast-default)}._item_bqpwx_1[data-active=true]{background-color:var(--ds-color-surface-default)}._item_bqpwx_1[aria-expanded=true],._item_bqpwx_1[aria-selected=true]{outline:2px solid}._item_bqpwx_1[aria-disabled=true]{pointer-events:none}._interactiveSelected_bqpwx_95{outline:2px solid var(--ds-color-border-strong)}._interactiveHidden_bqpwx_99{display:none}._interactive_bqpwx_53:not([data-theme=transparent]):hover{outline:2px solid var(--ds-color-border-strong)}

package/dist/assets/ListItemLabel.css

@@ -1 +1 @@
-._label_1qlgj_3{width:100%}._label_1qlgj_3[data-size=xs]{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}._label_1qlgj_3[data-size=sm],._label_1qlgj_3[data-size=md],._label_1qlgj_3[data-size=lg],._label_1qlgj_3[data-size=xl]{display:flex;flex-direction:column;row-gap:.125rem}._label_1qlgj_3[data-size=xs],._label_1qlgj_3[data-size=sm],._label_1qlgj_3[data-size=md]{font-size:1rem}._label_1qlgj_3[data-size=lg]{font-size:1.125rem}._label_1qlgj_3[data-size=xl]{font-size:1.25rem}._title_1qlgj_44{display:inline;font-size:1em;font-weight:600;line-height:1.125;margin:0}._description_1qlgj_52{display:inline;font-weight:400;line-height:1.125;color:var(--ds-color-text-subtle);margin:0}._description_1qlgj_52[data-size=xs],._description_1qlgj_52[data-size=sm],._description_1qlgj_52[data-size=md],._description_1qlgj_52[data-size=lg],._description_1qlgj_52[data-size=xl]{font-size:.875rem;line-height:1rem}[data-theme=base] ._description_1qlgj_52{color:var(--ds-color-contrast-subtle)}
+._label_lkhmo_3{width:100%}._label_lkhmo_3[data-size=xs]{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}._label_lkhmo_3[data-size=sm],._label_lkhmo_3[data-size=md],._label_lkhmo_3[data-size=lg],._label_lkhmo_3[data-size=xl]{display:flex;flex-direction:column;row-gap:.125rem}._label_lkhmo_3[data-size=xs],._label_lkhmo_3[data-size=sm],._label_lkhmo_3[data-size=md]{font-size:1rem}._label_lkhmo_3[data-size=lg]{font-size:1.125rem}._label_lkhmo_3[data-size=xl]{font-size:1.25rem}._title_lkhmo_44{display:inline;font-size:1em;font-weight:600;line-height:1.125;margin:0}._description_lkhmo_52{display:inline;font-weight:400;line-height:1.125;color:var(--ds-color-text-subtle);margin:0}._description_lkhmo_52[data-size=xs],._description_lkhmo_52[data-size=sm],._description_lkhmo_52[data-size=md],._description_lkhmo_52[data-size=lg],._description_lkhmo_52[data-size=xl]{font-size:.875rem;line-height:1rem}[data-theme=base] ._description_lkhmo_52{color:var(--ds-color-contrast-subtle)}[data-theme=surface] ._description_lkhmo_52{color:var(--ds-color-text-default)}

package/dist/assets/ListItemSelect.css

@@ -1 +1 @@
-._label_1bzff_1{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;background-color:transparent;border-radius:50%;border:0}._label_1bzff_1:hover{background-color:var(--ds-color-surface-default)}._input_1bzff_15{position:absolute;opacity:0}._icon_1bzff_20{color:var(--ds-color-base-default)}._icon_1bzff_20 [data-hover=true]{opacity:0}._label_1bzff_1:hover [data-hover=true]{opacity:1}._label_1bzff_1[data-size=xs] ._icon_1bzff_20{width:16px;height:16px;margin:2px}._label_1bzff_1[data-size=sm] ._icon_1bzff_20{width:16px;height:16px;margin:4px}._label_1bzff_1[data-size=md] ._icon_1bzff_20{width:16px;height:16px;margin:8px}._label_1bzff_1[data-size=lg] ._icon_1bzff_20{width:18px;height:18px;margin:9px}._label_1bzff_1[data-size=xl] ._icon_1bzff_20{width:20px;height:20px;margin:12px}
+._label_1rc60_1{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;background-color:transparent;border-radius:50%;border:0}._label_1rc60_1:hover{background-color:var(--ds-color-surface-default)}._input_1rc60_15{display:none}._icon_1rc60_19{color:var(--ds-color-base-default)}._icon_1rc60_19 [data-hover=true]{opacity:0}._label_1rc60_1:hover [data-hover=true]{opacity:1}._label_1rc60_1[data-size=xs] ._icon_1rc60_19{width:16px;height:16px;margin:2px}._label_1rc60_1[data-size=sm] ._icon_1rc60_19{width:16px;height:16px;margin:4px}._label_1rc60_1[data-size=md] ._icon_1rc60_19{width:16px;height:16px;margin:8px}._label_1rc60_1[data-size=lg] ._icon_1rc60_19{width:18px;height:18px;margin:9px}._label_1rc60_1[data-size=xl] ._icon_1rc60_19{width:20px;height:20px;margin:12px}

package/dist/assets/MenuSearch.css

@@ -1 +1 @@
-._field_15uca_1{position:relative;margin:.5rem 0}._icon_15uca_6{position:absolute;top:0;left:0;font-size:1.25rem;color:var(--ds-color-text-subtle);margin:10px}._input_15uca_15{width:100%;font-size:.875rem;line-height:1rem;font-weight:500;padding:11px 36px;border-radius:2px;border:1px solid;border-color:var(--ds-color-border-default)}._input_15uca_15[type=search]::-webkit-search-decoration,._input_15uca_15[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}._clear_15uca_31{position:absolute;top:0;right:0;margin:10px;border-radius:100%;width:1.25rem;height:1.25rem}
+._field_8g6tu_1{position:relative;margin:.5rem 0}._icon_8g6tu_6{position:absolute;top:0;left:0;font-size:1.25rem;color:var(--ds-color-text-subtle);margin:10px}._input_8g6tu_15{width:100%;font-size:.875rem;line-height:1rem;font-weight:500;padding:11px 36px;border-radius:2px;border:1px solid;border-color:var(--ds-color-border-default)}._input_8g6tu_15[type=search]::-webkit-search-decoration,._input_8g6tu_15[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}._clear_8g6tu_31{position:absolute;top:0;right:0;margin:8px;border-radius:100%;width:1.5rem;height:1.5rem}

package/dist/assets/SearchbarBase.css

@@ -1 +1 @@
-._searchbar_1jrvc_1{position:relative}._searchbar_1jrvc_1[data-autocomplete=true][aria-expanded=true] input{border-bottom-left-radius:0;border-bottom-right-radius:0}._searchbar_1jrvc_1 nav{display:none}._searchbar_1jrvc_1[aria-expanded=true] nav{position:absolute;display:block;border-top-left-radius:0;border-top-right-radius:0;margin-top:-2px}
+._searchbar_1qnvb_1{position:relative}._searchbar_1qnvb_1[data-autocomplete=true][aria-expanded=true] input{border-bottom-left-radius:0;border-bottom-right-radius:0}._searchbar_1qnvb_1 nav{display:none}._searchbarExpanded_1qnvb_14 nav{position:absolute;display:block;border-top-left-radius:0;border-top-right-radius:0;margin-top:-2px}

package/dist/assets/ToolbarFilterBase.css

@@ -1 +1 @@
-._base_l7znv_1{position:relative}._base_l7znv_1[aria-expanded=true]{z-index:2}
+._base_4n04w_1{position:relative}._expanded_4n04w_5{z-index:2}

package/dist/components/Button/ButtonBase.js

@@ -1,29 +1,28 @@
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as u } from "react/jsx-runtime";
 import { c as b } from "../../index-L8X2o7IH.js";
-import '../../assets/ButtonBase.css';const l = "_button_qkur6_1", p = {
-  button: l
+import '../../assets/ButtonBase.css';const f = "_button_mffb6_1", i = {
+  button: f
 }, _ = ({
   as: o,
-  color: a,
-  className: n,
+  color: n,
+  className: a,
   children: s,
   disabled: t = !1,
   size: e,
-  selected: r,
-  variant: c,
-  tabIndex: u = 0,
+  selected: l,
+  variant: r,
+  tabIndex: c = 0,
   ...m
-}) => /* @__PURE__ */ i(
+}) => /* @__PURE__ */ u(
   o || "button",
   {
-    tabIndex: u,
+    tabIndex: c,
     "data-size": e,
-    "data-variant": c,
-    "data-color": a,
-    "aria-selected": r,
+    "data-variant": r,
+    "data-color": n,
     "aria-disabled": t,
     disabled: t,
-    className: b(p.button, n),
+    className: b(i.button, a),
     ...m,
     children: s
   }

package/dist/components/Byline/Byline.js

@@ -21,7 +21,7 @@ import '../../assets/Byline.css';const d = "_byline_160ic_1", y = "_label_160ic_
   children: c
 }) => /* @__PURE__ */ n("div", { className: t.byline, "data-color": o, "data-size": r, children: [
   /* @__PURE__ */ a(m, { variant: "circle", className: t.avatar, loading: e, children: i ? /* @__PURE__ */ a(b, { ...i, size: r, className: t.avatar }) : l && /* @__PURE__ */ a(p, { ...l, size: r, className: t.avatar }) }),
-  /* @__PURE__ */ a("time", { "data-size": r, dateTime: s, className: t.label, children: /* @__PURE__ */ a(m, { loading: e, children: c }) })
+  /* @__PURE__ */ a(m, { loading: e, children: /* @__PURE__ */ a("time", { "data-size": r, dateTime: s, className: t.label, children: c }) })
 ] });
 export {
   B as Byline

package/dist/components/Dialog/DialogHeading.js

@@ -11,7 +11,7 @@ import '../../assets/DialogHeading.css';const p = "_heading_rx9gi_1", c = "_titl
   heading: p,
   title: c
 }, N = ({ loading: i, size: s = "sm", seen: a = !1, state: e, label: r, children: m }) => /* @__PURE__ */ n("div", { className: o.heading, children: [
-  /* @__PURE__ */ t("h2", { className: o.title, "data-seen": a, "data-size": s, "data-state": e, children: /* @__PURE__ */ t(l, { loading: i, children: m }) }),
+  /* @__PURE__ */ t(l, { loading: i, children: /* @__PURE__ */ t("h2", { className: o.title, "data-seen": a, "data-size": s, "data-state": e, children: m }) }),
   !i && r && /* @__PURE__ */ t(d, { type: e, size: "xs", children: r })
 ] });
 export {

package/dist/components/Dialog/DialogListItem.js

@@ -22,71 +22,73 @@ import '../../assets/DialogListItem.css';const K = "_link_1yhch_1", O = "_border
   touchedBy: V,
   heading: W,
   title: X
-}, ht = ({
+}, lt = ({
   size: t = "lg",
   state: x = "normal",
   loading: o,
-  select: m,
-  selected: r,
+  select: s,
+  selected: c,
   status: B,
-  sender: s,
+  sender: h,
   recipient: g,
   recipientLabel: k = "to",
   grouped: I = !1,
   updatedAt: l,
-  updatedAtLabel: h,
-  archivedAt: i,
+  updatedAtLabel: i,
+  archivedAt: n,
   archivedAtLabel: D,
-  trashedAt: n,
+  trashedAt: d,
   trashedAtLabel: L,
   label: S,
   dueAt: j,
   dueAtLabel: v,
-  seen: c = !1,
+  seen: m = !1,
   seenBy: H,
   touchedBy: M,
   attachmentsCount: T,
-  title: d,
+  title: r,
   description: _,
   summary: y,
   theme: q = "default",
   ...p
 }) => {
-  const w = n ? "trashed" : i ? "archived" : x, f = r ? "subtle" : q;
+  const w = d ? "trashed" : n ? "archived" : x, f = c ? "subtle" : q;
   return t === "xs" || t === "sm" || t === "md" ? /* @__PURE__ */ e(
     N,
     {
       ...p,
       size: t,
-      selected: r,
+      selected: c,
       theme: f,
-      label: /* @__PURE__ */ e("div", { className: a.border, "data-size": t, "data-seen": c, "data-loading": o, children: /* @__PURE__ */ e(G, { loading: o, size: t, title: d, description: y || _ }) }),
-      badge: /* @__PURE__ */ e(u, { loading: o, sender: s, updatedAt: l, updatedAtLabel: h })
+      label: /* @__PURE__ */ e("div", { className: a.border, "data-size": t, "data-seen": m, "data-loading": o, children: /* @__PURE__ */ e(G, { loading: o, size: t, title: r, description: y || _ }) }),
+      badge: /* @__PURE__ */ e(u, { loading: o, sender: h, updatedAt: l, updatedAtLabel: i }),
+      title: r
     }
   ) : /* @__PURE__ */ e(
     N,
     {
       ...p,
       size: t,
-      selected: r,
+      selected: c,
       theme: f,
       linkIcon: null,
-      controls: m && /* @__PURE__ */ e(J, { className: a.select, ...m, size: "xl" }),
-      label: /* @__PURE__ */ b("div", { className: a.border, "data-size": t, "data-seen": c, "data-loading": o, children: [
+      controls: s && /* @__PURE__ */ e(J, { className: a.select, ...s, size: "xl" }),
+      title: r,
+      label: /* @__PURE__ */ b("div", { className: a.border, "data-size": t, "data-seen": m, "data-loading": o, children: [
         /* @__PURE__ */ b("header", { className: a.header, "data-size": t, children: [
-          /* @__PURE__ */ e(F, { loading: o, size: t, state: w, label: S, seen: c, children: d }),
+          /* @__PURE__ */ e(F, { loading: o, size: t, state: w, label: S, seen: m, children: r }),
           /* @__PURE__ */ e(
             C,
             {
               size: "xs",
               loading: o,
-              sender: s,
+              sender: h,
               recipient: g,
               recipientLabel: k,
               grouped: I
             }
           ),
-          /* @__PURE__ */ e("p", { "data-size": t, className: a.summary, children: /* @__PURE__ */ e(E, { loading: o, children: y || _ }) })
+          /* @__PURE__ */ e(E, { loading: o, children: /* @__PURE__ */ e("p", { "data-size": t, className: a.summary, children: y || _ }) })
         ] }),
         /* @__PURE__ */ e(
           u,
@@ -95,10 +97,10 @@ import '../../assets/DialogListItem.css';const K = "_link_1yhch_1", O = "_border
             loading: o,
             status: B,
             updatedAt: l,
-            updatedAtLabel: h,
-            archivedAt: i,
+            updatedAtLabel: i,
+            archivedAt: n,
             archivedAtLabel: D,
-            trashedAt: n,
+            trashedAt: d,
             trashedAtLabel: L,
             dueAt: j,
             dueAtLabel: v,
@@ -115,5 +117,5 @@ import '../../assets/DialogListItem.css';const K = "_link_1yhch_1", O = "_border
   );
 };
 export {
-  ht as DialogListItem
+  lt as DialogListItem
 };

package/dist/components/Dialog/DialogSelect.js

@@ -1,19 +1,19 @@
-import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import { jsxs as e, jsx as r } from "react/jsx-runtime";
 import { c as l } from "../../index-L8X2o7IH.js";
 import "react";
 import "../RootProvider/RootProvider.js";
 import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
 import "../Icon/SvgIcon.js";
-import { CheckboxIcon as n } from "../Icon/CheckboxIcon.js";
-import '../../assets/DialogSelect.css';const p = "_label_p8gvr_1", s = "_input_p8gvr_15", a = "_icon_p8gvr_20", o = {
-  label: p,
-  input: s,
-  icon: a
-}, h = ({ checked: t = !1, onChange: e, className: i }) => /* @__PURE__ */ c("label", { className: l(o.label, i), children: [
-  /* @__PURE__ */ r("input", { type: "checkbox", checked: t, onChange: e, className: o.input, tabIndex: -1 }),
-  /* @__PURE__ */ r(n, { hover: !0, checked: t, className: o.icon })
+import { CheckboxIcon as s } from "../Icon/CheckboxIcon.js";
+import '../../assets/DialogSelect.css';const a = "_label_19rag_1", n = "_input_19rag_15", p = "_icon_19rag_19", o = {
+  label: a,
+  input: n,
+  icon: p
+}, N = ({ checked: t = !1, onChange: i, className: c }) => /* @__PURE__ */ e("label", { className: l(o.label, c), children: [
+  /* @__PURE__ */ r("input", { type: "checkbox", checked: t, onChange: i, className: o.input }),
+  /* @__PURE__ */ r(s, { hover: !0, checked: t, className: o.icon })
 ] });
 export {
-  h as DialogSelect
+  N as DialogSelect
 };

package/dist/components/Dropdown/DrawerBase.js

@@ -1,18 +1,22 @@
-import { jsx as d } from "react/jsx-runtime";
-import { c as s } from "../../index-L8X2o7IH.js";
-import '../../assets/DrawerBase.css';const o = "_drawer_1j8cu_1", c = {
-  drawer: o
-}, m = ({ placement: a = "inline", open: e = !1, className: r, children: t }) => /* @__PURE__ */ d(
-  "div",
-  {
-    className: s(c.drawer, r),
-    "data-placement": a,
-    "data-theme": "default",
-    "data-color": "neutral",
-    "aria-expanded": e,
-    children: t
-  }
-);
+import { jsx as s } from "react/jsx-runtime";
+import { c as o } from "../../index-L8X2o7IH.js";
+import '../../assets/DrawerBase.css';const c = "_drawer_1b2ni_1", w = "_drawerExpanded_1b2ni_5", e = {
+  drawer: c,
+  drawerExpanded: w
+}, p = ({ placement: r = "inline", open: a = !1, className: d, children: t }) => {
+  const n = o(e.drawer, d, a && e.drawerExpanded);
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: n,
+      "data-placement": r,
+      "data-theme": "default",
+      "data-color": "neutral",
+      "aria-expanded": a,
+      children: t
+    }
+  );
+};
 export {
-  m as DrawerBase
+  p as DrawerBase
 };

package/dist/components/Dropdown/DropdownBase.js

@@ -1,36 +1,38 @@
-import { jsx as s } from "react/jsx-runtime";
-import { c as p } from "../../index-L8X2o7IH.js";
-import { useRef as m } from "react";
-import { useClickOutside as c } from "../../hooks/useClickOutside.js";
-import '../../assets/DropdownBase.css';const l = "_dropdown_yae8p_1", u = "_drawer_yae8p_31", f = "_button_yae8p_31", i = {
-  dropdown: l,
-  drawer: u,
-  button: f
-}, b = ({
+import { jsx as w } from "react/jsx-runtime";
+import { c as u } from "../../index-L8X2o7IH.js";
+import { useRef as c } from "react";
+import { useClickOutside as l } from "../../hooks/useClickOutside.js";
+import '../../assets/DropdownBase.css';const m = "_dropdown_1wuga_1", _ = "_dropdownExpanded_1wuga_5", f = "_drawer_1wuga_31", i = "_button_1wuga_31", d = {
+  dropdown: m,
+  dropdownExpanded: _,
+  drawer: f,
+  button: i
+}, h = ({
   placement: t = "left",
   padding: a = !0,
-  open: e = !1,
-  className: r,
-  children: d,
-  onClose: n
+  open: r = !1,
+  className: n,
+  children: e,
+  onClose: s
 }) => {
-  const o = m(null);
-  return c(o, n), /* @__PURE__ */ s(
+  const o = c(null);
+  l(o, s);
+  const p = u(d.dropdown, n, r && d.dropdownExpanded);
+  return /* @__PURE__ */ w(
     "div",
     {
       ref: o,
-      className: p(i.dropdown, r),
+      className: p,
       "data-theme": "default",
       "data-color": "neutral",
       "data-shadow": "md",
       "data-placement": t,
       "data-padding": a,
-      "aria-expanded": e,
       role: "menu",
-      children: d
+      children: e
     }
   );
 };
 export {
-  b as DropdownBase
+  h as DropdownBase
 };

package/dist/components/Header/HeaderMenu.js

@@ -1,8 +1,8 @@
-import { jsx as a } from "react/jsx-runtime";
-import { c as m } from "../../index-L8X2o7IH.js";
-import '../../assets/HeaderMenu.css';const r = "_menu_1cafh_1", o = {
-  menu: r
-}, u = ({ expanded: e = !1, className: n, children: s }) => /* @__PURE__ */ a("div", { className: m(o.menu, n), "aria-expanded": e, children: s });
+import { jsx as n } from "react/jsx-runtime";
+import { c as s } from "../../index-L8X2o7IH.js";
+import '../../assets/HeaderMenu.css';const o = "_menu_1cafh_1", r = {
+  menu: o
+}, u = ({ className: e, children: m }) => /* @__PURE__ */ n("div", { className: s(r.menu, e), children: m });
 export {
   u as HeaderMenu
 };

package/dist/components/Header/HeaderSearch.js

@@ -1,8 +1,12 @@
-import { jsx as a } from "react/jsx-runtime";
-import { c } from "../../index-L8X2o7IH.js";
-import '../../assets/HeaderSearch.css';const o = "_search_15b0s_1", t = {
-  search: o
-}, n = ({ expanded: s = !1, className: e, children: r }) => /* @__PURE__ */ a("div", { className: c(t.search, e), "aria-expanded": s, children: r });
+import { jsx as d } from "react/jsx-runtime";
+import { c as h } from "../../index-L8X2o7IH.js";
+import '../../assets/HeaderSearch.css';const t = "_search_1czaf_1", n = "_searchExpanded_1czaf_5", e = {
+  search: t,
+  searchExpanded: n
+}, x = ({ expanded: a = !1, className: s, children: c }) => {
+  const r = h(e.search, s, a && e.searchExpanded);
+  return /* @__PURE__ */ d("div", { className: r, children: c });
+};
 export {
-  n as HeaderSearch
+  x as HeaderSearch
 };

package/dist/components/Icon/Icon.js

@@ -1,7 +1,7 @@
-import { jsx as o } from "react/jsx-runtime";
-import { c as e } from "../../index-L8X2o7IH.js";
+import { jsx as r } from "react/jsx-runtime";
+import { c as a } from "../../index-L8X2o7IH.js";
 import { SvgIcon as h } from "./SvgIcon.js";
-import { iconsMap as m } from "./iconsMap.js";
+import { iconsMap as e } from "./iconsMap.js";
 import "react";
 import "../RootProvider/RootProvider.js";
 import { Skeleton as u } from "../Skeleton/Skeleton.js";
@@ -9,11 +9,11 @@ import "../Search/AutocompleteBase.js";
 import "../Snackbar/useSnackbar.js";
 import '../../assets/Icon.css';const v = "_icon_3p8he_1", s = {
   icon: v
-}, C = ({ loading: p, name: t, size: a, color: l, theme: f, variant: d = "outline", className: n }) => {
-  var i, c;
-  const r = ((i = m[t]) == null ? void 0 : i[d]) ?? ((c = m[t]) == null ? void 0 : c.outline);
-  return r ? /* @__PURE__ */ o(u, { loading: p, variant: "circle", children: /* @__PURE__ */ o("span", { "data-size": a, "data-color": l, "data-theme": f, className: e([s.icon], n), children: /* @__PURE__ */ o(h, { svgIconComponent: r }) }) }) : /* @__PURE__ */ o("span", { className: e([s.icon], n) });
+}, z = ({ loading: p, name: o, size: m, color: l, theme: f, variant: d = "outline", className: t }) => {
+  var n, c;
+  const i = ((n = e[o]) == null ? void 0 : n[d]) ?? ((c = e[o]) == null ? void 0 : c.outline);
+  return i ? /* @__PURE__ */ r(u, { loading: p, variant: "circle", children: /* @__PURE__ */ r("span", { "data-size": m, "data-color": l, "data-theme": f, className: a([s.icon], t), children: /* @__PURE__ */ r(h, { svgIconComponent: i, "aria-label": o }) }) }) : /* @__PURE__ */ r("span", { className: a([s.icon], t), "aria-label": o });
 };
 export {
-  C as Icon
+  z as Icon
 };