@midas-ds/layout 0.0.49 → 0.0.51

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/assets/Header.css +1 -1
  3. package/assets/PanelRegion.css +1 -1
  4. package/assets/PanelTitle.css +1 -1
  5. package/assets/Sidebar.css +1 -1
  6. package/assets/default.css +1 -0
  7. package/chunks/{Header-B9ggmyIG.js → Header-7KGEQAZ2.js} +1 -1
  8. package/chunks/{PanelRegion-zsKP1Rye.js → PanelRegion-D7EnJBY_.js} +55 -54
  9. package/chunks/PanelTitle-j0OTJVF9.js +50 -0
  10. package/chunks/Sidebar-C-d-jJbX.js +81 -0
  11. package/header/index.js +1 -1
  12. package/index.js +14 -13
  13. package/package.json +2 -1
  14. package/panel/Panel.stories.d.ts +169 -169
  15. package/panel/PanelRegion.d.ts +1 -1
  16. package/panel/index.d.ts +1 -0
  17. package/panel/index.js +7 -6
  18. package/panel/panel-body/PanelBody.d.ts +2 -2
  19. package/panel/panel-content/PanelContent.d.ts +3 -0
  20. package/panel/panel-content/index.d.ts +1 -0
  21. package/sidebar/index.js +1 -1
  22. package/chunks/PanelTitle-xkONCSrW.js +0 -38
  23. package/chunks/Sidebar-BFIjN5q6.js +0 -70
