@midas-ds/layout 0.0.21 → 0.0.23

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 (59) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/assets/Header.css +1 -1
  3. package/assets/NavigationSubMenu.css +1 -1
  4. package/assets/PanelRegion.css +1 -0
  5. package/assets/PanelTitle.css +1 -0
  6. package/assets/Sidebar.css +1 -0
  7. package/chunks/Header-B1Nk3vII.js +89 -0
  8. package/chunks/LayoutContent-CvlzZxeo.js +23 -0
  9. package/chunks/Main-Dt0CIYBE.js +14 -0
  10. package/chunks/Navbar-Do2dFMRr.js +14 -0
  11. package/chunks/NavigationSubMenu-G-WkaNZA.js +164 -0
  12. package/chunks/PanelRegion-zsKP1Rye.js +177 -0
  13. package/chunks/PanelTitle-xkONCSrW.js +38 -0
  14. package/chunks/Sidebar-BFIjN5q6.js +70 -0
  15. package/chunks/SidebarContext-CoDRKR2m.js +8 -0
  16. package/chunks/clsx-OuTLNxxd.js +16 -0
  17. package/header/index.js +1 -1
  18. package/header/mobile-menu/MobileMenu.d.ts +6 -7
  19. package/index.d.ts +1 -0
  20. package/index.js +31 -31
  21. package/layout/index.js +1 -1
  22. package/main/index.js +1 -1
  23. package/navbar/index.js +1 -1
  24. package/navigation/index.js +1 -1
  25. package/navigation/navigation-header/NavigationHeader.d.ts +1 -2
  26. package/navigation/navigation-section/NavigationSection.d.ts +2 -2
  27. package/package.json +2 -2
  28. package/panel/Panel.d.ts +10 -10
  29. package/panel/Panel.stories.d.ts +2 -4
  30. package/panel/PanelContext.d.ts +12 -3
  31. package/panel/PanelProvider.d.ts +9 -0
  32. package/panel/PanelRegion.d.ts +3 -0
  33. package/panel/index.d.ts +5 -4
  34. package/panel/index.js +9 -13
  35. package/panel/intl/translations.json.d.ts +0 -4
  36. package/panel/panel-body/PanelBody.d.ts +3 -3
  37. package/panel/usePanels.d.ts +1 -0
  38. package/sidebar/Sidebar.d.ts +7 -0
  39. package/sidebar/SidebarContext.d.ts +3 -0
  40. package/sidebar/index.d.ts +2 -0
  41. package/sidebar/index.js +6 -0
  42. package/sidebar/intl/translations.json.d.ts +13 -0
  43. package/assets/Panel.css +0 -1
  44. package/chunks/Header-T5EUvNY7.js +0 -98
  45. package/chunks/LayoutContent-DhVL-boV.js +0 -22
  46. package/chunks/Main-Ce4U9_ce.js +0 -13
  47. package/chunks/Navbar-wOOCcsru.js +0 -13
  48. package/chunks/NavigationSubMenu-C-M26YYp.js +0 -171
  49. package/chunks/Panel-C-B48gnt.js +0 -281
  50. package/chunks/PanelContext-D6WQ7_yb.js +0 -11
  51. package/panel/collapse-panel/CollapsePanel.d.ts +0 -8
  52. package/panel/collapse-panel/CollapsePanelContext.d.ts +0 -3
  53. package/panel/collapse-panel/index.d.ts +0 -2
  54. package/panel/dismiss-panel/DismissPanel.d.ts +0 -11
  55. package/panel/dismiss-panel/DismissPanelContext.d.ts +0 -12
  56. package/panel/dismiss-panel/DismissPanelOutlet.d.ts +0 -3
  57. package/panel/dismiss-panel/DismissPanelProvider.d.ts +0 -9
  58. package/panel/dismiss-panel/index.d.ts +0 -5
  59. package/panel/dismiss-panel/useDismissPanels.d.ts +0 -1
