@vygruppen/spor-react 12.8.0 → 12.8.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  var react = require('@chakra-ui/react');
4
4
  var sporIconReact = require('@vygruppen/spor-icon-react');
5
- var React28 = require('react');
5
+ var React27 = require('react');
6
6
  var jsxRuntime = require('react/jsx-runtime');
7
7
  var sporLoader = require('@vygruppen/spor-loader');
8
8
  var ReactLottie = require('lottie-react');
@@ -40,7 +40,7 @@ function _interopNamespace(e) {
40
40
  return Object.freeze(n);
41
41
  }
42
42
 
43
- var React28__namespace = /*#__PURE__*/_interopNamespace(React28);
43
+ var React27__namespace = /*#__PURE__*/_interopNamespace(React27);
44
44
  var ReactLottie__default = /*#__PURE__*/_interopDefault(ReactLottie);
45
45
  var tokens23__namespace = /*#__PURE__*/_interopNamespace(tokens23);
46
46
  var tokens4__default = /*#__PURE__*/_interopDefault(tokens4);
@@ -76,7 +76,7 @@ var warnAboutMismatchingIcon = ({
76
76
  }
77
77
  }
78
78
  };
79
- var Accordion = React28.forwardRef(
79
+ var Accordion = React27.forwardRef(
80
80
  (props, ref) => {
81
81
  const { variant = "core", children, gap = 2, ...rest } = props;
82
82
  const recipe = react.useSlotRecipe({ key: "accordion" });
@@ -93,7 +93,7 @@ var Accordion = React28.forwardRef(
93
93
  );
94
94
  }
95
95
  );
96
- var AccordionItemTrigger = React28.forwardRef(function AccordionItemTrigger2(props, ref) {
96
+ var AccordionItemTrigger = React27.forwardRef(function AccordionItemTrigger2(props, ref) {
97
97
  const {
98
98
  startElement,
99
99
  children,
@@ -112,7 +112,7 @@ var AccordionItemTrigger = React28.forwardRef(function AccordionItemTrigger2(pro
112
112
  showChevron && /* @__PURE__ */ jsxRuntime.jsx(react.Accordion.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(sporIconReact.DropdownDownFill24Icon, {}) })
113
113
  ] }) });
114
114
  });
