@vygruppen/spor-react 13.0.0 → 13.0.2

package/dist/index.d.cts

@@ -130,13 +130,13 @@ type ExpandableItemProps = HeadingLevel & {
 };
 
 declare const Accordion: ({ ref, ...props }: AccordionProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const AccordionItemTrigger: ({ ref, ...props }: AccordionItemTriggerProps & {
-    ref?: React.RefObject<HTMLButtonElement>;
+    ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const AccordionItemContent: ({ ref, ...props }: AccordionItemContentProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const AccordionItem: React$1.ForwardRefExoticComponent<Accordion$1.ItemProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -153,7 +153,7 @@ declare const AccordionItem: React$1.ForwardRefExoticComponent<Accordion$1.ItemP
  * ```
  */
 declare const Expandable: ({ ref, ...props }: ExpandableProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 /**
  * An item in a set of Expandables. Must be wrapped in an `<Accordion>` component.
@@ -206,7 +206,7 @@ type AlertProps = Omit<Alert$1.RootProps, "colorPalette"> & {
  * @see Docs https://spor.vy.no/alert
  */
 declare const Alert: ({ ref, ...props }: AlertProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element | null;
 
 declare const alertExpandableSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "itemTrigger" | "itemContent" | "itemIndicator" | "indicator" | "title", {
@@ -366,7 +366,7 @@ type ExpandableAlertProps = PropsWithChildren<ExpandableAlertVariantProps> & Omi
  * ```
  */
 declare const ExpandableAlert: ({ ref, ...props }: ExpandableAlertProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const alertServiceSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "itemTrigger" | "itemBody" | "itemContent" | "itemTriggerTitle" | "notificationText", _chakra_ui_react.SlotRecipeVariantRecord<"root" | "itemTrigger" | "itemBody" | "itemContent" | "itemTriggerTitle" | "notificationText">>;
@@ -403,7 +403,7 @@ type ServiceAlertProps = Omit<AlertProps, "variant"> & PropsWithChildren<Service
  * ```
  */
 declare const ServiceAlert: ({ ref, ...props }: ServiceAlertProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 /**
@@ -421,7 +421,7 @@ declare const ServiceAlert: ({ ref, ...props }: ServiceAlertProps & {
  * ```
  */
 declare const Breadcrumb: ({ ref, children, css, ...props }: BreadcrumbRootProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const buttonRecipe: _chakra_ui_react.RecipeDefinition<{
@@ -534,7 +534,7 @@ type ButtonProps = Exclude<ButtonProps$1, "size" | "variant" | "colorPalette"> &
     href?: string;
 };
 declare const Button: ({ ref, loading, disabled, loadingText, variant, size, leftIcon, rightIcon, type, children, ...rest }: ButtonProps & {
-    ref?: React__default.RefObject<HTMLButtonElement>;
+    ref?: React__default.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const groupRecipe: _chakra_ui_react.RecipeDefinition<{
@@ -584,12 +584,12 @@ type ButtonGroupProps = GroupProps & PropsWithChildren<GroupVariantProps>;
  * </ButtonGroup>
  */
 declare const ButtonGroup: ({ ref, ...props }: ButtonGroupProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type ClipboardButtonProps = ButtonProps;
 declare const ClipboardButton: ({ ref, ...props }: ClipboardButtonProps & {
-    ref?: React$1.RefObject<HTMLButtonElement>;
+    ref?: React$1.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const Clipboard: React$1.ForwardRefExoticComponent<Clipboard$1.RootProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -639,7 +639,7 @@ type IconButtonProps = Exclude<IconButtonProps$1, "variant" | "spinner" | "icon"
  * ```
  */
 declare const IconButton: ({ ref, ...props }: IconButtonProps & {
-    ref?: React__default.RefObject<HTMLButtonElement | null>;
+    ref?: React__default.Ref<HTMLButtonElement | null>;
 }) => react_jsx_runtime.JSX.Element;
 
 type CloseButtonProps = Omit<IconButtonProps, "variant" | "aria-label"> & {
@@ -656,7 +656,7 @@ type CloseButtonProps = Omit<IconButtonProps, "variant" | "aria-label"> & {
  * ```
  */
 declare const CloseButton: ({ ref, size, ...props }: CloseButtonProps & {
-    ref?: React.RefObject<HTMLButtonElement | null>;
+    ref?: React.Ref<HTMLButtonElement | null>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const floatingActionButtonSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"icon" | "root" | "text", {
@@ -754,7 +754,7 @@ type FloatingActionButtonProps = BoxProps & PropsWithChildren<FloatingActionButt
  * />
  */
 declare const FloatingActionButton: ({ ref, children, icon, variant, isTextVisible: externalIsTextVisible, placement, ...props }: FloatingActionButtonProps & {
-    ref?: React__default.RefObject<HTMLButtonElement>;
+    ref?: React__default.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type Props$5 = {
@@ -785,7 +785,7 @@ type BaseCalendarState = {
     prevButtonProps: AriaButtonProps<"button">;
     startValue: CalendarDate | null;
     isSelectingRange: boolean;
-    ref?: React.RefObject<HTMLDivElement | null>;
+    ref?: React.Ref<HTMLDivElement | null>;
 };
 type SingleCalendarState = BaseCalendarState & {
     mode: "single";
@@ -921,7 +921,7 @@ declare const pressableCardRecipe: _chakra_ui_react.RecipeDefinition<{
  */
 type PressableCardProps = RecipeVariantProps<typeof pressableCardRecipe> & ButtonProps$1;
 declare const PressableCard: ({ ref, ...props }: PressableCardProps & {
-    ref?: React.RefObject<HTMLButtonElement>;
+    ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const radioCardSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "item" | "itemContent" | "label" | "itemText" | "itemDescription", {
@@ -1008,7 +1008,7 @@ type RadioCardItemProps = Exclude<RadioCard$1.ItemProps, "colorPalette" | "indic
     ariaLabel?: string;
 };
 declare const RadioCard: ({ ref, ...props }: RadioCardItemProps & {
-    ref?: React__default.RefObject<HTMLInputElement>;
+    ref?: React__default.Ref<HTMLInputElement>;
 }) => react_jsx_runtime.JSX.Element;
 type RadioCardRootProps = RadioCardVariantProps & Exclude<RadioCard$1.RootProps, "variant"> & {
     children: React__default.ReactNode;
@@ -1017,12 +1017,12 @@ type RadioCardRootProps = RadioCardVariantProps & Exclude<RadioCard$1.RootProps,
     display?: string;
 };
 declare const RadioCardGroup: ({ ref, ...props }: RadioCardRootProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const RadioCardLabel: React__default.ForwardRefExoticComponent<RadioCard$1.LabelProps & React__default.RefAttributes<HTMLDivElement>>;
 
 declare const Separator: ({ ref, ...props }: SeparatorProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const staticCardRecipe: _chakra_ui_react.RecipeDefinition<{
@@ -1093,7 +1093,7 @@ declare const staticCardRecipe: _chakra_ui_react.RecipeDefinition<{
  */
 type StaticCardProps = RecipeVariantProps<typeof staticCardRecipe> & BoxProps;
 declare const StaticCard: ({ ref, ...props }: StaticCardProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 /**
@@ -1114,7 +1114,7 @@ declare function useColorModeValue<T>(light: T, dark: T): T;
 declare function ColorModeIcon(): react_jsx_runtime.JSX.Element;
 type ColorModeButtonProps = Omit<IconButtonProps$1, "aria-label">;
 declare const ColorModeButton: ({ ref, ...props }: ColorModeButtonProps & {
-    ref?: React$1.RefObject<HTMLButtonElement>;
+    ref?: React$1.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const fieldSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "label" | "requiredIndicator" | "helperText" | "errorText", _chakra_ui_react.SlotRecipeVariantRecord<"root" | "label" | "requiredIndicator" | "helperText" | "errorText">>;
@@ -1151,10 +1151,10 @@ type FieldProps = Omit<Field$1.RootProps, "label" | "onChange" | "onBlur"> & Rea
  * This component is not exported and should be used as a wrapper for other input components.
  */
 declare const Field: ({ ref, ...props }: FieldProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const FieldErrorText: ({ ref, ...props }: Field$1.ErrorTextProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const FieldLabel: React$1.ForwardRefExoticComponent<Field$1.LabelProps & React$1.RefAttributes<HTMLLabelElement>>;
 
@@ -1269,7 +1269,7 @@ type DatePickerProps = Omit<AriaDatePickerProps<DateValue>, "onChange"> & Pick<B
  * ```
  */
 declare const DatePicker: ({ ref: externalRef, variant, errorText, minHeight, showYearNavigation, withPortal, width, invalid, helperText, positioning, css, ...props }: DatePickerProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type DateRangePickerProps = Omit<AriaDateRangePickerProps<DateValue>, "onChange" | "errorMessage" | "isInvalid" | "isRequired"> & Pick<BoxProps, "minHeight"> & PropsWithChildren<DatePickerVariantProps> & CalendarVariants & {
@@ -1359,10 +1359,10 @@ interface DialogContentProps extends Dialog.ContentProps {
     children?: React$1.ReactNode;
 }
 declare const DialogContent: ({ ref, ...props }: DialogContentProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const DialogCloseTrigger: ({ ref, ...props }: Dialog.CloseTriggerProps & {
-    ref?: React$1.RefObject<HTMLButtonElement>;
+    ref?: React$1.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const DialogRoot: React$1.FC<Dialog.RootProps>;
 declare const DialogFooter: React$1.ForwardRefExoticComponent<Dialog.FooterProps & React$1.RefAttributes<HTMLDivElement>>;
@@ -1513,17 +1513,17 @@ type DrawerCloseTriggerProps = Drawer$1.CloseTriggerProps & {
 };
 
 declare const DrawerContent: ({ ref, ...props }: DrawerContentProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const CloseDrawerLine: ({ ref, ...props }: React.ComponentProps<typeof Box>) => react_jsx_runtime.JSX.Element;
 declare const DrawerCloseTrigger: ({ ref, ...props }: DrawerCloseTriggerProps & {
-    ref?: React.RefObject<HTMLButtonElement>;
+    ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const DrawerBackTrigger: ({ ref, ...props }: Drawer$1.CloseTriggerProps & {
-    ref?: React.RefObject<HTMLButtonElement>;
+    ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const DrawerFullScreenHeader: ({ ref, ...props }: DrawerFullScreenHeaderProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const Drawer: (props: DrawerProps) => react_jsx_runtime.JSX.Element;
 declare const DrawerTrigger: React$1.ForwardRefExoticComponent<Drawer$1.TriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
@@ -1686,7 +1686,7 @@ type AttachedInputsProps = RecipeVariantProps<typeof attachedInputsRecipe> & Gro
     flipAriaLabel: string;
 });
 declare const AttachedInputs: ({ ref, ...props }: AttachedInputsProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type Props = {
@@ -1697,7 +1697,7 @@ type Props = {
     loading?: boolean;
     emptyLabel?: React__default.ReactNode;
     openOnFocus?: boolean;
-    ref?: React__default.RefObject<HTMLInputElement | null>;
+    ref?: React__default.Ref<HTMLInputElement | null>;
 } & Omit<ComboboxRootProps, "collection"> & FieldProps;
 declare function Autocomplete({ variant, children, css, label, leftIcon, onInputValueChange, invalid, helperText, errorText, required, filteredExternally, loading, disabled, emptyLabel, onFocus, openOnClick, openOnFocus, ref, ...rest }: Props): react_jsx_runtime.JSX.Element;
 declare const AutocompleteItemGroup: React__default.ForwardRefExoticComponent<Combobox$1.ItemGroupProps & React__default.RefAttributes<HTMLDivElement>>;
@@ -1706,7 +1706,7 @@ declare const AutocompleteItem: ({ children, ...props }: ComboboxItemProps) => r
 
 declare const CardSelect: ({ size, ...props }: PopoverRootProps) => react_jsx_runtime.JSX.Element;
 declare const CardSelectContent: ({ ref, children, ...props }: StaticCardProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 type CardSelectTriggerProps = {
     /** The design of the trigger button.
@@ -1722,7 +1722,7 @@ type CardSelectTriggerProps = {
     withChevron?: boolean;
 } & Omit<ButtonProps, "variant" | "rightIcon" | "leftIcon">;
 declare const CardSelectTrigger: ({ ref, icon, variant, withChevron, size, children, ...props }: CardSelectTriggerProps & {
-    ref?: React.RefObject<HTMLButtonElement>;
+    ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const checkboxSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "indicator" | "content" | "description" | "label" | "control" | "addon", _chakra_ui_react.SlotRecipeVariantRecord<"root" | "indicator" | "content" | "description" | "label" | "control" | "addon">>;
@@ -1746,7 +1746,7 @@ type CheckboxProps = Omit<Checkbox$1.RootProps, "onChange"> & PropsWithChildren<
  * You can group several of these together with a `CheckboxGroup`.
  */
 declare const Checkbox: ({ ref, ...props }: CheckboxProps & {
-    ref?: React$1.RefObject<HTMLInputElement>;
+    ref?: React$1.Ref<HTMLInputElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type CheckboxGroupProps = React__default.ComponentProps<typeof CheckboxGroup$1> & {
@@ -1816,7 +1816,7 @@ type ChoiceChipProps = Omit<CheckboxCardRootProps, "onCheckedChange" | "checked"
  * ```
  */
 declare const ChoiceChip: ({ ref, children, icon, onCheckedChange, ...rootProps }: ChoiceChipProps & {
-    ref?: React__default.RefObject<HTMLInputElement>;
+    ref?: React__default.Ref<HTMLInputElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type ComboboxProps<T> = Exclude<InputProps, "variant" | "colorPalette" | "size"> & AriaComboBoxProps<T> & {
@@ -1906,7 +1906,7 @@ type InputProps = FieldProps & Exclude<ChakraInputProps, "size" | "label" | "col
  * @see https://spor.vy.no/components/input
  */
 declare const Input: ({ ref, startElement, endElement, label, invalid, helperText, errorText, required, hidden, fontSize, labelAsChild, ...props }: InputProps & {
-    ref?: React__default.RefObject<HTMLInputElement | null>;
+    ref?: React__default.Ref<HTMLInputElement | null>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const listBoxSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "item" | "description" | "label", {
@@ -2124,7 +2124,7 @@ type NativeSelectdProps = React$1.PropsWithChildren<NativeSelectVariantProps> &
  *
  */
 declare const NativeSelect: ({ ref, ...props }: NativeSelectdProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const numericStepperRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "container" | "input" | "text" | "button", {
@@ -2189,7 +2189,7 @@ type NumericStepperProps = FieldBaseProps & NumericStepperVariants & {
  * @see https://spor.vy.no/components/numeric-stepper
  */
 declare const NumericStepper: ({ ref, ...props }: NumericStepperProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 interface PasswordVisibilityProps {
@@ -2225,7 +2225,7 @@ interface PasswordInputProps extends InputProps, PasswordVisibilityProps {
  * @see https://spor.vy.no/components/password-input
  */
 declare const PasswordInput: ({ ref, ...props }: PasswordInputProps & {
-    ref?: React__default.RefObject<HTMLInputElement>;
+    ref?: React__default.Ref<HTMLInputElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type CountryCodeAndPhoneNumber = {
@@ -2263,7 +2263,7 @@ type PhoneNumberInputProps = Omit<InputProps, "value"> & {
  * ```
  */
 declare const PhoneNumberInput: ({ ref, ...props }: PhoneNumberInputProps & {
-    ref?: React.RefObject<HTMLInputElement>;
+    ref?: React.Ref<HTMLInputElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const radioGroupSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "item" | "label" | "itemText" | "itemControl", {
@@ -2296,11 +2296,11 @@ type RadioProps = PropsWithChildren<RadioVariants> & RadioGroup$1.ItemProps & {
  * </RadioGroup>
  */
 declare const Radio: ({ ref, ...props }: RadioProps & {
-    ref?: React__default.RefObject<HTMLInputElement>;
+    ref?: React__default.Ref<HTMLInputElement>;
 }) => react_jsx_runtime.JSX.Element;
 type RadioGroupProps = Omit<RadioGroup$1.RootProps, "colorPalette" | "variant" | "size"> & {};
 declare const RadioGroup: ({ ref, ...props }: RadioGroupProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type SearchInputProps = InputProps & {
@@ -2312,7 +2312,7 @@ type SearchInputProps = InputProps & {
  * Includes a search icon, a localized label and a reset button.
  */
 declare const SearchInput: ({ ref, ...props }: SearchInputProps & {
-    ref?: React.RefObject<HTMLInputElement>;
+    ref?: React.Ref<HTMLInputElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type SelectProps = SelectRootProps & FieldProps & {
@@ -2347,7 +2347,7 @@ type SelectProps = SelectRootProps & FieldProps & {
  *
  */
 declare const Select: ({ ref, ...props }: SelectProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const SelectLabel: (props: SelectLabelProps) => react_jsx_runtime.JSX.Element;
 type SelectItemProps = Select$1.ItemProps & {
@@ -2355,21 +2355,21 @@ type SelectItemProps = Select$1.ItemProps & {
     description?: React$1.ReactNode;
 };
 declare const SelectItem: ({ ref, ...props }: SelectItemProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 type SelectItemGroupProps = Select$1.ItemGroupProps & {
     label: React$1.ReactNode;
     children: React$1.ReactNode;
 };
 declare const SelectItemGroup: ({ ref, ...props }: SelectItemGroupProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 type SelectTriggerProps = Select$1.ControlProps & {
     clearable?: boolean;
     children?: React$1.ReactNode;
 };
 declare const SelectTrigger: ({ ref, ...props }: SelectTriggerProps & {
-    ref?: React$1.RefObject<HTMLButtonElement>;
+    ref?: React$1.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 type SelectContentProps = Select$1.ContentProps & {
     portalled?: boolean;
@@ -2377,7 +2377,7 @@ type SelectContentProps = Select$1.ContentProps & {
     baseStyle?: SystemStyleObject;
 };
 declare const SelectContent: ({ ref, ...props }: SelectContentProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 type SelectValueTextProps = Omit<Select$1.ValueTextProps, "children"> & {
     children?(items: CollectionItem[]): React$1.ReactNode;
@@ -2385,7 +2385,7 @@ type SelectValueTextProps = Omit<Select$1.ValueTextProps, "children"> & {
     withPlaceholder?: boolean;
 };
 declare const SelectValueText: ({ ref, ...props }: SelectValueTextProps & {
-    ref?: React$1.RefObject<HTMLSpanElement>;
+    ref?: React$1.Ref<HTMLSpanElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const SelectItemText: React$1.ForwardRefExoticComponent<Select$1.ItemTextProps & React$1.RefAttributes<HTMLDivElement>>;
 declare const SelectRoot: Select$1.RootComponent;
@@ -2456,7 +2456,7 @@ type SwitchProps = Exclude<Switch$1.RootProps, "size" | "colorPalette"> & FieldB
  * ```
  */
 declare const Switch: ({ ref, ...props }: SwitchProps & {
-    ref?: React__default.RefObject<HTMLInputElement>;
+    ref?: React__default.Ref<HTMLInputElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const textareaRecipe: _chakra_ui_react.RecipeDefinition<{
@@ -2506,7 +2506,7 @@ type TextareaProps = Exclude<TextareaProps$1, "size" | "colorPalette"> & FieldPr
     label: ReactNode;
 };
 declare const Textarea: ({ ref, ...props }: TextareaProps & {
-    ref?: React__default.RefObject<HTMLTextAreaElement>;
+    ref?: React__default.Ref<HTMLTextAreaElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const infoTagSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"icon" | "title" | "description" | "iconContainer" | "container" | "textContainer" | "walk", {
@@ -2760,7 +2760,7 @@ type LineIconProps = Exclude<BoxProps, "variant"> & VariantProps & PropsWithChil
  * @see https://spor.vy.no/components/line-tags
  */
 declare const LineIcon: ({ ref, variant, size, foregroundColor, disabled, style, target, label, ...rest }: LineIconProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const travelTagSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"icon" | "title" | "description" | "iconContainer" | "container" | "textContainer" | "deviationIcon", {
@@ -2912,7 +2912,7 @@ type TravelTagProps = TagProps & BoxProps & PropsWithChildren<TravelTagVariantPr
     customIconVariant?: string;
 };
 declare const TravelTag: ({ ref, variant, size, deviationLevel, title, description, disabled, foregroundColor, backgroundColor, customIconVariant, ...rest }: TravelTagProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type LinkProps = LinkProps$1 & {
@@ -2922,7 +2922,7 @@ type LinkProps = LinkProps$1 & {
     external?: boolean;
 };
 declare const TextLink: ({ ref, children, external, href, ...props }: LinkProps & {
-    ref?: React__default.RefObject<HTMLAnchorElement>;
+    ref?: React__default.Ref<HTMLAnchorElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 /**
@@ -3094,7 +3094,7 @@ type ProgressBarProps = BoxProps & UseProgressProps & PropsWithChildren<Progress
  * ```
  */
 declare const ProgressBar: ({ ref, value, label, labelRotationDelay, isActive, showValueText, height, css, ...rest }: ProgressBarProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const progressLoaderRecipe: _chakra_ui_react.RecipeDefinition<_chakra_ui_react.RecipeVariantRecord>;
@@ -3152,7 +3152,7 @@ type ProgressLoaderProps = BoxProps & {
  * ```
  */
 declare const ProgressLoader: ({ ref, value, label, labelRotationDelay, "aria-label": ariaLabel, width, ...rest }: ProgressLoaderProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const skeletonRecipe: _chakra_ui_react.RecipeDefinition<{
@@ -3211,7 +3211,7 @@ type SkeletonCircleProps = SkeletonProps$1 & SkeletonVariantProps & {
     size?: CircleProps["size"];
 };
 declare const SkeletonCircle: ({ ref, ...props }: SkeletonCircleProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 type SkeletonTextProps = SkeletonProps$1 & SkeletonVariantProps & {
     noOfLines?: number;
@@ -3233,7 +3233,7 @@ type CargonetLogoProps = {
     colorPalette: "light" | "dark";
 };
 declare const CargonetLogo: ({ ref, ...props }: CargonetLogoProps & {
-    ref?: React.RefObject<SVGSVGElement>;
+    ref?: React.Ref<SVGSVGElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const SvgBox: _chakra_ui_react.ChakraComponent<"svg", {}>;
@@ -3243,12 +3243,12 @@ type VyLogoProps = VyLogoBaseProps & {
     variant?: "default" | "mono";
 };
 declare const VyLogo: ({ ref, variant, ...props }: VyLogoProps & {
-    ref?: React.RefObject<SVGSVGElement>;
+    ref?: React.Ref<SVGSVGElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type VyLogoPrideProps = ComponentProps<typeof SvgBox>;
 declare const VyLogoPride: ({ ref, ...props }: VyLogoPrideProps & {
-    ref?: React.RefObject<SVGSVGElement>;
+    ref?: React.Ref<SVGSVGElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const mediaControllerSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"icon" | "root", {
@@ -3326,7 +3326,7 @@ type JumpButtonProps = BoxProps & PropsWithChildren<MediaControllerVariantProps>
  * ```
  */
 declare const JumpButton: ({ ref, ...props }: JumpButtonProps & {
-    ref?: React.RefObject<HTMLButtonElement>;
+    ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type PlayPauseButtonProps = BoxProps & PropsWithChildren<MediaControllerVariantProps> & {
@@ -3348,7 +3348,7 @@ type PlayPauseButtonProps = BoxProps & PropsWithChildren<MediaControllerVariantP
  * ```
  */
 declare const PlayPauseButton: ({ ref, ...props }: PlayPauseButtonProps & {
-    ref?: React.RefObject<HTMLButtonElement>;
+    ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type SkipButtonProps = BoxProps & PropsWithChildren<MediaControllerVariantProps> & {
@@ -3370,7 +3370,7 @@ type SkipButtonProps = BoxProps & PropsWithChildren<MediaControllerVariantProps>
  * ```
  */
 declare const SkipButton: ({ ref, ...props }: SkipButtonProps & {
-    ref?: React.RefObject<HTMLButtonElement>;
+    ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type NudgeProps = {
@@ -3378,15 +3378,15 @@ type NudgeProps = {
 } & PopoverRootProps;
 declare const Nudge: (props: NudgeProps) => react_jsx_runtime.JSX.Element | null;
 declare const NudgeTrigger: ({ ref, ...props }: Popover$1.TriggerProps & {
-    ref?: React__default.RefObject<HTMLButtonElement>;
+    ref?: React__default.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const NudgeContent: ({ ref, showCloseButton, children, ...props }: PopoverProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const NudgeActions: ({ ...props }: BoxProps) => react_jsx_runtime.JSX.Element;
 declare const NudgeWizardStep: ({ children }: PropsWithChildren) => react_jsx_runtime.JSX.Element;
 declare const NudgeCloseTrigger: ({ ref, children, ...props }: Popover$1.TriggerProps & {
-    ref?: React__default.RefObject<HTMLButtonElement>;
+    ref?: React__default.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const paginationSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"item" | "list", _chakra_ui_react.SlotRecipeVariantRecord<"item" | "list">>;
@@ -3398,31 +3398,31 @@ type ButtonVariantContext = {
 type PaginationRootProps = Omit<Pagination$1.RootProps, "type"> & React.PropsWithChildren<PaginationVariantProps> & ButtonVariantContext & {};
 
 declare const Pagination: ({ ref, ...props }: PaginationRootProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const PaginationEllipsis: ({ ref, ...props }: Pagination$1.EllipsisProps & {
-    ref?: React$1.RefObject<HTMLDivElement>;
+    ref?: React$1.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const PaginationItem: ({ ref, ...props }: Pagination$1.ItemProps & {
-    ref?: React$1.RefObject<HTMLButtonElement>;
+    ref?: React$1.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const PaginationPrevTrigger: ({ ref, ...props }: Pagination$1.PrevTriggerProps & {
-    ref?: React$1.RefObject<HTMLButtonElement>;
+    ref?: React$1.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element | null;
 declare const PaginationNextTrigger: ({ ref, ...props }: Pagination$1.NextTriggerProps & {
-    ref?: React$1.RefObject<HTMLButtonElement>;
+    ref?: React$1.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element | null;
 declare const PaginationItems: (props: React$1.HTMLAttributes<HTMLElement> & {}) => react_jsx_runtime.JSX.Element;
 
 declare const Popover: React__default.FC<Popover$1.RootProps>;
 declare const PopoverTrigger: ({ ref, children, ...props }: Popover$1.TriggerProps & {
-    ref?: React__default.RefObject<HTMLButtonElement>;
+    ref?: React__default.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 type PopoverProps = Popover$1.ContentProps & React__default.RefAttributes<HTMLDivElement> & {
     showCloseButton?: boolean;
 };
 declare const PopoverContent: ({ ref, children, showCloseButton, ...props }: PopoverProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const progressIndicatorRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "container" | "circle" | "progressDot", _chakra_ui_react.SlotRecipeVariantRecord<"root" | "container" | "circle" | "progressDot">>;
@@ -3449,7 +3449,7 @@ type ProgressIndicatorProps = BoxProps & PropsWithChildren<ProgressIndicatorVari
  * ```
  */
 declare const ProgressIndicator: ({ ref, numberOfSteps, activeStep, css, }: ProgressIndicatorProps & {
-    ref?: React__default.RefObject<HTMLDivElement>;
+    ref?: React__default.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type SporProviderProps = Omit<ChakraProviderProps, "value"> & {
@@ -3587,7 +3587,7 @@ type StepperProps = PropsWithChildren<StepperVariantProps> & {
  * ```
  **/
 declare const Stepper: ({ ref, ...props }: StepperProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type StepperStepProps = PropsWithChildren<StepperVariantProps> & {
@@ -3785,7 +3785,7 @@ type TabsProps = Exclude<TabsRootProps, "colorPalette" | "orientation"> & PropsW
     justify?: "start" | "center" | "end";
 };
 declare const Tabs: ({ ref, ...props }: TabsProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 declare const TabsList: React$1.ForwardRefExoticComponent<Tabs$1.ListProps & React$1.RefAttributes<HTMLDivElement>>;
 declare const TabsTrigger: React$1.ForwardRefExoticComponent<Tabs$1.TriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
@@ -4010,23 +4010,23 @@ type ToastProps = {
     text: string;
     variant: Variant;
     id?: string;
-};
-declare const createToast: ({ text, variant, id, duration, }: ToastProps) => string;
+} & Pick<BoxProps, "width">;
+declare const createToast: ({ text, variant, id, duration, width, }: ToastProps) => string;
 
 declare const Tooltip: React$1.FC<Tooltip$1.RootProps>;
 declare const TooltipTrigger: ({ ref, children, ...props }: Tooltip$1.TriggerProps & {
-    ref?: React.RefObject<HTMLButtonElement>;
+    ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
 type TooltipProps = Tooltip$1.ContentProps;
 declare const TooltipContent: ({ ref, children, ...props }: TooltipProps & {
-    ref?: React.RefObject<HTMLDivElement>;
+    ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type BadgeProps = BadgeProps$1 & {
     icon?: IconComponent;
 };
 declare const Badge: ({ ref, icon, children, ...props }: BadgeProps & {
-    ref?: React.RefObject<HTMLSpanElement>;
+    ref?: React.Ref<HTMLSpanElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 declare const codeRecipie: _chakra_ui_react.RecipeDefinition<{
@@ -4035,7 +4035,7 @@ declare const codeRecipie: _chakra_ui_react.RecipeDefinition<{
 
 type CodeVariantProps = RecipeVariantProps<typeof codeRecipie> & CodeProps;
 declare const Code: ({ ref, ...props }: CodeVariantProps & {
-    ref?: React__default.RefObject<HTMLElement>;
+    ref?: React__default.Ref<HTMLElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type HeadingProps = Omit<HeadingProps$1, "textStyle" | "as"> & {
@@ -4070,7 +4070,7 @@ type HeadingProps = Omit<HeadingProps$1, "textStyle" | "as"> & {
  * ```
  */
 declare const Heading: ({ ref, ...props }: HeadingProps & {
-    ref?: React.RefObject<HTMLHeadingElement>;
+    ref?: React.Ref<HTMLHeadingElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 type TextProps = Omit<TextProps$1, "textStyle"> & {
@@ -4088,7 +4088,7 @@ type TextProps = Omit<TextProps$1, "textStyle"> & {
  * ```
  */
 declare const Text: ({ ref, ...props }: TextProps & {
-    ref?: React.RefObject<HTMLParagraphElement>;
+    ref?: React.Ref<HTMLParagraphElement>;
 }) => react_jsx_runtime.JSX.Element;
 
 /**