@midas-ds/components 17.5.5 → 17.6.1
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 +12 -0
- package/chunks/{Select-AYp5Ay59.js → Select-DZepyl5C.js} +63 -61
- package/index.js +2 -2
- package/package.json +2 -2
- package/select/Select.d.ts +6 -1
- package/select/index.js +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,15 @@
|
|
|
1
|
+
## 17.6.1 (2026-03-06)
|
|
2
|
+
|
|
3
|
+
### 🧱 Updated Dependencies
|
|
4
|
+
|
|
5
|
+
- Updated theme to 3.12.4
|
|
6
|
+
|
|
7
|
+
## 17.6.0 (2026-03-05)
|
|
8
|
+
|
|
9
|
+
### 🚀 Features
|
|
10
|
+
|
|
11
|
+
- **components,select:** add popoverProps passthrough ([1be0c77656](https://github.com/migrationsverket/midas/commit/1be0c77656))
|
|
12
|
+
|
|
1
13
|
## 17.5.5 (2026-03-04)
|
|
2
14
|
|
|
3
15
|
### 🩹 Fixes
|
|
@@ -1,45 +1,45 @@
|
|
|
1
|
-
import { jsx as e, Fragment as
|
|
2
|
-
import { SelectStateContext as d, SelectValue as g, Button as _, TagList as
|
|
3
|
-
import { FocusScope as
|
|
4
|
-
import { a as
|
|
5
|
-
import { a as
|
|
6
|
-
import { T as
|
|
1
|
+
import { jsx as e, Fragment as A, jsxs as i } from "react/jsx-runtime";
|
|
2
|
+
import { SelectStateContext as d, SelectValue as g, Button as _, TagList as C, Select as N } from "react-aria-components";
|
|
3
|
+
import { FocusScope as x } from "@react-aria/focus";
|
|
4
|
+
import { a as b, L as T } from "./Label-s4J9sYdy.js";
|
|
5
|
+
import { a as y, c as B } from "./clsx-AexbMWKp.js";
|
|
6
|
+
import { T as M } from "./Text-D0r_W4lH.js";
|
|
7
7
|
import { F as h } from "./FieldError-krpMBtie.js";
|
|
8
8
|
import p, { useContext as f } from "react";
|
|
9
|
-
import { C as
|
|
9
|
+
import { C as F } from "./Checkbox-sAkQe7Q9.js";
|
|
10
10
|
import { u as m } from "./useLocalizedStringFormatter-BHvsRxDk.js";
|
|
11
|
-
import { useFocusManager as
|
|
12
|
-
import { X as
|
|
13
|
-
import { L as
|
|
14
|
-
import { P as
|
|
15
|
-
import { a as
|
|
16
|
-
import { C as
|
|
17
|
-
import '../assets/Select.css';const
|
|
18
|
-
en:
|
|
19
|
-
sv:
|
|
20
|
-
},
|
|
21
|
-
select:
|
|
22
|
-
triggerContainer:
|
|
23
|
-
trigger:
|
|
24
|
-
medium:
|
|
25
|
-
icon:
|
|
26
|
-
selectValue:
|
|
27
|
-
placeholder:
|
|
28
|
-
multiSelectValue:
|
|
29
|
-
selectValueTag:
|
|
30
|
-
clearButton:
|
|
31
|
-
truncate:
|
|
32
|
-
popover:
|
|
33
|
-
selectAll:
|
|
34
|
-
tagGroup:
|
|
35
|
-
},
|
|
11
|
+
import { useFocusManager as L } from "react-aria";
|
|
12
|
+
import { X as I } from "./x-B9bYxG31.js";
|
|
13
|
+
import { L as G } from "./ListBox-CDlOUvzJ.js";
|
|
14
|
+
import { P as j } from "./Popover-CaP4LFhg.js";
|
|
15
|
+
import { a as k, T as R } from "./TagGroup-BscTXQ_E.js";
|
|
16
|
+
import { C as $ } from "./chevron-down-BBFYYzZq.js";
|
|
17
|
+
import '../assets/Select.css';const w = { clearAll: "Clear all", selectAll: "Select all", selectedItems: "Selected items", selected: "selected" }, P = { clearAll: "Rensa alla", selectAll: "Välj alla", selectedItems: "Valda objekt", selected: "valda" }, u = {
|
|
18
|
+
en: w,
|
|
19
|
+
sv: P
|
|
20
|
+
}, z = "_select_1h0s2_1", D = "_triggerContainer_1h0s2_7", E = "_trigger_1h0s2_7", K = "_medium_1h0s2_29", W = "_icon_1h0s2_66", X = "_selectValue_1h0s2_72", q = "_placeholder_1h0s2_78", H = "_multiSelectValue_1h0s2_88", J = "_selectValueTag_1h0s2_112", O = "_clearButton_1h0s2_126", Q = "_truncate_1h0s2_138", U = "_popover_1h0s2_175", Y = "_selectAll_1h0s2_201", Z = "_tagGroup_1h0s2_269", s = {
|
|
21
|
+
select: z,
|
|
22
|
+
triggerContainer: D,
|
|
23
|
+
trigger: E,
|
|
24
|
+
medium: K,
|
|
25
|
+
icon: W,
|
|
26
|
+
selectValue: X,
|
|
27
|
+
placeholder: q,
|
|
28
|
+
multiSelectValue: H,
|
|
29
|
+
selectValueTag: J,
|
|
30
|
+
clearButton: O,
|
|
31
|
+
truncate: Q,
|
|
32
|
+
popover: U,
|
|
33
|
+
selectAll: Y,
|
|
34
|
+
tagGroup: Z
|
|
35
|
+
}, ee = () => {
|
|
36
36
|
const t = p.useContext(d), c = m(u), r = () => {
|
|
37
37
|
t?.setValue(
|
|
38
38
|
t?.selectionManager.isSelectAll ? null : Array.from(t.collection.getKeys())
|
|
39
39
|
), t?.commitValidation();
|
|
40
40
|
};
|
|
41
41
|
return /* @__PURE__ */ e(
|
|
42
|
-
|
|
42
|
+
F,
|
|
43
43
|
{
|
|
44
44
|
className: s.selectAll,
|
|
45
45
|
isIndeterminate: !t?.selectionManager.isSelectAll && !t?.selectionManager.isEmpty,
|
|
@@ -48,7 +48,7 @@ import '../assets/Select.css';const $ = { clearAll: "Clear all", selectAll: "Sel
|
|
|
48
48
|
children: c.format("selectAll")
|
|
49
49
|
}
|
|
50
50
|
);
|
|
51
|
-
},
|
|
51
|
+
}, te = ({
|
|
52
52
|
isDisabled: t
|
|
53
53
|
}) => {
|
|
54
54
|
const c = m(u), r = (l, o) => l.length === 1 ? o : `${l.length} ${c.format("selected")}`;
|
|
@@ -57,23 +57,23 @@ import '../assets/Select.css';const $ = { clearAll: "Clear all", selectAll: "Sel
|
|
|
57
57
|
{
|
|
58
58
|
className: s.multiSelectValue,
|
|
59
59
|
"data-disabled": t || void 0,
|
|
60
|
-
children: ({ isPlaceholder: l, selectedItems: o, selectedText: a }) => l ? /* @__PURE__ */ e(
|
|
60
|
+
children: ({ isPlaceholder: l, selectedItems: o, selectedText: a }) => l ? /* @__PURE__ */ e(A, {}) : /* @__PURE__ */ i(
|
|
61
61
|
"div",
|
|
62
62
|
{
|
|
63
63
|
className: s.selectValueTag,
|
|
64
64
|
"data-disabled": t || void 0,
|
|
65
65
|
children: [
|
|
66
66
|
/* @__PURE__ */ e("span", { className: s.truncate, children: r(o, a) }),
|
|
67
|
-
/* @__PURE__ */ e(
|
|
67
|
+
/* @__PURE__ */ e(le, { isDisabled: t })
|
|
68
68
|
]
|
|
69
69
|
}
|
|
70
70
|
)
|
|
71
71
|
}
|
|
72
72
|
);
|
|
73
|
-
},
|
|
73
|
+
}, le = ({
|
|
74
74
|
isDisabled: t
|
|
75
75
|
}) => {
|
|
76
|
-
const c = p.useContext(d), r = m(u), l =
|
|
76
|
+
const c = p.useContext(d), r = m(u), l = L(), o = () => {
|
|
77
77
|
l?.focusFirst(), c?.setValue(null);
|
|
78
78
|
};
|
|
79
79
|
return /* @__PURE__ */ e(
|
|
@@ -85,7 +85,7 @@ import '../assets/Select.css';const $ = { clearAll: "Clear all", selectAll: "Sel
|
|
|
85
85
|
slot: null,
|
|
86
86
|
isDisabled: t,
|
|
87
87
|
children: /* @__PURE__ */ e(
|
|
88
|
-
|
|
88
|
+
I,
|
|
89
89
|
{
|
|
90
90
|
width: 20,
|
|
91
91
|
height: 20
|
|
@@ -93,7 +93,7 @@ import '../assets/Select.css';const $ = { clearAll: "Clear all", selectAll: "Sel
|
|
|
93
93
|
)
|
|
94
94
|
}
|
|
95
95
|
);
|
|
96
|
-
},
|
|
96
|
+
}, se = ({
|
|
97
97
|
showTags: t,
|
|
98
98
|
isDisabled: c
|
|
99
99
|
}) => {
|
|
@@ -101,14 +101,14 @@ import '../assets/Select.css';const $ = { clearAll: "Clear all", selectAll: "Sel
|
|
|
101
101
|
l?.selectionManager.toggleSelection(Array.from(a)[0]);
|
|
102
102
|
};
|
|
103
103
|
return !l?.selectedItems.length || !t ? null : /* @__PURE__ */ e(
|
|
104
|
-
|
|
104
|
+
k,
|
|
105
105
|
{
|
|
106
106
|
"aria-label": r.format("selectedItems"),
|
|
107
107
|
className: s.tagGroup,
|
|
108
108
|
onRemove: o,
|
|
109
109
|
selectionBehavior: "toggle",
|
|
110
|
-
children: /* @__PURE__ */ e(
|
|
111
|
-
|
|
110
|
+
children: /* @__PURE__ */ e(C, { items: l.selectedItems, children: (a) => /* @__PURE__ */ e(
|
|
111
|
+
R,
|
|
112
112
|
{
|
|
113
113
|
isDismissable: !0,
|
|
114
114
|
id: a.key,
|
|
@@ -120,7 +120,7 @@ import '../assets/Select.css';const $ = { clearAll: "Clear all", selectAll: "Sel
|
|
|
120
120
|
) })
|
|
121
121
|
}
|
|
122
122
|
);
|
|
123
|
-
},
|
|
123
|
+
}, ae = ({
|
|
124
124
|
isDisabled: t,
|
|
125
125
|
selectionMode: c,
|
|
126
126
|
size: r
|
|
@@ -129,7 +129,7 @@ import '../assets/Select.css';const $ = { clearAll: "Clear all", selectAll: "Sel
|
|
|
129
129
|
return /* @__PURE__ */ i(
|
|
130
130
|
_,
|
|
131
131
|
{
|
|
132
|
-
className:
|
|
132
|
+
className: y(
|
|
133
133
|
{
|
|
134
134
|
[s.medium]: r === "medium"
|
|
135
135
|
},
|
|
@@ -150,14 +150,14 @@ import '../assets/Select.css';const $ = { clearAll: "Clear all", selectAll: "Sel
|
|
|
150
150
|
{
|
|
151
151
|
"aria-hidden": "true",
|
|
152
152
|
className: s.icon,
|
|
153
|
-
children: /* @__PURE__ */ e(
|
|
153
|
+
children: /* @__PURE__ */ e($, { size: 20 })
|
|
154
154
|
}
|
|
155
155
|
)
|
|
156
156
|
]
|
|
157
157
|
}
|
|
158
158
|
);
|
|
159
159
|
};
|
|
160
|
-
function
|
|
160
|
+
function Ae({
|
|
161
161
|
children: t,
|
|
162
162
|
description: c,
|
|
163
163
|
errorMessage: r,
|
|
@@ -165,17 +165,18 @@ function Ve({
|
|
|
165
165
|
items: o,
|
|
166
166
|
label: a,
|
|
167
167
|
popover: S,
|
|
168
|
-
|
|
168
|
+
popoverProps: v,
|
|
169
|
+
size: V = "large",
|
|
169
170
|
...n
|
|
170
171
|
}) {
|
|
171
|
-
return /* @__PURE__ */ e(
|
|
172
|
-
|
|
172
|
+
return /* @__PURE__ */ e(x, { children: /* @__PURE__ */ i(
|
|
173
|
+
N,
|
|
173
174
|
{
|
|
174
175
|
...n,
|
|
175
|
-
className:
|
|
176
|
+
className: B(n.className, s.select),
|
|
176
177
|
children: [
|
|
177
|
-
/* @__PURE__ */ e(
|
|
178
|
-
c && /* @__PURE__ */ e(
|
|
178
|
+
/* @__PURE__ */ e(b, { popover: S, children: a && /* @__PURE__ */ e(T, { "data-disabled": n.isDisabled || void 0, children: a }) }),
|
|
179
|
+
c && /* @__PURE__ */ e(M, { slot: "description", children: c }),
|
|
179
180
|
l === "top" && /* @__PURE__ */ e(h, { children: r }),
|
|
180
181
|
/* @__PURE__ */ i(
|
|
181
182
|
"div",
|
|
@@ -184,27 +185,28 @@ function Ve({
|
|
|
184
185
|
"data-disabled": n.isDisabled || void 0,
|
|
185
186
|
children: [
|
|
186
187
|
/* @__PURE__ */ e(
|
|
187
|
-
|
|
188
|
+
ae,
|
|
188
189
|
{
|
|
189
|
-
size:
|
|
190
|
+
size: V,
|
|
190
191
|
...n
|
|
191
192
|
}
|
|
192
193
|
),
|
|
193
|
-
n.selectionMode === "multiple" ? /* @__PURE__ */ e(
|
|
194
|
+
n.selectionMode === "multiple" ? /* @__PURE__ */ e(te, { ...n }) : null
|
|
194
195
|
]
|
|
195
196
|
}
|
|
196
197
|
),
|
|
197
198
|
l === "bottom" && /* @__PURE__ */ e(h, { children: r }),
|
|
198
199
|
/* @__PURE__ */ i(
|
|
199
|
-
|
|
200
|
+
j,
|
|
200
201
|
{
|
|
201
202
|
className: s.popover,
|
|
202
203
|
offset: 0,
|
|
203
204
|
hideArrow: !0,
|
|
205
|
+
...v,
|
|
204
206
|
children: [
|
|
205
|
-
n.isSelectableAll && /* @__PURE__ */ e(
|
|
207
|
+
n.isSelectableAll && /* @__PURE__ */ e(ee, {}),
|
|
206
208
|
/* @__PURE__ */ e(
|
|
207
|
-
|
|
209
|
+
G,
|
|
208
210
|
{
|
|
209
211
|
escapeKeyBehavior: "none",
|
|
210
212
|
items: o,
|
|
@@ -214,11 +216,11 @@ function Ve({
|
|
|
214
216
|
]
|
|
215
217
|
}
|
|
216
218
|
),
|
|
217
|
-
/* @__PURE__ */ e(
|
|
219
|
+
/* @__PURE__ */ e(se, { ...n })
|
|
218
220
|
]
|
|
219
221
|
}
|
|
220
222
|
) });
|
|
221
223
|
}
|
|
222
224
|
export {
|
|
223
|
-
|
|
225
|
+
Ae as S
|
|
224
226
|
};
|
package/index.js
CHANGED
|
@@ -30,7 +30,7 @@ import { P as Io } from "./chunks/Popover-CaP4LFhg.js";
|
|
|
30
30
|
import { P as Go } from "./chunks/ProgressBar-acc8946-.js";
|
|
31
31
|
import { R as ko, a as vo } from "./chunks/Radio-DjivEe-_.js";
|
|
32
32
|
import { S as Mo } from "./chunks/SearchField-1DYv0w4b.js";
|
|
33
|
-
import { S as ho } from "./chunks/Select-
|
|
33
|
+
import { S as ho } from "./chunks/Select-DZepyl5C.js";
|
|
34
34
|
import { S as yo } from "./chunks/Skeleton-D6mxKxuu.js";
|
|
35
35
|
import { S as No } from "./chunks/Spinner-CfKMn18u.js";
|
|
36
36
|
import { C as zo, a as Oo, R as Qo, T as Vo, b as Zo, c as jo } from "./chunks/Table-Bg-AKi7d.js";
|
|
@@ -49,7 +49,7 @@ import { c as Na } from "./chunks/clsx-AexbMWKp.js";
|
|
|
49
49
|
import { DialogTrigger as za, MenuTrigger as Oa, RouterProvider as Qa } from "react-aria-components";
|
|
50
50
|
import { u as Za } from "./chunks/useLocalizedStringFormatter-BHvsRxDk.js";
|
|
51
51
|
import { useToastState as qa } from "react-stately";
|
|
52
|
-
const o = "17.
|
|
52
|
+
const o = "17.6.1", a = {
|
|
53
53
|
version: o
|
|
54
54
|
}, r = a.version;
|
|
55
55
|
export {
|
package/package.json
CHANGED
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"description": "Midas Components",
|
|
15
15
|
"homepage": "https://designsystem.migrationsverket.se/",
|
|
16
16
|
"license": "CC0-1.0",
|
|
17
|
-
"version": "17.
|
|
17
|
+
"version": "17.6.1",
|
|
18
18
|
"module": "./index.js",
|
|
19
19
|
"type": "module",
|
|
20
20
|
"main": "./index.js",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"./*": "./*/index.js"
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@midas-ds/theme": "3.12.
|
|
44
|
+
"@midas-ds/theme": "3.12.4",
|
|
45
45
|
"react-aria-components": "1.14.0"
|
|
46
46
|
}
|
|
47
47
|
}
|
package/select/Select.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { SelectProps, ValidationResult } from 'react-aria-components';
|
|
2
2
|
import { InfoPopoverProps } from '../label';
|
|
3
3
|
import { Size } from '../common/types';
|
|
4
|
+
import { Popover } from '../popover';
|
|
4
5
|
import * as React from 'react';
|
|
5
6
|
export type SelectionMode = 'single' | 'multiple';
|
|
6
7
|
export interface MidasSelectProps<T extends object, M extends SelectionMode = 'single'> extends Omit<SelectProps<T, M>, 'children'> {
|
|
@@ -30,5 +31,9 @@ export interface MidasSelectProps<T extends object, M extends SelectionMode = 's
|
|
|
30
31
|
* @default 'large'
|
|
31
32
|
*/
|
|
32
33
|
size?: Size;
|
|
34
|
+
/**
|
|
35
|
+
* Props passed to the internal Popover element.
|
|
36
|
+
*/
|
|
37
|
+
popoverProps?: Omit<React.ComponentProps<typeof Popover>, 'children'>;
|
|
33
38
|
}
|
|
34
|
-
export declare function Select<T extends object, M extends SelectionMode = 'single'>({ children, description, errorMessage, errorPosition, items, label, popover, size, ...props }: MidasSelectProps<T, M>): import("react/jsx-runtime").JSX.Element;
|
|
39
|
+
export declare function Select<T extends object, M extends SelectionMode = 'single'>({ children, description, errorMessage, errorPosition, items, label, popover, popoverProps, size, ...props }: MidasSelectProps<T, M>): import("react/jsx-runtime").JSX.Element;
|
package/select/index.js
CHANGED