@vygruppen/spor-react 10.2.0 → 10.4.0

package/dist/index.js

@@ -1149,6 +1149,7 @@ function Combobox({
   emptyContent,
   inputRef: externalInputRef,
   allowsEmptyCollection,
+  variant,
   ...rest
 }) {
   const { contains: contains2 } = reactAria.useFilter({ sensitivity: "base" });
@@ -1202,6 +1203,7 @@ function Combobox({
       ref: inputRef,
       role: "combobox",
       label,
+      variant,
       "aria-expanded": state2.isOpen,
       "aria-autocomplete": "list",
       "aria-controls": listboxId,
@@ -1243,7 +1245,8 @@ function Combobox({
         id: listboxId,
         listBoxRef,
         emptyContent,
-        maxWidth: inputWidth
+        maxWidth: inputWidth,
+        variant
       },
       rest.children
     )
@@ -1368,10 +1371,11 @@ function ListBox({
   listBoxRef,
   state: state2,
   maxWidth,
+  variant,
   ...props
 }) {
   const { listBoxProps } = reactAria.useListBox(props, state2, listBoxRef);
-  const styles3 = react.useMultiStyleConfig("ListBox", {});
+  const styles3 = react.useMultiStyleConfig("ListBox", { variant });
   return /* @__PURE__ */ React85__namespace.default.createElement(
     react.List,
     {
@@ -1379,7 +1383,8 @@ function ListBox({
       ref: listBoxRef,
       sx: styles3.container,
       "aria-busy": isLoading,
-      maxWidth
+      maxWidth,
+      variant
     },
     state2.collection.size === 0 && props.emptyContent,
     Array.from(state2.collection).map(
@@ -1494,16 +1499,17 @@ function InfoSelect({
     triggerRef
   );
   const stateStyle = "completed";
+  const hasChosenValue = state2.selectedItem !== null;
   const styles3 = react.useMultiStyleConfig("InfoSelect", {
     isOpen: state2.isOpen,
     isLabelSrOnly,
     variant,
-    stateStyle
+    stateStyle,
+    hasChosenValue
   });
   const { buttonProps } = reactAria.useButton(triggerProps, triggerRef);
   const { t: t2 } = useTranslation();
   const formControl = react.useFormControlProps(props);
-  const hasChosenValue = state2.selectedItem !== null;
   return /* @__PURE__ */ React85__namespace.default.createElement(react.Box, { sx: styles3.container }, /* @__PURE__ */ React85__namespace.default.createElement(
     reactAria.HiddenSelect,
     {
@@ -1543,7 +1549,7 @@ function InfoSelect({
         ...valueProps,
         h: isLabelSrOnly ? "" : !hasChosenValue ? "0px" : "18px",
         hidden: !hasChosenValue,
-        transform: isLabelSrOnly ? "" : "scale(1) translateY(-10px)",
+        transform: isLabelSrOnly ? "" : "scale(1) translateY(-12px)",
         transitionProperty: "var(--spor-transition-property-common)",
         transitionDuration: "var(--spor-transition-duration-normal)"
       },
@@ -1563,7 +1569,8 @@ function InfoSelect({
         ...menuProps,
         state: state2,
         listBoxRef: listboxRef,
-        borderBottomRadius: "sm"
+        borderBottomRadius: "sm",
+        variant
       },
       props.children
     )
@@ -1654,8 +1661,10 @@ function NumericStepper({
   withInput = true,
   stepSize = 1,
   showZero = false,
+  ariaLabelContext = { singular: "", plural: "" },
   ...boxProps
 }) {
+  const addButtonRef = React85.useRef(null);
   const { t: t2 } = useTranslation();
   const styles3 = react.useMultiStyleConfig("NumericStepper", {});
   const [value, onChange] = react.useControllableState({
@@ -1665,12 +1674,26 @@ function NumericStepper({
   });
   const formControlProps = react.useFormControl({ id: idProp, isDisabled });
   const clampedStepSize = Math.max(Math.min(stepSize, 10), 1);
+  const focusOnAddButton = () => {
+    var _a6;
+    (_a6 = addButtonRef.current) == null ? void 0 : _a6.focus();
+  };
   return /* @__PURE__ */ React85__namespace.default.createElement(react.Flex, { __css: styles3.container, ...boxProps }, /* @__PURE__ */ React85__namespace.default.createElement(
     VerySmallButton,
     {
       icon: /* @__PURE__ */ React85__namespace.default.createElement(SubtractIcon, { stepLabel: clampedStepSize }),
-      "aria-label": t2(texts2.decrementButtonAriaLabel(clampedStepSize)),
-      onClick: () => onChange(Math.max(value - clampedStepSize, minValue)),
+      "aria-label": t2(
+        texts2.decrementButtonAriaLabel(
+          clampedStepSize,
+          stepSize == 1 ? ariaLabelContext.singular : ariaLabelContext.plural
+        )
+      ),
+      onClick: () => {
+        onChange(Math.max(value - clampedStepSize, minValue));
+        if (Math.max(value - clampedStepSize, minValue) <= minValue) {
+          focusOnAddButton();
+        }
+      },
       visibility: value <= minValue ? "hidden" : "visible",
       isDisabled: formControlProps.disabled,
       id: value <= minValue ? void 0 : formControlProps.id
@@ -1689,13 +1712,16 @@ function NumericStepper({
       width: `${Math.max(value.toString().length + 1, 3)}ch`,
       visibility: !showZero && value === 0 ? "hidden" : "visible",
       "aria-live": "assertive",
-      "aria-label": value.toString(),
+      "aria-label": ariaLabelContext.plural !== "" ? t2(texts2.currentNumberAriaLabel(ariaLabelContext.plural)) : "",
       onChange: (e) => {
         const numericInput = Number(e.target.value);
         if (Number.isNaN(numericInput)) {
           return;
         }
         onChange(Math.max(Math.min(numericInput, maxValue), minValue));
+        if (!showZero && Math.max(Math.min(numericInput, maxValue), minValue) === 0) {
+          focusOnAddButton();
+        }
       }
     }
   ) : /* @__PURE__ */ React85__namespace.default.createElement(
@@ -1703,14 +1729,21 @@ function NumericStepper({
     {
       sx: styles3.text,
       visibility: !showZero && value === 0 ? "hidden" : "visible",
-      "aria-label": value.toString()
+      "aria-live": "assertive",
+      "aria-label": ariaLabelContext.plural !== "" ? t2(texts2.currentNumberAriaLabel(ariaLabelContext.plural)) : ""
     },
     value
   ), /* @__PURE__ */ React85__namespace.default.createElement(
     VerySmallButton,
     {
+      ref: addButtonRef,
       icon: /* @__PURE__ */ React85__namespace.default.createElement(AddIcon, { stepLabel: clampedStepSize }),
-      "aria-label": t2(texts2.incrementButtonAriaLabel(clampedStepSize)),
+      "aria-label": t2(
+        texts2.incrementButtonAriaLabel(
+          clampedStepSize,
+          stepSize == 1 ? ariaLabelContext.singular : ariaLabelContext.plural
+        )
+      ),
       onClick: () => onChange(Math.min(value + clampedStepSize, maxValue)),
       visibility: value >= maxValue ? "hidden" : "visible",
       isDisabled: formControlProps.disabled,
@@ -1722,10 +1755,19 @@ var VerySmallButton, SubtractIcon, AddIcon, texts2;
 var init_NumericStepper = __esm({
   "src/input/NumericStepper.tsx"() {
     init_src();
-    VerySmallButton = (props) => {
+    VerySmallButton = React85__namespace.default.forwardRef((props, ref) => {
       const styles3 = react.useMultiStyleConfig("NumericStepper", {});
-      return /* @__PURE__ */ React85__namespace.default.createElement(exports.IconButton, { variant: "primary", size: "xs", sx: styles3.button, ...props });
-    };
+      return /* @__PURE__ */ React85__namespace.default.createElement(
+        exports.IconButton,
+        {
+          variant: "primary",
+          size: "xs",
+          sx: styles3.button,
+          ref,
+          ...props
+        }
+      );
+    });
     SubtractIcon = ({ stepLabel, ...props }) => /* @__PURE__ */ React85__namespace.default.createElement(React85__namespace.default.Fragment, null, /* @__PURE__ */ React85__namespace.default.createElement(
       react.Box,
       {
@@ -1782,20 +1824,28 @@ var init_NumericStepper = __esm({
       )
     ), stepLabel > 1 && /* @__PURE__ */ React85__namespace.default.createElement(react.chakra.span, { paddingRight: "1" }, stepLabel.toString()));
     texts2 = createTexts({
-      decrementButtonAriaLabel(stepSize) {
+      currentNumberAriaLabel(ariaContext) {
         return {
-          nb: `Trekk fra ${stepSize}`,
-          en: `Subtract ${stepSize}`,
-          nn: `Trekk fr\xE5 ${stepSize}`,
-          sv: `Subtrahera ${stepSize}`
+          nb: `Valgt antall ${ariaContext}`,
+          en: `Chosen number of ${ariaContext}`,
+          nn: `Valgt antall ${ariaContext}`,
+          sv: `Valgt antall ${ariaContext}`
         };
       },
-      incrementButtonAriaLabel(stepSize) {
+      decrementButtonAriaLabel(stepSize, ariaContext) {
         return {
-          nb: `Legg til ${stepSize}`,
-          en: `Add ${stepSize}`,
-          nn: `Legg til ${stepSize}`,
-          sv: `L\xE4gg till ${stepSize}`
+          nb: `Trekk fra ${stepSize} ${ariaContext}`,
+          en: `Subtract ${stepSize} ${ariaContext}`,
+          nn: `Trekk fr\xE5 ${stepSize} ${ariaContext}`,
+          sv: `Subtrahera ${stepSize} ${ariaContext}`
+        };
+      },
+      incrementButtonAriaLabel(stepSize, ariaContext) {
+        return {
+          nb: `Legg til ${stepSize} ${ariaContext}`,
+          en: `Add ${stepSize} ${ariaContext}`,
+          nn: `Legg til ${stepSize} ${ariaContext}`,
+          sv: `L\xE4gg till ${stepSize} ${ariaContext}`
         };
       }
     });
@@ -1888,6 +1938,7 @@ var init_CountryCodeSelect = __esm({
           label: t2(texts4.countryCode),
           isLabelSrOnly: true,
           items: callingCodes,
+          variant: props.variant,
           ...props
         },
         (item) => /* @__PURE__ */ React85__namespace.default.createElement(reactStately.Item, { key: item.key }, item.key)
@@ -1915,6 +1966,7 @@ var init_PhoneNumberInput = __esm({
         name,
         value: externalValue,
         onChange: externalOnChange,
+        variant,
         ...boxProps
       }, ref) => {
         const { t: t2 } = useTranslation();
@@ -1937,7 +1989,8 @@ var init_PhoneNumberInput = __esm({
                 label: t2(texts5.countryCodeLabel),
                 width: "6.25rem",
                 height: "100%",
-                value: "+47"
+                value: "+47",
+                variant
               },
               /* @__PURE__ */ React85__namespace.default.createElement(reactStately.Item, { key: "+47" }, "+47")
             )
@@ -1952,7 +2005,8 @@ var init_PhoneNumberInput = __esm({
               }),
               name: name ? `${name}-country-code` : "country-code",
               height: "100%",
-              width: "6.25rem"
+              width: "6.25rem",
+              variant
             }
           )
         ), /* @__PURE__ */ React85__namespace.default.createElement(
@@ -1971,7 +2025,8 @@ var init_PhoneNumberInput = __esm({
               });
             },
             position: "relative",
-            left: "1px"
+            left: "1px",
+            variant
           }
         ));
       }
@@ -2074,8 +2129,8 @@ exports.Switch = void 0;
 var init_Switch = __esm({
   "src/input/Switch.tsx"() {
     exports.Switch = react.forwardRef(
-      ({ size: size2 = "md", ...props }, ref) => {
-        return /* @__PURE__ */ React85__namespace.default.createElement(react.Switch, { size: size2, ...props, ref });
+      ({ size: size2 = "md", as = "div", ...props }, ref) => {
+        return /* @__PURE__ */ React85__namespace.default.createElement(react.Switch, { as, size: size2, ...props, ref });
       }
     );
   }
@@ -13665,6 +13720,7 @@ var init_info_select = __esm({
         label: {
           position: "relative",
           fontSize: ["mobile.xs", "desktop.sm"],
+          marginTop: props.hasChosenValue ? 2 : 0,
           ...props.isLabelSrOnly ? srOnly2 : {}
         },
         innerButton: {
@@ -14043,102 +14099,146 @@ var init_info_tag = __esm({
     info_tag_default = config20;
   }
 });
-var helpers14, config21, input_default;
-var init_input2 = __esm({
-  "src/theme/components/input.ts"() {
-    init_dist4();
+
+// src/theme/utils/input-utils.ts
+function inputVariant(state2, props) {
+  switch (state2) {
+    case "base":
+      return {
+        ...baseBackground("default", props),
+        ...baseBorder("default", props),
+        _hover: {
+          ...baseBorder("hover", props)
+        },
+        _active: {
+          ...baseBackground("active", props),
+          ...baseBorder("default", props)
+        },
+        _selected: {
+          ...baseBackground("selected", props),
+          ...baseBorder("selected", props)
+        }
+      };
+    case "floating":
+      return {
+        boxShadow: "sm",
+        ...floatingBackground("default", props),
+        ...floatingBorder("default", props),
+        _hover: {
+          ...floatingBorder("hover", props),
+          ...floatingBackground("hover", props)
+        },
+        _active: {
+          ...floatingBorder("active", props),
+          ...floatingBackground("active", props)
+        },
+        _selected: {
+          ...floatingBorder("selected", props),
+          ...floatingBackground("selected", props)
+        }
+      };
+    case "default":
+    default:
+      return {
+        ...baseBackground("default", props),
+        ...baseBorder("default", props),
+        _hover: {
+          ...baseBorder("hover", props)
+        },
+        _active: {
+          ...baseBackground("active", props),
+          ...baseBorder("default", props)
+        },
+        _selected: {
+          ...baseBackground("selected", props),
+          ...baseBorder("selected", props)
+        }
+      };
+  }
+}
+var inputBaseStyle;
+var init_input_utils = __esm({
+  "src/theme/utils/input-utils.ts"() {
     init_base_utils();
+    init_floating_utils();
     init_focus_utils();
     init_surface_utils();
-    init_floating_utils();
-    helpers14 = react.createMultiStyleConfigHelpers(inputAnatomy.keys);
-    config21 = helpers14.defineMultiStyleConfig({
-      baseStyle: (props) => ({
-        field: {
-          appearance: "none",
-          width: "100%",
-          outline: "none",
-          border: 0,
-          borderRadius: "sm",
-          transitionProperty: "common",
-          transitionDuration: "fast",
-          position: "relative",
-          paddingX: 3,
-          height: 8,
-          fontSize: "mobile.md",
+    inputBaseStyle = (props) => ({
+      field: {
+        appearance: "none",
+        width: "100%",
+        outline: "none",
+        border: 0,
+        borderRadius: "sm",
+        transitionProperty: "common",
+        transitionDuration: "fast",
+        position: "relative",
+        paddingX: 3,
+        height: 8,
+        fontSize: "mobile.md",
+        _focusVisible: {
+          ...focusVisibleStyles(props)._focusVisible,
+          outlineOffset: 0
+        },
+        _disabled: {
+          ...surface("disabled", props),
+          ...baseBorder("disabled", props),
+          pointerEvents: "none"
+        },
+        _invalid: {
+          ...baseBorder("invalid", props),
           _hover: {
             ...baseBorder("hover", props)
-          },
-          _active: {
-            ...baseBackground("active", props),
-            ...baseBorder("default", props)
-          },
-          _focusVisible: {
-            ...focusVisibleStyles(props)._focusVisible,
-            outlineOffset: 0
-          },
-          _disabled: {
-            ...surface("disabled", props),
-            ...baseBorder("disabled", props),
-            pointerEvents: "none"
-          },
-          _invalid: {
-            ...baseBorder("invalid", props),
-            _hover: {
-              ...baseBorder("hover", props)
-            }
-          },
-          " + label": {
-            fontSize: ["mobile.sm", "desktop.sm"],
-            top: "2px",
-            left: props.paddingLeft || props.pl || 3,
-            zIndex: 2,
-            position: "absolute",
-            marginY: 2,
-            transition: ".1s ease-out",
-            transformOrigin: "top left",
-            cursor: "text"
-          },
-          "&:not(:placeholder-shown)": {
-            paddingTop: "1rem",
-            "& + label": {
-              transform: "scale(0.825) translateY(-10px)"
-            }
           }
         },
-        element: {
-          height: "100%"
+        " + label": {
+          fontSize: ["mobile.sm", "desktop.sm"],
+          top: "2px",
+          left: props.paddingLeft || props.pl || 3,
+          zIndex: 2,
+          position: "absolute",
+          marginY: 2,
+          transition: ".1s ease-out",
+          transformOrigin: "top left",
+          cursor: "text"
         },
-        group: {
-          ":has(:disabled)": {
-            ...baseText("disabled", props)
+        "&:not(:placeholder-shown)": {
+          paddingTop: "1rem",
+          "& + label": {
+            transform: "scale(0.825) translateY(-10px)"
           }
         }
+      },
+      element: {
+        height: "100%"
+      },
+      group: {
+        ":has(:disabled)": {
+          ...baseText("disabled", props)
+        }
+      }
+    });
+  }
+});
+var helpers14, config21, input_default;
+var init_input2 = __esm({
+  "src/theme/components/input.ts"() {
+    init_dist4();
+    init_input_utils();
+    helpers14 = react.createMultiStyleConfigHelpers(inputAnatomy.keys);
+    config21 = helpers14.defineMultiStyleConfig({
+      baseStyle: (props) => ({
+        ...inputBaseStyle(props)
       }),
       variants: {
         base: (props) => ({
           field: {
-            ...baseBackground("default", props),
-            ...baseBorder("default", props)
+            ...inputVariant("base", props)
           }
         }),
         floating: (props) => ({
           field: {
-            boxShadow: "sm",
-            ...floatingBackground("default", props),
-            ...floatingBorder("default", props),
-            _hover: {
-              ...floatingBorder("hover", props),
-              ...floatingBackground("hover", props)
-            },
-            _active: {
-              ...floatingBorder("active", props),
-              ...floatingBackground("active", props)
-            },
-            _selected: {
-              ...floatingBorder("selected", props),
-              ...floatingBackground("selected", props)
-            }
+            ...inputVariant("floating", props)
           }
         })
       },
@@ -14408,6 +14508,7 @@ var init_listbox = __esm({
     init_ghost_utils();
     init_surface_utils();
     init_outline_utils();
+    init_floating_utils();
     parts11 = anatomy("ListBox").parts(
       "container",
       "item",
@@ -14424,8 +14525,7 @@ var init_listbox = __esm({
           maxHeight: "50vh",
           width: "100%",
           listStyle: "none",
-          borderBottomRadius: "sm",
-          ...baseBorder("default", props)
+          borderBottomRadius: "sm"
         },
         item: {
           paddingX: 2,
@@ -14457,7 +14557,22 @@ var init_listbox = __esm({
             ...ghostText("selected", props)
           }
         }
-      })
+      }),
+      variants: {
+        base: (props) => ({
+          container: {
+            ...baseBorder("default", props)
+          }
+        }),
+        floating: (props) => ({
+          container: {
+            ...floatingBorder("default", props)
+          }
+        })
+      },
+      defaultProps: {
+        variant: "base"
+      }
     });
     listbox_default = config24;
   }
@@ -15143,7 +15258,7 @@ var init_select = __esm({
   "src/theme/components/select.ts"() {
     init_dist4();
     init_base_utils();
-    init_input2();
+    init_input_utils();
     parts18 = selectAnatomy.extend("root");
     helpers26 = react.createMultiStyleConfigHelpers(parts18.keys);
     config34 = helpers26.defineMultiStyleConfig({
@@ -15154,7 +15269,7 @@ var init_select = __esm({
           position: "relative",
           "& + label": {
             fontSize: ["mobile.sm", "desktop.sm"],
-            top: "2px",
+            top: "0.2rem",
             left: 3,
             zIndex: 2,
             position: "absolute",
@@ -15167,10 +15282,9 @@ var init_select = __esm({
           }
         },
         field: {
-          ...input_default.baseStyle(props).field,
+          ...inputBaseStyle(props).field,
           appearance: "none",
-          paddingTop: "1rem",
-          "option, optgroup": {}
+          paddingTop: "1rem"
         },
         icon: {
           width: 5,
@@ -15184,7 +15298,22 @@ var init_select = __esm({
             ...baseText("disabled", props)
           }
         }
-      })
+      }),
+      variants: {
+        base: (props) => ({
+          field: {
+            ...inputVariant("base", props)
+          }
+        }),
+        floating: (props) => ({
+          field: {
+            ...inputVariant("floating", props)
+          }
+        })
+      },
+      defaultProps: {
+        variant: "base"
+      }
     });
     select_default = config34;
   }
@@ -15736,10 +15865,10 @@ var init_tabs = __esm({
 var config40, textarea_default;
 var init_textarea = __esm({
   "src/theme/components/textarea.ts"() {
-    init_input2();
+    init_input_utils();
     config40 = react.defineStyleConfig({
       baseStyle: (props) => ({
-        ...input_default.baseStyle(props).field,
+        ...inputBaseStyle(props).field,
         minHeight: "5rem",
         verticalAlign: "top",
         appearance: "none",
@@ -15752,7 +15881,18 @@ var init_textarea = __esm({
             transform: "scale(0.825) translateY(-10px)"
           }
         }
-      })
+      }),
+      variants: {
+        base: (props) => ({
+          ...inputVariant("base", props)
+        }),
+        floating: (props) => ({
+          ...inputVariant("floating", props)
+        })
+      },
+      defaultProps: {
+        variant: "base"
+      }
     });
     textarea_default = config40;
   }

package/dist/index.mjs

@@ -1 +1 @@
-export { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, AttachedInputs, Badge, Box, Brand, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Button, ButtonGroup, CardSelect, CargonetLogo, Center, Checkbox, CheckboxGroup, ChoiceChip, ClosableAlert, CloseButton, Code, Collapse, ColorInlineLoader, ColorSpinner, Combobox, Container, ContentLoader, DarkFullScreenLoader, DarkInlineLoader, DarkMode, DarkSpinner, DatePicker, DateRangePicker, Divider, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerFooter, ModalHeader as DrawerHeader, DrawerOverlay, Expandable, ExpandableAlert, ExpandableItem, Fade, Flex, FloatingActionButton, FormControl, FormErrorMessage, FormHelperText, FormLabel, FullScreenDrawer, Grid, GridItem, HStack, Heading, IconButton, Image, Img, InfoSelect, InfoTag, Input, InputGroup, InputLeftElement, InputRightElement, Item, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, LightMode, LightSpinner, LineIcon, ListBox, ListItem, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, NativeSelect, Nudge, NumericStepper, OrderedList, Pagination, PasswordInput, PhoneNumberInput, PlayPauseButton, Portal, PressableCard, ProgressBar, ProgressIndicator, ProgressLoader, Radio, RadioCard, RadioCardGroup, RadioCardGroupContext, RadioGroup, ScaleFade, SearchInput, Section, SimpleDrawer, SimpleGrid, Skeleton, SkeletonCircle, SkeletonText, SkipButton, Slide, SlideFade, Spacer, SporProvider, Stack, StaticAlert, StaticCard, Stepper, StepperStep, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableCaption, Tabs, Tbody, Td, Text, TextLink, Textarea, Tfoot, Th, Thead, Time, TimePicker, Tooltip, Tr, TravelTag, UnorderedList, VStack, VyLogo, VyLogoPride, WizardNudge, Wrap, WrapItem, brandTheme, createTexts, defineStyleConfig, extendTheme, fontFaces, slugify, theme, tokens, useBreakpointValue, useClipboard, useColorMode, useColorModePreference, useColorModeValue, useControllableProp, useDisclosure, useMediaQuery, useMergeRefs, useOutsideClick, usePrefersReducedMotion, useSize, useTheme, useToast, useToken, useTranslation } from './chunk-BPDFFQ3U.mjs';
+export { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, AttachedInputs, Badge, Box, Brand, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Button, ButtonGroup, CardSelect, CargonetLogo, Center, Checkbox, CheckboxGroup, ChoiceChip, ClosableAlert, CloseButton, Code, Collapse, ColorInlineLoader, ColorSpinner, Combobox, Container, ContentLoader, DarkFullScreenLoader, DarkInlineLoader, DarkMode, DarkSpinner, DatePicker, DateRangePicker, Divider, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerFooter, ModalHeader as DrawerHeader, DrawerOverlay, Expandable, ExpandableAlert, ExpandableItem, Fade, Flex, FloatingActionButton, FormControl, FormErrorMessage, FormHelperText, FormLabel, FullScreenDrawer, Grid, GridItem, HStack, Heading, IconButton, Image, Img, InfoSelect, InfoTag, Input, InputGroup, InputLeftElement, InputRightElement, Item, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, LightMode, LightSpinner, LineIcon, ListBox, ListItem, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, NativeSelect, Nudge, NumericStepper, OrderedList, Pagination, PasswordInput, PhoneNumberInput, PlayPauseButton, Portal, PressableCard, ProgressBar, ProgressIndicator, ProgressLoader, Radio, RadioCard, RadioCardGroup, RadioCardGroupContext, RadioGroup, ScaleFade, SearchInput, Section, SimpleDrawer, SimpleGrid, Skeleton, SkeletonCircle, SkeletonText, SkipButton, Slide, SlideFade, Spacer, SporProvider, Stack, StaticAlert, StaticCard, Stepper, StepperStep, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableCaption, Tabs, Tbody, Td, Text, TextLink, Textarea, Tfoot, Th, Thead, Time, TimePicker, Tooltip, Tr, TravelTag, UnorderedList, VStack, VyLogo, VyLogoPride, WizardNudge, Wrap, WrapItem, brandTheme, createTexts, defineStyleConfig, extendTheme, fontFaces, slugify, theme, tokens, useBreakpointValue, useClipboard, useColorMode, useColorModePreference, useColorModeValue, useControllableProp, useDisclosure, useMediaQuery, useMergeRefs, useOutsideClick, usePrefersReducedMotion, useSize, useTheme, useToast, useToken, useTranslation } from './chunk-T4CLCBB5.mjs';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vygruppen/spor-react",
-  "version": "10.2.0",
+  "version": "10.4.0",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",