@simplybusiness/mobius 9.1.0 → 9.1.1

package/dist/esm/index.js

@@ -1,4266 +1,78 @@
+"use client";
 import {
+  Accordion,
+  AccordionList,
+  AddressLookup,
+  Alert,
+  Box,
+  BreadcrumbItem,
+  Breadcrumbs,
+  Button,
+  Checkbox,
+  CheckboxGroup,
+  Combobox,
+  Container,
+  DEFAULT_BREAKPOINTS,
+  DateField,
+  Divider,
+  Drawer,
+  DropdownMenu,
   ErrorMessage,
+  ExpandableText,
+  Fieldset,
+  Flex,
+  Grid,
   Icon,
+  Image,
   Label,
+  Link,
+  LinkButton,
+  List,
+  ListItem,
+  LoadingIndicator,
+  Logo,
+  LoqateAddressLookupService,
+  MIN_MAX_ERROR,
+  MaskedField,
+  Modal,
+  NumberField,
+  Option,
+  PasswordField,
+  Popover,
+  Progress,
+  Radio,
+  RadioGroup,
+  SVG,
+  Segment,
+  SegmentGroup,
+  Select,
+  Slider,
   Stack,
+  Switch,
+  Table,
   Text,
+  TextArea,
+  TextAreaInput,
   TextField,
   TextOrHTML,
-  __privateAdd,
-  __privateGet,
-  __privateSet,
-  spaceDelimitedList,
+  Title,
+  Toaster,
+  Trust,
+  VisuallyHidden,
+  buildOptionTestId,
+  convertToDateFormat,
+  isValidDate,
+  toast,
+  useBreakpoint,
+  useButton,
+  useDialog,
+  useDialogPolyfill,
+  useDrawer,
   useLabel,
+  useModal,
   useTextField,
   useValidationClasses
-} from "./chunk-XUNHMVIS.js";
-
-// src/components/Accordion/Accordion.tsx
-import classNames3 from "classnames/dedupe";
-import { useEffect, useState, useId } from "react";
-import { usePrefersReducedMotion } from "@simplybusiness/mobius-hooks";
-
-// src/components/Accordion/AccordionLink.tsx
-import classNames2 from "classnames/dedupe";
-
-// src/components/Flex/Flex.tsx
-import classNames from "classnames/dedupe";
-
-// src/utils/filterUndefinedProps.ts
-var filterUndefinedProps = (props) => {
-  const filteredProps = {};
-  Object.keys(props).forEach((key) => {
-    if (props[key] !== void 0) {
-      filteredProps[key] = props[key];
-    }
-  });
-  return filteredProps;
-};
-
-// src/utils/getSpacingValue.ts
-var getSpacingValue = (padding) => {
-  if (typeof padding === "string") {
-    return `var(--size-${padding})`;
-  }
-  if (typeof padding === "number") {
-    return `${padding}px`;
-  }
-  return void 0;
-};
-
-// src/utils/mergeRefs.ts
-function mergeRefs(refs) {
-  return (value) => {
-    refs.forEach((ref) => {
-      if (typeof ref === "function") {
-        ref(value);
-      } else if (ref != null) {
-        ref.current = value;
-      }
-    });
-  };
-}
-
-// src/utils/polyfill-tests.ts
-var supportsDialog = () => typeof HTMLDialogElement === "function";
-
-// src/utils/sizeClasses.ts
-var sizeClasses = (size) => {
-  if (!size) {
-    return {};
-  }
-  return {
-    "--is-xxs": size === "xxs",
-    "--is-xs": size === "xs",
-    "--is-sm": size === "sm",
-    "--is-md": size === "md",
-    "--is-lg": size === "lg",
-    "--is-xl": size === "xl",
-    "--is-xxl": size === "xxl"
-  };
-};
-
-// src/components/Flex/propUtils.ts
-var buildFlexStyles = (props) => {
-  const {
-    flexDirection,
-    flexWrap,
-    flexGrow,
-    flex,
-    justifyContent,
-    alignItems,
-    alignContent,
-    gap,
-    rowGap,
-    columnGap
-  } = props;
-  const styleProps = {
-    flexDirection,
-    flexWrap,
-    flexGrow,
-    flex,
-    justifyContent,
-    alignItems,
-    alignContent,
-    gap: getSpacingValue(gap),
-    columnGap: getSpacingValue(columnGap),
-    rowGap: getSpacingValue(rowGap)
-  };
-  return filterUndefinedProps(styleProps);
-};
-var splitProps = (props) => {
-  const {
-    flexDirection,
-    flexWrap,
-    flexGrow,
-    flex,
-    justifyContent,
-    alignItems,
-    alignContent,
-    gap,
-    rowGap,
-    columnGap,
-    ...otherProps
-  } = props;
-  return [
-    {
-      flexDirection,
-      flexWrap,
-      flexGrow,
-      flex,
-      justifyContent,
-      alignItems,
-      alignContent,
-      gap,
-      rowGap,
-      columnGap
-    },
-    otherProps
-  ];
-};
-
-// src/components/Flex/Flex.tsx
-import { jsx } from "react/jsx-runtime";
-var Flex = ({ ref, ...props }) => {
-  const {
-    elementType: Element = "div",
-    style,
-    className,
-    ...otherProps
-  } = props;
-  const classes = classNames("mobius", "mobius-flex", className);
-  const [styleProps, restProps] = splitProps(otherProps);
-  const flexStyles = buildFlexStyles(styleProps);
-  return /* @__PURE__ */ jsx(
-    Element,
-    {
-      ref,
-      style: {
-        ...flexStyles,
-        ...style
-      },
-      className: classes,
-      ...restProps
-    }
-  );
-};
-Flex.displayName = "Flex";
-
-// src/components/Accordion/AccordionLink.tsx
-import { chevronDown } from "@simplybusiness/icons";
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-var AccordionLink = ({
-  text,
-  elementType: LinkElement = "span",
-  toggle,
-  onClick,
-  headerChildren,
-  ariaExpanded,
-  accordionId,
-  contentId
-}) => {
-  const linkClasses = classNames2("mobius-accordion__link", {
-    "--is-open": ariaExpanded
-  });
-  const iconClasses = classNames2("mobius-accordion__link-icon", {
-    "--is-open": ariaExpanded
-  });
-  const handleOnClick = (e) => {
-    if (onClick) {
-      onClick(e);
-    }
-    toggle();
-  };
-  const handleKeyDown = (e) => {
-    if (e.key === " " || e.key === "Enter") {
-      toggle();
-    }
-  };
-  if (headerChildren) {
-    return /* @__PURE__ */ jsxs(
-      Flex,
-      {
-        justifyContent: "space-between",
-        alignItems: "center",
-        className: "mobius-accordion__header",
-        children: [
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              id: accordionId,
-              className: linkClasses,
-              onClick: handleOnClick,
-              onKeyDown: handleKeyDown,
-              role: "button",
-              tabIndex: 0,
-              "aria-expanded": !!ariaExpanded,
-              "aria-controls": contentId,
-              children: [
-                /* @__PURE__ */ jsx2(LinkElement, { className: "mobius-accordion__link-text", children: text }),
-                /* @__PURE__ */ jsx2(Icon, { icon: chevronDown, className: iconClasses })
-              ]
-            }
-          ),
-          headerChildren
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      id: accordionId,
-      className: linkClasses,
-      onClick: handleOnClick,
-      onKeyDown: handleKeyDown,
-      role: "button",
-      tabIndex: 0,
-      "aria-expanded": !!ariaExpanded,
-      "aria-controls": contentId,
-      children: [
-        /* @__PURE__ */ jsx2(LinkElement, { className: "mobius-accordion__link-text", children: text }),
-        /* @__PURE__ */ jsx2(Icon, { icon: chevronDown, className: iconClasses })
-      ]
-    }
-  );
-};
-
-// src/components/Accordion/Accordion.tsx
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var Accordion = ({ ref, ...props }) => {
-  const {
-    showText = "See more",
-    hideText = "See less",
-    headerPosition = "top",
-    startOpen = false,
-    linkElementType,
-    onClick,
-    onOpen,
-    onClose,
-    onChange = () => {
-    },
-    headerChildren,
-    ...rest
-  } = props;
-  const [accordionState, setAccordionState] = useState({
-    open: startOpen,
-    withAnimation: false
-  });
-  const prefersReducedMotion = usePrefersReducedMotion();
-  const containerClasses = classNames3(
-    "mobius",
-    "mobius-accordion",
-    props.className,
-    {
-      "--should-animate": accordionState.withAnimation && !prefersReducedMotion,
-      "--is-open": accordionState.open
-    }
-  );
-  const contentContainerClasses = classNames3(
-    "mobius-accordion__content-container",
-    {
-      "--is-open": accordionState.open
-    }
-  );
-  const contentClasses = classNames3("mobius-accordion__content", {
-    "--is-open": accordionState.open
-  });
-  const linkText = accordionState.open ? hideText : showText;
-  const handleChange = () => {
-    if (!accordionState.open && onOpen) {
-      onOpen();
-    }
-    if (accordionState.open && onClose) {
-      onClose();
-    }
-    if (onChange) {
-      onChange(!accordionState.open);
-    }
-    setAccordionState({
-      open: !accordionState.open,
-      withAnimation: true
-    });
-  };
-  useEffect(() => {
-    setAccordionState({
-      open: startOpen,
-      withAnimation: true
-    });
-  }, [startOpen]);
-  const baseId = useId();
-  const accordionId = `accordion-header-${baseId}`;
-  const contentId = `accordion-panel-${baseId}`;
-  return /* @__PURE__ */ jsxs2("div", { ref, ...rest, className: containerClasses, children: [
-    headerPosition === "top" && /* @__PURE__ */ jsx3(
-      AccordionLink,
-      {
-        text: linkText,
-        elementType: linkElementType,
-        toggle: handleChange,
-        onClick,
-        ariaExpanded: accordionState.open,
-        headerChildren,
-        accordionId,
-        contentId
-      }
-    ),
-    /* @__PURE__ */ jsx3(
-      "div",
-      {
-        id: contentId,
-        className: contentContainerClasses,
-        "aria-hidden": !accordionState.open,
-        "aria-labelledby": accordionId,
-        role: "region",
-        children: /* @__PURE__ */ jsx3("div", { className: contentClasses, children: props.children })
-      }
-    ),
-    headerPosition === "bottom" && /* @__PURE__ */ jsx3(
-      AccordionLink,
-      {
-        text: linkText,
-        toggle: handleChange,
-        onClick,
-        ariaExpanded: accordionState.open,
-        headerChildren,
-        accordionId,
-        contentId
-      }
-    )
-  ] });
-};
-Accordion.displayName = "Accordion";
-
-// src/components/Accordion/AccordionList.tsx
-import { useState as useState2, Fragment } from "react";
-import classNames5 from "classnames/dedupe";
-
-// src/components/Divider/Divider.tsx
-import classNames4 from "classnames/dedupe";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var Divider = ({
-  "aria-orientation": ariaOrientation = "horizontal",
-  className,
-  ...rest
-}) => {
-  const classes = classNames4("mobius", "mobius-divider", className);
-  return /* @__PURE__ */ jsx4(
-    "div",
-    {
-      className: classes,
-      role: "separator",
-      "aria-orientation": ariaOrientation,
-      ...rest,
-      children: /* @__PURE__ */ jsx4("div", { className: "mobius-divider__inner" })
-    }
-  );
-};
-Divider.displayName = "Divider";
-
-// src/components/Accordion/AccordionList.tsx
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-var AccordionList = (props) => {
-  const {
-    className,
-    content,
-    onOpen,
-    onClose,
-    allowMultiple = false,
-    ...rest
-  } = props;
-  const [openIds, setOpenIds] = useState2(/* @__PURE__ */ new Set());
-  const classes = classNames5("mobius", "mobius-accordion-list", className);
-  const handleAccordionChange = (id, isOpen) => {
-    setOpenIds((prev) => {
-      const newSet = new Set(prev);
-      if (isOpen) {
-        if (!allowMultiple) {
-          newSet.clear();
-        }
-        newSet.add(id);
-      } else {
-        newSet.delete(id);
-      }
-      return newSet;
-    });
-    if (isOpen) {
-      onOpen?.(id);
-    } else {
-      onClose?.(id);
-    }
-  };
-  return /* @__PURE__ */ jsx5("div", { className: classes, ...rest, children: content.map((item, index) => {
-    const { id, header, details } = item;
-    const isOpen = openIds.has(id);
-    return /* @__PURE__ */ jsxs3(Fragment, { children: [
-      /* @__PURE__ */ jsx5(
-        Accordion,
-        {
-          startOpen: isOpen,
-          showText: header,
-          hideText: header,
-          onChange: (isOpen2) => handleAccordionChange(id, isOpen2),
-          children: details
-        }
-      ),
-      index < content.length - 1 && /* @__PURE__ */ jsx5(Divider, {})
-    ] }, id);
-  }) });
-};
-AccordionList.displayName = "AccordionList";
-
-// src/components/AddressLookup/AddressLookup.tsx
-import { search } from "@simplybusiness/icons";
-import { useCallback as useCallback4, useState as useState9 } from "react";
-
-// src/components/Combobox/Combobox.tsx
-import classNames8 from "classnames/dedupe";
-import { useEffect as useEffect6, useId as useId2, useRef as useRef3, useState as useState8 } from "react";
-import { useOnUnmount } from "@simplybusiness/mobius-hooks";
-
-// src/hooks/useBreakpoint/useBreakpoint.tsx
-import {
-  useDebouncedValue,
-  useIsClient,
-  useWindowEvent
-} from "@simplybusiness/mobius-hooks";
-import { useCallback, useMemo, useState as useState3 } from "react";
-var DEFAULT_BREAKPOINTS = [
-  { size: "xs", value: 320 },
-  { size: "sm", value: 480 },
-  { size: "md", value: 670 },
-  { size: "lg", value: 960 },
-  { size: "xl", value: 1200 },
-  { size: "xxl", value: 1320 }
-];
-var PASSIVE = { passive: true };
-var getBreakpoint = (breakpoints, windowWidth) => {
-  const closest = breakpoints.findIndex(
-    (breakpoint) => breakpoint.value >= windowWidth + 1
-  );
-  const smallest = breakpoints[0];
-  const largest = breakpoints[breakpoints.length - 1];
-  const match = breakpoints[closest - 1];
-  if (closest === 0) return smallest;
-  if (closest === -1) return largest;
-  return match;
-};
-var useBreakpoint = (customBreakpoints) => {
-  const isClientSide = useIsClient();
-  const breakpoints = customBreakpoints || DEFAULT_BREAKPOINTS;
-  const defaultBreakpoint = breakpoints[0];
-  const [windowWidth, setWindowWidth] = useState3(
-    typeof globalThis?.window !== "undefined" ? window.innerWidth : defaultBreakpoint.value
-  );
-  useWindowEvent("resize", () => setWindowWidth(window.innerWidth), PASSIVE);
-  const debouncedWidth = useDebouncedValue(windowWidth, 200);
-  const currentBreakpoint = useMemo(
-    () => !isClientSide || breakpoints.length === 0 ? defaultBreakpoint : getBreakpoint(breakpoints, debouncedWidth),
-    [isClientSide, breakpoints, defaultBreakpoint, debouncedWidth]
-  );
-  const up = useCallback(
-    (size) => {
-      const sizeIndex = breakpoints.findIndex((item) => item.size === size);
-      if (sizeIndex === -1) {
-        return false;
-      }
-      const currentIndex = breakpoints.findIndex(
-        (item) => item.size === currentBreakpoint.size
-      );
-      return currentIndex >= sizeIndex;
-    },
-    [currentBreakpoint, breakpoints]
-  );
-  const down = useCallback(
-    (size) => {
-      const sizeIndex = breakpoints.findIndex((item) => item.size === size);
-      if (sizeIndex === -1) {
-        return true;
-      }
-      const currentIndex = breakpoints.findIndex(
-        (item) => item.size === currentBreakpoint.size
-      );
-      return currentIndex <= sizeIndex;
-    },
-    [currentBreakpoint, breakpoints]
-  );
-  return {
-    breakpoint: currentBreakpoint,
-    up,
-    down
-  };
-};
-
-// src/hooks/useButton/useButton.tsx
-import { useCallback as useCallback2 } from "react";
-function useButton({
-  elementType = "button",
-  type = "button",
-  isDisabled = false,
-  href,
-  target,
-  rel,
-  role,
-  name,
-  value,
-  onClick,
-  onPress
-}) {
-  const realOnClick = useCallback2(
-    (event) => {
-      if (isDisabled) {
-        return;
-      }
-      onClick?.(event);
-      onPress?.(event);
-    },
-    [isDisabled, onClick, onPress]
-  );
-  function getRole() {
-    if (role) {
-      return role;
-    }
-    if (elementType === "a") {
-      return void 0;
-    }
-    return "button";
-  }
-  const extraProps = elementType === "button" ? { type } : {
-    role: getRole()
-  };
-  return {
-    buttonProps: {
-      href: elementType === "a" ? href : void 0,
-      target: elementType === "a" ? target : void 0,
-      rel: elementType === "a" ? rel : void 0,
-      tabIndex: isDisabled ? -1 : 0,
-      disabled: isDisabled || void 0,
-      "aria-disabled": isDisabled || void 0,
-      name: elementType === "input" || elementType === "button" ? name : void 0,
-      value: elementType === "input" || elementType === "button" ? value : void 0,
-      ...extraProps,
-      onClick: realOnClick
-    }
-  };
-}
-
-// src/hooks/useDialog/useDialog.ts
-import { useCallback as useCallback3, useEffect as useEffect3, useState as useState5 } from "react";
-import { useBodyScrollLock } from "@simplybusiness/mobius-hooks";
-
-// src/hooks/useDialogPolyfill/useDialogPolyfill.ts
-import { useEffect as useEffect2, useRef, useState as useState4 } from "react";
-var useDialogPolyfill = () => {
-  const [hasDialogSupport, setHasDialogSupport] = useState4(false);
-  const hasAlreadyLoaded = useRef(false);
-  useEffect2(() => {
-    setHasDialogSupport(supportsDialog());
-  }, []);
-  const polyfillDialog = async (ref) => {
-    if (!hasAlreadyLoaded.current && !hasDialogSupport && typeof window !== "undefined" && ref.current !== null) {
-      const { default: dialogPolyfill } = await import("dialog-polyfill");
-      hasAlreadyLoaded.current = true;
-      try {
-        if (ref.current) {
-          dialogPolyfill.registerDialog(ref.current);
-        }
-      } catch (error2) {
-        console.error("Failed to load dialog-polyfill", error2);
-      }
-    }
-  };
-  return {
-    polyfillDialog
-  };
-};
-
-// src/hooks/useDialog/useDialog.ts
-var TRANSITION_CLASS_NAME = "--transition";
-var FALLBACK_TRANSITION_DURATION = 0;
-var useDialog = (props) => {
-  const { ref, isOpen, transition, onOpen, onClose } = props;
-  const [hasDialogSupport, setHasDialogSupport] = useState5(false);
-  const shouldTransition = hasDialogSupport && transition.isEnabled;
-  const { polyfillDialog } = useDialogPolyfill();
-  useEffect3(() => {
-    setHasDialogSupport(supportsDialog());
-  }, []);
-  const TRANSITION_DURATION_IN_MS = ref.current && Number(
-    getComputedStyle(ref.current).getPropertyValue(transition.CSSVariable).replace("ms", "")
-  ) || FALLBACK_TRANSITION_DURATION;
-  useBodyScrollLock({ enabled: isOpen });
-  const open = useCallback3(() => {
-    ref.current?.showModal();
-    onOpen?.();
-  }, [onOpen, ref]);
-  const close = useCallback3(() => {
-    ref.current?.close();
-    onClose?.();
-  }, [onClose, ref]);
-  const handleClose = useCallback3(
-    (event) => {
-      if (event) {
-        event.preventDefault();
-        event.stopPropagation();
-      }
-      if (shouldTransition) {
-        ref.current?.classList.remove(TRANSITION_CLASS_NAME);
-        setTimeout(() => close(), TRANSITION_DURATION_IN_MS);
-      } else {
-        close();
-      }
-    },
-    [TRANSITION_DURATION_IN_MS, close, ref, shouldTransition]
-  );
-  useEffect3(() => {
-    async function toggleDialog() {
-      if (isOpen && !ref.current?.open) {
-        await polyfillDialog(ref);
-        open();
-        setTimeout(() => {
-          ref.current?.classList.add(TRANSITION_CLASS_NAME);
-        }, 0);
-      } else if (!isOpen && ref.current?.open) {
-        handleClose();
-      }
-    }
-    void toggleDialog();
-  }, [handleClose, isOpen, open, ref, polyfillDialog]);
-  return {
-    open,
-    close: handleClose
-  };
-};
-
-// src/components/VisuallyHidden/VisuallyHidden.tsx
-import { jsx as jsx6 } from "react/jsx-runtime";
-function VisuallyHidden(props) {
-  const {
-    className,
-    children,
-    elementType: Component = "div",
-    ...otherProps
-  } = props;
-  return /* @__PURE__ */ jsx6(
-    Component,
-    {
-      className,
-      style: {
-        border: 0,
-        clip: "rect(0 0 0 0)",
-        clipPath: "inset(50%)",
-        height: "1px",
-        margin: "-1px",
-        overflow: "hidden",
-        padding: 0,
-        position: "absolute",
-        width: "1px",
-        whiteSpace: "nowrap"
-      },
-      ...otherProps,
-      children
-    }
-  );
-}
-
-// src/components/Combobox/Listbox.tsx
-import classNames7 from "classnames/dedupe";
-
-// src/components/Combobox/Option.tsx
-import { useEffect as useEffect4, useRef as useRef2 } from "react";
-import classNames6 from "classnames/dedupe";
-
-// src/components/Combobox/utils.tsx
-function isOptionGroup(options) {
-  if (!options) return false;
-  return typeof options[0] === "object" && "options" in options[0] && options[0].options !== void 0 && "heading" in options[0] && options[0].heading !== void 0;
-}
-var getOptionValue = (option) => typeof option === "string" ? option : option?.value;
-var getOptionLabel = (option) => typeof option === "string" ? option : option?.label;
-function filterOptions(options, inputValue) {
-  if (isOptionGroup(options)) {
-    return options.map((optionGroup) => ({
-      ...optionGroup,
-      options: optionGroup.options.filter(
-        (option) => getOptionLabel(option).toLowerCase().includes(inputValue.toLowerCase())
-      )
-    })).filter((optionGroup) => optionGroup.options.length > 0);
-  }
-  return options.filter(
-    (option) => getOptionLabel(option).toLowerCase().includes(inputValue.toLowerCase())
-  );
-}
-var buildOptionTestId = (prefix, value) => `${prefix}-${value.trim().toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "")}`;
-
-// src/components/Combobox/Option.tsx
-import { jsx as jsx7 } from "react/jsx-runtime";
-var Option = ({
-  option,
-  isHighlighted,
-  onOptionSelect,
-  optionComponent: OptionComponent,
-  optionTestIdPrefix,
-  id
-}) => {
-  const optionRef = useRef2(null);
-  const optionValue = getOptionValue(option) || "";
-  const testId = buildOptionTestId(
-    optionTestIdPrefix || "combobox-option",
-    optionValue
-  );
-  useEffect4(() => {
-    if (isHighlighted && optionRef.current && optionRef.current.scrollIntoView) {
-      optionRef.current.scrollIntoView({ block: "nearest" });
-    }
-  }, [isHighlighted]);
-  return /* @__PURE__ */ jsx7(
-    "li",
-    {
-      ref: optionRef,
-      role: "option",
-      "data-testid": testId,
-      id,
-      "aria-selected": isHighlighted,
-      onMouseDown: () => onOptionSelect(option),
-      className: classNames6("mobius-combobox__option", "has-pii", {
-        "mobius-combobox__option--is-highlighted": isHighlighted
-      }),
-      children: OptionComponent ? /* @__PURE__ */ jsx7(OptionComponent, { option, isHighlighted }) : getOptionLabel(option)
-    },
-    getOptionValue(option)
-  );
-};
-
-// src/components/Combobox/Listbox.tsx
-import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
-var getOptionKey = (option, index, groupIndex) => {
-  let key;
-  if (typeof option === "object" && option.id) key = option.id;
-  else if (typeof option === "object") key = `${option.value}::${option.label}`;
-  else if (typeof option === "string") key = option;
-  else key = String(index);
-  return groupIndex !== void 0 ? `${groupIndex}:${key}` : key;
-};
-var Listbox = ({
-  id,
-  isOpen = false,
-  options,
-  highlightedIndex,
-  highlightedGroupIndex,
-  onOptionSelect,
-  optionComponent,
-  optionTestIdPrefix
-}) => {
-  const classes = classNames7("mobius-combobox__list", {
-    "mobius-combobox__list--hidden": !isOpen
-  });
-  function getOptionId(option, groupIndex, index) {
-    if (typeof option === "object" && "id" in option && typeof option.id === "string") {
-      return option.id;
-    }
-    return isOptionGroup(options) ? `${id}-option-${groupIndex}-${index}` : `${id}-option-${index}`;
-  }
-  if (!isOpen) {
-    return /* @__PURE__ */ jsx8("div", { role: "listbox", id, className: classes });
-  }
-  if (options && options.length === 0) {
-    return /* @__PURE__ */ jsx8("div", { role: "listbox", id, className: classes, children: /* @__PURE__ */ jsx8("div", { className: "mobius-combobox__no-options", children: "No options" }) });
-  }
-  return /* @__PURE__ */ jsx8("div", { role: "listbox", id, className: classes, children: isOptionGroup(options) ? options.map((option, groupIndex) => /* @__PURE__ */ jsxs4(
-    "ul",
-    {
-      role: "group",
-      "aria-labelledby": `${id}-group-${groupIndex}`,
-      className: "mobius-combobox__group",
-      children: [
-        /* @__PURE__ */ jsx8(
-          "li",
-          {
-            role: "presentation",
-            id: `${id}-group-${groupIndex}`,
-            className: "mobius-combobox__group-label",
-            children: option.heading
-          }
-        ),
-        option.options.map((groupOption, index) => /* @__PURE__ */ jsx8(
-          Option,
-          {
-            option: groupOption,
-            isHighlighted: highlightedIndex === index && highlightedGroupIndex === groupIndex,
-            onOptionSelect,
-            optionComponent,
-            optionTestIdPrefix,
-            id: getOptionId(groupOption, groupIndex, index)
-          },
-          getOptionKey(groupOption, index, groupIndex)
-        ))
-      ]
-    },
-    option.heading
-  )) : typeof options !== "undefined" ? options.map((option, index) => /* @__PURE__ */ jsx8(
-    Option,
-    {
-      option,
-      isHighlighted: highlightedIndex === index,
-      onOptionSelect,
-      optionComponent,
-      optionTestIdPrefix,
-      id: getOptionId(option, 0, index)
-    },
-    getOptionKey(option, index)
-  )) : null });
-};
-
-// src/components/Combobox/useComboboxHighlight.tsx
-import { useState as useState6 } from "react";
-function useComboboxHighlight(options) {
-  const [highlightedIndex, setHighlightedIndex] = useState6(
-    options && options.length ? 0 : -1
-  );
-  const [highlightedGroupIndex, setHighlightedGroupIndex] = useState6(0);
-  function highlightNextOption() {
-    const isGroup = isOptionGroup(options);
-    if (!options) {
-      return;
-    }
-    if (isGroup) {
-      const group = options[highlightedGroupIndex];
-      if (highlightedIndex === group.options.length - 1) {
-        if (highlightedGroupIndex === options.length - 1) {
-          return;
-        }
-        setHighlightedIndex(0);
-        setHighlightedGroupIndex(highlightedGroupIndex + 1);
-      } else {
-        setHighlightedIndex(highlightedIndex + 1);
-      }
-    } else {
-      if (highlightedIndex === options.length - 1) {
-        return;
-      }
-      setHighlightedIndex(highlightedIndex + 1);
-    }
-  }
-  function highlightPreviousOption() {
-    const isGroup = isOptionGroup(options);
-    if (highlightedIndex === 0 && highlightedGroupIndex === 0) {
-      return;
-    }
-    if (isGroup) {
-      if (highlightedIndex === 0) {
-        const prevGroupIndex = highlightedGroupIndex - 1;
-        const prevGroup = options[prevGroupIndex];
-        setHighlightedGroupIndex(prevGroupIndex);
-        setHighlightedIndex(prevGroup.options.length - 1);
-      } else {
-        setHighlightedIndex(highlightedIndex - 1);
-      }
-    } else {
-      setHighlightedIndex(highlightedIndex - 1);
-    }
-  }
-  function highlightFirstOption() {
-    setHighlightedIndex(0);
-    setHighlightedGroupIndex(0);
-  }
-  function highlightLastOption() {
-    const isGroup = isOptionGroup(options);
-    if (!options) {
-      return;
-    }
-    if (isGroup) {
-      const lastGroupIndex = options.length - 1;
-      const lastGroup = options[lastGroupIndex];
-      setHighlightedGroupIndex(lastGroupIndex);
-      setHighlightedIndex(lastGroup.options.length - 1);
-    } else {
-      setHighlightedIndex(options.length - 1);
-    }
-  }
-  const clearHighlight = () => {
-    setHighlightedIndex(
-      typeof options === "undefined" || options.length ? 0 : -1
-    );
-    setHighlightedGroupIndex(0);
-  };
-  return {
-    highlightedIndex,
-    highlightedGroupIndex,
-    highlightPreviousOption,
-    highlightNextOption,
-    highlightFirstOption,
-    highlightLastOption,
-    clearHighlight
-  };
-}
-
-// src/components/Combobox/useComboboxOptions.ts
-import { useEffect as useEffect5, useState as useState7 } from "react";
-import { useDebouncedValue as useDebouncedValue2 } from "@simplybusiness/mobius-hooks";
-function useComboboxOptions({
-  options,
-  asyncOptions,
-  delay = 300,
-  minSearchLength = 3,
-  inputValue = "",
-  skipNextDebounceRef,
-  onSearched
-}) {
-  const [filteredOptions, setFilteredOptions] = useState7(void 0);
-  const debouncedInputValue = useDebouncedValue2(
-    inputValue,
-    // Don't debounce synchronous options
-    options ? 0 : delay
-  );
-  const [isLoading, setIsLoading] = useState7(false);
-  const [error2, setError] = useState7(null);
-  useEffect5(() => {
-    const controller = new AbortController();
-    const { signal } = controller;
-    const fetchOptions = async () => {
-      setIsLoading(true);
-      setError(null);
-      try {
-        if (asyncOptions) {
-          if (debouncedInputValue.length < minSearchLength) {
-            setFilteredOptions(void 0);
-            return;
-          }
-          const result = await asyncOptions(debouncedInputValue, { signal });
-          setFilteredOptions(result);
-          onSearched?.(debouncedInputValue);
-        } else if (options) {
-          setFilteredOptions(filterOptions(options, debouncedInputValue));
-        } else {
-          setError(new Error("No options provided"));
-        }
-      } catch (e) {
-        if (e instanceof DOMException && e.name === "AbortError") {
-          return;
-        }
-        setError(e);
-      } finally {
-        setIsLoading(false);
-      }
-    };
-    if (!skipNextDebounceRef?.current) {
-      void fetchOptions();
-    } else {
-      skipNextDebounceRef.current = false;
-    }
-    return () => {
-      controller.abort();
-    };
-  }, [
-    debouncedInputValue,
-    options,
-    asyncOptions,
-    delay,
-    minSearchLength,
-    skipNextDebounceRef,
-    onSearched
-  ]);
-  function updateFilteredOptions(newOptions) {
-    setIsLoading(true);
-    return newOptions.then(setFilteredOptions).catch(setError).finally(() => setIsLoading(false));
-  }
-  return {
-    filteredOptions,
-    updateFilteredOptions,
-    isLoading,
-    error: error2,
-    isError: error2 != null
-  };
-}
-
-// src/components/Combobox/Combobox.tsx
-import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
-var ComboboxInner = ({
-  ref,
-  ...props
-}) => {
-  const {
-    id,
-    defaultValue,
-    value,
-    options,
-    asyncOptions,
-    delay,
-    minSearchLength,
-    onSelected,
-    className,
-    placeholder,
-    icon,
-    onBlur,
-    onFocus,
-    onChange,
-    // onSearched, // unused prop, consider removing
-    optionComponent,
-    optionTestIdPrefix,
-    errorMessage,
-    ...otherProps
-  } = props;
-  const skipNextDebounceRef = useRef3(false);
-  const fallbackRef = useRef3(null);
-  const [inputValue, setInputValue] = useState8(defaultValue || "");
-  const [isOpen, setIsOpen] = useState8(false);
-  const [isChanging, setIsChanging] = useState8(false);
-  const { filteredOptions, updateFilteredOptions, isLoading, error: error2 } = useComboboxOptions({
-    options,
-    asyncOptions,
-    inputValue,
-    delay,
-    minSearchLength,
-    skipNextDebounceRef
-  });
-  const [validationError, setValidationError] = useState8(
-    error2?.message || errorMessage
-  );
-  const {
-    highlightedIndex,
-    highlightedGroupIndex,
-    highlightNextOption,
-    highlightPreviousOption,
-    highlightFirstOption,
-    highlightLastOption,
-    clearHighlight
-  } = useComboboxHighlight(filteredOptions);
-  const inputRef = ref || fallbackRef;
-  const listboxId = useId2();
-  const statusId = useId2();
-  const blurTimeoutRef = useRef3(null);
-  const userInteractedRef = useRef3(false);
-  const justSelectedRef = useRef3(false);
-  const { down } = useBreakpoint();
-  const isMobile = down("md");
-  useEffect6(() => {
-    setValidationError(error2?.message || errorMessage);
-  }, [error2, errorMessage]);
-  const getEmptyValue = () => {
-    const firstOption = filteredOptions ? isOptionGroup(filteredOptions) ? filteredOptions[0]?.options[0] : filteredOptions[0] : options ? isOptionGroup(options) ? options[0]?.options[0] : options[0] : void 0;
-    if (typeof firstOption === "string") {
-      return "";
-    }
-    return { label: "", value: "" };
-  };
-  const handleFocus = (e) => {
-    onFocus?.(e);
-    if (!filteredOptions || filteredOptions.length === 0) return;
-    if (blurTimeoutRef.current) {
-      clearTimeout(blurTimeoutRef.current);
-      blurTimeoutRef.current = null;
-    }
-    const isNaturalFocus = userInteractedRef.current || e.relatedTarget !== null;
-    if (userInteractedRef.current) {
-      userInteractedRef.current = false;
-    }
-    if (justSelectedRef.current && !isNaturalFocus) {
-      return;
-    }
-    if (isNaturalFocus) {
-      setIsOpen(true);
-      justSelectedRef.current = false;
-    }
-  };
-  useEffect6(() => {
-    if (!inputRef || typeof inputRef === "function") return;
-    const inputElement = inputRef.current;
-    if (!inputElement) return;
-    const handleMouseDown = () => {
-      userInteractedRef.current = true;
-    };
-    inputElement.addEventListener("mousedown", handleMouseDown);
-    return () => {
-      inputElement.removeEventListener("mousedown", handleMouseDown);
-    };
-  }, [inputRef]);
-  useOnUnmount(() => {
-    if (blurTimeoutRef.current) {
-      clearTimeout(blurTimeoutRef.current);
-    }
-  });
-  const handleInputChange = (e) => {
-    const newValue = e.target.value;
-    setInputValue(newValue);
-    setValidationError(void 0);
-    justSelectedRef.current = false;
-    setIsChanging(true);
-    if (!asyncOptions) {
-      setIsOpen(true);
-    }
-    clearHighlight();
-    onChange?.(e);
-  };
-  const handleOptionSelect = (option) => {
-    const val = getOptionValue(option);
-    if (!val && val !== "") return;
-    if (typeof option === "object" && "callback" in option && option.callback && typeof option.callback === "function") {
-      setTimeout(() => {
-        if (inputRef && typeof inputRef !== "function" && inputRef.current) {
-          inputRef.current.focus();
-        }
-      }, 0);
-      updateFilteredOptions(option.callback());
-      return;
-    }
-    skipNextDebounceRef.current = true;
-    justSelectedRef.current = true;
-    setIsChanging(false);
-    setValidationError(void 0);
-    setIsOpen(false);
-    setInputValue(val);
-    onSelected?.(option);
-  };
-  const getFirstOption = () => {
-    if (!filteredOptions) return void 0;
-    if (isOptionGroup(filteredOptions)) {
-      return filteredOptions[0]?.options[0];
-    }
-    return filteredOptions[0];
-  };
-  const getHighlightedOption = () => {
-    if (!filteredOptions) return void 0;
-    if (highlightedIndex === -1) return void 0;
-    if (isOptionGroup(filteredOptions)) {
-      const group = filteredOptions[highlightedGroupIndex];
-      return group?.options[highlightedIndex];
-    }
-    return filteredOptions[highlightedIndex];
-  };
-  const getHighlightedOptionId = () => {
-    const option = getHighlightedOption();
-    if (!option) return void 0;
-    if (isOptionGroup(filteredOptions)) {
-      return `${listboxId}-option-${highlightedGroupIndex}-${highlightedIndex}`;
-    }
-    return `${listboxId}-option-${highlightedIndex}`;
-  };
-  const handleBlur = (e) => {
-    if (!justSelectedRef.current) {
-      const typedText = inputValue.trim();
-      const typedTextLower = typedText.toLowerCase();
-      const highlightedOption = getHighlightedOption();
-      const label = getOptionLabel(highlightedOption);
-      if (typedTextLower === label?.toLowerCase()) {
-        setTimeout(() => {
-          handleOptionSelect(highlightedOption);
-        }, 0);
-      } else if (typedText === "") {
-        setTimeout(() => {
-          handleOptionSelect(getEmptyValue());
-        }, 0);
-      } else {
-        setValidationError(
-          errorMessage || "Please select an option from the list"
-        );
-        setTimeout(() => {
-          setInputValue("");
-        }, 0);
-      }
-    }
-    blurTimeoutRef.current = setTimeout(() => {
-      onBlur?.(e);
-      setIsOpen(false);
-      setIsChanging(false);
-    }, 150);
-  };
-  const handleKeyDown = (e) => {
-    switch (e.key) {
-      case "ArrowDown":
-        e.preventDefault();
-        justSelectedRef.current = false;
-        setIsOpen(true);
-        highlightNextOption();
-        break;
-      case "ArrowUp":
-        e.preventDefault();
-        justSelectedRef.current = false;
-        setIsOpen(true);
-        highlightPreviousOption();
-        break;
-      case "Home":
-        e.preventDefault();
-        justSelectedRef.current = false;
-        setIsOpen(true);
-        highlightFirstOption();
-        break;
-      case "End":
-        e.preventDefault();
-        justSelectedRef.current = false;
-        setIsOpen(true);
-        highlightLastOption();
-        break;
-      case "Enter":
-        e.preventDefault();
-        if (isOpen) {
-          const selectedOption = getHighlightedOption() || getFirstOption();
-          if (selectedOption) {
-            handleOptionSelect(selectedOption);
-          }
-        }
-        break;
-      case "Escape":
-        e.preventDefault();
-        setInputValue("");
-        setIsOpen(false);
-        clearHighlight();
-        break;
-      default:
-    }
-  };
-  useEffect6(() => {
-    if (value) {
-      setInputValue(value);
-    }
-  }, [value]);
-  useEffect6(() => {
-    if (asyncOptions && isChanging) {
-      setIsOpen(!!filteredOptions && filteredOptions.length > 0);
-    }
-  }, [filteredOptions, asyncOptions, isChanging]);
-  const classes = classNames8(
-    "mobius mobius-combobox",
-    {
-      "mobius-combobox--is-expanded": isOpen,
-      "mobius-combobox--is-loading": isLoading,
-      "mobius-combobox--is-mobile": isMobile
-    },
-    className
-  );
-  const getStatusMessage = () => {
-    if (isLoading) return "Loading options";
-    if (!filteredOptions || filteredOptions.length === 0) {
-      return isChanging ? "No options found" : "";
-    }
-    const count = isOptionGroup(filteredOptions) ? filteredOptions.reduce((sum, group) => sum + group.options.length, 0) : filteredOptions.length;
-    return isOpen && isChanging ? `${count} option${count === 1 ? "" : "s"} available` : "";
-  };
-  return /* @__PURE__ */ jsxs5("div", { id, "data-testid": "mobius-combobox__wrapper", className: classes, children: [
-    /* @__PURE__ */ jsx9(
-      VisuallyHidden,
-      {
-        role: "status",
-        "aria-live": "polite",
-        id: statusId,
-        elementType: "div",
-        className: "mobius-combobox__status",
-        children: getStatusMessage()
-      }
-    ),
-    /* @__PURE__ */ jsx9(
-      TextField,
-      {
-        ...otherProps,
-        className: "mobius-combobox__input",
-        role: "combobox",
-        value: inputValue,
-        placeholder,
-        onFocus: handleFocus,
-        onBlur: handleBlur,
-        onKeyDown: handleKeyDown,
-        onChange: handleInputChange,
-        autoComplete: "off",
-        "aria-describedby": isLoading ? statusId : void 0,
-        "aria-autocomplete": "list",
-        "aria-haspopup": "listbox",
-        "aria-owns": listboxId,
-        "aria-controls": listboxId,
-        "aria-expanded": isOpen,
-        "aria-activedescendant": highlightedIndex === -1 ? void 0 : getHighlightedOptionId(),
-        prefixInside: icon,
-        ref: inputRef,
-        errorMessage: errorMessage || validationError || error2?.message
-      }
-    ),
-    /* @__PURE__ */ jsx9(
-      Listbox,
-      {
-        id: listboxId,
-        isOpen,
-        isLoading,
-        options: filteredOptions,
-        highlightedIndex,
-        highlightedGroupIndex,
-        onOptionSelect: handleOptionSelect,
-        optionComponent,
-        optionTestIdPrefix
-      }
-    )
-  ] });
-};
-var Combobox = ComboboxInner;
-
-// src/components/AddressLookup/utils.ts
-function isLoqateErrorResponse(response) {
-  return Array.isArray(response) && response.some((item) => "Error" in item);
-}
-
-// src/components/AddressLookup/AddressLookup.tsx
-import { jsx as jsx10 } from "react/jsx-runtime";
-function optionsFromResponse({ Items }, addressLookupService) {
-  if (!Items || !Array.isArray(Items)) {
-    throw Error("No address found");
-  }
-  if (isLoqateErrorResponse(Items)) {
-    throw Error(Items[0].Description);
-  }
-  return Items.map((item) => ({
-    id: item.Id,
-    label: `${item.Text}, ${item.Description}`,
-    value: item.Text,
-    // Add a callback to trigger secondary search
-    // if the address type is not "Address"
-    callback: item.Type === "Address" ? void 0 : async () => {
-      const result = await addressLookupService.findById(item.Id);
-      return optionsFromResponse(result, addressLookupService);
-    }
-  }));
-}
-var AddressLookup = ({
-  ref,
-  addressLookupService,
-  onAddressSelected,
-  onOptionsDisplayed,
-  onError,
-  errorMessage,
-  ...otherProps
-}) => {
-  const [error2, _setError] = useState9(null);
-  const setError = useCallback4(
-    (newError) => {
-      if (newError != null) onError?.(newError);
-      _setError(newError);
-    },
-    [onError]
-  );
-  const asyncOptions = useCallback4(
-    async (searchTerm) => {
-      try {
-        const response = await addressLookupService.search(searchTerm);
-        setError(null);
-        const options = optionsFromResponse(response, addressLookupService);
-        onOptionsDisplayed?.();
-        return options;
-      } catch (e) {
-        setError(e);
-        return [];
-      }
-    },
-    [addressLookupService, setError, onOptionsDisplayed]
-  );
-  const handleSelected = (selected) => {
-    setError(null);
-    if (typeof selected === "string" || !selected.id) {
-      setError(new Error("Selected option missing id"));
-      return Promise.resolve();
-    }
-    return addressLookupService.get(selected.id).then(onAddressSelected).catch(setError);
-  };
-  const realErrorMessage = error2 && "An error occurred" || errorMessage;
-  return /* @__PURE__ */ jsx10(
-    Combobox,
-    {
-      ...otherProps,
-      ref,
-      onSelected: handleSelected,
-      asyncOptions,
-      errorMessage: realErrorMessage,
-      icon: /* @__PURE__ */ jsx10(Icon, { icon: search })
-    }
-  );
-};
-AddressLookup.displayName = "AddressLookup";
-
-// src/components/AddressLookup/LoqateAddressLookupError.tsx
-var LoqateAddressLookupError = class extends Error {
-  constructor(response) {
-    super(response.Description);
-    this.name = "LoqateAddressLookupError";
-    this.response = response;
-  }
-};
-
-// src/components/AddressLookup/LoqateAddressLookupService.tsx
-var LOQATE_BASE_URL = "https://api.addressy.com/Capture/Interactive";
-var LOQATE_FIND_URL = "/Find/v1.00/json3.ws";
-var LOQATE_RETRIEVE_URL = "/Retrieve/v1.2/json3.ws";
-var DEFAULT_COUNTRIES = ["GB"];
-var _baseUrl, _apiKey, _countries, _filters;
-var LoqateAddressLookupService = class {
-  constructor({
-    baseUrl,
-    apiKey,
-    countries,
-    filters
-  }) {
-    /**
-     * Base URL for the Loqate API
-     */
-    __privateAdd(this, _baseUrl);
-    /**
-     * API key for the Loqate API
-     */
-    __privateAdd(this, _apiKey);
-    /**
-     * List of allowed country codes for the Loqate API
-     * 2 or 3 character ISO country codes
-     */
-    __privateAdd(this, _countries);
-    /**
-     * Optional filters for the Loqate API
-     * E.g., { AdministrativeArea: "CA", PostalCode: "90210" }
-     */
-    __privateAdd(this, _filters);
-    __privateSet(this, _apiKey, apiKey);
-    __privateSet(this, _baseUrl, baseUrl || LOQATE_BASE_URL);
-    __privateSet(this, _countries, countries || DEFAULT_COUNTRIES);
-    __privateSet(this, _filters, filters);
-  }
-  fetchFromApi(url) {
-    return fetch(`${__privateGet(this, _baseUrl)}${url}`).then((response) => response.json()).then((json) => {
-      if (json.Items?.some((item) => item.Error)) {
-        throw new LoqateAddressLookupError(json);
-      }
-      return json;
-    });
-  }
-  /**
-   * Builds the Filters query parameter for Loqate API requests.
-   * - Filter keys (e.g., "AdministrativeArea", "PostalCode") are predefined by Loqate API (no need to encode)
-   * - Filter values (e.g., "New York", "90210") contain user input that may have special characters (need encoding)
-   *
-   * @returns Empty string if no filters, otherwise "&Filters=key1:value1&key2:value2" (Loqate's expected format for Filters)
-   */
-  buildFiltersQuery() {
-    if (!__privateGet(this, _filters) || Object.keys(__privateGet(this, _filters)).length === 0) {
-      return "";
-    }
-    const encodedFilters = Object.entries(__privateGet(this, _filters)).map(([key, value]) => `${key}:${encodeURIComponent(value)}`).join("&");
-    return `&Filters=${encodedFilters}`;
-  }
-  search(searchTerm) {
-    let url = `${LOQATE_FIND_URL}?Key=${__privateGet(this, _apiKey)}&Text=${searchTerm}&Countries=${__privateGet(this, _countries)?.join(",")}`;
-    url += this.buildFiltersQuery();
-    return this.fetchFromApi(url);
-  }
-  findById(id) {
-    let url = `${LOQATE_FIND_URL}?Key=${__privateGet(this, _apiKey)}&Container=${id}&Countries=${__privateGet(this, _countries)?.join(",")}`;
-    url += this.buildFiltersQuery();
-    return this.fetchFromApi(url);
-  }
-  async get(id) {
-    const url = `${LOQATE_RETRIEVE_URL}?Key=${__privateGet(this, _apiKey)}&Id=${id}`;
-    const response = await this.fetchFromApi(url);
-    return response.Items[0];
-  }
-};
-_baseUrl = new WeakMap();
-_apiKey = new WeakMap();
-_countries = new WeakMap();
-_filters = new WeakMap();
-
-// src/components/Alert/Alert.tsx
-import { circleInfo, circleTick, error, warning } from "@simplybusiness/icons";
-import classNames9 from "classnames/dedupe";
-import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
-function isAlertVariant(value) {
-  return value === "info" || value === "success" || value === "warning" || value === "error";
-}
-var Alert = ({ ref, ...props }) => {
-  const {
-    elementType: Element = "div",
-    variant: variantProp,
-    show = true,
-    header,
-    children,
-    ...otherProps
-  } = props;
-  if (!show) return null;
-  const variant = variantProp && isAlertVariant(variantProp) ? variantProp : "info";
-  const colorValue = variant === "success" ? `var(--color-valid)` : `var(--color-${variant})`;
-  const classes = classNames9(
-    "mobius",
-    "mobius-alert",
-    {
-      "--info": variant === "info",
-      "--success": variant === "success",
-      "--warning": variant === "warning",
-      "--error": variant === "error",
-      "--has-header": header
-    },
-    otherProps.className
-  );
-  const icon = {
-    info: circleInfo,
-    success: circleTick,
-    warning,
-    error
-  };
-  const headerClasses = classNames9("mobius", "mobius-alert__header");
-  const iconClasses = classNames9("mobius", "mobius-alert__icon");
-  const contentClasses = classNames9("mobius", "mobius-alert__content");
-  return /* @__PURE__ */ jsxs6(Element, { ref, role: "alert", ...otherProps, className: classes, children: [
-    /* @__PURE__ */ jsx11("span", { className: iconClasses, children: /* @__PURE__ */ jsx11(Icon, { icon: icon[variant], color: colorValue }) }),
-    /* @__PURE__ */ jsxs6("div", { children: [
-      header && /* @__PURE__ */ jsx11("p", { className: headerClasses, children: header }),
-      /* @__PURE__ */ jsx11("div", { className: contentClasses, children })
-    ] })
-  ] });
-};
-Alert.displayName = "Alert";
-
-// src/components/Box/Box.tsx
-import classNames10 from "classnames/dedupe";
-import { jsx as jsx12 } from "react/jsx-runtime";
-var Box = ({ ref, ...props }) => {
-  const {
-    elementType: Element = "div",
-    padding,
-    paddingX,
-    paddingInline,
-    paddingInlineStart,
-    paddingInlineEnd,
-    paddingY,
-    paddingBlock,
-    paddingBlockStart,
-    paddingBlockEnd,
-    paddingTop,
-    paddingRight,
-    paddingBottom,
-    paddingLeft,
-    minWidth,
-    minHeight,
-    maxWidth,
-    maxHeight,
-    width,
-    height,
-    style,
-    ...otherProps
-  } = props;
-  const classes = classNames10("mobius", "mobius-box", otherProps.className);
-  const styleProps = filterUndefinedProps({
-    padding: getSpacingValue(padding),
-    paddingInline: getSpacingValue(paddingInline || paddingX),
-    paddingBlock: getSpacingValue(paddingBlock || paddingY),
-    paddingTop: getSpacingValue(paddingTop || paddingBlockStart),
-    paddingRight: getSpacingValue(paddingRight || paddingInlineEnd),
-    paddingBottom: getSpacingValue(paddingBottom || paddingBlockEnd),
-    paddingLeft: getSpacingValue(paddingLeft || paddingInlineStart),
-    minWidth,
-    minHeight,
-    maxWidth,
-    maxHeight,
-    width,
-    height,
-    ...style
-  });
-  return /* @__PURE__ */ jsx12(Element, { ref, style: styleProps, ...otherProps, className: classes });
-};
-Box.displayName = "Box";
-
-// src/components/Breadcrumbs/Breadcrumbs.tsx
-import { Children, cloneElement } from "react";
-import classNames11 from "classnames/dedupe";
-import { jsx as jsx13 } from "react/jsx-runtime";
-var Breadcrumbs = ({ ref, ...props }) => {
-  const { "aria-label": ariaLabel = "Breadcrumbs" } = props;
-  const { navProps } = { navProps: { "aria-label": ariaLabel } };
-  const { children, ...otherProps } = props;
-  const childArray = Children.toArray(children);
-  const classes = classNames11(
-    "mobius",
-    "mobius-breadcrumb",
-    otherProps.className
-  );
-  return /* @__PURE__ */ jsx13("nav", { ref, ...otherProps, ...navProps, className: classes, children: /* @__PURE__ */ jsx13("ul", { children: childArray.map(
-    (child, i) => cloneElement(
-      child,
-      {
-        key: i,
-        isCurrent: i === childArray.length - 1
-      }
-    )
-  ) }) });
-};
-Breadcrumbs.displayName = "Breadcrumbs";
-
-// src/components/Breadcrumbs/BreadcrumbItem.tsx
-import { cloneElement as cloneElement2, Children as Children2 } from "react";
-import classNames12 from "classnames/dedupe";
-import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
-var BreadcrumbItem = ({ ref, ...props }) => {
-  const {
-    isDisabled = false,
-    isCurrent = false,
-    "aria-current": ariaCurrent = "page",
-    children,
-    separator = /* @__PURE__ */ jsx14(Box, { className: "mobius-breadcrumb__separator", "aria-hidden": "true", children: ">" }),
-    ...otherProps
-  } = props;
-  const { itemProps } = {
-    itemProps: {
-      "aria-current": isCurrent ? ariaCurrent : void 0,
-      "aria-disabled": isDisabled || isCurrent,
-      ...otherProps
-    }
-  };
-  const classes = classNames12(
-    "mobius",
-    "mobius-breadcrumb__item",
-    props.className
-  );
-  const child = typeof children === "string" ? /* @__PURE__ */ jsx14("span", { ...itemProps, children }) : Children2.only(children);
-  return /* @__PURE__ */ jsxs7("li", { className: classes, children: [
-    cloneElement2(child, {
-      ...child.props,
-      ...itemProps,
-      ref
-    }),
-    !props.isCurrent && separator
-  ] });
-};
-BreadcrumbItem.displayName = "BreadcrumbItem";
-
-// src/components/Button/Button.tsx
-import classNames13 from "classnames/dedupe";
-
-// src/components/Button/Loading.tsx
-import { loading } from "@simplybusiness/icons";
-import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
-var Loading = (props) => {
-  const { children } = props;
-  return /* @__PURE__ */ jsxs8(Fragment2, { children: [
-    /* @__PURE__ */ jsx15("div", { className: "mobius-button__icon-wrapper", children: /* @__PURE__ */ jsx15(Icon, { icon: loading, spin: true, size: "md" }) }),
-    /* @__PURE__ */ jsx15(VisuallyHidden, { className: "mobius-button__loading-text", children: "Loading" }),
-    children
-  ] });
-};
-
-// src/components/Button/Success.tsx
-import { tick } from "@simplybusiness/icons";
-import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
-var Success = () => /* @__PURE__ */ jsxs9(Fragment3, { children: [
-  /* @__PURE__ */ jsx16("div", { className: "mobius-button__icon-wrapper", children: /* @__PURE__ */ jsx16(Icon, { icon: tick, size: "md" }) }),
-  /* @__PURE__ */ jsx16(VisuallyHidden, { className: "mobius-button__success-text", children: "Success" })
-] });
-
-// src/components/Button/Button.tsx
-import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
-var Button = ({ ref, ...props }) => {
-  const {
-    children,
-    elementType: Component = "button",
-    isDisabled,
-    isLoading,
-    isSuccess,
-    variant = "primary",
-    size = "md",
-    onPress,
-    onClick,
-    ...otherProps
-  } = props;
-  const { buttonProps } = useButton(props);
-  otherProps.className = classNames13(
-    "mobius",
-    "mobius-button",
-    `--variant-${variant}`,
-    `--size-${size}`,
-    {
-      "--is-disabled": isDisabled,
-      "--is-loading": isLoading,
-      "--is-success": isSuccess && !isLoading
-    },
-    otherProps.className
-  );
-  return /* @__PURE__ */ jsxs10(Component, { ref, ...buttonProps, ...otherProps, children: [
-    isLoading ? /* @__PURE__ */ jsx17(Loading, { children }) : children,
-    isSuccess && !isLoading && /* @__PURE__ */ jsx17(Success, {})
-  ] });
-};
-Button.displayName = "Button";
-
-// src/components/Checkbox/Checkbox.tsx
-import { useRef as useRef4, useId as useId3, useState as useState10, useEffect as useEffect7 } from "react";
-import classNames14 from "classnames/dedupe";
-import { squareTick, square } from "@simplybusiness/icons";
-import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
-var Checkbox = ({ ref, ...props }) => {
-  const {
-    id,
-    label,
-    isDisabled,
-    isRequired,
-    isInvalid,
-    onChange,
-    className,
-    errorMessage,
-    selected,
-    defaultSelected = false,
-    isReadOnly,
-    isLastItem,
-    name,
-    value,
-    ["aria-describedby"]: ariaDescribedBy,
-    ...rest
-  } = props;
-  const [checked, setChecked] = useState10(defaultSelected);
-  const fallbackRef = useRef4(null);
-  const refObj = ref || fallbackRef;
-  const inputId = useId3();
-  const isControlled = typeof selected === "boolean";
-  useEffect7(() => {
-    if (isControlled) {
-      setChecked(selected);
-    }
-  }, [selected, isControlled]);
-  const validationClasses = useValidationClasses({ isInvalid });
-  const sharedClasses = classNames14(
-    {
-      "--is-disabled": isDisabled,
-      "--is-selected": checked,
-      "--is-required": typeof isRequired === "boolean" && isRequired,
-      "--is-optional": typeof isRequired === "boolean" && !isRequired
-    },
-    validationClasses
-  );
-  const wrapperClasses = classNames14(
-    "mobius",
-    "mobius-checkbox",
-    sharedClasses,
-    className
-  );
-  const labelClasses = classNames14("mobius-checkbox__label", sharedClasses);
-  const inputClasses = classNames14("mobius-checkbox__input", sharedClasses);
-  const iconClasses = classNames14("mobius-checkbox__icon", sharedClasses);
-  const errorMessageId = useId3();
-  const shouldErrorMessageShow = errorMessage ? errorMessageId : void 0;
-  const describedBy = spaceDelimitedList([
-    shouldErrorMessageShow,
-    ariaDescribedBy
-  ]);
-  const labelId = useId3();
-  const handleChange = (event) => {
-    setChecked(!checked);
-    if (onChange) {
-      onChange(event, isLastItem);
-    }
-  };
-  return /* @__PURE__ */ jsxs11(Stack, { gap: "xs", className: wrapperClasses, children: [
-    /* @__PURE__ */ jsxs11("label", { className: labelClasses, children: [
-      /* @__PURE__ */ jsx18(
-        "input",
-        {
-          "aria-describedby": describedBy,
-          "aria-errormessage": shouldErrorMessageShow,
-          "aria-invalid": isInvalid,
-          "aria-labelledby": labelId,
-          readOnly: isReadOnly,
-          disabled: isDisabled,
-          ref: refObj,
-          className: inputClasses,
-          onChange: handleChange,
-          type: "checkbox",
-          checked,
-          required: isRequired,
-          id: id || inputId,
-          name,
-          value,
-          ...rest
-        }
-      ),
-      /* @__PURE__ */ jsx18(
-        Icon,
-        {
-          icon: checked ? squareTick : square,
-          size: "md",
-          className: iconClasses
-        }
-      ),
-      /* @__PURE__ */ jsx18("span", { id: labelId, className: "mobius-checkbox__visible-label", children: label })
-    ] }),
-    /* @__PURE__ */ jsx18(ErrorMessage, { id: errorMessageId, errorMessage })
-  ] });
-};
-Checkbox.displayName = "Checkbox";
-
-// src/components/Checkbox/CheckboxGroup.tsx
-import classNames15 from "classnames/dedupe";
-import {
-  Children as Children3,
-  cloneElement as cloneElement3,
-  isValidElement,
-  useEffect as useEffect8,
-  useId as useId4,
-  useRef as useRef5,
-  useState as useState11
-} from "react";
-import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
-var CheckboxGroup = ({ ref, ...props }) => {
-  const {
-    label,
-    isDisabled = false,
-    isRequired,
-    isInvalid,
-    orientation = "vertical",
-    onChange,
-    className,
-    errorMessage,
-    children,
-    defaultValue = [],
-    isReadOnly,
-    itemsPerRow,
-    lastItemDisables = false,
-    ...rest
-  } = props;
-  const [selected, setSelected] = useState11(defaultValue);
-  const isInitializedRef = useRef5(false);
-  const prevDefaultValueRef = useRef5(defaultValue);
-  useEffect8(() => {
-    const hasChanged = defaultValue.length !== prevDefaultValueRef.current.length || defaultValue.some(
-      (val, index) => val !== prevDefaultValueRef.current[index]
-    );
-    if (hasChanged || !isInitializedRef.current) {
-      setSelected(defaultValue);
-      prevDefaultValueRef.current = defaultValue;
-      isInitializedRef.current = true;
-    }
-  }, [defaultValue]);
-  const checkboxGroupClasses = classNames15(
-    "mobius",
-    "mobius-checkbox-group",
-    className,
-    {
-      "--is-horizontal": orientation === "horizontal",
-      "--is-vertical": orientation === "vertical",
-      "--is-required": typeof isRequired === "boolean" && isRequired,
-      "--is-optional": typeof isRequired === "boolean" && !isRequired
-    }
-  );
-  const validationClasses = useValidationClasses({ isInvalid });
-  const labelClasses = classNames15(
-    {
-      "--is-disabled": isDisabled
-    },
-    validationClasses
-  );
-  const errorMessageId = useId4();
-  const shouldErrorMessageShow = errorMessage ? errorMessageId : void 0;
-  const describedBy = spaceDelimitedList([
-    shouldErrorMessageShow,
-    props["aria-describedby"]
-  ]);
-  const labelId = useId4();
-  const handleChange = (event, isLastItem = false) => {
-    const {
-      target: { value, checked }
-    } = event;
-    let newValue = [...selected];
-    if (!checked) {
-      newValue = selected.filter((item) => item !== value);
-    }
-    if (checked) {
-      newValue = [...selected, value];
-    }
-    if (checked && lastItemDisables && isLastItem) {
-      newValue = [value];
-    }
-    setSelected(newValue);
-    onChange?.(newValue);
-  };
-  const childrenArray = Children3.toArray(children);
-  const lastCheckbox = childrenArray.filter(
-    (child) => isValidElement(child) && child.type === Checkbox
-  ).pop();
-  const lastCheckboxIsChecked = lastCheckbox && selected.includes(lastCheckbox.props.value);
-  return /* @__PURE__ */ jsxs12(
-    "div",
-    {
-      ...rest,
-      "aria-labelledby": props["aria-labelledby"] || labelId,
-      ref,
-      className: checkboxGroupClasses,
-      role: "group",
-      style: {
-        "--checkbox-items-per-row": itemsPerRow || Children3.count(children)
-      },
-      children: [
-        label && /* @__PURE__ */ jsx19(Label, { elementType: "span", id: labelId, className: labelClasses, children: label }),
-        /* @__PURE__ */ jsx19("div", { className: "mobius-checkbox-group__wrapper", children: childrenArray.map((child) => {
-          if (isValidElement(child)) {
-            const isLastItem = child === lastCheckbox;
-            const isChildDisabled = isDisabled || lastItemDisables && lastCheckboxIsChecked && !isLastItem;
-            const childProps = child.props;
-            return cloneElement3(
-              child,
-              {
-                isDisabled: isChildDisabled,
-                isRequired,
-                isReadOnly,
-                isInvalid,
-                isLastItem,
-                selected: selected.includes(childProps.value),
-                onChange: childProps.onChange || handleChange,
-                "aria-describedby": describedBy
-              }
-            );
-          }
-          return child;
-        }) }),
-        errorMessage && /* @__PURE__ */ jsx19(ErrorMessage, { id: errorMessageId, errorMessage })
-      ]
-    }
-  );
-};
-CheckboxGroup.displayName = "CheckboxGroup";
-
-// src/components/Container/Container.tsx
-import classNames16 from "classnames/dedupe";
-import { jsx as jsx20 } from "react/jsx-runtime";
-var Container = ({ ref, ...props }) => {
-  const { elementType: Element = "div", size = "md", ...otherProps } = props;
-  const classes = classNames16(
-    "mobius",
-    "mobius-container",
-    sizeClasses(size),
-    otherProps.className
-  );
-  return /* @__PURE__ */ jsx20(Element, { ref, ...otherProps, className: classes });
-};
-Container.displayName = "Container";
-
-// src/components/DateField/DateField.tsx
-import classNames17 from "classnames/dedupe";
-import { useEffect as useEffect9, useRef as useRef6, useState as useState12 } from "react";
-
-// src/components/DateField/validation.ts
-var convertToDateFormat = (date, format) => {
-  const dateParts = date.split(/[-/]/);
-  const formatParts = format ? format.split(/[-/]/) : ["yyyy", "mm", "dd"];
-  const dateObj = {};
-  const formattedDate = [];
-  for (let i = 0; i < formatParts.length; i++) {
-    dateObj[formatParts[i]] = dateParts[i] ? parseInt(dateParts[i], 10) : 0;
-  }
-  formattedDate.push(dateObj["yyyy"]?.toString() || "0000");
-  formattedDate.push(
-    (dateObj["mm"] < 10 ? "0" : "") + (dateObj["mm"]?.toString() || "00")
-  );
-  formattedDate.push(
-    (dateObj["dd"] < 10 ? "0" : "") + (dateObj["dd"]?.toString() || "00")
-  );
-  return formattedDate.join("-");
-};
-var isValidDate = (date, format = "yyyy-mm-dd") => {
-  if (!date) return true;
-  const standardDate = convertToDateFormat(date, format);
-  const [yearStr, monthStr, dayStr] = standardDate.split("-");
-  const year = parseInt(yearStr, 10);
-  const month = parseInt(monthStr, 10);
-  const day = parseInt(dayStr, 10);
-  if (month < 1 || month > 12) {
-    return false;
-  }
-  const daysInMonth = new Date(year, month, 0).getDate();
-  return day > 0 && day <= daysInMonth;
-};
-
-// src/components/DateField/DateField.tsx
-import { jsx as jsx21 } from "react/jsx-runtime";
-var MIN_MAX_ERROR = '"min" value should not be greater than "max" value.';
-var DateField = ({ ref, ...props }) => {
-  const {
-    min,
-    max,
-    format,
-    className,
-    errorMessage,
-    defaultValue,
-    value,
-    ...otherProps
-  } = props;
-  const [error2, setError] = useState12(errorMessage);
-  const [isInvalid, setIsInvalid] = useState12(void 0);
-  const localRef = useRef6(null);
-  const classes = classNames17("mobius-date-field", className);
-  const formattedMin = min ? convertToDateFormat(min, format) : void 0;
-  const formattedMax = max ? convertToDateFormat(max, format) : void 0;
-  const formattedDefaultValue = defaultValue ? convertToDateFormat(defaultValue, format) : void 0;
-  const formattedValue = value ? convertToDateFormat(value, format) : void 0;
-  const setInvalidState = (error3) => {
-    setError(error3);
-    setIsInvalid(true);
-  };
-  const setValidState = () => {
-    setError(props.errorMessage);
-    setIsInvalid(false);
-  };
-  useEffect9(() => {
-    if (!isValidDate(min, format)) {
-      setInvalidState(`Invalid min date: ${min}`);
-      return;
-    }
-    if (!isValidDate(max, format)) {
-      setInvalidState(`Invalid max date: ${max}`);
-      return;
-    }
-    if (min && max) {
-      const minDate = new Date(min);
-      const maxDate = new Date(max);
-      if (minDate > maxDate) {
-        setInvalidState(MIN_MAX_ERROR);
-      } else {
-        setValidState();
-      }
-    } else {
-      setValidState();
-    }
-  }, [min, max, format]);
-  const validate = () => {
-    const isValidInput = localRef.current?.checkValidity();
-    if (!isValidInput) {
-      setInvalidState("Invalid date input");
-    } else {
-      setValidState();
-    }
-  };
-  const handleBlur = (event) => {
-    validate();
-    otherProps.onBlur?.(event);
-  };
-  return /* @__PURE__ */ jsx21(
-    TextField,
-    {
-      ref: mergeRefs([localRef, ref]),
-      className: classes,
-      type: "date",
-      min: formattedMin,
-      max: formattedMax,
-      errorMessage: errorMessage ?? error2,
-      isInvalid,
-      defaultValue: formattedDefaultValue,
-      value: formattedValue,
-      onBlur: handleBlur,
-      ...otherProps
-    }
-  );
-};
-DateField.displayName = "DateField";
-
-// src/components/Drawer/Content.tsx
-import { jsx as jsx22 } from "react/jsx-runtime";
-var Content = ({ ref, children, ...otherProps }) => /* @__PURE__ */ jsx22("div", { ref, ...otherProps, className: "mobius-drawer__content", children });
-Content.displayName = "Content";
-
-// src/components/Drawer/Drawer.tsx
-import classNames18 from "classnames/dedupe";
-import { useEffect as useEffect10, useId as useId5, useMemo as useMemo2, useRef as useRef7, useState as useState13 } from "react";
-
-// src/components/Drawer/DrawerContext.tsx
-import { createContext } from "react";
-var DrawerContext = createContext({
-  onClose: () => {
-  },
-  closeLabel: void 0,
-  headerId: void 0
-});
-
-// src/components/Drawer/Drawer.tsx
-import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
-var TRANSITION_CSS_VARIABLE = "--drawer-transition-duration";
-var Drawer = ({ ref, ...props }) => {
-  const {
-    isOpen,
-    className,
-    closeLabel,
-    direction,
-    announce = "Drawer opened on screen",
-    onOpen,
-    onClose,
-    children
-  } = props;
-  const dialogRef = useRef7(null);
-  const [shouldTransition, setShouldTransition] = useState13(false);
-  const { close } = useDialog({
-    ref: dialogRef,
-    isOpen,
-    onOpen,
-    onClose,
-    transition: {
-      isEnabled: true,
-      CSSVariable: TRANSITION_CSS_VARIABLE
-    }
-  });
-  const hiddenId = `dialog-screen-reader-announce-${useId5()}`;
-  const headerId = `dialog-header-${useId5()}`;
-  const dialogClasses = classNames18(
-    "mobius",
-    "mobius-drawer",
-    `--${direction}`,
-    className,
-    {
-      "--should-transition": shouldTransition
-    }
-  );
-  useEffect10(() => {
-    setShouldTransition(supportsDialog());
-  }, []);
-  const contextValue = useMemo2(
-    () => ({
-      onClose: close,
-      closeLabel,
-      headerId
-    }),
-    [close, closeLabel, headerId]
-  );
-  return /* @__PURE__ */ jsxs13(
-    "dialog",
-    {
-      id: useId5(),
-      ref: mergeRefs([dialogRef, ref]),
-      onCancel: close,
-      className: dialogClasses,
-      "aria-describedby": hiddenId,
-      "aria-labelledby": headerId,
-      children: [
-        /* @__PURE__ */ jsx23(VisuallyHidden, { children: /* @__PURE__ */ jsx23("div", { id: hiddenId, children: announce }) }),
-        /* @__PURE__ */ jsx23(DrawerContext.Provider, { value: contextValue, children })
-      ]
-    }
-  );
-};
-Drawer.displayName = "Drawer";
-
-// src/components/Drawer/useDrawer.ts
-import { useContext } from "react";
-var useDrawer = () => {
-  const { onClose, closeLabel, headerId } = useContext(DrawerContext);
-  return { onClose, closeLabel, headerId };
-};
-
-// src/components/Drawer/Header.tsx
-import { cross } from "@simplybusiness/icons";
-import { jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
-var Header = ({ ref, children, ...otherProps }) => {
-  const { onClose, closeLabel, headerId } = useDrawer();
-  return /* @__PURE__ */ jsxs14("header", { ref, ...otherProps, className: "mobius-drawer__header", children: [
-    /* @__PURE__ */ jsx24("h2", { id: headerId, children }),
-    /* @__PURE__ */ jsxs14(
-      Button,
-      {
-        "aria-label": "Close",
-        variant: "basic",
-        onPress: onClose,
-        className: "mobius-drawer__close",
-        size: "sm",
-        children: [
-          /* @__PURE__ */ jsx24(Icon, { icon: cross }),
-          " ",
-          closeLabel
-        ]
-      }
-    )
-  ] });
-};
-Header.displayName = "Header";
-
-// src/components/Drawer/index.tsx
-var Drawer2 = Object.assign(Drawer, {
-  Header,
-  Content
-});
-Drawer2.displayName = "Drawer";
-
-// src/components/DropdownMenu/DropdownMenu.tsx
-import { Children as Children4, isValidElement as isValidElement2, cloneElement as cloneElement4, useState as useState14 } from "react";
-import useDropdownMenu from "react-accessible-dropdown-menu-hook";
-import classNames19 from "classnames/dedupe";
-import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
-var DropdownMenu = ({ ref, ...props }) => {
-  const {
-    elementType: Element = "nav",
-    trigger,
-    label = "Menu",
-    children,
-    ...otherProps
-  } = props;
-  const [activeId, setActiveId] = useState14(null);
-  const numberOfItems = Children4.count(children);
-  const {
-    buttonProps,
-    itemProps,
-    isOpen: open,
-    setIsOpen
-  } = useDropdownMenu(numberOfItems);
-  const classes = classNames19(
-    "mobius",
-    "mobius-dropdown-menu",
-    otherProps.className
-  );
-  const triggerClasses = classNames19("mobius", "mobius-dropdown-menu__trigger");
-  const listClasses = classNames19("mobius", "mobius-dropdown-menu__list", {
-    "--is-open": open
-  });
-  const handleChildClick = ({ onClick }, index) => {
-    setActiveId(index);
-    setIsOpen(false);
-    if (onClick) {
-      onClick();
-    }
-  };
-  return /* @__PURE__ */ jsxs15(Element, { ref, ...otherProps, className: classes, children: [
-    trigger ? cloneElement4(trigger, {
-      className: triggerClasses,
-      open,
-      label,
-      ...buttonProps
-    }) : /* @__PURE__ */ jsx25(Button, { className: triggerClasses, ...buttonProps, children: label }),
-    /* @__PURE__ */ jsx25("ul", { className: listClasses, role: "menu", children: Children4.map(children, (child, index) => {
-      if (isValidElement2(child)) {
-        return cloneElement4(child, {
-          onClick: () => handleChildClick(child.props, index),
-          active: index === activeId,
-          ...itemProps[index]
-        });
-      }
-      return child;
-    }) })
-  ] });
-};
-DropdownMenu.displayName = "DropdownMenu";
-
-// src/components/DropdownMenu/Item.tsx
-import { cloneElement as cloneElement5, isValidElement as isValidElement3, Children as Children5 } from "react";
-import classNames20 from "classnames/dedupe";
-import { jsx as jsx26 } from "react/jsx-runtime";
-var Item = ({ ref, ...props }) => {
-  const {
-    elementType: Element = "li",
-    active,
-    onClick,
-    children,
-    ...otherProps
-  } = props;
-  const classes = classNames20(
-    "mobius",
-    "mobius-dropdown-menu__item",
-    { "--is-active": active },
-    otherProps.className
-  );
-  return /* @__PURE__ */ jsx26(Element, { ref, onClick, ...otherProps, children: Children5.map(children, (child) => {
-    if (isValidElement3(child)) {
-      const childClasses = classNames20(
-        child.props.className,
-        classes
-      );
-      return cloneElement5(
-        child,
-        {
-          className: childClasses
-        }
-      );
-    }
-    return /* @__PURE__ */ jsx26("span", { className: classes, children: child });
-  }) });
-};
-Item.displayName = "DropdownMenu.Item";
-
-// src/components/DropdownMenu/index.tsx
-var DropdownMenu2 = Object.assign(
-  DropdownMenu,
-  {
-    Item
-  }
-);
-DropdownMenu2.displayName = "DropdownMenu";
-
-// src/components/Fieldset/Fieldset.tsx
-import classNames21 from "classnames/dedupe";
-import { cloneElement as cloneElement6, useId as useId6 } from "react";
-import { jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
-var useFieldset = (props) => {
-  const { legend } = props;
-  let legendProps = {};
-  let containerProps = {
-    role: "group"
-  };
-  const legendId = useId6();
-  if (legend) {
-    legendProps = {
-      ...legendProps,
-      id: legendId
-    };
-    containerProps = {
-      ...containerProps,
-      "aria-labelledby": legendId
-    };
-  }
-  return {
-    legendProps,
-    containerProps
-  };
-};
-var Fieldset = ({ ref: _ref, ...props }) => {
-  const {
-    children,
-    legend,
-    legendComponent = /* @__PURE__ */ jsx27("legend", {}),
-    ...otherProps
-  } = props;
-  const { legendProps, containerProps } = useFieldset(props);
-  const classes = classNames21("mobius", "mobius-fieldset", props.className);
-  legendProps.className = "mobius-fieldset__legend";
-  return /* @__PURE__ */ jsxs16(Flex, { ...containerProps, ...otherProps, className: classes, children: [
-    legend && cloneElement6(legendComponent, { ...legendProps }, [legend]),
-    children
-  ] });
-};
-Fieldset.displayName = "Fieldset";
-
-// src/components/Grid/Grid.tsx
-import classNames22 from "classnames/dedupe";
-import { jsx as jsx28 } from "react/jsx-runtime";
-var Grid = ({ ref: _ref, ...props }) => {
-  const {
-    columns = 12,
-    gap,
-    columnGap,
-    rowGap,
-    alignContent,
-    alignItems,
-    justifyContent,
-    justifyItems,
-    className,
-    style,
-    ...rest
-  } = props;
-  const classes = classNames22("mobius", "mobius-grid", className);
-  const styles = filterUndefinedProps({
-    boxSizing: "border-box",
-    display: "grid",
-    gridTemplateColumns: `repeat(${columns}, 1fr)`,
-    gap: getSpacingValue(gap),
-    columnGap: getSpacingValue(columnGap),
-    rowGap: getSpacingValue(rowGap),
-    alignContent,
-    alignItems,
-    justifyContent,
-    justifyItems,
-    ...style
-  });
-  return /* @__PURE__ */ jsx28("div", { style: styles, className: classes, ...rest });
-};
-Grid.displayName = "Grid";
-
-// src/components/Grid/Item.tsx
-import { useEffect as useEffect11, useState as useState15 } from "react";
-import classNames23 from "classnames/dedupe";
-import { jsx as jsx29 } from "react/jsx-runtime";
-var getBreakpointMap = (config) => Object.entries(config).reduce(
-  (prev, [key, value]) => {
-    const previous = Object.values(prev);
-    const lastDefined = previous[previous.length - 1];
-    return { ...prev, [key]: value || lastDefined };
-  },
-  {}
-);
-var DEFAULT_SPAN = 12;
-var GridItem = ({ ref: _ref, ...props }) => {
-  const {
-    breakpoint: { size: breakpointSize }
-  } = useBreakpoint();
-  const {
-    span,
-    xs = Array.isArray(span) ? DEFAULT_SPAN : span,
-    sm,
-    md,
-    lg,
-    xl,
-    xxl,
-    alignSelf,
-    justifySelf,
-    className,
-    ...rest
-  } = props;
-  const breakpointMap = getBreakpointMap({
-    xs,
-    sm,
-    md,
-    lg,
-    xl,
-    xxl
-  });
-  const [responsiveSpan, setResponsiveSpan] = useState15();
-  const classes = classNames23("mobius-grid__item", className);
-  useEffect11(() => {
-    setResponsiveSpan(breakpointMap[breakpointSize]);
-  }, [breakpointSize, breakpointMap]);
-  const styles = {
-    gridColumn: responsiveSpan ? `span ${responsiveSpan}` : void 0,
-    alignSelf,
-    justifySelf
-  };
-  return /* @__PURE__ */ jsx29("div", { style: { ...styles }, className: classes, ...rest });
-};
-GridItem.displayName = "GridItem";
-
-// src/components/Grid/index.tsx
-var Grid2 = Object.assign(Grid, {
-  Item: GridItem
-});
-Grid2.displayName = "Grid";
-
-// src/components/Image/Image.tsx
-import classNames24 from "classnames/dedupe";
-import { jsx as jsx30 } from "react/jsx-runtime";
-var Image = ({
-  ref,
-  alt,
-  elementType: Component = "img",
-  ...otherProps
-}) => {
-  const classes = classNames24("mobius", "mobius-image", otherProps.className);
-  return /* @__PURE__ */ jsx30(Component, { alt, ref, ...otherProps, className: classes });
-};
-Image.displayName = "Image";
-
-// src/components/Link/Link.tsx
-import classNames25 from "classnames/dedupe";
-import { jsx as jsx31 } from "react/jsx-runtime";
-var Link = ({ ref, ...props }) => {
-  const {
-    isDisabled = false,
-    elementType: Component = "a",
-    style,
-    className,
-    variant = "primary",
-    ...otherProps
-  } = props;
-  const disabledStyles = {
-    pointerEvents: "none"
-  };
-  const styles = { ...style, ...isDisabled && disabledStyles };
-  const classes = classNames25(
-    "mobius",
-    "mobius-link",
-    className,
-    `mobius-link--${variant}`,
-    {
-      "--is-disabled": isDisabled
-    }
-  );
-  return /* @__PURE__ */ jsx31(
-    Component,
-    {
-      ref,
-      style: styles,
-      className: classes,
-      "aria-disabled": isDisabled ? true : void 0,
-      ...otherProps,
-      children: props.children
-    }
-  );
-};
-Link.displayName = "Link";
-
-// src/components/LinkButton/LinkButton.tsx
-import classNames26 from "classnames/dedupe";
-import { jsx as jsx32 } from "react/jsx-runtime";
-function LinkButton({
-  href,
-  children,
-  className,
-  elementType = "a",
-  ...rest
-}) {
-  if (!href) {
-    throw new Error("LinkButton requires a href prop");
-  }
-  const classes = classNames26("mobius", "mobius-link-button", className);
-  return /* @__PURE__ */ jsx32(Button, { elementType, href, className: classes, ...rest, children });
-}
-
-// src/components/List/List.tsx
-import { Children as Children6, cloneElement as cloneElement7, isValidElement as isValidElement4 } from "react";
-import classNames27 from "classnames/dedupe";
-import { jsx as jsx33 } from "react/jsx-runtime";
-var List = ({ ref, ...props }) => {
-  const Component = props.isOrdered ? "ol" : "ul";
-  const { children, icon, ...otherProps } = props;
-  const { isOrdered, liststyletype, isReversed, ...restProps } = otherProps;
-  const mappedProps = {
-    ...restProps,
-    reversed: isReversed
-  };
-  const classes = classNames27(
-    "mobius",
-    "mobius-list",
-    {
-      "--has-icon": icon,
-      [`--is-${liststyletype}`]: liststyletype
-    },
-    otherProps.className
-  );
-  return /* @__PURE__ */ jsx33(Component, { ref, ...mappedProps, className: classes, children: Children6.map(children, (child) => {
-    if (isValidElement4(child)) {
-      return cloneElement7(child, {
-        parentIcon: icon
-      });
-    }
-    return child;
-  }) });
-};
-List.displayName = "List";
-
-// src/components/List/ListItem.tsx
-import classNames28 from "classnames/dedupe";
-import { jsx as jsx34, jsxs as jsxs17 } from "react/jsx-runtime";
-var ListItem = ({ ref, ...props }) => {
-  const { parentIcon, icon, children, ...otherProps } = props;
-  const iconContent = icon || parentIcon;
-  const classes = classNames28(
-    "mobius",
-    "mobius-list__item",
-    {
-      "--has-icon": iconContent
-    },
-    props.className
-  );
-  const contentClasses = classNames28("mobius", "mobius-list__item-content");
-  const iconClasses = classNames28("mobius", "mobius-list__icon");
-  if (iconContent) {
-    return /* @__PURE__ */ jsx34("li", { ref, ...otherProps, className: classes, children: /* @__PURE__ */ jsxs17("span", { className: contentClasses, children: [
-      /* @__PURE__ */ jsx34("span", { className: iconClasses, children: iconContent }),
-      children
-    ] }) });
-  }
-  return /* @__PURE__ */ jsx34("li", { ref, ...otherProps, className: classes, children });
-};
-ListItem.displayName = "ListItem";
-
-// src/components/LoadingIndicator/LoadingIndicator.tsx
-import classNames29 from "classnames/dedupe";
-import { loading as loading2 } from "@simplybusiness/icons";
-import { jsx as jsx35 } from "react/jsx-runtime";
-var LoadingIndicator = ({ ref, ...props }) => {
-  const { icon = loading2, ...otherProps } = props;
-  const classes = classNames29(
-    "mobius",
-    "mobius-loading-indicator",
-    otherProps.className
-  );
-  return /* @__PURE__ */ jsx35(Icon, { icon, spin: true, ref, ...otherProps, className: classes });
-};
-LoadingIndicator.displayName = "LoadingIndicator";
-
-// src/components/Logo/Logo.tsx
-import classNames30 from "classnames/dedupe";
-import { jsx as jsx36, jsxs as jsxs18 } from "react/jsx-runtime";
-var Logo = ({ ref, ...props }) => {
-  const { className, width, height, ...otherProps } = props;
-  const classes = classNames30("mobius", "mobius-logo", className);
-  return /* @__PURE__ */ jsxs18(
-    "svg",
-    {
-      width,
-      height,
-      ref,
-      className: classes,
-      viewBox: "0 0 144 37",
-      ...otherProps,
-      children: [
-        /* @__PURE__ */ jsx36("defs", { children: /* @__PURE__ */ jsxs18(
-          "linearGradient",
-          {
-            id: "logo-gradient",
-            x1: "83.508%",
-            x2: "11.891%",
-            y1: "76.042%",
-            y2: "26.973%",
-            children: [
-              /* @__PURE__ */ jsx36("stop", { stopColor: "#4632D8", offset: "0%" }),
-              /* @__PURE__ */ jsx36("stop", { stopColor: "#9084E8", offset: "100%" })
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsxs18("g", { children: [
-          /* @__PURE__ */ jsx36(
-            "path",
-            {
-              fill: "#0E0A2B",
-              d: "M68.788 11.307c0-2.486-2.027-3.345-3.833-4.1-1.332-.562-2.471-1.036-2.471-2.072 0-.873.77-1.42 1.968-1.42 1.051 0 1.806.444 2.294.725.193.103.474.222.755.133.192-.06.34-.207.459-.444l.34-.621c.266-.474.163-.888-.281-1.2-.533-.384-1.88-1.05-3.537-1.05-2.738 0-4.647 1.643-4.647 4.01 0 2.413 2.012 3.301 3.788 4.07 1.347.593 2.516 1.096 2.516 2.161 0 .873-.754 1.45-1.924 1.45-1.287 0-2.22-.65-2.678-.961l-.03-.015c-.533-.296-.903-.237-1.228.192l-.415.607c-.444.607-.148.992.134 1.228.828.637 2.427 1.392 4.203 1.392 2.708 0 4.587-1.673 4.587-4.085zm4.44 2.975V6.186c0-.577-.31-.888-.873-.888h-.843c-.563 0-.874.311-.874.888v8.096c0 .577.296.888.874.888h.843c.563 0 .873-.311.873-.888zM71.482 4.203h.755c.518 0 .814-.281.814-.8v-.517c0-.518-.296-.814-.814-.814h-.755c-.518 0-.8.281-.8.814v.518c.016.518.297.8.8.8zM92.645 24.48h.755c.518 0 .814-.282.814-.8v-.518c0-.518-.296-.814-.814-.814h-.755c-.518 0-.799.282-.799.814v.518c0 .518.281.8.8.8zm-6.26-19.42c-1.539 0-2.397.962-2.945 1.895-.444-1.243-1.435-1.895-2.871-1.895-1.362 0-2.146.888-2.723 1.806v-.68c0-.578-.311-.889-.873-.889h-.74c-.563 0-.873.311-.873.888v8.096c0 .577.295.888.873.888h.843c.577 0 .873-.311.873-.888V10.73c0-2.25.888-3.271 2.058-3.271 1.006 0 1.198.71 1.198 1.85v4.987c0 .578.311.888.888.888h.844c.577 0 .873-.31.873-.888v-3.551c0-2.25.873-3.271 2.013-3.271 1.036 0 1.243.74 1.243 1.85v4.987c0 .577.31.888.888.888h.814c.577 0 .888-.31.888-.888V8.835c0-2.5-1.095-3.774-3.27-3.774zm10.804 10.33c2.679 0 4.558-2.13 4.558-5.164 0-3.094-1.776-5.166-4.425-5.166-1.761 0-2.708 1.036-3.049 1.51v-.533c0-.459-.34-.755-.873-.755h-.607c-.562 0-.888.326-.888.888v11.9c0 .576.311.887.888.887h.814c.578 0 .888-.31.888-.888v-3.404c0-.207-.014-.4-.014-.532.325.429 1.184 1.258 2.708 1.258zm-2.768-5.105c0-1.362.622-2.975 2.368-2.975 1.377 0 2.309 1.184 2.309 2.945 0 1.746-.947 2.916-2.338 2.916-1.54 0-2.339-1.45-2.339-2.886zm12.965 4.07v-.652c0-.444-.252-.725-.681-.784-.34-.03-.68-.192-.68-1.066v-9.47c0-.563-.326-.888-.874-.888h-.843c-.563 0-.874.31-.874.888v9.679c0 1.258.34 2.16 1.021 2.678.637.489 1.466.533 2.013.533.607 0 .918-.325.918-.917zm9.457-9.073h-.962c-.518 0-.844.237-.977.726l-1.717 4.972c-.089.311-.192.71-.251.977-.074-.281-.193-.71-.296-1.021l-1.835-4.943c-.163-.489-.489-.71-.977-.71h-1.036c-.415 0-.622.162-.71.295-.09.134-.163.385.014.755l3.685 8.57-.34.813c-.252.592-.77 1.229-1.45 1.229-.267 0-.474-.09-.652-.163h-.014c-.43-.104-.755.074-.962.488l-.163.415c-.119.251-.148.517-.06.725.075.192.237.34.474.429.326.118.814.296 1.391.296 1.628 0 2.975-.977 3.597-2.605l3.996-10.226c.103-.296.088-.563-.045-.755-.163-.163-.4-.267-.71-.267zM67.634 28.297c.977-.592 1.54-1.658 1.54-2.886 0-2.176-1.688-3.567-4.293-3.567h-4.04c-.562 0-.873.311-.873.888v11.899c0 .577.296.888.873.888h4.1c1.346 0 2.5-.34 3.33-.962.932-.71 1.42-1.761 1.42-3.049.03-1.524-.784-2.767-2.057-3.211zm-5.017-.962v-3.212h2.25c1.02 0 1.628.592 1.628 1.584 0 .991-.607 1.643-1.57 1.643h-2.308v-.015zm4.396 4.01c0 1.155-.71 1.865-1.865 1.865h-2.53v-3.714h2.53c1.14.014 1.865.74 1.865 1.85zm12.638-5.712h-.814c-.577 0-.888.31-.888.888v3.655c0 2.176-1.361 3.182-2.634 3.182-1.006 0-1.406-.547-1.406-1.88v-4.942c0-.578-.31-.888-.888-.888h-.814c-.562 0-.888.325-.888.888v5.431c0 2.516 1.17 3.774 3.463 3.774a3.937 3.937 0 003.286-1.761v.651c0 .577.296.888.873.888h.74c.577 0 .888-.31.888-.888v-8.095c-.03-.578-.355-.903-.918-.903zm6.956 3.937c-.917-.311-1.702-.592-1.702-1.184 0-.74.77-.859 1.229-.859.784 0 1.406.281 1.805.474.548.237.947.118 1.184-.34l.193-.341c.251-.518.133-.947-.326-1.184-.326-.178-1.288-.71-2.753-.71-2.279 0-3.803 1.213-3.803 3.004 0 2.042 1.731 2.65 3.137 3.138.903.325 1.687.592 1.687 1.169 0 .547-.488.902-1.258.902-.917 0-1.613-.37-2.057-.621l-.059-.03c-.533-.28-.903-.207-1.213.222l-.222.34c-.178.252-.237.504-.178.726.044.207.192.37.4.488a5.774 5.774 0 003.285 1.007c2.235 0 3.789-1.273 3.789-3.079-.03-2.042-1.761-2.649-3.138-3.122zm6.897-3.937h-.844c-.562 0-.873.31-.873.888v8.095c0 .577.296.888.873.888h.844c.577 0 .873-.31.873-.888v-8.095c0-.563-.31-.888-.873-.888zm9.324-.237c-1.924 0-2.93 1.154-3.36 1.806v-.681c0-.577-.31-.888-.873-.888h-.74c-.563 0-.873.31-.873.888v8.095c0 .577.296.888.873.888h.843c.578 0 .874-.31.874-.888v-3.744c0-1.79 1.14-3.078 2.708-3.078 1.021 0 1.436.547 1.436 1.88v4.942c0 .577.31.888.887.888h.814c.578 0 .888-.31.888-.888v-5.431c0-2.516-1.169-3.789-3.477-3.789zm10.448 0c-2.96 0-5.032 2.131-5.032 5.165 0 2.99 2.235 5.165 5.313 5.165 1.48 0 2.635-.533 3.345-.977.444-.266.562-.695.296-1.198l-.222-.385c-.266-.459-.651-.563-1.184-.31h-.015a3.885 3.885 0 01-2.042.606c-1.54 0-2.634-.962-2.812-2.472h5.816a.935.935 0 00.933-.917c.014-2.827-1.717-4.677-4.396-4.677zm-.044 2.013c1.065 0 1.79.77 1.864 1.968h-4.1c.253-1.213 1.096-1.968 2.236-1.968zm10.152 2.16c-.917-.31-1.702-.591-1.702-1.183 0-.74.77-.859 1.229-.859.784 0 1.406.281 1.805.474.548.237.947.118 1.184-.34l.192-.341c.252-.518.134-.947-.325-1.184-.326-.178-1.288-.71-2.753-.71-2.279 0-3.803 1.213-3.803 3.004 0 2.042 1.731 2.65 3.137 3.138.903.325 1.687.592 1.687 1.169 0 .547-.488.902-1.258.902-.917 0-1.613-.37-2.057-.621l-.059-.03c-.533-.28-.903-.207-1.214.222l-.222.34c-.177.252-.236.504-.177.726.044.207.192.37.4.488a5.774 5.774 0 003.285 1.007c2.235 0 3.789-1.273 3.789-3.079-.015-2.042-1.747-2.649-3.138-3.122zm8.791 0c-.917-.31-1.702-.591-1.702-1.183 0-.74.77-.859 1.229-.859.784 0 1.406.281 1.805.474.548.237.947.118 1.184-.34l.192-.341c.252-.518.134-.947-.325-1.184-.326-.178-1.288-.71-2.753-.71-2.279 0-3.803 1.213-3.803 3.004 0 2.042 1.731 2.65 3.137 3.138.903.325 1.687.592 1.687 1.169 0 .547-.488.902-1.258.902-.917 0-1.613-.37-2.057-.621l-.059-.03c-.533-.28-.903-.207-1.214.222l-.222.34c-.177.252-.236.504-.177.726.044.207.192.37.4.488a5.774 5.774 0 003.285 1.007c2.235 0 3.789-1.273 3.789-3.079-.015-2.042-1.747-2.649-3.138-3.122z"
-            }
-          ),
-          /* @__PURE__ */ jsx36(
-            "path",
-            {
-              fill: "url(#logo-gradient)",
-              d: "M22.747 22.288c.607 1.214.918 2.59.918 4.144 0 1.45-.267 2.827-.8 4.1a10.018 10.018 0 01-2.279 3.36c-.991.961-2.235 1.73-3.744 2.278-1.51.563-3.167.829-4.988.829-2.264 0-4.35-.385-6.29-1.14-1.938-.77-3.492-1.598-4.676-2.5-.31-.252-.548-.504-.696-.77a1.332 1.332 0 01-.177-.71.718.718 0 010-.252c.03-.37.207-.785.547-1.199l1.14-1.598c.4-.548.829-.844 1.288-.918a.896.896 0 01.222-.03c.4 0 .873.163 1.39.474 2.487 1.776 4.914 2.679 7.252 2.679 1.643 0 2.96-.385 3.922-1.14.962-.755 1.45-1.746 1.45-2.96 0-.725-.192-1.39-.562-1.983a5.347 5.347 0 00-1.539-1.569 18.207 18.207 0 00-2.235-1.287 56.102 56.102 0 00-2.649-1.214c-.917-.4-1.835-.814-2.752-1.258a19.282 19.282 0 01-2.62-1.539 14.014 14.014 0 01-2.22-1.924c-.666-.695-1.169-1.539-1.554-2.545-.37-.992-.562-2.087-.562-3.271 0-2.042.533-3.863 1.598-5.446 1.066-1.584 2.516-2.797 4.336-3.641C8.303.414 10.345 0 12.624 0c1.91 0 3.685.281 5.358.844 1.657.562 2.96 1.198 3.892 1.88.68.473 1.006 1.035 1.006 1.671 0 .385-.118.785-.37 1.2l-.917 1.657c-.385.74-.903 1.11-1.554 1.11-.4 0-.83-.133-1.318-.4a42.421 42.421 0 00-1.687-.947c-.473-.237-1.14-.488-1.998-.71a9.458 9.458 0 00-2.56-.356c-1.672 0-3.004.37-3.981 1.11-.992.74-1.48 1.717-1.48 2.946 0 .902.31 1.701.932 2.412.622.695 1.421 1.302 2.398 1.79.977.489 2.057.977 3.256 1.466a54.048 54.048 0 013.552 1.628 20.795 20.795 0 013.24 2.042c.948.755 1.732 1.732 2.354 2.945zm31.257 2.945c0 3.197-1.155 6.083-3.256 8.14-2.265 2.205-5.506 3.36-9.368 3.36H30.71c-2.443 0-4.278-1.836-4.278-4.278V4.53c0-1.2.43-2.28 1.214-3.064C28.43.681 29.51.252 30.709.252h9.013c3.419 0 6.32 1.095 8.377 3.182 1.909 1.923 2.945 4.558 2.945 7.429 0 2.294-.622 4.203-1.91 5.816 1.377.77 2.487 1.776 3.286 2.99 1.066 1.583 1.584 3.448 1.584 5.564zm-12.106-7.68c.044-.03 4.913-3.02 4.913-6.675 0-1.761-.607-3.345-1.717-4.455-1.568-1.584-3.788-1.924-5.372-1.924H30.68v28h10.7c2.738 0 4.958-.754 6.408-2.16 1.273-1.243 1.983-3.049 1.983-5.106 0-1.272-.296-2.353-.858-3.196v-.03c-1.362-2.353-6.838-3.774-6.897-3.789l-.844-.222.726-.444z"
-            }
-          ),
-          /* @__PURE__ */ jsx36(
-            "path",
-            {
-              fill: "#0E0A2B",
-              d: "M138.199 25.455c0-.4.074-.784.222-1.14.148-.354.355-.665.606-.932.267-.266.563-.473.903-.621.34-.148.725-.222 1.11-.222.4 0 .784.074 1.125.222.355.148.666.355.917.621.267.267.474.578.622.933.148.355.222.74.222 1.14 0 .399-.074.784-.222 1.139a2.86 2.86 0 01-.622.932 3.087 3.087 0 01-.917.637 2.646 2.646 0 01-1.125.236c-.4 0-.77-.074-1.11-.236a2.777 2.777 0 01-.903-.637 2.821 2.821 0 01-.606-.932 2.898 2.898 0 01-.222-1.14zm.71 0c0 .326.06.622.163.903.103.281.266.518.459.725a2.051 2.051 0 001.524.666c.31 0 .592-.059.858-.177a2.175 2.175 0 001.155-1.214c.118-.281.162-.577.162-.903 0-.325-.059-.621-.162-.902a2.422 2.422 0 00-.46-.726 2.112 2.112 0 00-.695-.488 2.073 2.073 0 00-.858-.178c-.31 0-.592.06-.844.178a2.051 2.051 0 00-.68.488 2.45 2.45 0 00-.46.726 2.636 2.636 0 00-.162.902zm1.154-1.14c0-.221.119-.34.34-.34h.889c.296 0 .532.09.695.252.178.163.267.4.267.68a.623.623 0 01-.06.297.557.557 0 01-.133.222.512.512 0 01-.163.148c-.059.044-.118.059-.162.074v.014l.03.03c.014.015.014.03.029.06l.044.088.34.666c.06.118.075.207.045.281-.03.074-.104.104-.207.104h-.104c-.192 0-.31-.089-.385-.252l-.384-.829h-.4v.74c0 .222-.104.34-.31.34h-.06c-.207 0-.31-.118-.31-.34v-2.234zm1.051 1.037c.133 0 .252-.045.31-.119.075-.074.104-.192.104-.325s-.03-.252-.103-.326a.413.413 0 00-.296-.118h-.385v.873h.37v.015z"
-            }
-          )
-        ] })
-      ]
-    }
-  );
-};
-Logo.displayName = "Logo";
-
-// src/components/Modal/Content.tsx
-import { jsx as jsx37 } from "react/jsx-runtime";
-var Content2 = ({ ref, children, ...otherProps }) => /* @__PURE__ */ jsx37("div", { ref, ...otherProps, className: "mobius-modal__content", children });
-Content2.displayName = "Content";
-
-// src/components/Modal/Header.tsx
-import { cross as cross2 } from "@simplybusiness/icons";
-
-// src/components/Modal/useModal.ts
-import { useContext as useContext2 } from "react";
-
-// src/components/Modal/ModalContext.tsx
-import { createContext as createContext2 } from "react";
-var ModalContext = createContext2({
-  onClose: () => {
-  },
-  closeLabel: void 0
-});
-
-// src/components/Modal/useModal.ts
-var useModal = () => {
-  const { onClose, closeLabel } = useContext2(ModalContext);
-  return { onClose, closeLabel };
-};
-
-// src/components/Modal/Header.tsx
-import { jsx as jsx38, jsxs as jsxs19 } from "react/jsx-runtime";
-var Header2 = ({ ref, children, ...otherProps }) => {
-  const { onClose, closeLabel } = useModal();
-  return /* @__PURE__ */ jsxs19("header", { ref, ...otherProps, className: "mobius-modal__header", children: [
-    children,
-    /* @__PURE__ */ jsxs19(
-      Button,
-      {
-        "aria-label": "Close",
-        variant: "basic",
-        onPress: onClose,
-        className: "mobius-modal__close",
-        children: [
-          /* @__PURE__ */ jsx38(Icon, { icon: cross2 }),
-          " ",
-          closeLabel
-        ]
-      }
-    )
-  ] });
-};
-Header2.displayName = "Header";
-
-// src/components/Modal/Modal.tsx
-import classNames31 from "classnames/dedupe";
-import { useEffect as useEffect12, useMemo as useMemo3, useRef as useRef8, useState as useState16 } from "react";
-import { jsx as jsx39 } from "react/jsx-runtime";
-var TRANSITION_CSS_VARIABLE2 = "--modal-transition-duration";
-var Modal = ({ ref, ...props }) => {
-  const {
-    isOpen,
-    onClose,
-    onOpen,
-    children,
-    className,
-    closeLabel,
-    isFullScreen,
-    animation,
-    ...rest
-  } = props;
-  const [shouldTransition, setShouldTransition] = useState16(false);
-  useEffect12(() => {
-    setShouldTransition(supportsDialog());
-  }, []);
-  const dialogRef = useRef8(null);
-  const { close } = useDialog({
-    ref: dialogRef,
-    isOpen,
-    onOpen,
-    onClose,
-    transition: {
-      isEnabled: !!animation,
-      CSSVariable: TRANSITION_CSS_VARIABLE2
-    }
-  });
-  const modalClasses = classNames31(
-    "mobius",
-    "mobius-modal",
-    {
-      "--no-dialog-support": !shouldTransition,
-      // This class is used to correctly position modal in x/y middle on iOS <= 15.2
-      "--should-transition": shouldTransition && animation,
-      "--slide-up": animation === "slideUp",
-      "--fade": animation === "fade",
-      "--is-fullscreen": isFullScreen
-    },
-    className
-  );
-  const contextValue = useMemo3(
-    () => ({
-      onClose: close,
-      closeLabel
-    }),
-    [close, closeLabel]
-  );
-  return /* @__PURE__ */ jsx39(
-    "dialog",
-    {
-      ref: mergeRefs([dialogRef, ref]),
-      onCancel: close,
-      className: modalClasses,
-      ...rest,
-      children: /* @__PURE__ */ jsx39(ModalContext.Provider, { value: contextValue, children })
-    }
-  );
-};
-Modal.displayName = "Modal";
-
-// src/components/Modal/index.tsx
-var Modal2 = Object.assign(Modal, {
-  Header: Header2,
-  Content: Content2
-});
-Modal2.displayName = "Modal";
-
-// src/components/NumberField/NumberField.tsx
-import classNames32 from "classnames/dedupe";
-import { useCallback as useCallback5, useEffect as useEffect13, useRef as useRef9 } from "react";
-import { jsx as jsx40 } from "react/jsx-runtime";
-var NumberField = ({ ref, ...props }) => {
-  const {
-    minValue,
-    maxValue,
-    step,
-    defaultValue,
-    hideSpinButtons,
-    className,
-    ...otherProps
-  } = props;
-  const {
-    onFocus: customOnFocus,
-    onBlur: customOnBlur,
-    ...rest
-  } = otherProps;
-  const focusedInputRef = useRef9(null);
-  const wheelHandler = useCallback5((ev) => ev.preventDefault(), []);
-  useEffect13(() => {
-    return () => {
-      focusedInputRef.current?.removeEventListener("wheel", wheelHandler);
-      focusedInputRef.current = null;
-    };
-  }, [wheelHandler]);
-  const containerClasses = classNames32("mobius-number-field", className, {
-    "--hide-spin-buttons": hideSpinButtons
-  });
-  const handleBeforeInput = (event) => {
-    const { data } = event.nativeEvent;
-    if (step && Number.isInteger(step) && data === ".") {
-      event.preventDefault();
-    }
-    if (minValue && minValue >= 0 && data === "-") {
-      event.preventDefault();
-    }
-  };
-  const handleBlur = (event) => {
-    const { value } = event.target;
-    const numValue = parseFloat(value);
-    if (step && step > 1 && !isNaN(numValue)) {
-      const baseValue = minValue ?? 0;
-      const steps = Math.round((numValue - baseValue) / step);
-      const snappedValue = baseValue + steps * step;
-      if (snappedValue !== numValue) {
-        event.target.value = snappedValue.toString();
-        const changeEvent = new Event("change", { bubbles: true });
-        event.target.dispatchEvent(changeEvent);
-        const syntheticChangeEvent = {
-          ...event,
-          target: event.target,
-          currentTarget: event.currentTarget
-        };
-        otherProps.onChange?.(syntheticChangeEvent);
-      }
-    }
-    customOnBlur?.(event);
-  };
-  const forwardedProps = {
-    ...rest,
-    onFocus: (e) => {
-      const el = e.currentTarget;
-      focusedInputRef.current?.removeEventListener("wheel", wheelHandler);
-      focusedInputRef.current = el;
-      el.addEventListener("wheel", wheelHandler, { passive: false });
-      customOnFocus?.(e);
-    },
-    onBlur: (e) => handleBlur(e)
-  };
-  return /* @__PURE__ */ jsx40(
-    TextField,
-    {
-      ...forwardedProps,
-      className: containerClasses,
-      onBeforeInput: handleBeforeInput,
-      type: "number",
-      min: minValue ?? void 0,
-      max: maxValue ?? void 0,
-      step,
-      ref,
-      defaultValue: defaultValue != null ? defaultValue?.toString() : defaultValue
-    }
-  );
-};
-NumberField.displayName = "NumberField";
-
-// src/components/Option/Option.tsx
-import { jsx as jsx41 } from "react/jsx-runtime";
-var Option2 = ({ ref, ...props }) => {
-  const { isDisabled, ...rest } = props;
-  const mappedProps = {
-    ...rest,
-    disabled: isDisabled
-  };
-  return /* @__PURE__ */ jsx41("option", { ...mappedProps, ref });
-};
-Option2.displayName = "Option";
-
-// src/components/PasswordField/PasswordField.tsx
-import classNames33 from "classnames/dedupe";
-import { useRef as useRef10, useState as useState17 } from "react";
-
-// src/components/PasswordField/ShowHideButton.tsx
-import { eye, eyeSlash } from "@simplybusiness/icons";
-import { jsx as jsx42 } from "react/jsx-runtime";
-var ShowHideButton = ({
-  show = false,
-  onClick
-}) => /* @__PURE__ */ jsx42(
-  "button",
-  {
-    className: "mobius-password-field__show-button",
-    type: "button",
-    onClick: (e) => {
-      e.preventDefault();
-      onClick();
-    },
-    "aria-label": `${show ? "Hide" : "Show"} password`,
-    "data-testid": "show-hide-button",
-    children: /* @__PURE__ */ jsx42(Icon, { icon: show ? eyeSlash : eye, "aria-hidden": "true" })
-  }
-);
-
-// src/components/PasswordField/PasswordField.tsx
-import { jsx as jsx43 } from "react/jsx-runtime";
-var PasswordField = ({
-  ref,
-  className,
-  ...props
-}) => {
-  const [show, setShow] = useState17(false);
-  const type = show ? "text" : "password";
-  const classes = classNames33("mobius-password-field", className);
-  const localRef = useRef10(null);
-  const handleShowHideButtonClick = () => {
-    const selectionStart = localRef.current?.selectionStart;
-    const selectionEnd = localRef.current?.selectionEnd;
-    setShow((oldShow) => !oldShow);
-    requestAnimationFrame(() => {
-      localRef.current?.focus();
-      if (selectionStart != null && selectionEnd != null) {
-        localRef.current?.setSelectionRange(selectionStart, selectionEnd);
-      }
-    });
-  };
-  return /* @__PURE__ */ jsx43(
-    TextField,
-    {
-      ref: mergeRefs([localRef, ref]),
-      className: classes,
-      ...props,
-      type,
-      suffixInside: /* @__PURE__ */ jsx43(ShowHideButton, { onClick: handleShowHideButtonClick, show })
-    }
-  );
-};
-PasswordField.displayName = "PasswordField";
-
-// src/components/Popover/Popover.tsx
-import {
-  FloatingArrow,
-  arrow,
-  autoUpdate,
-  flip,
-  offset,
-  shift,
-  useDismiss,
-  useFloating,
-  useInteractions
-} from "@floating-ui/react";
-import { cross as cross3 } from "@simplybusiness/icons";
-import classNames34 from "classnames/dedupe";
-import { cloneElement as cloneElement8, useRef as useRef11, useState as useState18 } from "react";
-import { useWindowEvent as useWindowEvent2 } from "@simplybusiness/mobius-hooks";
-import { Fragment as Fragment4, jsx as jsx44, jsxs as jsxs20 } from "react/jsx-runtime";
-var OFFSET_FROM_CONTENT_DEFAULT = 10;
-var Popover = (props) => {
-  const { trigger, children, onOpen, onClose, className } = props;
-  const arrowRef = useRef11(null);
-  const [isOpen, setIsOpen] = useState18(false);
-  const { refs, floatingStyles, context } = useFloating({
-    open: isOpen,
-    onOpenChange: setIsOpen,
-    whileElementsMounted: autoUpdate,
-    middleware: [
-      arrow({
-        element: arrowRef
-      }),
-      offset(OFFSET_FROM_CONTENT_DEFAULT),
-      shift(),
-      flip()
-    ]
-  });
-  const dismiss = useDismiss(context, {
-    bubbles: true,
-    outsidePress: (event) => {
-      const toggle = refs.reference.current;
-      const isToggleClick = !toggle?.contains(event.target);
-      if (isToggleClick) {
-        onClose?.();
-      }
-      return true;
-    }
-  });
-  const { getReferenceProps, getFloatingProps } = useInteractions([dismiss]);
-  const containerClasses = classNames34(
-    "mobius",
-    "mobius-popover__container",
-    className
-  );
-  const toggleVisibility = () => {
-    if (isOpen) {
-      setIsOpen(false);
-      onClose?.();
-      return;
-    }
-    setIsOpen(true);
-    onOpen?.();
-  };
-  const triggerComponent = cloneElement8(trigger, {
-    ref: refs.setReference,
-    className: classNames34(
-      trigger.props.className,
-      "mobius-popover__toggle"
-    ),
-    onClick: toggleVisibility,
-    ...getReferenceProps()
-  });
-  useWindowEvent2("keydown", (e) => {
-    if (e.key === "Escape") {
-      onClose?.();
-      e.preventDefault();
-      e.stopPropagation();
-    }
-  });
-  return /* @__PURE__ */ jsxs20(Fragment4, { children: [
-    triggerComponent,
-    isOpen && /* @__PURE__ */ jsxs20(
-      "div",
-      {
-        className: containerClasses,
-        ref: refs.setFloating,
-        style: floatingStyles,
-        ...getFloatingProps(),
-        children: [
-          /* @__PURE__ */ jsxs20("div", { className: "mobius-popover", children: [
-            /* @__PURE__ */ jsx44("header", { className: "mobius-popover__header", children: /* @__PURE__ */ jsx44(
-              Button,
-              {
-                type: "button",
-                className: "mobius-popover__close-button",
-                onClick: toggleVisibility,
-                "aria-label": "Close",
-                variant: "ghost",
-                children: /* @__PURE__ */ jsx44(
-                  Icon,
-                  {
-                    icon: cross3,
-                    size: "md",
-                    className: "mobius-popover__close-icon"
-                  }
-                )
-              }
-            ) }),
-            /* @__PURE__ */ jsx44("div", { className: "mobius-popover__body", children })
-          ] }),
-          /* @__PURE__ */ jsx44(
-            FloatingArrow,
-            {
-              ref: arrowRef,
-              context,
-              width: 20,
-              className: "mobius-popover__arrow-icon"
-            }
-          )
-        ]
-      }
-    )
-  ] });
-};
-
-// src/components/Progress/Progress.tsx
-import classNames35 from "classnames/dedupe";
-import { useId as useId7 } from "react";
-import { jsx as jsx45, jsxs as jsxs21 } from "react/jsx-runtime";
-function warnAboutInvalidValues(value, minValue, maxValue) {
-  if (minValue > maxValue) {
-    console.warn("minValue is greater than maxValue");
-  }
-  if (value < minValue) {
-    console.warn("Progress value is less than minValue");
-  }
-  if (value > maxValue) {
-    console.warn("Progress value is greater than maxValue");
-  }
-}
-var sanitizedValue = (value, defaultValue) => {
-  if (value === void 0 || Number.isNaN(value)) {
-    return defaultValue;
-  }
-  return value;
-};
-var getLabelComponent = (label, progressLabelId, showLabel) => {
-  if (showLabel) {
-    return /* @__PURE__ */ jsx45(
-      Label,
-      {
-        id: progressLabelId,
-        className: "mobius-progress__label",
-        elementType: "span",
-        children: label
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx45(VisuallyHidden, { children: /* @__PURE__ */ jsx45(
-    Label,
-    {
-      id: progressLabelId,
-      className: "mobius-progress__label",
-      elementType: "span",
-      children: label
-    }
-  ) });
-};
-var DEFAULT_VALUE = 0;
-var DEFAULT_MIN_VALUE = 0;
-var DEFAULT_MAX_VALUE = 100;
-var Progress = ({ ref, ...props }) => {
-  const progressId = useId7();
-  const progressLabelId = useId7();
-  const {
-    id,
-    label,
-    showLabel = true,
-    showValueLabel = !!label,
-    valueFormatter,
-    variant = "primary",
-    className
-  } = props;
-  let { value, minValue, maxValue } = props;
-  value = sanitizedValue(value, DEFAULT_VALUE);
-  minValue = sanitizedValue(minValue, DEFAULT_MIN_VALUE);
-  maxValue = sanitizedValue(maxValue, DEFAULT_MAX_VALUE);
-  if (value === void 0 || minValue === void 0 || maxValue === void 0) {
-    return null;
-  }
-  warnAboutInvalidValues(value, minValue, maxValue);
-  const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
-  const percentage = clamp(
-    Math.round((value - minValue) / (maxValue - minValue) * 100),
-    0,
-    100
-  );
-  const barWidth = `${percentage}%`;
-  const classes = classNames35("mobius", "mobius-progress", className, {
-    "--is-primary": variant === "primary",
-    "--is-secondary": variant === "secondary"
-  });
-  const progressBarProps = {};
-  progressBarProps["aria-valuemin"] = minValue.toString();
-  progressBarProps["aria-valuemax"] = maxValue.toString();
-  progressBarProps["aria-valuenow"] = value.toString();
-  progressBarProps["aria-valuetext"] = valueFormatter instanceof Function ? valueFormatter(value, minValue, maxValue) : barWidth;
-  const labelComponent = getLabelComponent(label, progressLabelId, showLabel);
-  return /* @__PURE__ */ jsxs21(
-    "div",
-    {
-      id: id || progressId,
-      ...progressBarProps,
-      ref,
-      className: classes,
-      role: "progressbar",
-      "aria-labelledby": progressLabelId,
-      children: [
-        labelComponent,
-        /* @__PURE__ */ jsx45("div", { className: "mobius-progress__track", children: /* @__PURE__ */ jsx45("div", { className: "mobius-progress__bar", style: { width: barWidth } }) }),
-        showValueLabel && /* @__PURE__ */ jsx45(Label, { "data-testid": "value-label", elementType: "span", children: progressBarProps["aria-valuetext"] })
-      ]
-    }
-  );
-};
-Progress.displayName = "Progress";
-
-// src/components/Radio/Radio.tsx
-import classNames36 from "classnames/dedupe";
-import {
-  Children as Children7,
-  isValidElement as isValidElement5,
-  useLayoutEffect,
-  useMemo as useMemo4,
-  useRef as useRef12
-} from "react";
-import { Fragment as Fragment5, jsx as jsx46, jsxs as jsxs22 } from "react/jsx-runtime";
-var Radio = ({ ref, ...props }) => {
-  const {
-    children,
-    value,
-    label,
-    className,
-    isDisabled,
-    errorMessage,
-    onChange,
-    defaultChecked,
-    groupDisabled,
-    name,
-    selected,
-    setSelected,
-    isRequired,
-    onOverflow,
-    orientation,
-    ...otherProps
-  } = props;
-  const realDisabled = groupDisabled || isDisabled;
-  const isMultiline = label && children;
-  const isControlled = selected !== void 0;
-  const isChecked = isControlled ? selected === value : defaultChecked;
-  const contentRef = useRef12(null);
-  const prevOverflowRef = useRef12({
-    vertical: false,
-    horizontal: false
-  });
-  const hasIconFirst = useMemo4(() => {
-    if (!children || Children7.count(children) === 0) return false;
-    const firstChild = Children7.toArray(children)[0];
-    if (!isValidElement5(firstChild)) return false;
-    const props2 = firstChild.props;
-    return "icon" in props2 && props2.icon !== void 0;
-  }, [children]);
-  useLayoutEffect(() => {
-    if (!contentRef.current || !onOverflow) return;
-    if (orientation === "vertical") {
-      return;
-    }
-    const element = contentRef.current;
-    const scrollOverflowVertical = element.scrollHeight > element.clientHeight;
-    const scrollOverflowHorizontal = element.scrollWidth > element.clientWidth;
-    const styles = window.getComputedStyle(element);
-    const lineHeight = parseFloat(styles.lineHeight);
-    const fontSize = parseFloat(styles.fontSize);
-    const singleLineHeight = isNaN(lineHeight) ? fontSize * 1.2 : lineHeight;
-    const WRAP_DETECTION_TOLERANCE = 1.1;
-    const hasWrapped = element.clientHeight > singleLineHeight * WRAP_DETECTION_TOLERANCE;
-    const vertical = scrollOverflowVertical || hasWrapped;
-    const horizontal = scrollOverflowHorizontal;
-    const newOverflowState = { vertical, horizontal };
-    const prevOverflow = prevOverflowRef.current;
-    if (newOverflowState.vertical !== prevOverflow.vertical || newOverflowState.horizontal !== prevOverflow.horizontal) {
-      prevOverflowRef.current = newOverflowState;
-      onOverflow(newOverflowState);
-    }
-  }, [label, children, onOverflow, orientation]);
-  const radioClasses = {
-    "--is-disabled": realDisabled,
-    "--is-selected": selected === value,
-    "--is-multiline": !!isMultiline,
-    "--is-required": isRequired
-  };
-  const containerClasses = classNames36(
-    "mobius-radio__label",
-    radioClasses,
-    className,
-    { "--has-icon-first": hasIconFirst }
-  );
-  const inputClasses = classNames36("mobius-radio__input", radioClasses);
-  const { "aria-describedby": _ariaDescribedBy, ...rest } = otherProps;
-  const handleChange = (event) => {
-    if (setSelected) {
-      setSelected(event.target.value);
-    }
-    if (onChange) {
-      const adaptedEvent = {
-        ...event.nativeEvent,
-        target: event.target
-      };
-      onChange(adaptedEvent);
-    }
-  };
-  return /* @__PURE__ */ jsxs22(Fragment5, { children: [
-    /* @__PURE__ */ jsxs22(Label, { className: containerClasses, children: [
-      /* @__PURE__ */ jsx46(
-        "input",
-        {
-          "aria-describedby": otherProps["aria-describedby"],
-          disabled: realDisabled,
-          ref,
-          className: inputClasses,
-          value,
-          tabIndex: 0,
-          type: "radio",
-          onChange: handleChange,
-          ...isControlled ? { checked: isChecked } : { defaultChecked: isChecked },
-          name,
-          required: isRequired,
-          ...rest
-        }
-      ),
-      isMultiline ? /* @__PURE__ */ jsxs22("div", { ref: contentRef, className: "mobius-radio__content--multiline", children: [
-        /* @__PURE__ */ jsx46("div", { className: "mobius-radio__content-first-line", children: label }),
-        /* @__PURE__ */ jsx46("div", { className: "mobius-radio__extra-content", children })
-      ] }) : /* @__PURE__ */ jsx46("div", { ref: contentRef, className: "mobius-radio__content", children: label || children })
-    ] }),
-    errorMessage && /* @__PURE__ */ jsx46(ErrorMessage, { errorMessage })
-  ] });
-};
-Radio.displayName = "Radio";
-
-// src/components/Radio/RadioGroup.tsx
-import classNames37 from "classnames/dedupe";
-import {
-  Children as Children8,
-  cloneElement as cloneElement9,
-  isValidElement as isValidElement6,
-  useCallback as useCallback6,
-  useEffect as useEffect14,
-  useId as useId8,
-  useRef as useRef13,
-  useState as useState19
-} from "react";
-import { jsx as jsx47, jsxs as jsxs23 } from "react/jsx-runtime";
-var getDefaultVal = (children, defaultValue) => {
-  if (Array.isArray(children) && defaultValue) {
-    const option = children?.find((item) => item.props.value === defaultValue);
-    if (!option) return "";
-    return option.props.value;
-  }
-  return "";
-};
-var RadioGroup = ({ ref, ...props }) => {
-  const {
-    label,
-    isDisabled = false,
-    isRequired,
-    isInvalid,
-    orientation = "vertical",
-    className,
-    errorMessage,
-    children,
-    defaultValue,
-    value,
-    isReadOnly,
-    name,
-    onChange,
-    autoStack = false,
-    ...rest
-  } = props;
-  const defaultSelected = getDefaultVal(children, value || defaultValue);
-  const [selected, setSelected] = useState19(defaultSelected);
-  const overflowsRef = useRef13({});
-  const [hasOverflow, setHasOverflow] = useState19(false);
-  useEffect14(() => {
-    if (value !== void 0) {
-      setSelected(value);
-    }
-  }, [value]);
-  const handleOverflow = useCallback6(
-    (radioValue, overflow) => {
-      overflowsRef.current = {
-        ...overflowsRef.current,
-        [radioValue]: overflow
-      };
-      const anyOverflow = Object.values(overflowsRef.current).some(
-        (o) => o.vertical || o.horizontal
-      );
-      if (anyOverflow !== hasOverflow) {
-        setHasOverflow(anyOverflow);
-      }
-    },
-    [hasOverflow]
-  );
-  const effectiveOrientation = autoStack && orientation === "horizontal" && hasOverflow ? "vertical" : orientation;
-  const validationClasses = useValidationClasses({ isInvalid });
-  const radioClasses = {
-    "--is-disabled": isDisabled,
-    "--is-required": typeof isRequired === "boolean" && isRequired,
-    "--is-optional": typeof isRequired === "boolean" && !isRequired,
-    [`--is-${effectiveOrientation}`]: true,
-    [className || ""]: true
-  };
-  const radioGroupClasses = classNames37(
-    "mobius",
-    "mobius-radio-group",
-    radioClasses,
-    validationClasses
-  );
-  const radioWrapperClasses = classNames37("mobius-radio__wrapper", {
-    [`--is-${effectiveOrientation}`]: true
-  });
-  const labelClasses = classNames37(radioClasses, validationClasses);
-  const errorMessageId = useId8();
-  const defaultNameAttrId = useId8();
-  const nameAttribute = name || defaultNameAttrId;
-  const shouldErrorMessageShow = errorMessage ? errorMessageId : void 0;
-  const describedBy = spaceDelimitedList([
-    shouldErrorMessageShow,
-    props["aria-describedby"]
-  ]);
-  const labelId = useId8();
-  return /* @__PURE__ */ jsx47(
-    "div",
-    {
-      ...rest,
-      "aria-describedby": describedBy,
-      "aria-disabled": isDisabled,
-      "aria-errormessage": shouldErrorMessageShow,
-      "aria-invalid": isInvalid,
-      "aria-label": props["aria-label"],
-      "aria-labelledby": props["aria-labelledby"] || labelId,
-      "aria-orientation": effectiveOrientation,
-      "aria-readonly": isReadOnly,
-      "aria-required": isRequired,
-      ref,
-      className: radioGroupClasses,
-      role: "radiogroup",
-      children: /* @__PURE__ */ jsxs23(Stack, { gap: "xs", children: [
-        label && /* @__PURE__ */ jsx47(Label, { htmlFor: name, id: labelId, className: labelClasses, children: label }),
-        /* @__PURE__ */ jsx47("div", { className: radioWrapperClasses, children: Children8.map(children, (child) => {
-          if (isValidElement6(child)) {
-            const childValue = child.props.value;
-            return cloneElement9(
-              child,
-              {
-                orientation: effectiveOrientation,
-                groupDisabled: isDisabled,
-                name: nameAttribute,
-                selected: selected || defaultSelected,
-                // in case state does not update
-                setSelected,
-                isRequired,
-                "aria-describedby": describedBy,
-                onChange,
-                onOverflow: childValue ? (overflow) => handleOverflow(childValue, overflow) : void 0
-              }
-            );
-          }
-          return child;
-        }) }),
-        /* @__PURE__ */ jsx47(ErrorMessage, { id: errorMessageId, errorMessage })
-      ] })
-    }
-  );
-};
-RadioGroup.displayName = "RadioGroup";
-
-// src/components/Segment/SegmentGroup.tsx
-import classNames38 from "classnames/dedupe";
-import { jsx as jsx48 } from "react/jsx-runtime";
-var SegmentGroup = (props) => {
-  const { children, horizontal, gap, className, ...rest } = props;
-  const gapClass = gap ? `gap-${gap}` : "";
-  const classes = classNames38(
-    "mobius",
-    "mobius-segment-group",
-    className,
-    { "--is-horizontal": horizontal },
-    gapClass
-  );
-  return /* @__PURE__ */ jsx48("div", { className: classes, ...rest, children });
-};
-SegmentGroup.displayName = "SegmentGroup";
-
-// src/components/Segment/Segment.tsx
-import classNames39 from "classnames/dedupe";
-import { jsx as jsx49, jsxs as jsxs24 } from "react/jsx-runtime";
-var Segment = (props) => {
-  const { heading, children, colour, inverted, className, ...rest } = props;
-  const classes = classNames39(
-    "mobius",
-    "mobius-segment",
-    colour,
-    { inverted },
-    className
-  );
-  return /* @__PURE__ */ jsxs24("div", { className: classes, ...rest, children: [
-    heading && /* @__PURE__ */ jsx49("div", { className: "mobius-segment__heading", children: heading }),
-    children
-  ] });
-};
-Segment.displayName = "Segment";
-
-// src/components/Select/Select.tsx
-import { chevronDown as chevronDown2 } from "@simplybusiness/icons";
-import classNames40 from "classnames/dedupe";
-import { useId as useId9 } from "react";
-import { jsx as jsx50, jsxs as jsxs25 } from "react/jsx-runtime";
-var Select = ({ ref, ...props }) => {
-  const {
-    label,
-    onChange,
-    isInvalid,
-    errorMessage,
-    isDisabled = false,
-    isRequired,
-    ...otherProps
-  } = props;
-  const { labelProps, fieldProps } = useLabel({
-    label,
-    ...otherProps
-  });
-  const validationClasses = useValidationClasses({ isInvalid });
-  const stateClasses = {
-    "--is-disabled": isDisabled,
-    "--is-required": typeof isRequired === "boolean" && isRequired,
-    "--is-optional": typeof isRequired === "boolean" && !isRequired
-  };
-  const sharedClasses = classNames40(validationClasses, stateClasses);
-  const wrapperClasses = classNames40(
-    "mobius-select__wrapper",
-    sharedClasses,
-    otherProps.className
-  );
-  const selectClasses = classNames40(
-    "mobius-select",
-    sharedClasses,
-    otherProps.className
-  );
-  const labelClasses = classNames40(
-    "mobius-label",
-    sharedClasses,
-    otherProps.className
-  );
-  const iconClasses = classNames40("mobius-select__icon", sharedClasses);
-  const errorMessageId = useId9();
-  const shouldErrorMessageShow = errorMessage ? errorMessageId : void 0;
-  const describedBy = spaceDelimitedList([
-    shouldErrorMessageShow,
-    props["aria-describedby"]
-  ]);
-  const handleChange = (e) => {
-    if (onChange) {
-      onChange(e);
-    }
-  };
-  return /* @__PURE__ */ jsxs25(Stack, { className: "mobius mobius-select__outer", gap: "xs", children: [
-    label && /* @__PURE__ */ jsx50(Label, { ...labelProps, className: labelClasses, children: label }),
-    /* @__PURE__ */ jsxs25("div", { className: wrapperClasses, children: [
-      /* @__PURE__ */ jsx50(
-        "select",
-        {
-          ...otherProps,
-          ...fieldProps,
-          ref,
-          multiple: false,
-          className: selectClasses,
-          disabled: isDisabled,
-          "aria-invalid": !!errorMessage,
-          "aria-describedby": describedBy,
-          "aria-required": isRequired,
-          required: isRequired,
-          onChange: handleChange
-        }
-      ),
-      /* @__PURE__ */ jsx50("span", { className: iconClasses, children: /* @__PURE__ */ jsx50(Icon, { icon: chevronDown2 }) })
-    ] }),
-    errorMessage && /* @__PURE__ */ jsx50(ErrorMessage, { id: errorMessageId, errorMessage })
-  ] });
-};
-Select.displayName = "Select";
-
-// src/components/Slider/Slider.tsx
-import classNames41 from "classnames/dedupe";
-import { useRef as useRef14, useState as useState20 } from "react";
-
-// src/components/Slider/helpers.ts
-import { useCallback as useCallback7, useMemo as useMemo5 } from "react";
-function numberFormatter(value, formatOptions, locale = navigator.languages?.[0] || "en-GB") {
-  if (!formatOptions) {
-    return value?.toString() || "";
-  }
-  return new Intl.NumberFormat(locale, formatOptions).format(+(value || 0));
-}
-
-// src/components/Slider/Slider.tsx
-import { jsx as jsx51, jsxs as jsxs26 } from "react/jsx-runtime";
-var Slider = (props) => {
-  const {
-    id,
-    className,
-    label,
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledBy,
-    minValue,
-    maxValue,
-    step = 1,
-    defaultValue = 0,
-    value,
-    onChange,
-    onChangeEnd,
-    variant = "primary",
-    minLabel,
-    maxLabel,
-    formatOptions,
-    isDisabled = false
-  } = props;
-  const trackRef = useRef14(null);
-  const [currentValue, setCurrentValue] = useState20(
-    value || defaultValue || 0
-  );
-  const [isDragging, setIsDraggging] = useState20(false);
-  const { labelProps, fieldProps } = useLabel({
-    id,
-    label,
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledBy
-  });
-  const formattedValue = numberFormatter(currentValue, formatOptions);
-  const classes = classNames41("mobius", "mobius-slider", className, {
-    "--is-disabled": isDisabled,
-    "--is-primary": variant === "primary",
-    "--is-secondary": variant === "secondary",
-    "--is-dragging": isDragging
-  });
-  const handleChange = (e) => {
-    const val = +e.target.value;
-    setCurrentValue(val);
-    if (onChange) {
-      onChange(val);
-    }
-  };
-  const handleChangeStart = () => {
-    setIsDraggging(true);
-  };
-  const handleChangeEnd = () => {
-    setIsDraggging(false);
-    if (onChangeEnd) {
-      onChangeEnd(currentValue);
-    }
-  };
-  return /* @__PURE__ */ jsxs26("div", { className: classes, children: [
-    /* @__PURE__ */ jsxs26("div", { className: "mobius-slider__label-wrapper", children: [
-      label && /* @__PURE__ */ jsx51(Label, { ...labelProps, children: label }),
-      label && /* @__PURE__ */ jsx51("output", { style: { flex: "1 0 auto", textAlign: "end" }, children: formattedValue })
-    ] }),
-    /* @__PURE__ */ jsx51("div", { ref: trackRef, className: "mobius-slider__track-wrapper", children: /* @__PURE__ */ jsx51(
-      "input",
-      {
-        className: "mobius-slider__track",
-        type: "range",
-        min: minValue,
-        max: maxValue,
-        value: currentValue,
-        step,
-        onChange: handleChange,
-        autoComplete: "off",
-        disabled: isDisabled,
-        onMouseDown: handleChangeStart,
-        onMouseUp: handleChangeEnd,
-        onKeyDown: handleChangeStart,
-        onKeyUp: handleChangeEnd,
-        ...fieldProps
-      }
-    ) }),
-    /* @__PURE__ */ jsxs26("div", { className: "mobius-slider__labels", children: [
-      /* @__PURE__ */ jsx51("div", { className: "mobius-slider__min-label", "data-testid": "min-label", children: minLabel }),
-      /* @__PURE__ */ jsx51("div", { className: "mobius-slider__max-label", "data-testid": "max-label", children: maxLabel })
-    ] })
-  ] });
-};
-
-// src/components/SVG/SVG.tsx
-import { Children as Children9 } from "react";
-import classNames42 from "classnames/dedupe";
-import { jsx as jsx52 } from "react/jsx-runtime";
-var SVG = ({ ref, ...props }) => {
-  const { children, className, ...otherProps } = props;
-  const classes = classNames42("mobius", "mobius-svg", className);
-  const svgNode = Children9.only(children);
-  const { children: svgChildren, viewBox, xmlns } = svgNode.props;
-  return /* @__PURE__ */ jsx52(
-    "svg",
-    {
-      viewBox,
-      xmlns,
-      ref,
-      ...otherProps,
-      className: classes,
-      children: svgChildren
-    }
-  );
-};
-SVG.displayName = "SVG";
-
-// src/components/Switch/Switch.tsx
-import {
-  useState as useState21,
-  useEffect as useEffect15
-} from "react";
-import classNames43 from "classnames/dedupe";
-import { jsx as jsx53, jsxs as jsxs27 } from "react/jsx-runtime";
-var Switch = ({ ref, ...props }) => {
-  const {
-    checked = false,
-    className,
-    onChange,
-    isDisabled = false,
-    ...otherProps
-  } = props;
-  const [enabled, setEnabled] = useState21(checked);
-  useEffect15(() => {
-    setEnabled(checked);
-  }, [checked]);
-  const classes = classNames43(
-    "mobius",
-    "mobius-switch",
-    {
-      "mobius-switch--checked": enabled,
-      "mobius-switch--disabled": isDisabled
-    },
-    className
-  );
-  const handleChange = (event) => {
-    setEnabled(!enabled);
-    if (onChange) {
-      onChange(event);
-    }
-  };
-  return /* @__PURE__ */ jsxs27("label", { ref, className: classes, children: [
-    /* @__PURE__ */ jsx53(VisuallyHidden, { children: /* @__PURE__ */ jsx53("span", { children: enabled ? "On" : "Off" }) }),
-    /* @__PURE__ */ jsx53(
-      "input",
-      {
-        type: "checkbox",
-        role: "switch",
-        checked: enabled,
-        onChange: handleChange,
-        disabled: isDisabled,
-        ...otherProps
-      }
-    ),
-    /* @__PURE__ */ jsx53("span", { className: "mobius-switch__slider" })
-  ] });
-};
-Switch.displayName = "Switch";
-
-// src/components/Table/Table.tsx
-import classNames44 from "classnames/dedupe";
-import { jsx as jsx54 } from "react/jsx-runtime";
-var Table = ({ ref, ...props }) => {
-  const classes = classNames44("mobius", "mobius-table", props.className);
-  return /* @__PURE__ */ jsx54("table", { ref, ...props, className: classes });
-};
-Table.displayName = "Table";
-
-// src/components/Table/Head.tsx
-import classNames45 from "classnames/dedupe";
-import { jsx as jsx55 } from "react/jsx-runtime";
-var Head = ({ ref, ...props }) => {
-  const classes = classNames45("mobius", "mobius-table__head", props.className);
-  return /* @__PURE__ */ jsx55("thead", { ref, ...props, className: classes });
-};
-Head.displayName = "Table.Head";
-
-// src/components/Table/Body.tsx
-import classNames46 from "classnames/dedupe";
-import { jsx as jsx56 } from "react/jsx-runtime";
-var Body = ({ ref, ...props }) => {
-  const classes = classNames46("mobius", "mobius-table__body", props.className);
-  return /* @__PURE__ */ jsx56("tbody", { ref, ...props, className: classes });
-};
-Body.displayName = "Table.Body";
-
-// src/components/Table/Foot.tsx
-import classNames47 from "classnames/dedupe";
-import { jsx as jsx57 } from "react/jsx-runtime";
-var Foot = ({ ref, ...props }) => {
-  const classes = classNames47("mobius", "mobius-table__foot", props.className);
-  return /* @__PURE__ */ jsx57("tfoot", { ref, ...props, className: classes });
-};
-Foot.displayName = "Table.Foot";
-
-// src/components/Table/Row.tsx
-import classNames48 from "classnames/dedupe";
-import { jsx as jsx58 } from "react/jsx-runtime";
-var Row = ({ ref, ...props }) => {
-  const classes = classNames48("mobius", "mobius-table__row", props.className);
-  return /* @__PURE__ */ jsx58("tr", { ref, ...props, className: classes });
-};
-Row.displayName = "Table.Row";
-
-// src/components/Table/HeaderCell.tsx
-import classNames49 from "classnames/dedupe";
-import { jsx as jsx59 } from "react/jsx-runtime";
-var HeaderCell = ({ ref, ...props }) => {
-  const classes = classNames49(
-    "mobius",
-    "mobius-table__head-cell",
-    props.className
-  );
-  return /* @__PURE__ */ jsx59("th", { ...props, ref, className: classes });
-};
-HeaderCell.displayName = "Table.HeaderCell";
-
-// src/components/Table/Cell.tsx
-import classNames50 from "classnames/dedupe";
-import { jsx as jsx60 } from "react/jsx-runtime";
-var Cell = ({ ref, ...props }) => {
-  const classes = classNames50(
-    "mobius",
-    "mobius-table__body-cell",
-    props.className
-  );
-  return /* @__PURE__ */ jsx60("td", { ref, ...props, className: classes });
-};
-Cell.displayName = "Table.Cell";
-
-// src/components/Table/index.tsx
-var Table2 = Object.assign(Table, {
-  Head,
-  Body,
-  Foot,
-  Row,
-  HeaderCell,
-  Cell
-});
-Table2.displayName = "Table";
-
-// src/components/TextArea/TextArea.tsx
-import classNames52 from "classnames/dedupe";
-
-// src/components/TextAreaInput/TextAreaInput.tsx
-import classNames51 from "classnames/dedupe";
-import { jsx as jsx61 } from "react/jsx-runtime";
-var TextAreaInput = ({ ref, ...props }) => {
-  const { isSelected, isDisabled, isReadOnly, isRequired, ...otherProps } = props;
-  const classes = classNames51(
-    "mobius",
-    "mobius-text-area__input",
-    {
-      "--is-disabled": isDisabled,
-      "--is-selected": isSelected,
-      "--is-required": isRequired
-    },
-    otherProps.className
-  );
-  return /* @__PURE__ */ jsx61(
-    "textarea",
-    {
-      ref,
-      ...otherProps,
-      required: isRequired,
-      readOnly: isReadOnly,
-      className: classes
-    }
-  );
-};
-TextAreaInput.displayName = "TextAreaInput";
-
-// src/components/TextArea/TextArea.tsx
-import { jsx as jsx62, jsxs as jsxs28 } from "react/jsx-runtime";
-var TextArea = ({ ref, ...props }) => {
-  const {
-    isDisabled,
-    className,
-    errorMessage,
-    label,
-    isInvalid,
-    ...otherProps
-  } = props;
-  const { inputProps, labelProps, errorMessageProps } = useTextField(props);
-  const classes = classNames52("mobius", "mobius-text-area", className);
-  const validationClasses = useValidationClasses({ isInvalid });
-  const inputClasses = classNames52("mobius-text-area__input", validationClasses);
-  const labelClasses = classNames52(
-    {
-      "--is-disabled": isDisabled
-    },
-    validationClasses
-  );
-  return /* @__PURE__ */ jsxs28(Stack, { className: classes, gap: "xs", children: [
-    label && /* @__PURE__ */ jsx62(Label, { ...labelProps, className: labelClasses, children: props.label }),
-    /* @__PURE__ */ jsx62(
-      TextAreaInput,
-      {
-        ...otherProps,
-        ...inputProps,
-        ref,
-        className: inputClasses,
-        isDisabled,
-        "aria-invalid": errorMessage != null
-      }
-    ),
-    /* @__PURE__ */ jsx62(ErrorMessage, { ...errorMessageProps, errorMessage })
-  ] });
-};
-TextArea.displayName = "TextArea";
-
-// src/components/Title/Title.tsx
-import classNames53 from "classnames/dedupe";
-import { jsx as jsx63, jsxs as jsxs29 } from "react/jsx-runtime";
-var Title = ({ ref, ...props }) => {
-  const {
-    elementType: Element = "div",
-    title,
-    description,
-    ...otherProps
-  } = props;
-  const classes = classNames53("mobius", "mobius-title", otherProps.className);
-  const headerClasses = classNames53("mobius", "mobius-title__header");
-  const contentClasses = classNames53("mobius", "mobius-title__description");
-  const containerClasses = classNames53("mobius", "mobius-title__container");
-  return /* @__PURE__ */ jsx63(Element, { ref, ...otherProps, className: classes, children: /* @__PURE__ */ jsxs29(Flex, { flexDirection: "column", className: containerClasses, children: [
-    /* @__PURE__ */ jsx63("p", { className: headerClasses, children: title }),
-    /* @__PURE__ */ jsx63("p", { className: contentClasses, children: description })
-  ] }) });
-};
-Title.displayName = "Title";
-
-// src/components/Toast/Toast.tsx
-import {
-  circleCheck,
-  circleExclamation,
-  circleInfo as circleInfo2,
-  cross as cross4,
-  triangleExclamation
-} from "@simplybusiness/icons";
-import classNames54 from "classnames/dedupe";
-import { toast as sonnerToast } from "sonner";
-
-// src/components/Toast/state.ts
-var toastState = {
-  showCloseButton: true
-};
-
-// src/components/Toast/Toast.tsx
-import { jsx as jsx64, jsxs as jsxs30 } from "react/jsx-runtime";
-var variantIcons = {
-  info: circleInfo2,
-  success: circleCheck,
-  warning: triangleExclamation,
-  error: circleExclamation
-};
-var variantColors = {
-  info: "var(--color-info)",
-  success: "var(--color-valid)",
-  warning: "var(--color-warning)",
-  error: "var(--color-error)"
-};
-var ToastIcon = ({ variant }) => /* @__PURE__ */ jsx64("span", { className: "mobius-toast__icon", children: /* @__PURE__ */ jsx64(Icon, { icon: variantIcons[variant], color: variantColors[variant] }) });
-var CloseIcon = () => /* @__PURE__ */ jsx64("span", { className: "mobius-toast__close-icon", children: /* @__PURE__ */ jsx64(Icon, { icon: cross4 }) });
-var ToastContent = ({
-  toastId,
-  variant,
-  title,
-  description,
-  action,
-  cancel,
-  showCloseButton = toastState.showCloseButton
-}) => /* @__PURE__ */ jsxs30("div", { className: classNames54("mobius", "mobius-toast", `--${variant}`), children: [
-  /* @__PURE__ */ jsx64(ToastIcon, { variant }),
-  /* @__PURE__ */ jsxs30("div", { className: "mobius-toast__body", children: [
-    /* @__PURE__ */ jsxs30("div", { className: "mobius-toast__content", children: [
-      title && /* @__PURE__ */ jsx64("div", { className: "mobius-toast__title", children: title }),
-      description && /* @__PURE__ */ jsx64("div", { className: "mobius-toast__description", children: description })
-    ] }),
-    (action || cancel) && /* @__PURE__ */ jsxs30("div", { className: "mobius-toast__actions", children: [
-      cancel && /* @__PURE__ */ jsx64(
-        "button",
-        {
-          type: "button",
-          className: "mobius-toast__cancel",
-          onClick: () => {
-            cancel.onClick?.();
-            sonnerToast.dismiss(toastId);
-          },
-          children: cancel.label
-        }
-      ),
-      action && /* @__PURE__ */ jsx64(
-        "button",
-        {
-          type: "button",
-          className: "mobius-toast__action",
-          onClick: () => {
-            action.onClick();
-            sonnerToast.dismiss(toastId);
-          },
-          children: action.label
-        }
-      )
-    ] })
-  ] }),
-  showCloseButton && /* @__PURE__ */ jsx64(
-    "button",
-    {
-      type: "button",
-      className: "mobius-toast__close",
-      onClick: () => sonnerToast.dismiss(toastId),
-      "aria-label": "Close",
-      children: /* @__PURE__ */ jsx64(CloseIcon, {})
-    }
-  )
-] });
-var createCustomToast = (message, variant, options) => sonnerToast.custom(
-  (id) => /* @__PURE__ */ jsx64(
-    ToastContent,
-    {
-      toastId: id,
-      variant,
-      title: options?.title,
-      description: options?.description ?? message,
-      action: options?.action,
-      cancel: options?.cancel,
-      showCloseButton: options?.showCloseButton
-    }
-  ),
-  {
-    duration: options?.duration,
-    onDismiss: options?.onDismiss,
-    onAutoClose: options?.onAutoClose
-  }
-);
-var toast = {
-  /** Show an info toast */
-  info: (message, options) => createCustomToast(message, "info", options),
-  /** Show a success toast */
-  success: (message, options) => createCustomToast(message, "success", options),
-  /** Show a warning toast */
-  warning: (message, options) => createCustomToast(message, "warning", options),
-  /** Show an error toast */
-  error: (message, options) => createCustomToast(message, "error", options),
-  /** Dismiss a specific toast by ID or all toasts */
-  dismiss: (toastId) => sonnerToast.dismiss(toastId)
-};
-
-// src/components/Toast/Toaster.tsx
-import { useEffect as useEffect16 } from "react";
-import { Toaster as SonnerToaster } from "sonner";
-import { jsx as jsx65 } from "react/jsx-runtime";
-var Toaster = ({
-  position = "top-right",
-  closeButton = true,
-  expand = false,
-  duration = 4e3,
-  visibleToasts = 3,
-  gap = 8
-}) => {
-  useEffect16(() => {
-    toastState.showCloseButton = closeButton;
-  }, [closeButton]);
-  return /* @__PURE__ */ jsx65(
-    SonnerToaster,
-    {
-      position,
-      closeButton: false,
-      expand,
-      duration,
-      visibleToasts,
-      gap
-    }
-  );
-};
-Toaster.displayName = "Toaster";
-
-// src/components/Trust/Trust.tsx
-import classNames55 from "classnames/dedupe";
-import { useEffect as useEffect17, useRef as useRef15, useState as useState22 } from "react";
-
-// src/components/Trust/constants.ts
-var REQUIRED_TRUSTPILOT_CLASS_NAME = "trustpilot-widget";
-var SIMPLYBUSINESS_UNIT_ID = "5ca35a3da72b330001954cef";
-var SIMPLYBUSINESS_UNIT_IDS = {
-  "en-US": "5ca35a3da72b330001954cef",
-  // US business unit ID
-  "en-GB": "56b1db010000ff0005887125"
-  // UK business unit ID
-};
-var TRUSTPILOT_LINKS = {
-  "en-US": "https://www.trustpilot.com/review/simplybusiness.com",
-  "en-GB": "https://www.trustpilot.com/review/simplybusiness.co.uk"
-};
-var TRUSTPILOT_TEMPLATE_IDS = {
-  "micro-combo": "5419b6ffb0d04a076446a9af",
-  mini: "53aa8807dec7e10d38f59f32",
-  carousel: "53aa8912dec7e10d38f59f36",
-  horizontal: "5406e65db0d04a09e042d5fc",
-  "micro-star": "5419b732fbfb950b10de65e5"
-};
-var TRUSTPILOT_WIDGET = {
-  // Keys based on actual widget names
-  // https://support.trustpilot.com/hc/en-us/articles/360019826379-TrustBox-widget-overview
-  "micro-combo": {
-    templateId: TRUSTPILOT_TEMPLATE_IDS["micro-combo"],
-    className: "--is-variant-micro-combo",
-    styles: {
-      height: "25px"
-    }
-  },
-  mini: {
-    templateId: TRUSTPILOT_TEMPLATE_IDS["mini"],
-    className: "--is-variant-mini",
-    styles: {
-      width: "300px",
-      height: "150px"
-    }
-  },
-  carousel: {
-    templateId: TRUSTPILOT_TEMPLATE_IDS["carousel"],
-    className: "--is-variant-carousel",
-    styles: {
-      height: "150px"
-    }
-  },
-  horizontal: {
-    templateId: TRUSTPILOT_TEMPLATE_IDS["horizontal"],
-    className: "--is-variant-horizontal",
-    styles: {
-      height: "28px"
-    }
-  },
-  "micro-star": {
-    templateId: TRUSTPILOT_TEMPLATE_IDS["micro-star"],
-    className: "--is-variant-micro-star",
-    styles: {
-      height: "24px"
-    }
-  }
-};
-
-// src/components/Trust/Trust.tsx
-import { jsx as jsx66 } from "react/jsx-runtime";
-var Trust = ({ ref, ...props }) => {
-  const {
-    elementType: Element = "div",
-    variant,
-    theme,
-    locale,
-    height,
-    width,
-    stars,
-    className
-  } = props;
-  const [isMounted, setIsMounted] = useState22(false);
-  const trustRef = useRef15(null);
-  const {
-    templateId,
-    className: variantClassName,
-    styles
-  } = TRUSTPILOT_WIDGET[variant];
-  const link = TRUSTPILOT_LINKS[locale];
-  const businessUnitId = SIMPLYBUSINESS_UNIT_IDS[locale] || SIMPLYBUSINESS_UNIT_ID;
-  const dataProps = {
-    "data-businessunit-id": businessUnitId,
-    "data-locale": locale,
-    "data-template-id": templateId,
-    "data-theme": theme,
-    "data-style-width": width || "100%",
-    "data-style-height": height,
-    "data-stars": stars
-  };
-  const classes = classNames55(
-    "mobius",
-    "mobius-trust",
-    REQUIRED_TRUSTPILOT_CLASS_NAME,
-    {
-      [`--is-${theme}`]: theme,
-      [variantClassName]: variant
-    },
-    className
-  );
-  useEffect17(() => {
-    const hasTrustpilotLoaded = trustRef.current && window?.Trustpilot && window?.Trustpilot.loadFromElement;
-    if (isMounted && hasTrustpilotLoaded) {
-      window.Trustpilot.loadFromElement(trustRef.current, true);
-    }
-  }, [isMounted]);
-  useEffect17(() => {
-    setIsMounted(true);
-  }, []);
-  if (!isMounted) return /* @__PURE__ */ jsx66("div", { style: styles });
-  return /* @__PURE__ */ jsx66(
-    Element,
-    {
-      ref: mergeRefs([trustRef, ref]),
-      className: classes,
-      style: styles,
-      ...dataProps,
-      children: /* @__PURE__ */ jsx66(
-        "a",
-        {
-          href: link,
-          target: "_blank",
-          rel: "noopener noreferrer",
-          className: "mobius-trust__link",
-          children: "Trustpilot"
-        }
-      )
-    }
-  );
-};
-
-// src/components/ExpandableText/ExpandableText.tsx
-import classNames56 from "classnames/dedupe";
-import { useEffect as useEffect18, useId as useId10, useRef as useRef16, useState as useState23 } from "react";
-import { jsx as jsx67, jsxs as jsxs31 } from "react/jsx-runtime";
-var ExpandableText = ({ ref, ...props }) => {
-  const {
-    text,
-    maxLines = 3,
-    breakpoint,
-    showText = "Read more",
-    hideText = "Read less",
-    className,
-    textProps = {},
-    accordionProps = {},
-    onToggle,
-    ...otherProps
-  } = props;
-  const [isExpanded, setIsExpanded] = useState23(false);
-  const [isCollapsed, setIsCollapsed] = useState23(false);
-  const textRef = useRef16(null);
-  const { down } = useBreakpoint();
-  const baseId = useId10();
-  const expandButtonId = `expandable-text-expand-${baseId}`;
-  const shouldCollapse = breakpoint ? down(breakpoint) : true;
-  useEffect18(() => {
-    if (!shouldCollapse || !textRef.current) {
-      setIsCollapsed(false);
-      return;
-    }
-    const element = textRef.current;
-    const isOverflowing = element.scrollHeight > element.clientHeight;
-    setIsCollapsed(isOverflowing);
-  }, [text, shouldCollapse, maxLines]);
-  if (breakpoint && !shouldCollapse) {
-    return /* @__PURE__ */ jsx67("div", { ref, className, ...otherProps, children: /* @__PURE__ */ jsx67(TextOrHTML, { text, textWrapper: true, ...textProps }) });
-  }
-  const handleAccordionChange = (expanded) => {
-    setIsExpanded(expanded);
-    onToggle?.(expanded);
-  };
-  const classes = classNames56("mobius-expandable-text", className);
-  const textContainerClasses = classNames56("mobius-expandable-text__content", {
-    "mobius-expandable-text__content--collapsed": !isExpanded
-  });
-  const textContainerStyle = {
-    "--line-clamp": maxLines
-  };
-  return /* @__PURE__ */ jsxs31(
-    "div",
-    {
-      ref,
-      className: classes,
-      "data-testid": "expandable-text",
-      ...otherProps,
-      children: [
-        /* @__PURE__ */ jsx67(
-          "div",
-          {
-            ref: textRef,
-            className: textContainerClasses,
-            style: textContainerStyle,
-            "data-testid": "expandable-text-content",
-            "aria-describedby": isCollapsed ? expandButtonId : void 0,
-            children: /* @__PURE__ */ jsx67(TextOrHTML, { elementType: "span", textWrapper: true, text, ...textProps })
-          }
-        ),
-        isCollapsed && /* @__PURE__ */ jsx67(
-          Accordion,
-          {
-            showText,
-            hideText,
-            headerPosition: "bottom",
-            onChange: handleAccordionChange,
-            onClick: (e) => {
-              e?.stopPropagation();
-            },
-            id: expandButtonId,
-            ...accordionProps
-          }
-        )
-      ]
-    }
-  );
-};
-ExpandableText.displayName = "ExpandableText";
-
-// src/components/MaskedField/index.tsx
-import loadable from "@loadable/component";
-import { jsx as jsx68 } from "react/jsx-runtime";
-var LoadableMaskedField = loadable(() => import("./MaskedField-CX4GV6JS.js"), {
-  resolveComponent: (mod) => mod.MaskedField
-});
-function MaskedField(props) {
-  const {
-    mask: _mask,
-    useMaskedValue: _useMaskedValue,
-    "data-testid": _dataTestId,
-    ref: forwardedRef,
-    ...textFieldProps
-  } = props;
-  return /* @__PURE__ */ jsx68(
-    LoadableMaskedField,
-    {
-      ...props,
-      fallback: /* @__PURE__ */ jsx68(
-        TextField,
-        {
-          ...textFieldProps,
-          ref: forwardedRef,
-          type: "text",
-          isDisabled: true,
-          isReadOnly: true
-        }
-      )
-    }
-  );
-}
-MaskedField.displayName = "MaskedField";
+} from "./chunk-YUDNS4SZ.js";
 export {
   Accordion,
   AccordionList,
@@ -4277,13 +89,13 @@ export {
   DEFAULT_BREAKPOINTS,
   DateField,
   Divider,
-  Drawer2 as Drawer,
-  DropdownMenu2 as DropdownMenu,
+  Drawer,
+  DropdownMenu,
   ErrorMessage,
   ExpandableText,
   Fieldset,
   Flex,
-  Grid2 as Grid,
+  Grid,
   Icon,
   Image,
   Label,
@@ -4296,9 +108,9 @@ export {
   LoqateAddressLookupService,
   MIN_MAX_ERROR,
   MaskedField,
-  Modal2 as Modal,
+  Modal,
   NumberField,
-  Option2 as Option,
+  Option,
   PasswordField,
   Popover,
   Progress,
@@ -4311,7 +123,7 @@ export {
   Slider,
   Stack,
   Switch,
-  Table2 as Table,
+  Table,
   Text,
   TextArea,
   TextAreaInput,