@midas-ds/layout 0.0.54 → 0.1.0
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.
- package/CHANGELOG.md +41 -0
- package/assets/Header.css +1 -1
- package/assets/Main.css +1 -1
- package/assets/NavigationSubMenu.css +1 -1
- package/assets/Sidebar.css +1 -1
- package/chunks/{Header-DZTCJyaZ.js → Header-Wswx-yQj.js} +29 -29
- package/chunks/{Main-CM4QXTmL.js → Main-CyaHtpCj.js} +1 -1
- package/chunks/{NavigationSubMenu-D3hvuVFG.js → NavigationSubMenu-DabVRyqI.js} +39 -39
- package/chunks/{Sidebar-C-d-jJbX.js → Sidebar-DDglufEI.js} +32 -29
- package/header/index.js +1 -1
- package/index.js +4 -4
- package/main/index.js +1 -1
- package/navigation/index.js +1 -1
- package/package.json +2 -2
- package/sidebar/index.js +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,44 @@
|
|
|
1
|
+
## 0.1.0 (2026-04-22)
|
|
2
|
+
|
|
3
|
+
### 🚀 Features
|
|
4
|
+
|
|
5
|
+
- **layout,sidebar:** animate PanelTitle on collapse ([58f4491068a](https://github.com/migrationsverket/midas/commit/58f4491068a))
|
|
6
|
+
|
|
7
|
+
### 🩹 Fixes
|
|
8
|
+
|
|
9
|
+
- **layout,sidebar:** remove deferred display transition to prevent end-of-animation jump ([63b910fa3d1](https://github.com/migrationsverket/midas/commit/63b910fa3d1))
|
|
10
|
+
- **layout,sidebar:** update tests to reflect in-DOM title animation ([136a2a9863e](https://github.com/migrationsverket/midas/commit/136a2a9863e))
|
|
11
|
+
- **layout,navigation:** animate nav label collapse in sidebar ([98018f0ae41](https://github.com/migrationsverket/midas/commit/98018f0ae41))
|
|
12
|
+
- **layout,sidebar:** prevent width shift when scrollbar appears ([a50f58c1b9f](https://github.com/migrationsverket/midas/commit/a50f58c1b9f))
|
|
13
|
+
|
|
14
|
+
### 🔧 Maintenance
|
|
15
|
+
|
|
16
|
+
- **layout:** fix prettier formatting in NavigationLink.module.css ([22830c62173](https://github.com/migrationsverket/midas/commit/22830c62173))
|
|
17
|
+
|
|
18
|
+
## 0.0.58 (2026-04-22)
|
|
19
|
+
|
|
20
|
+
### 🧱 Updated Dependencies
|
|
21
|
+
|
|
22
|
+
- Updated components to 17.13.2
|
|
23
|
+
|
|
24
|
+
## 0.0.57 (2026-04-22)
|
|
25
|
+
|
|
26
|
+
### 🧱 Updated Dependencies
|
|
27
|
+
|
|
28
|
+
- Updated components to 17.13.1
|
|
29
|
+
|
|
30
|
+
## 0.0.56 (2026-04-20)
|
|
31
|
+
|
|
32
|
+
### 🧱 Updated Dependencies
|
|
33
|
+
|
|
34
|
+
- Updated components to 17.13.0
|
|
35
|
+
|
|
36
|
+
## 0.0.55 (2026-04-17)
|
|
37
|
+
|
|
38
|
+
### 🩹 Fixes
|
|
39
|
+
|
|
40
|
+
- **layout, mobile-menu:** add display block to modal overlay ([e2cc226d4e1](https://github.com/migrationsverket/midas/commit/e2cc226d4e1))
|
|
41
|
+
|
|
1
42
|
## 0.0.54 (2026-04-16)
|
|
2
43
|
|
|
3
44
|
### 🧱 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}}.
|
|
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_1gblg_1{display:block}._overlay_1gblg_1[data-entering]{animation:_drawer-blur_1gblg_1 var(--midas-transition-duration-quick)}._overlay_1gblg_1[data-exiting]{animation:_drawer-blur_1gblg_1 var(--midas-transition-duration-quick) reverse var(--midas-transition-timing-ease-in)}._drawer_1gblg_14{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_1gblg_14[data-entering]{animation:_drawer-slide_1gblg_1 var(--midas-transition-duration-quick)}._drawer_1gblg_14[data-exiting]{animation:_drawer-slide_1gblg_1 var(--midas-transition-duration-quick) reverse var(--midas-transition-timing-ease-in)}._dialog_1gblg_39:focus-visible{outline:none}._header_1gblg_45{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_1gblg_1{0%{background:#0000;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{background:var(--midas-overlay-background);-webkit-backdrop-filter:var(--midas-overlay-blur);backdrop-filter:var(--midas-overlay-blur)}}@keyframes _drawer-slide_1gblg_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/Main.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._main_ue6hm_1{box-sizing:border-box;flex:1 1 auto;min-width:0;height:100%;overflow:hidden auto;scrollbar-gutter:stable;padding:1rem}._main_ue6hm_1:focus-visible{box-shadow:var(--midas-state-focus-inset);outline:none}@media(forced-colors:active){._main_ue6hm_1:focus-visible{outline:var(--midas-state-focus-contrast-mode-outline) solid highlight;outline-offset:calc(var(--midas-state-focus-contrast-mode-outline) * -1)}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._rootList_l3v98_1{margin:0;padding:0}._navigationHeader_j94pq_1{color:var(--midas-text-secondary);font-size:var(--midas-typography-font-size-20);padding:var(--midas-spacing-30)}._navigationHeader_j94pq_1._collapsed_j94pq_6{display:none}._navigationItem_1jt2l_1{list-style:none}.
|
|
1
|
+
._rootList_l3v98_1{margin:0;padding:0}._navigationHeader_j94pq_1{color:var(--midas-text-secondary);font-size:var(--midas-typography-font-size-20);padding:var(--midas-spacing-30)}._navigationHeader_j94pq_1._collapsed_j94pq_6{display:none}._navigationItem_1jt2l_1{list-style:none}._navigationLink_1787b_1{align-items:center;align-self:stretch;border-left:var(--midas-size-10) solid transparent;color:var(--midas-text-primary);display:flex;flex-direction:column;flex:1 0 0%;font-family:var(--midas-typography-font-family);gap:var(--midas-spacing-30);justify-content:flex-end;padding:var(--midas-spacing-50);text-decoration:none}._navigationLink_1787b_1[data-hovered],._navigationLink_1787b_1:hover,._navigationLink_1787b_1[data-active]{background-color:var(--midas-menu-item-background-hover)}._navigationLink_1787b_1._sidebar_1787b_21{align-items:flex-start;flex-direction:row;justify-content:flex-start;padding:.625rem var(--midas-spacing-30);transition:padding-inline-start var(--midas-transition-duration-fast) ease-out}._navigationLink_1787b_1._sidebar_1787b_21[data-active]{border-color:var(--midas-border-color-tertiary);font-weight:var(--midas-typography-weight-bold)}._navigationLink_1787b_1._sidebar_1787b_21._collapsed_1787b_34{padding-inline-start:calc((80px - 2 * var(--midas-space-small) - var(--midas-size-90)) / 2)}._navigationLink_1787b_1 svg{flex-shrink:0;height:var(--midas-size-90);width:var(--midas-size-90)}._navigationLink_1787b_1 ._title_1787b_49{display:block;height:auto;interpolate-size:allow-keywords;opacity:1;overflow:hidden;transition:display var(--midas-transition-duration-fast) allow-discrete,height var(--midas-transition-duration-fast) ease-out,opacity var(--midas-transition-duration-instant) ease-out}@starting-style{._navigationLink_1787b_1 ._title_1787b_49{height:0;opacity:0}}._navigationLink_1787b_1._collapsed_1787b_34 ._title_1787b_49{display:none;height:0;opacity:0}._navigationSection_1ae77_1{padding:0;margin:0 0 1rem}._navigationSection_1ae77_1._collapsed_1ae77_5{margin-bottom:0}._navigationSubMenu_vfyl6_1{padding:0;margin:0 0 1rem 1rem}._navigationSubMenu_vfyl6_1._collapsed_vfyl6_5{margin-left:0}
|
package/assets/Sidebar.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._sidebar_c9frf_1{background-color:var(--midas-background-base);border-right:1px solid var(--midas-border-color-subtle);flex-shrink:0;transition:width var(--midas-transition-duration-fast) ease-out;width:15rem}._sidebar_c9frf_1._collapsed_c9frf_8{width:80px}@media(max-width:640px){._sidebar_c9frf_1{display:none}}._sidebarHeader_c9frf_17{gap:0}._sidebarHeader_c9frf_17._collapsed_c9frf_8{justify-content:center;padding:var(--midas-space-small)}._sidebarTitle_c9frf_26{display:block;font-size:var(--midas-typography-font-size-20);height:auto;interpolate-size:allow-keywords;opacity:1;overflow:hidden;transition:height var(--midas-transition-duration-fast) ease-out,opacity var(--midas-transition-duration-instant) ease-out}@starting-style{._sidebarTitle_c9frf_26{height:0;opacity:0}}._sidebarTitle_c9frf_26._collapsed_c9frf_8{display:none;height:0;opacity:0}._sidebarContent_c9frf_49{padding:var(--midas-space-small)}
|
|
@@ -1,35 +1,35 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as e, jsxs as
|
|
2
|
+
import { jsx as e, jsxs as t, Fragment as b } from "react/jsx-runtime";
|
|
3
3
|
import { c } from "./clsx-OuTLNxxd.js";
|
|
4
|
-
import { forwardRef as
|
|
5
|
-
import { composeRenderProps as d, Modal as
|
|
6
|
-
import { Button as m, useLocalizedStringFormatter as
|
|
4
|
+
import { forwardRef as v } from "react";
|
|
5
|
+
import { composeRenderProps as d, Modal as M, Dialog as f } from "react-aria-components";
|
|
6
|
+
import { Button as m, useLocalizedStringFormatter as y, DialogTrigger as N, ModalOverlay as x, Text as A, clsx as w, LogoContext as H } from "@midas-ds/components";
|
|
7
7
|
import { u as h } from "./useIsMobileDevice-D0iMVFPx.js";
|
|
8
|
-
import { M as
|
|
9
|
-
import { c as
|
|
10
|
-
import '../assets/Header.css';const
|
|
11
|
-
headerActions:
|
|
8
|
+
import { M as k } from "./MobileMenuContext-Coj0sJ0N.js";
|
|
9
|
+
import { c as D } from "./createLucideIcon-CP-mMPfa.js";
|
|
10
|
+
import '../assets/Header.css';const $ = "_headerActions_1rka5_1", j = {
|
|
11
|
+
headerActions: $
|
|
12
12
|
}, Z = ({ className: a, ...o }) => /* @__PURE__ */ e(
|
|
13
13
|
"div",
|
|
14
14
|
{
|
|
15
|
-
className: c(a,
|
|
15
|
+
className: c(a, j.headerActions),
|
|
16
16
|
...o
|
|
17
17
|
}
|
|
18
|
-
),
|
|
19
|
-
label:
|
|
20
|
-
}, L =
|
|
21
|
-
({ children: a, icon: o, ...r },
|
|
18
|
+
), P = "_label_1191f_1", z = {
|
|
19
|
+
label: P
|
|
20
|
+
}, L = v(
|
|
21
|
+
({ children: a, icon: o, ...r }, l) => (!a && !r["aria-label"] && process.env.NODE_ENV !== "production" && console.warn(
|
|
22
22
|
"Please provide an 'aria-label' for HeaderAction components that doesnt have a visible label (children)"
|
|
23
23
|
), /* @__PURE__ */ e(
|
|
24
24
|
m,
|
|
25
25
|
{
|
|
26
|
-
ref:
|
|
26
|
+
ref: l,
|
|
27
27
|
size: "medium",
|
|
28
28
|
variant: "tertiary",
|
|
29
29
|
...r,
|
|
30
|
-
children: d(a, (s) => /* @__PURE__ */
|
|
30
|
+
children: d(a, (s) => /* @__PURE__ */ t(b, { children: [
|
|
31
31
|
o,
|
|
32
|
-
typeof s < "u" && /* @__PURE__ */ e("span", { className:
|
|
32
|
+
typeof s < "u" && /* @__PURE__ */ e("span", { className: z.label, children: s })
|
|
33
33
|
] }))
|
|
34
34
|
}
|
|
35
35
|
))
|
|
@@ -39,10 +39,10 @@ const O = [
|
|
|
39
39
|
["path", { d: "M4 5h16", key: "1tepv9" }],
|
|
40
40
|
["path", { d: "M4 12h16", key: "1lakjw" }],
|
|
41
41
|
["path", { d: "M4 19h16", key: "1djgab" }]
|
|
42
|
-
], C =
|
|
42
|
+
], C = D("menu", O), E = { openMenu: "Open menu" }, F = { openMenu: "Öppna meny" }, I = {
|
|
43
43
|
en: E,
|
|
44
44
|
sv: F
|
|
45
|
-
}, R = "
|
|
45
|
+
}, R = "_overlay_1gblg_1", T = "_drawer_1gblg_14", B = "_dialog_1gblg_39", S = "_header_1gblg_45", n = {
|
|
46
46
|
overlay: R,
|
|
47
47
|
drawer: T,
|
|
48
48
|
dialog: B,
|
|
@@ -51,35 +51,35 @@ const O = [
|
|
|
51
51
|
children: a,
|
|
52
52
|
className: o,
|
|
53
53
|
defaultOpen: r,
|
|
54
|
-
isOpen:
|
|
54
|
+
isOpen: l,
|
|
55
55
|
onOpenChange: s,
|
|
56
56
|
title: i,
|
|
57
57
|
...p
|
|
58
58
|
}) => {
|
|
59
|
-
const
|
|
60
|
-
return
|
|
61
|
-
|
|
59
|
+
const _ = h(), g = y(I);
|
|
60
|
+
return _ ? /* @__PURE__ */ e(k.Provider, { value: {}, children: /* @__PURE__ */ t(
|
|
61
|
+
N,
|
|
62
62
|
{
|
|
63
|
-
isOpen:
|
|
63
|
+
isOpen: l,
|
|
64
64
|
onOpenChange: s,
|
|
65
65
|
defaultOpen: r,
|
|
66
66
|
children: [
|
|
67
67
|
/* @__PURE__ */ e(
|
|
68
68
|
m,
|
|
69
69
|
{
|
|
70
|
-
"aria-label":
|
|
70
|
+
"aria-label": g.format("openMenu"),
|
|
71
71
|
icon: C,
|
|
72
72
|
variant: "icon"
|
|
73
73
|
}
|
|
74
74
|
),
|
|
75
75
|
/* @__PURE__ */ e(
|
|
76
|
-
|
|
76
|
+
x,
|
|
77
77
|
{
|
|
78
|
-
className:
|
|
78
|
+
className: w(o, n.overlay),
|
|
79
79
|
isDismissable: !0,
|
|
80
80
|
...p,
|
|
81
|
-
children: d(a, (u) => /* @__PURE__ */ e(
|
|
82
|
-
i && /* @__PURE__ */ e(
|
|
81
|
+
children: d(a, (u) => /* @__PURE__ */ e(M, { className: n.drawer, children: /* @__PURE__ */ t(f, { className: n.dialog, children: [
|
|
82
|
+
i && /* @__PURE__ */ e(A, { className: n.header, children: i }),
|
|
83
83
|
u
|
|
84
84
|
] }) }))
|
|
85
85
|
}
|
|
@@ -91,7 +91,7 @@ const O = [
|
|
|
91
91
|
header: V
|
|
92
92
|
}, ae = ({ className: a, ...o }) => {
|
|
93
93
|
const r = h();
|
|
94
|
-
return /* @__PURE__ */ e(
|
|
94
|
+
return /* @__PURE__ */ e(H.Provider, { value: { size: r ? "x-small" : "large" }, children: /* @__PURE__ */ e(
|
|
95
95
|
"header",
|
|
96
96
|
{
|
|
97
97
|
className: c(a, q.header),
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as a } from "react/jsx-runtime";
|
|
2
2
|
import { c as n } from "./clsx-OuTLNxxd.js";
|
|
3
|
-
import '../assets/Main.css';const i = "
|
|
3
|
+
import '../assets/Main.css';const i = "_main_ue6hm_1", o = {
|
|
4
4
|
main: i
|
|
5
5
|
}, r = ({ className: m, ...s }) => /* @__PURE__ */ a(
|
|
6
6
|
"main",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as
|
|
2
|
+
import { jsx as n, jsxs as v } from "react/jsx-runtime";
|
|
3
3
|
import { Collection as k, OverlayTriggerStateContext as M, Focusable as j, Link as H } from "react-aria-components";
|
|
4
4
|
import { useContext as s } from "react";
|
|
5
5
|
import { Text as I, clsx as S, TooltipTrigger as T, Tooltip as D } from "@midas-ds/components";
|
|
@@ -10,19 +10,19 @@ import { Collection as h } from "@react-aria/collections";
|
|
|
10
10
|
import '../assets/NavigationSubMenu.css';const q = "_rootList_l3v98_1", w = {
|
|
11
11
|
rootList: q
|
|
12
12
|
}, io = ({
|
|
13
|
-
className:
|
|
13
|
+
className: t,
|
|
14
14
|
items: o,
|
|
15
15
|
children: e,
|
|
16
16
|
dependencies: i,
|
|
17
17
|
idScope: c,
|
|
18
18
|
addIdAndValue: a,
|
|
19
19
|
...l
|
|
20
|
-
}) => /* @__PURE__ */
|
|
20
|
+
}) => /* @__PURE__ */ n(
|
|
21
21
|
"nav",
|
|
22
22
|
{
|
|
23
|
-
className:
|
|
23
|
+
className: t,
|
|
24
24
|
...l,
|
|
25
|
-
children: /* @__PURE__ */
|
|
25
|
+
children: /* @__PURE__ */ n("ul", { className: w.rootList, children: /* @__PURE__ */ n(
|
|
26
26
|
k,
|
|
27
27
|
{
|
|
28
28
|
items: o,
|
|
@@ -36,12 +36,12 @@ import '../assets/NavigationSubMenu.css';const q = "_rootList_l3v98_1", w = {
|
|
|
36
36
|
), E = "_navigationHeader_j94pq_1", P = "_collapsed_j94pq_6", f = {
|
|
37
37
|
navigationHeader: E,
|
|
38
38
|
collapsed: P
|
|
39
|
-
}, A = ({ className:
|
|
39
|
+
}, A = ({ className: t, ...o }) => {
|
|
40
40
|
const e = s(r);
|
|
41
|
-
return /* @__PURE__ */
|
|
41
|
+
return /* @__PURE__ */ n(
|
|
42
42
|
I,
|
|
43
43
|
{
|
|
44
|
-
className: S(
|
|
44
|
+
className: S(t, f.navigationHeader, {
|
|
45
45
|
[f.collapsed]: e?.isCollapsed
|
|
46
46
|
}),
|
|
47
47
|
...o
|
|
@@ -49,24 +49,24 @@ import '../assets/NavigationSubMenu.css';const q = "_rootList_l3v98_1", w = {
|
|
|
49
49
|
);
|
|
50
50
|
}, F = "_navigationItem_1jt2l_1", x = {
|
|
51
51
|
navigationItem: F
|
|
52
|
-
}, V = ({ className:
|
|
52
|
+
}, V = ({ className: t, ...o }) => {
|
|
53
53
|
const e = s(r);
|
|
54
|
-
return /* @__PURE__ */
|
|
54
|
+
return /* @__PURE__ */ n(
|
|
55
55
|
"li",
|
|
56
56
|
{
|
|
57
|
-
className: m(
|
|
57
|
+
className: m(t, x.navigationItem, {
|
|
58
58
|
[x.collapsed]: e?.isCollapsed
|
|
59
59
|
}),
|
|
60
60
|
...o
|
|
61
61
|
}
|
|
62
62
|
);
|
|
63
|
-
}, z = "
|
|
63
|
+
}, z = "_navigationLink_1787b_1", B = "_sidebar_1787b_21", G = "_collapsed_1787b_34", J = "_title_1787b_49", p = {
|
|
64
64
|
navigationLink: z,
|
|
65
65
|
sidebar: B,
|
|
66
66
|
collapsed: G,
|
|
67
67
|
title: J
|
|
68
68
|
}, ao = ({
|
|
69
|
-
as:
|
|
69
|
+
as: t,
|
|
70
70
|
children: o,
|
|
71
71
|
className: e,
|
|
72
72
|
isActive: i,
|
|
@@ -74,78 +74,78 @@ import '../assets/NavigationSubMenu.css';const q = "_rootList_l3v98_1", w = {
|
|
|
74
74
|
"aria-label": a,
|
|
75
75
|
...l
|
|
76
76
|
}) => {
|
|
77
|
-
const L = s(O), u = s(r),
|
|
78
|
-
|
|
77
|
+
const L = s(O), u = s(r), g = u?.isCollapsed, b = s(M), $ = t || H, C = () => {
|
|
78
|
+
b?.isOpen && b?.setOpen(!1);
|
|
79
79
|
}, d = typeof o == "string" ? o : void 0;
|
|
80
80
|
return !d && !a && process.env.NODE_ENV !== "production" && console.warn(
|
|
81
81
|
"An 'aria-label' is required for <NavigationLink> elements with non plain text children"
|
|
82
|
-
), /* @__PURE__ */
|
|
83
|
-
/* @__PURE__ */
|
|
82
|
+
), /* @__PURE__ */ v(T, { isDisabled: !g || !d && !a, children: [
|
|
83
|
+
/* @__PURE__ */ n(j, { children: /* @__PURE__ */ v(
|
|
84
84
|
$,
|
|
85
85
|
{
|
|
86
86
|
"aria-current": i && "page",
|
|
87
|
-
"aria-label": a || (
|
|
87
|
+
"aria-label": a || (g ? d : void 0),
|
|
88
88
|
className: S(e, p.navigationLink, {
|
|
89
89
|
[p.sidebar]: u || L,
|
|
90
|
-
[p.collapsed]:
|
|
90
|
+
[p.collapsed]: g
|
|
91
91
|
}),
|
|
92
92
|
"data-active": i || void 0,
|
|
93
|
-
...
|
|
94
|
-
onClick: (
|
|
95
|
-
|
|
93
|
+
...t ? {
|
|
94
|
+
onClick: (_) => {
|
|
95
|
+
C(), l.onClick?.(_);
|
|
96
96
|
}
|
|
97
97
|
} : {
|
|
98
|
-
onPress: (
|
|
99
|
-
|
|
98
|
+
onPress: (_) => {
|
|
99
|
+
C(), l.onPress?.(_);
|
|
100
100
|
}
|
|
101
101
|
},
|
|
102
102
|
...l,
|
|
103
103
|
children: [
|
|
104
104
|
c,
|
|
105
|
-
/* @__PURE__ */
|
|
105
|
+
/* @__PURE__ */ n("span", { className: p.title, children: o })
|
|
106
106
|
]
|
|
107
107
|
}
|
|
108
108
|
) }),
|
|
109
|
-
/* @__PURE__ */
|
|
109
|
+
/* @__PURE__ */ n(D, { placement: "right", children: d })
|
|
110
110
|
] });
|
|
111
|
-
}, K = "_navigationSection_1ae77_1", Q = "_collapsed_1ae77_5",
|
|
111
|
+
}, K = "_navigationSection_1ae77_1", Q = "_collapsed_1ae77_5", N = {
|
|
112
112
|
navigationSection: K,
|
|
113
113
|
collapsed: Q
|
|
114
114
|
}, so = ({
|
|
115
|
-
className:
|
|
115
|
+
className: t,
|
|
116
116
|
title: o,
|
|
117
117
|
...e
|
|
118
118
|
}) => {
|
|
119
119
|
const i = s(r);
|
|
120
|
-
return /* @__PURE__ */
|
|
120
|
+
return /* @__PURE__ */ n(V, { children: /* @__PURE__ */ v(
|
|
121
121
|
"ul",
|
|
122
122
|
{
|
|
123
|
-
className: m(
|
|
124
|
-
[
|
|
123
|
+
className: m(t, N.navigationSection, {
|
|
124
|
+
[N.collapsed]: i?.isCollapsed
|
|
125
125
|
}),
|
|
126
126
|
children: [
|
|
127
|
-
o && /* @__PURE__ */
|
|
128
|
-
/* @__PURE__ */
|
|
127
|
+
o && /* @__PURE__ */ n(A, { children: o }),
|
|
128
|
+
/* @__PURE__ */ n(h, { ...e })
|
|
129
129
|
]
|
|
130
130
|
}
|
|
131
131
|
) });
|
|
132
|
-
}, R = "_navigationSubMenu_vfyl6_1", U = "_collapsed_vfyl6_5",
|
|
132
|
+
}, R = "_navigationSubMenu_vfyl6_1", U = "_collapsed_vfyl6_5", y = {
|
|
133
133
|
navigationSubMenu: R,
|
|
134
134
|
collapsed: U
|
|
135
135
|
}, lo = ({
|
|
136
|
-
className:
|
|
136
|
+
className: t,
|
|
137
137
|
children: o,
|
|
138
138
|
items: e,
|
|
139
139
|
...i
|
|
140
140
|
}) => {
|
|
141
141
|
const c = s(r), { length: a } = Array.from(e || []);
|
|
142
|
-
return typeof o == "function" && a === 0 ? null : /* @__PURE__ */
|
|
142
|
+
return typeof o == "function" && a === 0 ? null : /* @__PURE__ */ n(
|
|
143
143
|
"ul",
|
|
144
144
|
{
|
|
145
|
-
className: m(
|
|
146
|
-
[
|
|
145
|
+
className: m(t, y.navigationSubMenu, {
|
|
146
|
+
[y.collapsed]: c?.isCollapsed
|
|
147
147
|
}),
|
|
148
|
-
children: /* @__PURE__ */
|
|
148
|
+
children: /* @__PURE__ */ n(
|
|
149
149
|
h,
|
|
150
150
|
{
|
|
151
151
|
items: e,
|
|
@@ -1,68 +1,71 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as a, jsxs as
|
|
3
|
-
import { c as
|
|
2
|
+
import { jsx as a, jsxs as l } from "react/jsx-runtime";
|
|
3
|
+
import { c as o } from "./clsx-OuTLNxxd.js";
|
|
4
4
|
import { useLocalizedStringFormatter as h, Button as _ } from "@midas-ds/components";
|
|
5
5
|
import { useControlledState as C } from "@react-stately/utils";
|
|
6
6
|
import { filterDOMProps as x } from "@react-aria/utils";
|
|
7
7
|
import { u as S } from "./useIsMobileDevice-D0iMVFPx.js";
|
|
8
8
|
import { S as u } from "./SidebarContext-CoDRKR2m.js";
|
|
9
|
-
import { c as
|
|
9
|
+
import { c as d } from "./createLucideIcon-CP-mMPfa.js";
|
|
10
10
|
import { P as v, b as y, c as P, a as g } from "./PanelTitle-j0OTJVF9.js";
|
|
11
11
|
import '../assets/Sidebar.css';const k = [
|
|
12
12
|
["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
|
|
13
13
|
["path", { d: "M9 3v18", key: "fh3hqa" }],
|
|
14
14
|
["path", { d: "m16 15-3-3 3-3", key: "14y99z" }]
|
|
15
|
-
], M =
|
|
15
|
+
], M = d("panel-left-close", k);
|
|
16
16
|
const N = [
|
|
17
17
|
["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
|
|
18
18
|
["path", { d: "M9 3v18", key: "fh3hqa" }],
|
|
19
19
|
["path", { d: "m14 9 3 3-3 3", key: "8010ee" }]
|
|
20
|
-
], z =
|
|
20
|
+
], z = d("panel-left-open", N), H = { expandSidebar: "Expand sidebar", collapseSidebar: "Collapse sidebar" }, T = { expandSidebar: "Expandera sidopanel", collapseSidebar: "Minimera sidopanel" }, L = {
|
|
21
21
|
en: H,
|
|
22
|
-
sv:
|
|
23
|
-
}, I = "
|
|
24
|
-
sidebar:
|
|
25
|
-
collapsed:
|
|
26
|
-
sidebarHeader:
|
|
22
|
+
sv: T
|
|
23
|
+
}, D = "_sidebar_c9frf_1", I = "_collapsed_c9frf_8", j = "_sidebarHeader_c9frf_17", q = "_sidebarTitle_c9frf_26", w = "_sidebarContent_c9frf_49", s = {
|
|
24
|
+
sidebar: D,
|
|
25
|
+
collapsed: I,
|
|
26
|
+
sidebarHeader: j,
|
|
27
|
+
sidebarTitle: q,
|
|
27
28
|
sidebarContent: w
|
|
28
|
-
},
|
|
29
|
-
children:
|
|
29
|
+
}, Q = ({
|
|
30
|
+
children: n,
|
|
30
31
|
className: c,
|
|
31
32
|
title: t,
|
|
32
|
-
...
|
|
33
|
+
...r
|
|
33
34
|
}) => {
|
|
34
|
-
const
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
),
|
|
39
|
-
return p ? null : /* @__PURE__ */ a(u.Provider, { value: { isCollapsed: e }, children: /* @__PURE__ */
|
|
35
|
+
const i = h(L), p = S(), [e, f] = C(
|
|
36
|
+
r.isCollapsed,
|
|
37
|
+
r.defaultCollapsed || !1,
|
|
38
|
+
r.onCollapseChange
|
|
39
|
+
), m = () => f((b) => !b);
|
|
40
|
+
return p ? null : /* @__PURE__ */ a(u.Provider, { value: { isCollapsed: e }, children: /* @__PURE__ */ l(
|
|
40
41
|
v,
|
|
41
42
|
{
|
|
42
|
-
className:
|
|
43
|
+
className: o(c, s.sidebar, {
|
|
43
44
|
[s.collapsed]: e
|
|
44
45
|
}),
|
|
45
|
-
...x(
|
|
46
|
+
...x(r),
|
|
46
47
|
children: [
|
|
47
|
-
/* @__PURE__ */
|
|
48
|
+
/* @__PURE__ */ l(
|
|
48
49
|
y,
|
|
49
50
|
{
|
|
50
|
-
className:
|
|
51
|
+
className: o(s.sidebarHeader, {
|
|
51
52
|
[s.collapsed]: e
|
|
52
53
|
}),
|
|
53
54
|
children: [
|
|
54
|
-
|
|
55
|
+
t ? /* @__PURE__ */ a(
|
|
55
56
|
P,
|
|
56
57
|
{
|
|
57
|
-
className: s.
|
|
58
|
+
className: o(s.sidebarTitle, {
|
|
59
|
+
[s.collapsed]: e
|
|
60
|
+
}),
|
|
58
61
|
title: t
|
|
59
62
|
}
|
|
60
63
|
) : /* @__PURE__ */ a("div", {}),
|
|
61
64
|
/* @__PURE__ */ a(
|
|
62
65
|
_,
|
|
63
66
|
{
|
|
64
|
-
"aria-label": e ?
|
|
65
|
-
onPress:
|
|
67
|
+
"aria-label": e ? i.format("expandSidebar") : i.format("collapseSidebar"),
|
|
68
|
+
onPress: m,
|
|
66
69
|
variant: "icon",
|
|
67
70
|
size: e ? "large" : "medium",
|
|
68
71
|
children: e ? /* @__PURE__ */ a(z, { size: 20 }) : /* @__PURE__ */ a(M, { size: 20 })
|
|
@@ -71,11 +74,11 @@ const N = [
|
|
|
71
74
|
]
|
|
72
75
|
}
|
|
73
76
|
),
|
|
74
|
-
/* @__PURE__ */ a(g, { className: s.sidebarContent, children:
|
|
77
|
+
/* @__PURE__ */ a(g, { className: s.sidebarContent, children: n })
|
|
75
78
|
]
|
|
76
79
|
}
|
|
77
80
|
) });
|
|
78
81
|
};
|
|
79
82
|
export {
|
|
80
|
-
|
|
83
|
+
Q as S
|
|
81
84
|
};
|
package/header/index.js
CHANGED
package/index.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { H as o, a as t, b as n, M as r } from "./chunks/Header-
|
|
1
|
+
import { H as o, a as t, b as n, M as r } from "./chunks/Header-Wswx-yQj.js";
|
|
2
2
|
import { L as i, a as x } from "./chunks/LayoutContent-jW-93mu7.js";
|
|
3
|
-
import { M as P } from "./chunks/Main-
|
|
4
|
-
import { N as b, a as d, b as f, c as p, d as M, e as N } from "./chunks/NavigationSubMenu-
|
|
3
|
+
import { M as P } from "./chunks/Main-CyaHtpCj.js";
|
|
4
|
+
import { N as b, a as d, b as f, c as p, d as M, e as N } from "./chunks/NavigationSubMenu-DabVRyqI.js";
|
|
5
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-
|
|
6
|
+
import { S as L } from "./chunks/Sidebar-DDglufEI.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";
|
package/main/index.js
CHANGED
package/navigation/index.js
CHANGED
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
|
|
17
|
+
"version": "0.1.0",
|
|
18
18
|
"module": "./index.js",
|
|
19
19
|
"type": "module",
|
|
20
20
|
"main": "./index.js",
|
|
@@ -37,6 +37,6 @@
|
|
|
37
37
|
"./*": "./*/index.js"
|
|
38
38
|
},
|
|
39
39
|
"dependencies": {
|
|
40
|
-
"@midas-ds/components": "17.
|
|
40
|
+
"@midas-ds/components": "17.13.2"
|
|
41
41
|
}
|
|
42
42
|
}
|
package/sidebar/index.js
CHANGED