@midas-ds/components 17.10.13 → 17.10.15
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 +17 -0
- package/chunks/{SearchField-VIMb28RB.js → SearchField-DRaSep82.js} +36 -36
- package/index.js +2 -2
- package/package.json +2 -2
- package/search-field/SearchField.d.ts +1 -2
- package/search-field/SearchField.stories.d.ts +1 -1
- package/search-field/index.js +1 -1
- package/textfield/TextField.stories.d.ts +3 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,20 @@
|
|
|
1
|
+
## 17.10.15 (2026-04-02)
|
|
2
|
+
|
|
3
|
+
### 🧱 Updated Dependencies
|
|
4
|
+
|
|
5
|
+
- Updated theme to 3.12.17
|
|
6
|
+
|
|
7
|
+
## 17.10.14 (2026-04-01)
|
|
8
|
+
|
|
9
|
+
### 🩹 Fixes
|
|
10
|
+
|
|
11
|
+
- **components, search-field:** set inputMode='search' as default ([4a0fe1a9bc](https://github.com/migrationsverket/midas/commit/4a0fe1a9bc))
|
|
12
|
+
|
|
13
|
+
### 📖 Documentation changes
|
|
14
|
+
|
|
15
|
+
- **components, textfield:** add numeric example ([8ae48988af](https://github.com/migrationsverket/midas/commit/8ae48988af))
|
|
16
|
+
- **components:** add autocomplete and inputmode stories ([7babb670fd](https://github.com/migrationsverket/midas/commit/7babb670fd))
|
|
17
|
+
|
|
1
18
|
## 17.10.13 (2026-03-30)
|
|
2
19
|
|
|
3
20
|
### 🩹 Fixes
|
|
@@ -1,32 +1,32 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as i, jsxs as s, Fragment as
|
|
3
|
-
import { useSlottedContext as
|
|
4
|
-
import { s as
|
|
2
|
+
import { jsx as i, jsxs as s, Fragment as j } from "react/jsx-runtime";
|
|
3
|
+
import { useSlottedContext as N, FormContext as g, SearchField as y, Input as B } from "react-aria-components";
|
|
4
|
+
import { s as C } from "./TextField.module-BDIbEV87.js";
|
|
5
5
|
import { B as u } from "./Button-GCROAMSl.js";
|
|
6
6
|
import { c as o } from "./clsx-AexbMWKp.js";
|
|
7
7
|
import { F as h } from "./FieldError-krpMBtie.js";
|
|
8
|
-
import { c as
|
|
9
|
-
import { X as
|
|
10
|
-
import { u as
|
|
11
|
-
import '../assets/SearchField.css';const
|
|
8
|
+
import { c as k } from "./createLucideIcon-CP-mMPfa.js";
|
|
9
|
+
import { X as I } from "./x-B9bYxG31.js";
|
|
10
|
+
import { u as D } from "./useLocalizedStringFormatter-BHvsRxDk.js";
|
|
11
|
+
import '../assets/SearchField.css';const E = [
|
|
12
12
|
["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
|
|
13
13
|
["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
|
|
14
|
-
],
|
|
15
|
-
container:
|
|
16
|
-
inner:
|
|
17
|
-
inputContainer:
|
|
18
|
-
medium:
|
|
19
|
-
icon:
|
|
20
|
-
clear:
|
|
21
|
-
input:
|
|
22
|
-
},
|
|
23
|
-
en:
|
|
24
|
-
sv:
|
|
14
|
+
], L = k("search", E), T = "_container_1msv3_1", V = "_inner_1msv3_10", $ = "_inputContainer_1msv3_15", w = "_medium_1msv3_21", O = "_icon_1msv3_26", P = "_clear_1msv3_38", X = "_input_1msv3_15", n = {
|
|
15
|
+
container: T,
|
|
16
|
+
inner: V,
|
|
17
|
+
inputContainer: $,
|
|
18
|
+
medium: w,
|
|
19
|
+
icon: O,
|
|
20
|
+
clear: P,
|
|
21
|
+
input: X
|
|
22
|
+
}, q = { search: "Search" }, A = { search: "Sök" }, G = {
|
|
23
|
+
en: q,
|
|
24
|
+
sv: A
|
|
25
25
|
};
|
|
26
|
-
function
|
|
26
|
+
function H(a) {
|
|
27
27
|
return !!a?.length;
|
|
28
28
|
}
|
|
29
|
-
const
|
|
29
|
+
const M = ({
|
|
30
30
|
errorPosition: a = "top",
|
|
31
31
|
size: r = "large",
|
|
32
32
|
showButton: _,
|
|
@@ -34,20 +34,22 @@ const z = ({
|
|
|
34
34
|
errorMessage: m,
|
|
35
35
|
placeholder: l,
|
|
36
36
|
validationBehavior: f,
|
|
37
|
+
inputMode: S = "search",
|
|
37
38
|
...e
|
|
38
39
|
}) => {
|
|
39
|
-
const
|
|
40
|
-
!t || e.isInvalid || e.validate &&
|
|
40
|
+
const b = D(G), p = N(g), x = f ?? p?.validationBehavior ?? "aria", F = _ !== !1, d = (t) => {
|
|
41
|
+
!t || e.isInvalid || e.validate && H(e.validate(t)) || e.onSubmit?.(t);
|
|
41
42
|
};
|
|
42
43
|
return /* @__PURE__ */ i(
|
|
43
|
-
|
|
44
|
+
y,
|
|
44
45
|
{
|
|
45
46
|
...e,
|
|
47
|
+
inputMode: S,
|
|
46
48
|
onSubmit: d,
|
|
47
49
|
"aria-label": e["aria-label"] ?? l,
|
|
48
50
|
className: o(n.container, v),
|
|
49
|
-
validationBehavior:
|
|
50
|
-
children: ({ state: t }) => /* @__PURE__ */ s(
|
|
51
|
+
validationBehavior: x,
|
|
52
|
+
children: ({ state: t }) => /* @__PURE__ */ s(j, { children: [
|
|
51
53
|
a === "top" && /* @__PURE__ */ i(h, { children: ({ validationErrors: c }) => m ?? c.join(" ") }),
|
|
52
54
|
/* @__PURE__ */ s("div", { className: n.inner, children: [
|
|
53
55
|
/* @__PURE__ */ s(
|
|
@@ -58,21 +60,19 @@ const z = ({
|
|
|
58
60
|
}),
|
|
59
61
|
children: [
|
|
60
62
|
/* @__PURE__ */ i(
|
|
61
|
-
|
|
63
|
+
L,
|
|
62
64
|
{
|
|
63
65
|
size: 20,
|
|
64
66
|
className: n.icon
|
|
65
67
|
}
|
|
66
68
|
),
|
|
67
69
|
/* @__PURE__ */ i(
|
|
68
|
-
|
|
70
|
+
B,
|
|
69
71
|
{
|
|
70
72
|
placeholder: l,
|
|
71
|
-
className: o(
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
{ [n.medium]: r === "medium" }
|
|
75
|
-
)
|
|
73
|
+
className: o(C.input, n.input, {
|
|
74
|
+
[n.medium]: r === "medium"
|
|
75
|
+
})
|
|
76
76
|
}
|
|
77
77
|
),
|
|
78
78
|
t.value.length > 0 && /* @__PURE__ */ i(
|
|
@@ -84,7 +84,7 @@ const z = ({
|
|
|
84
84
|
[n.medium]: r === "medium"
|
|
85
85
|
}),
|
|
86
86
|
children: /* @__PURE__ */ i(
|
|
87
|
-
|
|
87
|
+
I,
|
|
88
88
|
{
|
|
89
89
|
size: 20,
|
|
90
90
|
"aria-hidden": !0
|
|
@@ -95,7 +95,7 @@ const z = ({
|
|
|
95
95
|
]
|
|
96
96
|
}
|
|
97
97
|
),
|
|
98
|
-
|
|
98
|
+
F && /* @__PURE__ */ i(
|
|
99
99
|
u,
|
|
100
100
|
{
|
|
101
101
|
slot: null,
|
|
@@ -104,7 +104,7 @@ const z = ({
|
|
|
104
104
|
isDisabled: e.isDisabled,
|
|
105
105
|
type: "button",
|
|
106
106
|
onPress: () => d(t.value),
|
|
107
|
-
children: e.buttonText ??
|
|
107
|
+
children: e.buttonText ?? b.format("search")
|
|
108
108
|
}
|
|
109
109
|
)
|
|
110
110
|
] }),
|
|
@@ -114,5 +114,5 @@ const z = ({
|
|
|
114
114
|
);
|
|
115
115
|
};
|
|
116
116
|
export {
|
|
117
|
-
|
|
117
|
+
M as S
|
|
118
118
|
};
|
package/index.js
CHANGED
|
@@ -30,7 +30,7 @@ import { M as Ro } from "./chunks/Dialog-BSWBlyJI.js";
|
|
|
30
30
|
import { P as Po } from "./chunks/Popover-CjEPHe4A.js";
|
|
31
31
|
import { P as vo } from "./chunks/ProgressBar-CBz_dIOH.js";
|
|
32
32
|
import { R as Ao, a as ho } from "./chunks/Radio-CRHdSthr.js";
|
|
33
|
-
import { S as yo } from "./chunks/SearchField-
|
|
33
|
+
import { S as yo } from "./chunks/SearchField-DRaSep82.js";
|
|
34
34
|
import { S as No } from "./chunks/Select-DKNK3eh_.js";
|
|
35
35
|
import { S as zo } from "./chunks/Skeleton-tiP1Syzf.js";
|
|
36
36
|
import { S as Qo } from "./chunks/Spinner-CfKMn18u.js";
|
|
@@ -50,7 +50,7 @@ import { c as Qa } from "./chunks/clsx-AexbMWKp.js";
|
|
|
50
50
|
import { DialogTrigger as Za, MenuTrigger as ja, RouterProvider as qa } from "react-aria-components";
|
|
51
51
|
import { u as Ka } from "./chunks/useLocalizedStringFormatter-BHvsRxDk.js";
|
|
52
52
|
import { useToastState as Wa } from "react-stately";
|
|
53
|
-
const o = "17.10.
|
|
53
|
+
const o = "17.10.15", a = {
|
|
54
54
|
version: o
|
|
55
55
|
}, r = a.version;
|
|
56
56
|
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.10.
|
|
17
|
+
"version": "17.10.15",
|
|
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.17",
|
|
45
45
|
"react-aria-components": "1.16.0"
|
|
46
46
|
}
|
|
47
47
|
}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { SearchFieldProps as AriaSearchFieldProps } from 'react-aria-components';
|
|
2
2
|
import { Size } from '../common/types';
|
|
3
|
-
import * as React from 'react';
|
|
4
3
|
export interface SearchFieldProps extends Omit<AriaSearchFieldProps, 'children'> {
|
|
5
4
|
/** Placeholder text */
|
|
6
5
|
placeholder: string;
|
|
@@ -38,4 +37,4 @@ export interface SearchFieldProps extends Omit<AriaSearchFieldProps, 'children'>
|
|
|
38
37
|
* */
|
|
39
38
|
size?: Size;
|
|
40
39
|
}
|
|
41
|
-
export declare const SearchField:
|
|
40
|
+
export declare const SearchField: ({ errorPosition, size, showButton, className, errorMessage, placeholder, validationBehavior, inputMode, ...props }: SearchFieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -2,7 +2,7 @@ import { StoryObj } from '@storybook/react-vite';
|
|
|
2
2
|
import { SearchField } from './SearchField';
|
|
3
3
|
type Story = StoryObj<typeof SearchField>;
|
|
4
4
|
declare const _default: {
|
|
5
|
-
component: import('
|
|
5
|
+
component: ({ errorPosition, size, showButton, className, errorMessage, placeholder, validationBehavior, inputMode, ...props }: import('./SearchField').SearchFieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
6
6
|
title: string;
|
|
7
7
|
tags: string[];
|
|
8
8
|
parameters: {
|
package/search-field/index.js
CHANGED
|
@@ -17,6 +17,7 @@ declare const _default: {
|
|
|
17
17
|
description: string;
|
|
18
18
|
errorPosition: "top";
|
|
19
19
|
size: "large";
|
|
20
|
+
inputMode: "text";
|
|
20
21
|
};
|
|
21
22
|
};
|
|
22
23
|
export default _default;
|
|
@@ -26,9 +27,11 @@ export declare const Invalid: Story;
|
|
|
26
27
|
export declare const Required: Story;
|
|
27
28
|
export declare const CustomValidation: Story;
|
|
28
29
|
export declare const Number: Story;
|
|
30
|
+
export declare const Numeric: Story;
|
|
29
31
|
export declare const Disabled: Story;
|
|
30
32
|
export declare const ReadOnly: Story;
|
|
31
33
|
export declare const ShowCounter: Story;
|
|
32
34
|
export declare const MaxLengthAndShowCounter: Story;
|
|
33
35
|
export declare const DS1243: Story;
|
|
34
36
|
export declare const WithHelpPopover: Story;
|
|
37
|
+
export declare const Email: Story;
|