@biblioteksentralen/react 1.0.0 → 2.0.0
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/dist/index.js +73 -206
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +36 -140
- package/dist/index.mjs.map +1 -1
- package/package.json +4 -3
package/dist/index.mjs
CHANGED
|
@@ -1,114 +1,9 @@
|
|
|
1
1
|
// src/index.ts
|
|
2
2
|
export * from "@chakra-ui/react";
|
|
3
3
|
|
|
4
|
-
// ../icons/dist/index.mjs
|
|
5
|
-
import React from "react";
|
|
6
|
-
import React2 from "react";
|
|
7
|
-
import React3 from "react";
|
|
8
|
-
import React4 from "react";
|
|
9
|
-
import React5 from "react";
|
|
10
|
-
import React6 from "react";
|
|
11
|
-
import React7 from "react";
|
|
12
|
-
import React8 from "react";
|
|
13
|
-
import * as React9 from "react";
|
|
14
|
-
import * as React10 from "react";
|
|
15
|
-
import * as React11 from "react";
|
|
16
|
-
import * as React12 from "react";
|
|
17
|
-
import React13 from "react";
|
|
18
|
-
import React14 from "react";
|
|
19
|
-
import React15 from "react";
|
|
20
|
-
import React16 from "react";
|
|
21
|
-
import React17 from "react";
|
|
22
|
-
import React18 from "react";
|
|
23
|
-
import React19 from "react";
|
|
24
|
-
import React20 from "react";
|
|
25
|
-
import React21 from "react";
|
|
26
|
-
import React22 from "react";
|
|
27
|
-
import React23 from "react";
|
|
28
|
-
import React24 from "react";
|
|
29
|
-
import React25 from "react";
|
|
30
|
-
import React26 from "react";
|
|
31
|
-
import React27 from "react";
|
|
32
|
-
import React28 from "react";
|
|
33
|
-
import React29 from "react";
|
|
34
|
-
import React30 from "react";
|
|
35
|
-
import React31 from "react";
|
|
36
|
-
import React32 from "react";
|
|
37
|
-
import * as React33 from "react";
|
|
38
|
-
import React34 from "react";
|
|
39
|
-
import React35 from "react";
|
|
40
|
-
import React36 from "react";
|
|
41
|
-
import React37 from "react";
|
|
42
|
-
import React38 from "react";
|
|
43
|
-
import React39 from "react";
|
|
44
|
-
import React40 from "react";
|
|
45
|
-
import React41 from "react";
|
|
46
|
-
import React42 from "react";
|
|
47
|
-
import * as React43 from "react";
|
|
48
|
-
import React44 from "react";
|
|
49
|
-
import React45 from "react";
|
|
50
|
-
import React46 from "react";
|
|
51
|
-
import React47 from "react";
|
|
52
|
-
import React48 from "react";
|
|
53
|
-
import React49 from "react";
|
|
54
|
-
import React50 from "react";
|
|
55
|
-
import React51 from "react";
|
|
56
|
-
import React52 from "react";
|
|
57
|
-
import React53 from "react";
|
|
58
|
-
import React54 from "react";
|
|
59
|
-
import React55 from "react";
|
|
60
|
-
import React56 from "react";
|
|
61
|
-
import React57 from "react";
|
|
62
|
-
import React58 from "react";
|
|
63
|
-
import React59 from "react";
|
|
64
|
-
import React60 from "react";
|
|
65
|
-
import React61 from "react";
|
|
66
|
-
import React62 from "react";
|
|
67
|
-
import React63 from "react";
|
|
68
|
-
import React64 from "react";
|
|
69
|
-
import React65 from "react";
|
|
70
|
-
import React66 from "react";
|
|
71
|
-
import React67 from "react";
|
|
72
|
-
import React68 from "react";
|
|
73
|
-
import * as React69 from "react";
|
|
74
|
-
import React70 from "react";
|
|
75
|
-
import React71 from "react";
|
|
76
|
-
import React72 from "react";
|
|
77
|
-
import React73 from "react";
|
|
78
|
-
import React74 from "react";
|
|
79
|
-
import React75 from "react";
|
|
80
|
-
import React76 from "react";
|
|
81
|
-
import React77 from "react";
|
|
82
|
-
import React78 from "react";
|
|
83
|
-
import React79 from "react";
|
|
84
|
-
import * as React80 from "react";
|
|
85
|
-
import React81 from "react";
|
|
86
|
-
import React82 from "react";
|
|
87
|
-
import React83 from "react";
|
|
88
|
-
import React84 from "react";
|
|
89
|
-
import React85 from "react";
|
|
90
|
-
import React86 from "react";
|
|
91
|
-
import React87 from "react";
|
|
92
|
-
import React88 from "react";
|
|
93
|
-
import React89 from "react";
|
|
94
|
-
import React90 from "react";
|
|
95
|
-
import React91 from "react";
|
|
96
|
-
import React92 from "react";
|
|
97
|
-
import React93 from "react";
|
|
98
|
-
var BsCheckCircle = (props) => /* @__PURE__ */ React16.createElement("svg", { fill: "currentColor", viewBox: "0 0 16 16", height: "1em", width: "1em", ...props }, /* @__PURE__ */ React16.createElement("path", { d: "M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" }), /* @__PURE__ */ React16.createElement("path", { d: "M10.97 4.97a.235.235 0 0 0-.02.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05z" }));
|
|
99
|
-
var BsExclamationCircle = (props) => /* @__PURE__ */ React21.createElement("svg", { fill: "currentColor", viewBox: "0 0 16 16", height: "1em", width: "1em", ...props }, /* @__PURE__ */ React21.createElement("path", { d: "M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" }), /* @__PURE__ */ React21.createElement("path", { d: "M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 4.995z" }));
|
|
100
|
-
var BsXCircle = (props) => /* @__PURE__ */ React31.createElement("svg", { fill: "currentColor", viewBox: "0 0 16 16", height: "1em", width: "1em", ...props }, /* @__PURE__ */ React31.createElement("path", { d: "M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" }), /* @__PURE__ */ React31.createElement("path", { d: "M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z" }));
|
|
101
|
-
var InformationIcon = (props) => /* @__PURE__ */ React69.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", ...props, viewBox: "2 2 20 20" }, /* @__PURE__ */ React69.createElement(
|
|
102
|
-
"path",
|
|
103
|
-
{
|
|
104
|
-
d: "M12 2.25c5.385 0 9.75 4.365 9.75 9.75s-4.365 9.75-9.75 9.75c-5.384 0-9.75-4.365-9.75-9.75S6.616 2.25 12 2.25zm0 1.5a8.25 8.25 0 1 0 0 16.5 8.25 8.25 0 0 0 0-16.5zm0 6.5a.75.75 0 0 1 .75.75v4.971l-.007.102a.75.75 0 0 1-1.493-.102V11l.007-.102A.75.75 0 0 1 12 10.25zm0-2.75A.75.75 0 1 1 12 9a.75.75 0 0 1 0-1.5z",
|
|
105
|
-
fill: "currentColor"
|
|
106
|
-
}
|
|
107
|
-
));
|
|
108
|
-
|
|
109
4
|
// ../utils/dist/index.mjs
|
|
110
|
-
import { format } from "date-fns";
|
|
111
|
-
import { nb } from "date-fns/locale";
|
|
5
|
+
import { format } from "date-fns/format";
|
|
6
|
+
import { nb } from "date-fns/locale/nb";
|
|
112
7
|
var colors = {
|
|
113
8
|
black: "#000000",
|
|
114
9
|
grey90: "#181818",
|
|
@@ -136,8 +31,8 @@ var colors = {
|
|
|
136
31
|
statusYellow: "#bc5600",
|
|
137
32
|
statusGreen: "#24845b",
|
|
138
33
|
statusGreenLight: "#edf4f1",
|
|
139
|
-
|
|
140
|
-
|
|
34
|
+
statusRedLight: "#f8efef",
|
|
35
|
+
statusYellowLight: "#fff6e4",
|
|
141
36
|
neptune: {
|
|
142
37
|
"100": "#CFE6E8",
|
|
143
38
|
"200": "#9FCDD2",
|
|
@@ -156,18 +51,19 @@ function isDevelopment() {
|
|
|
156
51
|
|
|
157
52
|
// src/components/Alert.tsx
|
|
158
53
|
import { Box, Flex } from "@chakra-ui/react";
|
|
159
|
-
import
|
|
54
|
+
import React from "react";
|
|
55
|
+
import { AlertCircle, CheckCircle, Info, XCircle } from "react-feather";
|
|
160
56
|
var colorLookup = {
|
|
161
57
|
info: { bg: colors.lightBlue, color: colors.accentBlueMedium },
|
|
162
|
-
warning: { bg: colors.
|
|
163
|
-
success: { bg:
|
|
164
|
-
error: { bg: colors.
|
|
58
|
+
warning: { bg: colors.statusYellowLight, color: colors.statusYellow },
|
|
59
|
+
success: { bg: colors.statusGreenLight, color: colors.statusGreen },
|
|
60
|
+
error: { bg: colors.statusRedLight, color: colors.statusRed }
|
|
165
61
|
};
|
|
166
62
|
var iconLookup = {
|
|
167
|
-
info: /* @__PURE__ */
|
|
168
|
-
warning: /* @__PURE__ */
|
|
169
|
-
success: /* @__PURE__ */
|
|
170
|
-
error: /* @__PURE__ */
|
|
63
|
+
info: /* @__PURE__ */ React.createElement(Info, { strokeWidth: 1.75, role: "img", "aria-label": "Informasjon" }),
|
|
64
|
+
warning: /* @__PURE__ */ React.createElement(AlertCircle, { strokeWidth: 1.75, role: "img", "aria-label": "Advarsel" }),
|
|
65
|
+
success: /* @__PURE__ */ React.createElement(CheckCircle, { strokeWidth: 1.75, role: "img", "aria-label": "Suksess" }),
|
|
66
|
+
error: /* @__PURE__ */ React.createElement(XCircle, { strokeWidth: 1.75, role: "img", "aria-label": "Feil" })
|
|
171
67
|
};
|
|
172
68
|
var variantStyles = {
|
|
173
69
|
inline: {
|
|
@@ -178,13 +74,13 @@ var variantStyles = {
|
|
|
178
74
|
};
|
|
179
75
|
function Alert({ status, children, variant, ...rest }) {
|
|
180
76
|
const colors2 = colorLookup[status];
|
|
181
|
-
return /* @__PURE__ */
|
|
77
|
+
return /* @__PURE__ */ React.createElement(
|
|
182
78
|
Flex,
|
|
183
79
|
{
|
|
184
80
|
role: "alert",
|
|
185
81
|
flexWrap: "wrap",
|
|
186
82
|
alignItems: "center",
|
|
187
|
-
gridGap: "0.
|
|
83
|
+
gridGap: "0.5em 0.6em",
|
|
188
84
|
background: "white",
|
|
189
85
|
border: `0.1rem solid`,
|
|
190
86
|
borderColor: colors2.color,
|
|
@@ -194,8 +90,8 @@ function Alert({ status, children, variant, ...rest }) {
|
|
|
194
90
|
...variant ? variantStyles[variant] : {},
|
|
195
91
|
...rest
|
|
196
92
|
},
|
|
197
|
-
/* @__PURE__ */
|
|
198
|
-
/* @__PURE__ */
|
|
93
|
+
/* @__PURE__ */ React.createElement(Box, { color: colors2.color, flex: "0 0", marginLeft: "auto", marginRight: "auto", lineHeight: "1", fontSize: "1.5em" }, iconLookup[status]),
|
|
94
|
+
/* @__PURE__ */ React.createElement(Box, { flex: "1" }, children)
|
|
199
95
|
);
|
|
200
96
|
}
|
|
201
97
|
|
|
@@ -204,18 +100,18 @@ import { Button as ChakraButton } from "@chakra-ui/react";
|
|
|
204
100
|
var Button = ChakraButton;
|
|
205
101
|
|
|
206
102
|
// src/components/ConditionalWrapper.tsx
|
|
207
|
-
import
|
|
208
|
-
var ConditionalWrapper = ({ condition, children, wrapper: Wrapper }) => condition ? /* @__PURE__ */
|
|
103
|
+
import React2 from "react";
|
|
104
|
+
var ConditionalWrapper = ({ condition, children, wrapper: Wrapper }) => condition ? /* @__PURE__ */ React2.createElement(Wrapper, null, children) : /* @__PURE__ */ React2.createElement(React2.Fragment, null, children);
|
|
209
105
|
|
|
210
106
|
// src/components/HideWithCSS.tsx
|
|
211
107
|
import { Box as Box2 } from "@chakra-ui/react";
|
|
212
|
-
import
|
|
108
|
+
import React3 from "react";
|
|
213
109
|
var HideWithCSS = ({ children, above, below, ...chakraProps }) => {
|
|
214
110
|
const display = {
|
|
215
111
|
...!!below ? { base: "none", [below]: "block" } : {},
|
|
216
112
|
...!!above ? { [above]: "none" } : {}
|
|
217
113
|
};
|
|
218
|
-
return /* @__PURE__ */
|
|
114
|
+
return /* @__PURE__ */ React3.createElement(Box2, { ...chakraProps, display }, children);
|
|
219
115
|
};
|
|
220
116
|
|
|
221
117
|
// src/components/Input.tsx
|
|
@@ -226,13 +122,13 @@ import {
|
|
|
226
122
|
FormLabel,
|
|
227
123
|
Input as ChakraInput
|
|
228
124
|
} from "@chakra-ui/react";
|
|
229
|
-
import
|
|
125
|
+
import React5, { forwardRef } from "react";
|
|
230
126
|
|
|
231
127
|
// src/components/VisuallyHidden.tsx
|
|
232
|
-
import
|
|
128
|
+
import React4, { useEffect } from "react";
|
|
233
129
|
import { VisuallyHidden as ChakraVisuallyHidden } from "@chakra-ui/react";
|
|
234
130
|
function VisuallyHidden({ children, ...rest }) {
|
|
235
|
-
const [forceShow, setForceShow] =
|
|
131
|
+
const [forceShow, setForceShow] = React4.useState(false);
|
|
236
132
|
useEffect(() => {
|
|
237
133
|
if (isDevelopment()) {
|
|
238
134
|
const handleKeyDown = (ev) => {
|
|
@@ -253,13 +149,13 @@ function VisuallyHidden({ children, ...rest }) {
|
|
|
253
149
|
};
|
|
254
150
|
}
|
|
255
151
|
}, []);
|
|
256
|
-
return forceShow ? /* @__PURE__ */
|
|
152
|
+
return forceShow ? /* @__PURE__ */ React4.createElement("span", null, children) : /* @__PURE__ */ React4.createElement(ChakraVisuallyHidden, { position: "fixed" }, children);
|
|
257
153
|
}
|
|
258
154
|
|
|
259
155
|
// src/components/Input.tsx
|
|
260
156
|
var Input = forwardRef((props, ref) => {
|
|
261
157
|
const { labelProps, label, helperText, errorMessage, hideLabel, ...inputProps } = props;
|
|
262
|
-
return /* @__PURE__ */
|
|
158
|
+
return /* @__PURE__ */ React5.createElement(FormControl, { isInvalid: !!errorMessage }, /* @__PURE__ */ React5.createElement(FormLabel, { ...labelProps }, hideLabel ? /* @__PURE__ */ React5.createElement(VisuallyHidden, null, label) : label), helperText && /* @__PURE__ */ React5.createElement(FormHelperText, { marginTop: "-0.25em", marginBottom: "0.25em" }, helperText), /* @__PURE__ */ React5.createElement(ChakraInput, { ref, ...inputProps }), errorMessage && /* @__PURE__ */ React5.createElement(FormErrorMessage, { color: colors.statusRed, fontWeight: 600 }, errorMessage));
|
|
263
159
|
});
|
|
264
160
|
|
|
265
161
|
// src/components/Link.tsx
|
|
@@ -268,7 +164,7 @@ var Link = ChakraLink;
|
|
|
268
164
|
|
|
269
165
|
// src/BiblioteksentralenProvider.tsx
|
|
270
166
|
import { ChakraProvider, extendTheme } from "@chakra-ui/react";
|
|
271
|
-
import
|
|
167
|
+
import React6 from "react";
|
|
272
168
|
|
|
273
169
|
// src/styles/chakraTheme/ButtonStyles.ts
|
|
274
170
|
var variants = {
|
|
@@ -471,13 +367,13 @@ var biblioteksentralenChakraTheme = {
|
|
|
471
367
|
|
|
472
368
|
// src/BiblioteksentralenProvider.tsx
|
|
473
369
|
var emptyTheme = {};
|
|
474
|
-
var BiblioteksentralenProvider = (props) => /* @__PURE__ */
|
|
370
|
+
var BiblioteksentralenProvider = (props) => /* @__PURE__ */ React6.createElement(ChakraProvider, { theme: extendTheme(biblioteksentralenChakraTheme, props.customTheme ?? emptyTheme) }, props.children);
|
|
475
371
|
|
|
476
372
|
// src/components/ErrorBoundary.tsx
|
|
477
373
|
import { Box as Box3 } from "@chakra-ui/react";
|
|
478
|
-
import
|
|
479
|
-
var StyledPre = (props) => /* @__PURE__ */
|
|
480
|
-
var ErrorBoundary = class extends
|
|
374
|
+
import React7 from "react";
|
|
375
|
+
var StyledPre = (props) => /* @__PURE__ */ React7.createElement(Box3, { as: "pre", paddingTop: "0.5rem", wordBreak: "break-all", whiteSpace: "pre-wrap", fontSize: "0.8rem", ...props });
|
|
376
|
+
var ErrorBoundary = class extends React7.Component {
|
|
481
377
|
constructor(props) {
|
|
482
378
|
super(props);
|
|
483
379
|
this.state = { hasError: false };
|
|
@@ -494,7 +390,7 @@ var ErrorBoundary = class extends React100.Component {
|
|
|
494
390
|
const stackTrace = this.state.errorInfo?.componentStack;
|
|
495
391
|
const errormsg = this.state.error?.message;
|
|
496
392
|
const info = this.props.boundaryName;
|
|
497
|
-
return /* @__PURE__ */
|
|
393
|
+
return /* @__PURE__ */ React7.createElement("div", null, /* @__PURE__ */ React7.createElement(Alert, { status: "error" }, /* @__PURE__ */ React7.createElement("p", null, "Beklager, det skjedde en teknisk feil."), isDevelopment() && (stackTrace || errormsg) && /* @__PURE__ */ React7.createElement("div", null, /* @__PURE__ */ React7.createElement(StyledPre, null, errormsg || ""), /* @__PURE__ */ React7.createElement(StyledPre, null, info || ""), /* @__PURE__ */ React7.createElement(StyledPre, null, stackTrace || ""))));
|
|
498
394
|
}
|
|
499
395
|
return this.props.children;
|
|
500
396
|
}
|
|
@@ -502,7 +398,7 @@ var ErrorBoundary = class extends React100.Component {
|
|
|
502
398
|
|
|
503
399
|
// src/components/HashLinkTarget.tsx
|
|
504
400
|
import { Box as Box4 } from "@chakra-ui/react";
|
|
505
|
-
import
|
|
401
|
+
import React8 from "react";
|
|
506
402
|
var focusOnRelativeParentStyle = {
|
|
507
403
|
"&:focus-within": {
|
|
508
404
|
position: "static",
|
|
@@ -521,7 +417,7 @@ var focusOnRelativeParentStyle = {
|
|
|
521
417
|
}
|
|
522
418
|
};
|
|
523
419
|
function HashLinkTarget(props) {
|
|
524
|
-
return /* @__PURE__ */
|
|
420
|
+
return /* @__PURE__ */ React8.createElement(Box4, { position: "relative", sx: props.focusOnParent ? focusOnRelativeParentStyle : void 0 }, /* @__PURE__ */ React8.createElement(
|
|
525
421
|
Box4,
|
|
526
422
|
{
|
|
527
423
|
id: props.id,
|
|
@@ -536,9 +432,9 @@ function HashLinkTarget(props) {
|
|
|
536
432
|
}
|
|
537
433
|
|
|
538
434
|
// src/components/withErrorBoundary.tsx
|
|
539
|
-
import
|
|
435
|
+
import React9 from "react";
|
|
540
436
|
var withErrorBoundary = (Component, boundaryName) => {
|
|
541
|
-
return
|
|
437
|
+
return React9.forwardRef((props, ref) => /* @__PURE__ */ React9.createElement(ErrorBoundary, { boundaryName }, /* @__PURE__ */ React9.createElement(Component, { ...props, ref })));
|
|
542
438
|
};
|
|
543
439
|
export {
|
|
544
440
|
Alert,
|