@obosbbl/grunnmuren-react 1.11.0 → 1.12.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/Campaign/Campaign.d.ts +1 -1
- package/dist/Card/Card.d.ts +1 -1
- package/dist/Checkbox/Checkbox.d.ts +1 -1
- package/dist/grunnmuren.mjs +1337 -0
- package/package.json +14 -14
- package/dist/grunnmuren.es.js +0 -1724
package/dist/grunnmuren.es.js
DELETED
|
@@ -1,1724 +0,0 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __defProps = Object.defineProperties;
|
|
3
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
-
var __spreadValues = (a, b) => {
|
|
9
|
-
for (var prop in b || (b = {}))
|
|
10
|
-
if (__hasOwnProp.call(b, prop))
|
|
11
|
-
__defNormalProp(a, prop, b[prop]);
|
|
12
|
-
if (__getOwnPropSymbols)
|
|
13
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
-
if (__propIsEnum.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
}
|
|
17
|
-
return a;
|
|
18
|
-
};
|
|
19
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
-
var __objRest = (source, exclude) => {
|
|
21
|
-
var target = {};
|
|
22
|
-
for (var prop in source)
|
|
23
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
-
target[prop] = source[prop];
|
|
25
|
-
if (source != null && __getOwnPropSymbols)
|
|
26
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
-
target[prop] = source[prop];
|
|
29
|
-
}
|
|
30
|
-
return target;
|
|
31
|
-
};
|
|
32
|
-
import { useState, useCallback, useEffect, useId, createContext, useContext, forwardRef, Children, isValidElement, cloneElement, useRef, useMemo } from "react";
|
|
33
|
-
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
34
|
-
import useCollapse from "react-collapsed";
|
|
35
|
-
import cx from "clsx";
|
|
36
|
-
import composeRefs from "@seznam/compose-react-refs";
|
|
37
|
-
import { useMedia } from "react-use";
|
|
38
|
-
export { useMedia } from "react-use";
|
|
39
|
-
var __defProp2 = Object.defineProperty;
|
|
40
|
-
var __defProps2 = Object.defineProperties;
|
|
41
|
-
var __getOwnPropDescs2 = Object.getOwnPropertyDescriptors;
|
|
42
|
-
var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
|
|
43
|
-
var __hasOwnProp2 = Object.prototype.hasOwnProperty;
|
|
44
|
-
var __propIsEnum2 = Object.prototype.propertyIsEnumerable;
|
|
45
|
-
var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
46
|
-
var __spreadValues2 = (a, b) => {
|
|
47
|
-
for (var prop in b || (b = {}))
|
|
48
|
-
if (__hasOwnProp2.call(b, prop))
|
|
49
|
-
__defNormalProp2(a, prop, b[prop]);
|
|
50
|
-
if (__getOwnPropSymbols2)
|
|
51
|
-
for (var prop of __getOwnPropSymbols2(b)) {
|
|
52
|
-
if (__propIsEnum2.call(b, prop))
|
|
53
|
-
__defNormalProp2(a, prop, b[prop]);
|
|
54
|
-
}
|
|
55
|
-
return a;
|
|
56
|
-
};
|
|
57
|
-
var __spreadProps2 = (a, b) => __defProps2(a, __getOwnPropDescs2(b));
|
|
58
|
-
const ChevronDown = (props) => /* @__PURE__ */ jsx("svg", __spreadProps2(__spreadValues2({
|
|
59
|
-
width: "1.25em",
|
|
60
|
-
height: "1.25em",
|
|
61
|
-
fill: "none",
|
|
62
|
-
viewBox: "0 0 29 17",
|
|
63
|
-
role: "img",
|
|
64
|
-
"aria-hidden": props["aria-label"] == null
|
|
65
|
-
}, props), {
|
|
66
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
67
|
-
fill: "currentColor",
|
|
68
|
-
d: "M0 4.31662L4.31662 0L14.3752 10.0484L24.4337 0L28.7503 4.31662L17.2563 15.8106C16.4929 16.5722 15.4586 16.9999 14.3803 16.9999C13.3019 16.9999 12.2676 16.5722 11.5042 15.8106L0 4.31662Z"
|
|
69
|
-
})
|
|
70
|
-
}));
|
|
71
|
-
const ChevronLeft = (props) => /* @__PURE__ */ jsx("svg", __spreadProps2(__spreadValues2({
|
|
72
|
-
width: "1.25em",
|
|
73
|
-
height: "1.25em",
|
|
74
|
-
fill: "none",
|
|
75
|
-
viewBox: "0 0 17 29",
|
|
76
|
-
role: "img",
|
|
77
|
-
"aria-hidden": props["aria-label"] == null
|
|
78
|
-
}, props), {
|
|
79
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
80
|
-
fill: "currentColor",
|
|
81
|
-
d: "M12.6771 0L17 4.31278L6.95043 14.3624L17 24.4119L12.6771 28.7247L1.19328 17.2409C0.814993 16.8631 0.514893 16.4143 0.310141 15.9204C0.105389 15.4265 0 14.897 0 14.3624C0 13.8277 0.105389 13.2982 0.310141 12.8043C0.514893 12.3104 0.814993 11.8616 1.19328 11.4838L12.6771 0Z"
|
|
82
|
-
})
|
|
83
|
-
}));
|
|
84
|
-
const ChevronRight = (props) => /* @__PURE__ */ jsx("svg", __spreadProps2(__spreadValues2({
|
|
85
|
-
width: "1.25em",
|
|
86
|
-
height: "1.25em",
|
|
87
|
-
fill: "none",
|
|
88
|
-
viewBox: "0 0 17 29",
|
|
89
|
-
role: "img",
|
|
90
|
-
"aria-hidden": props["aria-label"] == null
|
|
91
|
-
}, props), {
|
|
92
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
93
|
-
fill: "currentColor",
|
|
94
|
-
d: "M4.32295 28.7247L0 24.4119L10.0496 14.3624L0 4.31278L4.32295 0L15.8067 11.4838C16.185 11.8616 16.4851 12.3104 16.6899 12.8043C16.8946 13.2982 17 13.8277 17 14.3624C17 14.897 16.8946 15.4265 16.6899 15.9204C16.4851 16.4143 16.185 16.8631 15.8067 17.2409L4.32295 28.7247Z"
|
|
95
|
-
})
|
|
96
|
-
}));
|
|
97
|
-
const Close = (props) => /* @__PURE__ */ jsx("svg", __spreadProps2(__spreadValues2({
|
|
98
|
-
width: "1.25em",
|
|
99
|
-
height: "1.25em",
|
|
100
|
-
fill: "none",
|
|
101
|
-
viewBox: "0 0 29 29",
|
|
102
|
-
role: "img",
|
|
103
|
-
"aria-hidden": props["aria-label"] == null
|
|
104
|
-
}, props), {
|
|
105
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
106
|
-
fill: "currentColor",
|
|
107
|
-
d: "M29 4.35585L24.6441 0L14.5 10.1431L4.35585 0L0 4.35585L10.1431 14.5L0 24.6441L4.35585 29L14.5 18.8569L24.6441 29L29 24.6441L18.8569 14.5L29 4.35585Z"
|
|
108
|
-
})
|
|
109
|
-
}));
|
|
110
|
-
const InfoCircle = (props) => /* @__PURE__ */ jsx("svg", __spreadProps2(__spreadValues2({
|
|
111
|
-
width: "1.25em",
|
|
112
|
-
height: "1.25em",
|
|
113
|
-
fill: "none",
|
|
114
|
-
viewBox: "0 0 32 32",
|
|
115
|
-
role: "img",
|
|
116
|
-
"aria-hidden": props["aria-label"] == null
|
|
117
|
-
}, props), {
|
|
118
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
119
|
-
fill: "currentColor",
|
|
120
|
-
d: "M16 0C12.8355 0 9.74207 0.938384 7.11088 2.69649C4.4797 4.45459 2.42894 6.95345 1.21793 9.87707C0.0069325 12.8007 -0.309921 16.0177 0.307443 19.1214C0.924806 22.2251 2.44866 25.0761 4.6863 27.3137C6.92394 29.5513 9.77487 31.0752 12.8786 31.6926C15.9823 32.3099 19.1993 31.9931 22.1229 30.7821C25.0466 29.5711 27.5454 27.5203 29.3035 24.8891C31.0616 22.2579 32 19.1645 32 16C32 11.7565 30.3143 7.68687 27.3137 4.68629C24.3131 1.68571 20.2435 0 16 0ZM18 26H14V15H18V26ZM18 11H14V7H18V11Z"
|
|
121
|
-
})
|
|
122
|
-
}));
|
|
123
|
-
const LoadingSpinner = (props) => /* @__PURE__ */ jsx("svg", __spreadProps2(__spreadValues2({
|
|
124
|
-
width: "1.25em",
|
|
125
|
-
height: "1.25em",
|
|
126
|
-
fill: "none",
|
|
127
|
-
viewBox: "0 0 30 30",
|
|
128
|
-
role: "img",
|
|
129
|
-
"aria-hidden": props["aria-label"] == null
|
|
130
|
-
}, props), {
|
|
131
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
132
|
-
fill: "currentColor",
|
|
133
|
-
fillRule: "evenodd",
|
|
134
|
-
d: "M14.4018 0.0119327C16.9653 -0.0903685 19.5121 0.466497 21.7989 1.6293C24.0856 2.79211 26.036 4.522 27.4635 6.65362C28.8909 8.78525 29.7479 11.2474 29.9523 13.8047C30.1567 16.3619 29.7019 18.9289 28.6312 21.2603C27.5605 23.5916 25.9097 25.6094 23.8367 27.1207C22.7211 27.9341 21.1572 27.6891 20.3438 26.5734C19.5304 25.4577 19.7755 23.8939 20.8912 23.0805C22.2732 22.0729 23.3737 20.7277 24.0874 19.1735C24.8012 17.6193 25.1045 15.908 24.9682 14.2031C24.8319 12.4982 24.2606 10.8568 23.309 9.43575C22.3573 8.01466 21.0571 6.86141 19.5326 6.0862C18.008 5.311 16.3102 4.93975 14.6012 5.00796C12.8923 5.07616 11.2294 5.58152 9.7715 6.47575C8.3136 7.36998 7.10942 8.62318 6.27403 10.1156C5.43865 11.608 5 13.2897 5 15C5 16.3807 3.88071 17.5 2.5 17.5C1.11929 17.5 0 16.3807 0 15C0 12.4346 0.657978 9.91198 1.91105 7.67337C3.16412 5.43477 4.97041 3.55497 7.15726 2.21362C9.34411 0.872282 11.8384 0.114234 14.4018 0.0119327ZM14.5 30C15.8807 30 17 28.8807 17 27.5C17 26.1193 15.8807 25 14.5 25C13.1193 25 12 26.1193 12 27.5C12 28.8807 13.1193 30 14.5 30Z",
|
|
135
|
-
clipRule: "evenodd"
|
|
136
|
-
})
|
|
137
|
-
}));
|
|
138
|
-
const MenuAlt = (props) => /* @__PURE__ */ jsx("svg", __spreadProps2(__spreadValues2({
|
|
139
|
-
width: "1.25em",
|
|
140
|
-
height: "1.25em",
|
|
141
|
-
fill: "none",
|
|
142
|
-
viewBox: "0 0 28 26",
|
|
143
|
-
role: "img",
|
|
144
|
-
"aria-hidden": props["aria-label"] == null
|
|
145
|
-
}, props), {
|
|
146
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
147
|
-
fill: "currentColor",
|
|
148
|
-
fillRule: "evenodd",
|
|
149
|
-
d: "M0 0H28V6H0V0ZM0 20H28V26H0V20Z",
|
|
150
|
-
clipRule: "evenodd"
|
|
151
|
-
})
|
|
152
|
-
}));
|
|
153
|
-
const Warning = (props) => /* @__PURE__ */ jsx("svg", __spreadProps2(__spreadValues2({
|
|
154
|
-
width: "1.25em",
|
|
155
|
-
height: "1.25em",
|
|
156
|
-
fill: "none",
|
|
157
|
-
viewBox: "0 0 32 30",
|
|
158
|
-
role: "img",
|
|
159
|
-
"aria-hidden": props["aria-label"] == null
|
|
160
|
-
}, props), {
|
|
161
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
162
|
-
fill: "currentColor",
|
|
163
|
-
d: "M31.549 24.132L20.12 2.155C19.7824 1.50555 19.273 0.961197 18.6474 0.581216C18.0218 0.201234 17.304 0.000197802 16.572 0H15.428C14.696 0.000197802 13.9782 0.201234 13.3526 0.581216C12.727 0.961197 12.2176 1.50555 11.88 2.155L0.451 24.132C0.154748 24.7022 6.05376e-05 25.3354 0 25.978V26C0 27.0609 0.421427 28.0783 1.17157 28.8284C1.92172 29.5786 2.93913 30 4 30H28C29.0609 30 30.0783 29.5786 30.8284 28.8284C31.5786 28.0783 32 27.0609 32 26V25.978C31.9999 25.3354 31.8453 24.7022 31.549 24.132ZM18 26H14V22H18V26ZM18 18H14V7H18V18Z"
|
|
164
|
-
})
|
|
165
|
-
}));
|
|
166
|
-
const noop = () => {
|
|
167
|
-
};
|
|
168
|
-
const QUERY = "(prefers-reduced-motion: reduce)";
|
|
169
|
-
const usePrefersReducedMotion = (defaultState = false) => useMedia(QUERY, defaultState);
|
|
170
|
-
function useBlockBackgroundColor(blockBgColor) {
|
|
171
|
-
switch (blockBgColor) {
|
|
172
|
-
case "gray":
|
|
173
|
-
return "bg-gray-concrete";
|
|
174
|
-
case "green":
|
|
175
|
-
return "bg-green-lightest";
|
|
176
|
-
case "yellow":
|
|
177
|
-
return "bg-yellow";
|
|
178
|
-
case "blue":
|
|
179
|
-
return "bg-blue-lightest";
|
|
180
|
-
}
|
|
181
|
-
}
|
|
182
|
-
const useScreenMaxWidthMd = (defaultState) => useMedia("(max-width: 767.9px)", defaultState);
|
|
183
|
-
function useFormControlValidity(ref, enabled = true) {
|
|
184
|
-
const [validity, setValidity] = useState("indeterminate");
|
|
185
|
-
const [validationMessage, setValidationMessage] = useState();
|
|
186
|
-
const onBlur = useCallback((event) => {
|
|
187
|
-
const isValid = event.target.checkValidity();
|
|
188
|
-
if (isValid) {
|
|
189
|
-
setValidity("valid");
|
|
190
|
-
setValidationMessage(void 0);
|
|
191
|
-
}
|
|
192
|
-
}, []);
|
|
193
|
-
const onInput = useCallback((event) => {
|
|
194
|
-
if (validity !== "indeterminate") {
|
|
195
|
-
const isValid = event.target.checkValidity();
|
|
196
|
-
if (isValid) {
|
|
197
|
-
setValidity("valid");
|
|
198
|
-
setValidationMessage(void 0);
|
|
199
|
-
}
|
|
200
|
-
}
|
|
201
|
-
}, [validity]);
|
|
202
|
-
const onInvalid = useCallback((event) => {
|
|
203
|
-
event.preventDefault();
|
|
204
|
-
const message = event.target.validationMessage;
|
|
205
|
-
setValidationMessage(message);
|
|
206
|
-
setValidity("invalid");
|
|
207
|
-
}, []);
|
|
208
|
-
useEffect(() => {
|
|
209
|
-
var _a;
|
|
210
|
-
const { current } = ref;
|
|
211
|
-
if (enabled && ((_a = current == null ? void 0 : current.form) == null ? void 0 : _a.noValidate) !== true) {
|
|
212
|
-
current == null ? void 0 : current.addEventListener("blur", onBlur);
|
|
213
|
-
current == null ? void 0 : current.addEventListener("input", onInput);
|
|
214
|
-
current == null ? void 0 : current.addEventListener("invalid", onInvalid);
|
|
215
|
-
}
|
|
216
|
-
return () => {
|
|
217
|
-
current == null ? void 0 : current.removeEventListener("blur", onBlur);
|
|
218
|
-
current == null ? void 0 : current.removeEventListener("input", onInput);
|
|
219
|
-
current == null ? void 0 : current.removeEventListener("invalid", onInvalid);
|
|
220
|
-
};
|
|
221
|
-
}, [enabled, onInput]);
|
|
222
|
-
return { validity, validationMessage };
|
|
223
|
-
}
|
|
224
|
-
function useFallbackId(id) {
|
|
225
|
-
const generatedId = useId();
|
|
226
|
-
return id != null ? id : generatedId;
|
|
227
|
-
}
|
|
228
|
-
const DURATION_MS = 300;
|
|
229
|
-
const DURATION_TW = "duration-300";
|
|
230
|
-
const Accordion = (props) => {
|
|
231
|
-
const _a = props, {
|
|
232
|
-
className
|
|
233
|
-
} = _a, rest = __objRest(_a, [
|
|
234
|
-
"className"
|
|
235
|
-
]);
|
|
236
|
-
return /* @__PURE__ */ jsx("div", __spreadValues({
|
|
237
|
-
className: cx(className, "flex flex-col gap-2")
|
|
238
|
-
}, rest));
|
|
239
|
-
};
|
|
240
|
-
const AccordionContext = createContext({
|
|
241
|
-
isExpanded: false,
|
|
242
|
-
setExpanded: noop,
|
|
243
|
-
getCollapseProps: noop,
|
|
244
|
-
getToggleProps: noop,
|
|
245
|
-
onChange: noop
|
|
246
|
-
});
|
|
247
|
-
const AccordionItem = (props) => {
|
|
248
|
-
const prefersReducedMotion = usePrefersReducedMotion();
|
|
249
|
-
const _a = props, {
|
|
250
|
-
className,
|
|
251
|
-
defaultOpen,
|
|
252
|
-
onChange = noop,
|
|
253
|
-
open
|
|
254
|
-
} = _a, rest = __objRest(_a, [
|
|
255
|
-
"className",
|
|
256
|
-
"defaultOpen",
|
|
257
|
-
"onChange",
|
|
258
|
-
"open"
|
|
259
|
-
]);
|
|
260
|
-
const collapseContext = useCollapse({
|
|
261
|
-
defaultExpanded: defaultOpen,
|
|
262
|
-
isExpanded: open,
|
|
263
|
-
duration: DURATION_MS,
|
|
264
|
-
hasDisabledAnimation: prefersReducedMotion,
|
|
265
|
-
easing: "cubic-bezier(0.25, 0.1, 0.25, 1)"
|
|
266
|
-
});
|
|
267
|
-
return /* @__PURE__ */ jsx(AccordionContext.Provider, {
|
|
268
|
-
value: __spreadValues({
|
|
269
|
-
onChange
|
|
270
|
-
}, collapseContext),
|
|
271
|
-
children: /* @__PURE__ */ jsx("div", __spreadValues({
|
|
272
|
-
className: cx(className, "rounded-sm border-b-2 border-l-4 border-solid", collapseContext.isExpanded ? "border-l-green-dark" : "border-l-green")
|
|
273
|
-
}, rest))
|
|
274
|
-
});
|
|
275
|
-
};
|
|
276
|
-
const AccordionHeader = (props) => {
|
|
277
|
-
const _a = props, {
|
|
278
|
-
children,
|
|
279
|
-
className,
|
|
280
|
-
as: Heading = "h3"
|
|
281
|
-
} = _a, rest = __objRest(_a, [
|
|
282
|
-
"children",
|
|
283
|
-
"className",
|
|
284
|
-
"as"
|
|
285
|
-
]);
|
|
286
|
-
const {
|
|
287
|
-
getToggleProps,
|
|
288
|
-
onChange,
|
|
289
|
-
isExpanded
|
|
290
|
-
} = useContext(AccordionContext);
|
|
291
|
-
const toggleProps = getToggleProps({
|
|
292
|
-
onClick: () => onChange(!isExpanded)
|
|
293
|
-
});
|
|
294
|
-
return /* @__PURE__ */ jsx(Heading, {
|
|
295
|
-
children: /* @__PURE__ */ jsxs("button", __spreadProps(__spreadValues(__spreadValues({
|
|
296
|
-
className: cx(className, "focus-visible:outline-blue-dark aria-expanded:bg-green-dark group flex min-h-[4rem] w-full items-center justify-between px-5 py-4 text-left text-lg font-semibold focus:outline-none focus-visible:outline-4 focus-visible:outline-offset-0 aria-expanded:text-white")
|
|
297
|
-
}, rest), toggleProps), {
|
|
298
|
-
id: getToggleId(toggleProps["aria-controls"]),
|
|
299
|
-
children: [children, /* @__PURE__ */ jsx(ChevronDown, {
|
|
300
|
-
className: `shrink-0 text-sm ${DURATION_TW} group-aria-expanded:rotate-180`
|
|
301
|
-
})]
|
|
302
|
-
}))
|
|
303
|
-
});
|
|
304
|
-
};
|
|
305
|
-
const AccordionContent = (props) => {
|
|
306
|
-
const {
|
|
307
|
-
getCollapseProps
|
|
308
|
-
} = useContext(AccordionContext);
|
|
309
|
-
const _a = props, {
|
|
310
|
-
className
|
|
311
|
-
} = _a, rest = __objRest(_a, [
|
|
312
|
-
"className"
|
|
313
|
-
]);
|
|
314
|
-
const collapseProps = getCollapseProps();
|
|
315
|
-
return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({}, collapseProps), {
|
|
316
|
-
role: "region",
|
|
317
|
-
"aria-labelledby": getToggleId(collapseProps.id),
|
|
318
|
-
children: /* @__PURE__ */ jsx("div", __spreadValues({
|
|
319
|
-
className: cx(className, "p-5 pb-10")
|
|
320
|
-
}, rest))
|
|
321
|
-
}));
|
|
322
|
-
};
|
|
323
|
-
const getToggleId = (id) => id + "toggle";
|
|
324
|
-
Accordion.Item = AccordionItem;
|
|
325
|
-
Accordion.Header = AccordionHeader;
|
|
326
|
-
Accordion.Content = AccordionContent;
|
|
327
|
-
const Alert = (props) => {
|
|
328
|
-
const _a = props, {
|
|
329
|
-
className,
|
|
330
|
-
children,
|
|
331
|
-
heading,
|
|
332
|
-
severity = "alert"
|
|
333
|
-
} = _a, rest = __objRest(_a, [
|
|
334
|
-
"className",
|
|
335
|
-
"children",
|
|
336
|
-
"heading",
|
|
337
|
-
"severity"
|
|
338
|
-
]);
|
|
339
|
-
return /* @__PURE__ */ jsx("section", __spreadProps(__spreadValues({
|
|
340
|
-
className: cx(className, "p-4 md:py-8", {
|
|
341
|
-
"bg-orange-light": severity === "info",
|
|
342
|
-
"bg-red-light": severity === "alert"
|
|
343
|
-
}),
|
|
344
|
-
role: "alert"
|
|
345
|
-
}, rest), {
|
|
346
|
-
children: /* @__PURE__ */ jsxs("div", {
|
|
347
|
-
className: "flex justify-center",
|
|
348
|
-
children: [/* @__PURE__ */ jsx(AlertIcon, {
|
|
349
|
-
className: "mr-4 flex-none md:mr-8 md:text-2xl",
|
|
350
|
-
severity
|
|
351
|
-
}), /* @__PURE__ */ jsxs("div", {
|
|
352
|
-
className: "w-prose flex-initial",
|
|
353
|
-
children: [/* @__PURE__ */ jsx("h2", {
|
|
354
|
-
className: "h4 mb-2",
|
|
355
|
-
children: heading
|
|
356
|
-
}), children]
|
|
357
|
-
})]
|
|
358
|
-
})
|
|
359
|
-
}));
|
|
360
|
-
};
|
|
361
|
-
const AlertIcon = ({
|
|
362
|
-
severity,
|
|
363
|
-
className
|
|
364
|
-
}) => {
|
|
365
|
-
if (severity === "alert") {
|
|
366
|
-
return /* @__PURE__ */ jsx(Warning, {
|
|
367
|
-
className: cx(className, "text-red")
|
|
368
|
-
});
|
|
369
|
-
}
|
|
370
|
-
return /* @__PURE__ */ jsx(InfoCircle, {
|
|
371
|
-
className: cx(className, "text-orange")
|
|
372
|
-
});
|
|
373
|
-
};
|
|
374
|
-
const Banner = (props) => {
|
|
375
|
-
const _a = props, {
|
|
376
|
-
bgColor: bgColorProp,
|
|
377
|
-
className,
|
|
378
|
-
children,
|
|
379
|
-
heading,
|
|
380
|
-
image
|
|
381
|
-
} = _a, rest = __objRest(_a, [
|
|
382
|
-
"bgColor",
|
|
383
|
-
"className",
|
|
384
|
-
"children",
|
|
385
|
-
"heading",
|
|
386
|
-
"image"
|
|
387
|
-
]);
|
|
388
|
-
const bgColor = useBlockBackgroundColor(bgColorProp);
|
|
389
|
-
return /* @__PURE__ */ jsx("article", __spreadProps(__spreadValues({
|
|
390
|
-
className: cx(className, bgColor, "py-8 px-4 md:py-14")
|
|
391
|
-
}, rest), {
|
|
392
|
-
children: /* @__PURE__ */ jsxs("div", {
|
|
393
|
-
className: "container flex gap-4 max-md:flex-wrap md:gap-12",
|
|
394
|
-
children: [image, /* @__PURE__ */ jsxs("div", {
|
|
395
|
-
className: "w-prose",
|
|
396
|
-
children: [heading && /* @__PURE__ */ jsx("h2", {
|
|
397
|
-
className: "mb-4",
|
|
398
|
-
children: heading
|
|
399
|
-
}), children]
|
|
400
|
-
})]
|
|
401
|
-
})
|
|
402
|
-
}));
|
|
403
|
-
};
|
|
404
|
-
const BannerImage = (props) => {
|
|
405
|
-
return /* @__PURE__ */ jsx("img", __spreadValues({
|
|
406
|
-
loading: "lazy",
|
|
407
|
-
decoding: "async",
|
|
408
|
-
className: "w-24 flex-none self-center md:w-40 md:self-start"
|
|
409
|
-
}, props));
|
|
410
|
-
};
|
|
411
|
-
const buttonVariations = {
|
|
412
|
-
"standard-primary": "bg-green border-green text-white",
|
|
413
|
-
"standard-secondary": "bg-white border-green text-black",
|
|
414
|
-
"light-green-primary": "bg-green-light border-green-light text-black",
|
|
415
|
-
"light-green-secondary": "bg-transparent border-green-light text-green-light",
|
|
416
|
-
"white-primary": "bg-white border-white text-black",
|
|
417
|
-
"white-secondary": "bg-transparent border-white text-white"
|
|
418
|
-
};
|
|
419
|
-
const Button = forwardRef((props, ref) => {
|
|
420
|
-
const _a = props, {
|
|
421
|
-
children: childrenFromProp,
|
|
422
|
-
className,
|
|
423
|
-
color: colorFromProp,
|
|
424
|
-
href,
|
|
425
|
-
loading,
|
|
426
|
-
type = "button",
|
|
427
|
-
variant = "primary"
|
|
428
|
-
} = _a, rest = __objRest(_a, [
|
|
429
|
-
"children",
|
|
430
|
-
"className",
|
|
431
|
-
"color",
|
|
432
|
-
"href",
|
|
433
|
-
"loading",
|
|
434
|
-
"type",
|
|
435
|
-
"variant"
|
|
436
|
-
]);
|
|
437
|
-
const colorFromContext = useContext(ButtonColorContext);
|
|
438
|
-
const color = colorFromProp != null ? colorFromProp : colorFromContext;
|
|
439
|
-
const buttonVariation = buttonVariations[`${color}-${variant}`];
|
|
440
|
-
const classes = cx(className, buttonVariation, "button");
|
|
441
|
-
const children = loading ? /* @__PURE__ */ jsx(Loader, {
|
|
442
|
-
children: childrenFromProp
|
|
443
|
-
}) : childrenFromProp;
|
|
444
|
-
return /* @__PURE__ */ jsx(Fragment, {
|
|
445
|
-
children: href ? /* @__PURE__ */ jsx("a", __spreadProps(__spreadValues({
|
|
446
|
-
"aria-busy": loading ? true : void 0
|
|
447
|
-
}, rest), {
|
|
448
|
-
href,
|
|
449
|
-
ref,
|
|
450
|
-
className: classes,
|
|
451
|
-
children
|
|
452
|
-
})) : /* @__PURE__ */ jsx("button", __spreadProps(__spreadValues({
|
|
453
|
-
"aria-busy": loading ? true : void 0
|
|
454
|
-
}, rest), {
|
|
455
|
-
type,
|
|
456
|
-
ref,
|
|
457
|
-
className: classes,
|
|
458
|
-
children
|
|
459
|
-
}))
|
|
460
|
-
});
|
|
461
|
-
});
|
|
462
|
-
const Loader = (props) => {
|
|
463
|
-
return /* @__PURE__ */ jsxs(Fragment, {
|
|
464
|
-
children: [deeplyWrapStrings(props.children), /* @__PURE__ */ jsx("span", {
|
|
465
|
-
className: "!visible absolute top-1 bottom-1 left-1 right-1 grid place-items-center overflow-hidden bg-inherit",
|
|
466
|
-
"aria-hidden": true,
|
|
467
|
-
children: /* @__PURE__ */ jsx(LoadingSpinner, {
|
|
468
|
-
className: "animate-spin"
|
|
469
|
-
})
|
|
470
|
-
})]
|
|
471
|
-
});
|
|
472
|
-
};
|
|
473
|
-
function deeplyWrapStrings(children) {
|
|
474
|
-
return Children.map(children, (child) => {
|
|
475
|
-
if (!isValidElement(child)) {
|
|
476
|
-
return typeof child === "string" ? /* @__PURE__ */ jsx("span", {
|
|
477
|
-
children: child
|
|
478
|
-
}) : child;
|
|
479
|
-
}
|
|
480
|
-
if (child.props.children) {
|
|
481
|
-
const props = {
|
|
482
|
-
children: deeplyWrapStrings(child.props.children)
|
|
483
|
-
};
|
|
484
|
-
child = cloneElement(child, props);
|
|
485
|
-
}
|
|
486
|
-
return child;
|
|
487
|
-
});
|
|
488
|
-
}
|
|
489
|
-
const ButtonColorContext = createContext("standard");
|
|
490
|
-
const CampaignContext = createContext(true);
|
|
491
|
-
const CampaignInner = (props, ref) => {
|
|
492
|
-
const _a = props, {
|
|
493
|
-
as: Component = "div",
|
|
494
|
-
body: Body,
|
|
495
|
-
className,
|
|
496
|
-
image: Image,
|
|
497
|
-
rightAlignBody = true
|
|
498
|
-
} = _a, rest = __objRest(_a, [
|
|
499
|
-
"as",
|
|
500
|
-
"body",
|
|
501
|
-
"className",
|
|
502
|
-
"image",
|
|
503
|
-
"rightAlignBody"
|
|
504
|
-
]);
|
|
505
|
-
return /* @__PURE__ */ jsxs(Component, __spreadProps(__spreadValues({
|
|
506
|
-
className: cx(className, "grid gap-8 md:grid-flow-col md:grid-cols-[50%,50%] md:gap-0")
|
|
507
|
-
}, rest), {
|
|
508
|
-
ref,
|
|
509
|
-
children: [/* @__PURE__ */ jsx(CampaignContext.Provider, {
|
|
510
|
-
value: rightAlignBody,
|
|
511
|
-
children: Image
|
|
512
|
-
}), Body]
|
|
513
|
-
}));
|
|
514
|
-
};
|
|
515
|
-
const CampaignBase = forwardRef(CampaignInner);
|
|
516
|
-
const CampaignBody = forwardRef((props, ref) => {
|
|
517
|
-
const _a = props, {
|
|
518
|
-
className
|
|
519
|
-
} = _a, rest = __objRest(_a, [
|
|
520
|
-
"className"
|
|
521
|
-
]);
|
|
522
|
-
return /* @__PURE__ */ jsx("div", __spreadValues({
|
|
523
|
-
className: cx(className, "md:mx-18 self-center"),
|
|
524
|
-
ref
|
|
525
|
-
}, rest));
|
|
526
|
-
});
|
|
527
|
-
const CampaignImage = forwardRef((props, ref) => {
|
|
528
|
-
const _a = props, {
|
|
529
|
-
className: classNameProp,
|
|
530
|
-
children
|
|
531
|
-
} = _a, rest = __objRest(_a, [
|
|
532
|
-
"className",
|
|
533
|
-
"children"
|
|
534
|
-
]);
|
|
535
|
-
const bodyIsRightAligned = useContext(CampaignContext);
|
|
536
|
-
const className = cx(classNameProp, "max-md:rounded-b-3xl w-full", bodyIsRightAligned ? "md:rounded-r-3xl" : "md:rounded-l-3xl md:order-1");
|
|
537
|
-
if (isValidElement(children)) {
|
|
538
|
-
const child = Children.only(children);
|
|
539
|
-
return cloneElement(child, __spreadValues({
|
|
540
|
-
className,
|
|
541
|
-
ref
|
|
542
|
-
}, rest));
|
|
543
|
-
}
|
|
544
|
-
return /* @__PURE__ */ jsx("img", __spreadValues({
|
|
545
|
-
className,
|
|
546
|
-
ref
|
|
547
|
-
}, rest));
|
|
548
|
-
});
|
|
549
|
-
const Campaign = Object.assign({}, CampaignBase, {
|
|
550
|
-
Body: CampaignBody,
|
|
551
|
-
Image: CampaignImage
|
|
552
|
-
});
|
|
553
|
-
const CardInner = (props, ref) => {
|
|
554
|
-
const _a = props, {
|
|
555
|
-
as: Component = "div",
|
|
556
|
-
className,
|
|
557
|
-
bgColor = "white"
|
|
558
|
-
} = _a, rest = __objRest(_a, [
|
|
559
|
-
"as",
|
|
560
|
-
"className",
|
|
561
|
-
"bgColor"
|
|
562
|
-
]);
|
|
563
|
-
return /* @__PURE__ */ jsx(Component, __spreadProps(__spreadValues({
|
|
564
|
-
className: cx(className, "relative overflow-hidden rounded-3xl", {
|
|
565
|
-
"border-2 border-solid bg-white": bgColor === "white",
|
|
566
|
-
"bg-gray-light": bgColor === "gray"
|
|
567
|
-
})
|
|
568
|
-
}, rest), {
|
|
569
|
-
ref
|
|
570
|
-
}));
|
|
571
|
-
};
|
|
572
|
-
const Card = forwardRef(CardInner);
|
|
573
|
-
const CardImage = forwardRef((props, ref) => {
|
|
574
|
-
const _a = props, {
|
|
575
|
-
className
|
|
576
|
-
} = _a, rest = __objRest(_a, [
|
|
577
|
-
"className"
|
|
578
|
-
]);
|
|
579
|
-
return /* @__PURE__ */ jsx("img", __spreadProps(__spreadValues({
|
|
580
|
-
className: cx(className, "w-full object-cover"),
|
|
581
|
-
loading: "lazy"
|
|
582
|
-
}, rest), {
|
|
583
|
-
ref
|
|
584
|
-
}));
|
|
585
|
-
});
|
|
586
|
-
const CardList = forwardRef((props, ref) => {
|
|
587
|
-
const _a = props, {
|
|
588
|
-
bgColor: bgColorProp,
|
|
589
|
-
className
|
|
590
|
-
} = _a, rest = __objRest(_a, [
|
|
591
|
-
"bgColor",
|
|
592
|
-
"className"
|
|
593
|
-
]);
|
|
594
|
-
const bgColor = useBlockBackgroundColor(bgColorProp);
|
|
595
|
-
return /* @__PURE__ */ jsx("div", {
|
|
596
|
-
className: cx(bgColor, className),
|
|
597
|
-
children: /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({
|
|
598
|
-
className: "container grid grid-cols-1 gap-12 py-16 md:grid-cols-2 md:py-20 lg:py-24"
|
|
599
|
-
}, rest), {
|
|
600
|
-
ref
|
|
601
|
-
}))
|
|
602
|
-
});
|
|
603
|
-
});
|
|
604
|
-
const CardContent = forwardRef((props, ref) => {
|
|
605
|
-
const _a = props, {
|
|
606
|
-
className
|
|
607
|
-
} = _a, rest = __objRest(_a, [
|
|
608
|
-
"className"
|
|
609
|
-
]);
|
|
610
|
-
return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({
|
|
611
|
-
className: cx(className, "p-8 md:px-10")
|
|
612
|
-
}, rest), {
|
|
613
|
-
ref
|
|
614
|
-
}));
|
|
615
|
-
});
|
|
616
|
-
const CardLinkOverlay = forwardRef((props, ref) => {
|
|
617
|
-
const _a = props, {
|
|
618
|
-
className
|
|
619
|
-
} = _a, rest = __objRest(_a, [
|
|
620
|
-
"className"
|
|
621
|
-
]);
|
|
622
|
-
return /* @__PURE__ */ jsx("a", __spreadValues({
|
|
623
|
-
className: cx(className, "no-underline before:absolute before:top-0 before:left-0 before:block before:h-full before:w-full hover:underline"),
|
|
624
|
-
ref
|
|
625
|
-
}, rest));
|
|
626
|
-
});
|
|
627
|
-
const Checkbox = forwardRef((props, ref) => {
|
|
628
|
-
const _a = props, {
|
|
629
|
-
children,
|
|
630
|
-
className,
|
|
631
|
-
error,
|
|
632
|
-
id: idProp,
|
|
633
|
-
disableValidation = false
|
|
634
|
-
} = _a, rest = __objRest(_a, [
|
|
635
|
-
"children",
|
|
636
|
-
"className",
|
|
637
|
-
"error",
|
|
638
|
-
"id",
|
|
639
|
-
"disableValidation"
|
|
640
|
-
]);
|
|
641
|
-
const ownRef = useRef(null);
|
|
642
|
-
const {
|
|
643
|
-
validity,
|
|
644
|
-
validationMessage
|
|
645
|
-
} = useFormControlValidity(ownRef, !disableValidation);
|
|
646
|
-
const id = useFallbackId(idProp);
|
|
647
|
-
const errorMsgId = id + "err";
|
|
648
|
-
const errorMsg = error || validationMessage;
|
|
649
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
650
|
-
className: "grid gap-2",
|
|
651
|
-
children: [/* @__PURE__ */ jsxs("label", {
|
|
652
|
-
className: cx(className, "flex cursor-pointer gap-2.5"),
|
|
653
|
-
children: [/* @__PURE__ */ jsx("input", __spreadProps(__spreadValues({
|
|
654
|
-
id,
|
|
655
|
-
className: cx("checkbox checked:bg-green checked:border-green grid h-[1.25em] w-[1.25em] flex-none translate-y-[0.1em] cursor-pointer appearance-none place-content-center rounded border-2 border-solid bg-white text-white focus:outline-none focus:ring-2", {
|
|
656
|
-
"border-gray-dark focus:ring-black": !error,
|
|
657
|
-
"border-red focus:ring-red": !!error
|
|
658
|
-
}),
|
|
659
|
-
ref,
|
|
660
|
-
type: "checkbox"
|
|
661
|
-
}, rest), {
|
|
662
|
-
"aria-describedby": errorMsg ? errorMsgId : void 0,
|
|
663
|
-
"aria-invalid": !!error || validity === "invalid"
|
|
664
|
-
})), children]
|
|
665
|
-
}), errorMsg && /* @__PURE__ */ jsx(FormErrorMessage, {
|
|
666
|
-
id: errorMsgId,
|
|
667
|
-
children: errorMsg
|
|
668
|
-
})]
|
|
669
|
-
});
|
|
670
|
-
});
|
|
671
|
-
const chipVariations = {
|
|
672
|
-
"blue-light": "bg-blue-light border-blue-light",
|
|
673
|
-
"red-light": "bg-red-light border-red-light",
|
|
674
|
-
"green-light": "bg-green-light border-green-light",
|
|
675
|
-
"orange-light": "bg-orange-light border-orange-light"
|
|
676
|
-
};
|
|
677
|
-
const iconColors = {
|
|
678
|
-
"blue-light": "text-blue-dark",
|
|
679
|
-
"red-light": "text-red",
|
|
680
|
-
"green-light": "text-green",
|
|
681
|
-
"orange-light": "text-black"
|
|
682
|
-
};
|
|
683
|
-
const Chip = (props) => {
|
|
684
|
-
const {
|
|
685
|
-
className,
|
|
686
|
-
color,
|
|
687
|
-
icon,
|
|
688
|
-
children,
|
|
689
|
-
variant = "filled"
|
|
690
|
-
} = props;
|
|
691
|
-
const chipVariation = color && chipVariations[color];
|
|
692
|
-
const iconColor = color && iconColors[color];
|
|
693
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
694
|
-
className: cx("inline-flex items-center gap-0.5 overflow-hidden rounded-lg border-2 text-sm font-semibold", chipVariation, className),
|
|
695
|
-
children: [icon && /* @__PURE__ */ jsx("div", {
|
|
696
|
-
className: cx("px-3 py-2", iconColor),
|
|
697
|
-
children: icon
|
|
698
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
699
|
-
className: cx("flex-1 py-2 px-4", {
|
|
700
|
-
"bg-white": variant === "outline"
|
|
701
|
-
}),
|
|
702
|
-
children
|
|
703
|
-
})]
|
|
704
|
-
});
|
|
705
|
-
};
|
|
706
|
-
const Footer = (props) => {
|
|
707
|
-
const _a = props, {
|
|
708
|
-
className,
|
|
709
|
-
children
|
|
710
|
-
} = _a, rest = __objRest(_a, [
|
|
711
|
-
"className",
|
|
712
|
-
"children"
|
|
713
|
-
]);
|
|
714
|
-
return /* @__PURE__ */ jsx(ButtonColorContext.Provider, {
|
|
715
|
-
value: "white",
|
|
716
|
-
children: /* @__PURE__ */ jsx("footer", __spreadProps(__spreadValues({
|
|
717
|
-
className: cx(className, "bg-blue pt-18 relative pb-12 text-white before:absolute before:-top-px before:left-0 before:right-0 before:h-[calc(1.5rem_+_1px)] before:rounded-b-3xl before:bg-white ")
|
|
718
|
-
}, rest), {
|
|
719
|
-
children: /* @__PURE__ */ jsx("div", {
|
|
720
|
-
className: "container",
|
|
721
|
-
children
|
|
722
|
-
})
|
|
723
|
-
}))
|
|
724
|
-
});
|
|
725
|
-
};
|
|
726
|
-
const Form = (props) => {
|
|
727
|
-
const _a = props, {
|
|
728
|
-
heading,
|
|
729
|
-
children,
|
|
730
|
-
className
|
|
731
|
-
} = _a, rest = __objRest(_a, [
|
|
732
|
-
"heading",
|
|
733
|
-
"children",
|
|
734
|
-
"className"
|
|
735
|
-
]);
|
|
736
|
-
return /* @__PURE__ */ jsxs("form", __spreadProps(__spreadValues({
|
|
737
|
-
className: cx(className, "border-blue-dark block overflow-hidden rounded-t-3xl rounded-b-lg border-2")
|
|
738
|
-
}, rest), {
|
|
739
|
-
children: [heading && /* @__PURE__ */ jsx(FormHeading, {
|
|
740
|
-
children: heading
|
|
741
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
742
|
-
className: "p-6 md:p-10",
|
|
743
|
-
children
|
|
744
|
-
})]
|
|
745
|
-
}));
|
|
746
|
-
};
|
|
747
|
-
const FormHeading = (props) => {
|
|
748
|
-
const _a = props, {
|
|
749
|
-
className
|
|
750
|
-
} = _a, rest = __objRest(_a, [
|
|
751
|
-
"className"
|
|
752
|
-
]);
|
|
753
|
-
return /* @__PURE__ */ jsx("h2", __spreadValues({
|
|
754
|
-
className: cx(className, "bg-blue-dark p-6 text-xl font-bold text-white md:px-10 md:py-8 md:text-2xl")
|
|
755
|
-
}, rest));
|
|
756
|
-
};
|
|
757
|
-
const FormError = (props) => {
|
|
758
|
-
const _a = props, {
|
|
759
|
-
className
|
|
760
|
-
} = _a, rest = __objRest(_a, [
|
|
761
|
-
"className"
|
|
762
|
-
]);
|
|
763
|
-
return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({
|
|
764
|
-
"aria-live": "polite",
|
|
765
|
-
className: cx(className, "border-red bg-red-light rounded-lg border-2 p-6 text-sm")
|
|
766
|
-
}, rest), {
|
|
767
|
-
children: "Beklager! Noe gikk dessverre galt under innesendingen av skjemaet. Pr\xF8v gjerne igjen om en stund."
|
|
768
|
-
}));
|
|
769
|
-
};
|
|
770
|
-
const FormErrorMessage = (props) => {
|
|
771
|
-
const _a = props, {
|
|
772
|
-
children,
|
|
773
|
-
className
|
|
774
|
-
} = _a, rest = __objRest(_a, [
|
|
775
|
-
"children",
|
|
776
|
-
"className"
|
|
777
|
-
]);
|
|
778
|
-
return /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({
|
|
779
|
-
className: cx(className, "bg-red-light text-red flex items-center gap-2 rounded py-1 px-2 text-sm"),
|
|
780
|
-
"aria-live": "polite"
|
|
781
|
-
}, rest), {
|
|
782
|
-
children: [/* @__PURE__ */ jsx(Warning, {
|
|
783
|
-
className: "text-red flex-shrink-0"
|
|
784
|
-
}), children]
|
|
785
|
-
}));
|
|
786
|
-
};
|
|
787
|
-
const FormHelperText = (props) => {
|
|
788
|
-
const _a = props, {
|
|
789
|
-
className,
|
|
790
|
-
children
|
|
791
|
-
} = _a, rest = __objRest(_a, [
|
|
792
|
-
"className",
|
|
793
|
-
"children"
|
|
794
|
-
]);
|
|
795
|
-
return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({
|
|
796
|
-
className: cx(className, "text-gray-dark text-sm")
|
|
797
|
-
}, rest), {
|
|
798
|
-
children
|
|
799
|
-
}));
|
|
800
|
-
};
|
|
801
|
-
const FormLabel = (props) => {
|
|
802
|
-
const _a = props, {
|
|
803
|
-
className,
|
|
804
|
-
children,
|
|
805
|
-
isRequired,
|
|
806
|
-
isInvalid
|
|
807
|
-
} = _a, rest = __objRest(_a, [
|
|
808
|
-
"className",
|
|
809
|
-
"children",
|
|
810
|
-
"isRequired",
|
|
811
|
-
"isInvalid"
|
|
812
|
-
]);
|
|
813
|
-
return /* @__PURE__ */ jsxs("label", __spreadProps(__spreadValues({
|
|
814
|
-
className: cx(className, "block cursor-pointer font-semibold")
|
|
815
|
-
}, rest), {
|
|
816
|
-
children: [isRequired && /* @__PURE__ */ jsx("span", {
|
|
817
|
-
"aria-hidden": true,
|
|
818
|
-
className: cx("mr-1 select-none", isInvalid ? "text-red" : "text-blue"),
|
|
819
|
-
children: "*"
|
|
820
|
-
}), children]
|
|
821
|
-
}));
|
|
822
|
-
};
|
|
823
|
-
const FormSuccess = (props) => {
|
|
824
|
-
const _a = props, {
|
|
825
|
-
className,
|
|
826
|
-
heading,
|
|
827
|
-
text
|
|
828
|
-
} = _a, rest = __objRest(_a, [
|
|
829
|
-
"className",
|
|
830
|
-
"heading",
|
|
831
|
-
"text"
|
|
832
|
-
]);
|
|
833
|
-
return /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({
|
|
834
|
-
className: cx(className, "bg-gray-concrete flex flex-col gap-8 p-8 text-center")
|
|
835
|
-
}, rest), {
|
|
836
|
-
children: [/* @__PURE__ */ jsx("img", {
|
|
837
|
-
className: "mx-auto",
|
|
838
|
-
alt: "Innsending fullf\xF8rt",
|
|
839
|
-
height: "220",
|
|
840
|
-
width: "247",
|
|
841
|
-
src: "data:image/png;base64,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"
|
|
842
|
-
}), heading && /* @__PURE__ */ jsx("h2", {
|
|
843
|
-
className: "text-blue text-2xl",
|
|
844
|
-
children: heading
|
|
845
|
-
}), text && /* @__PURE__ */ jsx("p", {
|
|
846
|
-
className: "text-lg",
|
|
847
|
-
children: text
|
|
848
|
-
})]
|
|
849
|
-
}));
|
|
850
|
-
};
|
|
851
|
-
function usesGridAreaPlacement(contentPosition) {
|
|
852
|
-
return contentPosition !== "vertical-split" && contentPosition !== "below-center" && contentPosition !== "below-left";
|
|
853
|
-
}
|
|
854
|
-
const HeroContext = createContext({
|
|
855
|
-
bgColor: "white",
|
|
856
|
-
contentPosition: "below-center",
|
|
857
|
-
hasImage: false
|
|
858
|
-
});
|
|
859
|
-
const Hero = forwardRef((props, ref) => {
|
|
860
|
-
const _a = props, {
|
|
861
|
-
bgColor = "white",
|
|
862
|
-
children,
|
|
863
|
-
className,
|
|
864
|
-
contentPosition: contentPositionProp = "below-center",
|
|
865
|
-
image
|
|
866
|
-
} = _a, rest = __objRest(_a, [
|
|
867
|
-
"bgColor",
|
|
868
|
-
"children",
|
|
869
|
-
"className",
|
|
870
|
-
"contentPosition",
|
|
871
|
-
"image"
|
|
872
|
-
]);
|
|
873
|
-
const hasImage = image != null;
|
|
874
|
-
const contentPosition = hasImage ? contentPositionProp : "below-center";
|
|
875
|
-
const context = useMemo(() => ({
|
|
876
|
-
bgColor,
|
|
877
|
-
contentPosition,
|
|
878
|
-
hasImage
|
|
879
|
-
}), [bgColor, contentPosition, hasImage]);
|
|
880
|
-
return /* @__PURE__ */ jsx(ButtonColorContext.Provider, {
|
|
881
|
-
value: bgColor === "white" ? "standard" : "light-green",
|
|
882
|
-
children: /* @__PURE__ */ jsx(HeroContext.Provider, {
|
|
883
|
-
value: context,
|
|
884
|
-
children: /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({
|
|
885
|
-
className: cx(className, "container max-md:px-0 md:grid", {
|
|
886
|
-
"md:grid-cols-[50%,50%]": contentPosition === "vertical-split"
|
|
887
|
-
}),
|
|
888
|
-
style: usesGridAreaPlacement(contentPosition) ? {
|
|
889
|
-
gridTemplateAreas: '"hero"'
|
|
890
|
-
} : void 0
|
|
891
|
-
}, rest), {
|
|
892
|
-
ref,
|
|
893
|
-
children: [image, children]
|
|
894
|
-
}))
|
|
895
|
-
})
|
|
896
|
-
});
|
|
897
|
-
});
|
|
898
|
-
const HeroImage = forwardRef((props, ref) => {
|
|
899
|
-
const {
|
|
900
|
-
contentPosition
|
|
901
|
-
} = useContext(HeroContext);
|
|
902
|
-
return /* @__PURE__ */ jsxs("picture", {
|
|
903
|
-
className: cx(props.className, "aspect-w-6 aspect-h-7 block", {
|
|
904
|
-
"sm:aspect-w-8 sm:aspect-h-4": contentPosition !== "vertical-split",
|
|
905
|
-
"sm:aspect-w-8 sm:aspect-h-8": contentPosition === "vertical-split"
|
|
906
|
-
}),
|
|
907
|
-
style: contentPosition !== "vertical-split" && contentPosition !== "below-center" && contentPosition !== "below-left" ? {
|
|
908
|
-
gridArea: "hero"
|
|
909
|
-
} : void 0,
|
|
910
|
-
ref,
|
|
911
|
-
children: [/* @__PURE__ */ jsx("source", {
|
|
912
|
-
media: "(min-width: 768px)",
|
|
913
|
-
srcSet: props.mdSrc
|
|
914
|
-
}), /* @__PURE__ */ jsx("img", {
|
|
915
|
-
className: "object-cover",
|
|
916
|
-
decoding: "async",
|
|
917
|
-
src: props.src,
|
|
918
|
-
alt: props.alt
|
|
919
|
-
})]
|
|
920
|
-
});
|
|
921
|
-
});
|
|
922
|
-
const HeroContent = forwardRef((props, ref) => {
|
|
923
|
-
const {
|
|
924
|
-
bgColor,
|
|
925
|
-
contentPosition,
|
|
926
|
-
hasImage
|
|
927
|
-
} = useContext(HeroContext);
|
|
928
|
-
const _a = props, {
|
|
929
|
-
children,
|
|
930
|
-
className,
|
|
931
|
-
heading,
|
|
932
|
-
description
|
|
933
|
-
} = _a, rest = __objRest(_a, [
|
|
934
|
-
"children",
|
|
935
|
-
"className",
|
|
936
|
-
"heading",
|
|
937
|
-
"description"
|
|
938
|
-
]);
|
|
939
|
-
const usesGridArea = usesGridAreaPlacement(contentPosition);
|
|
940
|
-
return /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({
|
|
941
|
-
className: cx(className, "relative grid grid-flow-row grid-cols-[minmax(auto,_37rem)] content-center gap-6 rounded-3xl py-10 px-6 text-center max-md:mx-4 md:p-12", {
|
|
942
|
-
"max-md:-mt-18": hasImage,
|
|
943
|
-
"text-white": bgColor !== "white",
|
|
944
|
-
"bg-green-dark": bgColor === "green",
|
|
945
|
-
"bg-blue-dark": bgColor === "blue",
|
|
946
|
-
"bg-white": bgColor === "white",
|
|
947
|
-
"md:z-10 md:-order-1 md:mt-0 md:-mr-5 md:justify-center md:rounded-l-none md:text-left": contentPosition === "vertical-split",
|
|
948
|
-
"justify-center md:mx-auto md:w-4/5": contentPosition === "below-center",
|
|
949
|
-
"md:-mt-18": hasImage && contentPosition === "below-center",
|
|
950
|
-
"md:ml-[8%] md:-mt-32 md:max-w-[58%] md:text-left": contentPosition === "below-left",
|
|
951
|
-
"md:my-9 md:mx-32 md:w-2/5": usesGridArea,
|
|
952
|
-
"self-end justify-self-start": contentPosition === "bottom-left",
|
|
953
|
-
"self-start justify-self-start": contentPosition === "top-left",
|
|
954
|
-
"self-start justify-self-end": contentPosition === "top-right",
|
|
955
|
-
"self-end justify-self-end": contentPosition === "bottom-right",
|
|
956
|
-
"self-center justify-self-center": contentPosition === "center"
|
|
957
|
-
})
|
|
958
|
-
}, rest), {
|
|
959
|
-
style: usesGridArea ? {
|
|
960
|
-
gridArea: "hero"
|
|
961
|
-
} : void 0,
|
|
962
|
-
ref,
|
|
963
|
-
children: [/* @__PURE__ */ jsx("h1", {
|
|
964
|
-
children: heading
|
|
965
|
-
}), description && /* @__PURE__ */ jsx("p", {
|
|
966
|
-
className: "text-lg font-semibold md:text-xl",
|
|
967
|
-
children: description
|
|
968
|
-
}), children]
|
|
969
|
-
}));
|
|
970
|
-
});
|
|
971
|
-
const HeroActions = forwardRef((props, ref) => {
|
|
972
|
-
const _a = props, {
|
|
973
|
-
className
|
|
974
|
-
} = _a, rest = __objRest(_a, [
|
|
975
|
-
"className"
|
|
976
|
-
]);
|
|
977
|
-
const {
|
|
978
|
-
contentPosition
|
|
979
|
-
} = useContext(HeroContext);
|
|
980
|
-
return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({
|
|
981
|
-
className: cx(className, "grid items-center justify-center justify-items-center gap-4 md:grid-flow-col", {
|
|
982
|
-
"md:justify-start": contentPosition === "vertical-split" || contentPosition === "below-left"
|
|
983
|
-
})
|
|
984
|
-
}, rest), {
|
|
985
|
-
ref
|
|
986
|
-
}));
|
|
987
|
-
});
|
|
988
|
-
const Input = forwardRef((props, ref) => {
|
|
989
|
-
const _a = props, {
|
|
990
|
-
className,
|
|
991
|
-
isInvalid,
|
|
992
|
-
size,
|
|
993
|
-
as,
|
|
994
|
-
type: typeProp,
|
|
995
|
-
rightAddon,
|
|
996
|
-
leftAddon
|
|
997
|
-
} = _a, rest = __objRest(_a, [
|
|
998
|
-
"className",
|
|
999
|
-
"isInvalid",
|
|
1000
|
-
"size",
|
|
1001
|
-
"as",
|
|
1002
|
-
"type",
|
|
1003
|
-
"rightAddon",
|
|
1004
|
-
"leftAddon"
|
|
1005
|
-
]);
|
|
1006
|
-
const Component = as != null ? as : "input";
|
|
1007
|
-
const type = getType(Component, typeProp);
|
|
1008
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
1009
|
-
className: cx(className, "relative flex items-center rounded-lg border border-b-[3px] focus-within:-ml-[2px] focus-within:-mt-[2px] focus-within:border-[3px] focus-within:shadow", {
|
|
1010
|
-
"focus-within:border-blue-dark border-black": !isInvalid,
|
|
1011
|
-
"border-red focus-within:border-red": isInvalid,
|
|
1012
|
-
"w-fit": size != null,
|
|
1013
|
-
"w-full": size == null,
|
|
1014
|
-
"pl-4": leftAddon,
|
|
1015
|
-
"pr-4": rightAddon
|
|
1016
|
-
}),
|
|
1017
|
-
children: [leftAddon, /* @__PURE__ */ jsx(Component, __spreadValues({
|
|
1018
|
-
"aria-invalid": isInvalid,
|
|
1019
|
-
ref,
|
|
1020
|
-
className: "focus:none placeholder-gray w-full rounded-lg border-none px-4 py-3.5 focus:outline-none",
|
|
1021
|
-
size,
|
|
1022
|
-
type
|
|
1023
|
-
}, rest)), rightAddon]
|
|
1024
|
-
});
|
|
1025
|
-
});
|
|
1026
|
-
function getType(Component, type) {
|
|
1027
|
-
if (type != null)
|
|
1028
|
-
return type;
|
|
1029
|
-
if (Component === "input")
|
|
1030
|
-
return "text";
|
|
1031
|
-
}
|
|
1032
|
-
const Link = (props) => {
|
|
1033
|
-
let iconClass = "";
|
|
1034
|
-
if (props.icon) {
|
|
1035
|
-
iconClass = "inline-flex items-center gap-2";
|
|
1036
|
-
}
|
|
1037
|
-
return /* @__PURE__ */ jsxs("a", {
|
|
1038
|
-
className: iconClass,
|
|
1039
|
-
href: props.href,
|
|
1040
|
-
children: [props.icon, props.children]
|
|
1041
|
-
});
|
|
1042
|
-
};
|
|
1043
|
-
const NavbarContext = createContext({
|
|
1044
|
-
setIsExpanded: noop,
|
|
1045
|
-
isExpanded: false,
|
|
1046
|
-
collapsibleId: ""
|
|
1047
|
-
});
|
|
1048
|
-
const Navbar = (props) => {
|
|
1049
|
-
const _a = props, {
|
|
1050
|
-
className,
|
|
1051
|
-
children
|
|
1052
|
-
} = _a, rest = __objRest(_a, [
|
|
1053
|
-
"className",
|
|
1054
|
-
"children"
|
|
1055
|
-
]);
|
|
1056
|
-
const collapsibleId = useId();
|
|
1057
|
-
const [isExpanded, setIsExpanded] = useState(false);
|
|
1058
|
-
const expandedContext = useMemo(() => ({
|
|
1059
|
-
isExpanded,
|
|
1060
|
-
setIsExpanded,
|
|
1061
|
-
collapsibleId
|
|
1062
|
-
}), [isExpanded, collapsibleId]);
|
|
1063
|
-
return /* @__PURE__ */ jsx(ButtonColorContext.Provider, {
|
|
1064
|
-
value: "white",
|
|
1065
|
-
children: /* @__PURE__ */ jsx(NavbarContext.Provider, {
|
|
1066
|
-
value: expandedContext,
|
|
1067
|
-
children: /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({
|
|
1068
|
-
className: cx(className, "bg-blue relative pt-6 pb-12 text-white before:absolute before:bottom-0 before:left-0 before:right-0 before:h-6 before:rounded-t-3xl before:bg-white md:pt-8 md:pb-14")
|
|
1069
|
-
}, rest), {
|
|
1070
|
-
children: /* @__PURE__ */ jsx("div", {
|
|
1071
|
-
className: "container",
|
|
1072
|
-
children
|
|
1073
|
-
})
|
|
1074
|
-
}))
|
|
1075
|
-
})
|
|
1076
|
-
});
|
|
1077
|
-
};
|
|
1078
|
-
const NavbarItems = (props) => {
|
|
1079
|
-
const _a = props, {
|
|
1080
|
-
className,
|
|
1081
|
-
children
|
|
1082
|
-
} = _a, rest = __objRest(_a, [
|
|
1083
|
-
"className",
|
|
1084
|
-
"children"
|
|
1085
|
-
]);
|
|
1086
|
-
const {
|
|
1087
|
-
isExpanded
|
|
1088
|
-
} = useContext(NavbarContext);
|
|
1089
|
-
return /* @__PURE__ */ jsx("nav", __spreadProps(__spreadValues({
|
|
1090
|
-
className: cx(className, "my-8 flex flex-col md:mb-0 md:flex md:flex-row md:flex-wrap md:gap-x-8", {
|
|
1091
|
-
hidden: !isExpanded
|
|
1092
|
-
})
|
|
1093
|
-
}, rest), {
|
|
1094
|
-
children
|
|
1095
|
-
}));
|
|
1096
|
-
};
|
|
1097
|
-
const NavbarItem = forwardRef((props, ref) => {
|
|
1098
|
-
const _a = props, {
|
|
1099
|
-
active,
|
|
1100
|
-
className,
|
|
1101
|
-
children
|
|
1102
|
-
} = _a, rest = __objRest(_a, [
|
|
1103
|
-
"active",
|
|
1104
|
-
"className",
|
|
1105
|
-
"children"
|
|
1106
|
-
]);
|
|
1107
|
-
return /* @__PURE__ */ jsx("a", __spreadProps(__spreadValues({
|
|
1108
|
-
"aria-current": active ? "page" : void 0,
|
|
1109
|
-
className: cx(className, "border-b border-[#0156E0] py-3 no-underline md:border-b-2 md:border-transparent md:py-2 md:hover:border-white", {
|
|
1110
|
-
"md:bg-blue-dark font-bold md:-mx-3 md:rounded-t-lg md:px-3": active
|
|
1111
|
-
}),
|
|
1112
|
-
ref
|
|
1113
|
-
}, rest), {
|
|
1114
|
-
children
|
|
1115
|
-
}));
|
|
1116
|
-
});
|
|
1117
|
-
const NavbarMenuButton = () => {
|
|
1118
|
-
const {
|
|
1119
|
-
isExpanded,
|
|
1120
|
-
setIsExpanded,
|
|
1121
|
-
collapsibleId
|
|
1122
|
-
} = useContext(NavbarContext);
|
|
1123
|
-
let Icon = MenuAlt;
|
|
1124
|
-
let buttonText = "Meny";
|
|
1125
|
-
if (isExpanded) {
|
|
1126
|
-
Icon = Close;
|
|
1127
|
-
buttonText = "Lukk";
|
|
1128
|
-
}
|
|
1129
|
-
return /* @__PURE__ */ jsxs("button", {
|
|
1130
|
-
"aria-controls": collapsibleId,
|
|
1131
|
-
"aria-expanded": isExpanded,
|
|
1132
|
-
className: "inline-flex items-center gap-2 md:hidden",
|
|
1133
|
-
onClick: () => setIsExpanded((val) => !val),
|
|
1134
|
-
children: [buttonText, " ", /* @__PURE__ */ jsx(Icon, {})]
|
|
1135
|
-
});
|
|
1136
|
-
};
|
|
1137
|
-
const NavbarContent = (props) => {
|
|
1138
|
-
const _a = props, {
|
|
1139
|
-
className,
|
|
1140
|
-
children,
|
|
1141
|
-
logo
|
|
1142
|
-
} = _a, rest = __objRest(_a, [
|
|
1143
|
-
"className",
|
|
1144
|
-
"children",
|
|
1145
|
-
"logo"
|
|
1146
|
-
]);
|
|
1147
|
-
return /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({
|
|
1148
|
-
className: cx(className, "flex items-center justify-between gap-8")
|
|
1149
|
-
}, rest), {
|
|
1150
|
-
children: [logo, /* @__PURE__ */ jsx("div", {
|
|
1151
|
-
className: "hidden md:block",
|
|
1152
|
-
children
|
|
1153
|
-
}), /* @__PURE__ */ jsx(NavbarMenuButton, {})]
|
|
1154
|
-
}));
|
|
1155
|
-
};
|
|
1156
|
-
const NavbarCollapsible = (props) => {
|
|
1157
|
-
const _a = props, {
|
|
1158
|
-
className,
|
|
1159
|
-
children
|
|
1160
|
-
} = _a, rest = __objRest(_a, [
|
|
1161
|
-
"className",
|
|
1162
|
-
"children"
|
|
1163
|
-
]);
|
|
1164
|
-
const {
|
|
1165
|
-
collapsibleId,
|
|
1166
|
-
isExpanded
|
|
1167
|
-
} = useContext(NavbarContext);
|
|
1168
|
-
return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({}, rest), {
|
|
1169
|
-
"aria-hidden": !isExpanded,
|
|
1170
|
-
className: cx(className, "md:-mb-8 md:block", {
|
|
1171
|
-
hidden: !isExpanded
|
|
1172
|
-
}),
|
|
1173
|
-
id: collapsibleId,
|
|
1174
|
-
children
|
|
1175
|
-
}));
|
|
1176
|
-
};
|
|
1177
|
-
const NavbarExpandedMobileContent = (props) => {
|
|
1178
|
-
const {
|
|
1179
|
-
isExpanded
|
|
1180
|
-
} = useContext(NavbarContext);
|
|
1181
|
-
const isMobileScreen = useScreenMaxWidthMd(false);
|
|
1182
|
-
if (!isExpanded || !isMobileScreen)
|
|
1183
|
-
return null;
|
|
1184
|
-
return /* @__PURE__ */ jsx(Fragment, {
|
|
1185
|
-
children: props.children
|
|
1186
|
-
});
|
|
1187
|
-
};
|
|
1188
|
-
const SIBLING_COUNT = 2;
|
|
1189
|
-
const PaginationContext = createContext({
|
|
1190
|
-
currentPage: 0,
|
|
1191
|
-
pageCount: 0
|
|
1192
|
-
});
|
|
1193
|
-
const Pagination = (props) => {
|
|
1194
|
-
const _a = props, {
|
|
1195
|
-
className,
|
|
1196
|
-
page: currentPage,
|
|
1197
|
-
count: pageCount,
|
|
1198
|
-
onChange,
|
|
1199
|
-
getItemHref,
|
|
1200
|
-
getItemAriaLabel,
|
|
1201
|
-
nextPageAriaLabel,
|
|
1202
|
-
prevPageAriaLabel
|
|
1203
|
-
} = _a, rest = __objRest(_a, [
|
|
1204
|
-
"className",
|
|
1205
|
-
"page",
|
|
1206
|
-
"count",
|
|
1207
|
-
"onChange",
|
|
1208
|
-
"getItemHref",
|
|
1209
|
-
"getItemAriaLabel",
|
|
1210
|
-
"nextPageAriaLabel",
|
|
1211
|
-
"prevPageAriaLabel"
|
|
1212
|
-
]);
|
|
1213
|
-
const context = useMemo(() => ({
|
|
1214
|
-
currentPage: Math.max(1, Math.min(currentPage, pageCount)),
|
|
1215
|
-
pageCount: Math.max(1, pageCount)
|
|
1216
|
-
}), [currentPage, pageCount]);
|
|
1217
|
-
const handleClick = (page) => (event) => {
|
|
1218
|
-
if (onChange) {
|
|
1219
|
-
event.preventDefault();
|
|
1220
|
-
onChange(page);
|
|
1221
|
-
}
|
|
1222
|
-
};
|
|
1223
|
-
return /* @__PURE__ */ jsx(PaginationContext.Provider, {
|
|
1224
|
-
value: context,
|
|
1225
|
-
children: /* @__PURE__ */ jsxs("nav", __spreadProps(__spreadValues({
|
|
1226
|
-
className: cx("flex justify-center gap-2 sm:gap-4", className)
|
|
1227
|
-
}, rest), {
|
|
1228
|
-
children: [/* @__PURE__ */ jsx(PrevPage, {
|
|
1229
|
-
"aria-label": prevPageAriaLabel,
|
|
1230
|
-
href: getItemHref(currentPage - 1),
|
|
1231
|
-
onClick: handleClick(currentPage - 1)
|
|
1232
|
-
}), /* @__PURE__ */ jsx(PageItem, {
|
|
1233
|
-
page: 1,
|
|
1234
|
-
href: getItemHref(1),
|
|
1235
|
-
onClick: handleClick(1),
|
|
1236
|
-
"aria-label": getItemAriaLabel(1),
|
|
1237
|
-
selected: currentPage === 1
|
|
1238
|
-
}), pageCount > 2 + SIBLING_COUNT * 2 && currentPage > SIBLING_COUNT + 2 && /* @__PURE__ */ jsx(PaginationEllipsis, {}), /* @__PURE__ */ jsx(Pages, {
|
|
1239
|
-
children: (page) => /* @__PURE__ */ jsx(PageItem, {
|
|
1240
|
-
href: getItemHref(page),
|
|
1241
|
-
onClick: handleClick(page),
|
|
1242
|
-
"aria-label": getItemAriaLabel(page),
|
|
1243
|
-
page,
|
|
1244
|
-
selected: page === currentPage
|
|
1245
|
-
}, page)
|
|
1246
|
-
}), /* @__PURE__ */ jsx(NextPage, {
|
|
1247
|
-
"aria-label": nextPageAriaLabel,
|
|
1248
|
-
href: getItemHref(currentPage + 1),
|
|
1249
|
-
onClick: handleClick(currentPage + 1)
|
|
1250
|
-
})]
|
|
1251
|
-
}))
|
|
1252
|
-
});
|
|
1253
|
-
};
|
|
1254
|
-
const NextPage = forwardRef((props, ref) => {
|
|
1255
|
-
const {
|
|
1256
|
-
currentPage,
|
|
1257
|
-
pageCount
|
|
1258
|
-
} = useContext(PaginationContext);
|
|
1259
|
-
const hide = currentPage >= pageCount;
|
|
1260
|
-
return /* @__PURE__ */ jsx(PageLink, __spreadProps(__spreadValues({
|
|
1261
|
-
"aria-hidden": hide,
|
|
1262
|
-
className: hide ? "invisible" : void 0,
|
|
1263
|
-
ref,
|
|
1264
|
-
rel: "next"
|
|
1265
|
-
}, props), {
|
|
1266
|
-
children: /* @__PURE__ */ jsx(ChevronRight, {})
|
|
1267
|
-
}));
|
|
1268
|
-
});
|
|
1269
|
-
const PrevPage = forwardRef((props, ref) => {
|
|
1270
|
-
const {
|
|
1271
|
-
currentPage
|
|
1272
|
-
} = useContext(PaginationContext);
|
|
1273
|
-
const hide = currentPage <= 1;
|
|
1274
|
-
return /* @__PURE__ */ jsx(PageLink, __spreadProps(__spreadValues({
|
|
1275
|
-
"aria-hidden": hide,
|
|
1276
|
-
className: hide ? "invisible" : void 0,
|
|
1277
|
-
ref,
|
|
1278
|
-
rel: "prev"
|
|
1279
|
-
}, props), {
|
|
1280
|
-
children: /* @__PURE__ */ jsx(ChevronLeft, {})
|
|
1281
|
-
}));
|
|
1282
|
-
});
|
|
1283
|
-
const PageLink = forwardRef((props, ref) => {
|
|
1284
|
-
const _a = props, {
|
|
1285
|
-
className
|
|
1286
|
-
} = _a, rest = __objRest(_a, [
|
|
1287
|
-
"className"
|
|
1288
|
-
]);
|
|
1289
|
-
return /* @__PURE__ */ jsx("a", __spreadValues({
|
|
1290
|
-
className: cx(className, "aria-[current]:border-green hover:bg-gray-concrete flex h-9 w-9 items-center justify-center rounded-lg border-2 border-transparent no-underline sm:h-10 sm:w-10"),
|
|
1291
|
-
ref
|
|
1292
|
-
}, rest));
|
|
1293
|
-
});
|
|
1294
|
-
const PaginationEllipsis = () => {
|
|
1295
|
-
return /* @__PURE__ */ jsx("span", {
|
|
1296
|
-
className: "flex h-9 w-9 cursor-default items-center justify-center border-2 border-transparent sm:h-10 sm:w-10",
|
|
1297
|
-
children: "..."
|
|
1298
|
-
});
|
|
1299
|
-
};
|
|
1300
|
-
const Pages = ({
|
|
1301
|
-
children
|
|
1302
|
-
}) => {
|
|
1303
|
-
const {
|
|
1304
|
-
currentPage,
|
|
1305
|
-
pageCount
|
|
1306
|
-
} = useContext(PaginationContext);
|
|
1307
|
-
const end = Math.min(Math.max(2 + SIBLING_COUNT * 2, currentPage + SIBLING_COUNT), pageCount);
|
|
1308
|
-
let start = Math.max(Math.min(currentPage - SIBLING_COUNT, end - SIBLING_COUNT * 2), 1);
|
|
1309
|
-
if (start - SIBLING_COUNT === 0) {
|
|
1310
|
-
start = start - 1;
|
|
1311
|
-
}
|
|
1312
|
-
const pages = Array.from({
|
|
1313
|
-
length: end - start
|
|
1314
|
-
}, (_, i) => start + i + 1);
|
|
1315
|
-
return pages.map((page) => children(page));
|
|
1316
|
-
};
|
|
1317
|
-
const PageItem = forwardRef((props, ref) => {
|
|
1318
|
-
const _a = props, {
|
|
1319
|
-
page,
|
|
1320
|
-
selected
|
|
1321
|
-
} = _a, rest = __objRest(_a, [
|
|
1322
|
-
"page",
|
|
1323
|
-
"selected"
|
|
1324
|
-
]);
|
|
1325
|
-
return /* @__PURE__ */ jsx(PageLink, __spreadProps(__spreadValues({
|
|
1326
|
-
"aria-current": selected ? "page" : void 0,
|
|
1327
|
-
ref
|
|
1328
|
-
}, rest), {
|
|
1329
|
-
children: page
|
|
1330
|
-
}));
|
|
1331
|
-
});
|
|
1332
|
-
const RadioContext = createContext({
|
|
1333
|
-
defaultValue: void 0,
|
|
1334
|
-
isControlled: false,
|
|
1335
|
-
name: void 0,
|
|
1336
|
-
onChange: noop,
|
|
1337
|
-
required: false,
|
|
1338
|
-
value: void 0,
|
|
1339
|
-
error: false
|
|
1340
|
-
});
|
|
1341
|
-
const Radio = forwardRef((props, ref) => {
|
|
1342
|
-
const _a = props, {
|
|
1343
|
-
children,
|
|
1344
|
-
className
|
|
1345
|
-
} = _a, rest = __objRest(_a, [
|
|
1346
|
-
"children",
|
|
1347
|
-
"className"
|
|
1348
|
-
]);
|
|
1349
|
-
const {
|
|
1350
|
-
defaultValue,
|
|
1351
|
-
isControlled,
|
|
1352
|
-
name,
|
|
1353
|
-
onChange,
|
|
1354
|
-
required,
|
|
1355
|
-
value,
|
|
1356
|
-
error
|
|
1357
|
-
} = useContext(RadioContext);
|
|
1358
|
-
return /* @__PURE__ */ jsxs("label", {
|
|
1359
|
-
className: cx(className, "flex cursor-pointer gap-2.5"),
|
|
1360
|
-
children: [/* @__PURE__ */ jsx("input", __spreadValues({
|
|
1361
|
-
className: cx("radio", error && "border-red"),
|
|
1362
|
-
defaultChecked: !isControlled ? rest.value === defaultValue : void 0,
|
|
1363
|
-
checked: isControlled ? rest.value === value : void 0,
|
|
1364
|
-
name,
|
|
1365
|
-
onChange: isControlled ? onChange : void 0,
|
|
1366
|
-
required,
|
|
1367
|
-
type: "radio",
|
|
1368
|
-
ref
|
|
1369
|
-
}, rest)), children]
|
|
1370
|
-
});
|
|
1371
|
-
});
|
|
1372
|
-
const RadioGroup = forwardRef((props, ref) => {
|
|
1373
|
-
const isControlled = "value" in props;
|
|
1374
|
-
const _a = props, {
|
|
1375
|
-
className,
|
|
1376
|
-
defaultValue,
|
|
1377
|
-
description,
|
|
1378
|
-
error,
|
|
1379
|
-
id: idProp,
|
|
1380
|
-
children,
|
|
1381
|
-
label,
|
|
1382
|
-
name,
|
|
1383
|
-
onChange: onChangeProp,
|
|
1384
|
-
required,
|
|
1385
|
-
value
|
|
1386
|
-
} = _a, rest = __objRest(_a, [
|
|
1387
|
-
"className",
|
|
1388
|
-
"defaultValue",
|
|
1389
|
-
"description",
|
|
1390
|
-
"error",
|
|
1391
|
-
"id",
|
|
1392
|
-
"children",
|
|
1393
|
-
"label",
|
|
1394
|
-
"name",
|
|
1395
|
-
"onChange",
|
|
1396
|
-
"required",
|
|
1397
|
-
"value"
|
|
1398
|
-
]);
|
|
1399
|
-
const onChange = useCallback((event) => {
|
|
1400
|
-
const nextValue = event.target.value;
|
|
1401
|
-
onChangeProp == null ? void 0 : onChangeProp(nextValue);
|
|
1402
|
-
}, [onChangeProp]);
|
|
1403
|
-
const group = useMemo(() => ({
|
|
1404
|
-
defaultValue,
|
|
1405
|
-
isControlled,
|
|
1406
|
-
name,
|
|
1407
|
-
onChange,
|
|
1408
|
-
required,
|
|
1409
|
-
value,
|
|
1410
|
-
error: Boolean(error)
|
|
1411
|
-
}), [defaultValue, isControlled, name, onChange, required, value, error]);
|
|
1412
|
-
const groupId = useFallbackId(idProp);
|
|
1413
|
-
const labelId = `${groupId}:label`;
|
|
1414
|
-
const helpTextId = `${groupId}:help`;
|
|
1415
|
-
const errorMsgId = groupId + "err";
|
|
1416
|
-
const errorMsg = error;
|
|
1417
|
-
return /* @__PURE__ */ jsx(RadioContext.Provider, {
|
|
1418
|
-
value: group,
|
|
1419
|
-
children: /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({
|
|
1420
|
-
"aria-describedby": cx({
|
|
1421
|
-
[errorMsgId]: errorMsg,
|
|
1422
|
-
[helpTextId]: description
|
|
1423
|
-
}) || void 0,
|
|
1424
|
-
"aria-invalid": !!error,
|
|
1425
|
-
"aria-labelledby": label ? labelId : void 0,
|
|
1426
|
-
className: cx(className, "flex flex-col gap-4"),
|
|
1427
|
-
role: "radiogroup",
|
|
1428
|
-
ref
|
|
1429
|
-
}, rest), {
|
|
1430
|
-
children: [label && /* @__PURE__ */ jsx(FormLabel, {
|
|
1431
|
-
id: labelId,
|
|
1432
|
-
isRequired: required,
|
|
1433
|
-
isInvalid: !!error,
|
|
1434
|
-
children: label
|
|
1435
|
-
}), description && /* @__PURE__ */ jsx(FormHelperText, {
|
|
1436
|
-
id: helpTextId,
|
|
1437
|
-
children: description
|
|
1438
|
-
}), children, errorMsg && /* @__PURE__ */ jsx(FormErrorMessage, {
|
|
1439
|
-
id: errorMsgId,
|
|
1440
|
-
children: errorMsg
|
|
1441
|
-
})]
|
|
1442
|
-
}))
|
|
1443
|
-
});
|
|
1444
|
-
});
|
|
1445
|
-
const SelectPlain = forwardRef((props, ref) => {
|
|
1446
|
-
const _a = props, {
|
|
1447
|
-
children,
|
|
1448
|
-
className,
|
|
1449
|
-
isInvalid,
|
|
1450
|
-
size
|
|
1451
|
-
} = _a, rest = __objRest(_a, [
|
|
1452
|
-
"children",
|
|
1453
|
-
"className",
|
|
1454
|
-
"isInvalid",
|
|
1455
|
-
"size"
|
|
1456
|
-
]);
|
|
1457
|
-
const isSmall = size === "small";
|
|
1458
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
1459
|
-
className: cx(className, "relative", isSmall && "text-sm"),
|
|
1460
|
-
children: [/* @__PURE__ */ jsx("select", __spreadProps(__spreadValues({
|
|
1461
|
-
"aria-invalid": isInvalid
|
|
1462
|
-
}, rest), {
|
|
1463
|
-
className: cx("w-full cursor-pointer appearance-none border border-b-[3px] bg-white focus:-mt-0.5 focus:-ml-0.5 focus:border-[3px] focus:shadow focus:outline-none", isSmall ? "rounded px-3.5 py-2" : "rounded-lg px-4 py-3.5", isInvalid ? "border-red focus:border-red" : "focus:border-blue-dark border-black"),
|
|
1464
|
-
ref,
|
|
1465
|
-
children
|
|
1466
|
-
})), /* @__PURE__ */ jsx(ChevronDown, {
|
|
1467
|
-
className: cx("pointer-events-none absolute top-0 bottom-0 my-auto", isSmall ? "right-3.5" : "right-4")
|
|
1468
|
-
})]
|
|
1469
|
-
});
|
|
1470
|
-
});
|
|
1471
|
-
const Select = forwardRef((props, ref) => {
|
|
1472
|
-
const _a = props, {
|
|
1473
|
-
description,
|
|
1474
|
-
error,
|
|
1475
|
-
id: idProp,
|
|
1476
|
-
label,
|
|
1477
|
-
disableValidation = false
|
|
1478
|
-
} = _a, rest = __objRest(_a, [
|
|
1479
|
-
"description",
|
|
1480
|
-
"error",
|
|
1481
|
-
"id",
|
|
1482
|
-
"label",
|
|
1483
|
-
"disableValidation"
|
|
1484
|
-
]);
|
|
1485
|
-
const ownRef = useRef(null);
|
|
1486
|
-
const {
|
|
1487
|
-
validity,
|
|
1488
|
-
validationMessage
|
|
1489
|
-
} = useFormControlValidity(ownRef, !disableValidation);
|
|
1490
|
-
const id = useFallbackId(idProp);
|
|
1491
|
-
const helpTextId = id + "help";
|
|
1492
|
-
const errorMsgId = id + "err";
|
|
1493
|
-
const errorMsg = error || validationMessage;
|
|
1494
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
1495
|
-
className: "grid gap-2",
|
|
1496
|
-
children: [/* @__PURE__ */ jsx(FormLabel, {
|
|
1497
|
-
htmlFor: id,
|
|
1498
|
-
isRequired: props.required,
|
|
1499
|
-
isInvalid: !!error || validity === "invalid",
|
|
1500
|
-
children: label
|
|
1501
|
-
}), description && /* @__PURE__ */ jsx(FormHelperText, {
|
|
1502
|
-
id: helpTextId,
|
|
1503
|
-
children: description
|
|
1504
|
-
}), /* @__PURE__ */ jsx(SelectPlain, __spreadProps(__spreadValues({
|
|
1505
|
-
id,
|
|
1506
|
-
ref: composeRefs(ownRef, ref)
|
|
1507
|
-
}, rest), {
|
|
1508
|
-
isInvalid: !!error || validity === "invalid",
|
|
1509
|
-
"aria-describedby": cx({
|
|
1510
|
-
[errorMsgId]: errorMsg,
|
|
1511
|
-
[helpTextId]: description
|
|
1512
|
-
}) || void 0
|
|
1513
|
-
})), errorMsg && /* @__PURE__ */ jsx(FormErrorMessage, {
|
|
1514
|
-
id: errorMsgId,
|
|
1515
|
-
children: errorMsg
|
|
1516
|
-
})]
|
|
1517
|
-
});
|
|
1518
|
-
});
|
|
1519
|
-
const Snackbar = (props) => {
|
|
1520
|
-
const {
|
|
1521
|
-
heading,
|
|
1522
|
-
children,
|
|
1523
|
-
closeSnackbar
|
|
1524
|
-
} = props;
|
|
1525
|
-
const [isExpanded, setIsExpanded] = useState(false);
|
|
1526
|
-
return /* @__PURE__ */ jsx("div", {
|
|
1527
|
-
className: "container max-w-[59rem]",
|
|
1528
|
-
children: /* @__PURE__ */ jsx("div", {
|
|
1529
|
-
className: "bg-orange-light rounded-lg p-4",
|
|
1530
|
-
children: /* @__PURE__ */ jsxs("div", {
|
|
1531
|
-
className: "snackbar grid items-center",
|
|
1532
|
-
children: [/* @__PURE__ */ jsx(InfoCircle, {
|
|
1533
|
-
className: "text-orange snackbar-icon mr-4 md:mr-8 md:text-2xl"
|
|
1534
|
-
}), /* @__PURE__ */ jsx("h3", {
|
|
1535
|
-
className: cx("snackbar-header min-w-0 max-w-prose text-base font-medium", {
|
|
1536
|
-
"overflow-hidden overflow-ellipsis whitespace-nowrap": !isExpanded
|
|
1537
|
-
}),
|
|
1538
|
-
children: heading
|
|
1539
|
-
}), /* @__PURE__ */ jsxs("div", {
|
|
1540
|
-
className: "snackbar-actions flex justify-end gap-4 max-md:mt-3 md:ml-4",
|
|
1541
|
-
children: [/* @__PURE__ */ jsx(SnackbarButton, {
|
|
1542
|
-
"aria-expanded": isExpanded,
|
|
1543
|
-
onClick: () => setIsExpanded(!isExpanded),
|
|
1544
|
-
children: isExpanded ? "Les mindre" : "Les mer"
|
|
1545
|
-
}), /* @__PURE__ */ jsx(SnackbarButton, {
|
|
1546
|
-
onClick: closeSnackbar,
|
|
1547
|
-
children: "Ok"
|
|
1548
|
-
})]
|
|
1549
|
-
}), isExpanded && children]
|
|
1550
|
-
})
|
|
1551
|
-
})
|
|
1552
|
-
});
|
|
1553
|
-
};
|
|
1554
|
-
const SnackbarButton = (props) => /* @__PURE__ */ jsx("button", __spreadProps(__spreadValues({
|
|
1555
|
-
className: cx(props.className, "focus-visible:ring-offset flex-shrink-0 underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-black")
|
|
1556
|
-
}, props), {
|
|
1557
|
-
children: props.children
|
|
1558
|
-
}));
|
|
1559
|
-
const SnackbarContent = (props) => {
|
|
1560
|
-
return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({
|
|
1561
|
-
className: "snackbar-content my-4 max-h-[50vh] max-w-prose overflow-y-auto"
|
|
1562
|
-
}, props), {
|
|
1563
|
-
children: props.children
|
|
1564
|
-
}));
|
|
1565
|
-
};
|
|
1566
|
-
const StepList = (props) => {
|
|
1567
|
-
const _a = props, {
|
|
1568
|
-
align = "center",
|
|
1569
|
-
children,
|
|
1570
|
-
className
|
|
1571
|
-
} = _a, rest = __objRest(_a, [
|
|
1572
|
-
"align",
|
|
1573
|
-
"children",
|
|
1574
|
-
"className"
|
|
1575
|
-
]);
|
|
1576
|
-
return /* @__PURE__ */ jsx("ol", __spreadProps(__spreadValues({
|
|
1577
|
-
className: cx(className, "flex flex-col gap-8 md:gap-12")
|
|
1578
|
-
}, rest), {
|
|
1579
|
-
children: Children.map(children, (child) => {
|
|
1580
|
-
return cloneElement(child, {
|
|
1581
|
-
align
|
|
1582
|
-
});
|
|
1583
|
-
})
|
|
1584
|
-
}));
|
|
1585
|
-
};
|
|
1586
|
-
const StepListItem = (props) => {
|
|
1587
|
-
const _a = props, {
|
|
1588
|
-
className,
|
|
1589
|
-
children,
|
|
1590
|
-
bullet,
|
|
1591
|
-
align = "center"
|
|
1592
|
-
} = _a, rest = __objRest(_a, [
|
|
1593
|
-
"className",
|
|
1594
|
-
"children",
|
|
1595
|
-
"bullet",
|
|
1596
|
-
"align"
|
|
1597
|
-
]);
|
|
1598
|
-
return /* @__PURE__ */ jsxs("li", __spreadProps(__spreadValues({
|
|
1599
|
-
className: cx(className, "group relative flex gap-4 text-sm md:gap-8 md:text-base", {
|
|
1600
|
-
"items-center": align === "center"
|
|
1601
|
-
})
|
|
1602
|
-
}, rest), {
|
|
1603
|
-
children: [/* @__PURE__ */ jsx(StepListBullet, {
|
|
1604
|
-
align,
|
|
1605
|
-
children: bullet
|
|
1606
|
-
}), children]
|
|
1607
|
-
}));
|
|
1608
|
-
};
|
|
1609
|
-
const StepListBullet = (_a) => {
|
|
1610
|
-
var _b = _a, {
|
|
1611
|
-
align
|
|
1612
|
-
} = _b, props = __objRest(_b, [
|
|
1613
|
-
"align"
|
|
1614
|
-
]);
|
|
1615
|
-
return /* @__PURE__ */ jsx("span", __spreadValues({
|
|
1616
|
-
"aria-hidden": true,
|
|
1617
|
-
className: cx("text-green after:bg-gray-light before:bg-gray-light grid h-10 w-10 flex-none place-content-center justify-items-center rounded-full border-2 text-sm font-bold after:absolute after:bottom-0 after:w-0.5 after:translate-x-1/2 group-last:after:hidden md:h-20 md:w-20 md:text-xl", {
|
|
1618
|
-
"before:absolute before:top-0 before:bottom-1/2 before:w-0.5 before:-translate-y-5 before:translate-x-1/2 after:top-1/2 after:translate-y-5 group-first:before:hidden before:md:-translate-y-10 after:md:translate-y-10": align === "center",
|
|
1619
|
-
"after:top-10 after:-bottom-8 after:md:-bottom-12 after:md:top-20": align === "top"
|
|
1620
|
-
})
|
|
1621
|
-
}, props));
|
|
1622
|
-
};
|
|
1623
|
-
StepList.Item = StepListItem;
|
|
1624
|
-
const TextArea = forwardRef((props, ref) => {
|
|
1625
|
-
const _a = props, {
|
|
1626
|
-
description,
|
|
1627
|
-
error,
|
|
1628
|
-
id: idProp,
|
|
1629
|
-
label,
|
|
1630
|
-
disableValidation = false
|
|
1631
|
-
} = _a, rest = __objRest(_a, [
|
|
1632
|
-
"description",
|
|
1633
|
-
"error",
|
|
1634
|
-
"id",
|
|
1635
|
-
"label",
|
|
1636
|
-
"disableValidation"
|
|
1637
|
-
]);
|
|
1638
|
-
const ownRef = useRef(null);
|
|
1639
|
-
const {
|
|
1640
|
-
validity,
|
|
1641
|
-
validationMessage
|
|
1642
|
-
} = useFormControlValidity(ownRef, !disableValidation);
|
|
1643
|
-
const id = useFallbackId(idProp);
|
|
1644
|
-
const helpTextId = id + "help";
|
|
1645
|
-
const errorMsgId = id + "err";
|
|
1646
|
-
const errorMsg = error || validationMessage;
|
|
1647
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
1648
|
-
className: "grid gap-2",
|
|
1649
|
-
children: [/* @__PURE__ */ jsx(FormLabel, {
|
|
1650
|
-
htmlFor: id,
|
|
1651
|
-
isRequired: props.required,
|
|
1652
|
-
isInvalid: !!error || validity === "invalid",
|
|
1653
|
-
children: label
|
|
1654
|
-
}), description && /* @__PURE__ */ jsx(FormHelperText, {
|
|
1655
|
-
id: helpTextId,
|
|
1656
|
-
children: description
|
|
1657
|
-
}), /* @__PURE__ */ jsx(Input, __spreadProps(__spreadValues({
|
|
1658
|
-
as: "textarea",
|
|
1659
|
-
ref: composeRefs(ownRef, ref),
|
|
1660
|
-
id
|
|
1661
|
-
}, rest), {
|
|
1662
|
-
isInvalid: !!error || validity === "invalid",
|
|
1663
|
-
"aria-describedby": cx({
|
|
1664
|
-
[errorMsgId]: errorMsg,
|
|
1665
|
-
[helpTextId]: description
|
|
1666
|
-
}) || void 0
|
|
1667
|
-
})), errorMsg && /* @__PURE__ */ jsx(FormErrorMessage, {
|
|
1668
|
-
id: errorMsgId,
|
|
1669
|
-
children: errorMsg
|
|
1670
|
-
})]
|
|
1671
|
-
});
|
|
1672
|
-
});
|
|
1673
|
-
const TextField = forwardRef((props, ref) => {
|
|
1674
|
-
const _a = props, {
|
|
1675
|
-
description,
|
|
1676
|
-
error,
|
|
1677
|
-
id: idProp,
|
|
1678
|
-
label,
|
|
1679
|
-
type = "text",
|
|
1680
|
-
disableValidation = false
|
|
1681
|
-
} = _a, rest = __objRest(_a, [
|
|
1682
|
-
"description",
|
|
1683
|
-
"error",
|
|
1684
|
-
"id",
|
|
1685
|
-
"label",
|
|
1686
|
-
"type",
|
|
1687
|
-
"disableValidation"
|
|
1688
|
-
]);
|
|
1689
|
-
const ownRef = useRef(null);
|
|
1690
|
-
const {
|
|
1691
|
-
validity,
|
|
1692
|
-
validationMessage
|
|
1693
|
-
} = useFormControlValidity(ownRef, !disableValidation);
|
|
1694
|
-
const id = useFallbackId(idProp);
|
|
1695
|
-
const helpTextId = id + "help";
|
|
1696
|
-
const errorMsgId = id + "err";
|
|
1697
|
-
const errorMsg = error || validationMessage;
|
|
1698
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
1699
|
-
className: "grid gap-2",
|
|
1700
|
-
children: [/* @__PURE__ */ jsx(FormLabel, {
|
|
1701
|
-
htmlFor: id,
|
|
1702
|
-
isRequired: props.required,
|
|
1703
|
-
isInvalid: !!error || validity === "invalid",
|
|
1704
|
-
children: label
|
|
1705
|
-
}), description && /* @__PURE__ */ jsx(FormHelperText, {
|
|
1706
|
-
id: helpTextId,
|
|
1707
|
-
children: description
|
|
1708
|
-
}), /* @__PURE__ */ jsx(Input, __spreadProps(__spreadValues({
|
|
1709
|
-
id,
|
|
1710
|
-
ref: composeRefs(ownRef, ref),
|
|
1711
|
-
type
|
|
1712
|
-
}, rest), {
|
|
1713
|
-
isInvalid: !!error || validity === "invalid",
|
|
1714
|
-
"aria-describedby": cx({
|
|
1715
|
-
[errorMsgId]: errorMsg,
|
|
1716
|
-
[helpTextId]: description
|
|
1717
|
-
}) || void 0
|
|
1718
|
-
})), errorMsg && /* @__PURE__ */ jsx(FormErrorMessage, {
|
|
1719
|
-
id: errorMsgId,
|
|
1720
|
-
children: errorMsg
|
|
1721
|
-
})]
|
|
1722
|
-
});
|
|
1723
|
-
});
|
|
1724
|
-
export { Accordion, AccordionContent, AccordionHeader, AccordionItem, Alert, Banner, BannerImage, Button, ButtonColorContext, Campaign, Card, CardContent, CardImage, CardLinkOverlay, CardList, Checkbox, Chip, Footer, Form, FormError, FormErrorMessage, FormHeading, FormHelperText, FormLabel, FormSuccess, Hero, HeroActions, HeroContent, HeroContext, HeroImage, Input, Link, Navbar, NavbarCollapsible, NavbarContent, NavbarExpandedMobileContent, NavbarItem, NavbarItems, Pagination, Radio, RadioGroup, Select, Snackbar, SnackbarButton, SnackbarContent, StepList, StepListItem, TextArea, TextField, useBlockBackgroundColor, useFallbackId, useFormControlValidity, usePrefersReducedMotion, useScreenMaxWidthMd };
|