@altinn/altinn-components 0.22.0 → 0.22.2

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 (8) hide show
  1. package/dist/assets/SearchField.css +1 -1
  2. package/dist/assets/ToolbarSearch.css +1 -1
  3. package/dist/components/Search/SearchField.js +40 -40
  4. package/dist/components/Toolbar/ToolbarSearch.js +16 -16
  5. package/dist/padding.css +19 -17
  6. package/dist/shadow.css +16 -14
  7. package/dist/spacing.css +25 -23
  8. package/package.json +1 -1
package/dist/assets/SearchField.css CHANGED
@@ -1 +1 @@
1
- ._field_1y3oc_1{position:relative;display:flex;align-items:center;font-size:1.125rem;background-color:transparent;color:currentColor}._icon_1y3oc_10{position:absolute;left:0;font-size:1.5rem;margin:0 1rem}._input_1y3oc_17{height:3.5rem;background-color:transparent;font-size:inherit;flex-grow:1;padding:1rem 1rem 1rem 3rem;border:2px solid;border-radius:.25rem;outline:none}._input_1y3oc_17[type=search]::-webkit-search-decoration,._input_1y3oc_17[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}._input_1y3oc_17:focus,._input_1y3oc_17[value]{background-color:var(--ds-color-background-default)}._dismiss_1y3oc_41{position:absolute;right:0;margin:.375rem}._clear_1y3oc_47{position:absolute;right:0;margin:1rem;border-radius:100%;width:1.5rem;height:1.5rem}
1
+ ._field_ljqfn_1{position:relative;display:flex;align-items:center;font-size:1.125rem;background-color:transparent;color:currentColor}._icon_ljqfn_10{position:absolute;left:0;font-size:1.5rem;margin:0 1rem}._input_ljqfn_17{height:3.5rem;background-color:transparent;font-size:inherit;flex-grow:1;padding:1rem 1rem 1rem 3rem;border:2px solid;border-radius:.25rem;outline:none}._input_ljqfn_17[type=search]::-webkit-search-decoration,._input_ljqfn_17[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}._input_ljqfn_17:focus,._input_ljqfn_17:not(:placeholder-shown){background-color:var(--ds-color-background-default)}._dismiss_ljqfn_41{position:absolute;right:0;margin:.375rem}._clear_ljqfn_47{position:absolute;right:0;margin:1rem;border-radius:100%;width:1.5rem;height:1.5rem}
package/dist/assets/ToolbarSearch.css CHANGED
@@ -1 +1 @@
1
- ._field_14byu_1{position:relative}._icon_14byu_5{position:absolute;top:0;left:0;font-size:1.25rem;color:var(--ds-color-text-subtle);margin:8px}._input_14byu_14{width:100%;font-size:.875rem;line-height:1rem;font-weight:500;padding:9px 32px;border-radius:2px;border:1px solid;border-color:var(--ds-color-border-default)}._input_14byu_14[type=search]::-webkit-search-decoration,._input_14byu_14[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}._clear_14byu_30{position:absolute;top:0;right:0;margin:8px;border-radius:100%;width:1.25rem;height:1.25rem}
1
+ ._field_3uyps_1{position:relative}._icon_3uyps_5{position:absolute;top:0;left:0;font-size:1.25rem;color:var(--ds-color-text-subtle);margin:8px}._input_3uyps_14{width:100%;font-size:.875rem;line-height:1rem;font-weight:500;padding:9px 32px;border-radius:2px;border:1px solid;border-color:var(--ds-color-border-default);background-color:var(--ds-color-background-default)}._input_3uyps_14[type=search]::-webkit-search-decoration,._input_3uyps_14[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}._clear_3uyps_31{position:absolute;top:0;right:0;margin:8px;border-radius:100%;width:1.25rem;height:1.25rem}
package/dist/components/Search/SearchField.js CHANGED
@@ -1,70 +1,70 @@
1
1
  "use client";
