@vygruppen/spor-react 9.6.0 → 9.6.1
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/.turbo/turbo-build.log +10 -10
- package/CHANGELOG.md +11 -1
- package/dist/{CountryCodeSelect-EZTV452W.mjs → CountryCodeSelect-2KOFVXIQ.mjs} +1 -1
- package/dist/{chunk-7VZBL2PP.mjs → chunk-XXA3IGVH.mjs} +309 -479
- package/dist/index.d.mts +1 -694
- package/dist/index.d.ts +1 -694
- package/dist/index.js +362 -548
- package/dist/index.mjs +1 -1
- package/package.json +4 -4
- package/src/card/index.tsx +0 -1
- package/src/theme/components/index.ts +0 -1
- package/src/theme/components/static-card.ts +2 -3
- package/src/card/PressableCard.tsx +0 -52
- package/src/theme/components/pressable-card.ts +0 -179
package/dist/index.js
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
'use strict';
|
2
2
|
|
3
3
|
var react = require('@chakra-ui/react');
|
4
|
-
var
|
4
|
+
var React70 = require('react');
|
5
5
|
var lottieReact = require('lottie-react');
|
6
6
|
var sporLoader = require('@vygruppen/spor-loader');
|
7
7
|
var reactAria = require('react-aria');
|
@@ -36,7 +36,7 @@ function _interopNamespace(e) {
|
|
36
36
|
return Object.freeze(n);
|
37
37
|
}
|
38
38
|
|
39
|
-
var
|
39
|
+
var React70__namespace = /*#__PURE__*/_interopNamespace(React70);
|
40
40
|
var tokens11__namespace = /*#__PURE__*/_interopNamespace(tokens11);
|
41
41
|
var deepmerge__default = /*#__PURE__*/_interopDefault(deepmerge);
|
42
42
|
|
@@ -76,7 +76,7 @@ exports.Divider = void 0;
|
|
76
76
|
var init_Divider = __esm({
|
77
77
|
"src/layout/Divider.tsx"() {
|
78
78
|
exports.Divider = react.forwardRef((props, ref) => {
|
79
|
-
return /* @__PURE__ */
|
79
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Divider, { ...props, ref });
|
80
80
|
});
|
81
81
|
}
|
82
82
|
});
|
@@ -85,7 +85,7 @@ var init_Stack = __esm({
|
|
85
85
|
"src/layout/Stack.tsx"() {
|
86
86
|
exports.Stack = react.forwardRef(
|
87
87
|
({ flexDirection, ...props }, ref) => {
|
88
|
-
return /* @__PURE__ */
|
88
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Stack, { ...props, direction: flexDirection, ref });
|
89
89
|
}
|
90
90
|
);
|
91
91
|
}
|
@@ -99,15 +99,15 @@ var init_layout = __esm({
|
|
99
99
|
var AccordionContext, AccordionProvider, useAccordionContext;
|
100
100
|
var init_AccordionContext = __esm({
|
101
101
|
"src/accordion/AccordionContext.tsx"() {
|
102
|
-
AccordionContext =
|
102
|
+
AccordionContext = React70__namespace.default.createContext(null);
|
103
103
|
AccordionProvider = ({
|
104
104
|
size: size2,
|
105
105
|
...props
|
106
106
|
}) => {
|
107
|
-
return /* @__PURE__ */
|
107
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(AccordionContext.Provider, { value: { size: size2 }, ...props });
|
108
108
|
};
|
109
109
|
useAccordionContext = () => {
|
110
|
-
const context =
|
110
|
+
const context = React70__namespace.default.useContext(AccordionContext);
|
111
111
|
if (context === null) {
|
112
112
|
throw new Error(
|
113
113
|
"useAccordionContext must be used within AccordionProvider"
|
@@ -125,14 +125,14 @@ var init_Accordion = __esm({
|
|
125
125
|
exports.Accordion = react.forwardRef(
|
126
126
|
({ children, spacing: spacing3 = 2, ...props }, ref) => {
|
127
127
|
const defaultIndex = typeof props.defaultIndex === "number" && props.allowMultiple ? [props.defaultIndex] : props.defaultIndex;
|
128
|
-
return /* @__PURE__ */
|
128
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(AccordionProvider, { size: props.size }, /* @__PURE__ */ React70__namespace.default.createElement(
|
129
129
|
react.Accordion,
|
130
130
|
{
|
131
131
|
...props,
|
132
132
|
ref,
|
133
133
|
defaultIndex
|
134
134
|
},
|
135
|
-
/* @__PURE__ */
|
135
|
+
/* @__PURE__ */ React70__namespace.default.createElement(exports.Stack, { spacing: spacing3 }, children)
|
136
136
|
));
|
137
137
|
}
|
138
138
|
);
|
@@ -155,7 +155,7 @@ var init_Expandable = __esm({
|
|
155
155
|
},
|
156
156
|
...rest
|
157
157
|
}) => {
|
158
|
-
return /* @__PURE__ */
|
158
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
159
159
|
exports.Accordion,
|
160
160
|
{
|
161
161
|
...rest,
|
@@ -165,7 +165,7 @@ var init_Expandable = __esm({
|
|
165
165
|
size: size2,
|
166
166
|
onChange: (expandedIndex) => onChange(expandedIndex === 0)
|
167
167
|
},
|
168
|
-
/* @__PURE__ */
|
168
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
169
169
|
exports.ExpandableItem,
|
170
170
|
{
|
171
171
|
headingLevel,
|
@@ -185,7 +185,7 @@ var init_Expandable = __esm({
|
|
185
185
|
}) => {
|
186
186
|
const { size: size2 } = useAccordionContext();
|
187
187
|
warnAboutMismatchingIcon({ icon: leftIcon, size: size2 });
|
188
|
-
return /* @__PURE__ */
|
188
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.AccordionItem, { ...rest }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: headingLevel }, /* @__PURE__ */ React70__namespace.default.createElement(react.AccordionButton, null, /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { alignItems: "center" }, leftIcon && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { marginRight: 1 }, leftIcon), title), /* @__PURE__ */ React70__namespace.default.createElement(react.AccordionIcon, null))), /* @__PURE__ */ React70__namespace.default.createElement(react.AccordionPanel, null, children));
|
189
189
|
};
|
190
190
|
warnAboutMismatchingIcon = ({ icon, size: size2 }) => {
|
191
191
|
var _a6, _b5;
|
@@ -236,10 +236,10 @@ function LanguageProvider({
|
|
236
236
|
language,
|
237
237
|
children
|
238
238
|
}) {
|
239
|
-
return /* @__PURE__ */
|
239
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(LanguageContext.Provider, { value: language }, children);
|
240
240
|
}
|
241
241
|
function useLanguage() {
|
242
|
-
const language =
|
242
|
+
const language = React70.useContext(LanguageContext);
|
243
243
|
if (!language) {
|
244
244
|
throw new Error("Please wrap your application in a LanguageProvider");
|
245
245
|
}
|
@@ -265,12 +265,12 @@ var init_i18n = __esm({
|
|
265
265
|
Language3["English"] = "en";
|
266
266
|
return Language3;
|
267
267
|
})(exports.Language || {});
|
268
|
-
LanguageContext =
|
268
|
+
LanguageContext = React70.createContext(void 0);
|
269
269
|
}
|
270
270
|
});
|
271
271
|
function useHydrated() {
|
272
|
-
let [hydrated, setHydrated] =
|
273
|
-
|
272
|
+
let [hydrated, setHydrated] = React70.useState(() => !hydrating);
|
273
|
+
React70.useEffect(function hydrate() {
|
274
274
|
hydrating = false;
|
275
275
|
setHydrated(true);
|
276
276
|
}, []);
|
@@ -288,13 +288,13 @@ var init_ClientOnly = __esm({
|
|
288
288
|
init_useHydrated();
|
289
289
|
ClientOnly = ({ children, fallback = null }) => {
|
290
290
|
const isHydrated = useHydrated();
|
291
|
-
return /* @__PURE__ */
|
291
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(React70__namespace.default.Fragment, null, isHydrated ? children() : fallback);
|
292
292
|
};
|
293
293
|
}
|
294
294
|
});
|
295
295
|
function Lottie({ animationData }) {
|
296
296
|
const { View } = lottieReact.useLottie({ animationData, loop: true });
|
297
|
-
return /* @__PURE__ */
|
297
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(React70__namespace.default.Fragment, null, View);
|
298
298
|
}
|
299
299
|
var init_Lottie = __esm({
|
300
300
|
"src/loader/Lottie.tsx"() {
|
@@ -310,7 +310,7 @@ var init_ColorInlineLoader = __esm({
|
|
310
310
|
maxWidth,
|
311
311
|
...props
|
312
312
|
}) => {
|
313
|
-
return /* @__PURE__ */
|
313
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Center, { ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width, maxWidth }, /* @__PURE__ */ React70__namespace.default.createElement(ClientOnly, null, () => /* @__PURE__ */ React70__namespace.default.createElement(Lottie, { animationData: sporLoader.inlineLoaderColorData }))));
|
314
314
|
};
|
315
315
|
}
|
316
316
|
});
|
@@ -325,7 +325,7 @@ var init_ColorSpinner = __esm({
|
|
325
325
|
maxWidth,
|
326
326
|
...props
|
327
327
|
}) => {
|
328
|
-
return /* @__PURE__ */
|
328
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Center, { flexDirection: "column", ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width, maxWidth }, /* @__PURE__ */ React70__namespace.default.createElement(ClientOnly, null, () => /* @__PURE__ */ React70__namespace.default.createElement(Lottie, { animationData: sporLoader.spinnerColorData }))), children && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { marginTop: 3, fontWeight: "bold" }, children));
|
329
329
|
};
|
330
330
|
}
|
331
331
|
});
|
@@ -335,7 +335,7 @@ var init_ContentLoader = __esm({
|
|
335
335
|
init_ClientOnly();
|
336
336
|
init_Lottie();
|
337
337
|
exports.ContentLoader = ({ children, ...props }) => {
|
338
|
-
return /* @__PURE__ */
|
338
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { maxWidth: "140px", marginX: "auto" }, /* @__PURE__ */ React70__namespace.default.createElement(ClientOnly, null, () => /* @__PURE__ */ React70__namespace.default.createElement(Lottie, { animationData: sporLoader.contentLoaderData }))), children && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { textAlign: "center", fontWeight: "bold" }, children));
|
339
339
|
};
|
340
340
|
}
|
341
341
|
});
|
@@ -349,7 +349,7 @@ var init_DarkFullScreenLoader = __esm({
|
|
349
349
|
maxWidth,
|
350
350
|
...props
|
351
351
|
}) => {
|
352
|
-
return /* @__PURE__ */
|
352
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Center, { height: "100%", background: "darkTeal", ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width, maxWidth }, /* @__PURE__ */ React70__namespace.default.createElement(ClientOnly, null, () => /* @__PURE__ */ React70__namespace.default.createElement(Lottie, { animationData: sporLoader.fullScreenLoaderWhiteData }))));
|
353
353
|
};
|
354
354
|
}
|
355
355
|
});
|
@@ -363,7 +363,7 @@ var init_DarkInlineLoader = __esm({
|
|
363
363
|
maxWidth,
|
364
364
|
...props
|
365
365
|
}) => {
|
366
|
-
return /* @__PURE__ */
|
366
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Center, { ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width, maxWidth }, /* @__PURE__ */ React70__namespace.default.createElement(ClientOnly, null, () => /* @__PURE__ */ React70__namespace.default.createElement(Lottie, { animationData: sporLoader.inlineLoaderDarkData }))));
|
367
367
|
};
|
368
368
|
}
|
369
369
|
});
|
@@ -381,7 +381,7 @@ var init_DarkSpinner = __esm({
|
|
381
381
|
}) => {
|
382
382
|
const { colorMode } = react.useColorMode();
|
383
383
|
const spinnerData = colorMode === "dark" ? sporLoader.spinnerLightData : sporLoader.spinnerDarkData;
|
384
|
-
return /* @__PURE__ */
|
384
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Center, { flexDirection: "column", ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width, maxWidth }, /* @__PURE__ */ React70__namespace.default.createElement(ClientOnly, null, () => /* @__PURE__ */ React70__namespace.default.createElement(Lottie, { animationData: spinnerData }))), children && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { marginTop: 3, fontWeight: "bold" }, children));
|
385
385
|
};
|
386
386
|
}
|
387
387
|
});
|
@@ -395,7 +395,7 @@ var init_LightFullScreenLoader = __esm({
|
|
395
395
|
maxWidth,
|
396
396
|
...props
|
397
397
|
}) => {
|
398
|
-
return /* @__PURE__ */
|
398
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Center, { height: "100%", background: "white", ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width, maxWidth }, /* @__PURE__ */ React70__namespace.default.createElement(ClientOnly, null, () => /* @__PURE__ */ React70__namespace.default.createElement(Lottie, { animationData: sporLoader.fullScreenLoaderBlackData }))));
|
399
399
|
};
|
400
400
|
}
|
401
401
|
});
|
@@ -409,7 +409,7 @@ var init_LightInlineLoader = __esm({
|
|
409
409
|
maxWidth,
|
410
410
|
...props
|
411
411
|
}) => {
|
412
|
-
return /* @__PURE__ */
|
412
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Center, { ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width, maxWidth }, /* @__PURE__ */ React70__namespace.default.createElement(ClientOnly, null, () => /* @__PURE__ */ React70__namespace.default.createElement(Lottie, { animationData: sporLoader.inlineLoaderLightData }))));
|
413
413
|
};
|
414
414
|
}
|
415
415
|
});
|
@@ -424,7 +424,7 @@ var init_LightSpinner = __esm({
|
|
424
424
|
maxWidth,
|
425
425
|
...props
|
426
426
|
}) => {
|
427
|
-
return /* @__PURE__ */
|
427
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Center, { flexDirection: "column", ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width, maxWidth }, /* @__PURE__ */ React70__namespace.default.createElement(ClientOnly, null, () => /* @__PURE__ */ React70__namespace.default.createElement(Lottie, { animationData: sporLoader.spinnerLightData }))), children && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { marginTop: 3, fontWeight: "bold" }, children));
|
428
428
|
};
|
429
429
|
}
|
430
430
|
});
|
@@ -432,11 +432,11 @@ var useRotatingLabel;
|
|
432
432
|
var init_useRotatingLabel = __esm({
|
433
433
|
"src/loader/useRotatingLabel.tsx"() {
|
434
434
|
useRotatingLabel = ({ label, delay }) => {
|
435
|
-
const loadingTextArray =
|
435
|
+
const loadingTextArray = React70.useMemo(
|
436
436
|
() => Array.isArray(label) ? label : [label],
|
437
437
|
[label]
|
438
438
|
);
|
439
|
-
const [currentLoadingTextIndex, setCurrentLoadingTextIndex] =
|
439
|
+
const [currentLoadingTextIndex, setCurrentLoadingTextIndex] = React70.useState(0);
|
440
440
|
react.useInterval(() => {
|
441
441
|
setCurrentLoadingTextIndex(
|
442
442
|
(prevIndex) => (prevIndex + 1) % loadingTextArray.length
|
@@ -471,7 +471,7 @@ var init_ProgressBar = __esm({
|
|
471
471
|
"aria-label": ariaLabel || t2(texts.label(value))
|
472
472
|
});
|
473
473
|
const styles3 = react.useMultiStyleConfig("ProgressBar", {});
|
474
|
-
return /* @__PURE__ */
|
474
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(React70__namespace.default.Fragment, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
475
475
|
react.Box,
|
476
476
|
{
|
477
477
|
...progressBarProps,
|
@@ -479,8 +479,8 @@ var init_ProgressBar = __esm({
|
|
479
479
|
__css: styles3.container,
|
480
480
|
...rest
|
481
481
|
},
|
482
|
-
/* @__PURE__ */
|
483
|
-
currentLoadingText && /* @__PURE__ */
|
482
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width, __css: styles3.background }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { __css: styles3.progress, height, width: `${value}%` })),
|
483
|
+
currentLoadingText && /* @__PURE__ */ React70__namespace.default.createElement(react.Text, { sx: styles3.description, ...labelProps }, currentLoadingText)
|
484
484
|
));
|
485
485
|
};
|
486
486
|
texts = createTexts({
|
@@ -517,11 +517,11 @@ var init_ProgressLoader = __esm({
|
|
517
517
|
value,
|
518
518
|
"aria-label": ariaLabel ?? t2(texts2.fallbackLabel(value ?? "?"))
|
519
519
|
});
|
520
|
-
const pathRef =
|
520
|
+
const pathRef = React70.useRef(null);
|
521
521
|
const progressPathLength = ((_a6 = pathRef.current) == null ? void 0 : _a6.getTotalLength()) ?? 0;
|
522
522
|
const progress = (value - 100) / 100 * progressPathLength;
|
523
|
-
const id =
|
524
|
-
return /* @__PURE__ */
|
523
|
+
const id = React70.useId();
|
524
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...progressBarProps, minWidth: "100px", width, ...rest }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: "svg", viewBox: "0 0 246 78", fill: "none" }, /* @__PURE__ */ React70__namespace.default.createElement(
|
525
525
|
react.Box,
|
526
526
|
{
|
527
527
|
as: "path",
|
@@ -529,7 +529,7 @@ var init_ProgressLoader = __esm({
|
|
529
529
|
d: "M14.0479 44.8251C19.4332 44.8251 23.7988 40.5242 23.7988 35.2187C23.7988 29.9133 19.4332 25.6124 14.0479 25.6124C8.66254 25.6124 4.29688 29.9133 4.29688 35.2187C4.29688 40.5242 8.66254 44.8251 14.0479 44.8251Z",
|
530
530
|
fill: "#FFB466"
|
531
531
|
}
|
532
|
-
), /* @__PURE__ */
|
532
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
533
533
|
react.Box,
|
534
534
|
{
|
535
535
|
as: "path",
|
@@ -540,7 +540,7 @@ var init_ProgressLoader = __esm({
|
|
540
540
|
strokeLinecap: "round",
|
541
541
|
strokeLinejoin: "round"
|
542
542
|
}
|
543
|
-
), /* @__PURE__ */
|
543
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
544
544
|
react.Box,
|
545
545
|
{
|
546
546
|
as: "path",
|
@@ -555,7 +555,7 @@ var init_ProgressLoader = __esm({
|
|
555
555
|
transition: "stroke-dashoffset .2s ease-out",
|
556
556
|
ref: pathRef
|
557
557
|
}
|
558
|
-
), /* @__PURE__ */
|
558
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
559
559
|
react.Box,
|
560
560
|
{
|
561
561
|
as: "path",
|
@@ -563,7 +563,7 @@ var init_ProgressLoader = __esm({
|
|
563
563
|
d: "M226.025 44.8251C231.411 44.8251 235.776 40.5242 235.776 35.2187C235.776 29.9133 231.411 25.6124 226.025 25.6124C220.64 25.6124 216.274 29.9133 216.274 35.2187C216.274 40.5242 220.64 44.8251 226.025 44.8251Z",
|
564
564
|
fill: "#688CBA"
|
565
565
|
}
|
566
|
-
)), currentLoadingText && /* @__PURE__ */
|
566
|
+
)), currentLoadingText && /* @__PURE__ */ React70__namespace.default.createElement(
|
567
567
|
react.Text,
|
568
568
|
{
|
569
569
|
textAlign: "center",
|
@@ -587,19 +587,19 @@ var init_ProgressLoader = __esm({
|
|
587
587
|
exports.Skeleton = void 0;
|
588
588
|
var init_Skeleton = __esm({
|
589
589
|
"src/loader/Skeleton.tsx"() {
|
590
|
-
exports.Skeleton = react.forwardRef((props, ref) => /* @__PURE__ */
|
590
|
+
exports.Skeleton = react.forwardRef((props, ref) => /* @__PURE__ */ React70__namespace.default.createElement(react.Skeleton, { ...props, ref }));
|
591
591
|
}
|
592
592
|
});
|
593
593
|
exports.SkeletonCircle = void 0;
|
594
594
|
var init_SkeletonCircle = __esm({
|
595
595
|
"src/loader/SkeletonCircle.tsx"() {
|
596
|
-
exports.SkeletonCircle = (props) => /* @__PURE__ */
|
596
|
+
exports.SkeletonCircle = (props) => /* @__PURE__ */ React70__namespace.default.createElement(react.SkeletonCircle, { boxSize: 6, borderRadius: "50%", ...props });
|
597
597
|
}
|
598
598
|
});
|
599
599
|
exports.SkeletonText = void 0;
|
600
600
|
var init_SkeletonText = __esm({
|
601
601
|
"src/loader/SkeletonText.tsx"() {
|
602
|
-
exports.SkeletonText = (props) => /* @__PURE__ */
|
602
|
+
exports.SkeletonText = (props) => /* @__PURE__ */ React70__namespace.default.createElement(react.SkeletonText, { boxSize: 6, ...props });
|
603
603
|
}
|
604
604
|
});
|
605
605
|
|
@@ -674,7 +674,7 @@ var init_Button = __esm({
|
|
674
674
|
if (fontWeight) {
|
675
675
|
styles3.fontWeight = fontWeight;
|
676
676
|
}
|
677
|
-
return /* @__PURE__ */
|
677
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
678
678
|
react.Box,
|
679
679
|
{
|
680
680
|
...rest,
|
@@ -687,7 +687,7 @@ var init_Button = __esm({
|
|
687
687
|
disabled: isDisabled || isLoading,
|
688
688
|
position: "relative"
|
689
689
|
},
|
690
|
-
isLoading && /* @__PURE__ */
|
690
|
+
isLoading && /* @__PURE__ */ React70__namespace.default.createElement(react.Center, { position: "absolute", right: 0, left: 0, top: 1, bottom: 0 }, /* @__PURE__ */ React70__namespace.default.createElement(
|
691
691
|
exports.ColorInlineLoader,
|
692
692
|
{
|
693
693
|
maxWidth: getLoaderWidth(finalSize),
|
@@ -696,7 +696,7 @@ var init_Button = __esm({
|
|
696
696
|
marginY: 2
|
697
697
|
}
|
698
698
|
)),
|
699
|
-
/* @__PURE__ */
|
699
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
700
700
|
react.Flex,
|
701
701
|
{
|
702
702
|
gap: 1,
|
@@ -706,7 +706,7 @@ var init_Button = __esm({
|
|
706
706
|
visibility: isLoading ? "hidden" : "visible",
|
707
707
|
"aria-hidden": isLoading
|
708
708
|
},
|
709
|
-
/* @__PURE__ */
|
709
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { gap: 1, alignItems: "center" }, leftIcon, /* @__PURE__ */ React70__namespace.default.createElement(
|
710
710
|
react.Box,
|
711
711
|
{
|
712
712
|
visibility: isLoading ? "hidden" : "visible",
|
@@ -732,7 +732,7 @@ var init_Button = __esm({
|
|
732
732
|
exports.ButtonGroup = void 0;
|
733
733
|
var init_ButtonGroup = __esm({
|
734
734
|
"src/button/ButtonGroup.tsx"() {
|
735
|
-
exports.ButtonGroup = react.forwardRef((props, ref) => /* @__PURE__ */
|
735
|
+
exports.ButtonGroup = react.forwardRef((props, ref) => /* @__PURE__ */ React70__namespace.default.createElement(react.ButtonGroup, { ...props, ref }));
|
736
736
|
}
|
737
737
|
});
|
738
738
|
exports.IconButton = void 0;
|
@@ -740,12 +740,12 @@ var init_IconButton = __esm({
|
|
740
740
|
"src/button/IconButton.tsx"() {
|
741
741
|
init_src();
|
742
742
|
exports.IconButton = react.forwardRef(
|
743
|
-
({ ...props }, ref) => /* @__PURE__ */
|
743
|
+
({ ...props }, ref) => /* @__PURE__ */ React70__namespace.default.createElement(
|
744
744
|
react.IconButton,
|
745
745
|
{
|
746
746
|
title: props["aria-label"],
|
747
747
|
...props,
|
748
|
-
spinner: /* @__PURE__ */
|
748
|
+
spinner: /* @__PURE__ */ React70__namespace.default.createElement(exports.ColorSpinner, { width: "80%", height: "80%", marginX: 1, marginTop: 1 }),
|
749
749
|
ref
|
750
750
|
}
|
751
751
|
)
|
@@ -760,7 +760,7 @@ var init_CloseButton = __esm({
|
|
760
760
|
exports.CloseButton = react.forwardRef(
|
761
761
|
({ size: size2 = "sm", ...props }, ref) => {
|
762
762
|
const { t: t2 } = useTranslation();
|
763
|
-
return /* @__PURE__ */
|
763
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
764
764
|
exports.IconButton,
|
765
765
|
{
|
766
766
|
ref,
|
@@ -777,11 +777,11 @@ var init_CloseButton = __esm({
|
|
777
777
|
switch (size2) {
|
778
778
|
case "xs":
|
779
779
|
case "sm":
|
780
|
-
return /* @__PURE__ */
|
780
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CloseFill18Icon, null);
|
781
781
|
case "md":
|
782
|
-
return /* @__PURE__ */
|
782
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CloseFill24Icon, null);
|
783
783
|
case "lg":
|
784
|
-
return /* @__PURE__ */
|
784
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CloseFill30Icon, null);
|
785
785
|
}
|
786
786
|
};
|
787
787
|
texts4 = createTexts({
|
@@ -808,11 +808,11 @@ var init_FloatingActionButton = __esm({
|
|
808
808
|
placement = "bottom right",
|
809
809
|
...props
|
810
810
|
}, ref) => {
|
811
|
-
const [isTextVisible, setIsTextVisible] =
|
811
|
+
const [isTextVisible, setIsTextVisible] = React70__namespace.default.useState(
|
812
812
|
externalIsTextVisible !== void 0 ? externalIsTextVisible : false
|
813
813
|
);
|
814
814
|
const scrollDirection = useScrollDirection();
|
815
|
-
|
815
|
+
React70.useEffect(() => {
|
816
816
|
if (externalIsTextVisible !== void 0) {
|
817
817
|
return;
|
818
818
|
}
|
@@ -822,7 +822,7 @@ var init_FloatingActionButton = __esm({
|
|
822
822
|
);
|
823
823
|
return () => window.clearTimeout(id);
|
824
824
|
}, [scrollDirection, externalIsTextVisible]);
|
825
|
-
|
825
|
+
React70.useEffect(() => {
|
826
826
|
setIsTextVisible(!!externalIsTextVisible);
|
827
827
|
}, [externalIsTextVisible]);
|
828
828
|
const style = react.useMultiStyleConfig("FloatingActionButton", {
|
@@ -830,7 +830,7 @@ var init_FloatingActionButton = __esm({
|
|
830
830
|
isTextVisible,
|
831
831
|
placement
|
832
832
|
});
|
833
|
-
return /* @__PURE__ */
|
833
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
834
834
|
MotionBox,
|
835
835
|
{
|
836
836
|
__css: style.container,
|
@@ -838,8 +838,8 @@ var init_FloatingActionButton = __esm({
|
|
838
838
|
ref,
|
839
839
|
...props
|
840
840
|
},
|
841
|
-
/* @__PURE__ */
|
842
|
-
/* @__PURE__ */
|
841
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { __css: style.icon }, icon),
|
842
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
843
843
|
MotionBox,
|
844
844
|
{
|
845
845
|
animate: isTextVisible ? "show" : "hide",
|
@@ -864,11 +864,11 @@ var init_FloatingActionButton = __esm({
|
|
864
864
|
}
|
865
865
|
);
|
866
866
|
useScrollDirection = () => {
|
867
|
-
const [scrollDirection, setScrollDirection] =
|
868
|
-
const lastScrollPosition =
|
867
|
+
const [scrollDirection, setScrollDirection] = React70__namespace.default.useState(null);
|
868
|
+
const lastScrollPosition = React70__namespace.default.useRef(
|
869
869
|
typeof window !== "undefined" ? window.scrollY : 0
|
870
870
|
);
|
871
|
-
|
871
|
+
React70__namespace.default.useEffect(() => {
|
872
872
|
const onScroll = () => {
|
873
873
|
const delta = window.scrollY - lastScrollPosition.current;
|
874
874
|
if (delta === 0) {
|
@@ -904,7 +904,7 @@ var init_AlertIcon = __esm({
|
|
904
904
|
AlertIcon = ({ variant }) => {
|
905
905
|
const Icon = getIcon2(variant);
|
906
906
|
const { t: t2 } = useTranslation();
|
907
|
-
return /* @__PURE__ */
|
907
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
908
908
|
Icon,
|
909
909
|
{
|
910
910
|
flexShrink: 0,
|
@@ -971,7 +971,7 @@ var init_BaseAlert = __esm({
|
|
971
971
|
...boxProps
|
972
972
|
}) => {
|
973
973
|
const styles3 = react.useMultiStyleConfig("Alert", { variant });
|
974
|
-
return /* @__PURE__ */
|
974
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { __css: styles3.container, ...boxProps }, children);
|
975
975
|
};
|
976
976
|
}
|
977
977
|
});
|
@@ -998,17 +998,17 @@ var init_ClosableAlert = __esm({
|
|
998
998
|
externalOnClose();
|
999
999
|
onClose();
|
1000
1000
|
};
|
1001
|
-
return /* @__PURE__ */
|
1001
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(BaseAlert, { variant }, /* @__PURE__ */ React70__namespace.default.createElement(
|
1002
1002
|
exports.IconButton,
|
1003
1003
|
{
|
1004
1004
|
variant: "ghost",
|
1005
1005
|
size: "sm",
|
1006
1006
|
onClick: handleClose,
|
1007
|
-
icon: /* @__PURE__ */
|
1007
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CloseFill18Icon, null),
|
1008
1008
|
"aria-label": t2(texts6.close),
|
1009
1009
|
sx: styles3.closeButton
|
1010
1010
|
}
|
1011
|
-
), /* @__PURE__ */
|
1011
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(AlertIcon, { variant }), children);
|
1012
1012
|
};
|
1013
1013
|
texts6 = createTexts({
|
1014
1014
|
close: {
|
@@ -1036,7 +1036,7 @@ var init_ExpandableAlert = __esm({
|
|
1036
1036
|
...boxProps
|
1037
1037
|
}) => {
|
1038
1038
|
const styles3 = react.useMultiStyleConfig("AlertExpandable", { variant });
|
1039
|
-
return /* @__PURE__ */
|
1039
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(BaseAlert, { variant, ...boxProps, paddingX: 0, paddingY: 0 }, /* @__PURE__ */ React70__namespace.default.createElement(
|
1040
1040
|
react.Accordion,
|
1041
1041
|
{
|
1042
1042
|
onChange: (expandedIndex) => onToggle(expandedIndex === 0),
|
@@ -1044,14 +1044,14 @@ var init_ExpandableAlert = __esm({
|
|
1044
1044
|
allowToggle: true,
|
1045
1045
|
flexGrow: "1"
|
1046
1046
|
},
|
1047
|
-
/* @__PURE__ */
|
1047
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.AccordionItem, null, /* @__PURE__ */ React70__namespace.default.createElement(react.AccordionButton, { sx: styles3.container }, /* @__PURE__ */ React70__namespace.default.createElement(
|
1048
1048
|
react.Flex,
|
1049
1049
|
{
|
1050
1050
|
justifyContent: "space-between",
|
1051
1051
|
alignItems: "center",
|
1052
1052
|
flexGrow: "1"
|
1053
1053
|
},
|
1054
|
-
/* @__PURE__ */
|
1054
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { as: headingLevel, alignItems: "center" }, /* @__PURE__ */ React70__namespace.default.createElement(AlertIcon, { variant }), /* @__PURE__ */ React70__namespace.default.createElement(
|
1055
1055
|
react.Box,
|
1056
1056
|
{
|
1057
1057
|
as: "span",
|
@@ -1065,8 +1065,8 @@ var init_ExpandableAlert = __esm({
|
|
1065
1065
|
},
|
1066
1066
|
title
|
1067
1067
|
)),
|
1068
|
-
/* @__PURE__ */
|
1069
|
-
)), /* @__PURE__ */
|
1068
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.AccordionIcon, null)
|
1069
|
+
)), /* @__PURE__ */ React70__namespace.default.createElement(react.AccordionPanel, null, children))
|
1070
1070
|
));
|
1071
1071
|
};
|
1072
1072
|
}
|
@@ -1077,7 +1077,7 @@ var init_StaticAlert = __esm({
|
|
1077
1077
|
init_AlertIcon();
|
1078
1078
|
init_BaseAlert();
|
1079
1079
|
exports.StaticAlert = ({ children, ...props }) => {
|
1080
|
-
return /* @__PURE__ */
|
1080
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(BaseAlert, { ...props }, /* @__PURE__ */ React70__namespace.default.createElement(AlertIcon, { variant: props.variant }), children);
|
1081
1081
|
};
|
1082
1082
|
}
|
1083
1083
|
});
|
@@ -1095,10 +1095,10 @@ var init_Breadcrumb = __esm({
|
|
1095
1095
|
"src/breadcrumb/Breadcrumb.tsx"() {
|
1096
1096
|
exports.Breadcrumb = (props) => {
|
1097
1097
|
const iconColor = react.useColorModeValue("blackAlpha.400", "whiteAlpha.400");
|
1098
|
-
return /* @__PURE__ */
|
1098
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
1099
1099
|
react.Breadcrumb,
|
1100
1100
|
{
|
1101
|
-
separator: /* @__PURE__ */
|
1101
|
+
separator: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.DropdownRightFill18Icon, { color: iconColor }),
|
1102
1102
|
...props
|
1103
1103
|
}
|
1104
1104
|
);
|
@@ -1123,7 +1123,7 @@ var init_Card = __esm({
|
|
1123
1123
|
colorScheme,
|
1124
1124
|
size: size2
|
1125
1125
|
});
|
1126
|
-
return /* @__PURE__ */
|
1126
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.chakra.div, { sx: styles3, ...props, ref }, children);
|
1127
1127
|
}
|
1128
1128
|
);
|
1129
1129
|
}
|
@@ -1133,22 +1133,7 @@ var init_StaticCard = __esm({
|
|
1133
1133
|
"src/card/StaticCard.tsx"() {
|
1134
1134
|
exports.StaticCard = ({ colorScheme, ...props }) => {
|
1135
1135
|
const styles3 = react.useStyleConfig("StaticCard", { colorScheme });
|
1136
|
-
return /* @__PURE__ */
|
1137
|
-
};
|
1138
|
-
}
|
1139
|
-
});
|
1140
|
-
exports.PressableCard = void 0;
|
1141
|
-
var init_PressableCard = __esm({
|
1142
|
-
"src/card/PressableCard.tsx"() {
|
1143
|
-
exports.PressableCard = ({
|
1144
|
-
children,
|
1145
|
-
as = "button",
|
1146
|
-
size: size2 = "sm",
|
1147
|
-
variant = "base",
|
1148
|
-
...props
|
1149
|
-
}) => {
|
1150
|
-
const styles3 = react.useStyleConfig("PressableCard", { variant, size: size2 });
|
1151
|
-
return /* @__PURE__ */ React71__namespace.default.createElement(react.Box, { as, __css: styles3, ...props }, children);
|
1136
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { __css: styles3, ...props });
|
1152
1137
|
};
|
1153
1138
|
}
|
1154
1139
|
});
|
@@ -1158,7 +1143,6 @@ var init_card = __esm({
|
|
1158
1143
|
"src/card/index.tsx"() {
|
1159
1144
|
init_Card();
|
1160
1145
|
init_StaticCard();
|
1161
|
-
init_PressableCard();
|
1162
1146
|
}
|
1163
1147
|
});
|
1164
1148
|
exports.Badge = void 0;
|
@@ -1166,7 +1150,7 @@ var init_Badge = __esm({
|
|
1166
1150
|
"src/typography/Badge.tsx"() {
|
1167
1151
|
exports.Badge = react.forwardRef(
|
1168
1152
|
({ icon, colorScheme = "grey", children, ...props }, ref) => {
|
1169
|
-
return /* @__PURE__ */
|
1153
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
1170
1154
|
react.Badge,
|
1171
1155
|
{
|
1172
1156
|
colorScheme,
|
@@ -1174,7 +1158,7 @@ var init_Badge = __esm({
|
|
1174
1158
|
paddingLeft: icon ? 1 : void 0,
|
1175
1159
|
ref
|
1176
1160
|
},
|
1177
|
-
icon &&
|
1161
|
+
icon && React70__namespace.default.cloneElement(icon, { marginRight: 1 }),
|
1178
1162
|
children
|
1179
1163
|
);
|
1180
1164
|
}
|
@@ -1184,7 +1168,7 @@ var init_Badge = __esm({
|
|
1184
1168
|
exports.Code = void 0;
|
1185
1169
|
var init_Code = __esm({
|
1186
1170
|
"src/typography/Code.tsx"() {
|
1187
|
-
exports.Code = react.forwardRef((props, ref) => /* @__PURE__ */
|
1171
|
+
exports.Code = react.forwardRef((props, ref) => /* @__PURE__ */ React70__namespace.default.createElement(react.Code, { ...props, ref }));
|
1188
1172
|
}
|
1189
1173
|
});
|
1190
1174
|
exports.Heading = void 0;
|
@@ -1200,7 +1184,7 @@ var init_Heading = __esm({
|
|
1200
1184
|
}) => {
|
1201
1185
|
const id = externalId ?? (autoId && typeof props.children === "string") ? slugify(props.children) : void 0;
|
1202
1186
|
const color2 = react.useColorModeValue("text.primary.light", "text.primary.dark");
|
1203
|
-
return /* @__PURE__ */
|
1187
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Text, { as, textStyle: variant, id, color: color2, ...props });
|
1204
1188
|
};
|
1205
1189
|
}
|
1206
1190
|
});
|
@@ -1209,7 +1193,7 @@ var init_Text = __esm({
|
|
1209
1193
|
"src/typography/Text.tsx"() {
|
1210
1194
|
exports.Text = react.forwardRef(
|
1211
1195
|
({ variant = "sm", ...props }, ref) => {
|
1212
|
-
return /* @__PURE__ */
|
1196
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Text, { ...props, textStyle: variant, ref });
|
1213
1197
|
}
|
1214
1198
|
);
|
1215
1199
|
}
|
@@ -1230,7 +1214,7 @@ function CalendarCell({
|
|
1230
1214
|
currentMonth,
|
1231
1215
|
variant
|
1232
1216
|
}) {
|
1233
|
-
const ref =
|
1217
|
+
const ref = React70.useRef(null);
|
1234
1218
|
const {
|
1235
1219
|
cellProps,
|
1236
1220
|
buttonProps,
|
@@ -1254,7 +1238,7 @@ function CalendarCell({
|
|
1254
1238
|
if (isOutsideMonth) {
|
1255
1239
|
stateProps["data-unavailable"] = true;
|
1256
1240
|
}
|
1257
|
-
|
1241
|
+
React70.useEffect(() => {
|
1258
1242
|
var _a6;
|
1259
1243
|
(_a6 = ref == null ? void 0 : ref.current) == null ? void 0 : _a6.addEventListener(
|
1260
1244
|
"touchend",
|
@@ -1264,7 +1248,7 @@ function CalendarCell({
|
|
1264
1248
|
{ passive: false, once: true }
|
1265
1249
|
);
|
1266
1250
|
}, []);
|
1267
|
-
return /* @__PURE__ */
|
1251
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
1268
1252
|
react.Box,
|
1269
1253
|
{
|
1270
1254
|
as: "td",
|
@@ -1287,7 +1271,7 @@ function CalendarCell({
|
|
1287
1271
|
}
|
1288
1272
|
}
|
1289
1273
|
},
|
1290
|
-
/* @__PURE__ */
|
1274
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
1291
1275
|
react.Box,
|
1292
1276
|
{
|
1293
1277
|
as: "button",
|
@@ -1354,8 +1338,8 @@ function CalendarGrid({
|
|
1354
1338
|
const weeksInMonth = date.getWeeksInMonth(state2.visibleRange.start, locale);
|
1355
1339
|
const weeksInMonthRange = new Array(weeksInMonth).fill(0).map((_, i) => i);
|
1356
1340
|
const styles3 = react.useMultiStyleConfig("Datepicker", { variant });
|
1357
|
-
return /* @__PURE__ */
|
1358
|
-
return /* @__PURE__ */
|
1341
|
+
return /* @__PURE__ */ React70__namespace.default.createElement("table", { ...gridProps }, /* @__PURE__ */ React70__namespace.default.createElement("thead", { ...headerProps }, /* @__PURE__ */ React70__namespace.default.createElement("tr", null, weekDays[language].map((day, index) => {
|
1342
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
1359
1343
|
exports.Text,
|
1360
1344
|
{
|
1361
1345
|
as: "th",
|
@@ -1365,8 +1349,8 @@ function CalendarGrid({
|
|
1365
1349
|
},
|
1366
1350
|
day
|
1367
1351
|
);
|
1368
|
-
}))), /* @__PURE__ */
|
1369
|
-
(date, dayIndex) => date ? /* @__PURE__ */
|
1352
|
+
}))), /* @__PURE__ */ React70__namespace.default.createElement("tbody", null, weeksInMonthRange.map((weekIndex) => /* @__PURE__ */ React70__namespace.default.createElement("tr", { key: weekIndex }, state2.getDatesInWeek(weekIndex, startDate).map(
|
1353
|
+
(date, dayIndex) => date ? /* @__PURE__ */ React70__namespace.default.createElement(
|
1370
1354
|
CalendarCell,
|
1371
1355
|
{
|
1372
1356
|
variant,
|
@@ -1375,7 +1359,7 @@ function CalendarGrid({
|
|
1375
1359
|
date,
|
1376
1360
|
currentMonth: startDate
|
1377
1361
|
}
|
1378
|
-
) : /* @__PURE__ */
|
1362
|
+
) : /* @__PURE__ */ React70__namespace.default.createElement("td", { key: dayIndex })
|
1379
1363
|
)))));
|
1380
1364
|
}
|
1381
1365
|
var weekDays;
|
@@ -1398,9 +1382,9 @@ function CalendarNavigationButton({
|
|
1398
1382
|
"aria-label": ariaLabel,
|
1399
1383
|
...rest
|
1400
1384
|
}) {
|
1401
|
-
const ref =
|
1385
|
+
const ref = React70.useRef(null);
|
1402
1386
|
const { buttonProps } = reactAria.useButton(rest, ref);
|
1403
|
-
return /* @__PURE__ */
|
1387
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
1404
1388
|
exports.IconButton,
|
1405
1389
|
{
|
1406
1390
|
...buttonProps,
|
@@ -1437,7 +1421,7 @@ function CalendarHeader({
|
|
1437
1421
|
);
|
1438
1422
|
const areAllOtherYearsDisabled = isPreviousYearDisabled && isNextYearDisabled;
|
1439
1423
|
const isYearPickerVisible = showYearNavigation && !areAllOtherYearsDisabled;
|
1440
|
-
return /* @__PURE__ */
|
1424
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { alignItems: "center", paddingBottom: "4", justifyContent: "space-between" }, /* @__PURE__ */ React70__namespace.default.createElement(
|
1441
1425
|
CalendarNavigator,
|
1442
1426
|
{
|
1443
1427
|
title: title ? title : isYearPickerVisible ? monthTitle : monthAndYearTitle,
|
@@ -1447,7 +1431,7 @@ function CalendarHeader({
|
|
1447
1431
|
isNextDisabled: !state2.isPreviousVisibleRangeInvalid,
|
1448
1432
|
isPreviousDisabled: !state2.isNextVisibleRangeInvalid
|
1449
1433
|
}
|
1450
|
-
), isYearPickerVisible && /* @__PURE__ */
|
1434
|
+
), isYearPickerVisible && /* @__PURE__ */ React70__namespace.default.createElement(
|
1451
1435
|
CalendarNavigator,
|
1452
1436
|
{
|
1453
1437
|
title: jsDate.getFullYear().toString(),
|
@@ -1476,15 +1460,15 @@ var init_CalendarHeader = __esm({
|
|
1476
1460
|
isNextDisabled
|
1477
1461
|
}) => {
|
1478
1462
|
const { t: t2 } = useTranslation();
|
1479
|
-
return /* @__PURE__ */
|
1463
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { alignItems: "center", flexGrow: 1 }, /* @__PURE__ */ React70__namespace.default.createElement(
|
1480
1464
|
CalendarNavigationButton,
|
1481
1465
|
{
|
1482
1466
|
onPress: onPrevious,
|
1483
1467
|
isDisabled: isPreviousDisabled,
|
1484
|
-
icon: /* @__PURE__ */
|
1468
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.ArrowLeftOutline24Icon, null),
|
1485
1469
|
"aria-label": `${t2(texts7.previous)} ${t2(texts7[unit])}`
|
1486
1470
|
}
|
1487
|
-
), /* @__PURE__ */
|
1471
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
1488
1472
|
exports.Heading,
|
1489
1473
|
{
|
1490
1474
|
as: "div",
|
@@ -1495,12 +1479,12 @@ var init_CalendarHeader = __esm({
|
|
1495
1479
|
textAlign: "center"
|
1496
1480
|
},
|
1497
1481
|
capitalize(title)
|
1498
|
-
), /* @__PURE__ */
|
1482
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
1499
1483
|
CalendarNavigationButton,
|
1500
1484
|
{
|
1501
1485
|
onPress: onNext,
|
1502
1486
|
isDisabled: isNextDisabled,
|
1503
|
-
icon: /* @__PURE__ */
|
1487
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.ArrowRightOutline24Icon, null),
|
1504
1488
|
"aria-label": `${t2(texts7.next)} ${t2(texts7[unit])}`
|
1505
1489
|
}
|
1506
1490
|
));
|
@@ -1548,7 +1532,7 @@ function Calendar({
|
|
1548
1532
|
const { calendarProps } = reactAria.useCalendar(props, state2);
|
1549
1533
|
const calendarAriaLabel = calendarProps["aria-label"];
|
1550
1534
|
const ariaLabel = t2(texts8.calendar) + (calendarAriaLabel ? ` ${calendarAriaLabel}` : "");
|
1551
|
-
return /* @__PURE__ */
|
1535
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...calendarProps, "aria-label": ariaLabel }, /* @__PURE__ */ React70__namespace.default.createElement(CalendarHeader, { state: state2, showYearNavigation }), /* @__PURE__ */ React70__namespace.default.createElement(CalendarGrid, { variant, state: state2 }));
|
1552
1536
|
}
|
1553
1537
|
var texts8;
|
1554
1538
|
var init_Calendar = __esm({
|
@@ -1582,7 +1566,7 @@ var init_CalendarTriggerButton = __esm({
|
|
1582
1566
|
onPress(event);
|
1583
1567
|
}
|
1584
1568
|
};
|
1585
|
-
return /* @__PURE__ */
|
1569
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverAnchor, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
1586
1570
|
react.Box,
|
1587
1571
|
{
|
1588
1572
|
ref,
|
@@ -1593,7 +1577,7 @@ var init_CalendarTriggerButton = __esm({
|
|
1593
1577
|
...filteredButtonProps,
|
1594
1578
|
onKeyUp: handleOnPress
|
1595
1579
|
},
|
1596
|
-
/* @__PURE__ */
|
1580
|
+
/* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CalendarOutline24Icon, null)
|
1597
1581
|
));
|
1598
1582
|
}
|
1599
1583
|
);
|
@@ -1610,9 +1594,9 @@ var init_CalendarTriggerButton = __esm({
|
|
1610
1594
|
var DateTimeSegment, isPaddable;
|
1611
1595
|
var init_DateTimeSegment = __esm({
|
1612
1596
|
"src/datepicker/DateTimeSegment.tsx"() {
|
1613
|
-
DateTimeSegment =
|
1597
|
+
DateTimeSegment = React70.forwardRef(
|
1614
1598
|
({ segment, state: state2 }, externalRef) => {
|
1615
|
-
const internalRef =
|
1599
|
+
const internalRef = React70.useRef(null);
|
1616
1600
|
const ref = externalRef ?? internalRef;
|
1617
1601
|
const { segmentProps } = reactAria.useDateSegment(
|
1618
1602
|
segment,
|
@@ -1623,7 +1607,7 @@ var init_DateTimeSegment = __esm({
|
|
1623
1607
|
isPlaceholder: segment.isPlaceholder,
|
1624
1608
|
isEditable: segment.isEditable
|
1625
1609
|
});
|
1626
|
-
return /* @__PURE__ */
|
1610
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
1627
1611
|
react.Box,
|
1628
1612
|
{
|
1629
1613
|
...segmentProps,
|
@@ -1662,7 +1646,7 @@ var init_DateField = __esm({
|
|
1662
1646
|
"src/datepicker/DateField.tsx"() {
|
1663
1647
|
init_DateTimeSegment();
|
1664
1648
|
init_utils();
|
1665
|
-
DateField =
|
1649
|
+
DateField = React70.forwardRef(
|
1666
1650
|
(props, externalRef) => {
|
1667
1651
|
var _a6;
|
1668
1652
|
const locale = useCurrentLocale();
|
@@ -1672,14 +1656,14 @@ var init_DateField = __esm({
|
|
1672
1656
|
locale,
|
1673
1657
|
createCalendar: createCalendar2
|
1674
1658
|
});
|
1675
|
-
const internalRef =
|
1659
|
+
const internalRef = React70.useRef(null);
|
1676
1660
|
const ref = externalRef ?? internalRef;
|
1677
1661
|
const { fieldProps, labelProps } = reactAria.useDateField(
|
1678
1662
|
props,
|
1679
1663
|
state2,
|
1680
1664
|
ref
|
1681
1665
|
);
|
1682
|
-
return /* @__PURE__ */
|
1666
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { minWidth: "6rem", width: "100%" }, props.label && /* @__PURE__ */ React70__namespace.default.createElement(
|
1683
1667
|
react.FormLabel,
|
1684
1668
|
{
|
1685
1669
|
...props.labelProps,
|
@@ -1689,7 +1673,7 @@ var init_DateField = __esm({
|
|
1689
1673
|
paddingTop: "2px"
|
1690
1674
|
},
|
1691
1675
|
props.label
|
1692
|
-
), /* @__PURE__ */
|
1676
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { ...fieldProps, ref, paddingTop: "3", paddingBottom: "0.5" }, state2.segments.map((segment, i) => /* @__PURE__ */ React70__namespace.default.createElement(DateTimeSegment, { key: i, segment, state: state2 }))), /* @__PURE__ */ React70__namespace.default.createElement(
|
1693
1677
|
"input",
|
1694
1678
|
{
|
1695
1679
|
type: "hidden",
|
@@ -1710,7 +1694,7 @@ var init_StyledField = __esm({
|
|
1710
1694
|
isInvalid: false
|
1711
1695
|
};
|
1712
1696
|
const styles3 = react.useMultiStyleConfig("Datepicker", { variant });
|
1713
|
-
return /* @__PURE__ */
|
1697
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
1714
1698
|
react.Box,
|
1715
1699
|
{
|
1716
1700
|
...otherProps,
|
@@ -1733,7 +1717,7 @@ var init_DatePicker = __esm({
|
|
1733
1717
|
init_DateField();
|
1734
1718
|
init_StyledField();
|
1735
1719
|
init_utils();
|
1736
|
-
exports.DatePicker =
|
1720
|
+
exports.DatePicker = React70.forwardRef(
|
1737
1721
|
({
|
1738
1722
|
variant,
|
1739
1723
|
errorMessage,
|
@@ -1751,7 +1735,7 @@ var init_DatePicker = __esm({
|
|
1751
1735
|
isRequired: props.isRequired ?? (formControlProps == null ? void 0 : formControlProps.isRequired),
|
1752
1736
|
validationState: (formControlProps == null ? void 0 : formControlProps.isInvalid) ? "invalid" : "valid"
|
1753
1737
|
});
|
1754
|
-
const internalRef =
|
1738
|
+
const internalRef = React70.useRef(null);
|
1755
1739
|
const ref = externalRef ?? internalRef;
|
1756
1740
|
const {
|
1757
1741
|
groupProps,
|
@@ -1771,7 +1755,7 @@ var init_DatePicker = __esm({
|
|
1771
1755
|
const onFieldClick = () => {
|
1772
1756
|
state2.setOpen(true);
|
1773
1757
|
};
|
1774
|
-
const popoverContent = /* @__PURE__ */
|
1758
|
+
const popoverContent = /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverContent, { color: "darkGrey", sx: styles3.calendarPopover }, /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverArrow, { sx: styles3.arrow }), /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverBody, null, /* @__PURE__ */ React70__namespace.default.createElement(react.FocusLock, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
1775
1759
|
Calendar,
|
1776
1760
|
{
|
1777
1761
|
...calendarProps,
|
@@ -1779,7 +1763,7 @@ var init_DatePicker = __esm({
|
|
1779
1763
|
showYearNavigation
|
1780
1764
|
}
|
1781
1765
|
))));
|
1782
|
-
return /* @__PURE__ */
|
1766
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(reactAria.I18nProvider, { locale }, /* @__PURE__ */ React70__namespace.default.createElement(
|
1783
1767
|
react.Box,
|
1784
1768
|
{
|
1785
1769
|
position: "relative",
|
@@ -1787,7 +1771,7 @@ var init_DatePicker = __esm({
|
|
1787
1771
|
flexDirection: "column",
|
1788
1772
|
width
|
1789
1773
|
},
|
1790
|
-
/* @__PURE__ */
|
1774
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
1791
1775
|
react.Popover,
|
1792
1776
|
{
|
1793
1777
|
...dialogProps,
|
@@ -1796,7 +1780,7 @@ var init_DatePicker = __esm({
|
|
1796
1780
|
onClose: state2.close,
|
1797
1781
|
flip: false
|
1798
1782
|
},
|
1799
|
-
/* @__PURE__ */
|
1783
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.InputGroup, { ...groupProps, display: "inline-flex" }, /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverAnchor, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
1800
1784
|
StyledField,
|
1801
1785
|
{
|
1802
1786
|
variant,
|
@@ -1804,7 +1788,7 @@ var init_DatePicker = __esm({
|
|
1804
1788
|
paddingX: 3,
|
1805
1789
|
minHeight
|
1806
1790
|
},
|
1807
|
-
/* @__PURE__ */
|
1791
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.PopoverTrigger, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
1808
1792
|
CalendarTriggerButton,
|
1809
1793
|
{
|
1810
1794
|
variant,
|
@@ -1812,7 +1796,7 @@ var init_DatePicker = __esm({
|
|
1812
1796
|
...buttonProps
|
1813
1797
|
}
|
1814
1798
|
)),
|
1815
|
-
/* @__PURE__ */
|
1799
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
1816
1800
|
DateField,
|
1817
1801
|
{
|
1818
1802
|
label: props.label,
|
@@ -1822,8 +1806,8 @@ var init_DatePicker = __esm({
|
|
1822
1806
|
}
|
1823
1807
|
)
|
1824
1808
|
))),
|
1825
|
-
/* @__PURE__ */
|
1826
|
-
state2.isOpen && !props.isDisabled && withPortal && /* @__PURE__ */
|
1809
|
+
/* @__PURE__ */ React70__namespace.default.createElement(exports.FormErrorMessage, { ...errorMessageProps }, errorMessage),
|
1810
|
+
state2.isOpen && !props.isDisabled && withPortal && /* @__PURE__ */ React70__namespace.default.createElement(react.Portal, null, popoverContent),
|
1827
1811
|
state2.isOpen && !props.isDisabled && !withPortal && popoverContent
|
1828
1812
|
)
|
1829
1813
|
));
|
@@ -1839,9 +1823,9 @@ function RangeCalendar(props) {
|
|
1839
1823
|
locale,
|
1840
1824
|
createCalendar: date.createCalendar
|
1841
1825
|
});
|
1842
|
-
const ref =
|
1826
|
+
const ref = React70.useRef(null);
|
1843
1827
|
const { calendarProps, title } = reactAria.useRangeCalendar(props, state2, ref);
|
1844
|
-
return /* @__PURE__ */
|
1828
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...calendarProps, ref }, /* @__PURE__ */ React70__namespace.default.createElement(CalendarHeader, { state: state2, title }), /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { display: "flex", gap: "8" }, /* @__PURE__ */ React70__namespace.default.createElement(CalendarGrid, { variant: props.variant, state: state2 }), /* @__PURE__ */ React70__namespace.default.createElement(
|
1845
1829
|
CalendarGrid,
|
1846
1830
|
{
|
1847
1831
|
variant: props.variant,
|
@@ -1872,7 +1856,7 @@ function DateRangePicker({
|
|
1872
1856
|
isRequired: props.isRequired ?? (formControlProps == null ? void 0 : formControlProps.isRequired),
|
1873
1857
|
validationState: formControlProps.isInvalid ? "invalid" : "valid"
|
1874
1858
|
});
|
1875
|
-
const ref =
|
1859
|
+
const ref = React70.useRef(null);
|
1876
1860
|
const {
|
1877
1861
|
groupProps,
|
1878
1862
|
labelProps,
|
@@ -1893,8 +1877,8 @@ function DateRangePicker({
|
|
1893
1877
|
const onFieldClick = () => {
|
1894
1878
|
state2.setOpen(true);
|
1895
1879
|
};
|
1896
|
-
const popoverContent = /* @__PURE__ */
|
1897
|
-
return /* @__PURE__ */
|
1880
|
+
const popoverContent = /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverContent, { sx: styles3.calendarPopover, maxWidth: "none" }, /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverArrow, { sx: styles3.arrow }), /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverBody, null, /* @__PURE__ */ React70__namespace.default.createElement(react.FocusLock, null, /* @__PURE__ */ React70__namespace.default.createElement(RangeCalendar, { variant: "base", ...calendarProps }))));
|
1881
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(reactAria.I18nProvider, { locale }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { position: "relative", display: "inline-flex", flexDirection: "column" }, props.label && /* @__PURE__ */ React70__namespace.default.createElement(react.FormLabel, { ...labelProps, sx: styles3.inputLabel }, props.label), /* @__PURE__ */ React70__namespace.default.createElement(
|
1898
1882
|
react.Popover,
|
1899
1883
|
{
|
1900
1884
|
...dialogProps,
|
@@ -1903,7 +1887,7 @@ function DateRangePicker({
|
|
1903
1887
|
onClose: state2.close,
|
1904
1888
|
flip: false
|
1905
1889
|
},
|
1906
|
-
/* @__PURE__ */
|
1890
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.InputGroup, { ...groupProps, width: "auto", display: "inline-flex" }, /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverAnchor, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
1907
1891
|
StyledField,
|
1908
1892
|
{
|
1909
1893
|
alignItems: "center",
|
@@ -1913,7 +1897,7 @@ function DateRangePicker({
|
|
1913
1897
|
onKeyPress: handleEnterClick,
|
1914
1898
|
minHeight
|
1915
1899
|
},
|
1916
|
-
variant && /* @__PURE__ */
|
1900
|
+
variant && /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverTrigger, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
1917
1901
|
CalendarTriggerButton,
|
1918
1902
|
{
|
1919
1903
|
paddingLeft: 1,
|
@@ -1923,7 +1907,7 @@ function DateRangePicker({
|
|
1923
1907
|
...buttonProps
|
1924
1908
|
}
|
1925
1909
|
)),
|
1926
|
-
/* @__PURE__ */
|
1910
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
1927
1911
|
DateField,
|
1928
1912
|
{
|
1929
1913
|
...startFieldProps,
|
@@ -1932,8 +1916,8 @@ function DateRangePicker({
|
|
1932
1916
|
labelProps
|
1933
1917
|
}
|
1934
1918
|
),
|
1935
|
-
/* @__PURE__ */
|
1936
|
-
/* @__PURE__ */
|
1919
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: "span", "aria-hidden": "true", paddingRight: "2" }, "\u2013"),
|
1920
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
1937
1921
|
DateField,
|
1938
1922
|
{
|
1939
1923
|
...endFieldProps,
|
@@ -1943,7 +1927,7 @@ function DateRangePicker({
|
|
1943
1927
|
}
|
1944
1928
|
)
|
1945
1929
|
))),
|
1946
|
-
state2.isOpen && withPortal && /* @__PURE__ */
|
1930
|
+
state2.isOpen && withPortal && /* @__PURE__ */ React70__namespace.default.createElement(react.Portal, null, popoverContent),
|
1947
1931
|
state2.isOpen && !withPortal && popoverContent
|
1948
1932
|
)));
|
1949
1933
|
}
|
@@ -1963,9 +1947,9 @@ var init_TimeField = __esm({
|
|
1963
1947
|
init_DateTimeSegment();
|
1964
1948
|
init_utils();
|
1965
1949
|
TimeField = ({ state: state2, ...props }) => {
|
1966
|
-
const ref =
|
1950
|
+
const ref = React70.useRef(null);
|
1967
1951
|
const { labelProps, fieldProps } = reactAria.useTimeField(props, state2, ref);
|
1968
|
-
return /* @__PURE__ */
|
1952
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
1969
1953
|
exports.FormLabel,
|
1970
1954
|
{
|
1971
1955
|
...labelProps,
|
@@ -1977,7 +1961,7 @@ var init_TimeField = __esm({
|
|
1977
1961
|
paddingTop: "2px"
|
1978
1962
|
},
|
1979
1963
|
props.label
|
1980
|
-
), /* @__PURE__ */
|
1964
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { ...fieldProps, ref, paddingTop: "3", paddingBottom: "0.5" }, state2.segments.map((segment) => /* @__PURE__ */ React70__namespace.default.createElement(DateTimeSegment, { key: segment.type, segment, state: state2 }))), /* @__PURE__ */ React70__namespace.default.createElement(
|
1981
1965
|
"input",
|
1982
1966
|
{
|
1983
1967
|
type: "hidden",
|
@@ -2053,7 +2037,7 @@ var init_TimePicker = __esm({
|
|
2053
2037
|
const ariaLabel = `${inputLabel} \u2013 ${t2(
|
2054
2038
|
texts10.selectedTimeIs(`${(dateTime == null ? void 0 : dateTime.hour) ?? 0} ${(dateTime == null ? void 0 : dateTime.minute) ?? 0}`)
|
2055
2039
|
)}`;
|
2056
|
-
return /* @__PURE__ */
|
2040
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
2057
2041
|
StyledField,
|
2058
2042
|
{
|
2059
2043
|
variant: "base",
|
@@ -2069,7 +2053,7 @@ var init_TimePicker = __esm({
|
|
2069
2053
|
"aria-label": ariaLabel,
|
2070
2054
|
...boxProps
|
2071
2055
|
},
|
2072
|
-
/* @__PURE__ */
|
2056
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
2073
2057
|
exports.IconButton,
|
2074
2058
|
{
|
2075
2059
|
variant: "ghost",
|
@@ -2077,14 +2061,14 @@ var init_TimePicker = __esm({
|
|
2077
2061
|
borderRadius: "xs",
|
2078
2062
|
"aria-label": backwardsLabel,
|
2079
2063
|
title: backwardsLabel,
|
2080
|
-
icon: /* @__PURE__ */
|
2064
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.DropdownLeftFill18Icon, null),
|
2081
2065
|
onClick: handleBackwardsClick,
|
2082
2066
|
isDisabled,
|
2083
2067
|
style: isDisabled ? { backgroundColor: "transparent" } : {}
|
2084
2068
|
}
|
2085
2069
|
),
|
2086
|
-
/* @__PURE__ */
|
2087
|
-
/* @__PURE__ */
|
2070
|
+
/* @__PURE__ */ React70__namespace.default.createElement(TimeField, { label, state: state2, name }),
|
2071
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
2088
2072
|
exports.IconButton,
|
2089
2073
|
{
|
2090
2074
|
variant: "ghost",
|
@@ -2092,7 +2076,7 @@ var init_TimePicker = __esm({
|
|
2092
2076
|
borderRadius: "xs",
|
2093
2077
|
"aria-label": forwardsLabel,
|
2094
2078
|
title: forwardsLabel,
|
2095
|
-
icon: /* @__PURE__ */
|
2079
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.DropdownRightFill18Icon, null),
|
2096
2080
|
onClick: handleForwardClick,
|
2097
2081
|
isDisabled,
|
2098
2082
|
style: isDisabled ? { backgroundColor: "transparent" } : {}
|
@@ -2178,7 +2162,7 @@ var init_AttachedInputs = __esm({
|
|
2178
2162
|
}
|
2179
2163
|
};
|
2180
2164
|
const direction2 = flexDirection === "row" ? "horizontal" : "vertical";
|
2181
|
-
return /* @__PURE__ */
|
2165
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
2182
2166
|
react.Flex,
|
2183
2167
|
{
|
2184
2168
|
role: "group",
|
@@ -2195,16 +2179,16 @@ var Dialog;
|
|
2195
2179
|
var init_Dialog = __esm({
|
2196
2180
|
"src/input/Dialog.tsx"() {
|
2197
2181
|
Dialog = ({ title, children, ...props }) => {
|
2198
|
-
const ref =
|
2182
|
+
const ref = React70.useRef(null);
|
2199
2183
|
const { dialogProps, titleProps } = reactAria.useDialog(props, ref);
|
2200
|
-
return /* @__PURE__ */
|
2184
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...dialogProps, ref, outline: "none" }, title && /* @__PURE__ */ React70__namespace.default.createElement(react.Heading, { as: "h3", ...titleProps }, title), children);
|
2201
2185
|
};
|
2202
2186
|
}
|
2203
2187
|
});
|
2204
2188
|
var Popover3;
|
2205
2189
|
var init_Popover = __esm({
|
2206
2190
|
"src/input/Popover.tsx"() {
|
2207
|
-
Popover3 =
|
2191
|
+
Popover3 = React70.forwardRef(
|
2208
2192
|
({
|
2209
2193
|
children,
|
2210
2194
|
state: state2,
|
@@ -2218,7 +2202,7 @@ var init_Popover = __esm({
|
|
2218
2202
|
containerPadding = 12
|
2219
2203
|
}, ref) => {
|
2220
2204
|
var _a6;
|
2221
|
-
const internalRef =
|
2205
|
+
const internalRef = React70.useRef(null);
|
2222
2206
|
const popoverRef = ref ?? internalRef;
|
2223
2207
|
const { popoverProps, underlayProps } = reactAria.usePopover(
|
2224
2208
|
{
|
@@ -2233,28 +2217,28 @@ var init_Popover = __esm({
|
|
2233
2217
|
},
|
2234
2218
|
state2
|
2235
2219
|
);
|
2236
|
-
const popoverBox = /* @__PURE__ */
|
2220
|
+
const popoverBox = /* @__PURE__ */ React70__namespace.default.createElement(
|
2237
2221
|
react.Box,
|
2238
2222
|
{
|
2239
2223
|
...popoverProps,
|
2240
2224
|
ref: popoverRef,
|
2241
2225
|
minWidth: ((_a6 = triggerRef.current) == null ? void 0 : _a6.clientWidth) ?? "auto"
|
2242
2226
|
},
|
2243
|
-
/* @__PURE__ */
|
2227
|
+
/* @__PURE__ */ React70__namespace.default.createElement(reactAria.DismissButton, { onDismiss: state2.close }),
|
2244
2228
|
children,
|
2245
|
-
/* @__PURE__ */
|
2229
|
+
/* @__PURE__ */ React70__namespace.default.createElement(reactAria.DismissButton, { onDismiss: state2.close })
|
2246
2230
|
);
|
2247
2231
|
if (isNonModal) {
|
2248
2232
|
return popoverBox;
|
2249
2233
|
}
|
2250
|
-
return /* @__PURE__ */
|
2234
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(reactAria.Overlay, null, hasBackdrop && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...underlayProps, position: "fixed", inset: "0" }), popoverBox);
|
2251
2235
|
}
|
2252
2236
|
);
|
2253
2237
|
}
|
2254
2238
|
});
|
2255
2239
|
function useForceRerender(shouldRerender) {
|
2256
|
-
const [_, update] =
|
2257
|
-
|
2240
|
+
const [_, update] = React70.useState(false);
|
2241
|
+
React70.useEffect(() => {
|
2258
2242
|
if (shouldRerender) {
|
2259
2243
|
update((x) => !x);
|
2260
2244
|
}
|
@@ -2283,7 +2267,7 @@ var init_CardSelect = __esm({
|
|
2283
2267
|
...props
|
2284
2268
|
}, externalRef) => {
|
2285
2269
|
const label = "label" in props ? props.label : props["aria-label"];
|
2286
|
-
const internalRef =
|
2270
|
+
const internalRef = React70.useRef(null);
|
2287
2271
|
const triggerRef = externalRef ?? internalRef;
|
2288
2272
|
const state2 = reactStately.useOverlayTriggerState({
|
2289
2273
|
isOpen: externalIsOpen,
|
@@ -2302,7 +2286,7 @@ var init_CardSelect = __esm({
|
|
2302
2286
|
});
|
2303
2287
|
useForceRerender(state2.isOpen);
|
2304
2288
|
const ChevronIcon = size2 === "sm" ? sporIconReact.DropdownDownFill18Icon : sporIconReact.DropdownDownFill24Icon;
|
2305
|
-
return /* @__PURE__ */
|
2289
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...props }, /* @__PURE__ */ React70__namespace.default.createElement(
|
2306
2290
|
react.chakra.button,
|
2307
2291
|
{
|
2308
2292
|
type: "button",
|
@@ -2314,13 +2298,13 @@ var init_CardSelect = __esm({
|
|
2314
2298
|
width,
|
2315
2299
|
"data-attachable": true
|
2316
2300
|
},
|
2317
|
-
/* @__PURE__ */
|
2301
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { gap: 1.5, alignItems: "center" }, icon, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: "span", display: props["aria-label"] ? "none" : "inline" }, label), withChevron ? /* @__PURE__ */ React70__namespace.default.createElement(
|
2318
2302
|
ChevronIcon,
|
2319
2303
|
{
|
2320
2304
|
transform: state2.isOpen ? "rotate(180deg)" : "none"
|
2321
2305
|
}
|
2322
2306
|
) : null)
|
2323
|
-
), state2.isOpen && /* @__PURE__ */
|
2307
|
+
), state2.isOpen && /* @__PURE__ */ React70__namespace.default.createElement(
|
2324
2308
|
Popover3,
|
2325
2309
|
{
|
2326
2310
|
state: state2,
|
@@ -2329,7 +2313,7 @@ var init_CardSelect = __esm({
|
|
2329
2313
|
crossOffset,
|
2330
2314
|
placement
|
2331
2315
|
},
|
2332
|
-
/* @__PURE__ */
|
2316
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
2333
2317
|
exports.Card,
|
2334
2318
|
{
|
2335
2319
|
colorScheme: "white",
|
@@ -2337,7 +2321,7 @@ var init_CardSelect = __esm({
|
|
2337
2321
|
sx: styles3.card,
|
2338
2322
|
...overlayProps
|
2339
2323
|
},
|
2340
|
-
/* @__PURE__ */
|
2324
|
+
/* @__PURE__ */ React70__namespace.default.createElement(Dialog, { "aria-label": label }, children)
|
2341
2325
|
)
|
2342
2326
|
));
|
2343
2327
|
}
|
@@ -2348,7 +2332,7 @@ exports.Checkbox = void 0;
|
|
2348
2332
|
var init_Checkbox = __esm({
|
2349
2333
|
"src/input/Checkbox.tsx"() {
|
2350
2334
|
exports.Checkbox = react.forwardRef((props, ref) => {
|
2351
|
-
return /* @__PURE__ */
|
2335
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Checkbox, { ...props, ref });
|
2352
2336
|
});
|
2353
2337
|
}
|
2354
2338
|
});
|
@@ -2360,7 +2344,7 @@ var init_CheckboxGroup = __esm({
|
|
2360
2344
|
children,
|
2361
2345
|
...props
|
2362
2346
|
}) => {
|
2363
|
-
return /* @__PURE__ */
|
2347
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.CheckboxGroup, { ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.Stack, { direction: direction2 }, children));
|
2364
2348
|
};
|
2365
2349
|
}
|
2366
2350
|
});
|
@@ -3141,16 +3125,16 @@ var init_ChoiceChip = __esm({
|
|
3141
3125
|
icon,
|
3142
3126
|
hasLabel: Boolean(children)
|
3143
3127
|
});
|
3144
|
-
const id = `choice-chip-${
|
3145
|
-
return /* @__PURE__ */
|
3128
|
+
const id = `choice-chip-${React70.useId()}`;
|
3129
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
3146
3130
|
react.chakra.label,
|
3147
3131
|
{
|
3148
3132
|
htmlFor: id,
|
3149
3133
|
...getRootProps(),
|
3150
3134
|
"aria-label": String(children)
|
3151
3135
|
},
|
3152
|
-
/* @__PURE__ */
|
3153
|
-
/* @__PURE__ */
|
3136
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.chakra.input, { ...getInputProps({}, ref), id, disabled: isDisabled }),
|
3137
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
3154
3138
|
react.chakra.div,
|
3155
3139
|
{
|
3156
3140
|
...getLabelProps(),
|
@@ -3161,9 +3145,9 @@ var init_ChoiceChip = __esm({
|
|
3161
3145
|
"data-active": dataAttr(state2.isActive),
|
3162
3146
|
"data-disabled": dataAttr(state2.isDisabled)
|
3163
3147
|
},
|
3164
|
-
icon && /* @__PURE__ */
|
3165
|
-
/* @__PURE__ */
|
3166
|
-
chipType === "filter" && state2.isChecked && /* @__PURE__ */
|
3148
|
+
icon && /* @__PURE__ */ React70__namespace.default.createElement(react.chakra.span, { __css: styles3.icon }, state2.isChecked ? icon.checked : icon.default),
|
3149
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.chakra.span, { __css: styles3.label, ...getCheckboxProps() }, chipType !== "icon" && children),
|
3150
|
+
chipType === "filter" && state2.isChecked && /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CloseOutline24Icon, { marginLeft: 1.5 })
|
3167
3151
|
)
|
3168
3152
|
);
|
3169
3153
|
});
|
@@ -3196,10 +3180,10 @@ function Combobox({
|
|
3196
3180
|
...rest
|
3197
3181
|
}) {
|
3198
3182
|
const { contains: contains2 } = reactAria.useFilter({ sensitivity: "base" });
|
3199
|
-
const fallbackInputRef =
|
3183
|
+
const fallbackInputRef = React70.useRef(null);
|
3200
3184
|
const inputRef = externalInputRef ?? fallbackInputRef;
|
3201
|
-
const listBoxRef =
|
3202
|
-
const popoverRef =
|
3185
|
+
const listBoxRef = React70.useRef(null);
|
3186
|
+
const popoverRef = React70.useRef(null);
|
3203
3187
|
const inputWidth = useInputWidth(inputRef);
|
3204
3188
|
const state2 = reactStately.useComboBoxState({
|
3205
3189
|
allowsEmptyCollection: Boolean(emptyContent),
|
@@ -3237,7 +3221,7 @@ function Combobox({
|
|
3237
3221
|
},
|
3238
3222
|
state2
|
3239
3223
|
);
|
3240
|
-
return /* @__PURE__ */
|
3224
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(React70__namespace.default.Fragment, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
3241
3225
|
exports.Input,
|
3242
3226
|
{
|
3243
3227
|
...styleProps(comboBoxProps),
|
@@ -3247,7 +3231,7 @@ function Combobox({
|
|
3247
3231
|
borderBottomLeftRadius: state2.isOpen && !isLoading ? 0 : borderBottomLeftRadius,
|
3248
3232
|
borderBottomRightRadius: state2.isOpen && !isLoading ? 0 : borderBottomRightRadius,
|
3249
3233
|
...inputProps,
|
3250
|
-
rightIcon: isLoading ? /* @__PURE__ */
|
3234
|
+
rightIcon: isLoading ? /* @__PURE__ */ React70__namespace.default.createElement(
|
3251
3235
|
exports.ColorSpinner,
|
3252
3236
|
{
|
3253
3237
|
width: "1.5rem",
|
@@ -3262,7 +3246,7 @@ function Combobox({
|
|
3262
3246
|
}
|
3263
3247
|
) : rightIcon
|
3264
3248
|
}
|
3265
|
-
), state2.isOpen && !isLoading && /* @__PURE__ */
|
3249
|
+
), state2.isOpen && !isLoading && /* @__PURE__ */ React70__namespace.default.createElement(
|
3266
3250
|
Popover3,
|
3267
3251
|
{
|
3268
3252
|
state: state2,
|
@@ -3274,7 +3258,7 @@ function Combobox({
|
|
3274
3258
|
hasBackdrop: false,
|
3275
3259
|
containerPadding: 0
|
3276
3260
|
},
|
3277
|
-
/* @__PURE__ */
|
3261
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
3278
3262
|
ListBox,
|
3279
3263
|
{
|
3280
3264
|
...listBoxProps,
|
@@ -3298,8 +3282,8 @@ var init_Combobox = __esm({
|
|
3298
3282
|
init_src();
|
3299
3283
|
init_Popover();
|
3300
3284
|
useInputWidth = (inputRef) => {
|
3301
|
-
const [inputWidth, setInputWidth] =
|
3302
|
-
|
3285
|
+
const [inputWidth, setInputWidth] = React70.useState("auto");
|
3286
|
+
React70.useEffect(() => {
|
3303
3287
|
const onResize = debounce(() => {
|
3304
3288
|
if (inputRef.current) {
|
3305
3289
|
setInputWidth(`${inputRef.current.offsetWidth}px`);
|
@@ -3326,7 +3310,7 @@ exports.FormControl = void 0;
|
|
3326
3310
|
var init_FormControl = __esm({
|
3327
3311
|
"src/input/FormControl.tsx"() {
|
3328
3312
|
exports.FormControl = react.forwardRef((props, ref) => {
|
3329
|
-
return /* @__PURE__ */
|
3313
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.FormControl, { ...props, ref });
|
3330
3314
|
});
|
3331
3315
|
}
|
3332
3316
|
});
|
@@ -3347,7 +3331,7 @@ var init_FormErrorMessage = __esm({
|
|
3347
3331
|
return null;
|
3348
3332
|
}
|
3349
3333
|
const { ref, ...errorMessageProps } = formControlContext.getErrorMessageProps();
|
3350
|
-
return /* @__PURE__ */
|
3334
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { position: "relative", ref }, /* @__PURE__ */ React70__namespace.default.createElement(
|
3351
3335
|
react.Box,
|
3352
3336
|
{
|
3353
3337
|
borderRadius: "xs",
|
@@ -3365,12 +3349,12 @@ var init_FormErrorMessage = __esm({
|
|
3365
3349
|
...errorMessageProps,
|
3366
3350
|
...boxProps
|
3367
3351
|
},
|
3368
|
-
/* @__PURE__ */
|
3352
|
+
/* @__PURE__ */ React70__namespace.default.createElement(Arrow, { position: "absolute", top: "-0.25em", left: "1em" }),
|
3369
3353
|
children
|
3370
3354
|
));
|
3371
3355
|
};
|
3372
3356
|
Arrow = (props) => {
|
3373
|
-
return /* @__PURE__ */
|
3357
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
3374
3358
|
react.Box,
|
3375
3359
|
{
|
3376
3360
|
...props,
|
@@ -3381,7 +3365,7 @@ var init_FormErrorMessage = __esm({
|
|
3381
3365
|
fill: "none",
|
3382
3366
|
transform: "rotate(45deg)"
|
3383
3367
|
},
|
3384
|
-
/* @__PURE__ */
|
3368
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
3385
3369
|
react.Box,
|
3386
3370
|
{
|
3387
3371
|
as: "path",
|
@@ -3397,7 +3381,7 @@ exports.FormLabel = void 0;
|
|
3397
3381
|
var init_FormLabel = __esm({
|
3398
3382
|
"src/input/FormLabel.tsx"() {
|
3399
3383
|
exports.FormLabel = react.forwardRef((props, ref) => {
|
3400
|
-
return /* @__PURE__ */
|
3384
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.FormLabel, { ...props, ref });
|
3401
3385
|
});
|
3402
3386
|
}
|
3403
3387
|
});
|
@@ -3410,7 +3394,7 @@ function ListBox({
|
|
3410
3394
|
}) {
|
3411
3395
|
const { listBoxProps } = reactAria.useListBox(props, state2, listBoxRef);
|
3412
3396
|
const styles3 = react.useMultiStyleConfig("ListBox", {});
|
3413
|
-
return /* @__PURE__ */
|
3397
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
3414
3398
|
react.List,
|
3415
3399
|
{
|
3416
3400
|
...listBoxProps,
|
@@ -3421,22 +3405,22 @@ function ListBox({
|
|
3421
3405
|
},
|
3422
3406
|
state2.collection.size === 0 && props.emptyContent,
|
3423
3407
|
Array.from(state2.collection).map(
|
3424
|
-
(item) => item.type === "section" ? /* @__PURE__ */
|
3408
|
+
(item) => item.type === "section" ? /* @__PURE__ */ React70__namespace.default.createElement(ListBoxSection, { key: item.key, section: item, state: state2 }) : /* @__PURE__ */ React70__namespace.default.createElement(Option, { key: item.key, item, state: state2 })
|
3425
3409
|
)
|
3426
3410
|
);
|
3427
3411
|
}
|
3428
3412
|
function ItemLabel({ children }) {
|
3429
3413
|
let { labelProps } = useOptionContext();
|
3430
3414
|
const styles3 = react.useMultiStyleConfig("ListBox", {});
|
3431
|
-
return /* @__PURE__ */
|
3415
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...labelProps, sx: styles3.label }, children);
|
3432
3416
|
}
|
3433
3417
|
function ItemDescription({ children }) {
|
3434
3418
|
let { descriptionProps } = useOptionContext();
|
3435
3419
|
const styles3 = react.useMultiStyleConfig("ListBox", {});
|
3436
|
-
return /* @__PURE__ */
|
3420
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...descriptionProps, sx: styles3.description }, children);
|
3437
3421
|
}
|
3438
3422
|
function Option({ item, state: state2 }) {
|
3439
|
-
const ref =
|
3423
|
+
const ref = React70.useRef(null);
|
3440
3424
|
const {
|
3441
3425
|
optionProps,
|
3442
3426
|
isSelected,
|
@@ -3456,7 +3440,7 @@ function Option({ item, state: state2 }) {
|
|
3456
3440
|
if (isFocused) {
|
3457
3441
|
dataFields["data-focus"] = true;
|
3458
3442
|
}
|
3459
|
-
|
3443
|
+
React70.useEffect(() => {
|
3460
3444
|
var _a6;
|
3461
3445
|
(_a6 = ref == null ? void 0 : ref.current) == null ? void 0 : _a6.addEventListener(
|
3462
3446
|
"touchend",
|
@@ -3466,7 +3450,7 @@ function Option({ item, state: state2 }) {
|
|
3466
3450
|
{ passive: false, once: true }
|
3467
3451
|
);
|
3468
3452
|
}, []);
|
3469
|
-
return /* @__PURE__ */
|
3453
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(OptionContext.Provider, { value: { labelProps, descriptionProps } }, /* @__PURE__ */ React70__namespace.default.createElement(react.ListItem, { ...optionProps, ...dataFields, ref, sx: styles3.item }, item.rendered));
|
3470
3454
|
}
|
3471
3455
|
function ListBoxSection({ section, state: state2 }) {
|
3472
3456
|
const { itemProps, headingProps, groupProps } = reactAria.useListBoxSection({
|
@@ -3475,7 +3459,7 @@ function ListBoxSection({ section, state: state2 }) {
|
|
3475
3459
|
});
|
3476
3460
|
const isFirstSection = section.key === state2.collection.getFirstKey();
|
3477
3461
|
const titleColor = react.useColorModeValue("darkGrey", "white");
|
3478
|
-
return /* @__PURE__ */
|
3462
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.ListItem, { ...itemProps }, section.rendered && /* @__PURE__ */ React70__namespace.default.createElement(
|
3479
3463
|
react.Box,
|
3480
3464
|
{
|
3481
3465
|
fontSize: "mobile.xs",
|
@@ -3488,19 +3472,19 @@ function ListBoxSection({ section, state: state2 }) {
|
|
3488
3472
|
...headingProps
|
3489
3473
|
},
|
3490
3474
|
section.rendered
|
3491
|
-
), /* @__PURE__ */
|
3492
|
-
(item) => /* @__PURE__ */
|
3475
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(react.List, { ...groupProps, padding: 0, listStyleType: "none" }, Array.from(state2.collection.getChildren(section.key)).map(
|
3476
|
+
(item) => /* @__PURE__ */ React70__namespace.default.createElement(Option, { key: item.key, item, state: state2 })
|
3493
3477
|
)));
|
3494
3478
|
}
|
3495
3479
|
var OptionContext, useOptionContext;
|
3496
3480
|
var init_ListBox = __esm({
|
3497
3481
|
"src/input/ListBox.tsx"() {
|
3498
|
-
OptionContext =
|
3482
|
+
OptionContext = React70__namespace.default.createContext({
|
3499
3483
|
labelProps: {},
|
3500
3484
|
descriptionProps: {}
|
3501
3485
|
});
|
3502
3486
|
useOptionContext = () => {
|
3503
|
-
return
|
3487
|
+
return React70.useContext(OptionContext);
|
3504
3488
|
};
|
3505
3489
|
}
|
3506
3490
|
});
|
@@ -3522,8 +3506,8 @@ function InfoSelect({
|
|
3522
3506
|
...props
|
3523
3507
|
};
|
3524
3508
|
const state2 = reactStately.useSelectState(renamedProps);
|
3525
|
-
const triggerRef =
|
3526
|
-
const listboxRef =
|
3509
|
+
const triggerRef = React70.useRef(null);
|
3510
|
+
const listboxRef = React70.useRef(null);
|
3527
3511
|
const { labelProps, triggerProps, valueProps, menuProps } = reactAria.useSelect(
|
3528
3512
|
renamedProps,
|
3529
3513
|
state2,
|
@@ -3539,7 +3523,7 @@ function InfoSelect({
|
|
3539
3523
|
const { buttonProps } = reactAria.useButton(triggerProps, triggerRef);
|
3540
3524
|
const { t: t2 } = useTranslation();
|
3541
3525
|
const formControl = react.useFormControlProps(props);
|
3542
|
-
return /* @__PURE__ */
|
3526
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: styles3.container }, /* @__PURE__ */ React70__namespace.default.createElement(react.chakra.div, { ...labelProps, sx: styles3.label }, props.label), /* @__PURE__ */ React70__namespace.default.createElement(
|
3543
3527
|
reactAria.HiddenSelect,
|
3544
3528
|
{
|
3545
3529
|
state: state2,
|
@@ -3547,7 +3531,7 @@ function InfoSelect({
|
|
3547
3531
|
label: props.label,
|
3548
3532
|
name: props.name
|
3549
3533
|
}
|
3550
|
-
), /* @__PURE__ */
|
3534
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
3551
3535
|
react.chakra.button,
|
3552
3536
|
{
|
3553
3537
|
type: "button",
|
@@ -3560,16 +3544,16 @@ function InfoSelect({
|
|
3560
3544
|
"aria-invalid": formControl.isInvalid,
|
3561
3545
|
"aria-describedby": formControl["aria-describedby"]
|
3562
3546
|
},
|
3563
|
-
/* @__PURE__ */
|
3564
|
-
/* @__PURE__ */
|
3565
|
-
), state2.isOpen && /* @__PURE__ */
|
3547
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...valueProps }, state2.selectedItem ? state2.selectedItem.textValue ?? state2.selectedItem.rendered : placeholder ?? t2(texts11.selectAnOption)),
|
3548
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: styles3.arrowIcon }, state2.isOpen ? /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.DropdownUpFill24Icon, null) : /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.DropdownDownFill24Icon, null))
|
3549
|
+
), state2.isOpen && /* @__PURE__ */ React70__namespace.default.createElement(
|
3566
3550
|
Popover3,
|
3567
3551
|
{
|
3568
3552
|
state: state2,
|
3569
3553
|
triggerRef,
|
3570
3554
|
containerPadding: 0
|
3571
3555
|
},
|
3572
|
-
/* @__PURE__ */
|
3556
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
3573
3557
|
ListBox,
|
3574
3558
|
{
|
3575
3559
|
...menuProps,
|
@@ -3603,9 +3587,9 @@ var init_Input = __esm({
|
|
3603
3587
|
exports.Input = react.forwardRef(
|
3604
3588
|
({ label, leftIcon, rightIcon, id, size: size2, ...props }, ref) => {
|
3605
3589
|
const formControlProps = react.useFormControlContext();
|
3606
|
-
const fallbackId = `input-${
|
3590
|
+
const fallbackId = `input-${React70.useId()}`;
|
3607
3591
|
const inputId = id ?? (formControlProps == null ? void 0 : formControlProps.id) ?? fallbackId;
|
3608
|
-
return /* @__PURE__ */
|
3592
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.InputGroup, { position: "relative" }, leftIcon && /* @__PURE__ */ React70__namespace.default.createElement(react.InputLeftElement, { pointerEvents: "none" }, leftIcon), /* @__PURE__ */ React70__namespace.default.createElement(
|
3609
3593
|
react.Input,
|
3610
3594
|
{
|
3611
3595
|
"data-attachable": true,
|
@@ -3616,7 +3600,7 @@ var init_Input = __esm({
|
|
3616
3600
|
ref,
|
3617
3601
|
placeholder: " "
|
3618
3602
|
}
|
3619
|
-
), /* @__PURE__ */
|
3603
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(react.FormLabel, { htmlFor: inputId }, label), rightIcon && /* @__PURE__ */ React70__namespace.default.createElement(react.InputRightElement, { pointerEvents: "none" }, rightIcon));
|
3620
3604
|
}
|
3621
3605
|
);
|
3622
3606
|
}
|
@@ -3625,10 +3609,10 @@ exports.InputLeftElement = void 0; exports.InputRightElement = void 0;
|
|
3625
3609
|
var init_InputElement = __esm({
|
3626
3610
|
"src/input/InputElement.tsx"() {
|
3627
3611
|
exports.InputLeftElement = react.forwardRef(
|
3628
|
-
(props, ref) => /* @__PURE__ */
|
3612
|
+
(props, ref) => /* @__PURE__ */ React70__namespace.default.createElement(react.InputLeftElement, { ...props, ref })
|
3629
3613
|
);
|
3630
3614
|
exports.InputRightElement = react.forwardRef(
|
3631
|
-
(props, ref) => /* @__PURE__ */
|
3615
|
+
(props, ref) => /* @__PURE__ */ React70__namespace.default.createElement(react.InputRightElement, { ...props, ref })
|
3632
3616
|
);
|
3633
3617
|
}
|
3634
3618
|
});
|
@@ -3639,7 +3623,7 @@ var init_NativeSelect = __esm({
|
|
3639
3623
|
exports.NativeSelect = react.forwardRef(
|
3640
3624
|
({ label, ...props }, ref) => {
|
3641
3625
|
const styles3 = react.useMultiStyleConfig("Select", props);
|
3642
|
-
return /* @__PURE__ */
|
3626
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(exports.FormControl, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
3643
3627
|
react.Select,
|
3644
3628
|
{
|
3645
3629
|
"data-attachable": true,
|
@@ -3647,7 +3631,7 @@ var init_NativeSelect = __esm({
|
|
3647
3631
|
rootProps: { __css: styles3.root },
|
3648
3632
|
ref
|
3649
3633
|
}
|
3650
|
-
), label && /* @__PURE__ */
|
3634
|
+
), label && /* @__PURE__ */ React70__namespace.default.createElement(exports.FormLabel, null, label));
|
3651
3635
|
}
|
3652
3636
|
);
|
3653
3637
|
}
|
@@ -3675,17 +3659,17 @@ function NumericStepper({
|
|
3675
3659
|
});
|
3676
3660
|
const formControlProps = react.useFormControl({ id: idProp, isDisabled });
|
3677
3661
|
const clampedStepSize = Math.max(Math.min(stepSize, 10), 1);
|
3678
|
-
return /* @__PURE__ */
|
3662
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { __css: styles3.container, ...boxProps }, /* @__PURE__ */ React70__namespace.default.createElement(
|
3679
3663
|
VerySmallButton,
|
3680
3664
|
{
|
3681
|
-
icon: /* @__PURE__ */
|
3665
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(SubtractIcon, { stepLabel: clampedStepSize }),
|
3682
3666
|
"aria-label": t2(texts12.decrementButtonAriaLabel(clampedStepSize)),
|
3683
3667
|
onClick: () => onChange(Math.max(value - clampedStepSize, minValue)),
|
3684
3668
|
visibility: value <= minValue ? "hidden" : "visible",
|
3685
3669
|
isDisabled: formControlProps.disabled,
|
3686
3670
|
id: value <= minValue ? void 0 : formControlProps.id
|
3687
3671
|
}
|
3688
|
-
), withInput ? /* @__PURE__ */
|
3672
|
+
), withInput ? /* @__PURE__ */ React70__namespace.default.createElement(
|
3689
3673
|
react.chakra.input,
|
3690
3674
|
{
|
3691
3675
|
type: "number",
|
@@ -3708,7 +3692,7 @@ function NumericStepper({
|
|
3708
3692
|
onChange(Math.max(Math.min(numericInput, maxValue), minValue));
|
3709
3693
|
}
|
3710
3694
|
}
|
3711
|
-
) : /* @__PURE__ */
|
3695
|
+
) : /* @__PURE__ */ React70__namespace.default.createElement(
|
3712
3696
|
react.chakra.text,
|
3713
3697
|
{
|
3714
3698
|
sx: styles3.text,
|
@@ -3716,10 +3700,10 @@ function NumericStepper({
|
|
3716
3700
|
"aria-label": value.toString()
|
3717
3701
|
},
|
3718
3702
|
value
|
3719
|
-
), /* @__PURE__ */
|
3703
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
3720
3704
|
VerySmallButton,
|
3721
3705
|
{
|
3722
|
-
icon: /* @__PURE__ */
|
3706
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(AddIcon, { stepLabel: clampedStepSize }),
|
3723
3707
|
"aria-label": t2(texts12.incrementButtonAriaLabel(clampedStepSize)),
|
3724
3708
|
onClick: () => onChange(Math.min(value + clampedStepSize, maxValue)),
|
3725
3709
|
visibility: value >= maxValue ? "hidden" : "visible",
|
@@ -3734,9 +3718,9 @@ var init_NumericStepper = __esm({
|
|
3734
3718
|
init_src();
|
3735
3719
|
VerySmallButton = (props) => {
|
3736
3720
|
const styles3 = react.useMultiStyleConfig("NumericStepper", {});
|
3737
|
-
return /* @__PURE__ */
|
3721
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(exports.IconButton, { variant: "primary", size: "xs", sx: styles3.button, ...props });
|
3738
3722
|
};
|
3739
|
-
SubtractIcon = (props) => /* @__PURE__ */
|
3723
|
+
SubtractIcon = (props) => /* @__PURE__ */ React70__namespace.default.createElement(React70__namespace.default.Fragment, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
3740
3724
|
react.Box,
|
3741
3725
|
{
|
3742
3726
|
as: "svg",
|
@@ -3746,7 +3730,7 @@ var init_NumericStepper = __esm({
|
|
3746
3730
|
stroke: "currentColor",
|
3747
3731
|
...props
|
3748
3732
|
},
|
3749
|
-
/* @__PURE__ */
|
3733
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
3750
3734
|
"line",
|
3751
3735
|
{
|
3752
3736
|
x1: "9",
|
@@ -3757,8 +3741,8 @@ var init_NumericStepper = __esm({
|
|
3757
3741
|
strokeLinecap: "round"
|
3758
3742
|
}
|
3759
3743
|
)
|
3760
|
-
), props.stepLabel > 1 && /* @__PURE__ */
|
3761
|
-
AddIcon = (props) => /* @__PURE__ */
|
3744
|
+
), props.stepLabel > 1 && /* @__PURE__ */ React70__namespace.default.createElement(react.chakra.span, { paddingRight: "1" }, props.stepLabel.toString()));
|
3745
|
+
AddIcon = (props) => /* @__PURE__ */ React70__namespace.default.createElement(React70__namespace.default.Fragment, null, /* @__PURE__ */ React70__namespace.default.createElement(
|
3762
3746
|
react.Box,
|
3763
3747
|
{
|
3764
3748
|
as: "svg",
|
@@ -3768,7 +3752,7 @@ var init_NumericStepper = __esm({
|
|
3768
3752
|
stroke: "currentColor",
|
3769
3753
|
...props
|
3770
3754
|
},
|
3771
|
-
/* @__PURE__ */
|
3755
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
3772
3756
|
"line",
|
3773
3757
|
{
|
3774
3758
|
x1: "9",
|
@@ -3779,7 +3763,7 @@ var init_NumericStepper = __esm({
|
|
3779
3763
|
strokeLinecap: "round"
|
3780
3764
|
}
|
3781
3765
|
),
|
3782
|
-
/* @__PURE__ */
|
3766
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
3783
3767
|
"line",
|
3784
3768
|
{
|
3785
3769
|
x1: "15",
|
@@ -3790,7 +3774,7 @@ var init_NumericStepper = __esm({
|
|
3790
3774
|
strokeLinecap: "round"
|
3791
3775
|
}
|
3792
3776
|
)
|
3793
|
-
), props.stepLabel > 1 && /* @__PURE__ */
|
3777
|
+
), props.stepLabel > 1 && /* @__PURE__ */ React70__namespace.default.createElement(react.chakra.span, { paddingRight: "1" }, props.stepLabel.toString()));
|
3794
3778
|
texts12 = createTexts({
|
3795
3779
|
decrementButtonAriaLabel(stepSize) {
|
3796
3780
|
return {
|
@@ -3821,9 +3805,9 @@ var init_PasswordInput = __esm({
|
|
3821
3805
|
const { isOpen: isShowingPassword, onToggle } = react.useDisclosure();
|
3822
3806
|
const { t: t2 } = useTranslation();
|
3823
3807
|
const formControlProps = react.useFormControlContext();
|
3824
|
-
const autoGeneratedId = `password-input-${
|
3808
|
+
const autoGeneratedId = `password-input-${React70.useId()}`;
|
3825
3809
|
const inputId = id ?? (formControlProps == null ? void 0 : formControlProps.id) ?? autoGeneratedId;
|
3826
|
-
return /* @__PURE__ */
|
3810
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.InputGroup, { position: "relative" }, leftIcon && /* @__PURE__ */ React70__namespace.default.createElement(exports.InputLeftElement, null, leftIcon), /* @__PURE__ */ React70__namespace.default.createElement(
|
3827
3811
|
react.Input,
|
3828
3812
|
{
|
3829
3813
|
...props,
|
@@ -3835,7 +3819,7 @@ var init_PasswordInput = __esm({
|
|
3835
3819
|
ref,
|
3836
3820
|
"data-attachable": true
|
3837
3821
|
}
|
3838
|
-
), /* @__PURE__ */
|
3822
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(exports.FormLabel, { htmlFor: inputId, pointerEvents: "none" }, label), /* @__PURE__ */ React70__namespace.default.createElement(exports.InputRightElement, { width: "fit-content" }, /* @__PURE__ */ React70__namespace.default.createElement(
|
3839
3823
|
react.Button,
|
3840
3824
|
{
|
3841
3825
|
variant: "ghost",
|
@@ -3892,7 +3876,7 @@ var init_CountryCodeSelect = __esm({
|
|
3892
3876
|
callingCodes = [...prioritizedCountryCodes, ...sortedCallingCodes];
|
3893
3877
|
CountryCodeSelect = (props) => {
|
3894
3878
|
const { t: t2 } = useTranslation();
|
3895
|
-
return /* @__PURE__ */
|
3879
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
3896
3880
|
InfoSelect,
|
3897
3881
|
{
|
3898
3882
|
label: t2(texts14.countryCode),
|
@@ -3900,7 +3884,7 @@ var init_CountryCodeSelect = __esm({
|
|
3900
3884
|
items: callingCodes,
|
3901
3885
|
...props
|
3902
3886
|
},
|
3903
|
-
(item) => /* @__PURE__ */
|
3887
|
+
(item) => /* @__PURE__ */ React70__namespace.default.createElement(reactStately.Item, { key: item.key }, item.key)
|
3904
3888
|
);
|
3905
3889
|
};
|
3906
3890
|
CountryCodeSelect_default = CountryCodeSelect;
|
@@ -3937,10 +3921,10 @@ var init_PhoneNumberInput = __esm({
|
|
3937
3921
|
nationalNumber: ""
|
3938
3922
|
}
|
3939
3923
|
});
|
3940
|
-
return /* @__PURE__ */
|
3941
|
-
|
3924
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(exports.AttachedInputs, { ...boxProps }, /* @__PURE__ */ React70__namespace.default.createElement(
|
3925
|
+
React70.Suspense,
|
3942
3926
|
{
|
3943
|
-
fallback: /* @__PURE__ */
|
3927
|
+
fallback: /* @__PURE__ */ React70__namespace.default.createElement(
|
3944
3928
|
InfoSelect,
|
3945
3929
|
{
|
3946
3930
|
isLabelSrOnly: true,
|
@@ -3949,10 +3933,10 @@ var init_PhoneNumberInput = __esm({
|
|
3949
3933
|
height: "100%",
|
3950
3934
|
value: "+47"
|
3951
3935
|
},
|
3952
|
-
/* @__PURE__ */
|
3936
|
+
/* @__PURE__ */ React70__namespace.default.createElement(reactStately.Item, { key: "+47" }, "+47")
|
3953
3937
|
)
|
3954
3938
|
},
|
3955
|
-
/* @__PURE__ */
|
3939
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
3956
3940
|
LazyCountryCodeSelect,
|
3957
3941
|
{
|
3958
3942
|
value: value.countryCode,
|
@@ -3965,7 +3949,7 @@ var init_PhoneNumberInput = __esm({
|
|
3965
3949
|
width: "6.25rem"
|
3966
3950
|
}
|
3967
3951
|
)
|
3968
|
-
), /* @__PURE__ */
|
3952
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
3969
3953
|
exports.Input,
|
3970
3954
|
{
|
3971
3955
|
ref,
|
@@ -3994,14 +3978,14 @@ var init_PhoneNumberInput = __esm({
|
|
3994
3978
|
sv: "Telefonnummer"
|
3995
3979
|
}
|
3996
3980
|
});
|
3997
|
-
LazyCountryCodeSelect =
|
3981
|
+
LazyCountryCodeSelect = React70__namespace.default.lazy(() => Promise.resolve().then(() => (init_CountryCodeSelect(), CountryCodeSelect_exports)));
|
3998
3982
|
}
|
3999
3983
|
});
|
4000
3984
|
exports.Radio = void 0;
|
4001
3985
|
var init_Radio = __esm({
|
4002
3986
|
"src/input/Radio.tsx"() {
|
4003
3987
|
exports.Radio = react.forwardRef((props, ref) => {
|
4004
|
-
return /* @__PURE__ */
|
3988
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Radio, { ...props, ref });
|
4005
3989
|
});
|
4006
3990
|
}
|
4007
3991
|
});
|
@@ -4010,7 +3994,7 @@ var init_RadioGroup = __esm({
|
|
4010
3994
|
"src/input/RadioGroup.tsx"() {
|
4011
3995
|
exports.RadioGroup = react.forwardRef(
|
4012
3996
|
({ children, direction: direction2 = "row", ...rest }, ref) => {
|
4013
|
-
return /* @__PURE__ */
|
3997
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.RadioGroup, { ...rest, ref }, /* @__PURE__ */ React70__namespace.default.createElement(react.Stack, { direction: direction2 }, children));
|
4014
3998
|
}
|
4015
3999
|
);
|
4016
4000
|
}
|
@@ -4025,9 +4009,9 @@ var init_SearchInput = __esm({
|
|
4025
4009
|
const { t: t2 } = useTranslation();
|
4026
4010
|
const showClearButton = onReset && Boolean(props.value);
|
4027
4011
|
const formControlProps = react.useFormControlContext();
|
4028
|
-
const autoGeneratedId =
|
4012
|
+
const autoGeneratedId = React70.useId();
|
4029
4013
|
const inputId = props.id ?? (formControlProps == null ? void 0 : formControlProps.id) ?? autoGeneratedId;
|
4030
|
-
return /* @__PURE__ */
|
4014
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.InputGroup, { position: "relative" }, /* @__PURE__ */ React70__namespace.default.createElement(exports.InputLeftElement, null, /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.SearchOutline24Icon, null)), /* @__PURE__ */ React70__namespace.default.createElement(
|
4031
4015
|
react.Input,
|
4032
4016
|
{
|
4033
4017
|
paddingLeft: 7,
|
@@ -4044,7 +4028,7 @@ var init_SearchInput = __esm({
|
|
4044
4028
|
placeholder: " ",
|
4045
4029
|
"data-attachable": true
|
4046
4030
|
}
|
4047
|
-
), /* @__PURE__ */
|
4031
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(exports.FormLabel, { htmlFor: inputId, pointerEvents: "none" }, label ?? t2(texts16.label)), showClearButton && /* @__PURE__ */ React70__namespace.default.createElement(exports.InputRightElement, { width: "fit-content" }, /* @__PURE__ */ React70__namespace.default.createElement(
|
4048
4032
|
react.IconButton,
|
4049
4033
|
{
|
4050
4034
|
variant: "ghost",
|
@@ -4052,7 +4036,7 @@ var init_SearchInput = __esm({
|
|
4052
4036
|
size: "sm",
|
4053
4037
|
marginRight: 1,
|
4054
4038
|
"aria-label": t2(texts16.reset),
|
4055
|
-
icon: /* @__PURE__ */
|
4039
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CloseOutline24Icon, null),
|
4056
4040
|
onClick: onReset
|
4057
4041
|
}
|
4058
4042
|
)));
|
@@ -4079,7 +4063,7 @@ var init_Switch = __esm({
|
|
4079
4063
|
"src/input/Switch.tsx"() {
|
4080
4064
|
exports.Switch = react.forwardRef(
|
4081
4065
|
({ size: size2 = "md", ...props }, ref) => {
|
4082
|
-
return /* @__PURE__ */
|
4066
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Switch, { size: size2, ...props, ref });
|
4083
4067
|
}
|
4084
4068
|
);
|
4085
4069
|
}
|
@@ -4151,9 +4135,9 @@ var init_Textarea = __esm({
|
|
4151
4135
|
remainingProps: { label, ...rest }
|
4152
4136
|
} = getSpacingProps(props);
|
4153
4137
|
const formControlProps = react.useFormControlContext();
|
4154
|
-
const fallbackId = `textarea-${
|
4138
|
+
const fallbackId = `textarea-${React70.useId()}`;
|
4155
4139
|
const inputId = props.id ?? (formControlProps == null ? void 0 : formControlProps.id) ?? fallbackId;
|
4156
|
-
return /* @__PURE__ */
|
4140
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.InputGroup, { position: "relative", ...spacingProps }, /* @__PURE__ */ React70__namespace.default.createElement(react.Textarea, { ...rest, id: inputId, ref, placeholder: " " }), label && /* @__PURE__ */ React70__namespace.default.createElement(react.FormLabel, { htmlFor: inputId, id: `${inputId}-label` }, label));
|
4157
4141
|
});
|
4158
4142
|
}
|
4159
4143
|
});
|
@@ -4252,7 +4236,7 @@ var init_LineIcon = __esm({
|
|
4252
4236
|
if (!Icon) {
|
4253
4237
|
return null;
|
4254
4238
|
}
|
4255
|
-
return /* @__PURE__ */
|
4239
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: { ...styles3.iconContainer, ...sx }, ...rest }, /* @__PURE__ */ React70__namespace.default.createElement(Icon, { sx: styles3.icon }));
|
4256
4240
|
};
|
4257
4241
|
}
|
4258
4242
|
});
|
@@ -4272,7 +4256,7 @@ var init_InfoTag = __esm({
|
|
4272
4256
|
size: size2,
|
4273
4257
|
...customProps
|
4274
4258
|
});
|
4275
|
-
return /* @__PURE__ */
|
4259
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: styles3.container }, /* @__PURE__ */ React70__namespace.default.createElement(
|
4276
4260
|
exports.LineIcon,
|
4277
4261
|
{
|
4278
4262
|
variant,
|
@@ -4280,7 +4264,7 @@ var init_InfoTag = __esm({
|
|
4280
4264
|
sx: styles3.iconContainer,
|
4281
4265
|
...customProps
|
4282
4266
|
}
|
4283
|
-
), /* @__PURE__ */
|
4267
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: styles3.textContainer }, title && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: "span", sx: styles3.title }, title), title && description && " ", description && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: "span", sx: styles3.description }, description)));
|
4284
4268
|
};
|
4285
4269
|
}
|
4286
4270
|
});
|
@@ -4306,7 +4290,7 @@ var init_TravelTag = __esm({
|
|
4306
4290
|
backgroundColor: variant === "custom" ? rest.backgroundColor : void 0
|
4307
4291
|
});
|
4308
4292
|
const DeviationLevelIcon = getDeviationLevelIcon({ deviationLevel, size: size2 });
|
4309
|
-
return /* @__PURE__ */
|
4293
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: styles3.container, "aria-disabled": isDisabled, ref, ...rest }, /* @__PURE__ */ React70__namespace.default.createElement(
|
4310
4294
|
exports.LineIcon,
|
4311
4295
|
{
|
4312
4296
|
variant,
|
@@ -4314,7 +4298,7 @@ var init_TravelTag = __esm({
|
|
4314
4298
|
sx: styles3.iconContainer,
|
4315
4299
|
...rest
|
4316
4300
|
}
|
4317
|
-
), /* @__PURE__ */
|
4301
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: styles3.textContainer }, title && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: "span", sx: styles3.title }, title), title && description && " ", description && /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: "span", sx: styles3.description }, description)), DeviationLevelIcon && /* @__PURE__ */ React70__namespace.default.createElement(DeviationLevelIcon, { sx: styles3.deviationIcon }));
|
4318
4302
|
}
|
4319
4303
|
);
|
4320
4304
|
getDeviationLevelIcon = ({
|
@@ -4353,7 +4337,7 @@ var init_TextLink = __esm({
|
|
4353
4337
|
var _a6;
|
4354
4338
|
const { t: t2 } = useTranslation();
|
4355
4339
|
const isExternal = props.isExternal !== void 0 ? props.isExternal : Boolean((_a6 = props.href) == null ? void 0 : _a6.match(/^https?:\/\//));
|
4356
|
-
return /* @__PURE__ */
|
4340
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Link, { ...props, ref, isExternal }, children, isExternal && /* @__PURE__ */ React70__namespace.default.createElement(
|
4357
4341
|
sporIconReact.LinkOutOutline24Icon,
|
4358
4342
|
{
|
4359
4343
|
marginLeft: 0.5,
|
@@ -4389,8 +4373,8 @@ var init_VyLogo = __esm({
|
|
4389
4373
|
exports.VyLogo = ({ colorScheme, ...boxProps }) => {
|
4390
4374
|
const mainColor = colorScheme === "light" ? "#1d211c" : "#ffffff";
|
4391
4375
|
const accentColor = colorScheme === "light" ? "#138c6e" : "#ffffff";
|
4392
|
-
const id =
|
4393
|
-
return /* @__PURE__ */
|
4376
|
+
const id = React70.useId();
|
4377
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: "svg", viewBox: "0 0 107 54", ...boxProps }, /* @__PURE__ */ React70__namespace.default.createElement("title", null, "Vy logo"), /* @__PURE__ */ React70__namespace.default.createElement(
|
4394
4378
|
"path",
|
4395
4379
|
{
|
4396
4380
|
fillRule: "evenodd",
|
@@ -4398,7 +4382,7 @@ var init_VyLogo = __esm({
|
|
4398
4382
|
d: "M79.97 33.44a.04.04 0 0 0 0-.08 5.76 5.76 0 0 1-2.32-.85c-1.56-1-2.79-2.9-3.83-6.07L68.14 7.16c-1.18-4.04-3.42-5.85-5.48-6.6a8.36 8.36 0 0 0-2.88-.52h-1.44a.04.04 0 0 0 0 .08c.57.09 1.18.24 1.8.5 1.92.8 3.92 2.63 5.06 6.54l5.61 19.07c1.06 3.3 2.31 5.27 3.92 6.3 1.01.64 2.17.9 3.5.9h1.74Z",
|
4399
4383
|
fill: mainColor
|
4400
4384
|
}
|
4401
|
-
), /* @__PURE__ */
|
4385
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
4402
4386
|
"mask",
|
4403
4387
|
{
|
4404
4388
|
id: `${id}-a`,
|
@@ -4409,7 +4393,7 @@ var init_VyLogo = __esm({
|
|
4409
4393
|
width: "94",
|
4410
4394
|
height: "54"
|
4411
4395
|
},
|
4412
|
-
/* @__PURE__ */
|
4396
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
4413
4397
|
"path",
|
4414
4398
|
{
|
4415
4399
|
fillRule: "evenodd",
|
@@ -4418,7 +4402,7 @@ var init_VyLogo = __esm({
|
|
4418
4402
|
fill: mainColor
|
4419
4403
|
}
|
4420
4404
|
)
|
4421
|
-
), /* @__PURE__ */
|
4405
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
4422
4406
|
"g",
|
4423
4407
|
{
|
4424
4408
|
mask: `url(#${id}-a)`,
|
@@ -4426,9 +4410,9 @@ var init_VyLogo = __esm({
|
|
4426
4410
|
clipRule: "evenodd",
|
4427
4411
|
fill: mainColor
|
4428
4412
|
},
|
4429
|
-
/* @__PURE__ */
|
4430
|
-
/* @__PURE__ */
|
4431
|
-
), /* @__PURE__ */
|
4413
|
+
/* @__PURE__ */ React70__namespace.default.createElement("path", { d: "M84.57 33.44a.04.04 0 0 0 .01-.08c-2.34-.3-3.85-3.59-4.68-6.38-.88-2.93-4.04-13.63-5.92-19.82C72.08.94 66.2.05 63.54.04a.04.04 0 0 0-.01.08c2.49.34 6.02 1.85 7.55 7.04 1.34 4.55 5.6 19.03 5.76 19.51 1.02 3.03 2.22 4.85 3.73 5.83a6.3 6.3 0 0 0 3.54.94h.46ZM23.28 53.68h-.72c-2.12 0-4.68-1.08-6.09-6.04L3.8 4.37C3.04 1.77 1.93.47.03.15A.04.04 0 0 1 .04.07h1.9c2.54 0 3.92 1.27 4.8 4.3 0 0 11.72 39.78 12.79 43.54.78 2.78 1.7 4.67 3.13 5.43.23.13.42.2.62.26a.04.04 0 0 1 0 .08ZM18.99 5.99C17.77 1.79 15.87.04 12.37.04h-1.71a.04.04 0 0 0 0 .08c2.73.39 4.32 2.19 5.39 5.87 0 0 10.49 35.72 11.85 40.4l1.44-4.87L18.99 6Z" }),
|
4414
|
+
/* @__PURE__ */ React70__namespace.default.createElement("path", { d: "M24.26 53.68h1.24c1.57 0 2.69-.41 3.52-1.1 1.37-1.1 1.99-2.93 2.56-4.86.09-.29 11.2-37.95 11.59-39.42 1.32-4.97 4.27-7.13 7.43-7.9a12.2 12.2 0 0 1 1.58-.28.04.04 0 0 0 0-.08h-1.4c-4.15 0-8.8 1.65-10.56 8.26-.63 2.38-11.5 39.13-11.58 39.42-.57 1.93-1.23 3.96-2.59 5.07-.56.45-1.06.7-1.8.81a.04.04 0 0 0 0 .08ZM81.3 27.76l6.53-21.78C88.89 2.3 90.49.5 93.23.11a.04.04 0 0 0-.01-.08H91.5c-3.5 0-5.4 1.76-6.62 5.95l-5.05 16.97s1.33 4.46 1.46 4.8Z" })
|
4415
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
4432
4416
|
"path",
|
4433
4417
|
{
|
4434
4418
|
fillRule: "evenodd",
|
@@ -4436,7 +4420,7 @@ var init_VyLogo = __esm({
|
|
4436
4420
|
d: "M98.49.07h-1.82c-2.98 0-4.6 1.49-5.63 5.06l-6.52 21.79a18.22 18.22 0 0 1-1.67 3.96c.57.78 1.17 1.26 1.76 1.38 1.13-.96 2.06-2.75 2.89-5.46l6.49-21.67c.9-3.1 2.23-4.63 4.5-4.98a.04.04 0 0 0 0-.08Z",
|
4437
4421
|
fill: accentColor
|
4438
4422
|
}
|
4439
|
-
), /* @__PURE__ */
|
4423
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
4440
4424
|
"path",
|
4441
4425
|
{
|
4442
4426
|
fillRule: "evenodd",
|
@@ -4444,7 +4428,7 @@ var init_VyLogo = __esm({
|
|
4444
4428
|
d: "M85.25 34.53h-2.93L78.58 46.9c-1.82 6.1 1.05 6.73 2.15 6.73h2.31a.04.04 0 0 0 .01-.09c-1.25-.3-2.96-1.6-1.45-6.64l3.65-12.37ZM102.35.11c.02 0 .03-.02.03-.04a.04.04 0 0 0-.04-.04h-.4c-2.54 0-3.92 1.27-4.8 4.3 0 0-5 16.82-6.57 22.03-1.57 5.2-2.65 6.6-4.78 6.97l-.11.03a.04.04 0 0 0 0 .08h1.45c3.72 0 5.1-2.48 6.41-6.84l7.5-25.07c.19-.6.7-1.23 1.31-1.42Z",
|
4445
4429
|
fill: mainColor
|
4446
4430
|
}
|
4447
|
-
), /* @__PURE__ */
|
4431
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
4448
4432
|
"mask",
|
4449
4433
|
{
|
4450
4434
|
id: `${id}-b`,
|
@@ -4455,7 +4439,7 @@ var init_VyLogo = __esm({
|
|
4455
4439
|
width: "78",
|
4456
4440
|
height: "54"
|
4457
4441
|
},
|
4458
|
-
/* @__PURE__ */
|
4442
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
4459
4443
|
"path",
|
4460
4444
|
{
|
4461
4445
|
fillRule: "evenodd",
|
@@ -4464,25 +4448,25 @@ var init_VyLogo = __esm({
|
|
4464
4448
|
fill: mainColor
|
4465
4449
|
}
|
4466
4450
|
)
|
4467
|
-
), /* @__PURE__ */
|
4451
|
+
), /* @__PURE__ */ React70__namespace.default.createElement("g", { mask: `url(#${id}-b)`, fillRule: "evenodd", clipRule: "evenodd" }, /* @__PURE__ */ React70__namespace.default.createElement(
|
4468
4452
|
"path",
|
4469
4453
|
{
|
4470
4454
|
d: "m88.2 34.45-3.96 13.46c-1.54 5.18.9 5.72 1.83 5.72h2.26a.04.04 0 0 0 0-.09c-1.05-.27-2.44-1.4-1.18-5.63l4.43-15.02c-.7.71-1.88 1.37-3.38 1.56ZM93.71 53.63c.02 0 .04-.02.04-.05a.04.04 0 0 0-.03-.04c-.9-.25-2.02-1.24-.96-4.77 0 0 12.4-42.2 13.08-44.6a3.1 3.1 0 0 0-2.47-4.1c-.02 0-.06-.02-.07.01-.01.04.03.06.04.06.3.16.63.52.45 1.14L89.84 48.77c-1.32 4.4.76 4.86 1.55 4.86h2.32ZM74.1 33.44a.04.04 0 0 0 0-.08 5.77 5.77 0 0 1-2.3-.83c-1.64-1.04-2.9-3.06-3.98-6.5-.1-.29-5.37-18.25-5.55-18.87-1.12-3.8-2.91-5.63-4.68-6.46a7.06 7.06 0 0 0-3.04-.66H53a.04.04 0 0 0-.02.08c.3.05 4.32.17 6.35 7.04 2.03 6.86 4.46 15.07 5.28 17.97 1.77 6.26 4.07 8.3 7.75 8.3h1.73Z",
|
4471
4455
|
fill: mainColor
|
4472
4456
|
}
|
4473
|
-
), /* @__PURE__ */
|
4457
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
4474
4458
|
"path",
|
4475
4459
|
{
|
4476
4460
|
d: "M55.43 2.4c-1.48 1.27-2.7 3.16-3.44 5.9-.07.29-11.08 37.74-11.32 38.55-.93 3.12-1.7 6.21-5.2 6.75a.04.04 0 0 0 0 .08h.7l.6-.01c3.56-.14 5.33-1.66 6.85-6.82L54.94 8.3c.44-1.44.96-3.08 1.7-4.52-.15-.25-.7-.96-1.2-1.38Z",
|
4477
4461
|
fill: mainColor
|
4478
4462
|
}
|
4479
|
-
), /* @__PURE__ */
|
4463
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(
|
4480
4464
|
"path",
|
4481
4465
|
{
|
4482
4466
|
d: "M53.78 1.44a4.64 4.64 0 0 0-4.17.93A10.79 10.79 0 0 0 46.19 8L34.53 47.72c-.58 1.93-1.2 3.75-2.56 4.87-.62.5-1.4.86-2.39 1.01a.04.04 0 0 0 0 .08h1.8c1.57 0 2.69-.41 3.53-1.1 1.36-1.1 1.98-2.93 2.56-4.86L49.05 8.3c.73-2.74 1.95-4.63 3.43-5.9.43-.36.88-.68 1.35-.95l-.05-.01Z",
|
4483
4467
|
fill: accentColor
|
4484
4468
|
}
|
4485
|
-
)), /* @__PURE__ */
|
4469
|
+
)), /* @__PURE__ */ React70__namespace.default.createElement(
|
4486
4470
|
"path",
|
4487
4471
|
{
|
4488
4472
|
fillRule: "evenodd",
|
@@ -4504,7 +4488,7 @@ var init_logo = __esm({
|
|
4504
4488
|
var JumpForwardIcon, JumpBackwardIcon, PlayIcon, PauseIcon, SkipNextIcon, SkipPreviousIcon;
|
4505
4489
|
var init_icons2 = __esm({
|
4506
4490
|
"src/media-controller/icons.tsx"() {
|
4507
|
-
JumpForwardIcon = (props) => /* @__PURE__ */
|
4491
|
+
JumpForwardIcon = (props) => /* @__PURE__ */ React70__namespace.createElement(react.Box, { as: "svg", ...props, viewBox: "0 0 32 30", fill: "none" }, /* @__PURE__ */ React70__namespace.createElement(
|
4508
4492
|
"path",
|
4509
4493
|
{
|
4510
4494
|
fillRule: "evenodd",
|
@@ -4512,7 +4496,7 @@ var init_icons2 = __esm({
|
|
4512
4496
|
d: "M22.388 7.5C20.567 5.967 18.251 5 15.75 5 9.951 5 5.25 9.701 5.25 15.5S9.951 26 15.75 26s10.5-4.701 10.5-10.5a1 1 0 1 1 2 0c0 6.904-5.596 12.5-12.5 12.5s-12.5-5.596-12.5-12.5S8.846 3 15.75 3c3.206 0 6.11 1.31 8.304 3.3l.206-1.441a1 1 0 0 1 1.98.282L25.617 9.5H21.25a1 1 0 1 1 0-2h1.138Z",
|
4513
4497
|
fill: "currentColor"
|
4514
4498
|
}
|
4515
|
-
), /* @__PURE__ */
|
4499
|
+
), /* @__PURE__ */ React70__namespace.createElement(
|
4516
4500
|
"path",
|
4517
4501
|
{
|
4518
4502
|
fillRule: "evenodd",
|
@@ -4521,7 +4505,7 @@ var init_icons2 = __esm({
|
|
4521
4505
|
fill: "currentColor"
|
4522
4506
|
}
|
4523
4507
|
));
|
4524
|
-
JumpBackwardIcon = (props) => /* @__PURE__ */
|
4508
|
+
JumpBackwardIcon = (props) => /* @__PURE__ */ React70__namespace.createElement(react.Box, { as: "svg", ...props, viewBox: "0 0 32 30", fill: "none" }, /* @__PURE__ */ React70__namespace.createElement(
|
4525
4509
|
"path",
|
4526
4510
|
{
|
4527
4511
|
fillRule: "evenodd",
|
@@ -4529,7 +4513,7 @@ var init_icons2 = __esm({
|
|
4529
4513
|
d: "M9.612 7.5C11.433 5.967 13.749 5 16.25 5c5.799 0 10.5 4.701 10.5 10.5S22.049 26 16.25 26s-10.5-4.701-10.5-10.5a1 1 0 1 0-2 0c0 6.904 5.596 12.5 12.5 12.5s12.5-5.596 12.5-12.5S23.154 3 16.25 3c-3.206 0-6.11 1.31-8.304 3.3L7.74 4.86a1 1 0 0 0-1.98.282L6.383 9.5h4.367a1 1 0 1 0 0-2H9.612Z",
|
4530
4514
|
fill: "currentColor"
|
4531
4515
|
}
|
4532
|
-
), /* @__PURE__ */
|
4516
|
+
), /* @__PURE__ */ React70__namespace.createElement(
|
4533
4517
|
"path",
|
4534
4518
|
{
|
4535
4519
|
fillRule: "evenodd",
|
@@ -4538,7 +4522,7 @@ var init_icons2 = __esm({
|
|
4538
4522
|
fill: "currentColor"
|
4539
4523
|
}
|
4540
4524
|
));
|
4541
|
-
PlayIcon = (props) => /* @__PURE__ */
|
4525
|
+
PlayIcon = (props) => /* @__PURE__ */ React70__namespace.createElement(react.Box, { as: "svg", ...props, fill: "none", viewBox: "0 0 60 60" }, /* @__PURE__ */ React70__namespace.createElement(
|
4542
4526
|
"path",
|
4543
4527
|
{
|
4544
4528
|
fillRule: "evenodd",
|
@@ -4547,7 +4531,7 @@ var init_icons2 = __esm({
|
|
4547
4531
|
fill: "currentColor"
|
4548
4532
|
}
|
4549
4533
|
));
|
4550
|
-
PauseIcon = (props) => /* @__PURE__ */
|
4534
|
+
PauseIcon = (props) => /* @__PURE__ */ React70__namespace.createElement(react.Box, { as: "svg", ...props, viewBox: "0 0 60 60", fill: "none" }, /* @__PURE__ */ React70__namespace.createElement(
|
4551
4535
|
"path",
|
4552
4536
|
{
|
4553
4537
|
fillRule: "evenodd",
|
@@ -4556,7 +4540,7 @@ var init_icons2 = __esm({
|
|
4556
4540
|
fill: "currentColor"
|
4557
4541
|
}
|
4558
4542
|
));
|
4559
|
-
SkipNextIcon = (props) => /* @__PURE__ */
|
4543
|
+
SkipNextIcon = (props) => /* @__PURE__ */ React70__namespace.createElement(react.Box, { as: "svg", ...props, viewBox: "0 0 30 30", fill: "none" }, /* @__PURE__ */ React70__namespace.createElement(
|
4560
4544
|
"path",
|
4561
4545
|
{
|
4562
4546
|
fillRule: "evenodd",
|
@@ -4565,7 +4549,7 @@ var init_icons2 = __esm({
|
|
4565
4549
|
fill: "currentColor"
|
4566
4550
|
}
|
4567
4551
|
));
|
4568
|
-
SkipPreviousIcon = (props) => /* @__PURE__ */
|
4552
|
+
SkipPreviousIcon = (props) => /* @__PURE__ */ React70__namespace.createElement(react.Box, { as: "svg", ...props, viewBox: "0 0 30 30", fill: "none" }, /* @__PURE__ */ React70__namespace.createElement(
|
4569
4553
|
"path",
|
4570
4554
|
{
|
4571
4555
|
fillRule: "evenodd",
|
@@ -4592,7 +4576,7 @@ var init_JumpButton = __esm({
|
|
4592
4576
|
variant: "jumpSkip",
|
4593
4577
|
size: size2
|
4594
4578
|
});
|
4595
|
-
return /* @__PURE__ */
|
4579
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
4596
4580
|
react.Center,
|
4597
4581
|
{
|
4598
4582
|
as: "button",
|
@@ -4601,7 +4585,7 @@ var init_JumpButton = __esm({
|
|
4601
4585
|
disabled: isDisabled,
|
4602
4586
|
...props
|
4603
4587
|
},
|
4604
|
-
direction2 === "forward" ? /* @__PURE__ */
|
4588
|
+
direction2 === "forward" ? /* @__PURE__ */ React70__namespace.default.createElement(JumpForwardIcon, { sx: styles3.icon }) : /* @__PURE__ */ React70__namespace.default.createElement(JumpBackwardIcon, { sx: styles3.icon })
|
4605
4589
|
);
|
4606
4590
|
};
|
4607
4591
|
texts18 = createTexts({
|
@@ -4636,7 +4620,7 @@ var init_PlayPauseButton = __esm({
|
|
4636
4620
|
variant: "play",
|
4637
4621
|
size: size2
|
4638
4622
|
});
|
4639
|
-
return /* @__PURE__ */
|
4623
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
4640
4624
|
react.Center,
|
4641
4625
|
{
|
4642
4626
|
as: "button",
|
@@ -4645,7 +4629,7 @@ var init_PlayPauseButton = __esm({
|
|
4645
4629
|
disabled: isDisabled,
|
4646
4630
|
...props
|
4647
4631
|
},
|
4648
|
-
isPlaying ? /* @__PURE__ */
|
4632
|
+
isPlaying ? /* @__PURE__ */ React70__namespace.default.createElement(PauseIcon, { sx: styles3.icon }) : /* @__PURE__ */ React70__namespace.default.createElement(PlayIcon, { sx: styles3.icon })
|
4649
4633
|
);
|
4650
4634
|
};
|
4651
4635
|
texts19 = createTexts({
|
@@ -4680,7 +4664,7 @@ var init_SkipButton = __esm({
|
|
4680
4664
|
variant: "jumpSkip",
|
4681
4665
|
size: size2
|
4682
4666
|
});
|
4683
|
-
return /* @__PURE__ */
|
4667
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
4684
4668
|
react.Center,
|
4685
4669
|
{
|
4686
4670
|
as: "button",
|
@@ -4689,7 +4673,7 @@ var init_SkipButton = __esm({
|
|
4689
4673
|
disabled: isDisabled,
|
4690
4674
|
...props
|
4691
4675
|
},
|
4692
|
-
direction2 === "forward" ? /* @__PURE__ */
|
4676
|
+
direction2 === "forward" ? /* @__PURE__ */ React70__namespace.default.createElement(SkipNextIcon, { sx: styles3.icon }) : /* @__PURE__ */ React70__namespace.default.createElement(SkipPreviousIcon, { sx: styles3.icon })
|
4693
4677
|
);
|
4694
4678
|
};
|
4695
4679
|
texts20 = createTexts({
|
@@ -4726,7 +4710,7 @@ var init_ModalHeader = __esm({
|
|
4726
4710
|
fontSize: size2 === "lg" ? ["mobile.lg", "desktop.lg"] : ["mobile.md", "desktop.md"],
|
4727
4711
|
textAlign: size2 === "lg" ? "center" : "left"
|
4728
4712
|
};
|
4729
|
-
return /* @__PURE__ */
|
4713
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.ModalHeader, { ...props, ref, ...styles3 });
|
4730
4714
|
}
|
4731
4715
|
);
|
4732
4716
|
}
|
@@ -4736,7 +4720,7 @@ var init_Drawer = __esm({
|
|
4736
4720
|
"src/modal/Drawer.tsx"() {
|
4737
4721
|
init_ModalHeader();
|
4738
4722
|
exports.Drawer = (props) => {
|
4739
|
-
return /* @__PURE__ */
|
4723
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(DrawerProvider, { placement: props.placement }, /* @__PURE__ */ React70__namespace.default.createElement(react.Drawer, { ...props }));
|
4740
4724
|
};
|
4741
4725
|
exports.DrawerContent = react.forwardRef(
|
4742
4726
|
({ children, ...props }, ref) => {
|
@@ -4753,7 +4737,7 @@ var init_Drawer = __esm({
|
|
4753
4737
|
});
|
4754
4738
|
const isTopOrBottom = placement === "top" || placement === "bottom";
|
4755
4739
|
const widthConstraits = isTopOrBottom ? { width: ["100%", "37.5rem"], mx: "auto" } : {};
|
4756
|
-
return /* @__PURE__ */
|
4740
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...handlers }, /* @__PURE__ */ React70__namespace.default.createElement(
|
4757
4741
|
react.DrawerContent,
|
4758
4742
|
{
|
4759
4743
|
...widthConstraits,
|
@@ -4762,13 +4746,13 @@ var init_Drawer = __esm({
|
|
4762
4746
|
...props,
|
4763
4747
|
ref
|
4764
4748
|
},
|
4765
|
-
/* @__PURE__ */
|
4749
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { position: "relative" }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { maxHeight: "100vh", maxWidth: "100vw", overflow: "auto" }, isTopOrBottom && /* @__PURE__ */ React70__namespace.default.createElement(Notch, null), /* @__PURE__ */ React70__namespace.default.createElement(react.Box, null, children)))
|
4766
4750
|
));
|
4767
4751
|
}
|
4768
4752
|
);
|
4769
4753
|
Notch = react.forwardRef((props, ref) => {
|
4770
4754
|
const placement = useDrawerContext();
|
4771
|
-
return /* @__PURE__ */
|
4755
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
4772
4756
|
react.Box,
|
4773
4757
|
{
|
4774
4758
|
position: "absolute",
|
@@ -4780,14 +4764,14 @@ var init_Drawer = __esm({
|
|
4780
4764
|
...props,
|
4781
4765
|
ref
|
4782
4766
|
},
|
4783
|
-
/* @__PURE__ */
|
4767
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
4784
4768
|
react.Center,
|
4785
4769
|
{
|
4786
4770
|
background: placement === "bottom" ? "bottom" : "top",
|
4787
4771
|
padding: 2,
|
4788
4772
|
borderRadius: "md"
|
4789
4773
|
},
|
4790
|
-
/* @__PURE__ */
|
4774
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
4791
4775
|
react.Box,
|
4792
4776
|
{
|
4793
4777
|
width: "2.265rem",
|
@@ -4799,10 +4783,10 @@ var init_Drawer = __esm({
|
|
4799
4783
|
)
|
4800
4784
|
);
|
4801
4785
|
});
|
4802
|
-
DrawerContext =
|
4803
|
-
DrawerProvider = (props) => /* @__PURE__ */
|
4786
|
+
DrawerContext = React70__namespace.default.createContext(void 0);
|
4787
|
+
DrawerProvider = (props) => /* @__PURE__ */ React70__namespace.default.createElement(DrawerContext.Provider, { value: props.placement }, props.children);
|
4804
4788
|
useDrawerContext = () => {
|
4805
|
-
return
|
4789
|
+
return React70__namespace.default.useContext(DrawerContext);
|
4806
4790
|
};
|
4807
4791
|
}
|
4808
4792
|
});
|
@@ -4817,11 +4801,11 @@ var init_FullScreenDrawer = __esm({
|
|
4817
4801
|
title,
|
4818
4802
|
placement = "bottom",
|
4819
4803
|
leftButton = null,
|
4820
|
-
rightButton = /* @__PURE__ */
|
4804
|
+
rightButton = /* @__PURE__ */ React70__namespace.default.createElement(DrawerCloseButton2, null),
|
4821
4805
|
isOpen,
|
4822
4806
|
onClose
|
4823
4807
|
}) => {
|
4824
|
-
const [isContentBoxScrolled, setContentBoxScrolled] =
|
4808
|
+
const [isContentBoxScrolled, setContentBoxScrolled] = React70.useState(false);
|
4825
4809
|
const onContentScroll = (e) => {
|
4826
4810
|
const target = e.target;
|
4827
4811
|
if (target.scrollTop <= 0) {
|
@@ -4830,10 +4814,10 @@ var init_FullScreenDrawer = __esm({
|
|
4830
4814
|
}
|
4831
4815
|
setContentBoxScrolled(true);
|
4832
4816
|
};
|
4833
|
-
|
4817
|
+
React70.useEffect(() => {
|
4834
4818
|
setContentBoxScrolled(false);
|
4835
4819
|
}, [isOpen]);
|
4836
|
-
return /* @__PURE__ */
|
4820
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(exports.Drawer, { isOpen, onClose, placement, size: "full" }, /* @__PURE__ */ React70__namespace.default.createElement(react.DrawerOverlay, null), /* @__PURE__ */ React70__namespace.default.createElement(
|
4837
4821
|
react.DrawerContent,
|
4838
4822
|
{
|
4839
4823
|
height: "100vh",
|
@@ -4841,7 +4825,7 @@ var init_FullScreenDrawer = __esm({
|
|
4841
4825
|
backgroundPosition: "top",
|
4842
4826
|
backgroundRepeat: "no-repeat"
|
4843
4827
|
},
|
4844
|
-
/* @__PURE__ */
|
4828
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
4845
4829
|
DrawerTopMenu,
|
4846
4830
|
{
|
4847
4831
|
isScrolled: isContentBoxScrolled,
|
@@ -4850,7 +4834,7 @@ var init_FullScreenDrawer = __esm({
|
|
4850
4834
|
rightButton
|
4851
4835
|
}
|
4852
4836
|
),
|
4853
|
-
/* @__PURE__ */
|
4837
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.DrawerBody, { overflow: "auto", onScroll: onContentScroll }, children)
|
4854
4838
|
));
|
4855
4839
|
};
|
4856
4840
|
DrawerTopMenu = ({
|
@@ -4863,7 +4847,7 @@ var init_FullScreenDrawer = __esm({
|
|
4863
4847
|
"bg.default.light",
|
4864
4848
|
"bg.default.dark"
|
4865
4849
|
);
|
4866
|
-
return /* @__PURE__ */
|
4850
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
4867
4851
|
react.Flex,
|
4868
4852
|
{
|
4869
4853
|
width: "100%",
|
@@ -4876,8 +4860,8 @@ var init_FullScreenDrawer = __esm({
|
|
4876
4860
|
transition: "box-shadow 0.2s",
|
4877
4861
|
boxShadow: isScrolled ? "md" : void 0
|
4878
4862
|
},
|
4879
|
-
/* @__PURE__ */
|
4880
|
-
/* @__PURE__ */
|
4863
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { flex: "1" }, leftButton),
|
4864
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
4881
4865
|
react.DrawerHeader,
|
4882
4866
|
{
|
4883
4867
|
as: "h2",
|
@@ -4890,7 +4874,7 @@ var init_FullScreenDrawer = __esm({
|
|
4890
4874
|
},
|
4891
4875
|
title
|
4892
4876
|
),
|
4893
|
-
/* @__PURE__ */
|
4877
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { flex: "1" }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { width: "fit-content", marginLeft: "auto" }, rightButton))
|
4894
4878
|
);
|
4895
4879
|
};
|
4896
4880
|
DrawerCloseButton2 = () => {
|
@@ -4900,11 +4884,11 @@ var init_FullScreenDrawer = __esm({
|
|
4900
4884
|
`(min-width: ${tokens11__namespace.default.size.breakpoint.sm})`
|
4901
4885
|
);
|
4902
4886
|
if (isScreenSizeMinSm) {
|
4903
|
-
return /* @__PURE__ */
|
4887
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
4904
4888
|
exports.Button,
|
4905
4889
|
{
|
4906
4890
|
variant: "ghost",
|
4907
|
-
leftIcon: /* @__PURE__ */
|
4891
|
+
leftIcon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CloseFill24Icon, null),
|
4908
4892
|
onClick: onClose,
|
4909
4893
|
"aria-label": t2(texts21.close),
|
4910
4894
|
width: "fit-content",
|
@@ -4913,11 +4897,11 @@ var init_FullScreenDrawer = __esm({
|
|
4913
4897
|
t2(texts21.close)
|
4914
4898
|
);
|
4915
4899
|
}
|
4916
|
-
return /* @__PURE__ */
|
4900
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
4917
4901
|
exports.IconButton,
|
4918
4902
|
{
|
4919
4903
|
variant: "ghost",
|
4920
|
-
icon: /* @__PURE__ */
|
4904
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CloseFill30Icon, null),
|
4921
4905
|
onClick: onClose,
|
4922
4906
|
"aria-label": t2(texts21.close)
|
4923
4907
|
}
|
@@ -4947,7 +4931,7 @@ var init_SimpleDrawer = __esm({
|
|
4947
4931
|
title,
|
4948
4932
|
...props
|
4949
4933
|
}) => {
|
4950
|
-
return /* @__PURE__ */
|
4934
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(exports.Drawer, { placement, ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react.DrawerOverlay, null), /* @__PURE__ */ React70__namespace.default.createElement(exports.DrawerContent, null, /* @__PURE__ */ React70__namespace.default.createElement(react.DrawerCloseButton, null), title && /* @__PURE__ */ React70__namespace.default.createElement(exports.ModalHeader, null, title), /* @__PURE__ */ React70__namespace.default.createElement(react.DrawerBody, null, children)));
|
4951
4935
|
};
|
4952
4936
|
}
|
4953
4937
|
});
|
@@ -4986,7 +4970,7 @@ var init_Nudge = __esm({
|
|
4986
4970
|
}
|
4987
4971
|
return null;
|
4988
4972
|
}
|
4989
|
-
return /* @__PURE__ */
|
4973
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
4990
4974
|
react.Popover,
|
4991
4975
|
{
|
4992
4976
|
arrowSize: 12,
|
@@ -4994,8 +4978,8 @@ var init_Nudge = __esm({
|
|
4994
4978
|
defaultIsOpen: true,
|
4995
4979
|
...props
|
4996
4980
|
},
|
4997
|
-
/* @__PURE__ */
|
4998
|
-
/* @__PURE__ */
|
4981
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.PopoverAnchor, null, children),
|
4982
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.PopoverContent, { borderRadius: "sm" }, /* @__PURE__ */ React70__namespace.default.createElement(react.DarkMode, null, /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverArrow, null), /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverCloseButton, null), /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverBody, { margin: 1 }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { marginRight: 4 }, content), /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { marginTop: 1.5 }, actions ?? /* @__PURE__ */ React70__namespace.default.createElement(exports.ButtonGroup, null, /* @__PURE__ */ React70__namespace.default.createElement(exports.Button, { variant: "tertiary", size: "xs" }, t2(texts22.close)), /* @__PURE__ */ React70__namespace.default.createElement(exports.Button, { variant: "secondary", size: "xs", fontWeight: "bold" }, t2(texts22.showMe)))))))
|
4999
4983
|
);
|
5000
4984
|
};
|
5001
4985
|
texts22 = createTexts({
|
@@ -5025,23 +5009,23 @@ var init_WizardNudge = __esm({
|
|
5025
5009
|
content,
|
5026
5010
|
...props
|
5027
5011
|
}) => {
|
5028
|
-
const [currentStep, setCurrentStep] =
|
5012
|
+
const [currentStep, setCurrentStep] = React70.useState(1);
|
5029
5013
|
const totalSteps = content.length;
|
5030
5014
|
const isLastStep = totalSteps === currentStep;
|
5031
5015
|
const onNext = () => setCurrentStep((prev) => prev + 1);
|
5032
|
-
return /* @__PURE__ */
|
5016
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
5033
5017
|
exports.Nudge,
|
5034
5018
|
{
|
5035
5019
|
onClose,
|
5036
5020
|
name,
|
5037
5021
|
content: content[currentStep - 1],
|
5038
|
-
actions: /* @__PURE__ */
|
5022
|
+
actions: /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { gap: 3, alignItems: "center" }, /* @__PURE__ */ React70__namespace.default.createElement(
|
5039
5023
|
exports.ProgressIndicator,
|
5040
5024
|
{
|
5041
5025
|
activeStep: currentStep,
|
5042
5026
|
numberOfSteps: totalSteps
|
5043
5027
|
}
|
5044
|
-
), /* @__PURE__ */
|
5028
|
+
), /* @__PURE__ */ React70__namespace.default.createElement(react.Box, null, /* @__PURE__ */ React70__namespace.default.createElement(NextOrCloseButton, { isLastStep, onNext }))),
|
5045
5029
|
...props
|
5046
5030
|
},
|
5047
5031
|
children
|
@@ -5050,12 +5034,12 @@ var init_WizardNudge = __esm({
|
|
5050
5034
|
NextOrCloseButton = ({ isLastStep, onNext }) => {
|
5051
5035
|
const { onClose } = react.usePopoverContext();
|
5052
5036
|
const { t: t2 } = useTranslation();
|
5053
|
-
return /* @__PURE__ */
|
5037
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
5054
5038
|
exports.Button,
|
5055
5039
|
{
|
5056
5040
|
variant: "tertiary",
|
5057
5041
|
size: "xs",
|
5058
|
-
leftIcon: isLastStep ? void 0 : /* @__PURE__ */
|
5042
|
+
leftIcon: isLastStep ? void 0 : /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.ArrowRightFill18Icon, null),
|
5059
5043
|
onClick: isLastStep ? onClose : onNext,
|
5060
5044
|
width: "fit-content"
|
5061
5045
|
},
|
@@ -5133,7 +5117,7 @@ var init_Pagination = __esm({
|
|
5133
5117
|
}
|
5134
5118
|
}
|
5135
5119
|
return displayPageNumbers.map(
|
5136
|
-
(pageNumber, index) => pageNumber === "..." ? /* @__PURE__ */
|
5120
|
+
(pageNumber, index) => pageNumber === "..." ? /* @__PURE__ */ React70__namespace.default.createElement(react.ListItem, { key: index, sx: style.listItem }, /* @__PURE__ */ React70__namespace.default.createElement(react.Center, null, "...")) : /* @__PURE__ */ React70__namespace.default.createElement(
|
5137
5121
|
react.Link,
|
5138
5122
|
{
|
5139
5123
|
key: index,
|
@@ -5150,7 +5134,7 @@ var init_Pagination = __esm({
|
|
5150
5134
|
)
|
5151
5135
|
);
|
5152
5136
|
};
|
5153
|
-
return /* @__PURE__ */
|
5137
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { as: "nav", "aria-label": "pagination" }, /* @__PURE__ */ React70__namespace.default.createElement(
|
5154
5138
|
react.UnorderedList,
|
5155
5139
|
{
|
5156
5140
|
display: "flex",
|
@@ -5159,22 +5143,22 @@ var init_Pagination = __esm({
|
|
5159
5143
|
padding: 0,
|
5160
5144
|
margin: 0
|
5161
5145
|
},
|
5162
|
-
/* @__PURE__ */
|
5146
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.ListItem, { "aria-label": t2(texts24.previousPage) }, /* @__PURE__ */ React70__namespace.default.createElement(
|
5163
5147
|
exports.TextLink,
|
5164
5148
|
{
|
5165
5149
|
onClick: () => onPageChange(selectedPage - 1),
|
5166
5150
|
sx: hasPreviousPage ? style.link : style.disabled
|
5167
5151
|
},
|
5168
|
-
/* @__PURE__ */
|
5152
|
+
/* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.DropdownLeftFill18Icon, { sx: style.icon })
|
5169
5153
|
)),
|
5170
5154
|
renderPaginationButtons(),
|
5171
|
-
/* @__PURE__ */
|
5155
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.ListItem, { "aria-label": t2(texts24.nextPage) }, /* @__PURE__ */ React70__namespace.default.createElement(
|
5172
5156
|
exports.TextLink,
|
5173
5157
|
{
|
5174
5158
|
onClick: () => onPageChange(selectedPage + 1),
|
5175
5159
|
sx: hasNextPage ? style.link : style.disabled
|
5176
5160
|
},
|
5177
|
-
/* @__PURE__ */
|
5161
|
+
/* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.DropdownRightFill18Icon, { sx: style.icon })
|
5178
5162
|
))
|
5179
5163
|
));
|
5180
5164
|
};
|
@@ -5207,7 +5191,7 @@ var init_ProgressDot = __esm({
|
|
5207
5191
|
init_src();
|
5208
5192
|
ProgressDot = ({ isActive }) => {
|
5209
5193
|
const style = react.useMultiStyleConfig("ProgressIndicator");
|
5210
|
-
return /* @__PURE__ */
|
5194
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
5211
5195
|
react.Box,
|
5212
5196
|
{
|
5213
5197
|
as: "svg",
|
@@ -5217,7 +5201,7 @@ var init_ProgressDot = __esm({
|
|
5217
5201
|
viewBox: "0 0 100 100",
|
5218
5202
|
"aria-current": isActive ? "step" : void 0
|
5219
5203
|
},
|
5220
|
-
/* @__PURE__ */
|
5204
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { as: "circle", cx: "50", cy: "50", r: "50" })
|
5221
5205
|
);
|
5222
5206
|
};
|
5223
5207
|
}
|
@@ -5233,7 +5217,7 @@ var init_ProgressIndicator = __esm({
|
|
5233
5217
|
}) => {
|
5234
5218
|
const { t: t2 } = useTranslation();
|
5235
5219
|
const style = react.useMultiStyleConfig("ProgressIndicator");
|
5236
|
-
return /* @__PURE__ */
|
5220
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
5237
5221
|
react.Box,
|
5238
5222
|
{
|
5239
5223
|
__css: style.root,
|
@@ -5243,7 +5227,7 @@ var init_ProgressIndicator = __esm({
|
|
5243
5227
|
"aria-valuenow": activeStep,
|
5244
5228
|
"aria-valuetext": t2(texts25.stepsOf(activeStep, numberOfSteps))
|
5245
5229
|
},
|
5246
|
-
/* @__PURE__ */
|
5230
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { __css: style.container }, Array.from({ length: numberOfSteps }, (_, i) => /* @__PURE__ */ React70__namespace.default.createElement(
|
5247
5231
|
ProgressDot,
|
5248
5232
|
{
|
5249
5233
|
key: i,
|
@@ -5284,7 +5268,7 @@ var init_SporProvider = __esm({
|
|
5284
5268
|
}) => {
|
5285
5269
|
const brandCustomizations = exports.brandTheme[brand] ?? {};
|
5286
5270
|
const extendedTheme = deepmerge__default.default(theme3, brandCustomizations);
|
5287
|
-
return /* @__PURE__ */
|
5271
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(LanguageProvider, { language }, /* @__PURE__ */ React70__namespace.default.createElement(react.ChakraProvider, { theme: extendedTheme, ...props }, /* @__PURE__ */ React70__namespace.default.createElement(react$1.Global, { styles: exports.fontFaces }), children));
|
5288
5272
|
};
|
5289
5273
|
}
|
5290
5274
|
});
|
@@ -5298,7 +5282,7 @@ var init_provider = __esm({
|
|
5298
5282
|
var StepperContext, StepperProvider, useStepper;
|
5299
5283
|
var init_StepperContext = __esm({
|
5300
5284
|
"src/stepper/StepperContext.tsx"() {
|
5301
|
-
StepperContext =
|
5285
|
+
StepperContext = React70__namespace.default.createContext(null);
|
5302
5286
|
StepperProvider = ({
|
5303
5287
|
activeStep,
|
5304
5288
|
children,
|
@@ -5306,7 +5290,7 @@ var init_StepperContext = __esm({
|
|
5306
5290
|
numberOfSteps,
|
5307
5291
|
variant
|
5308
5292
|
}) => {
|
5309
|
-
return /* @__PURE__ */
|
5293
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
5310
5294
|
StepperContext.Provider,
|
5311
5295
|
{
|
5312
5296
|
value: { activeStep, onClick, numberOfSteps, variant }
|
@@ -5315,7 +5299,7 @@ var init_StepperContext = __esm({
|
|
5315
5299
|
);
|
5316
5300
|
};
|
5317
5301
|
useStepper = () => {
|
5318
|
-
const context =
|
5302
|
+
const context = React70__namespace.default.useContext(StepperContext);
|
5319
5303
|
if (!context) {
|
5320
5304
|
throw new Error(
|
5321
5305
|
"useStepper must be used within a StepperProvider. Most likely, you forgot to wrap your StepperStep in a Stepper component"
|
@@ -5349,7 +5333,7 @@ var init_Stepper = __esm({
|
|
5349
5333
|
const { t: t2 } = useTranslation();
|
5350
5334
|
const hideBackButtonOnFirstStep = activeStep === 1 && !onBackButtonClick;
|
5351
5335
|
const shownHeading = heading || title;
|
5352
|
-
return /* @__PURE__ */
|
5336
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: style.root }, /* @__PURE__ */ React70__namespace.default.createElement(
|
5353
5337
|
StepperProvider,
|
5354
5338
|
{
|
5355
5339
|
onClick,
|
@@ -5357,7 +5341,7 @@ var init_Stepper = __esm({
|
|
5357
5341
|
variant,
|
5358
5342
|
numberOfSteps
|
5359
5343
|
},
|
5360
|
-
/* @__PURE__ */
|
5344
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: style.container }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: style.innerContainer }, /* @__PURE__ */ React70__namespace.default.createElement(
|
5361
5345
|
react.Flex,
|
5362
5346
|
{
|
5363
5347
|
justifyContent: "space-between",
|
@@ -5365,11 +5349,11 @@ var init_Stepper = __esm({
|
|
5365
5349
|
gap: 2,
|
5366
5350
|
flex: 1
|
5367
5351
|
},
|
5368
|
-
/* @__PURE__ */
|
5352
|
+
/* @__PURE__ */ React70__namespace.default.createElement(
|
5369
5353
|
exports.IconButton,
|
5370
5354
|
{
|
5371
5355
|
"aria-label": t2(texts26.back),
|
5372
|
-
icon: /* @__PURE__ */
|
5356
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.ArrowLeftFill24Icon, null),
|
5373
5357
|
variant: "ghost",
|
5374
5358
|
size: "sm",
|
5375
5359
|
visibility: hideBackButtonOnFirstStep ? "hidden" : "visible",
|
@@ -5382,9 +5366,9 @@ var init_Stepper = __esm({
|
|
5382
5366
|
}
|
5383
5367
|
}
|
5384
5368
|
),
|
5385
|
-
shownHeading && /* @__PURE__ */
|
5386
|
-
/* @__PURE__ */
|
5387
|
-
)), /* @__PURE__ */
|
5369
|
+
shownHeading && /* @__PURE__ */ React70__namespace.default.createElement(exports.Text, { flex: 1, variant: "sm", as: headingLevel, sx: style.title }, shownHeading),
|
5370
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: style.stepCounter }, t2(texts26.stepsOf(activeStep, numberOfSteps)))
|
5371
|
+
)), /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { justifyContent: "center", display: ["none", null, "flex"] }, steps.map((step, index) => /* @__PURE__ */ React70__namespace.default.createElement(
|
5388
5372
|
exports.StepperStep,
|
5389
5373
|
{
|
5390
5374
|
key: index,
|
@@ -5436,14 +5420,14 @@ var init_StepperStep = __esm({
|
|
5436
5420
|
);
|
5437
5421
|
const iconColor = react.useColorModeValue("blackAlpha.200", "whiteAlpha.200");
|
5438
5422
|
const isDisabled = state2 !== "active" && isDisabledOverride || state2 === "disabled";
|
5439
|
-
return /* @__PURE__ */
|
5423
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { sx: style.stepContainer }, stepNumber > 1 && /* @__PURE__ */ React70__namespace.default.createElement(
|
5440
5424
|
sporIconReact.DropdownRightFill18Icon,
|
5441
5425
|
{
|
5442
5426
|
marginX: 5,
|
5443
5427
|
display: ["none", null, "block"],
|
5444
5428
|
color: iconColor
|
5445
5429
|
}
|
5446
|
-
), isDisabled ? /* @__PURE__ */
|
5430
|
+
), isDisabled ? /* @__PURE__ */ React70__namespace.default.createElement(
|
5447
5431
|
exports.Text,
|
5448
5432
|
{
|
5449
5433
|
variant: "xs",
|
@@ -5453,7 +5437,7 @@ var init_StepperStep = __esm({
|
|
5453
5437
|
paddingX: 2
|
5454
5438
|
},
|
5455
5439
|
children
|
5456
|
-
) : /* @__PURE__ */
|
5440
|
+
) : /* @__PURE__ */ React70__namespace.default.createElement(
|
5457
5441
|
exports.Button,
|
5458
5442
|
{
|
5459
5443
|
size: "xs",
|
@@ -5489,7 +5473,7 @@ exports.Tabs = void 0;
|
|
5489
5473
|
var init_Tabs = __esm({
|
5490
5474
|
"src/tab/Tabs.tsx"() {
|
5491
5475
|
exports.Tabs = react.forwardRef((props, ref) => {
|
5492
|
-
return /* @__PURE__ */
|
5476
|
+
return /* @__PURE__ */ React70__namespace.createElement(react.Tabs, { ...props, ref });
|
5493
5477
|
});
|
5494
5478
|
}
|
5495
5479
|
});
|
@@ -5511,7 +5495,7 @@ var init_Table = __esm({
|
|
5511
5495
|
"src/table/Table.tsx"() {
|
5512
5496
|
exports.Table = react.forwardRef((props, ref) => {
|
5513
5497
|
const { variant, size: size2, colorScheme, children, ...rest } = props;
|
5514
|
-
return /* @__PURE__ */
|
5498
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { ...rest, ...getStyleProps(props) }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { overflowX: "auto" }, /* @__PURE__ */ React70__namespace.default.createElement(
|
5515
5499
|
react.Table,
|
5516
5500
|
{
|
5517
5501
|
variant,
|
@@ -6255,16 +6239,16 @@ function defineCssVars(scope, keys2) {
|
|
6255
6239
|
function defineStyle(styles3) {
|
6256
6240
|
return styles3;
|
6257
6241
|
}
|
6258
|
-
function defineStyleConfig(
|
6259
|
-
return
|
6242
|
+
function defineStyleConfig(config43) {
|
6243
|
+
return config43;
|
6260
6244
|
}
|
6261
6245
|
function createMultiStyleConfigHelpers(parts19) {
|
6262
6246
|
return {
|
6263
|
-
definePartsStyle(
|
6264
|
-
return
|
6247
|
+
definePartsStyle(config43) {
|
6248
|
+
return config43;
|
6265
6249
|
},
|
6266
|
-
defineMultiStyleConfig(
|
6267
|
-
return { parts: parts19, ...
|
6250
|
+
defineMultiStyleConfig(config43) {
|
6251
|
+
return { parts: parts19, ...config43 };
|
6268
6252
|
}
|
6269
6253
|
};
|
6270
6254
|
}
|
@@ -15342,175 +15326,7 @@ var init_static_card = __esm({
|
|
15342
15326
|
}
|
15343
15327
|
default:
|
15344
15328
|
return {
|
15345
|
-
backgroundColor: ((_a6 = colors2[props.colorScheme]) == null ? void 0 : _a6[100]) ?? "
|
15346
|
-
...baseText("default", props)
|
15347
|
-
};
|
15348
|
-
}
|
15349
|
-
};
|
15350
|
-
}
|
15351
|
-
});
|
15352
|
-
function getColorSchemeClickableProps2(props) {
|
15353
|
-
switch (props.colorScheme) {
|
15354
|
-
case "default":
|
15355
|
-
return {
|
15356
|
-
...floatingBorder("default", props)
|
15357
|
-
};
|
15358
|
-
case "accent":
|
15359
|
-
return {
|
15360
|
-
...accentBackground("default", props),
|
15361
|
-
...accentText("default", props),
|
15362
|
-
_hover: {
|
15363
|
-
...accentBackground("hover", props)
|
15364
|
-
},
|
15365
|
-
_active: {
|
15366
|
-
...accentBackground("active", props)
|
15367
|
-
}
|
15368
|
-
};
|
15369
|
-
}
|
15370
|
-
}
|
15371
|
-
var config43, pressable_card_default, getColorSchemeBaseProps3, getColorSchemeHoverProps2, getColorSchemeActiveProps2;
|
15372
|
-
var init_pressable_card = __esm({
|
15373
|
-
"src/theme/components/pressable-card.ts"() {
|
15374
|
-
init_base_utils();
|
15375
|
-
init_floating_utils();
|
15376
|
-
init_focus_utils();
|
15377
|
-
init_accent_utils();
|
15378
|
-
config43 = react.defineStyleConfig({
|
15379
|
-
baseStyle: (props) => ({
|
15380
|
-
appearance: "none",
|
15381
|
-
border: "none",
|
15382
|
-
overflow: "hidden",
|
15383
|
-
fontSize: "inherit",
|
15384
|
-
display: "block",
|
15385
|
-
borderRadius: "md",
|
15386
|
-
...getColorSchemeBaseProps3(props),
|
15387
|
-
...getColorSchemeClickableProps2(props),
|
15388
|
-
...focusVisibleStyles(props),
|
15389
|
-
...getColorSchemeActiveProps2(props),
|
15390
|
-
_hover: getColorSchemeHoverProps2(props),
|
15391
|
-
_disabled: {
|
15392
|
-
...baseBackground("disabled", props),
|
15393
|
-
...baseBorder("disabled", props),
|
15394
|
-
...baseText("disabled", props),
|
15395
|
-
pointerEvents: "none"
|
15396
|
-
}
|
15397
|
-
}),
|
15398
|
-
variants: {
|
15399
|
-
base: (props) => ({
|
15400
|
-
...baseBackground("default", props),
|
15401
|
-
_hover: {
|
15402
|
-
...baseBackground("hover", props)
|
15403
|
-
},
|
15404
|
-
_active: {
|
15405
|
-
...baseBackground("active", props)
|
15406
|
-
}
|
15407
|
-
}),
|
15408
|
-
accent: (props) => ({
|
15409
|
-
...accentBackground("default", props),
|
15410
|
-
_hover: {
|
15411
|
-
...accentBackground("hover", props)
|
15412
|
-
},
|
15413
|
-
_active: {
|
15414
|
-
...accentBackground("active", props)
|
15415
|
-
}
|
15416
|
-
}),
|
15417
|
-
floating: (props) => ({
|
15418
|
-
...floatingBackground("default", props),
|
15419
|
-
_hover: {
|
15420
|
-
...floatingBackground("hover", props)
|
15421
|
-
},
|
15422
|
-
_active: {
|
15423
|
-
...floatingBackground("active", props)
|
15424
|
-
}
|
15425
|
-
})
|
15426
|
-
},
|
15427
|
-
sizes: {
|
15428
|
-
sm: {
|
15429
|
-
boxShadow: "sm",
|
15430
|
-
_hover: {
|
15431
|
-
boxShadow: "md"
|
15432
|
-
},
|
15433
|
-
_active: {
|
15434
|
-
boxShadow: "none"
|
15435
|
-
}
|
15436
|
-
},
|
15437
|
-
lg: {
|
15438
|
-
boxShadow: "md",
|
15439
|
-
_hover: {
|
15440
|
-
boxShadow: "lg"
|
15441
|
-
},
|
15442
|
-
_active: {
|
15443
|
-
boxShadow: "sm"
|
15444
|
-
}
|
15445
|
-
}
|
15446
|
-
}
|
15447
|
-
});
|
15448
|
-
pressable_card_default = config43;
|
15449
|
-
getColorSchemeBaseProps3 = (props) => {
|
15450
|
-
switch (props.colorScheme) {
|
15451
|
-
case "default":
|
15452
|
-
return {
|
15453
|
-
...baseBorder("default", props),
|
15454
|
-
backgroundColor: themeTools.mode(
|
15455
|
-
"white",
|
15456
|
-
`color-mix(in srgb, white 10%, var(--spor-colors-bg-default-dark))`
|
15457
|
-
)(props),
|
15458
|
-
color: "inherit"
|
15459
|
-
};
|
15460
|
-
case "accent":
|
15461
|
-
return {
|
15462
|
-
...accentBackground("default", props),
|
15463
|
-
...accentText("default", props),
|
15464
|
-
_hover: {
|
15465
|
-
...accentBackground("hover", props)
|
15466
|
-
},
|
15467
|
-
_active: {
|
15468
|
-
...accentBackground("active", props)
|
15469
|
-
}
|
15470
|
-
};
|
15471
|
-
}
|
15472
|
-
};
|
15473
|
-
getColorSchemeHoverProps2 = (props) => {
|
15474
|
-
switch (props.colorScheme) {
|
15475
|
-
case "default":
|
15476
|
-
return {
|
15477
|
-
backgroundColor: themeTools.mode(
|
15478
|
-
"white",
|
15479
|
-
`color-mix(in srgb, white 20%, var(--spor-colors-bg-default-dark))`
|
15480
|
-
)(props),
|
15481
|
-
...floatingBorder("hover", props)
|
15482
|
-
};
|
15483
|
-
case "accent":
|
15484
|
-
return {
|
15485
|
-
...accentBackground("default", props),
|
15486
|
-
...accentText("default", props),
|
15487
|
-
_hover: {
|
15488
|
-
...accentBackground("hover", props)
|
15489
|
-
},
|
15490
|
-
_active: {
|
15491
|
-
...accentBackground("active", props)
|
15492
|
-
}
|
15493
|
-
};
|
15494
|
-
}
|
15495
|
-
};
|
15496
|
-
getColorSchemeActiveProps2 = (props) => {
|
15497
|
-
const { colorScheme } = props;
|
15498
|
-
switch (colorScheme) {
|
15499
|
-
case "default":
|
15500
|
-
return {
|
15501
|
-
backgroundColor: themeTools.mode("bg.tertiary.light", `bg.default.dark`)(props),
|
15502
|
-
...floatingBorder("active", props)
|
15503
|
-
};
|
15504
|
-
case "accent":
|
15505
|
-
return {
|
15506
|
-
...accentBackground("default", props),
|
15507
|
-
...accentText("default", props),
|
15508
|
-
_hover: {
|
15509
|
-
...accentBackground("hover", props)
|
15510
|
-
},
|
15511
|
-
_active: {
|
15512
|
-
...accentBackground("active", props)
|
15513
|
-
}
|
15329
|
+
backgroundColor: ((_a6 = colors2[props.colorScheme]) == null ? void 0 : _a6[100]) ?? "platinum"
|
15514
15330
|
};
|
15515
15331
|
}
|
15516
15332
|
};
|
@@ -15550,7 +15366,6 @@ __export(components_exports, {
|
|
15550
15366
|
NumericStepper: () => numeric_stepper_default,
|
15551
15367
|
Pagination: () => pagination_default,
|
15552
15368
|
Popover: () => popover_default,
|
15553
|
-
PressableCard: () => pressable_card_default,
|
15554
15369
|
ProgressBar: () => progress_bar_default,
|
15555
15370
|
ProgressIndicator: () => progress_indicator_default,
|
15556
15371
|
Radio: () => radio_default,
|
@@ -15609,7 +15424,6 @@ var init_components = __esm({
|
|
15609
15424
|
init_textarea();
|
15610
15425
|
init_toast();
|
15611
15426
|
init_static_card();
|
15612
|
-
init_pressable_card();
|
15613
15427
|
init_travel_tag();
|
15614
15428
|
}
|
15615
15429
|
});
|
@@ -15730,12 +15544,12 @@ var init_BaseToast = __esm({
|
|
15730
15544
|
init_src();
|
15731
15545
|
BaseToast = ({ children, variant, id }) => {
|
15732
15546
|
const styles3 = react.useStyleConfig("Toast", { variant });
|
15733
|
-
return /* @__PURE__ */
|
15547
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(react.Flex, { sx: styles3, id }, /* @__PURE__ */ React70__namespace.default.createElement(ToastIcon, { variant }), children);
|
15734
15548
|
};
|
15735
15549
|
ToastIcon = ({ variant }) => {
|
15736
15550
|
const Icon = getIcon3(variant);
|
15737
15551
|
const { t: t2 } = useTranslation();
|
15738
|
-
return /* @__PURE__ */
|
15552
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
15739
15553
|
Icon,
|
15740
15554
|
{
|
15741
15555
|
flexShrink: 0,
|
@@ -15790,7 +15604,7 @@ var init_ActionToast = __esm({
|
|
15790
15604
|
buttonText,
|
15791
15605
|
id
|
15792
15606
|
}) => {
|
15793
|
-
return /* @__PURE__ */
|
15607
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(BaseToast, { variant, id }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { marginRight: 2, flexGrow: "1" }, children), /* @__PURE__ */ React70__namespace.default.createElement(exports.Button, { variant: "tertiary", size: "sm", onClick }, buttonText));
|
15794
15608
|
};
|
15795
15609
|
}
|
15796
15610
|
});
|
@@ -15807,13 +15621,13 @@ var init_ClosableToast = __esm({
|
|
15807
15621
|
}) => {
|
15808
15622
|
const styles3 = react.useMultiStyleConfig("Toast", { variant });
|
15809
15623
|
const { t: t2 } = useTranslation();
|
15810
|
-
return /* @__PURE__ */
|
15624
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(BaseToast, { variant, id }, /* @__PURE__ */ React70__namespace.default.createElement(react.Box, { flexGrow: "1" }, children), /* @__PURE__ */ React70__namespace.default.createElement(
|
15811
15625
|
exports.IconButton,
|
15812
15626
|
{
|
15813
15627
|
sx: styles3.dismissButton,
|
15814
15628
|
variant: "ghost",
|
15815
15629
|
"aria-label": t2(texts28.dismiss),
|
15816
|
-
icon: /* @__PURE__ */
|
15630
|
+
icon: /* @__PURE__ */ React70__namespace.default.createElement(sporIconReact.CloseFill18Icon, null),
|
15817
15631
|
onClick: onClose
|
15818
15632
|
}
|
15819
15633
|
));
|
@@ -15836,7 +15650,7 @@ var init_useToast = __esm({
|
|
15836
15650
|
init_ClosableToast();
|
15837
15651
|
exports.useToast = () => {
|
15838
15652
|
const toast = react.useToast();
|
15839
|
-
const wrappedToast =
|
15653
|
+
const wrappedToast = React70.useCallback((opts) => {
|
15840
15654
|
const Toast = getToastComponent(opts);
|
15841
15655
|
toast({
|
15842
15656
|
...opts,
|
@@ -15847,7 +15661,7 @@ var init_useToast = __esm({
|
|
15847
15661
|
};
|
15848
15662
|
getToastComponent = (opts) => {
|
15849
15663
|
if ("isClosable" in opts && opts.isClosable) {
|
15850
|
-
return ({ onClose, id }) => /* @__PURE__ */
|
15664
|
+
return ({ onClose, id }) => /* @__PURE__ */ React70__namespace.default.createElement(
|
15851
15665
|
ClosableToast,
|
15852
15666
|
{
|
15853
15667
|
id,
|
@@ -15863,7 +15677,7 @@ var init_useToast = __esm({
|
|
15863
15677
|
);
|
15864
15678
|
}
|
15865
15679
|
if ("buttonText" in opts) {
|
15866
|
-
return ({ id }) => /* @__PURE__ */
|
15680
|
+
return ({ id }) => /* @__PURE__ */ React70__namespace.default.createElement(
|
15867
15681
|
ActionToast,
|
15868
15682
|
{
|
15869
15683
|
id,
|
@@ -15874,7 +15688,7 @@ var init_useToast = __esm({
|
|
15874
15688
|
opts.text
|
15875
15689
|
);
|
15876
15690
|
}
|
15877
|
-
return ({ id }) => /* @__PURE__ */
|
15691
|
+
return ({ id }) => /* @__PURE__ */ React70__namespace.default.createElement(BaseToast, { id, variant: opts.variant }, opts.text);
|
15878
15692
|
};
|
15879
15693
|
}
|
15880
15694
|
});
|
@@ -15899,7 +15713,7 @@ var init_Tooltip = __esm({
|
|
15899
15713
|
withCloseButton = false,
|
15900
15714
|
...props
|
15901
15715
|
}) => {
|
15902
|
-
return /* @__PURE__ */
|
15716
|
+
return /* @__PURE__ */ React70__namespace.default.createElement(
|
15903
15717
|
react.Popover,
|
15904
15718
|
{
|
15905
15719
|
onClose,
|
@@ -15911,8 +15725,8 @@ var init_Tooltip = __esm({
|
|
15911
15725
|
arrowShadowColor: "none",
|
15912
15726
|
...props
|
15913
15727
|
},
|
15914
|
-
/* @__PURE__ */
|
15915
|
-
/* @__PURE__ */
|
15728
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.PopoverTrigger, null, children),
|
15729
|
+
/* @__PURE__ */ React70__namespace.default.createElement(react.PopoverContent, null, /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverArrow, null), withCloseButton && /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverCloseButton, null), /* @__PURE__ */ React70__namespace.default.createElement(react.PopoverBody, null, content))
|
15916
15730
|
);
|
15917
15731
|
};
|
15918
15732
|
}
|
@@ -15985,8 +15799,8 @@ function useSizes({
|
|
15985
15799
|
getNodes,
|
15986
15800
|
observeMutation = true
|
15987
15801
|
}) {
|
15988
|
-
const [sizes26, setSizes] =
|
15989
|
-
const [count, setCount] =
|
15802
|
+
const [sizes26, setSizes] = React70.useState([]);
|
15803
|
+
const [count, setCount] = React70.useState(0);
|
15990
15804
|
useSafeLayoutEffect(() => {
|
15991
15805
|
const elements = getNodes();
|
15992
15806
|
const cleanups = elements.map(
|
@@ -16034,7 +15848,7 @@ var init_dist9 = __esm({
|
|
16034
15848
|
"../../node_modules/@chakra-ui/react-use-size/dist/index.mjs"() {
|
16035
15849
|
"use client";
|
16036
15850
|
init_dist8();
|
16037
|
-
useSafeLayoutEffect = Boolean(globalThis == null ? void 0 : globalThis.document) ?
|
15851
|
+
useSafeLayoutEffect = Boolean(globalThis == null ? void 0 : globalThis.document) ? React70.useLayoutEffect : React70.useEffect;
|
16038
15852
|
}
|
16039
15853
|
});
|
16040
15854
|
var init_externals = __esm({
|