@@ -1,171 +0,0 @@
1
- 'use client';
2
- import { jsx as n, jsxs as v } from "react/jsx-runtime";
3
- import { Collection as S, OverlayTriggerStateContext as M, Focusable as $, Link as k } from "react-aria-components";
4
- import { useContext as s } from "react";
5
- import { Text as j, clsx as d, TooltipTrigger as H, Tooltip as I } from "@midas-ds/components";
6
- import { C as p, P } from "./PanelContext-D6WQ7_yb.js";
7
- import { M as T } from "./MobileMenuContext-Coj0sJ0N.js";
8
- import { Collection as b } from "@react-aria/collections";
9
- import '../assets/NavigationSubMenu.css';const D = "_rootList_l3v98_1", O = {
10
- rootList: D
11
- }, to = ({
12
- className: t,
13
- items: o,
14
- children: a,
15
- dependencies: e,
16
- idScope: i,
17
- addIdAndValue: c,
18
- ...l
19
- }) => /* @__PURE__ */ n(
20
- "nav",
21
- {
22
- className: t,
23
- ...l,
24
- children: /* @__PURE__ */ n("ul", { className: O.rootList, children: /* @__PURE__ */ n(
25
- S,
26
- {
27
- items: o,
28
- children: a,
29
- dependencies: e,
30
- idScope: i,
31
- addIdAndValue: c
32
- }
33
- ) })
34
- }
35
- ), q = "_navigationHeader_j94pq_1", F = "_collapsed_j94pq_6", C = {
36
- navigationHeader: q,
37
- collapsed: F
38
- }, w = ({
39
- className: t,
40
- ...o
41
- }) => {
42
- const { isCollapsed: a } = s(p);
43
- return /* @__PURE__ */ n(
44
- j,
45
- {
46
- className: d(t, C.navigationHeader, {
47
- [C.collapsed]: a
48
- }),
49
- ...o
50
- }
51
- );
52
- }, z = "_navigationItem_1jt2l_1", N = {
53
- navigationItem: z
54
- }, A = ({ className: t, ...o }) => {
55
- const { isCollapsed: a } = s(p);
56
- return /* @__PURE__ */ n(
57
- "li",
58
- {
59
- className: d(t, N.navigationItem, {
60
- [N.collapsed]: a
61
- }),
62
- ...o
63
- }
64
- );
65
- }, B = "_navigationLink_tfdcf_1", E = "_collapse_tfdcf_21", G = "_collapsed_tfdcf_37", J = "_title_tfdcf_40", r = {
66
- navigationLink: B,
67
- collapse: E,
68
- collapsed: G,
69
- title: J
70
- }, ao = ({
71
- as: t,
72
- children: o,
73
- className: a,
74
- isActive: e,
75
- title: i,
76
- "aria-label": c,
77
- ...l
78
- }) => {
79
- const { variant: m } = s(P), x = s(T), { isCollapsed: g } = s(p), u = s(M), L = t || k, f = () => {
80
- u?.isOpen && u?.setOpen(!1);
81
- };
82
- return /* @__PURE__ */ v(H, { isDisabled: !g, children: [
83
- /* @__PURE__ */ n($, { children: /* @__PURE__ */ v(
84
- L,
85
- {
86
- "aria-current": e && "page",
87
- "aria-label": c || (g ? i : void 0),
88
- className: d(
89
- a,
90
- r.navigationLink,
91
- m && r[m],
92
- x && r.collapse,
93
- {
94
- [r.collapsed]: g
95
- }
96
- ),
97
- "data-active": e || void 0,
98
- ...t ? {
99
- onClick: (_) => {
100
- f(), l.onClick?.(_);
101
- }
102
- } : {
103
- onPress: (_) => {
104
- f(), l.onPress?.(_);
105
- }
106
- },
107
- ...l,
108
- children: [
109
- o,
110
- /* @__PURE__ */ n("span", { className: r.title, children: i })
111
- ]
112
- }
113
- ) }),
114
- /* @__PURE__ */ n(I, { placement: "right", children: i })
115
- ] });
116
- }, K = "_navigationSection_1ae77_1", Q = "_collapsed_1ae77_5", h = {
117
- navigationSection: K,
118
- collapsed: Q
119
- }, eo = ({
120
- className: t,
121
- title: o,
122
- ...a
123
- }) => {
124
- const { isCollapsed: e } = s(p);
125
- return /* @__PURE__ */ n(A, { children: /* @__PURE__ */ v(
126
- "ul",
127
- {
128
- className: d(t, h.navigationSection, {
129
- [h.collapsed]: e
130
- }),
131
- children: [
132
- o && /* @__PURE__ */ n(w, { children: o }),
133
- /* @__PURE__ */ n(b, { ...a })
134
- ]
135
- }
136
- ) });
137
- }, R = "_navigationSubMenu_vfyl6_1", U = "_collapsed_vfyl6_5", y = {
138
- navigationSubMenu: R,
139
- collapsed: U
140
- }, so = ({
141
- className: t,
142
- children: o,
143
- items: a,
144
- ...e
145
- }) => {
146
- const { isCollapsed: i } = s(p), { length: c } = Array.from(a || []);
147
- return typeof o == "function" && c === 0 ? null : /* @__PURE__ */ n(
148
- "ul",
149
- {
150
- className: d(t, y.navigationSubMenu, {
151
- [y.collapsed]: i
152
- }),
153
- children: /* @__PURE__ */ n(
154
- b,
155
- {
156
- items: a,
157
- ...e,
158
- children: o
159
- }
160
- )
161
- }
162
- );
163
- };
164
- export {
165
- to as N,
166
- w as a,
167
- A as b,
168
- ao as c,
169
- eo as d,
170
- so as e
171
- };
@@ -1,281 +0,0 @@
1
- 'use client';
2
- import { jsx as l, jsxs as P } from "react/jsx-runtime";
3
- import { forwardRef as b, useRef as z, useEffect as $, createContext as I, useState as M, useContext as B } from "react";
4
- import { C as H, P as j } from "./PanelContext-D6WQ7_yb.js";
5
- import { useLocalizedStringFormatter as v, Button as C, clsx as h, Text as A } from "@midas-ds/components";
6
- import { useControlledState as O } from "@react-stately/utils";
7
- import { u as L } from "./useIsMobileDevice-D0iMVFPx.js";
8
- import { c as _ } from "./createLucideIcon-CP-mMPfa.js";
9
- import { useExitAnimation as R, useObjectRef as q, useEnterAnimation as F, filterDOMProps as X } from "@react-aria/utils";
10
- import '../assets/Panel.css';const G = [
11
- ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
12
- ["path", { d: "M9 3v18", key: "fh3hqa" }],
13
- ["path", { d: "m16 15-3-3 3-3", key: "14y99z" }]
14
- ], J = _("panel-left-close", G);
15
- const K = [
16
- ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
17
- ["path", { d: "M9 3v18", key: "fh3hqa" }],
18
- ["path", { d: "m14 9 3 3-3 3", key: "8010ee" }]
19
- ], Q = _("panel-left-open", K);
20
- const U = [
21
- ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
22
- ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
23
- ], V = _("x", U), W = { expandSidebar: "Expand sidebar", collapseSidebar: "Collapse sidebar", closePanel: "Close panel" }, Y = { expandSidebar: "Expandera sidopanel", collapseSidebar: "Minimera sidopanel", closePanel: "Stäng panel" }, T = {
24
- en: W,
25
- sv: Y
26
- }, Z = "_collapsePanel_5za0f_1", ee = "_collapsed_5za0f_5", ne = "_panelTitle_5za0f_18", x = {
27
- collapsePanel: Z,
28
- collapsed: ee,
29
- panelTitle: ne
30
- }, se = ({
31
- children: e,
32
- className: s,
33
- isCollapsed: o,
34
- defaultCollapsed: m = !1,
35
- onCollapseChange: r,
36
- title: c,
37
- ...p
38
- }) => {
39
- const i = v(T), f = L(), [n, a] = O(
40
- o,
41
- m,
42
- r
43
- ), t = () => a((d) => !d);
44
- return f ? null : /* @__PURE__ */ l(H.Provider, { value: { isCollapsed: n }, children: /* @__PURE__ */ l(
45
- E,
46
- {
47
- className: h(s, x.collapsePanel, {
48
- [x.collapsed]: n
49
- }),
50
- ...p,
51
- children: /* @__PURE__ */ P("aside", { children: [
52
- /* @__PURE__ */ P(D, { children: [
53
- /* @__PURE__ */ l("div", { children: !n && c && /* @__PURE__ */ l(
54
- N,
55
- {
56
- className: x.panelTitle,
57
- title: c
58
- }
59
- ) }),
60
- /* @__PURE__ */ l(
61
- C,
62
- {
63
- variant: "icon",
64
- "aria-label": n ? i.format("expandSidebar") : i.format("collapseSidebar"),
65
- onPress: t,
66
- children: n ? /* @__PURE__ */ l(Q, { size: 20 }) : /* @__PURE__ */ l(J, { size: 20 })
67
- }
68
- )
69
- ] }),
70
- e
71
- ] })
72
- }
73
- ) });
74
- }, ae = "_panelBody_aouaw_1", te = {
75
- panelBody: ae
76
- }, E = b(
77
- ({ className: e, ...s }, o) => /* @__PURE__ */ l(
78
- "div",
79
- {
80
- ref: o,
81
- className: h(e, te.panelBody),
82
- ...s
83
- }
84
- )
85
- ), le = "_panelHeader_11qv1_1", oe = {
86
- panelHeader: le
87
- }, D = ({ className: e, ...s }) => /* @__PURE__ */ l(
88
- "div",
89
- {
90
- className: h(e, oe.panelHeader),
91
- ...s
92
- }
93
- ), ie = "_panelTitle_w7y4m_1", re = {
94
- panelTitle: ie
95
- }, N = ({ className: e, title: s, ...o }) => /* @__PURE__ */ l(
96
- A,
97
- {
98
- className: h(e, re.panelTitle),
99
- ...o,
100
- children: s
101
- }
102
- ), ce = "_dismissPanel_11141_1", de = "_panelTitle_11141_54", y = {
103
- dismissPanel: ce,
104
- panelTitle: de
105
- }, S = (e) => {
106
- const { onExited: s } = e, [o, m] = O(
107
- e.isOpen,
108
- e.defaultOpen || !1,
109
- e.onOpenChange
110
- ), r = z(null), c = R(r, o), p = () => m((i) => !i);
111
- return $(() => {
112
- !o && !c && s?.();
113
- }, [o, c, s]), !o && !c ? null : /* @__PURE__ */ l(
114
- pe,
115
- {
116
- isExiting: c,
117
- onPress: p,
118
- ref: r,
119
- ...e
120
- }
121
- );
122
- }, pe = b(
123
- ({
124
- className: e,
125
- title: s,
126
- onPress: o,
127
- children: m,
128
- isExiting: r,
129
- defaultOpen: c,
130
- promoting: p,
131
- onPromotionEnd: i,
132
- "aria-hidden": f,
133
- ...n
134
- }, a) => {
135
- const t = v(T), d = q(a), u = F(d, !c), w = (g) => {
136
- g.target === g.currentTarget && p && i?.();
137
- };
138
- return /* @__PURE__ */ P(
139
- E,
140
- {
141
- "aria-hidden": f || void 0,
142
- className: h(e, y.dismissPanel),
143
- ref: d,
144
- "data-entering": u || void 0,
145
- "data-exiting": r || void 0,
146
- "data-promoting": p || void 0,
147
- onAnimationEnd: w,
148
- ...X(n),
149
- children: [
150
- /* @__PURE__ */ P(D, { children: [
151
- /* @__PURE__ */ l("div", { children: s && /* @__PURE__ */ l(
152
- N,
153
- {
154
- className: y.panelTitle,
155
- title: s
156
- }
157
- ) }),
158
- /* @__PURE__ */ l(
159
- C,
160
- {
161
- variant: "icon",
162
- "aria-label": t.format("closePanel"),
163
- onPress: o,
164
- children: /* @__PURE__ */ l(V, { size: 20 })
165
- }
166
- )
167
- ] }),
168
- m
169
- ]
170
- }
171
- );
172
- }
173
- ), k = I({
174
- panels: [],
175
- addPanel: () => {
176
- },
177
- closePanel: () => {
178
- },
179
- removePanel: () => {
180
- },
181
- resetPromoting: () => {
182
- }
183
- }), be = ({
184
- children: e,
185
- className: s,
186
- ...o
187
- }) => {
188
- const { panels: m, closePanel: r, removePanel: c, resetPromoting: p } = me();
189
- return /* @__PURE__ */ P(
190
- "aside",
191
- {
192
- className: s,
193
- ...o,
194
- children: [
195
- m.map(({ id: i, ...f }, n, { length: a }) => /* @__PURE__ */ l(
196
- S,
197
- {
198
- "aria-hidden": n < a - 1 || void 0,
199
- id: i,
200
- "data-debug": "Panel (dismiss)",
201
- onOpenChange: (t) => {
202
- t || r(i);
203
- },
204
- onExited: () => c(i),
205
- onPromotionEnd: () => p(i),
206
- ...f
207
- },
208
- i
209
- )),
210
- e
211
- ]
212
- }
213
- );
214
- }, ve = ({
215
- children: e,
216
- defaultPanels: s = [],
217
- panelBehavior: o = "bring-to-front"
218
- }) => {
219
- const [m, r] = M(
220
- s.map((n) => ({ ...n, isOpen: !0, defaultOpen: !0 }))
221
- ), c = (n) => {
222
- r((a) => {
223
- const t = a.findIndex((d) => d.id === n.id);
224
- if (t === -1)
225
- return [...a, { ...n, isOpen: !0 }];
226
- if (o === "bring-to-front") {
227
- if (t === a.length - 1) return a;
228
- const d = a[t];
229
- return [
230
- ...a.filter((u) => u.id !== n.id),
231
- { ...d, isOpen: !0, promoting: !0 }
232
- ];
233
- }
234
- return o === "pop-to" ? a.map(
235
- (d, u) => u > t ? { ...d, isOpen: !1 } : d
236
- ) : a;
237
- });
238
- }, p = (n) => {
239
- r(
240
- (a) => a.map((t) => t.id === n ? { ...t, isOpen: !1 } : t)
241
- );
242
- }, i = (n) => {
243
- r((a) => a.filter((t) => t.id !== n));
244
- }, f = (n) => {
245
- r(
246
- (a) => a.map((t) => t.id === n ? { ...t, promoting: !1 } : t)
247
- );
248
- };
249
- return /* @__PURE__ */ l(
250
- k.Provider,
251
- {
252
- value: { panels: m, addPanel: c, closePanel: p, removePanel: i, resetPromoting: f },
253
- children: e
254
- }
255
- );
256
- }, me = () => {
257
- const e = B(k);
258
- if (!e)
259
- throw new Error(
260
- "useDismissPanels must be used within a DismissPanelContext"
261
- );
262
- return e;
263
- }, Ce = ({
264
- variant: e = "collapse",
265
- ...s
266
- }) => /* @__PURE__ */ P(j.Provider, { value: { variant: e }, children: [
267
- e === "collapse" && /* @__PURE__ */ l(se, { ...s }),
268
- e === "dismiss" && /* @__PURE__ */ l(S, { ...s })
269
- ] });
270
- export {
271
- se as C,
272
- S as D,
273
- Ce as P,
274
- k as a,
275
- be as b,
276
- ve as c,
277
- E as d,
278
- D as e,
279
- N as f,
280
- me as u
281
- };
@@ -1,11 +0,0 @@
1
- 'use client';
2
- import { createContext as t } from "react";
3
- const o = t({
4
- isCollapsed: !1
5
- }), a = t({
6
- variant: void 0
7
- });
8
- export {
9
- o as C,
10
- a as P
11
- };
@@ -1,8 +0,0 @@
1
- import { PanelProps } from '..';
2
- export interface CollapseTriggerProps {
3
- isCollapsed?: boolean;
4
- defaultCollapsed?: boolean;
5
- onCollapseChange?: (isCollapsed: boolean) => void;
6
- }
7
- export type CollapsePanelProps = Omit<PanelProps<'collapse'>, 'variant'> & CollapseTriggerProps;
8
- export declare const CollapsePanel: ({ children, className, isCollapsed: isCollapsedProp, defaultCollapsed, onCollapseChange, title, ...rest }: CollapsePanelProps) => import("react/jsx-runtime").JSX.Element | null;
@@ -1,3 +0,0 @@
1
- import { PanelProps } from '../Panel';
2
- export type CollapsePanelContextValue = Pick<PanelProps<'collapse'>, 'isCollapsed'>;
3
- export declare const CollapsePanelContext: import('react').Context<CollapsePanelContextValue>;
@@ -1,2 +0,0 @@
1
- export * from './CollapsePanel';
2
- export * from './CollapsePanelContext';
@@ -1,11 +0,0 @@
1
- import { PanelProps } from '..';
2
- export interface DismissTriggerProps {
3
- isOpen?: boolean;
4
- defaultOpen?: boolean;
5
- onOpenChange?: (isOpen: boolean) => void;
6
- onExited?: () => void;
7
- promoting?: boolean;
8
- onPromotionEnd?: () => void;
9
- }
10
- export type DismissPanelProps = Omit<PanelProps<'dismiss'>, 'variant'> & DismissTriggerProps;
11
- export declare const DismissPanel: (props: DismissPanelProps) => import("react/jsx-runtime").JSX.Element | null;
@@ -1,12 +0,0 @@
1
- import { DismissPanelProps } from '.';
2
- export interface PanelItem extends DismissPanelProps {
3
- promoting?: boolean;
4
- }
5
- export interface DismissPanelContextValue {
6
- panels: PanelItem[];
7
- addPanel: (panel: Omit<PanelItem, 'isOpen' | 'defaultOpen'>) => void;
8
- closePanel: (id: string) => void;
9
- removePanel: (id: string) => void;
10
- resetPromoting: (id: string) => void;
11
- }
12
- export declare const DismissPanelContext: import('react').Context<DismissPanelContextValue>;
@@ -1,3 +0,0 @@
1
- import { HTMLAttributes } from 'react';
2
- export type PanelRegionProps = HTMLAttributes<HTMLElement>;
3
- export declare const DismissPanelOutlet: ({ children, className, ...rest }: PanelRegionProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,9 +0,0 @@
1
- import { ReactNode } from 'react';
2
- import { PanelItem } from './DismissPanelContext';
3
- export type PanelBehavior = 'bring-to-front' | 'pop-to';
4
- export interface DismissPanelProviderProps {
5
- children: ReactNode;
6
- defaultPanels?: PanelItem[];
7
- panelBehavior?: PanelBehavior;
8
- }
9
- export declare const DismissPanelProvider: ({ children, defaultPanels, panelBehavior, }: DismissPanelProviderProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,5 +0,0 @@
1
- export * from './DismissPanel';
2
- export * from './DismissPanelContext';
3
- export * from './DismissPanelOutlet';
4
- export * from './DismissPanelProvider';
5
- export * from './useDismissPanels';
@@ -1 +0,0 @@
1
- export declare const useDismissPanels: () => import('./DismissPanelContext').DismissPanelContextValue;