2
- import { jsxs as C, jsx as t } from "react/jsx-runtime";
3
- import { c as I } from "../../index-L8X2o7IH.js";
4
- import { useRef as N } from "react";
5
- import { Icon as v } from "../Icon/Icon.js";
2
+ import { jsxs as g, jsx as t } from "react/jsx-runtime";
3
+ import { c as k } from "../../index-L8X2o7IH.js";
4
+ import { useRef as C } from "react";
5
+ import { Icon as I } from "../Icon/Icon.js";
6
6
  import { IconButton as n } from "../Button/IconButton.js";
7
7
  import "../RootProvider/RootProvider.js";
8
8
  import "./AutocompleteBase.js";
9
9
  import "../Snackbar/useSnackbar.js";
10
- import { S as T } from "../../MagnifyingGlass-DWIcpwS4.js";
10
+ import { S as N } from "../../MagnifyingGlass-DWIcpwS4.js";
11
11
  import { S as l } from "../../XMark-Bv1I87Ev.js";
12
- import '../../assets/SearchField.css';const j = "_field_1y3oc_1", A = "_icon_1y3oc_10", K = "_input_1y3oc_17", M = "_dismiss_1y3oc_41", U = "_clear_1y3oc_47", s = {
13
- field: j,
14
- icon: A,
15
- input: K,
16
- dismiss: M,
17
- clear: U
12
+ import '../../assets/SearchField.css';const v = "_field_ljqfn_1", T = "_icon_ljqfn_10", A = "_input_ljqfn_17", K = "_dismiss_ljqfn_41", M = "_clear_ljqfn_47", s = {
13
+ field: v,
14
+ icon: T,
15
+ input: A,
16
+ dismiss: K,
17
+ clear: M
18
18
  }, H = ({
19
19
  className: m,
20
20
  expanded: p,
21
- name: u = "q",
22
- value: o,
23
- placeholder: d = "Search",
24
- closeButtonAltText: f = "Close search",
21
+ name: f = "q",
22
+ value: a,
23
+ placeholder: u = "Search",
24
+ closeButtonAltText: d = "Close search",
25
25
  clearButtonAltText: _ = "Clear search",
26
- onFocus: y,
27
- onBlur: h,
28
- onChange: x,
29
- onClear: b,
30
- onClose: S,
31
- onEnter: c,
32
- tabIndex: g
26
+ onFocus: h,
27
+ onBlur: x,
28
+ onChange: j,
29
+ onClear: y,
30
+ onClose: b,
31
+ onEnter: i,
32
+ tabIndex: q
33
33
  }) => {
34
- const i = N(null), k = (e) => {
35
- var a, r;
36
- e.key === "Escape" && ((a = i.current) == null || a.blur()), e.key === "Enter" && ((r = i.current) == null || r.blur(), c == null || c());
34
+ const e = C(null), S = (c) => {
35
+ var o, r;
36
+ c.key === "Escape" && ((o = e.current) == null || o.blur()), c.key === "Enter" && ((r = e.current) == null || r.blur(), i == null || i());
37
37
  };
38
- return /* @__PURE__ */ C("div", { className: I(s.field, m), children: [
38
+ return /* @__PURE__ */ g("div", { className: k(s.field, m), children: [
39
39
  /* @__PURE__ */ t(
40
40
  "input",
41
41
  {
42
- ref: i,
43
- onFocus: y,
44
- onBlur: h,
45
- name: u,
46
- value: o,
47
- onChange: x,
48
- placeholder: d,
42
+ ref: e,
43
+ onFocus: h,
44
+ onBlur: x,
45
+ name: f,
46
+ value: a,
47
+ onChange: j,
48
+ placeholder: u,
49
49
  className: s.input,
50
- onKeyUp: k,
50
+ onKeyUp: S,
51
51
  type: "search",
52
52
  "aria-haspopup": !0,
53
53
  autoComplete: "off",
54
54
  "aria-autocomplete": "list",
55
- tabIndex: g ?? 0,
55
+ tabIndex: q ?? 0,
56
56
  "data-testid": "searchbar-input"
57
57
  }
58
58
  ),
59
- /* @__PURE__ */ t(v, { svgElement: T, className: s.icon }),
60
- o && /* @__PURE__ */ t(
59
+ /* @__PURE__ */ t(I, { svgElement: N, className: s.icon }),
60
+ a && /* @__PURE__ */ t(
61
61
  n,
62
62
  {
63
63
  icon: l,
64
64
  variant: "solid",
65
65
  size: "custom",
66
66
  className: s.clear,
67
- onClick: b,
67
+ onClick: y,
68
68
  dataTestId: "search-button-clear",
69
69
  iconAltText: _
70
70
  }
@@ -74,9 +74,9 @@ import '../../assets/SearchField.css';const j = "_field_1y3oc_1", A = "_icon_1y3
74
74
  icon: l,
75
75
  variant: "text",
76
76
  className: s.dismiss,
77
- onClick: S,
77
+ onClick: b,
78
78
  dataTestId: "search-button-close",
79
- iconAltText: f
79
+ iconAltText: d
80
80
  }
81
81
  )
82
82
  ] });
package/dist/components/Toolbar/ToolbarSearch.js CHANGED
@@ -2,49 +2,49 @@ import { jsxs as a, jsx as i } from "react/jsx-runtime";
2
2
  import { Icon as m } from "../Icon/Icon.js";
3
3
  import "../../index-L8X2o7IH.js";
4
4
  import "react";
5
- import { IconButton as l } from "../Button/IconButton.js";
5
+ import { IconButton as p } from "../Button/IconButton.js";
6
6
  import "../RootProvider/RootProvider.js";
7
7
  import "../Search/AutocompleteBase.js";
8
8
  import "../Snackbar/useSnackbar.js";
9
- import { S as p } from "../../MagnifyingGlass-DWIcpwS4.js";
9
+ import { S as l } from "../../MagnifyingGlass-DWIcpwS4.js";
10
10
  import { S as u } from "../../XMark-Bv1I87Ev.js";
11
- import '../../assets/ToolbarSearch.css';const _ = "_field_14byu_1", f = "_icon_14byu_5", d = "_input_14byu_14", y = "_clear_14byu_30", o = {
11
+ import '../../assets/ToolbarSearch.css';const _ = "_field_3uyps_1", f = "_icon_3uyps_5", d = "_input_3uyps_14", y = "_clear_3uyps_31", o = {
12
12
  field: _,
13
13
  icon: f,
14
14
  input: d,
15
15
  clear: y
16
- }, M = ({
17
- value: r,
18
- name: c,
19
- placeholder: s = "Search",
16
+ }, T = ({
17
+ value: t,
18
+ name: r,
19
+ placeholder: c = "Search",
20
20
  clearButtonAltText: n = "Clear search",
21
21
  onChange: e,
22
- onClear: t
22
+ onClear: s
23
23
  }) => /* @__PURE__ */ a("div", { className: o.field, children: [
24
24
  /* @__PURE__ */ i(
25
25
  "input",
26
26
  {
27
27
  type: "search",
28
- value: r,
29
- name: c,
30
- placeholder: s,
28
+ value: t,
29
+ name: r,
30
+ placeholder: c,
31
31
  className: o.input,
32
32
  onChange: e
33
33
  }
34
34
  ),
35
- /* @__PURE__ */ i(m, { svgElement: p, className: o.icon }),
36
- t && /* @__PURE__ */ i(
37
- l,
35
+ /* @__PURE__ */ i(m, { svgElement: l, className: o.icon }),
36
+ s && /* @__PURE__ */ i(
37
+ p,
38
38
  {
39
39
  icon: u,
40
40
  variant: "solid",
41
41
  size: "custom",
42
42
  className: o.clear,
43
- onClick: t,
43
+ onClick: s,
44
44
  iconAltText: n
45
45
  }
46
46
  )
47
47
  ] });
48
48
  export {
49
- M as ToolbarSearch
49
+ T as ToolbarSearch
50
50
  };
package/dist/padding.css CHANGED
@@ -1,23 +1,25 @@
1
- [data-padding="1"] {
2
- padding: var(--ds-spacing-1);
3
- }
1
+ :root {
2
+ [data-padding="1"] {
3
+ padding: var(--ds-spacing-1);
4
+ }
4
5
 
5
- [data-padding="2"] {
6
- padding: var(--ds-spacing-2);
7
- }
6
+ [data-padding="2"] {
7
+ padding: var(--ds-spacing-2);
8
+ }
8
9
 
9
- [data-padding="3"] {
10
- padding: var(--ds-spacing-3);
11
- }
10
+ [data-padding="3"] {
11
+ padding: var(--ds-spacing-3);
12
+ }
12
13
 
13
- [data-padding="4"] {
14
- padding: var(--ds-spacing-4);
15
- }
14
+ [data-padding="4"] {
15
+ padding: var(--ds-spacing-4);
16
+ }
16
17
 
17
- [data-padding="5"] {
18
- padding: var(--ds-spacing-5);
19
- }
18
+ [data-padding="5"] {
19
+ padding: var(--ds-spacing-5);
20
+ }
20
21
 
21
- [data-padding="6"] {
22
- padding: var(--ds-spacing-6);
22
+ [data-padding="6"] {
23
+ padding: var(--ds-spacing-6);
24
+ }
23
25
  }
package/dist/shadow.css CHANGED
@@ -1,19 +1,21 @@
1
- [data-shadow="xs"] {
2
- box-shadow: var(--ds-shadow-xs);
3
- }
1
+ :root {
2
+ [data-shadow="xs"] {
3
+ box-shadow: var(--ds-shadow-xs);
4
+ }
4
5
 
5
- [data-shadow="sm"] {
6
- box-shadow: var(--ds-shadow-sm);
7
- }
6
+ [data-shadow="sm"] {
7
+ box-shadow: var(--ds-shadow-sm);
8
+ }
8
9
 
9
- [data-shadow="md"] {
10
- box-shadow: var(--ds-shadow-md);
11
- }
10
+ [data-shadow="md"] {
11
+ box-shadow: var(--ds-shadow-md);
12
+ }
12
13
 
13
- [data-shadow="lg"] {
14
- box-shadow: var(--ds-shadow-lg);
15
- }
14
+ [data-shadow="lg"] {
15
+ box-shadow: var(--ds-shadow-lg);
16
+ }
16
17
 
17
- [data-shadow="xl"] {
18
- box-shadow: var(--ds-shadow-xl);
18
+ [data-shadow="xl"] {
19
+ box-shadow: var(--ds-shadow-xl);
20
+ }
19
21
  }
package/dist/spacing.css CHANGED
@@ -1,31 +1,33 @@
1
- [data-spacing="1"] {
2
- gap: var(--ds-spacing-1);
3
- }
1
+ :root {
2
+ [data-spacing="1"] {
3
+ gap: var(--ds-spacing-1);
4
+ }
4
5
 
5
- [data-spacing="2"] {
6
- gap: var(--ds-spacing-2);
7
- }
6
+ [data-spacing="2"] {
7
+ gap: var(--ds-spacing-2);
8
+ }
8
9
 
9
- [data-spacing="3"] {
10
- gap: var(--ds-spacing-3);
11
- }
10
+ [data-spacing="3"] {
11
+ gap: var(--ds-spacing-3);
12
+ }
12
13
 
13
- [data-spacing="4"] {
14
- gap: var(--ds-spacing-4);
15
- }
14
+ [data-spacing="4"] {
15
+ gap: var(--ds-spacing-4);
16
+ }
16
17
 
17
- [data-spacing="5"] {
18
- gap: var(--ds-spacing-5);
19
- }
18
+ [data-spacing="5"] {
19
+ gap: var(--ds-spacing-5);
20
+ }
20
21
 
21
- [data-spacing="6"] {
22
- gap: var(--ds-spacing-6);
23
- }
22
+ [data-spacing="6"] {
23
+ gap: var(--ds-spacing-6);
24
+ }
24
25
 
25
- [data-spacing="7"] {
26
- gap: var(--ds-spacing-7);
27
- }
26
+ [data-spacing="7"] {
27
+ gap: var(--ds-spacing-7);
28
+ }
28
29
 
29
- [data-spacing="8"] {
30
- gap: var(--ds-spacing-8);
30
+ [data-spacing="8"] {
31
+ gap: var(--ds-spacing-8);
32
+ }
31
33
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@altinn/altinn-components",
3
- "version": "0.22.0",
3
+ "version": "0.22.2",
4
4
  "main": "dist/index.js",
5
5
  "files": [
6
6
  "dist/",