@altinn/altinn-components 0.21.2 → 0.21.4
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/README.md +7 -1
- package/dist/assets/MenuItemBase.css +1 -1
- package/dist/components/Menu/MenuItemBase.js +32 -32
- package/dist/global.css +0 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -61,7 +61,13 @@ and import the css file in your application once, e.g. in your css:
|
|
|
61
61
|
import "@altinn/altinn-components/lib/css/global.css";
|
|
62
62
|
```
|
|
63
63
|
|
|
64
|
-
for correct
|
|
64
|
+
for correct and minimal collection of global resets and variables.
|
|
65
|
+
|
|
66
|
+
Ensure that you have the font faces for the Inter font family properly loaded:
|
|
67
|
+
|
|
68
|
+
```html
|
|
69
|
+
<link rel="stylesheet" href="https://altinncdn.no/fonts/inter/v4.1/inter.css" integrity="sha384-OcHzc/By/OPw9uJREawUCjP2inbOGKtKb4A/I2iXxmknUfog2H8Adx71tWVZRscD" crossorigin="anonymous">
|
|
70
|
+
```
|
|
65
71
|
|
|
66
72
|
## Documentation
|
|
67
73
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._item_1gk35_1{font:inherit;color:inherit;padding:0;border:0;text-align:inherit;text-decoration:none;line-height:normal;-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-user-select:none;user-select:none;cursor:pointer;position:relative;width:100%;display:flex;align-items:center;column-gap:.25rem;margin:.5rem 0;border-radius:2px}._item_1gk35_1[aria-disabled=true]{opacity:.5;pointer-events:none}._item_1gk35_1[data-size=md]{min-height:56px}._item_1gk35_1[data-size=md]{min-height:44px}._item_1gk35_1[data-size=sm]{min-height:40px}._content_1gk35_45{display:flex;width:100%;align-items:center;column-gap:6px;padding:6px}._action_1gk35_53{display:flex;justify-content:center;align-items:center;padding:10px}._linkText_1gk35_60{font-size:.875rem;white-space:nowrap}._linkIcon_1gk35_65{font-size:1.5rem}._item_1gk35_1,._item_1gk35_1[data-theme]{background-color:transparent}[data-theme=subtle] ._item_1gk35_1:hover{background-color:var(--ds-color-surface-hover)}[data-theme=subtle] ._item_1gk35_1:active{background-color:var(--ds-color-surface-active)}[data-theme=subtle] ._item_1gk35_1[data-selected=true]{background-color:var(--ds-color-background-default)}[data-theme=default] ._item_1gk35_1:hover{background-color:var(--ds-color-surface-hover)}[data-theme=default] ._item_1gk35_1:active{background-color:var(--ds-color-surface-active)}[data-theme=default] ._item_1gk35_1[data-selected=true]{background-color:var(--ds-color-background-subtle)}
|
|
@@ -1,62 +1,62 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { c as
|
|
3
|
-
import { Icon as
|
|
1
|
+
import { jsxs as c, jsx as m } from "react/jsx-runtime";
|
|
2
|
+
import { c as u } from "../../index-L8X2o7IH.js";
|
|
3
|
+
import { Icon as v } from "../Icon/Icon.js";
|
|
4
4
|
import "react";
|
|
5
5
|
import { Badge as T } from "../Badge/Badge.js";
|
|
6
6
|
import "../RootProvider/RootProvider.js";
|
|
7
7
|
import "../Search/AutocompleteBase.js";
|
|
8
8
|
import "../Snackbar/useSnackbar.js";
|
|
9
|
-
import '../../assets/MenuItemBase.css';const j = "
|
|
9
|
+
import '../../assets/MenuItemBase.css';const j = "_item_1gk35_1", B = "_content_1gk35_45", E = "_action_1gk35_53", g = "_linkText_1gk35_60", z = "_linkIcon_1gk35_65", n = {
|
|
10
10
|
item: j,
|
|
11
11
|
content: B,
|
|
12
12
|
action: E,
|
|
13
|
-
linkText:
|
|
14
|
-
linkIcon:
|
|
15
|
-
},
|
|
13
|
+
linkText: g,
|
|
14
|
+
linkIcon: z
|
|
15
|
+
}, L = ({
|
|
16
16
|
as: _,
|
|
17
17
|
color: l,
|
|
18
18
|
theme: p,
|
|
19
19
|
size: d,
|
|
20
20
|
className: h,
|
|
21
|
-
href:
|
|
21
|
+
href: x,
|
|
22
22
|
onClick: e,
|
|
23
|
-
onKeyPress:
|
|
24
|
-
tabIndex:
|
|
25
|
-
hidden:
|
|
26
|
-
selected:
|
|
27
|
-
disabled:
|
|
28
|
-
linkIcon:
|
|
29
|
-
linkText:
|
|
23
|
+
onKeyPress: o,
|
|
24
|
+
tabIndex: f = 0,
|
|
25
|
+
hidden: k,
|
|
26
|
+
selected: I,
|
|
27
|
+
disabled: i = !1,
|
|
28
|
+
linkIcon: a,
|
|
29
|
+
linkText: s,
|
|
30
30
|
badge: t,
|
|
31
|
-
children:
|
|
32
|
-
}) => /* @__PURE__ */
|
|
31
|
+
children: N
|
|
32
|
+
}) => /* @__PURE__ */ c(
|
|
33
33
|
_ || "a",
|
|
34
34
|
{
|
|
35
|
-
tabIndex:
|
|
36
|
-
className:
|
|
35
|
+
tabIndex: i ? "-1" : f ?? 0,
|
|
36
|
+
className: u(h, n.item),
|
|
37
37
|
"data-size": d,
|
|
38
38
|
"data-color": l,
|
|
39
39
|
"data-theme": p,
|
|
40
|
-
"aria-hidden":
|
|
41
|
-
"aria-disabled":
|
|
42
|
-
"data-selected":
|
|
43
|
-
href:
|
|
44
|
-
onKeyPress: (
|
|
45
|
-
|
|
40
|
+
"aria-hidden": k,
|
|
41
|
+
"aria-disabled": i,
|
|
42
|
+
"data-selected": I,
|
|
43
|
+
href: x,
|
|
44
|
+
onKeyPress: (r) => {
|
|
45
|
+
r.key === "Enter" && (e == null || e()), o == null || o(r);
|
|
46
46
|
},
|
|
47
47
|
onClick: e,
|
|
48
48
|
children: [
|
|
49
|
-
/* @__PURE__ */
|
|
50
|
-
|
|
51
|
-
t && /* @__PURE__ */
|
|
49
|
+
/* @__PURE__ */ c("div", { className: n.content, children: [
|
|
50
|
+
N,
|
|
51
|
+
t && /* @__PURE__ */ m(T, { ...t, theme: (t == null ? void 0 : t.theme) || "surface" })
|
|
52
52
|
] }),
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
53
|
+
a && /* @__PURE__ */ c("div", { className: n.action, children: [
|
|
54
|
+
s && /* @__PURE__ */ m("span", { className: n.linkText, children: s }),
|
|
55
|
+
a && /* @__PURE__ */ m(v, { svgElement: a, className: n.linkIcon })
|
|
56
56
|
] })
|
|
57
57
|
]
|
|
58
58
|
}
|
|
59
59
|
);
|
|
60
60
|
export {
|
|
61
|
-
|
|
61
|
+
L as MenuItemBase
|
|
62
62
|
};
|
package/dist/global.css
CHANGED