115
- var AccordionItemContent = React28.forwardRef(function AccordionItemContent2(props, ref) {
115
+ var AccordionItemContent = React27.forwardRef(function AccordionItemContent2(props, ref) {
116
116
  const { children } = props;
117
117
  const recipe = react.useSlotRecipe({ key: "accordion" });
118
118
  const styles = recipe();
@@ -120,7 +120,7 @@ var AccordionItemContent = React28.forwardRef(function AccordionItemContent2(pro
120
120
  });
121
121
  Accordion.displayName = "Accordion";
122
122
  var AccordionItem = react.Accordion.Item;
123
- var Expandable = React28.forwardRef(
123
+ var Expandable = React27.forwardRef(
124
124
  (props, ref) => {
125
125
  const { title, children, headingLevel, startElement, ...rest } = props;
126
126
  return /* @__PURE__ */ jsxRuntime.jsx(Accordion, { ref, ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -165,7 +165,7 @@ var Language = /* @__PURE__ */ ((Language3) => {
165
165
  Language3["English"] = "en";
166
166
  return Language3;
167
167
  })(Language || {});
168
- var LanguageContext = React28.createContext(void 0);
168
+ var LanguageContext = React27.createContext(void 0);
169
169
  function LanguageProvider({
170
170
  language,
171
171
  children
@@ -173,7 +173,7 @@ function LanguageProvider({
173
173
  return /* @__PURE__ */ jsxRuntime.jsx(LanguageContext.Provider, { value: language, children });
174
174
  }
175
175
  function useLanguage() {
176
- const language = React28.useContext(LanguageContext);
176
+ const language = React27.useContext(LanguageContext);
177
177
  if (!language) {
178
178
  throw new Error("Please wrap your application in a LanguageProvider");
179
179
  }
@@ -191,8 +191,8 @@ function createTexts(texts27) {
191
191
  }
192
192
  var hydrating = true;
193
193
  function useHydrated() {
194
- const [hydrated, setHydrated] = React28.useState(() => !hydrating);
195
- React28.useEffect(function hydrate() {
194
+ const [hydrated, setHydrated] = React27.useState(() => !hydrating);
195
+ React27.useEffect(function hydrate() {
196
196
  hydrating = false;
197
197
  setHydrated(true);
198
198
  }, []);
@@ -335,11 +335,11 @@ var LightSpinner = ({
335
335
  ] });
336
336
  };
337
337
  var useRotatingLabel = ({ label, delay }) => {
338
- const loadingTextArray = React28.useMemo(
338
+ const loadingTextArray = React27.useMemo(
339
339
  () => Array.isArray(label) ? label : [label],
340
340
  [label]
341
341
  );
342
- const [currentLoadingTextIndex, setCurrentLoadingTextIndex] = React28.useState(0);
342
+ const [currentLoadingTextIndex, setCurrentLoadingTextIndex] = React27.useState(0);
343
343
  usehooksTs.useInterval(() => {
344
344
  setCurrentLoadingTextIndex(
345
345
  (prevIndex) => (prevIndex + 1) % loadingTextArray.length
@@ -347,7 +347,7 @@ var useRotatingLabel = ({ label, delay }) => {
347
347
  }, delay);
348
348
  return loadingTextArray[currentLoadingTextIndex];
349
349
  };
350
- var ProgressBar = React28.forwardRef(
350
+ var ProgressBar = React27.forwardRef(
351
351
  ({
352
352
  value,
353
353
  label,
@@ -393,9 +393,9 @@ var progressLoaderRecipe = react.defineRecipe({
393
393
  }
394
394
  });
395
395
  var usePathLength = (value) => {
396
- const pathRef = React28.useRef(null);
397
- const [pathLength, setPathLength] = React28.useState(0);
398
- React28.useEffect(() => {
396
+ const pathRef = React27.useRef(null);
397
+ const [pathLength, setPathLength] = React27.useState(0);
398
+ React27.useEffect(() => {
399
399
  if (pathRef.current) {
400
400
  const totalLength = pathRef.current.getTotalLength();
401
401
  setPathLength(totalLength);
@@ -405,7 +405,7 @@ var usePathLength = (value) => {
405
405
  return { pathRef, pathLength, progressOffset };
406
406
  };
407
407
  var ProgressLoaderWrapper = react.chakra("div", progressLoaderRecipe);
408
- var ProgressLoader = React28.forwardRef(
408
+ var ProgressLoader = React27.forwardRef(
409
409
  ({
410
410
  value,
411
411
  label,
@@ -429,7 +429,7 @@ var ProgressLoader = React28.forwardRef(
429
429
  pathLength: progressPathLength,
430
430
  progressOffset
431
431
  } = usePathLength(value);
432
- const id = React28.useId();
432
+ const id = React27.useId();
433
433
  return /* @__PURE__ */ jsxRuntime.jsxs(
434
434
  ProgressLoaderWrapper,
435
435
  {
@@ -509,7 +509,7 @@ var texts = createTexts({
509
509
  en: `${value}% done`
510
510
  })
511
511
  });
512
- var SkeletonCircle = React28__namespace.forwardRef(function SkeletonCircle2(props, ref) {
512
+ var SkeletonCircle = React27__namespace.forwardRef(function SkeletonCircle2(props, ref) {
513
513
  const recipe = react.useRecipe({ key: "skeleton" });
514
514
  const [recipeProps, restProps] = recipe.splitVariantProps({
515
515
  loading: true,
@@ -519,7 +519,7 @@ var SkeletonCircle = React28__namespace.forwardRef(function SkeletonCircle2(prop
519
519
  const { size, css, ...rest } = restProps;
520
520
  return /* @__PURE__ */ jsxRuntime.jsx(react.Circle, { size, asChild: true, ref, children: /* @__PURE__ */ jsxRuntime.jsx(react.Skeleton, { css: { ...recipe(recipeProps), ...css }, ...rest }) });
521
521
  });
522
- var SkeletonText = React28.forwardRef(
522
+ var SkeletonText = React27.forwardRef(
523
523
  function SkeletonText2(props, ref) {
524
524
  const recipe = react.useRecipe({ key: "skeleton" });
525
525
  const [recipeProps, restProps] = recipe.splitVariantProps({
@@ -540,7 +540,7 @@ var SkeletonText = React28.forwardRef(
540
540
  )) });
541
541
  }
542
542
  );
543
- var Skeleton = React28.forwardRef(
543
+ var Skeleton = React27.forwardRef(
544
544
  function SkeletonText3(props, ref) {
545
545
  const recipe = react.useRecipe({ key: "skeleton" });
546
546
  const [recipeProps, restProps] = recipe.splitVariantProps({
@@ -578,7 +578,7 @@ var LoadingContent = ({
578
578
  loadingText && /* @__PURE__ */ jsxRuntime.jsx(react.Box, { children: loadingText })
579
579
  ] })
580
580
  ] });
581
- var Button = React28.forwardRef(
581
+ var Button = React27.forwardRef(
582
582
  ({
583
583
  loading,
584
584
  disabled,
@@ -611,7 +611,7 @@ var Button = React28.forwardRef(
611
611
  variant,
612
612
  size,
613
613
  ...rest,
614
- children: rest.asChild ? React28.cloneElement(children, {
614
+ children: rest.asChild ? React27.cloneElement(children, {
615
615
  children: renderContent()
616
616
  }) : renderContent()
617
617
  }
@@ -627,7 +627,7 @@ var texts2 = createTexts({
627
627
  sv: "Laddar\u2026"
628
628
  }
629
629
  });
630
- var ButtonGroup = React28.forwardRef(
630
+ var ButtonGroup = React27.forwardRef(
631
631
  (props, ref) => {
632
632
  const recipe = react.useRecipe({ key: "buttonGroup" });
633
633
  const [recipeProps, restProps] = recipe.splitVariantProps(props);
@@ -636,7 +636,7 @@ var ButtonGroup = React28.forwardRef(
636
636
  }
637
637
  );
638
638
  ButtonGroup.displayName = "ButtonGroup";
639
- var Badge = React28.forwardRef(function Badge2({ icon, children, ...props }, ref) {
639
+ var Badge = React27.forwardRef(function Badge2({ icon, children, ...props }, ref) {
640
640
  return /* @__PURE__ */ jsxRuntime.jsxs(react.Badge, { ref, ...props, children: [
641
641
  children,
642
642
  icon && /* @__PURE__ */ jsxRuntime.jsx(react.Box, { as: icon })
@@ -759,12 +759,12 @@ var codeRecipie = react.defineRecipe({
759
759
  }
760
760
  });
761
761
  var StyledCode = react.chakra(react.Code, codeRecipie);
762
- var Code = React28__namespace.default.forwardRef(
762
+ var Code = React27__namespace.default.forwardRef(
763
763
  function Code2(props, ref) {
764
764
  return /* @__PURE__ */ jsxRuntime.jsx(StyledCode, { ...props, ref });
765
765
  }
766
766
  );
767
- var Heading = React28.forwardRef(
767
+ var Heading = React27.forwardRef(
768
768
  function Heading2(props, ref) {
769
769
  const {
770
770
  as,
@@ -792,14 +792,14 @@ function resolveTextProps({
792
792
  return { fontSize };
793
793
  return { fontSize, lineHeight };
794
794
  }
795
- var Text3 = React28.forwardRef(
795
+ var Text3 = React27.forwardRef(
796
796
  function Text4(props, ref) {
797
797
  const { variant, lineHeight, fontSize, ...rest } = props;
798
798
  const resolvedProps = resolveTextProps({ variant, fontSize, lineHeight });
799
799
  return /* @__PURE__ */ jsxRuntime.jsx(react.Text, { ...resolvedProps, ...rest, ref });
800
800
  }
801
801
  );
802
- var ClipboardIcon = React28__namespace.forwardRef((props, ref) => {
802
+ var ClipboardIcon = React27__namespace.forwardRef((props, ref) => {
803
803
  return /* @__PURE__ */ jsxRuntime.jsx(
804
804
  react.Clipboard.Indicator,
805
805
  {
@@ -811,7 +811,7 @@ var ClipboardIcon = React28__namespace.forwardRef((props, ref) => {
811
811
  );
812
812
  });
813
813
  ClipboardIcon.displayName = "ClipboardIcon";
814
- var ClipboardCopyText = React28__namespace.forwardRef((props, ref) => {
814
+ var ClipboardCopyText = React27__namespace.forwardRef((props, ref) => {
815
815
  const { t } = useTranslation();
816
816
  return /* @__PURE__ */ jsxRuntime.jsx(
817
817
  react.Clipboard.Indicator,
@@ -824,7 +824,7 @@ var ClipboardCopyText = React28__namespace.forwardRef((props, ref) => {
824
824
  );
825
825
  });
826
826
  ClipboardCopyText.displayName = "ClipboardCopyText";
827
- var ClipboardButton = React28__namespace.forwardRef((props, ref) => {
827
+ var ClipboardButton = React27__namespace.forwardRef((props, ref) => {
828
828
  return /* @__PURE__ */ jsxRuntime.jsx(react.Clipboard.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { ref, size: "xs", leftIcon: /* @__PURE__ */ jsxRuntime.jsx(ClipboardIcon, {}), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(ClipboardCopyText, {}) }) });
829
829
  });
830
830
  ClipboardButton.displayName = "ClipboardButton";
@@ -843,7 +843,7 @@ var texts3 = createTexts({
843
843
  sv: "Kopierad"
844
844
  }
845
845
  });
846
- var IconButton = React28.forwardRef(
846
+ var IconButton = React27.forwardRef(
847
847
  (props, ref) => {
848
848
  const { icon, size = "sm", loading = false, ...rest } = props;
849
849
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -860,7 +860,7 @@ var IconButton = React28.forwardRef(
860
860
  }
861
861
  );
862
862
  IconButton.displayName = "IconButton";
863
- var CloseButton = React28.forwardRef(
863
+ var CloseButton = React27.forwardRef(
864
864
  ({ size = "sm", ...props }, ref) => {
865
865
  const { t } = useTranslation();
866
866
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -902,7 +902,7 @@ var texts4 = createTexts({
902
902
  sv: "St\xE4ng"
903
903
  }
904
904
  });
905
- var FloatingActionButton = React28.forwardRef(
905
+ var FloatingActionButton = React27.forwardRef(
906
906
  ({
907
907
  children,
908
908
  icon,
@@ -911,11 +911,11 @@ var FloatingActionButton = React28.forwardRef(
911
911
  placement = "bottom right",
912
912
  ...props
913
913
  }, ref) => {
914
- const [isTextVisible, setIsTextVisible] = React28__namespace.default.useState(
914
+ const [isTextVisible, setIsTextVisible] = React27__namespace.default.useState(
915
915
  externalIsTextVisible === void 0 ? false : externalIsTextVisible
916
916
  );
917
917
  const scrollDirection = useScrollDirection();
918
- React28.useEffect(() => {
918
+ React27.useEffect(() => {
919
919
  if (externalIsTextVisible !== void 0) {
920
920
  return;
921
921
  }
@@ -925,7 +925,7 @@ var FloatingActionButton = React28.forwardRef(
925
925
  );
926
926
  return () => globalThis.clearTimeout(id);
927
927
  }, [scrollDirection, externalIsTextVisible]);
928
- React28.useEffect(() => {
928
+ React27.useEffect(() => {
929
929
  setIsTextVisible(!!externalIsTextVisible);
930
930
  }, [externalIsTextVisible]);
931
931
  const recipe = react.useSlotRecipe({ key: "floatingActionButton" });
@@ -952,11 +952,11 @@ var FloatingActionButton = React28.forwardRef(
952
952
  );
953
953
  FloatingActionButton.displayName = "FloatingActionButton";
954
954
  var useScrollDirection = () => {
955
- const [scrollDirection, setScrollDirection] = React28__namespace.default.useState(null);
956
- const lastScrollPosition = React28__namespace.default.useRef(
955
+ const [scrollDirection, setScrollDirection] = React27__namespace.default.useState(null);
956
+ const lastScrollPosition = React27__namespace.default.useRef(
957
957
  globalThis.window === void 0 ? 0 : window.scrollY
958
958
  );
959
- React28__namespace.default.useEffect(() => {
959
+ React27__namespace.default.useEffect(() => {
960
960
  const onScroll = () => {
961
961
  const delta = window.scrollY - lastScrollPosition.current;
962
962
  if (delta === 0) {
@@ -972,7 +972,7 @@ var useScrollDirection = () => {
972
972
  }, [scrollDirection]);
973
973
  return scrollDirection;
974
974
  };
975
- var AlertIcon = React28.forwardRef(
975
+ var AlertIcon = React27.forwardRef(
976
976
  ({ variant, customIcon }, ref) => {
977
977
  const { t } = useTranslation();
978
978
  const Icon2 = customIcon ?? getIcon(variant);
@@ -1066,7 +1066,7 @@ var texts5 = createTexts({
1066
1066
  en: "Service"
1067
1067
  }
1068
1068
  });
1069
- var Alert = React28.forwardRef((props, ref) => {
1069
+ var Alert = React27.forwardRef((props, ref) => {
1070
1070
  const {
1071
1071
  title,
1072
1072
  showIndicator = true,
@@ -1113,7 +1113,7 @@ var Alert = React28.forwardRef((props, ref) => {
1113
1113
  ] });
1114
1114
  });
1115
1115
  Alert.displayName = "Alert";
1116
- var ExpandableAlert = React28.forwardRef(
1116
+ var ExpandableAlert = React27.forwardRef(
1117
1117
  (props, ref) => {
1118
1118
  const {
1119
1119
  variant = "info",
@@ -1174,7 +1174,7 @@ var ExpandableAlert = React28.forwardRef(
1174
1174
  }
1175
1175
  );
1176
1176
  ExpandableAlert.displayName = "ExpandableAlert";
1177
- var ServiceAlert = React28.forwardRef(
1177
+ var ServiceAlert = React27.forwardRef(
1178
1178
  (props, ref) => {
1179
1179
  const {
1180
1180
  variant = "service",
@@ -1276,14 +1276,14 @@ var texts6 = createTexts({
1276
1276
  en: "Traffic announcement"
1277
1277
  }
1278
1278
  });
1279
- var Breadcrumb = React28.forwardRef(
1279
+ var Breadcrumb = React27.forwardRef(
1280
1280
  ({ children, ...props }, ref) => {
1281
- const validChildren = React28__namespace.default.Children.toArray(children).filter(
1282
- (element) => React28__namespace.default.isValidElement(element)
1281
+ const validChildren = React27__namespace.default.Children.toArray(children).filter(
1282
+ (element) => React27__namespace.default.isValidElement(element)
1283
1283
  );
1284
1284
  return /* @__PURE__ */ jsxRuntime.jsx(react.Breadcrumb.Root, { ref, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(react.Breadcrumb.List, { children: validChildren.map((child, index) => {
1285
1285
  const isLast = index === validChildren.length - 1;
1286
- return /* @__PURE__ */ jsxRuntime.jsxs(React28__namespace.default.Fragment, { children: [
1286
+ return /* @__PURE__ */ jsxRuntime.jsxs(React27__namespace.default.Fragment, { children: [
1287
1287
  /* @__PURE__ */ jsxRuntime.jsx(react.Breadcrumb.Item, { children: child }),
1288
1288
  !isLast && /* @__PURE__ */ jsxRuntime.jsx(react.Breadcrumb.Separator, { "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(sporIconReact.DropdownRightFill18Icon, {}) })
1289
1289
  ] }, index);
@@ -1313,7 +1313,7 @@ function ColorModeIcon() {
1313
1313
  const { colorMode } = useColorMode();
1314
1314
  return colorMode === "dark" ? /* @__PURE__ */ jsxRuntime.jsx(lu.LuMoon, {}) : /* @__PURE__ */ jsxRuntime.jsx(lu.LuSun, {});
1315
1315
  }
1316
- var ColorModeButton = React28__namespace.forwardRef(function ColorModeButton2(props, ref) {
1316
+ var ColorModeButton = React27__namespace.forwardRef(function ColorModeButton2(props, ref) {
1317
1317
  const { toggleColorMode } = useColorMode();
1318
1318
  return /* @__PURE__ */ jsxRuntime.jsx(react.ClientOnly, { fallback: /* @__PURE__ */ jsxRuntime.jsx(react.Skeleton, { boxSize: "8" }), children: /* @__PURE__ */ jsxRuntime.jsx(
1319
1319
  react.IconButton,
@@ -1334,7 +1334,7 @@ var ColorModeButton = React28__namespace.forwardRef(function ColorModeButton2(pr
1334
1334
  }
1335
1335
  ) });
1336
1336
  });
1337
- var FloatingLabel = React28.forwardRef(
1337
+ var FloatingLabel = React27.forwardRef(
1338
1338
  (props, ref) => /* @__PURE__ */ jsxRuntime.jsx(react.Field.Label, { ref, ...props, css: floatingLabelStyles })
1339
1339
  );
1340
1340
  FloatingLabel.displayName = "FloatingLabel";
@@ -1377,7 +1377,7 @@ var labelStyles = react.defineStyle({
1377
1377
  opacity: 0.4
1378
1378
  }
1379
1379
  });
1380
- var Field3 = React28__namespace.forwardRef(
1380
+ var Field3 = React27__namespace.forwardRef(
1381
1381
  (props, ref) => {
1382
1382
  const {
1383
1383
  label,
@@ -1417,7 +1417,7 @@ var Field3 = React28__namespace.forwardRef(
1417
1417
  }
1418
1418
  );
1419
1419
  Field3.displayName = "Field";
1420
- var FieldErrorText = React28__namespace.forwardRef((props, ref) => {
1420
+ var FieldErrorText = React27__namespace.forwardRef((props, ref) => {
1421
1421
  return /* @__PURE__ */ jsxRuntime.jsx(react.Field.ErrorText, { ref, children: props.children });
1422
1422
  });
1423
1423
  FieldErrorText.displayName = "FieldErrorText";
@@ -1428,7 +1428,7 @@ function CalendarCell({
1428
1428
  currentMonth,
1429
1429
  variant
1430
1430
  }) {
1431
- const ref = React28.useRef(null);
1431
+ const ref = React27.useRef(null);
1432
1432
  const {
1433
1433
  cellProps,
1434
1434
  buttonProps,
@@ -1455,7 +1455,7 @@ function CalendarCell({
1455
1455
  if (isOutsideMonth) {
1456
1456
  stateProps["data-unavailable"] = true;
1457
1457
  }
1458
- React28.useEffect(() => {
1458
+ React27.useEffect(() => {
1459
1459
  var _a5;
1460
1460
  (_a5 = ref.current) == null ? void 0 : _a5.addEventListener(
1461
1461
  "touchend",
@@ -1565,7 +1565,7 @@ function CalendarNavigationButton({
1565
1565
  "aria-label": ariaLabel,
1566
1566
  ...rest
1567
1567
  }) {
1568
- const ref = React28.useRef(null);
1568
+ const ref = React27.useRef(null);
1569
1569
  const { buttonProps } = reactAria.useButton(rest, ref);
1570
1570
  return /* @__PURE__ */ jsxRuntime.jsx(
1571
1571
  IconButton,
@@ -1725,7 +1725,7 @@ var texts8 = createTexts({
1725
1725
  en: "Calendar"
1726
1726
  }
1727
1727
  });
1728
- var CalendarTriggerButton = React28.forwardRef(({ variant, disabled, ariaLabelledby, ...buttonProps }, ref) => {
1728
+ var CalendarTriggerButton = React27.forwardRef(({ variant, disabled, ariaLabelledby, ...buttonProps }, ref) => {
1729
1729
  const { t } = useTranslation();
1730
1730
  const recipe = react.useSlotRecipe({
1731
1731
  key: "datePicker"
@@ -1752,9 +1752,9 @@ var texts9 = createTexts({
1752
1752
  en: "Open calendar"
1753
1753
  }
1754
1754
  });
1755
- var DateTimeSegment = React28.forwardRef(
1755
+ var DateTimeSegment = React27.forwardRef(
1756
1756
  ({ segment, state, ariaLabel, ariaDescription }, externalRef) => {
1757
- const internalRef = React28.useRef(null);
1757
+ const internalRef = React27.useRef(null);
1758
1758
  const ref = externalRef ?? internalRef;
1759
1759
  const { segmentProps } = reactAria.useDateSegment(
1760
1760
  segment,
@@ -1801,7 +1801,7 @@ function createCalendar2(identifier) {
1801
1801
  }
1802
1802
  }
1803
1803
  }
1804
- var DateField = React28.forwardRef(
1804
+ var DateField = React27.forwardRef(
1805
1805
  ({ labelId, ...props }, externalRef) => {
1806
1806
  var _a5;
1807
1807
  const locale = useCurrentLocale();
@@ -1815,7 +1815,7 @@ var DateField = React28.forwardRef(
1815
1815
  createCalendar: createCalendar2
1816
1816
  });
1817
1817
  const { t } = useTranslation();
1818
- const internalRef = React28.useRef(null);
1818
+ const internalRef = React27.useRef(null);
1819
1819
  const ref = externalRef ?? internalRef;
1820
1820
  const { fieldProps } = reactAria.useDateField(
1821
1821
  props,
@@ -1892,7 +1892,7 @@ var getAriaLabel = (segmentType) => {
1892
1892
  }
1893
1893
  }
1894
1894
  };
1895
- var StyledField = React28.forwardRef(
1895
+ var StyledField = React27.forwardRef(
1896
1896
  function StyledField2(props, ref) {
1897
1897
  const { children, variant, isDisabled, ariaLabelledby, ...otherProps } = props;
1898
1898
  const { invalid } = react.useFieldContext() ?? {
@@ -1915,7 +1915,7 @@ var StyledField = React28.forwardRef(
1915
1915
  );
1916
1916
  }
1917
1917
  );
1918
- var DatePicker = React28.forwardRef(
1918
+ var DatePicker = React27.forwardRef(
1919
1919
  ({
1920
1920
  variant,
1921
1921
  errorText,
@@ -1936,15 +1936,15 @@ var DatePicker = React28.forwardRef(
1936
1936
  isRequired: props.isRequired ?? (chakraFieldProps == null ? void 0 : chakraFieldProps.required),
1937
1937
  validationState: (chakraFieldProps == null ? void 0 : chakraFieldProps.invalid) ? "invalid" : "valid"
1938
1938
  });
1939
- const internalRef = React28.useRef(null);
1939
+ const internalRef = React27.useRef(null);
1940
1940
  const ref = externalRef ?? internalRef;
1941
1941
  const { labelProps, fieldProps, buttonProps, dialogProps, calendarProps } = reactAria.useDatePicker(
1942
1942
  props,
1943
1943
  state,
1944
1944
  ref
1945
1945
  );
1946
- const labelId = `label-${React28.useId()}`;
1947
- const inputGroupId = `input-group-${React28.useId()}`;
1946
+ const labelId = `label-${React27.useId()}`;
1947
+ const inputGroupId = `input-group-${React27.useId()}`;
1948
1948
  const recipe = react.useSlotRecipe({
1949
1949
  key: "datePicker"
1950
1950
  });
@@ -2033,7 +2033,7 @@ function RangeCalendar(props) {
2033
2033
  key: "datePicker"
2034
2034
  });
2035
2035
  const styles = recipe({});
2036
- const ref = React28.useRef(null);
2036
+ const ref = React27.useRef(null);
2037
2037
  const { calendarProps, title } = reactAria.useRangeCalendar(props, state, ref);
2038
2038
  return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { ...calendarProps, ref, css: styles.rangeCalendarPopover, children: [
2039
2039
  /* @__PURE__ */ jsxRuntime.jsx(CalendarHeader, { state, title }),
@@ -2071,7 +2071,7 @@ function DateRangePicker({
2071
2071
  isRequired: props.required ?? (fieldContextPRops == null ? void 0 : fieldContextPRops.required),
2072
2072
  validationState: (fieldContextPRops == null ? void 0 : fieldContextPRops.invalid) ? "invalid" : "valid"
2073
2073
  });
2074
- const ref = React28.useRef(null);
2074
+ const ref = React27.useRef(null);
2075
2075
  const uniqueId = reactAria.useId();
2076
2076
  const datePickerId = `date-range-picker-${uniqueId}`;
2077
2077
  const {
@@ -2159,7 +2159,7 @@ function DateRangePicker({
2159
2159
  ] }) });
2160
2160
  }
2161
2161
  var TimeField = ({ state, ...props }) => {
2162
- const ref = React28.useRef(null);
2162
+ const ref = React27.useRef(null);
2163
2163
  const { labelProps, fieldProps } = reactAria.useTimeField(props, state, ref);
2164
2164
  return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
2165
2165
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -2326,7 +2326,7 @@ var texts11 = createTexts({
2326
2326
  sv: "minuter"
2327
2327
  }
2328
2328
  });
2329
- var DialogContent = React28__namespace.forwardRef((props, ref) => {
2329
+ var DialogContent = React27__namespace.forwardRef((props, ref) => {
2330
2330
  const {
2331
2331
  children,
2332
2332
  portalled = true,
@@ -2340,7 +2340,7 @@ var DialogContent = React28__namespace.forwardRef((props, ref) => {
2340
2340
  ] });
2341
2341
  });
2342
2342
  DialogContent.displayName = "DialogContent";
2343
- var DialogCloseTrigger = React28__namespace.forwardRef(function DialogCloseTrigger2(props, ref) {
2343
+ var DialogCloseTrigger = React27__namespace.forwardRef(function DialogCloseTrigger2(props, ref) {
2344
2344
  return /* @__PURE__ */ jsxRuntime.jsx(react.Dialog.CloseTrigger, { ref, position: "absolute", ...props, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { size: "md" }) });
2345
2345
  });
2346
2346
  var DialogRoot = react.Dialog.Root;
@@ -2355,7 +2355,7 @@ var DialogActionTrigger = react.Dialog.ActionTrigger;
2355
2355
  var [RootDrawerProvider, useRootDrawerProps] = react.createContext({
2356
2356
  name: "RootDrawerProvider"
2357
2357
  });
2358
- var DrawerContent = React28.forwardRef(
2358
+ var DrawerContent = React27.forwardRef(
2359
2359
  (props, ref) => {
2360
2360
  const { children, portalled = true, portalRef, ...rest } = props;
2361
2361
  const { size, placement } = useRootDrawerProps();
@@ -2368,7 +2368,7 @@ var DrawerContent = React28.forwardRef(
2368
2368
  }
2369
2369
  );
2370
2370
  DrawerContent.displayName = "DrawerContent";
2371
- var CloseDrawerLine = React28.forwardRef((props, ref) => {
2371
+ var CloseDrawerLine = React27.forwardRef((props, ref) => {
2372
2372
  const { t } = useTranslation();
2373
2373
  return /* @__PURE__ */ jsxRuntime.jsx(
2374
2374
  react.Drawer.CloseTrigger,
@@ -2395,17 +2395,17 @@ var CloseDrawerLine = React28.forwardRef((props, ref) => {
2395
2395
  );
2396
2396
  });
2397
2397
  CloseDrawerLine.displayName = "CloseDrawerLine";
2398
- var DrawerCloseTrigger = React28.forwardRef(function DrawerCloseTrigger2(props, ref) {
2398
+ var DrawerCloseTrigger = React27.forwardRef(function DrawerCloseTrigger2(props, ref) {
2399
2399
  const { size } = useRootDrawerProps();
2400
2400
  const { t } = useTranslation();
2401
2401
  return /* @__PURE__ */ jsxRuntime.jsx(react.Drawer.CloseTrigger, { ref, ...props, asChild: true, children: size === "full" ? /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", leftIcon: /* @__PURE__ */ jsxRuntime.jsx(sporIconReact.CloseFill24Icon, {}), children: t(texts12.close) }) : /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { size: "md" }) });
2402
2402
  });
2403
- var DrawerBackTrigger = React28.forwardRef((props, ref) => {
2403
+ var DrawerBackTrigger = React27.forwardRef((props, ref) => {
2404
2404
  const { t } = useTranslation();
2405
2405
  return /* @__PURE__ */ jsxRuntime.jsx(react.Drawer.CloseTrigger, { asChild: true, ...props, ref, top: "0", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", leftIcon: /* @__PURE__ */ jsxRuntime.jsx(sporIconReact.ArrowLeftFill24Icon, {}), children: t(texts12.back) }) });
2406
2406
  });
2407
2407
  DrawerBackTrigger.displayName = "DrawerBackTrigger";
2408
- var DrawerFullScreenHeader = React28.forwardRef((props, ref) => {
2408
+ var DrawerFullScreenHeader = React27.forwardRef((props, ref) => {
2409
2409
  const { backTrigger = true, title } = props;
2410
2410
  return /* @__PURE__ */ jsxRuntime.jsx(react.Drawer.Header, { ...props, ref, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(react.Grid, { templateColumns: "1fr auto 1fr", height: "auto", paddingX: "8", children: [
2411
2411
  /* @__PURE__ */ jsxRuntime.jsx(react.GridItem, { width: "full", alignSelf: "center", children: backTrigger && /* @__PURE__ */ jsxRuntime.jsx(DrawerBackTrigger, {}) }),
@@ -2442,7 +2442,7 @@ var texts12 = createTexts({
2442
2442
  sv: "St\xE4ng"
2443
2443
  }
2444
2444
  });
2445
- var AttachedInputs = React28.forwardRef(
2445
+ var AttachedInputs = React27.forwardRef(
2446
2446
  (props, ref) => {
2447
2447
  const recipe = react.useRecipe({ key: "attachedInputs" });
2448
2448
  const [recipeProps, restProps] = recipe.splitVariantProps(props);
@@ -2454,7 +2454,7 @@ AttachedInputs.displayName = "AttachedInputs";
2454
2454
  var CardSelect = ({ size = "md", ...props }) => {
2455
2455
  return /* @__PURE__ */ jsxRuntime.jsx(react.Popover.Root, { size, ...props });
2456
2456
  };
2457
- var CardSelectContent = React28.forwardRef(
2457
+ var CardSelectContent = React27.forwardRef(
2458
2458
  ({ children, ...props }, ref) => {
2459
2459
  return /* @__PURE__ */ jsxRuntime.jsx(react.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(react.Popover.Positioner, { children: /* @__PURE__ */ jsxRuntime.jsx(react.Popover.Content, { ref, padding: 0, bg: "none", children: /* @__PURE__ */ jsxRuntime.jsx(react.Popover.Body, { ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
2460
2460
  StaticCard,
@@ -2475,7 +2475,7 @@ var bgActiveStyleMap = {
2475
2475
  ghost: "ghost.surface.active",
2476
2476
  floating: "floating.surface.active"
2477
2477
  };
2478
- var CardSelectTrigger = React28.forwardRef(
2478
+ var CardSelectTrigger = React27.forwardRef(
2479
2479
  ({ icon, variant = "core", withChevron = true, size, children, ...props }, ref) => {
2480
2480
  const ChevronIcon = size === "sm" ? sporIconReact.DropdownDownFill18Icon : sporIconReact.DropdownDownFill24Icon;
2481
2481
  const { open } = react.usePopoverContext();
@@ -2500,7 +2500,7 @@ var CardSelectTrigger = React28.forwardRef(
2500
2500
  }
2501
2501
  );
2502
2502
  CardSelectTrigger.displayName = "CardSelectTrigger";
2503
- var Checkbox = React28__namespace.forwardRef(
2503
+ var Checkbox = React27__namespace.forwardRef(
2504
2504
  (props, ref) => {
2505
2505
  const { children, inputProps, rootRef, ...rest } = props;
2506
2506
  return /* @__PURE__ */ jsxRuntime.jsxs(react.Checkbox.Root, { ref: rootRef, ...rest, children: [
@@ -2511,14 +2511,12 @@ var Checkbox = React28__namespace.forwardRef(
2511
2511
  }
2512
2512
  );
2513
2513
  Checkbox.displayName = "Checkbox";
2514
- var CheckboxGroup = React28.forwardRef(
2515
- (props, ref) => {
2516
- const { direction = "row", children, gap = 1, ...rest } = props;
2517
- return /* @__PURE__ */ jsxRuntime.jsx(react.CheckboxGroup, { ref, ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(react.Stack, { direction, gap, children }) });
2518
- }
2519
- );
2514
+ var CheckboxGroup = (props) => {
2515
+ const { direction = "row", children, gap = 1, ...rest } = props;
2516
+ return /* @__PURE__ */ jsxRuntime.jsx(react.CheckboxGroup, { ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(react.Stack, { direction, gap, children }) });
2517
+ };
2520
2518
  CheckboxGroup.displayName = "CheckboxGroup";
2521
- var ChoiceChip = React28.forwardRef(
2519
+ var ChoiceChip = React27.forwardRef(
2522
2520
  ({ children, icon, onCheckedChange, ...rootProps }, ref) => {
2523
2521
  return /* @__PURE__ */ jsxRuntime.jsx(
2524
2522
  react.CheckboxCard.Root,
@@ -2540,7 +2538,7 @@ var ChoiceChip = React28.forwardRef(
2540
2538
  }
2541
2539
  );
2542
2540
  ChoiceChip.displayName = "ChoiceChip";
2543
- var Popover = React28.forwardRef(
2541
+ var Popover = React27.forwardRef(
2544
2542
  ({
2545
2543
  children,
2546
2544
  state,
@@ -2554,7 +2552,7 @@ var Popover = React28.forwardRef(
2554
2552
  containerPadding = 12
2555
2553
  }, ref) => {
2556
2554
  var _a5;
2557
- const internalRef = React28.useRef(null);
2555
+ const internalRef = React27.useRef(null);
2558
2556
  const popoverRef = ref ?? internalRef;
2559
2557
  const { popoverProps, underlayProps } = reactAria.usePopover(
2560
2558
  {
@@ -2621,11 +2619,11 @@ var Combobox = (props) => {
2621
2619
  ...restProps
2622
2620
  } = props;
2623
2621
  const { contains } = reactAria.useFilter({ sensitivity: "base" });
2624
- const fallbackInputRef = React28.useRef(null);
2622
+ const fallbackInputRef = React27.useRef(null);
2625
2623
  const inputRef = externalInputRef ?? fallbackInputRef;
2626
- const listBoxRef = React28.useRef(null);
2627
- const popoverRef = React28.useRef(null);
2628
- const listboxId = `${React28.useId()}-listbox`;
2624
+ const listBoxRef = React27.useRef(null);
2625
+ const popoverRef = React27.useRef(null);
2626
+ const listboxId = `${React27.useId()}-listbox`;
2629
2627
  const inputWidth = useInputWidth(inputRef);
2630
2628
  const state = reactStately.useComboBoxState({
2631
2629
  defaultFilter: contains,
@@ -2738,8 +2736,8 @@ var Combobox = (props) => {
2738
2736
  };
2739
2737
  Combobox.displayName = "Combobox";
2740
2738
  var useInputWidth = (inputRef) => {
2741
- const [inputWidth, setInputWidth] = React28.useState("auto");
2742
- React28.useEffect(() => {
2739
+ const [inputWidth, setInputWidth] = React27.useState("auto");
2740
+ React27.useEffect(() => {
2743
2741
  const onResize = debounce(() => {
2744
2742
  if (inputRef.current) {
2745
2743
  setInputWidth(`${inputRef.current.offsetWidth}px`);
@@ -2770,7 +2768,7 @@ var FieldsetLegend = react.Fieldset.Legend;
2770
2768
  var FieldsetContent = react.Fieldset.Content;
2771
2769
  var FieldsetHelperText = react.Fieldset.HelperText;
2772
2770
  var FieldsetErrorText = react.Fieldset.ErrorText;
2773
- var Input = React28.forwardRef(
2771
+ var Input = React27.forwardRef(
2774
2772
  ({
2775
2773
  startElement,
2776
2774
  endElement,
@@ -2856,7 +2854,7 @@ function ItemDescription({ children }) {
2856
2854
  return /* @__PURE__ */ jsxRuntime.jsx(react.Box, { ...descriptionProps, css: styles, fontSize: "xs", children });
2857
2855
  }
2858
2856
  function Option({ item, state }) {
2859
- const ref = React28.useRef(null);
2857
+ const ref = React27.useRef(null);
2860
2858
  const {
2861
2859
  optionProps,
2862
2860
  isSelected,
@@ -2881,7 +2879,7 @@ function Option({ item, state }) {
2881
2879
  if (isFocusVisible) {
2882
2880
  dataFields["data-focus-visible"] = true;
2883
2881
  }
2884
- React28.useEffect(() => {
2882
+ React27.useEffect(() => {
2885
2883
  var _a5;
2886
2884
  (_a5 = ref == null ? void 0 : ref.current) == null ? void 0 : _a5.addEventListener(
2887
2885
  "touchend",
@@ -2893,12 +2891,12 @@ function Option({ item, state }) {
2893
2891
  }, []);
2894
2892
  return /* @__PURE__ */ jsxRuntime.jsx(OptionContext.Provider, { value: { labelProps, descriptionProps }, children: /* @__PURE__ */ jsxRuntime.jsx(react.ListItem, { ...optionProps, ...dataFields, ref, css: styles.item, children: item.rendered }) });
2895
2893
  }
2896
- var OptionContext = React28__namespace.default.createContext({
2894
+ var OptionContext = React27__namespace.default.createContext({
2897
2895
  labelProps: {},
2898
2896
  descriptionProps: {}
2899
2897
  });
2900
2898
  var useOptionContext = () => {
2901
- return React28.useContext(OptionContext);
2899
+ return React27.useContext(OptionContext);
2902
2900
  };
2903
2901
  function ListBoxSection({ section, state }) {
2904
2902
  var _a5, _b4;
@@ -2928,7 +2926,7 @@ function ListBoxSection({ section, state }) {
2928
2926
  ) })
2929
2927
  ] }) });
2930
2928
  }
2931
- var NativeSelect = React28__namespace.forwardRef(function NativeSelect2(props, ref) {
2929
+ var NativeSelect = React27__namespace.forwardRef(function NativeSelect2(props, ref) {
2932
2930
  const {
2933
2931
  children,
2934
2932
  variant = "core",
@@ -2975,7 +2973,7 @@ var NativeSelect = React28__namespace.forwardRef(function NativeSelect2(props, r
2975
2973
  }
2976
2974
  );
2977
2975
  });
2978
- var NumericStepper = React28__namespace.default.forwardRef((props, ref) => {
2976
+ var NumericStepper = React27__namespace.default.forwardRef((props, ref) => {
2979
2977
  const {
2980
2978
  name: nameProp,
2981
2979
  id: idProp,
@@ -2991,7 +2989,7 @@ var NumericStepper = React28__namespace.default.forwardRef((props, ref) => {
2991
2989
  ariaLabelContext = { singular: "", plural: "" },
2992
2990
  ...rest
2993
2991
  } = props;
2994
- const addButtonRef = React28.useRef(null);
2992
+ const addButtonRef = React27.useRef(null);
2995
2993
  const { t } = useTranslation();
2996
2994
  const recipe = react.useSlotRecipe({ key: "numericStepper" });
2997
2995
  const styles = recipe();
@@ -3082,7 +3080,7 @@ var NumericStepper = React28__namespace.default.forwardRef((props, ref) => {
3082
3080
  ] });
3083
3081
  });
3084
3082
  NumericStepper.displayName = "NumericStepper";
3085
- var VerySmallButton = React28__namespace.default.forwardRef((props, ref) => {
3083
+ var VerySmallButton = React27__namespace.default.forwardRef((props, ref) => {
3086
3084
  const recipe = react.useSlotRecipe({ key: "numericStepper" });
3087
3085
  const styles = recipe({ colorPalette: "default" });
3088
3086
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -3165,7 +3163,7 @@ var texts13 = createTexts({
3165
3163
  };
3166
3164
  }
3167
3165
  });
3168
- var PasswordInput = React28.forwardRef(
3166
+ var PasswordInput = React27.forwardRef(
3169
3167
  (props, ref) => {
3170
3168
  const {
3171
3169
  defaultVisible,
@@ -3210,7 +3208,7 @@ var PasswordInput = React28.forwardRef(
3210
3208
  }
3211
3209
  );
3212
3210
  PasswordInput.displayName = "PasswordInput";
3213
- var VisibilityTrigger = React28__namespace.default.forwardRef(
3211
+ var VisibilityTrigger = React27__namespace.default.forwardRef(
3214
3212
  (props, ref) => {
3215
3213
  return /* @__PURE__ */ jsxRuntime.jsx(
3216
3214
  react.Button,
@@ -3256,7 +3254,7 @@ var sortedCallingCodes = awesomePhonenumber.getSupportedCallingCodes().sort((a,
3256
3254
  var callingCodes = react.createListCollection({
3257
3255
  items: [...prioritizedCountryCodes, ...sortedCallingCodes]
3258
3256
  });
3259
- var CountryCodeSelect = React28.forwardRef((props, ref) => {
3257
+ var CountryCodeSelect = React27.forwardRef((props, ref) => {
3260
3258
  const { t } = useTranslation();
3261
3259
  if (props.allowedCountryCodes) {
3262
3260
  callingCodes.items = callingCodes.items.filter(
@@ -3289,7 +3287,7 @@ var texts15 = createTexts({
3289
3287
  sv: "Landskod"
3290
3288
  }
3291
3289
  });
3292
- var PhoneNumberInput = React28.forwardRef((props, ref) => {
3290
+ var PhoneNumberInput = React27.forwardRef((props, ref) => {
3293
3291
  const {
3294
3292
  label: externalLabel,
3295
3293
  value: externalValue,
@@ -3387,7 +3385,7 @@ var texts16 = createTexts({
3387
3385
  sv: "Landskod"
3388
3386
  }
3389
3387
  });
3390
- var Radio = React28.forwardRef((props, ref) => {
3388
+ var Radio = React27.forwardRef((props, ref) => {
3391
3389
  const { children, inputProps, rootRef, ...rest } = props;
3392
3390
  return /* @__PURE__ */ jsxRuntime.jsxs(react.RadioGroup.Item, { ref: rootRef, ...rest, children: [
3393
3391
  /* @__PURE__ */ jsxRuntime.jsx(react.RadioGroup.ItemHiddenInput, { ref, ...inputProps }),
@@ -3396,13 +3394,13 @@ var Radio = React28.forwardRef((props, ref) => {
3396
3394
  ] });
3397
3395
  });
3398
3396
  Radio.displayName = "Radio";
3399
- var RadioGroup = React28.forwardRef(
3397
+ var RadioGroup = React27.forwardRef(
3400
3398
  (props, ref) => {
3401
3399
  return /* @__PURE__ */ jsxRuntime.jsx(react.RadioGroup.Root, { ref, ...props, "aria-labelledby": "" });
3402
3400
  }
3403
3401
  );
3404
3402
  RadioGroup.displayName = "RadioGroup";
3405
- var SearchInput = React28.forwardRef(
3403
+ var SearchInput = React27.forwardRef(
3406
3404
  (props, ref) => {
3407
3405
  const { t } = useTranslation();
3408
3406
  const { variant = "core", onReset, label, value } = props;
@@ -3446,7 +3444,7 @@ var texts17 = createTexts({
3446
3444
  en: "Reset search field"
3447
3445
  }
3448
3446
  });
3449
- var Select = React28__namespace.forwardRef(
3447
+ var Select = React27__namespace.forwardRef(
3450
3448
  (props, ref) => {
3451
3449
  const {
3452
3450
  variant = "core",
@@ -3489,7 +3487,7 @@ var SelectLabel = (props) => {
3489
3487
  );
3490
3488
  };
3491
3489
  Select.displayName = "Select";
3492
- var SelectItem = React28__namespace.forwardRef(
3490
+ var SelectItem = React27__namespace.forwardRef(
3493
3491
  (props, ref) => {
3494
3492
  const { item, children, description, ...rest } = props;
3495
3493
  const recipe = react.useSlotRecipe({ key: "select" });
@@ -3504,14 +3502,14 @@ var SelectItem = React28__namespace.forwardRef(
3504
3502
  }
3505
3503
  );
3506
3504
  SelectItem.displayName = "SelectItem";
3507
- var SelectItemGroup = React28__namespace.forwardRef(function SelectItemGroup2(props, ref) {
3505
+ var SelectItemGroup = React27__namespace.forwardRef(function SelectItemGroup2(props, ref) {
3508
3506
  const { children, label, ...rest } = props;
3509
3507
  return /* @__PURE__ */ jsxRuntime.jsxs(react.Select.ItemGroup, { ...rest, ref, children: [
3510
3508
  /* @__PURE__ */ jsxRuntime.jsx(react.Select.ItemGroupLabel, { children: label }),
3511
3509
  children
3512
3510
  ] });
3513
3511
  });
3514
- var SelectTrigger = React28__namespace.forwardRef(function SelectTrigger2(props, ref) {
3512
+ var SelectTrigger = React27__namespace.forwardRef(function SelectTrigger2(props, ref) {
3515
3513
  const { children, clearable, ...rest } = props;
3516
3514
  const recipe = react.useSlotRecipe({ key: "select" });
3517
3515
  const styles = recipe();
@@ -3523,7 +3521,7 @@ var SelectTrigger = React28__namespace.forwardRef(function SelectTrigger2(props,
3523
3521
  ] })
3524
3522
  ] });
3525
3523
  });
3526
- var SelectClearTrigger = React28__namespace.forwardRef(function SelectClearTrigger2(props, ref) {
3524
+ var SelectClearTrigger = React27__namespace.forwardRef(function SelectClearTrigger2(props, ref) {
3527
3525
  return /* @__PURE__ */ jsxRuntime.jsx(react.Select.ClearTrigger, { asChild: true, ...props, ref, children: /* @__PURE__ */ jsxRuntime.jsx(
3528
3526
  CloseButton,
3529
3527
  {
@@ -3534,11 +3532,11 @@ var SelectClearTrigger = React28__namespace.forwardRef(function SelectClearTrigg
3534
3532
  }
3535
3533
  ) });
3536
3534
  });
3537
- var SelectContent = React28__namespace.forwardRef(function SelectContent2(props, ref) {
3535
+ var SelectContent = React27__namespace.forwardRef(function SelectContent2(props, ref) {
3538
3536
  const { portalled = true, portalRef, ...rest } = props;
3539
3537
  return /* @__PURE__ */ jsxRuntime.jsx(react.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ jsxRuntime.jsx(react.Select.Positioner, { children: /* @__PURE__ */ jsxRuntime.jsx(react.Select.Content, { ...rest, ref }) }) });
3540
3538
  });
3541
- var SelectValueText = React28__namespace.forwardRef(function SelectValueText2(props, ref) {
3539
+ var SelectValueText = React27__namespace.forwardRef(function SelectValueText2(props, ref) {
3542
3540
  const { children, withPlaceholder, placeholder, ...rest } = props;
3543
3541
  return /* @__PURE__ */ jsxRuntime.jsx(
3544
3542
  react.Select.ValueText,
@@ -3562,7 +3560,7 @@ var SelectValueText = React28__namespace.forwardRef(function SelectValueText2(pr
3562
3560
  });
3563
3561
  var SelectItemText = react.Select.ItemText;
3564
3562
  var SelectRoot = react.Select.Root;
3565
- var Switch = React28.forwardRef(
3563
+ var Switch = React27.forwardRef(
3566
3564
  (props, ref) => {
3567
3565
  const {
3568
3566
  rootRef,
@@ -3602,9 +3600,9 @@ var Switch = React28.forwardRef(
3602
3600
  );
3603
3601
  Switch.displayName = "Switch";
3604
3602
  var useLabelHeight = (label) => {
3605
- const labelRef = React28.useRef(null);
3606
- const [labelHeight, setLabelHeight] = React28.useState(0);
3607
- React28.useLayoutEffect(() => {
3603
+ const labelRef = React27.useRef(null);
3604
+ const [labelHeight, setLabelHeight] = React27.useState(0);
3605
+ React27.useLayoutEffect(() => {
3608
3606
  const updateLabelHeight = () => {
3609
3607
  if (labelRef.current) {
3610
3608
  setLabelHeight(labelRef.current.offsetHeight);
@@ -3624,7 +3622,7 @@ var useLabelHeight = (label) => {
3624
3622
  }, [label]);
3625
3623
  return { labelRef, labelHeight };
3626
3624
  };
3627
- var Textarea = React28.forwardRef(
3625
+ var Textarea = React27.forwardRef(
3628
3626
  (props, ref) => {
3629
3627
  const { label, variant = "core", ...fieldProps } = props;
3630
3628
  const recipe = react.useRecipe({ key: "textarea" });
@@ -3647,7 +3645,7 @@ var Textarea = React28.forwardRef(
3647
3645
  }
3648
3646
  );
3649
3647
  Textarea.displayName = "Textarea";
3650
- var PressableCard = React28.forwardRef(
3648
+ var PressableCard = React27.forwardRef(
3651
3649
  (props, ref) => {
3652
3650
  const recipe = react.useRecipe({ key: "pressableCard" });
3653
3651
  const [recipeProps, restProps] = recipe.splitVariantProps(props);
@@ -3656,7 +3654,7 @@ var PressableCard = React28.forwardRef(
3656
3654
  }
3657
3655
  );
3658
3656
  PressableCard.displayName = "PressableCard";
3659
- var RadioCard = React28.forwardRef(
3657
+ var RadioCard = React27.forwardRef(
3660
3658
  (props, ref) => {
3661
3659
  const { inputProps, children, value, ariaLabel } = props;
3662
3660
  return /* @__PURE__ */ jsxRuntime.jsxs(react.RadioCard.Item, { ...props, children: [
@@ -3673,7 +3671,7 @@ var RadioCard = React28.forwardRef(
3673
3671
  }
3674
3672
  );
3675
3673
  RadioCard.displayName = "RadioCard";
3676
- var RadioCardGroup = React28.forwardRef(
3674
+ var RadioCardGroup = React27.forwardRef(
3677
3675
  (props, ref) => {
3678
3676
  const {
3679
3677
  children,
@@ -3702,7 +3700,7 @@ var RadioCardGroup = React28.forwardRef(
3702
3700
  );
3703
3701
  RadioCardGroup.displayName = "RadioCardGroup";
3704
3702
  var RadioCardLabel = react.RadioCard.Label;
3705
- var Separator = React28.forwardRef(
3703
+ var Separator = React27.forwardRef(
3706
3704
  (props, ref) => {
3707
3705
  const {
3708
3706
  size = "md",
@@ -3715,7 +3713,7 @@ var Separator = React28.forwardRef(
3715
3713
  }
3716
3714
  );
3717
3715
  Separator.displayName = "Separator";
3718
- var StaticCard = React28.forwardRef(
3716
+ var StaticCard = React27.forwardRef(
3719
3717
  (props, ref) => {
3720
3718
  const recipe = react.useRecipe({ key: "staticCard" });
3721
3719
  const [recipeProps, restProps] = recipe.splitVariantProps(props);
@@ -3770,7 +3768,7 @@ var getCorrectIcon = ({ variant, size }) => {
3770
3768
  var _a5;
3771
3769
  return ((_a5 = icons[variant]) == null ? void 0 : _a5[size]) ?? react.Box;
3772
3770
  };
3773
- var LineIcon = React28.forwardRef(
3771
+ var LineIcon = React27.forwardRef(
3774
3772
  function LineIcon2({
3775
3773
  variant,
3776
3774
  size = "md",
@@ -3845,7 +3843,7 @@ var InfoTag = ({
3845
3843
  ] })
3846
3844
  ] });
3847
3845
  };
3848
- var TravelTag = React28.forwardRef(
3846
+ var TravelTag = React27.forwardRef(
3849
3847
  function TravelTag2({
3850
3848
  variant,
3851
3849
  size = "md",
@@ -3925,13 +3923,13 @@ var ExternalIcon = ({
3925
3923
  size === "lg" || size === "md" ? /* @__PURE__ */ jsxRuntime.jsx(sporIconReact.LinkOutOutline24Icon, { "aria-hidden": true }) : /* @__PURE__ */ jsxRuntime.jsx(sporIconReact.LinkOutOutline18Icon, { "aria-hidden": true }),
3926
3924
  /* @__PURE__ */ jsxRuntime.jsx(react.VisuallyHidden, { children: label })
3927
3925
  ] });
3928
- var TextLink = React28.forwardRef(
3926
+ var TextLink = React27.forwardRef(
3929
3927
  ({ children, external, href, ...props }, ref) => {
3930
3928
  const { t } = useTranslation();
3931
3929
  const isExternal = external ?? Boolean((href == null ? void 0 : href.startsWith("http://")) || (href == null ? void 0 : href.startsWith("https://")));
3932
3930
  const externalLabel = t ? t(texts18.externalLink) : texts18.externalLink.en;
3933
- if (props.asChild && React28.isValidElement(children)) {
3934
- return /* @__PURE__ */ jsxRuntime.jsx(react.Link, { href, ...props, ref, children: React28.cloneElement(children, {
3931
+ if (props.asChild && React27.isValidElement(children)) {
3932
+ return /* @__PURE__ */ jsxRuntime.jsx(react.Link, { href, ...props, ref, children: React27.cloneElement(children, {
3935
3933
  ...children.props,
3936
3934
  children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
3937
3935
  children.props.children,
@@ -3957,7 +3955,7 @@ var texts18 = createTexts({
3957
3955
  var List = react.List.Root;
3958
3956
  var ListItem2 = react.List.Item;
3959
3957
  var ListIndicator = react.List.Indicator;
3960
- var CargonetLogo = React28.forwardRef(
3958
+ var CargonetLogo = React27.forwardRef(
3961
3959
  (props, ref) => {
3962
3960
  const { colorPalette } = props;
3963
3961
  const mainColor = "#DF8200";
@@ -4116,8 +4114,8 @@ var fillRecipe = {
4116
4114
  };
4117
4115
  var Path = react.chakra("path", fillRecipe);
4118
4116
  var SVGGroup = react.chakra("g", fillRecipe);
4119
- var VyLogo = React28.forwardRef((props, ref) => {
4120
- const id = React28.useId();
4117
+ var VyLogo = React27.forwardRef((props, ref) => {
4118
+ const id = React27.useId();
4121
4119
  return /* @__PURE__ */ jsxRuntime.jsxs(SvgBox, { ref, viewBox: "0 0 107 54", ...props, children: [
4122
4120
  /* @__PURE__ */ jsxRuntime.jsx("title", { children: "Vy logo" }),
4123
4121
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -4237,7 +4235,7 @@ var VyLogo = React28.forwardRef((props, ref) => {
4237
4235
  ] });
4238
4236
  });
4239
4237
  VyLogo.displayName = "VyLogo";
4240
- var VyLogoPride = React28.forwardRef(
4238
+ var VyLogoPride = React27.forwardRef(
4241
4239
  (props, ref) => {
4242
4240
  const pinkColor = "#ED6F99";
4243
4241
  const purpleColor = "#C06CF7";
@@ -4248,7 +4246,7 @@ var VyLogoPride = React28.forwardRef(
4248
4246
  const redColor = "#EA3323";
4249
4247
  const orangeColor = "#F09436";
4250
4248
  const yellowColor = "#FFFF54";
4251
- const id = React28.useId();
4249
+ const id = React27.useId();
4252
4250
  return (
4253
4251
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
4254
4252
  /* @__PURE__ */ jsxRuntime.jsxs(SvgBox, { ref, viewBox: "0 0 107 54", ...props, children: [
@@ -4451,7 +4449,7 @@ var VyLogoPride = React28.forwardRef(
4451
4449
  }
4452
4450
  );
4453
4451
  VyLogoPride.displayName = "VyLogoPride";
4454
- var JumpButton = React28.forwardRef(
4452
+ var JumpButton = React27.forwardRef(
4455
4453
  (props, ref) => {
4456
4454
  const { direction, disabled, size = "sm" } = props;
4457
4455
  const { t } = useTranslation();
@@ -4486,7 +4484,7 @@ var texts19 = createTexts({
4486
4484
  en: "15 seconds backward"
4487
4485
  }
4488
4486
  });
4489
- var PlayPauseButton = React28.forwardRef((props, ref) => {
4487
+ var PlayPauseButton = React27.forwardRef((props, ref) => {
4490
4488
  const { playing, disabled, size = "sm" } = props;
4491
4489
  const { t } = useTranslation();
4492
4490
  const recipe = react.useSlotRecipe({ key: "mediaControllerButton" });
@@ -4519,7 +4517,7 @@ var texts20 = createTexts({
4519
4517
  en: "Play"
4520
4518
  }
4521
4519
  });
4522
- var SkipButton = React28.forwardRef(
4520
+ var SkipButton = React27.forwardRef(
4523
4521
  (props, ref) => {
4524
4522
  const { direction, disabled, size = "sm" } = props;
4525
4523
  const { t } = useTranslation();
@@ -4575,23 +4573,23 @@ var Nudge = (props) => {
4575
4573
  }
4576
4574
  return /* @__PURE__ */ jsxRuntime.jsx(Popover2, { defaultOpen: true, size, ...rest });
4577
4575
  };
4578
- var NudgeTrigger = React28.forwardRef(({ ...props }, ref) => {
4576
+ var NudgeTrigger = React27.forwardRef(({ ...props }, ref) => {
4579
4577
  return /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { ...props, ref });
4580
4578
  });
4581
4579
  NudgeTrigger.displayName = "NudgeTrigger";
4582
- var NudgeContent = React28.forwardRef(
4580
+ var NudgeContent = React27.forwardRef(
4583
4581
  ({ showCloseButton = true, children, ...props }, ref) => {
4584
- const [currentStep, setCurrentStep] = React28.useState(1);
4585
- const childrenArray = React28__namespace.default.Children.toArray(children);
4582
+ const [currentStep, setCurrentStep] = React27.useState(1);
4583
+ const childrenArray = React27__namespace.default.Children.toArray(children);
4586
4584
  const { open } = react.usePopoverContext();
4587
- React28.useEffect(() => {
4585
+ React27.useEffect(() => {
4588
4586
  setCurrentStep(1);
4589
4587
  }, [children, open]);
4590
4588
  const wizardPages = childrenArray.filter(
4591
- (child) => React28__namespace.default.isValidElement(child) && child.type.displayName === "NudgeWizardStep"
4589
+ (child) => React27__namespace.default.isValidElement(child) && child.type.displayName === "NudgeWizardStep"
4592
4590
  );
4593
4591
  const restChildren = childrenArray.filter(
4594
- (child) => !React28__namespace.default.isValidElement(child) || child.type.displayName !== "NudgeWizardStep"
4592
+ (child) => !React27__namespace.default.isValidElement(child) || child.type.displayName !== "NudgeWizardStep"
4595
4593
  );
4596
4594
  const totalSteps = wizardPages.length;
4597
4595
  const isLastStep = totalSteps === currentStep;
@@ -4672,7 +4670,7 @@ var NudgeWizardStep = ({ children }) => {
4672
4670
  return /* @__PURE__ */ jsxRuntime.jsx(react.chakra.div, { display: "flex", flexDirection: "column", gap: "1rem", width: "100%", children });
4673
4671
  };
4674
4672
  NudgeWizardStep.displayName = "NudgeWizardStep";
4675
- var NudgeCloseTrigger = React28.forwardRef(({ children, ...props }, ref) => {
4673
+ var NudgeCloseTrigger = React27.forwardRef(({ children, ...props }, ref) => {
4676
4674
  const isStringChild = typeof children === "string";
4677
4675
  return /* @__PURE__ */ jsxRuntime.jsx(react.Popover.CloseTrigger, { ...props, ref, asChild: !isStringChild, children });
4678
4676
  });
@@ -4680,7 +4678,7 @@ NudgeCloseTrigger.displayName = "NudgeCloseTrigger";
4680
4678
  var [RootPropsProvider, useRootProps] = react.createContext({
4681
4679
  name: "RootPropsProvider"
4682
4680
  });
4683
- var Pagination = React28__namespace.forwardRef(
4681
+ var Pagination = React27__namespace.forwardRef(
4684
4682
  (props, ref) => {
4685
4683
  const { getHref, children, ...rest } = props;
4686
4684
  const recipe = react.useSlotRecipe({ key: "pagination" });
@@ -4705,11 +4703,11 @@ var Pagination = React28__namespace.forwardRef(
4705
4703
  }
4706
4704
  );
4707
4705
  Pagination.displayName = "Pagination";
4708
- var PaginationEllipsis = React28__namespace.forwardRef((props, ref) => {
4706
+ var PaginationEllipsis = React27__namespace.forwardRef((props, ref) => {
4709
4707
  return /* @__PURE__ */ jsxRuntime.jsx(ListItem2, { children: /* @__PURE__ */ jsxRuntime.jsx(react.Pagination.Ellipsis, { ref, ...props, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(react.Box, { cursor: "default", children: "..." }) }) });
4710
4708
  });
4711
4709
  PaginationEllipsis.displayName = "PaginationEllipsis";
4712
- var PaginationItem = React28__namespace.forwardRef((props, ref) => {
4710
+ var PaginationItem = React27__namespace.forwardRef((props, ref) => {
4713
4711
  const rootProps = useRootProps();
4714
4712
  const { t } = useTranslation();
4715
4713
  const { page, totalPages } = react.usePaginationContext();
@@ -4742,7 +4740,7 @@ var PaginationItem = React28__namespace.forwardRef((props, ref) => {
4742
4740
  ) });
4743
4741
  });
4744
4742
  PaginationItem.displayName = "PaginationItem";
4745
- var PaginationPrevTrigger = React28__namespace.forwardRef((props, ref) => {
4743
+ var PaginationPrevTrigger = React27__namespace.forwardRef((props, ref) => {
4746
4744
  const { page } = react.usePaginationContext();
4747
4745
  const recipe = react.useSlotRecipe({ key: "pagination" });
4748
4746
  const styles = recipe();
@@ -4782,7 +4780,7 @@ var PaginationPrevTrigger = React28__namespace.forwardRef((props, ref) => {
4782
4780
  ) });
4783
4781
  });
4784
4782
  PaginationPrevTrigger.displayName = "PaginationPrevTrigger";
4785
- var PaginationNextTrigger = React28__namespace.forwardRef((props, ref) => {
4783
+ var PaginationNextTrigger = React27__namespace.forwardRef((props, ref) => {
4786
4784
  const { page, totalPages } = react.usePaginationContext();
4787
4785
  const recipe = react.useSlotRecipe({ key: "pagination" });
4788
4786
  const styles = recipe();
@@ -4862,17 +4860,17 @@ var texts23 = createTexts({
4862
4860
  }
4863
4861
  });
4864
4862
  var Popover2 = react.Popover.Root;
4865
- var PopoverTrigger = React28.forwardRef(({ children, ...props }, ref) => {
4863
+ var PopoverTrigger = React27.forwardRef(({ children, ...props }, ref) => {
4866
4864
  const isStringChild = typeof children === "string";
4867
4865
  return /* @__PURE__ */ jsxRuntime.jsx(react.Popover.Trigger, { ...props, ref, asChild: !isStringChild, children });
4868
4866
  });
4869
4867
  PopoverTrigger.displayName = "PopoverTrigger";
4870
- var PopoverContent = React28.forwardRef(
4868
+ var PopoverContent = React27.forwardRef(
4871
4869
  ({ children, showCloseButton = false, ...props }, ref) => {
4872
4870
  const { colorMode } = useColorMode();
4873
- const closeButtonRef = React28__namespace.default.useRef(null);
4871
+ const closeButtonRef = React27__namespace.default.useRef(null);
4874
4872
  const { open } = react.usePopoverContext();
4875
- React28.useEffect(() => {
4873
+ React27.useEffect(() => {
4876
4874
  if (showCloseButton && open && closeButtonRef.current) {
4877
4875
  closeButtonRef.current.focus();
4878
4876
  }
@@ -4906,7 +4904,7 @@ var ProgressDot = ({ isActive }) => {
4906
4904
  }
4907
4905
  );
4908
4906
  };
4909
- var ProgressIndicator = React28.forwardRef(({ numberOfSteps, activeStep }, ref) => {
4907
+ var ProgressIndicator = React27.forwardRef(({ numberOfSteps, activeStep }, ref) => {
4910
4908
  const { t } = useTranslation();
4911
4909
  const recipe = react.useSlotRecipe({
4912
4910
  key: "progressIndicator"
@@ -5081,7 +5079,7 @@ var SporProvider = ({
5081
5079
  children
5082
5080
  ] }) }) });
5083
5081
  };
5084
- var StepperContext = React28__namespace.default.createContext(null);
5082
+ var StepperContext = React27__namespace.default.createContext(null);
5085
5083
  var StepperProvider = ({
5086
5084
  activeStep,
5087
5085
  children,
@@ -5098,7 +5096,7 @@ var StepperProvider = ({
5098
5096
  );
5099
5097
  };
5100
5098
  var useStepper = () => {
5101
- const context = React28__namespace.default.useContext(StepperContext);
5099
+ const context = React27__namespace.default.useContext(StepperContext);
5102
5100
  if (!context) {
5103
5101
  throw new Error(
5104
5102
  "useStepper must be used within a StepperProvider. Most likely, you forgot to wrap your StepperStep in a Stepper component"
@@ -5106,7 +5104,7 @@ var useStepper = () => {
5106
5104
  }
5107
5105
  return context;
5108
5106
  };
5109
- var Stepper = React28.forwardRef(
5107
+ var Stepper = React27.forwardRef(
5110
5108
  function Stepper2(props, ref) {
5111
5109
  const {
5112
5110
  onClick = () => {
@@ -5254,7 +5252,7 @@ var getState = (stepNumber, activeStep) => {
5254
5252
  }
5255
5253
  return "disabled";
5256
5254
  };
5257
- var Tabs = React28.forwardRef((props, ref) => {
5255
+ var Tabs = React27.forwardRef((props, ref) => {
5258
5256
  const { variant = "core", size = "sm" } = props;
5259
5257
  return /* @__PURE__ */ jsxRuntime.jsx(react.Tabs.Root, { ...props, ref, variant, size });
5260
5258
  });
@@ -5263,7 +5261,7 @@ var TabsList = react.Tabs.List;
5263
5261
  var TabsTrigger = react.Tabs.Trigger;
5264
5262
  var TabsIndicator = react.Tabs.Indicator;
5265
5263
  var TabsContent = react.Tabs.Content;
5266
- var Table = React28.forwardRef((props, ref) => {
5264
+ var Table = React27.forwardRef((props, ref) => {
5267
5265
  const { variant = "ghost", size, colorPalette = "green", children } = props;
5268
5266
  const recipe = react.useSlotRecipe({ key: "table" });
5269
5267
  const styles = recipe({ variant, size });
@@ -7625,7 +7623,7 @@ var fieldSlotRecipe = react.defineSlotRecipe({
7625
7623
  textStyle: "xs",
7626
7624
  width: "fit-content",
7627
7625
  position: "absolute",
7628
- bottom: -5,
7626
+ top: "100%",
7629
7627
  left: 3,
7630
7628
  zIndex: "dropdown",
7631
7629
  maxWidth: "50ch",