package/CHANGELOG.md CHANGED
@@ -1,3 +1,18 @@
1
+ ## 0.0.51 (2026-04-14)
2
+
3
+ ### 🩹 Fixes
4
+
5
+ - **layout, panel, sidebar:** change aria role ([53790fa951](https://github.com/migrationsverket/midas/commit/53790fa951))
6
+ - **layout, sidebar:** update css according to spec ([d9feb0970d](https://github.com/migrationsverket/midas/commit/d9feb0970d))
7
+ - **layout, panel:** update css according to spec ([e047aa7526](https://github.com/migrationsverket/midas/commit/e047aa7526))
8
+ - **layout, header:** update css according to spec ([b950921455](https://github.com/migrationsverket/midas/commit/b950921455))
9
+
10
+ ## 0.0.50 (2026-04-14)
11
+
12
+ ### 🩹 Fixes
13
+
14
+ - **layout:** create and export a reset css ([1b7c31bcc4](https://github.com/migrationsverket/midas/commit/1b7c31bcc4))
15
+
1
16
  ## 0.0.49 (2026-04-14)
2
17
 
3
18
  ### 🧱 Updated Dependencies
package/assets/Header.css CHANGED
@@ -1 +1 @@
1
- ._headerActions_1rka5_1{display:flex;gap:.25rem;align-items:center;margin-inline-start:auto}@media(max-width:640px){._label_1191f_1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}}._overlay_1xtkw_1{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#0000004d;height:var(--page-height);left:0;position:absolute;top:0;width:100%}._overlay_1xtkw_1[data-entering]{animation:_drawer-blur_1xtkw_1 var(--midas-transition-duration-fast)}._overlay_1xtkw_1[data-exiting]{animation:_drawer-blur_1xtkw_1 var(--midas-transition-duration-fast) reverse ease-in}._drawer_1xtkw_19{background-color:var(--midas-background-base);left:0;position:sticky;width:clamp(10rem,15rem,90%);border-right:1px solid var(--midas-border-color-subtle);box-shadow:-8px 0 20px #0000001a;height:calc(100dvh + 200px);margin-right:auto;outline:none;overflow-y:auto;top:-100px}._drawer_1xtkw_19[data-entering]{animation:_drawer-slide_1xtkw_1 var(--midas-transition-duration-fast)}._drawer_1xtkw_19[data-exiting]{animation:_drawer-slide_1xtkw_1 var(--midas-transition-duration-fast) reverse ease-in}._dialog_1xtkw_44:focus-visible{outline:none}._header_1xtkw_50{background-color:var(--midas-background-base);display:block;margin-bottom:var(--midas-space-medium);padding:var(--midas-space-medium);position:sticky;top:0}@keyframes _drawer-blur_1xtkw_1{0%{background:#0000;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{background:#0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}}@keyframes _drawer-slide_1xtkw_1{0%{transform:translate(-100%)}to{transform:translate(0)}}._header_105ne_1{background-color:var(--midas-background-base);display:flex;flex:1 0 auto;padding:1rem}
1
+ ._headerActions_1rka5_1{display:flex;gap:.25rem;align-items:center;margin-inline-start:auto}@media(max-width:640px){._label_1191f_1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}}._overlay_1xtkw_1{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#0000004d;height:var(--page-height);left:0;position:absolute;top:0;width:100%}._overlay_1xtkw_1[data-entering]{animation:_drawer-blur_1xtkw_1 var(--midas-transition-duration-fast)}._overlay_1xtkw_1[data-exiting]{animation:_drawer-blur_1xtkw_1 var(--midas-transition-duration-fast) reverse ease-in}._drawer_1xtkw_19{background-color:var(--midas-background-base);left:0;position:sticky;width:clamp(10rem,15rem,90%);border-right:1px solid var(--midas-border-color-subtle);box-shadow:-8px 0 20px #0000001a;height:calc(100dvh + 200px);margin-right:auto;outline:none;overflow-y:auto;top:-100px}._drawer_1xtkw_19[data-entering]{animation:_drawer-slide_1xtkw_1 var(--midas-transition-duration-fast)}._drawer_1xtkw_19[data-exiting]{animation:_drawer-slide_1xtkw_1 var(--midas-transition-duration-fast) reverse ease-in}._dialog_1xtkw_44:focus-visible{outline:none}._header_1xtkw_50{background-color:var(--midas-background-base);display:block;margin-bottom:var(--midas-space-medium);padding:var(--midas-space-medium);position:sticky;top:0}@keyframes _drawer-blur_1xtkw_1{0%{background:#0000;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{background:#0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}}@keyframes _drawer-slide_1xtkw_1{0%{transform:translate(-100%)}to{transform:translate(0)}}._header_i5439_1{background-color:var(--midas-background-base);border-bottom:1px solid var(--midas-border-color-subtle);display:flex;gap:var(--midas-space-xlarge)}
package/assets/PanelRegion.css CHANGED
@@ -1 +1 @@
1
- ._panel_tzg9l_1{position:absolute!important;top:0;right:0;width:320px;height:100%;overflow:hidden}._panel_tzg9l_1[data-promoting]{animation:_promote_tzg9l_1 var(--midas-transition-duration-fast) ease-out}@media(prefers-reduced-motion:reduce){._panel_tzg9l_1[data-promoting]{animation-duration:1ms}}._panel_tzg9l_1[data-entering]{animation:_slide-horizontally_tzg9l_1 var(--midas-transition-duration-fast)}._panel_tzg9l_1[data-exiting]{animation:_slide-horizontally_tzg9l_1 var(--midas-transition-duration-fast) reverse ease-in}@media(prefers-reduced-motion:reduce){._panel_tzg9l_1[data-entering],._panel_tzg9l_1[data-exiting]{animation-duration:1ms}}@media not (min-width:800px){._panel_tzg9l_1{bottom:0;width:100%;height:25%;left:0;top:unset}._panel_tzg9l_1[data-entering]{animation:_slide-vertically_tzg9l_1 var(--midas-transition-duration-fast)}._panel_tzg9l_1[data-exiting]{animation:_slide-vertically_tzg9l_1 var(--midas-transition-duration-fast) reverse ease-in}}._panelTitle_tzg9l_54{font-size:var(--midas-typography-font-size-20);display:block}@keyframes _promote_tzg9l_1{0%{opacity:.7;transform:scale(.97)}to{opacity:1;transform:scale(1)}}@keyframes _slide-horizontally_tzg9l_1{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes _slide-vertically_tzg9l_1{0%{transform:translateY(100%)}to{transform:translateY(0)}}
1
+ ._panel_kpvat_1{background:var(--midas-background-base);height:100%;overflow:hidden;position:absolute!important;right:0;top:0;width:320px;border-left:1px solid var(--midas-border-color-subtle)}._panel_kpvat_1[data-promoting]{animation:_promote_kpvat_1 var(--midas-transition-duration-fast) ease-out}@media(prefers-reduced-motion:reduce){._panel_kpvat_1[data-promoting]{animation-duration:1ms}}._panel_kpvat_1[data-entering]{animation:_slide-horizontally_kpvat_1 var(--midas-transition-duration-fast)}._panel_kpvat_1[data-exiting]{animation:_slide-horizontally_kpvat_1 var(--midas-transition-duration-fast) reverse ease-in}@media(prefers-reduced-motion:reduce){._panel_kpvat_1[data-entering],._panel_kpvat_1[data-exiting]{animation-duration:1ms}}@media not (min-width:800px){._panel_kpvat_1{bottom:0;width:100%;height:25%;left:0;top:unset;border-left:none;border-top:1px solid var(--midas-border-color-subtle)}._panel_kpvat_1[data-entering]{animation:_slide-vertically_kpvat_1 var(--midas-transition-duration-fast)}._panel_kpvat_1[data-exiting]{animation:_slide-vertically_kpvat_1 var(--midas-transition-duration-fast) reverse ease-in}}._panelTitle_kpvat_59{font-size:var(--midas-typography-font-size-30);font-weight:var(--midas-typography-weight-semi-bold);line-height:var(--midas-typography-line-height-50);display:block}@keyframes _promote_kpvat_1{0%{opacity:.7;transform:scale(.97)}to{opacity:1;transform:scale(1)}}@keyframes _slide-horizontally_kpvat_1{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes _slide-vertically_kpvat_1{0%{transform:translateY(100%)}to{transform:translateY(0)}}
package/assets/PanelTitle.css CHANGED
@@ -1 +1 @@
1
- ._panelBody_aouaw_1{background-color:var(--midas-background-base);box-sizing:border-box;padding:1rem}._panelHeader_11qv1_1{align-items:center;display:flex;justify-content:space-between}._panelTitle_w7y4m_1{display:block}
1
+ ._panelBody_2cx45_1{background-color:var(--midas-background-base);box-sizing:border-box;display:flex;flex-direction:column;gap:var(--midas-space-medium)}._panelContent_ahpqn_1{padding:var(--midas-space-small) var(--midas-space-medium) var(--midas-space-medium) var(--midas-space-medium)}._panelHeader_xyjgl_1{align-items:center;display:flex;justify-content:space-between;padding:var(--midas-space-small) var(--midas-space-small) var(--midas-space-small) var(--midas-space-medium)}._panelTitle_w7y4m_1{display:block}
package/assets/Sidebar.css CHANGED
@@ -1 +1 @@
1
- ._sidebar_z7c8y_1{width:15rem;transition:width var(--midas-transition-duration-fast) ease-out}._sidebar_z7c8y_1._collapsed_z7c8y_5{width:80px}@media(max-width:640px){._sidebar_z7c8y_1{display:none}}._sidebarHeader_z7c8y_14{gap:0}._sidebarTitle_z7c8y_18{font-size:var(--midas-typography-font-size-20);display:block}
1
+ ._sidebar_6a190_1{background-color:var(--midas-background-base);border-right:1px solid var(--midas-border-color-subtle);transition:width var(--midas-transition-duration-fast) ease-out;width:15rem}._sidebar_6a190_1._collapsed_6a190_7{width:80px}@media(max-width:640px){._sidebar_6a190_1{display:none}}._sidebarHeader_6a190_16{gap:0}._sidebarHeader_6a190_16._collapsed_6a190_7{justify-content:center;padding:var(--midas-space-small)}._sidebarTitle_6a190_25{font-size:var(--midas-typography-font-size-20);display:block}._sidebarContent_6a190_30{padding:var(--midas-space-small)}
package/assets/default.css ADDED
@@ -0,0 +1 @@
1
+ html{overflow:hidden}body{margin:0}
package/chunks/{Header-B9ggmyIG.js → Header-7KGEQAZ2.js} RENAMED
@@ -87,7 +87,7 @@ const O = [
87
87
  ]
88
88
  }
89
89
  ) }) : null;
90
- }, V = "_header_105ne_1", q = {
90
+ }, V = "_header_i5439_1", q = {
91
91
  header: V
92
92
  }, ae = ({ className: a, ...o }) => {
93
93
  const r = h();
package/chunks/{PanelRegion-zsKP1Rye.js → PanelRegion-D7EnJBY_.js} RENAMED
@@ -1,31 +1,31 @@
1
1
  'use client';
2
- import { jsx as f, jsxs as g } from "react/jsx-runtime";
3
- import { useRef as b, useEffect as E, forwardRef as _, createContext as v, useState as C, useContext as T } from "react";
4
- import { c as I } from "./clsx-OuTLNxxd.js";
5
- import { useLocalizedStringFormatter as R, Button as j } from "@midas-ds/components";
6
- import { useControlledState as y } from "@react-stately/utils";
7
- import { useExitAnimation as z, useObjectRef as A, useEnterAnimation as S, filterDOMProps as k } from "@react-aria/utils";
8
- import { P as N, a as L, b as M } from "./PanelTitle-xkONCSrW.js";
9
- import { c as w } from "./createLucideIcon-CP-mMPfa.js";
10
- import '../assets/PanelRegion.css';const B = [
2
+ import { jsx as m, jsxs as p } from "react/jsx-runtime";
3
+ import { useRef as b, useEffect as v, forwardRef as E, createContext as C, useState as _, useContext as T } from "react";
4
+ import { c as k } from "./clsx-OuTLNxxd.js";
5
+ import { useLocalizedStringFormatter as I, Button as R } from "@midas-ds/components";
6
+ import { useControlledState as j } from "@react-stately/utils";
7
+ import { useExitAnimation as y, useObjectRef as A, useEnterAnimation as S, filterDOMProps as z } from "@react-aria/utils";
8
+ import { P as N, b as L, c as M, a as w } from "./PanelTitle-j0OTJVF9.js";
9
+ import { c as B } from "./createLucideIcon-CP-mMPfa.js";
10
+ import '../assets/PanelRegion.css';const D = [
11
11
  ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
12
12
  ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
13
- ], D = w("x", B), F = { closePanel: "Close panel" }, H = { closePanel: "Stäng panel" }, X = {
14
- en: F,
15
- sv: H
16
- }, q = "_panel_tzg9l_1", G = "_panelTitle_tzg9l_54", x = {
17
- panel: q,
18
- panelTitle: G
19
- }, J = (o) => {
20
- const { onExited: l } = o, [a, m] = y(
13
+ ], F = B("x", D), H = { closePanel: "Close panel" }, X = { closePanel: "Stäng panel" }, q = {
14
+ en: H,
15
+ sv: X
16
+ }, G = "_panel_kpvat_1", J = "_panelTitle_kpvat_59", x = {
17
+ panel: G,
18
+ panelTitle: J
19
+ }, K = (o) => {
20
+ const { onExited: l } = o, [a, f] = j(
21
21
  o.isOpen,
22
22
  o.defaultOpen || !1,
23
23
  o.onOpenChange
24
- ), s = b(null), r = z(s, a), d = () => m((i) => !i);
25
- return E(() => {
24
+ ), s = b(null), r = y(s, a), d = () => f((i) => !i);
25
+ return v(() => {
26
26
  !a && !r && l?.();
27
- }, [a, r, l]), !a && !r ? null : /* @__PURE__ */ f(
28
- K,
27
+ }, [a, r, l]), !a && !r ? null : /* @__PURE__ */ m(
28
+ Q,
29
29
  {
30
30
  isExiting: r,
31
31
  onPress: d,
@@ -33,12 +33,12 @@ import '../assets/PanelRegion.css';const B = [
33
33
  ...o
34
34
  }
35
35
  );
36
- }, K = _(
36
+ }, Q = E(
37
37
  ({
38
38
  className: o,
39
39
  title: l,
40
40
  onPress: a,
41
- children: m,
41
+ children: f,
42
42
  isExiting: s,
43
43
  defaultOpen: r,
44
44
  promoting: d,
@@ -46,45 +46,46 @@ import '../assets/PanelRegion.css';const B = [
46
46
  "aria-hidden": u,
47
47
  ...t
48
48
  }, e) => {
49
- const n = R(X), c = A(e), P = S(c, !r), O = (p) => {
50
- p.target === p.currentTarget && d && i?.();
49
+ const n = I(q), c = A(e), P = S(c, !r), h = (g) => {
50
+ g.target === g.currentTarget && d && i?.();
51
51
  };
52
- return /* @__PURE__ */ g(
52
+ return /* @__PURE__ */ p(
53
53
  N,
54
54
  {
55
55
  "aria-hidden": u || void 0,
56
- className: I(o, x.panel),
56
+ className: k(o, x.panel),
57
57
  ref: c,
58
58
  "data-entering": P || void 0,
59
59
  "data-exiting": s || void 0,
60
60
  "data-promoting": d || void 0,
61
- onAnimationEnd: O,
62
- ...k(t),
61
+ onAnimationEnd: h,
62
+ ...z(t),
63
63
  children: [
64
- /* @__PURE__ */ g(L, { children: [
65
- /* @__PURE__ */ f("div", { children: l && /* @__PURE__ */ f(
64
+ /* @__PURE__ */ p(L, { children: [
65
+ l ? /* @__PURE__ */ m(
66
66
  M,
67
67
  {
68
68
  className: x.panelTitle,
69
69
  title: l
70
70
  }
71
- ) }),
72
- /* @__PURE__ */ f(
73
- j,
71
+ ) : /* @__PURE__ */ m("div", {}),
72
+ /* @__PURE__ */ m(
73
+ R,
74
74
  {
75
- variant: "icon",
76
75
  "aria-label": n.format("closePanel"),
77
76
  onPress: a,
78
- children: /* @__PURE__ */ f(D, { size: 20 })
77
+ size: "medium",
78
+ variant: "icon",
79
+ children: /* @__PURE__ */ m(F, { size: 20 })
79
80
  }
80
81
  )
81
82
  ] }),
82
- m
83
+ /* @__PURE__ */ m(w, { children: f })
83
84
  ]
84
85
  }
85
86
  );
86
87
  }
87
- ), h = v({
88
+ ), O = C({
88
89
  panels: [],
89
90
  addPanel: () => {
90
91
  },
@@ -94,12 +95,12 @@ import '../assets/PanelRegion.css';const B = [
94
95
  },
95
96
  resetPromoting: () => {
96
97
  }
97
- }), te = ({
98
+ }), oe = ({
98
99
  children: o,
99
100
  defaultPanels: l = [],
100
101
  panelBehavior: a = "bring-to-front"
101
102
  }) => {
102
- const [m, s] = C(
103
+ const [f, s] = _(
103
104
  l.map((t) => ({ ...t, isOpen: !0, defaultOpen: !0 }))
104
105
  ), r = (t) => {
105
106
  s((e) => {
@@ -129,27 +130,27 @@ import '../assets/PanelRegion.css';const B = [
129
130
  (e) => e.map((n) => n.id === t ? { ...n, promoting: !1 } : n)
130
131
  );
131
132
  };
132
- return /* @__PURE__ */ f(
133
- h.Provider,
133
+ return /* @__PURE__ */ m(
134
+ O.Provider,
134
135
  {
135
- value: { panels: m, addPanel: r, closePanel: d, removePanel: i, resetPromoting: u },
136
+ value: { panels: f, addPanel: r, closePanel: d, removePanel: i, resetPromoting: u },
136
137
  children: o
137
138
  }
138
139
  );
139
- }, Q = () => T(h), oe = ({
140
+ }, U = () => T(O), ae = ({
140
141
  children: o,
141
142
  className: l,
142
143
  ...a
143
144
  }) => {
144
- const { panels: m, closePanel: s, removePanel: r, resetPromoting: d } = Q();
145
- return /* @__PURE__ */ g(
146
- "aside",
145
+ const { panels: f, closePanel: s, removePanel: r, resetPromoting: d } = U();
146
+ return /* @__PURE__ */ p(
147
+ "div",
147
148
  {
148
149
  className: l,
149
150
  ...a,
150
151
  children: [
151
- m.map(({ id: i, ...u }, t, { length: e }) => /* @__PURE__ */ f(
152
- J,
152
+ f.map(({ id: i, ...u }, t, { length: e }) => /* @__PURE__ */ m(
153
+ K,
153
154
  {
154
155
  "aria-hidden": t < e - 1 || void 0,
155
156
  id: i,
@@ -169,9 +170,9 @@ import '../assets/PanelRegion.css';const B = [
169
170
  );
170
171
  };
171
172
  export {
172
- J as P,
173
- h as a,
174
- te as b,
175
- oe as c,
176
- Q as u
173
+ K as P,
174
+ O as a,
175
+ oe as b,
176
+ ae as c,
177
+ U as u
177
178
  };
package/chunks/PanelTitle-j0OTJVF9.js ADDED
@@ -0,0 +1,50 @@
1
+ import { jsx as s } from "react/jsx-runtime";
2
+ import { c as l } from "./clsx-OuTLNxxd.js";
3
+ import { forwardRef as t } from "react";
4
+ import { Text as o, clsx as c } from "@midas-ds/components";
5
+ import '../assets/PanelTitle.css';const p = "_panelBody_2cx45_1", r = {
6
+ panelBody: p
7
+ }, H = t(
8
+ ({ className: e, ...n }, a) => /* @__PURE__ */ s(
9
+ "aside",
10
+ {
11
+ ref: a,
12
+ className: l(e, r.panelBody),
13
+ ...n
14
+ }
15
+ )
16
+ ), d = "_panelContent_ahpqn_1", i = {
17
+ panelContent: d
18
+ }, P = t(
19
+ ({ className: e, ...n }, a) => /* @__PURE__ */ s(
20
+ "div",
21
+ {
22
+ ref: a,
23
+ className: l(e, i.panelContent),
24
+ ...n
25
+ }
26
+ )
27
+ ), m = "_panelHeader_xyjgl_1", _ = {
28
+ panelHeader: m
29
+ }, N = ({ className: e, ...n }) => /* @__PURE__ */ s(
30
+ "div",
31
+ {
32
+ className: l(e, _.panelHeader),
33
+ ...n
34
+ }
35
+ ), y = "_panelTitle_w7y4m_1", x = {
36
+ panelTitle: y
37
+ }, $ = ({ className: e, title: n, ...a }) => /* @__PURE__ */ s(
38
+ o,
39
+ {
40
+ className: c(e, x.panelTitle),
41
+ ...a,
42
+ children: n
43
+ }
44
+ );
45
+ export {
46
+ H as P,
47
+ P as a,
48
+ N as b,
49
+ $ as c
50
+ };
package/chunks/Sidebar-C-d-jJbX.js ADDED
@@ -0,0 +1,81 @@
1
+ 'use client';
2
+ import { jsx as a, jsxs as i } from "react/jsx-runtime";
3
+ import { c as l } from "./clsx-OuTLNxxd.js";
4
+ import { useLocalizedStringFormatter as h, Button as _ } from "@midas-ds/components";
5
+ import { useControlledState as C } from "@react-stately/utils";
6
+ import { filterDOMProps as x } from "@react-aria/utils";
7
+ import { u as S } from "./useIsMobileDevice-D0iMVFPx.js";
8
+ import { S as u } from "./SidebarContext-CoDRKR2m.js";
9
+ import { c as n } from "./createLucideIcon-CP-mMPfa.js";
10
+ import { P as v, b as y, c as P, a as g } from "./PanelTitle-j0OTJVF9.js";
11
+ import '../assets/Sidebar.css';const k = [
12
+ ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
13
+ ["path", { d: "M9 3v18", key: "fh3hqa" }],
14
+ ["path", { d: "m16 15-3-3 3-3", key: "14y99z" }]
15
+ ], M = n("panel-left-close", k);
16
+ const N = [
17
+ ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
18
+ ["path", { d: "M9 3v18", key: "fh3hqa" }],
19
+ ["path", { d: "m14 9 3 3-3 3", key: "8010ee" }]
20
+ ], z = n("panel-left-open", N), H = { expandSidebar: "Expand sidebar", collapseSidebar: "Collapse sidebar" }, L = { expandSidebar: "Expandera sidopanel", collapseSidebar: "Minimera sidopanel" }, D = {
21
+ en: H,
22
+ sv: L
23
+ }, I = "_sidebar_6a190_1", j = "_collapsed_6a190_7", q = "_sidebarHeader_6a190_16", w = "_sidebarContent_6a190_30", s = {
24
+ sidebar: I,
25
+ collapsed: j,
26
+ sidebarHeader: q,
27
+ sidebarContent: w
28
+ }, K = ({
29
+ children: d,
30
+ className: c,
31
+ title: t,
32
+ ...o
33
+ }) => {
34
+ const r = h(D), p = S(), [e, m] = C(
35
+ o.isCollapsed,
36
+ o.defaultCollapsed || !1,
37
+ o.onCollapseChange
38
+ ), b = () => m((f) => !f);
39
+ return p ? null : /* @__PURE__ */ a(u.Provider, { value: { isCollapsed: e }, children: /* @__PURE__ */ i(
40
+ v,
41
+ {
42
+ className: l(c, s.sidebar, {
43
+ [s.collapsed]: e
44
+ }),
45
+ ...x(o),
46
+ children: [
47
+ /* @__PURE__ */ i(
48
+ y,
49
+ {
50
+ className: l(s.sidebarHeader, {
51
+ [s.collapsed]: e
52
+ }),
53
+ children: [
54
+ !e && t ? /* @__PURE__ */ a(
55
+ P,
56
+ {
57
+ className: s.panelTitle,
58
+ title: t
59
+ }
60
+ ) : /* @__PURE__ */ a("div", {}),
61
+ /* @__PURE__ */ a(
62
+ _,
63
+ {
64
+ "aria-label": e ? r.format("expandSidebar") : r.format("collapseSidebar"),
65
+ onPress: b,
66
+ variant: "icon",
67
+ size: e ? "large" : "medium",
68
+ children: e ? /* @__PURE__ */ a(z, { size: 20 }) : /* @__PURE__ */ a(M, { size: 20 })
69
+ }
70
+ )
71
+ ]
72
+ }
73
+ ),
74
+ /* @__PURE__ */ a(g, { className: s.sidebarContent, children: d })
75
+ ]
76
+ }
77
+ ) });
78
+ };
79
+ export {
80
+ K as S
81
+ };
package/header/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { H as o, a as r, b as s, M as t } from "../chunks/Header-B9ggmyIG.js";
1
+ import { H as o, a as r, b as s, M as t } from "../chunks/Header-7KGEQAZ2.js";
2
2
  import { M as n } from "../chunks/MobileMenuContext-Coj0sJ0N.js";
3
3
  export {
4
4
  o as Header,
package/index.js CHANGED
@@ -1,21 +1,21 @@
1
- import { H as o, a as t, b as r, M as n } from "./chunks/Header-B9ggmyIG.js";
1
+ import { H as o, a as t, b as n, M as r } from "./chunks/Header-7KGEQAZ2.js";
2
2
  import { L as i, a as x } from "./chunks/LayoutContent-jW-93mu7.js";
3
- import { M as m } from "./chunks/Main-CM4QXTmL.js";
3
+ import { M as P } from "./chunks/Main-CM4QXTmL.js";
4
4
  import { N as b, a as d, b as f, c as p, d as M, e as N } from "./chunks/NavigationSubMenu-D3hvuVFG.js";
5
- import { P as v, a as g, b as H, c as S, u as c } from "./chunks/PanelRegion-zsKP1Rye.js";
6
- import { S as L } from "./chunks/Sidebar-BFIjN5q6.js";
5
+ import { P as v, a as g, b as c, c as H, u as S } from "./chunks/PanelRegion-D7EnJBY_.js";
6
+ import { S as L } from "./chunks/Sidebar-C-d-jJbX.js";
7
7
  import { S as A } from "./chunks/SidebarContext-CoDRKR2m.js";
8
8
  import { N as B } from "./chunks/Navbar-Do2dFMRr.js";
9
9
  import { M as R } from "./chunks/MobileMenuContext-Coj0sJ0N.js";
10
- import { P as h, a as j, b as q } from "./chunks/PanelTitle-xkONCSrW.js";
10
+ import { P as h, a as j, b as q, c as w } from "./chunks/PanelTitle-j0OTJVF9.js";
11
11
  export {
12
12
  o as Header,
13
13
  t as HeaderAction,
14
- r as HeaderActions,
14
+ n as HeaderActions,
15
15
  i as Layout,
16
16
  x as LayoutContent,
17
- m as Main,
18
- n as MobileMenu,
17
+ P as Main,
18
+ r as MobileMenu,
19
19
  R as MobileMenuContext,
20
20
  B as Navbar,
21
21
  b as Navigation,
@@ -26,12 +26,13 @@ export {
26
26
  N as NavigationSubMenu,
27
27
  v as Panel,
28
28
  h as PanelBody,
29
+ j as PanelContent,
29
30
  g as PanelContext,
30
- j as PanelHeader,
31
- H as PanelProvider,
32
- S as PanelRegion,
33
- q as PanelTitle,
31
+ q as PanelHeader,
32
+ c as PanelProvider,
33
+ H as PanelRegion,
34
+ w as PanelTitle,
34
35
  L as Sidebar,
35
36
  A as SidebarContext,
36
- c as usePanels
37
+ S as usePanels
37
38
  };
package/package.json CHANGED
@@ -14,7 +14,7 @@
14
14
  "description": "Midas Layout components",
15
15
  "homepage": "https://designsystem.migrationsverket.se/",
16
16
  "license": "CC0-1.0",
17
- "version": "0.0.49",
17
+ "version": "0.0.51",
18
18
  "module": "./index.js",
19
19
  "type": "module",
20
20
  "main": "./index.js",
@@ -32,6 +32,7 @@
32
32
  },
33
33
  "exports": {
34
34
  ".": "./index.js",
35
+ "./default.css": "./assets/default.css",
35
36
  "./*/index.js": "./*/index.js",
36
37
  "./*": "./*/index.js"
37
38
  },
package/panel/Panel.stories.d.ts CHANGED
@@ -20,7 +20,7 @@ declare const _default: {
20
20
  onExited?: (() => void) | undefined;
21
21
  promoting?: boolean | undefined;
22
22
  onPromotionEnd?: (() => void) | undefined;
23
- ref?: import('react').Ref<HTMLDivElement> | undefined;
23
+ ref?: import('react').Ref<HTMLElement> | undefined;
24
24
  key?: import('react').Key | null | undefined;
25
25
  defaultChecked?: boolean | undefined | undefined;
26
26
  defaultValue?: string | number | readonly string[] | undefined;
@@ -133,174 +133,174 @@ declare const _default: {
133
133
  dangerouslySetInnerHTML?: {
134
134
  __html: string | TrustedHTML;
135
135
  } | undefined | undefined;
136
- onCopy?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
137
- onCopyCapture?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
138
- onCut?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
139
- onCutCapture?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
140
- onPaste?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
141
- onPasteCapture?: import('react').ClipboardEventHandler<HTMLDivElement> | undefined;
142
- onCompositionEnd?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
143
- onCompositionEndCapture?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
144
- onCompositionStart?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
145
- onCompositionStartCapture?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
146
- onCompositionUpdate?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
147
- onCompositionUpdateCapture?: import('react').CompositionEventHandler<HTMLDivElement> | undefined;
148
- onFocus?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
149
- onFocusCapture?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
150
- onBlur?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
151
- onBlurCapture?: import('react').FocusEventHandler<HTMLDivElement> | undefined;
152
- onChange?: import('react').ChangeEventHandler<HTMLDivElement, Element> | undefined;
153
- onChangeCapture?: import('react').ChangeEventHandler<HTMLDivElement, Element> | undefined;
154
- onBeforeInput?: import('react').InputEventHandler<HTMLDivElement> | undefined;
155
- onBeforeInputCapture?: import('react').InputEventHandler<HTMLDivElement> | undefined;
156
- onInput?: import('react').InputEventHandler<HTMLDivElement> | undefined;
157
- onInputCapture?: import('react').InputEventHandler<HTMLDivElement> | undefined;
158
- onReset?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
159
- onResetCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
160
- onSubmit?: import('react').SubmitEventHandler<HTMLDivElement> | undefined;
161
- onSubmitCapture?: import('react').SubmitEventHandler<HTMLDivElement> | undefined;
162
- onInvalid?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
163
- onInvalidCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
164
- onLoad?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
165
- onLoadCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
166
- onError?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
167
- onErrorCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
168
- onKeyDown?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
169
- onKeyDownCapture?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
170
- onKeyPress?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
171
- onKeyPressCapture?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
172
- onKeyUp?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
173
- onKeyUpCapture?: import('react').KeyboardEventHandler<HTMLDivElement> | undefined;
174
- onAbort?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
175
- onAbortCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
176
- onCanPlay?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
177
- onCanPlayCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
178
- onCanPlayThrough?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
179
- onCanPlayThroughCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
180
- onDurationChange?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
181
- onDurationChangeCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
182
- onEmptied?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
183
- onEmptiedCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
184
- onEncrypted?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
185
- onEncryptedCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
186
- onEnded?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
187
- onEndedCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
188
- onLoadedData?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
189
- onLoadedDataCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
190
- onLoadedMetadata?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
191
- onLoadedMetadataCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
192
- onLoadStart?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
193
- onLoadStartCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
194
- onPause?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
195
- onPauseCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
196
- onPlay?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
197
- onPlayCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
198
- onPlaying?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
199
- onPlayingCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
200
- onProgress?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
201
- onProgressCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
202
- onRateChange?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
203
- onRateChangeCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
204
- onSeeked?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
205
- onSeekedCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
206
- onSeeking?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
207
- onSeekingCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
208
- onStalled?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
209
- onStalledCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
210
- onSuspend?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
211
- onSuspendCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
212
- onTimeUpdate?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
213
- onTimeUpdateCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
214
- onVolumeChange?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
215
- onVolumeChangeCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
216
- onWaiting?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
217
- onWaitingCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
218
- onAuxClick?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
219
- onAuxClickCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
220
- onClick?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
221
- onClickCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
222
- onContextMenu?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
223
- onContextMenuCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
224
- onDoubleClick?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
225
- onDoubleClickCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
226
- onDrag?: import('react').DragEventHandler<HTMLDivElement> | undefined;
227
- onDragCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
228
- onDragEnd?: import('react').DragEventHandler<HTMLDivElement> | undefined;
229
- onDragEndCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
230
- onDragEnter?: import('react').DragEventHandler<HTMLDivElement> | undefined;
231
- onDragEnterCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
232
- onDragExit?: import('react').DragEventHandler<HTMLDivElement> | undefined;
233
- onDragExitCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
234
- onDragLeave?: import('react').DragEventHandler<HTMLDivElement> | undefined;
235
- onDragLeaveCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
236
- onDragOver?: import('react').DragEventHandler<HTMLDivElement> | undefined;
237
- onDragOverCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
238
- onDragStart?: import('react').DragEventHandler<HTMLDivElement> | undefined;
239
- onDragStartCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
240
- onDrop?: import('react').DragEventHandler<HTMLDivElement> | undefined;
241
- onDropCapture?: import('react').DragEventHandler<HTMLDivElement> | undefined;
242
- onMouseDown?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
243
- onMouseDownCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
244
- onMouseEnter?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
245
- onMouseLeave?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
246
- onMouseMove?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
247
- onMouseMoveCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
248
- onMouseOut?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
249
- onMouseOutCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
250
- onMouseOver?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
251
- onMouseOverCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
252
- onMouseUp?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
253
- onMouseUpCapture?: import('react').MouseEventHandler<HTMLDivElement> | undefined;
254
- onSelect?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
255
- onSelectCapture?: import('react').ReactEventHandler<HTMLDivElement> | undefined;
256
- onTouchCancel?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
257
- onTouchCancelCapture?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
258
- onTouchEnd?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
259
- onTouchEndCapture?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
260
- onTouchMove?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
261
- onTouchMoveCapture?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
262
- onTouchStart?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
263
- onTouchStartCapture?: import('react').TouchEventHandler<HTMLDivElement> | undefined;
264
- onPointerDown?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
265
- onPointerDownCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
266
- onPointerMove?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
267
- onPointerMoveCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
268
- onPointerUp?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
269
- onPointerUpCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
270
- onPointerCancel?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
271
- onPointerCancelCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
272
- onPointerEnter?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
273
- onPointerLeave?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
274
- onPointerOver?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
275
- onPointerOverCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
276
- onPointerOut?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
277
- onPointerOutCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
278
- onGotPointerCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
279
- onGotPointerCaptureCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
280
- onLostPointerCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
281
- onLostPointerCaptureCapture?: import('react').PointerEventHandler<HTMLDivElement> | undefined;
282
- onScroll?: import('react').UIEventHandler<HTMLDivElement> | undefined;
283
- onScrollCapture?: import('react').UIEventHandler<HTMLDivElement> | undefined;
284
- onScrollEnd?: import('react').UIEventHandler<HTMLDivElement> | undefined;
285
- onScrollEndCapture?: import('react').UIEventHandler<HTMLDivElement> | undefined;
286
- onWheel?: import('react').WheelEventHandler<HTMLDivElement> | undefined;
287
- onWheelCapture?: import('react').WheelEventHandler<HTMLDivElement> | undefined;
288
- onAnimationStart?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
289
- onAnimationStartCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
290
- onAnimationEnd?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
291
- onAnimationEndCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
292
- onAnimationIteration?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
293
- onAnimationIterationCapture?: import('react').AnimationEventHandler<HTMLDivElement> | undefined;
294
- onToggle?: import('react').ToggleEventHandler<HTMLDivElement> | undefined;
295
- onBeforeToggle?: import('react').ToggleEventHandler<HTMLDivElement> | undefined;
296
- onTransitionCancel?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
297
- onTransitionCancelCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
298
- onTransitionEnd?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
299
- onTransitionEndCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
300
- onTransitionRun?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
301
- onTransitionRunCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
302
- onTransitionStart?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
303
- onTransitionStartCapture?: import('react').TransitionEventHandler<HTMLDivElement> | undefined;
136
+ onCopy?: import('react').ClipboardEventHandler<HTMLElement> | undefined;
137
+ onCopyCapture?: import('react').ClipboardEventHandler<HTMLElement> | undefined;
138
+ onCut?: import('react').ClipboardEventHandler<HTMLElement> | undefined;
139
+ onCutCapture?: import('react').ClipboardEventHandler<HTMLElement> | undefined;
140
+ onPaste?: import('react').ClipboardEventHandler<HTMLElement> | undefined;
141
+ onPasteCapture?: import('react').ClipboardEventHandler<HTMLElement> | undefined;
142
+ onCompositionEnd?: import('react').CompositionEventHandler<HTMLElement> | undefined;
143
+ onCompositionEndCapture?: import('react').CompositionEventHandler<HTMLElement> | undefined;
144
+ onCompositionStart?: import('react').CompositionEventHandler<HTMLElement> | undefined;
145
+ onCompositionStartCapture?: import('react').CompositionEventHandler<HTMLElement> | undefined;
146
+ onCompositionUpdate?: import('react').CompositionEventHandler<HTMLElement> | undefined;
147
+ onCompositionUpdateCapture?: import('react').CompositionEventHandler<HTMLElement> | undefined;
148
+ onFocus?: import('react').FocusEventHandler<HTMLElement> | undefined;
149
+ onFocusCapture?: import('react').FocusEventHandler<HTMLElement> | undefined;
150
+ onBlur?: import('react').FocusEventHandler<HTMLElement> | undefined;
151
+ onBlurCapture?: import('react').FocusEventHandler<HTMLElement> | undefined;
152
+ onChange?: import('react').ChangeEventHandler<HTMLElement, Element> | undefined;
153
+ onChangeCapture?: import('react').ChangeEventHandler<HTMLElement, Element> | undefined;
154
+ onBeforeInput?: import('react').InputEventHandler<HTMLElement> | undefined;
155
+ onBeforeInputCapture?: import('react').InputEventHandler<HTMLElement> | undefined;
156
+ onInput?: import('react').InputEventHandler<HTMLElement> | undefined;
157
+ onInputCapture?: import('react').InputEventHandler<HTMLElement> | undefined;
158
+ onReset?: import('react').ReactEventHandler<HTMLElement> | undefined;
159
+ onResetCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
160
+ onSubmit?: import('react').SubmitEventHandler<HTMLElement> | undefined;
161
+ onSubmitCapture?: import('react').SubmitEventHandler<HTMLElement> | undefined;
162
+ onInvalid?: import('react').ReactEventHandler<HTMLElement> | undefined;
163
+ onInvalidCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
164
+ onLoad?: import('react').ReactEventHandler<HTMLElement> | undefined;
165
+ onLoadCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
166
+ onError?: import('react').ReactEventHandler<HTMLElement> | undefined;
167
+ onErrorCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
168
+ onKeyDown?: import('react').KeyboardEventHandler<HTMLElement> | undefined;
169
+ onKeyDownCapture?: import('react').KeyboardEventHandler<HTMLElement> | undefined;
170
+ onKeyPress?: import('react').KeyboardEventHandler<HTMLElement> | undefined;
171
+ onKeyPressCapture?: import('react').KeyboardEventHandler<HTMLElement> | undefined;
172
+ onKeyUp?: import('react').KeyboardEventHandler<HTMLElement> | undefined;
173
+ onKeyUpCapture?: import('react').KeyboardEventHandler<HTMLElement> | undefined;
174
+ onAbort?: import('react').ReactEventHandler<HTMLElement> | undefined;
175
+ onAbortCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
176
+ onCanPlay?: import('react').ReactEventHandler<HTMLElement> | undefined;
177
+ onCanPlayCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
178
+ onCanPlayThrough?: import('react').ReactEventHandler<HTMLElement> | undefined;
179
+ onCanPlayThroughCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
180
+ onDurationChange?: import('react').ReactEventHandler<HTMLElement> | undefined;
181
+ onDurationChangeCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
182
+ onEmptied?: import('react').ReactEventHandler<HTMLElement> | undefined;
183
+ onEmptiedCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
184
+ onEncrypted?: import('react').ReactEventHandler<HTMLElement> | undefined;
185
+ onEncryptedCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
186
+ onEnded?: import('react').ReactEventHandler<HTMLElement> | undefined;
187
+ onEndedCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
188
+ onLoadedData?: import('react').ReactEventHandler<HTMLElement> | undefined;
189
+ onLoadedDataCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
190
+ onLoadedMetadata?: import('react').ReactEventHandler<HTMLElement> | undefined;
191
+ onLoadedMetadataCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
192
+ onLoadStart?: import('react').ReactEventHandler<HTMLElement> | undefined;
193
+ onLoadStartCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
194
+ onPause?: import('react').ReactEventHandler<HTMLElement> | undefined;
195
+ onPauseCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
196
+ onPlay?: import('react').ReactEventHandler<HTMLElement> | undefined;
197
+ onPlayCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
198
+ onPlaying?: import('react').ReactEventHandler<HTMLElement> | undefined;
199
+ onPlayingCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
200
+ onProgress?: import('react').ReactEventHandler<HTMLElement> | undefined;
201
+ onProgressCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
202
+ onRateChange?: import('react').ReactEventHandler<HTMLElement> | undefined;
203
+ onRateChangeCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
204
+ onSeeked?: import('react').ReactEventHandler<HTMLElement> | undefined;
205
+ onSeekedCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
206
+ onSeeking?: import('react').ReactEventHandler<HTMLElement> | undefined;
207
+ onSeekingCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
208
+ onStalled?: import('react').ReactEventHandler<HTMLElement> | undefined;
209
+ onStalledCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
210
+ onSuspend?: import('react').ReactEventHandler<HTMLElement> | undefined;
211
+ onSuspendCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
212
+ onTimeUpdate?: import('react').ReactEventHandler<HTMLElement> | undefined;
213
+ onTimeUpdateCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
214
+ onVolumeChange?: import('react').ReactEventHandler<HTMLElement> | undefined;
215
+ onVolumeChangeCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
216
+ onWaiting?: import('react').ReactEventHandler<HTMLElement> | undefined;
217
+ onWaitingCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
218
+ onAuxClick?: import('react').MouseEventHandler<HTMLElement> | undefined;
219
+ onAuxClickCapture?: import('react').MouseEventHandler<HTMLElement> | undefined;
220
+ onClick?: import('react').MouseEventHandler<HTMLElement> | undefined;
221
+ onClickCapture?: import('react').MouseEventHandler<HTMLElement> | undefined;
222
+ onContextMenu?: import('react').MouseEventHandler<HTMLElement> | undefined;
223
+ onContextMenuCapture?: import('react').MouseEventHandler<HTMLElement> | undefined;
224
+ onDoubleClick?: import('react').MouseEventHandler<HTMLElement> | undefined;
225
+ onDoubleClickCapture?: import('react').MouseEventHandler<HTMLElement> | undefined;
226
+ onDrag?: import('react').DragEventHandler<HTMLElement> | undefined;
227
+ onDragCapture?: import('react').DragEventHandler<HTMLElement> | undefined;
228
+ onDragEnd?: import('react').DragEventHandler<HTMLElement> | undefined;
229
+ onDragEndCapture?: import('react').DragEventHandler<HTMLElement> | undefined;
230
+ onDragEnter?: import('react').DragEventHandler<HTMLElement> | undefined;
231
+ onDragEnterCapture?: import('react').DragEventHandler<HTMLElement> | undefined;
232
+ onDragExit?: import('react').DragEventHandler<HTMLElement> | undefined;
233
+ onDragExitCapture?: import('react').DragEventHandler<HTMLElement> | undefined;
234
+ onDragLeave?: import('react').DragEventHandler<HTMLElement> | undefined;
235
+ onDragLeaveCapture?: import('react').DragEventHandler<HTMLElement> | undefined;
236
+ onDragOver?: import('react').DragEventHandler<HTMLElement> | undefined;
237
+ onDragOverCapture?: import('react').DragEventHandler<HTMLElement> | undefined;
238
+ onDragStart?: import('react').DragEventHandler<HTMLElement> | undefined;
239
+ onDragStartCapture?: import('react').DragEventHandler<HTMLElement> | undefined;
240
+ onDrop?: import('react').DragEventHandler<HTMLElement> | undefined;
241
+ onDropCapture?: import('react').DragEventHandler<HTMLElement> | undefined;
242
+ onMouseDown?: import('react').MouseEventHandler<HTMLElement> | undefined;
243
+ onMouseDownCapture?: import('react').MouseEventHandler<HTMLElement> | undefined;
244
+ onMouseEnter?: import('react').MouseEventHandler<HTMLElement> | undefined;
245
+ onMouseLeave?: import('react').MouseEventHandler<HTMLElement> | undefined;
246
+ onMouseMove?: import('react').MouseEventHandler<HTMLElement> | undefined;
247
+ onMouseMoveCapture?: import('react').MouseEventHandler<HTMLElement> | undefined;
248
+ onMouseOut?: import('react').MouseEventHandler<HTMLElement> | undefined;
249
+ onMouseOutCapture?: import('react').MouseEventHandler<HTMLElement> | undefined;
250
+ onMouseOver?: import('react').MouseEventHandler<HTMLElement> | undefined;
251
+ onMouseOverCapture?: import('react').MouseEventHandler<HTMLElement> | undefined;
252
+ onMouseUp?: import('react').MouseEventHandler<HTMLElement> | undefined;
253
+ onMouseUpCapture?: import('react').MouseEventHandler<HTMLElement> | undefined;
254
+ onSelect?: import('react').ReactEventHandler<HTMLElement> | undefined;
255
+ onSelectCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
256
+ onTouchCancel?: import('react').TouchEventHandler<HTMLElement> | undefined;
257
+ onTouchCancelCapture?: import('react').TouchEventHandler<HTMLElement> | undefined;
258
+ onTouchEnd?: import('react').TouchEventHandler<HTMLElement> | undefined;
259
+ onTouchEndCapture?: import('react').TouchEventHandler<HTMLElement> | undefined;
260
+ onTouchMove?: import('react').TouchEventHandler<HTMLElement> | undefined;
261
+ onTouchMoveCapture?: import('react').TouchEventHandler<HTMLElement> | undefined;
262
+ onTouchStart?: import('react').TouchEventHandler<HTMLElement> | undefined;
263
+ onTouchStartCapture?: import('react').TouchEventHandler<HTMLElement> | undefined;
264
+ onPointerDown?: import('react').PointerEventHandler<HTMLElement> | undefined;
265
+ onPointerDownCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
266
+ onPointerMove?: import('react').PointerEventHandler<HTMLElement> | undefined;
267
+ onPointerMoveCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
268
+ onPointerUp?: import('react').PointerEventHandler<HTMLElement> | undefined;
269
+ onPointerUpCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
270
+ onPointerCancel?: import('react').PointerEventHandler<HTMLElement> | undefined;
271
+ onPointerCancelCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
272
+ onPointerEnter?: import('react').PointerEventHandler<HTMLElement> | undefined;
273
+ onPointerLeave?: import('react').PointerEventHandler<HTMLElement> | undefined;
274
+ onPointerOver?: import('react').PointerEventHandler<HTMLElement> | undefined;
275
+ onPointerOverCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
276
+ onPointerOut?: import('react').PointerEventHandler<HTMLElement> | undefined;
277
+ onPointerOutCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
278
+ onGotPointerCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
279
+ onGotPointerCaptureCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
280
+ onLostPointerCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
281
+ onLostPointerCaptureCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
282
+ onScroll?: import('react').UIEventHandler<HTMLElement> | undefined;
283
+ onScrollCapture?: import('react').UIEventHandler<HTMLElement> | undefined;
284
+ onScrollEnd?: import('react').UIEventHandler<HTMLElement> | undefined;
285
+ onScrollEndCapture?: import('react').UIEventHandler<HTMLElement> | undefined;
286
+ onWheel?: import('react').WheelEventHandler<HTMLElement> | undefined;
287
+ onWheelCapture?: import('react').WheelEventHandler<HTMLElement> | undefined;
288
+ onAnimationStart?: import('react').AnimationEventHandler<HTMLElement> | undefined;
289
+ onAnimationStartCapture?: import('react').AnimationEventHandler<HTMLElement> | undefined;
290
+ onAnimationEnd?: import('react').AnimationEventHandler<HTMLElement> | undefined;
291
+ onAnimationEndCapture?: import('react').AnimationEventHandler<HTMLElement> | undefined;
292
+ onAnimationIteration?: import('react').AnimationEventHandler<HTMLElement> | undefined;
293
+ onAnimationIterationCapture?: import('react').AnimationEventHandler<HTMLElement> | undefined;
294
+ onToggle?: import('react').ToggleEventHandler<HTMLElement> | undefined;
295
+ onBeforeToggle?: import('react').ToggleEventHandler<HTMLElement> | undefined;
296
+ onTransitionCancel?: import('react').TransitionEventHandler<HTMLElement> | undefined;
297
+ onTransitionCancelCapture?: import('react').TransitionEventHandler<HTMLElement> | undefined;
298
+ onTransitionEnd?: import('react').TransitionEventHandler<HTMLElement> | undefined;
299
+ onTransitionEndCapture?: import('react').TransitionEventHandler<HTMLElement> | undefined;
300
+ onTransitionRun?: import('react').TransitionEventHandler<HTMLElement> | undefined;
301
+ onTransitionRunCapture?: import('react').TransitionEventHandler<HTMLElement> | undefined;
302
+ onTransitionStart?: import('react').TransitionEventHandler<HTMLElement> | undefined;
303
+ onTransitionStartCapture?: import('react').TransitionEventHandler<HTMLElement> | undefined;
304
304
  }>) => import("react/jsx-runtime").JSX.Element)[];
305
305
  };
306
306
  export default _default;
package/panel/PanelRegion.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { DetailedHTMLProps, HTMLAttributes } from 'react';
2
- export type PanelRegionProps = DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
2
+ export type PanelRegionProps = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
3
3
  export declare const PanelRegion: ({ children, className, ...rest }: PanelRegionProps) => import("react/jsx-runtime").JSX.Element;
package/panel/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  export * from './panel-body';
2
+ export * from './panel-content';
2
3
  export * from './panel-header';
3
4
  export * from './panel-title';
4
5
  export * from './Panel';
package/panel/index.js CHANGED
@@ -1,12 +1,13 @@
1
- import { P, a as n, b as s, c as l, u as o } from "../chunks/PanelRegion-zsKP1Rye.js";
2
- import { P as t, a as d, b as i } from "../chunks/PanelTitle-xkONCSrW.js";
1
+ import { P as n, a as P, b as s, c as l, u as o } from "../chunks/PanelRegion-D7EnJBY_.js";
2
+ import { P as t, a as d, b as i, c as x } from "../chunks/PanelTitle-j0OTJVF9.js";
3
3
  export {
4
- P as Panel,
4
+ n as Panel,
5
5
  t as PanelBody,
6
- n as PanelContext,
7
- d as PanelHeader,
6
+ d as PanelContent,
7
+ P as PanelContext,
8
+ i as PanelHeader,
8
9
  s as PanelProvider,
9
10
  l as PanelRegion,
10
- i as PanelTitle,
11
+ x as PanelTitle,
11
12
  o as usePanels
12
13
  };
package/panel/panel-body/PanelBody.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { DetailedHTMLProps, HTMLAttributes } from 'react';
2
- export type PanelBodyProps = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
3
- export declare const PanelBody: import('react').ForwardRefExoticComponent<Omit<PanelBodyProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
2
+ export type PanelBodyProps = DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
3
+ export declare const PanelBody: import('react').ForwardRefExoticComponent<Omit<PanelBodyProps, "ref"> & import('react').RefAttributes<HTMLElement>>;
package/panel/panel-content/PanelContent.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { DetailedHTMLProps, HTMLAttributes } from 'react';
2
+ export type PanelContentProps = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
3
+ export declare const PanelContent: import('react').ForwardRefExoticComponent<Omit<PanelContentProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
package/panel/panel-content/index.d.ts ADDED
@@ -0,0 +1 @@
1
+ export * from './PanelContent';
package/sidebar/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { S as o } from "../chunks/Sidebar-BFIjN5q6.js";
1
+ import { S as o } from "../chunks/Sidebar-C-d-jJbX.js";
2
2
  import { S as t } from "../chunks/SidebarContext-CoDRKR2m.js";
3
3
  export {
4
4
  o as Sidebar,
package/chunks/PanelTitle-xkONCSrW.js DELETED
@@ -1,38 +0,0 @@
1
- import { jsx as s } from "react/jsx-runtime";
2
- import { c as n } from "./clsx-OuTLNxxd.js";
3
- import { forwardRef as o } from "react";
4
- import { Text as t, clsx as c } from "@midas-ds/components";
5
- import '../assets/PanelTitle.css';const p = "_panelBody_aouaw_1", r = {
6
- panelBody: p
7
- }, B = o(
8
- ({ className: e, ...a }, l) => /* @__PURE__ */ s(
9
- "div",
10
- {
11
- ref: l,
12
- className: n(e, r.panelBody),
13
- ...a
14
- }
15
- )
16
- ), d = "_panelHeader_11qv1_1", i = {
17
- panelHeader: d
18
- }, H = ({ className: e, ...a }) => /* @__PURE__ */ s(
19
- "div",
20
- {
21
- className: n(e, i.panelHeader),
22
- ...a
23
- }
24
- ), m = "_panelTitle_w7y4m_1", y = {
25
- panelTitle: m
26
- }, P = ({ className: e, title: a, ...l }) => /* @__PURE__ */ s(
27
- t,
28
- {
29
- className: c(e, y.panelTitle),
30
- ...l,
31
- children: a
32
- }
33
- );
34
- export {
35
- B as P,
36
- H as a,
37
- P as b
38
- };
package/chunks/Sidebar-BFIjN5q6.js DELETED
@@ -1,70 +0,0 @@
1
- 'use client';
2
- import { jsx as e, jsxs as r } from "react/jsx-runtime";
3
- import { c as h } from "./clsx-OuTLNxxd.js";
4
- import { useLocalizedStringFormatter as b, Button as x } from "@midas-ds/components";
5
- import { useControlledState as y } from "@react-stately/utils";
6
- import { filterDOMProps as S } from "@react-aria/utils";
7
- import { u as v } from "./useIsMobileDevice-D0iMVFPx.js";
8
- import { S as u } from "./SidebarContext-CoDRKR2m.js";
9
- import { c as t } from "./createLucideIcon-CP-mMPfa.js";
10
- import { P as C, a as P, b as _ } from "./PanelTitle-xkONCSrW.js";
11
- import '../assets/Sidebar.css';const g = [
12
- ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
13
- ["path", { d: "M9 3v18", key: "fh3hqa" }],
14
- ["path", { d: "m16 15-3-3 3-3", key: "14y99z" }]
15
- ], k = t("panel-left-close", g);
16
- const z = [
17
- ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
18
- ["path", { d: "M9 3v18", key: "fh3hqa" }],
19
- ["path", { d: "m14 9 3 3-3 3", key: "8010ee" }]
20
- ], M = t("panel-left-open", z), L = { expandSidebar: "Expand sidebar", collapseSidebar: "Collapse sidebar" }, N = { expandSidebar: "Expandera sidopanel", collapseSidebar: "Minimera sidopanel" }, D = {
21
- en: L,
22
- sv: N
23
- }, I = "_sidebar_z7c8y_1", j = "_collapsed_z7c8y_5", o = {
24
- sidebar: I,
25
- collapsed: j
26
- }, A = ({
27
- children: n,
28
- className: d,
29
- title: l,
30
- ...s
31
- }) => {
32
- const i = b(D), c = v(), [a, p] = y(
33
- s.isCollapsed,
34
- s.defaultCollapsed || !1,
35
- s.onCollapseChange
36
- ), m = () => p((f) => !f);
37
- return c ? null : /* @__PURE__ */ e(u.Provider, { value: { isCollapsed: a }, children: /* @__PURE__ */ e(
38
- C,
39
- {
40
- className: h(d, o.sidebar, {
41
- [o.collapsed]: a
42
- }),
43
- ...S(s),
44
- children: /* @__PURE__ */ r("aside", { children: [
45
- /* @__PURE__ */ r(P, { children: [
46
- /* @__PURE__ */ e("div", { children: !a && l && /* @__PURE__ */ e(
47
- _,
48
- {
49
- className: o.panelTitle,
50
- title: l
51
- }
52
- ) }),
53
- /* @__PURE__ */ e(
54
- x,
55
- {
56
- variant: "icon",
57
- "aria-label": a ? i.format("expandSidebar") : i.format("collapseSidebar"),
58
- onPress: m,
59
- children: a ? /* @__PURE__ */ e(M, { size: 20 }) : /* @__PURE__ */ e(k, { size: 20 })
60
- }
61
- )
62
- ] }),
63
- n
64
- ] })
65
- }
66
- ) });
67
- };
68
- export {
69
- A as S
70
- };