@simplybusiness/mobius 10.4.3 → 10.5.0

package/dist/esm/{chunk-NEFRXIFY.js → chunk-53QMWUHB.js}

@@ -14,7 +14,7 @@ import {
 } from "./chunk-2JLZNSLY.js";
 import {
   TextField
-} from "./chunk-IQKS662C.js";
+} from "./chunk-AKCNBW55.js";
 import {
   VisuallyHidden
 } from "./chunk-PRZRE6A5.js";
@@ -352,4 +352,4 @@ var Combobox = ComboboxInner;
 export {
   Combobox
 };
-//# sourceMappingURL=chunk-NEFRXIFY.js.map
+//# sourceMappingURL=chunk-53QMWUHB.js.map

package/dist/esm/chunk-53QMWUHB.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/Combobox/Combobox.tsx"],
+  "sourcesContent": ["import { useOnUnmount } from \"@simplybusiness/mobius-hooks\";\nimport classNames from \"classnames/dedupe\";\nimport type React from \"react\";\nimport type { FocusEvent } from \"react\";\nimport { useEffect, useId, useRef, useState } from \"react\";\nimport { useBreakpoint } from \"../../hooks\";\nimport { TextField } from \"../TextField\";\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport { Listbox } from \"./Listbox\"; // Import Listbox component\nimport type { ComboboxOption, ComboboxProps } from \"./types\";\nimport { useComboboxHighlight } from \"./useComboboxHighlight\";\nimport { useComboboxOptions } from \"./useComboboxOptions\";\nimport { getOptionLabel, getOptionValue, isOptionGroup } from \"./utils\";\nimport \"./Combobox.css\";\n\nconst ComboboxInner = <T extends ComboboxOption>({\n  ref,\n  ...props\n}: ComboboxProps<T>) => {\n  const {\n    id,\n    defaultValue,\n    value,\n    options,\n    asyncOptions,\n    delay,\n    minSearchLength,\n    onSelected,\n    className,\n    placeholder,\n    icon,\n    onBlur,\n    onFocus,\n    onChange,\n    // onSearched, // unused prop, consider removing\n    optionComponent,\n    optionTestIdPrefix,\n    errorMessage,\n    ...otherProps\n  } = props;\n  // Avoid re-fetching after selecting an option\n  const skipNextDebounceRef = useRef(false);\n  const fallbackRef = useRef<HTMLInputElement>(null);\n  const [inputValue, setInputValue] = useState(defaultValue || \"\");\n  const [isOpen, setIsOpen] = useState(false);\n  const [isChanging, setIsChanging] = useState(false);\n  const { filteredOptions, updateFilteredOptions, isLoading, error } =\n    useComboboxOptions({\n      options,\n      asyncOptions,\n      inputValue,\n      delay,\n      minSearchLength,\n      skipNextDebounceRef,\n    });\n  const [validationError, setValidationError] = useState(\n    error?.message || errorMessage,\n  );\n  const {\n    highlightedIndex,\n    highlightedGroupIndex,\n    highlightNextOption,\n    highlightPreviousOption,\n    highlightFirstOption,\n    highlightLastOption,\n    clearHighlight,\n  } = useComboboxHighlight(filteredOptions);\n\n  const inputRef = ref || fallbackRef;\n  const listboxId = useId();\n  const statusId = useId();\n  const blurTimeoutRef = useRef<NodeJS.Timeout | null>(null);\n  const userInteractedRef = useRef(false);\n  const justSelectedRef = useRef(false);\n  const { down } = useBreakpoint();\n  const isMobile = down(\"md\");\n\n  useEffect(() => {\n    setValidationError(error?.message || errorMessage);\n  }, [error, errorMessage]);\n\n  // Helper to create properly-typed empty value based on option type\n  const getEmptyValue = (): T => {\n    // Check first available option to determine if we're using string or object options\n    const firstOption = filteredOptions\n      ? isOptionGroup(filteredOptions)\n        ? filteredOptions[0]?.options[0]\n        : filteredOptions[0]\n      : options\n        ? isOptionGroup(options)\n          ? options[0]?.options[0]\n          : options[0]\n        : undefined;\n\n    // If options are strings, return empty string\n    if (typeof firstOption === \"string\") {\n      return \"\" as T;\n    }\n\n    // If options are objects, return empty object with same shape\n    return { label: \"\", value: \"\" } as T;\n  };\n\n  const handleFocus = (e: FocusEvent) => {\n    onFocus?.(e);\n    if (!filteredOptions || filteredOptions.length === 0) return;\n    if (blurTimeoutRef.current) {\n      clearTimeout(blurTimeoutRef.current);\n      blurTimeoutRef.current = null;\n    }\n\n    // Check if this is natural focus (user click/Tab) or programmatic focus\n    const isNaturalFocus =\n      userInteractedRef.current || e.relatedTarget !== null;\n    if (userInteractedRef.current) {\n      userInteractedRef.current = false;\n    }\n\n    // Block opening only if programmatic focus right after selection\n    if (justSelectedRef.current && !isNaturalFocus) {\n      return;\n    }\n\n    // Open dropdown for natural focus\n    if (isNaturalFocus) {\n      setIsOpen(true);\n      justSelectedRef.current = false;\n    }\n  };\n\n  useEffect(() => {\n    if (!inputRef || typeof inputRef === \"function\") return;\n    const inputElement = inputRef.current;\n    if (!inputElement) return;\n\n    const handleMouseDown = () => {\n      // Track that user clicked/interacted with input\n      userInteractedRef.current = true;\n    };\n\n    inputElement.addEventListener(\"mousedown\", handleMouseDown);\n    return () => {\n      inputElement.removeEventListener(\"mousedown\", handleMouseDown);\n    };\n  }, [inputRef]);\n\n  useOnUnmount(() => {\n    if (blurTimeoutRef.current) {\n      clearTimeout(blurTimeoutRef.current);\n    }\n  });\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = e.target.value;\n    setInputValue(newValue);\n    setValidationError(undefined);\n    justSelectedRef.current = false;\n    setIsChanging(true);\n    // Only open immediately for sync options; async options controlled by useEffect\n    if (!asyncOptions) {\n      setIsOpen(true);\n    }\n    clearHighlight();\n    onChange?.(e);\n  };\n\n  const handleOptionSelect = (option: T) => {\n    const val = getOptionValue(option);\n\n    // Allow empty values to pass through\n    if (!val && val !== \"\") return;\n\n    if (\n      typeof option === \"object\" &&\n      \"callback\" in option &&\n      option.callback &&\n      typeof option.callback === \"function\"\n    ) {\n      justSelectedRef.current = true;\n      setTimeout(() => {\n        if (inputRef && typeof inputRef !== \"function\" && inputRef.current) {\n          inputRef.current.focus();\n        }\n      }, 0);\n      const callbackPromise = option.callback();\n      updateFilteredOptions(callbackPromise);\n      callbackPromise\n        .then(() => {\n          setIsOpen(true);\n          setIsChanging(true);\n        })\n        .catch(() => {\n          // error handled inside updateFilteredOptions via setError\n        });\n      return;\n    }\n\n    // Prevent re-fetching options after selecting an option\n    skipNextDebounceRef.current = true;\n    justSelectedRef.current = true;\n\n    setIsChanging(false);\n    setValidationError(undefined);\n    setIsOpen(false);\n    setInputValue(val);\n    onSelected?.(option);\n  };\n\n  const getFirstOption = () => {\n    if (!filteredOptions) return undefined;\n    if (isOptionGroup(filteredOptions)) {\n      return filteredOptions[0]?.options[0];\n    }\n\n    return filteredOptions[0];\n  };\n\n  const getHighlightedOption = () => {\n    if (!filteredOptions) return undefined;\n    if (highlightedIndex === -1) return undefined;\n\n    if (isOptionGroup(filteredOptions)) {\n      const group = filteredOptions[highlightedGroupIndex];\n      return group?.options[highlightedIndex];\n    }\n\n    return filteredOptions[highlightedIndex];\n  };\n\n  const getHighlightedOptionId = () => {\n    const option = getHighlightedOption();\n    if (!option) return undefined;\n\n    if (isOptionGroup(filteredOptions)) {\n      return `${listboxId}-option-${highlightedGroupIndex}-${highlightedIndex}`;\n    }\n\n    return `${listboxId}-option-${highlightedIndex}`;\n  };\n\n  const handleBlur = (e: FocusEvent<Element, Element>) => {\n    // Force selection if user has matched an entry by typing (not already selected)\n    // Defer this to allow natural focus flow to complete first\n    if (!justSelectedRef.current) {\n      const typedText = inputValue.trim();\n      const typedTextLower = typedText.toLowerCase();\n      const highlightedOption = getHighlightedOption();\n      const label = getOptionLabel(highlightedOption);\n\n      if (typedTextLower === label?.toLowerCase()) {\n        // Exact match with an option\n        setTimeout(() => {\n          handleOptionSelect(highlightedOption as T);\n        }, 0);\n      } else if (typedText === \"\") {\n        // Allow empty values\n        setTimeout(() => {\n          handleOptionSelect(getEmptyValue());\n        }, 0);\n      } else {\n        // Invalid value (not in options and not empty)\n        setValidationError(\n          errorMessage || \"Please select an option from the list\",\n        );\n        setTimeout(() => {\n          setInputValue(\"\");\n        }, 0);\n      }\n    }\n\n    blurTimeoutRef.current = setTimeout(() => {\n      onBlur?.(e);\n      setIsOpen(false);\n      setIsChanging(false);\n    }, 150);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    switch (e.key) {\n      case \"ArrowDown\":\n        e.preventDefault();\n        justSelectedRef.current = false;\n        setIsOpen(true);\n        highlightNextOption();\n        break;\n      case \"ArrowUp\":\n        e.preventDefault();\n        justSelectedRef.current = false;\n        setIsOpen(true);\n        highlightPreviousOption();\n        break;\n      case \"Home\":\n        e.preventDefault();\n        justSelectedRef.current = false;\n        setIsOpen(true);\n        highlightFirstOption();\n        break;\n      case \"End\":\n        e.preventDefault();\n        justSelectedRef.current = false;\n        setIsOpen(true);\n        highlightLastOption();\n        break;\n      case \"Enter\":\n        e.preventDefault();\n        if (isOpen) {\n          const selectedOption = getHighlightedOption() || getFirstOption();\n          if (selectedOption) {\n            handleOptionSelect(selectedOption);\n          }\n        }\n        break;\n      case \"Escape\":\n        e.preventDefault();\n        setInputValue(\"\");\n        setIsOpen(false);\n        clearHighlight();\n        break;\n      default:\n      // Do nothing\n    }\n  };\n\n  useEffect(() => {\n    if (value) {\n      setInputValue(value);\n    }\n  }, [value]);\n\n  // Open and close the combobox based on async filtered options\n  useEffect(() => {\n    if (asyncOptions && isChanging) {\n      setIsOpen(!!filteredOptions && filteredOptions.length > 0);\n    }\n  }, [filteredOptions, asyncOptions, isChanging]);\n\n  const classes = classNames(\n    \"mobius mobius-combobox\",\n    {\n      \"mobius-combobox--is-expanded\": isOpen,\n      \"mobius-combobox--is-loading\": isLoading,\n      \"mobius-combobox--is-mobile\": isMobile,\n    },\n    className,\n  );\n\n  const getStatusMessage = () => {\n    if (isLoading) return \"Loading options\";\n    if (!filteredOptions || filteredOptions.length === 0) {\n      return isChanging ? \"No options found\" : \"\";\n    }\n    const count = isOptionGroup(filteredOptions)\n      ? filteredOptions.reduce((sum, group) => sum + group.options.length, 0)\n      : filteredOptions.length;\n    return isOpen && isChanging\n      ? `${count} option${count === 1 ? \"\" : \"s\"} available`\n      : \"\";\n  };\n\n  return (\n    <div id={id} data-testid=\"mobius-combobox__wrapper\" className={classes}>\n      <VisuallyHidden\n        role=\"status\"\n        aria-live=\"polite\"\n        id={statusId}\n        elementType=\"div\"\n        className=\"mobius-combobox__status\"\n      >\n        {getStatusMessage()}\n      </VisuallyHidden>\n      <TextField\n        {...otherProps}\n        className=\"mobius-combobox__input\"\n        role=\"combobox\"\n        value={inputValue}\n        placeholder={placeholder}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onKeyDown={handleKeyDown}\n        onChange={handleInputChange}\n        autoComplete=\"off\"\n        aria-describedby={isLoading ? statusId : undefined}\n        aria-autocomplete=\"list\"\n        aria-haspopup=\"listbox\"\n        aria-controls={isOpen ? listboxId : undefined}\n        aria-expanded={isOpen}\n        aria-activedescendant={\n          highlightedIndex === -1 ? undefined : getHighlightedOptionId()\n        }\n        prefixInside={icon}\n        ref={inputRef}\n        errorMessage={errorMessage || validationError || error?.message}\n      />\n      <Listbox\n        id={listboxId}\n        isOpen={isOpen}\n        isLoading={isLoading}\n        options={filteredOptions}\n        highlightedIndex={highlightedIndex}\n        highlightedGroupIndex={highlightedGroupIndex}\n        onOptionSelect={handleOptionSelect}\n        optionComponent={optionComponent}\n        optionTestIdPrefix={optionTestIdPrefix}\n      />\n    </div>\n  );\n};\n\nexport const Combobox = ComboboxInner;\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/{chunk-4HI2AOBC.js → chunk-6TSYA7CJ.js}

@@ -22,12 +22,9 @@ var Item = ({ ref, ...props }) => {
         child.props.className,
         classes
       );
-      return cloneElement(
-        child,
-        {
-          className: childClasses
-        }
-      );
+      return cloneElement(child, {
+        className: childClasses
+      });
     }
     return /* @__PURE__ */ jsx("span", { className: classes, children: child });
   }) });
@@ -37,4 +34,4 @@ Item.displayName = "DropdownMenu.Item";
 export {
   Item
 };
-//# sourceMappingURL=chunk-4HI2AOBC.js.map
+//# sourceMappingURL=chunk-6TSYA7CJ.js.map

package/dist/esm/{chunk-4HI2AOBC.js.map → chunk-6TSYA7CJ.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/DropdownMenu/Item.tsx"],
-  "sourcesContent": ["import type { Ref, RefAttributes, ReactNode, ReactElement } from \"react\";\nimport { cloneElement, isValidElement, Children } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport type { DOMProps } from \"../../types/dom\";\n\nexport type ItemElementType = HTMLLIElement;\n\nexport interface ItemProps extends DOMProps, RefAttributes<ItemElementType> {\n  elementType?: React.ElementType;\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  active?: boolean;\n  children?: ReactNode;\n  onClick?: () => void;\n}\n\nexport type ItemRef = Ref<ItemElementType>;\n\nconst Item = ({ ref, ...props }: ItemProps) => {\n  const {\n    elementType: Element = \"li\",\n    active,\n    onClick,\n    children,\n    ...otherProps\n  } = props;\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-dropdown-menu__item\",\n    { \"--is-active\": active },\n    otherProps.className,\n  );\n\n  return (\n    <Element ref={ref} onClick={onClick} {...otherProps}>\n      {Children.map(children, child => {\n        if (isValidElement(child)) {\n          const childClasses = classNames(\n            (child.props as { className?: string }).className,\n            classes,\n          );\n          return cloneElement(\n            child as ReactElement,\n            {\n              className: childClasses,\n            } as { className: string },\n          );\n        }\n\n        return <span className={classes}>{child}</span>;\n      })}\n    </Element>\n  );\n};\n\nItem.displayName = \"DropdownMenu.Item\";\nexport { Item };\n"],
-  "mappings": ";AACA,SAAS,cAAc,gBAAgB,gBAAgB;AACvD,OAAO,gBAAgB;AA+CR;AA/Bf,IAAM,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,MAAiB;AAC7C,QAAM;AAAA,IACJ,aAAa,UAAU;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,IACA,EAAE,eAAe,OAAO;AAAA,IACxB,WAAW;AAAA,EACb;AAEA,SACE,oBAAC,WAAQ,KAAU,SAAmB,GAAG,YACtC,mBAAS,IAAI,UAAU,WAAS;AAC/B,QAAI,eAAe,KAAK,GAAG;AACzB,YAAM,eAAe;AAAA,QAClB,MAAM,MAAiC;AAAA,QACxC;AAAA,MACF;AACA,aAAO;AAAA,QACL;AAAA,QACA;AAAA,UACE,WAAW;AAAA,QACb;AAAA,MACF;AAAA,IACF;AAEA,WAAO,oBAAC,UAAK,WAAW,SAAU,iBAAM;AAAA,EAC1C,CAAC,GACH;AAEJ;AAEA,KAAK,cAAc;",
+  "sourcesContent": ["import type { Ref, RefAttributes, ReactNode, ReactElement } from \"react\";\nimport { cloneElement, isValidElement, Children } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport type { DOMProps } from \"../../types/dom\";\n\nexport type ItemElementType = HTMLLIElement;\n\nexport interface ItemProps extends DOMProps, RefAttributes<ItemElementType> {\n  elementType?: React.ElementType;\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  active?: boolean;\n  children?: ReactNode;\n  onClick?: () => void;\n}\n\nexport type ItemRef = Ref<ItemElementType>;\n\nconst Item = ({ ref, ...props }: ItemProps) => {\n  const {\n    elementType: Element = \"li\",\n    active,\n    onClick,\n    children,\n    ...otherProps\n  } = props;\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-dropdown-menu__item\",\n    { \"--is-active\": active },\n    otherProps.className,\n  );\n\n  return (\n    <Element ref={ref} onClick={onClick} {...otherProps}>\n      {Children.map(children, child => {\n        if (isValidElement(child)) {\n          const childClasses = classNames(\n            (child.props as { className?: string }).className,\n            classes,\n          );\n          return cloneElement(child as ReactElement<{ className?: string }>, {\n            className: childClasses,\n          });\n        }\n\n        return <span className={classes}>{child}</span>;\n      })}\n    </Element>\n  );\n};\n\nItem.displayName = \"DropdownMenu.Item\";\nexport { Item };\n"],
+  "mappings": ";AACA,SAAS,cAAc,gBAAgB,gBAAgB;AACvD,OAAO,gBAAgB;AA4CR;AA5Bf,IAAM,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,MAAiB;AAC7C,QAAM;AAAA,IACJ,aAAa,UAAU;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,IACA,EAAE,eAAe,OAAO;AAAA,IACxB,WAAW;AAAA,EACb;AAEA,SACE,oBAAC,WAAQ,KAAU,SAAmB,GAAG,YACtC,mBAAS,IAAI,UAAU,WAAS;AAC/B,QAAI,eAAe,KAAK,GAAG;AACzB,YAAM,eAAe;AAAA,QAClB,MAAM,MAAiC;AAAA,QACxC;AAAA,MACF;AACA,aAAO,aAAa,OAA+C;AAAA,QACjE,WAAW;AAAA,MACb,CAAC;AAAA,IACH;AAEA,WAAO,oBAAC,UAAK,WAAW,SAAU,iBAAM;AAAA,EAC1C,CAAC,GACH;AAEJ;AAEA,KAAK,cAAc;",
   "names": []
 }

package/dist/esm/{chunk-VHAA22YE.js → chunk-A7KFYNH6.js}

@@ -2,13 +2,11 @@ var __typeError = (msg) => {
   throw TypeError(msg);
 };
 var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
 
 export {
-  __privateGet,
   __privateAdd,
   __privateSet
 };
-//# sourceMappingURL=chunk-VHAA22YE.js.map
+//# sourceMappingURL=chunk-A7KFYNH6.js.map

package/dist/esm/{chunk-IQKS662C.js → chunk-AKCNBW55.js}

@@ -1,15 +1,15 @@
 import {
   adornmentWithClassName
-} from "./chunk-IM3I5CZL.js";
+} from "./chunk-I6CFRGID.js";
 import {
   ErrorMessage
 } from "./chunk-MZJT3USG.js";
-import {
-  Stack
-} from "./chunk-XH3OJQMW.js";
 import {
   Label
 } from "./chunk-ZN7OWLZY.js";
+import {
+  Stack
+} from "./chunk-XH3OJQMW.js";
 import {
   useTextField
 } from "./chunk-UYVF3QSW.js";
@@ -19,9 +19,10 @@ import {
 
 // src/components/TextField/TextField.tsx
 import classNames from "classnames/dedupe";
+import { memo } from "react";
 import "@simplybusiness/mobius/src/components/TextField/TextField.css";
 import { jsx, jsxs } from "react/jsx-runtime";
-var TextField = ({ ref, ...props }) => {
+var TextFieldInner = ({ ref, ...props }) => {
   const {
     isDisabled,
     type = "text",
@@ -115,9 +116,10 @@ var TextField = ({ ref, ...props }) => {
     /* @__PURE__ */ jsx(ErrorMessage, { ...errorMessageProps, errorMessage })
   ] });
 };
+var TextField = memo(TextFieldInner);
 TextField.displayName = "TextField";
 
 export {
   TextField
 };
-//# sourceMappingURL=chunk-IQKS662C.js.map
+//# sourceMappingURL=chunk-AKCNBW55.js.map

package/dist/esm/chunk-AKCNBW55.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/TextField/TextField.tsx"],
+  "sourcesContent": ["\"use client\";\n\nimport classNames from \"classnames/dedupe\";\nimport { memo } from \"react\";\nimport type {\n  HTMLInputTypeAttribute,\n  ReactElement,\n  ReactNode,\n  Ref,\n  RefAttributes,\n} from \"react\";\nimport type { UseTextFieldProps } from \"../../hooks\";\nimport { useTextField, useValidationClasses } from \"../../hooks\";\nimport type { DOMProps, FocusEvents } from \"../../types\";\nimport { ErrorMessage } from \"../ErrorMessage\";\nimport { Label } from \"../Label\";\nimport { Stack } from \"../Stack\";\nimport { adornmentWithClassName } from \"./adornmentWithClassName\";\nimport \"./TextField.css\";\n\nexport type TextFieldElementType = HTMLInputElement;\nexport interface TextFieldProps\n  extends\n    DOMProps,\n    FocusEvents,\n    UseTextFieldProps,\n    RefAttributes<TextFieldElementType> {\n  className?: string;\n  errorMessage?: string;\n  children?: ReactNode;\n  label?: string;\n  type?: Exclude<\n    HTMLInputTypeAttribute,\n    | \"button\"\n    | \"checkbox\"\n    | \"color\"\n    | \"date\"\n    | \"datetime-local\"\n    | \"file\"\n    | \"image\"\n    | \"month\"\n    | \"radio\"\n    | \"range\"\n    | \"reset\"\n    | \"submit\"\n    | \"week\"\n  >;\n  prefixInside?: ReactElement;\n  prefixOutside?: ReactElement;\n  suffixInside?: ReactElement;\n  suffixOutside?: ReactElement;\n}\n\nexport type TextFieldRef = Ref<TextFieldElementType>;\n\nconst TextFieldInner = ({ ref, ...props }: TextFieldProps) => {\n  const {\n    isDisabled,\n    type = \"text\",\n    isInvalid,\n    className,\n    label,\n    errorMessage,\n    children,\n    isRequired,\n    prefixInside,\n    prefixOutside,\n    suffixInside,\n    suffixOutside,\n    autoComplete,\n    isReadOnly,\n    ...otherProps\n  } = props;\n\n  const resolvedAutoComplete =\n    autoComplete ??\n    (type === \"email\" ? \"email\" : type === \"tel\" ? \"tel\" : undefined);\n\n  const { inputProps, labelProps, errorMessageProps } = useTextField({\n    ...props,\n    autoComplete: resolvedAutoComplete,\n    \"aria-errormessage\": errorMessage,\n  });\n\n  const hidden = type === \"hidden\";\n\n  const validationClasses = useValidationClasses({ isInvalid });\n\n  const textfieldClasses = {\n    \"--is-disabled\": isDisabled,\n    \"--is-required\": typeof isRequired === \"boolean\" && isRequired,\n    \"--is-optional\": typeof isRequired === \"boolean\" && !isRequired,\n    \"--is-hidden\": hidden,\n    [className || \"\"]: true,\n  };\n\n  const sharedClasses = classNames(validationClasses, textfieldClasses);\n\n  const labelClasses = classNames(\n    {\n      \"--is-disabled\": isDisabled,\n    },\n    validationClasses,\n  );\n\n  const containerClasses = classNames(\n    \"mobius\",\n    \"mobius-text-field\",\n    sharedClasses,\n  );\n\n  const inputClasses = classNames(\n    \"mobius\",\n    \"mobius-text-field__input\",\n    sharedClasses,\n  );\n\n  const inputWrapperClasses = classNames(\n    \"mobius-text-field__input-wrapper\",\n    sharedClasses,\n  );\n\n  return (\n    <Stack gap=\"xs\" className={containerClasses}>\n      {label && !hidden && (\n        <Label {...labelProps} className={labelClasses}>\n          {label}\n        </Label>\n      )}\n      <div className=\"mobius-text-field__inner-container\">\n        {adornmentWithClassName(\n          prefixOutside,\n          labelClasses,\n          \"mobius-text-field__prefix-outside\",\n        )}\n        <div className={inputWrapperClasses}>\n          {adornmentWithClassName(\n            prefixInside,\n            labelClasses,\n            \"mobius-text-field__prefix-inside\",\n          )}\n          <input\n            {...otherProps}\n            {...inputProps}\n            ref={ref}\n            type={type}\n            className={inputClasses}\n          />\n          {adornmentWithClassName(\n            suffixInside,\n            labelClasses,\n            \"mobius-text-field__suffix-inside\",\n          )}\n        </div>\n        {adornmentWithClassName(\n          suffixOutside,\n          labelClasses,\n          \"mobius-text-field__suffix-outside\",\n        )}\n      </div>\n      {children && (\n        <div className=\"mobius-text-field__children\">{children}</div>\n      )}\n\n      <ErrorMessage {...errorMessageProps} errorMessage={errorMessage} />\n    </Stack>\n  );\n};\n\nconst TextField = memo(TextFieldInner);\nTextField.displayName = \"TextField\";\nexport { TextField };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAEA,OAAO,gBAAgB;AACvB,SAAS,YAAY;AAerB,OAAO;AA2GC,cAUA,YAVA;AAtER,IAAM,iBAAiB,CAAC,EAAE,KAAK,GAAG,MAAM,MAAsB;AAC5D,QAAM;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,uBACJ,iBACC,SAAS,UAAU,UAAU,SAAS,QAAQ,QAAQ;AAEzD,QAAM,EAAE,YAAY,YAAY,kBAAkB,IAAI,aAAa;AAAA,IACjE,GAAG;AAAA,IACH,cAAc;AAAA,IACd,qBAAqB;AAAA,EACvB,CAAC;AAED,QAAM,SAAS,SAAS;AAExB,QAAM,oBAAoB,qBAAqB,EAAE,UAAU,CAAC;AAE5D,QAAM,mBAAmB;AAAA,IACvB,iBAAiB;AAAA,IACjB,iBAAiB,OAAO,eAAe,aAAa;AAAA,IACpD,iBAAiB,OAAO,eAAe,aAAa,CAAC;AAAA,IACrD,eAAe;AAAA,IACf,CAAC,aAAa,EAAE,GAAG;AAAA,EACrB;AAEA,QAAM,gBAAgB,WAAW,mBAAmB,gBAAgB;AAEpE,QAAM,eAAe;AAAA,IACnB;AAAA,MACE,iBAAiB;AAAA,IACnB;AAAA,IACA;AAAA,EACF;AAEA,QAAM,mBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,eAAe;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,sBAAsB;AAAA,IAC1B;AAAA,IACA;AAAA,EACF;AAEA,SACE,qBAAC,SAAM,KAAI,MAAK,WAAW,kBACxB;AAAA,aAAS,CAAC,UACT,oBAAC,SAAO,GAAG,YAAY,WAAW,cAC/B,iBACH;AAAA,IAEF,qBAAC,SAAI,WAAU,sCACZ;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACA,qBAAC,SAAI,WAAW,qBACb;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACE,GAAG;AAAA,YACH,GAAG;AAAA,YACJ;AAAA,YACA;AAAA,YACA,WAAW;AAAA;AAAA,QACb;AAAA,QACC;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,SACF;AAAA,MACC;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,OACF;AAAA,IACC,YACC,oBAAC,SAAI,WAAU,+BAA+B,UAAS;AAAA,IAGzD,oBAAC,gBAAc,GAAG,mBAAmB,cAA4B;AAAA,KACnE;AAEJ;AAEA,IAAM,YAAY,KAAK,cAAc;AACrC,UAAU,cAAc;",
+  "names": []
+}

package/dist/esm/{chunk-6JCU4CGA.js → chunk-AZUVQRYC.js}

@@ -1,12 +1,12 @@
 import {
   ErrorMessage
 } from "./chunk-MZJT3USG.js";
-import {
-  Stack
-} from "./chunk-XH3OJQMW.js";
 import {
   Label
 } from "./chunk-ZN7OWLZY.js";
+import {
+  Stack
+} from "./chunk-XH3OJQMW.js";
 import {
   TextAreaInput
 } from "./chunk-BM4M36KU.js";
@@ -61,4 +61,4 @@ TextArea.displayName = "TextArea";
 export {
   TextArea
 };
-//# sourceMappingURL=chunk-6JCU4CGA.js.map
+//# sourceMappingURL=chunk-AZUVQRYC.js.map

package/dist/esm/{chunk-XNEQHHNV.js → chunk-C2QJDKXS.js}

@@ -4,7 +4,7 @@ import {
 } from "./chunk-CI5GCPUG.js";
 import {
   TextField
-} from "./chunk-IQKS662C.js";
+} from "./chunk-AKCNBW55.js";
 import {
   mergeRefs
 } from "./chunk-QGGILW3D.js";
@@ -97,4 +97,4 @@ export {
   MIN_MAX_ERROR,
   DateField
 };
-//# sourceMappingURL=chunk-XNEQHHNV.js.map
+//# sourceMappingURL=chunk-C2QJDKXS.js.map

package/dist/esm/chunk-CTY6LDFI.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-CTY6LDFI.js.map

package/dist/esm/{chunk-KFHPI67N.js → chunk-GJBH37DH.js}

@@ -1,12 +1,12 @@
-import {
-  Header
-} from "./chunk-UZV5PZ7R.js";
 import {
   Content
 } from "./chunk-WHRUNWJI.js";
 import {
   Drawer
 } from "./chunk-VYQRTISC.js";
+import {
+  Header
+} from "./chunk-UZV5PZ7R.js";
 
 // src/components/Drawer/index.tsx
 var Drawer2 = Object.assign(Drawer, {
@@ -18,4 +18,4 @@ Drawer2.displayName = "Drawer";
 export {
   Drawer2 as Drawer
 };
-//# sourceMappingURL=chunk-KFHPI67N.js.map
+//# sourceMappingURL=chunk-GJBH37DH.js.map

package/dist/esm/{chunk-IM3I5CZL.js → chunk-I6CFRGID.js}

@@ -3,9 +3,10 @@ import classNames from "classnames/dedupe";
 import { cloneElement } from "react";
 var adornmentWithClassName = (component, validationClasses, className) => {
   if (!component) return null;
-  return cloneElement(component, {
+  const typedComponent = component;
+  return cloneElement(typedComponent, {
     className: classNames(
-      component.props.className,
+      typedComponent.props.className,
       validationClasses,
       className
     )
@@ -15,4 +16,4 @@ var adornmentWithClassName = (component, validationClasses, className) => {
 export {
   adornmentWithClassName
 };
-//# sourceMappingURL=chunk-IM3I5CZL.js.map
+//# sourceMappingURL=chunk-I6CFRGID.js.map

package/dist/esm/{chunk-IM3I5CZL.js.map → chunk-I6CFRGID.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/TextField/adornmentWithClassName.ts"],
-  "sourcesContent": ["import classNames from \"classnames/dedupe\";\nimport type { ReactElement } from \"react\";\nimport { cloneElement } from \"react\";\n\nexport const adornmentWithClassName = (\n  component?: ReactElement,\n  validationClasses?: string,\n  className?: string,\n) => {\n  if (!component) return null;\n\n  return cloneElement(component, {\n    className: classNames(\n      (component.props as { className?: string }).className,\n      validationClasses,\n      className,\n    ),\n  } as { className: string });\n};\n"],
-  "mappings": ";AAAA,OAAO,gBAAgB;AAEvB,SAAS,oBAAoB;AAEtB,IAAM,yBAAyB,CACpC,WACA,mBACA,cACG;AACH,MAAI,CAAC,UAAW,QAAO;AAEvB,SAAO,aAAa,WAAW;AAAA,IAC7B,WAAW;AAAA,MACR,UAAU,MAAiC;AAAA,MAC5C;AAAA,MACA;AAAA,IACF;AAAA,EACF,CAA0B;AAC5B;",
+  "sourcesContent": ["import classNames from \"classnames/dedupe\";\nimport type { ReactElement } from \"react\";\nimport { cloneElement } from \"react\";\n\nexport const adornmentWithClassName = (\n  component?: ReactElement,\n  validationClasses?: string,\n  className?: string,\n) => {\n  if (!component) return null;\n\n  const typedComponent = component as ReactElement<{ className?: string }>;\n  return cloneElement(typedComponent, {\n    className: classNames(\n      typedComponent.props.className,\n      validationClasses,\n      className,\n    ),\n  });\n};\n"],
+  "mappings": ";AAAA,OAAO,gBAAgB;AAEvB,SAAS,oBAAoB;AAEtB,IAAM,yBAAyB,CACpC,WACA,mBACA,cACG;AACH,MAAI,CAAC,UAAW,QAAO;AAEvB,QAAM,iBAAiB;AACvB,SAAO,aAAa,gBAAgB;AAAA,IAClC,WAAW;AAAA,MACT,eAAe,MAAM;AAAA,MACrB;AAAA,MACA;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
   "names": []
 }

package/dist/esm/{chunk-LGZWQZLS.js → chunk-IF7FRSC2.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-66ARYOY7.js";
 import {
   Combobox
-} from "./chunk-NEFRXIFY.js";
+} from "./chunk-53QMWUHB.js";
 import {
   Icon
 } from "./chunk-TKIP5Q5H.js";
@@ -93,4 +93,4 @@ AddressLookup.displayName = "AddressLookup";
 export {
   AddressLookup
 };
-//# sourceMappingURL=chunk-LGZWQZLS.js.map
+//# sourceMappingURL=chunk-IF7FRSC2.js.map

package/dist/esm/{chunk-OEDU5ZEA.js → chunk-KUH5AB5T.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-YGME6T3L.js";
 import {
   Item
-} from "./chunk-4HI2AOBC.js";
+} from "./chunk-6TSYA7CJ.js";
 
 // src/components/DropdownMenu/index.tsx
 var DropdownMenu2 = Object.assign(
@@ -17,4 +17,4 @@ DropdownMenu2.displayName = "DropdownMenu";
 export {
   DropdownMenu2 as DropdownMenu
 };
-//# sourceMappingURL=chunk-OEDU5ZEA.js.map
+//# sourceMappingURL=chunk-KUH5AB5T.js.map

package/dist/esm/chunk-L2X5IF3K.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-L2X5IF3K.js.map

package/dist/esm/chunk-L2X5IF3K.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/esm/{chunk-2HUMNED2.js → chunk-M3X3ECNH.js}

@@ -1,12 +1,12 @@
 import {
   ErrorMessage
 } from "./chunk-MZJT3USG.js";
-import {
-  Stack
-} from "./chunk-XH3OJQMW.js";
 import {
   Label
 } from "./chunk-ZN7OWLZY.js";
+import {
+  Stack
+} from "./chunk-XH3OJQMW.js";
 import {
   useValidationClasses
 } from "./chunk-DYOFXXZD.js";
@@ -154,4 +154,4 @@ RadioGroup.displayName = "RadioGroup";
 export {
   RadioGroup
 };
-//# sourceMappingURL=chunk-2HUMNED2.js.map
+//# sourceMappingURL=chunk-M3X3ECNH.js.map

package/dist/esm/chunk-NXWWQSZA.js

@@ -0,0 +1,82 @@
+import {
+  LoqateAddressLookupError
+} from "./chunk-EDSRI6SV.js";
+
+// 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 LoqateAddressLookupService = class {
+  /**
+   * Base URL for the Loqate API
+   */
+  #baseUrl;
+  /**
+   * API key for the Loqate API
+   */
+  #apiKey;
+  /**
+   * List of allowed country codes for the Loqate API
+   * 2 or 3 character ISO country codes
+   */
+  #countries;
+  /**
+   * Optional filters for the Loqate API
+   * E.g., { AdministrativeArea: "CA", PostalCode: "90210" }
+   */
+  #filters;
+  constructor({
+    baseUrl,
+    apiKey,
+    countries,
+    filters
+  }) {
+    this.#apiKey = apiKey;
+    this.#baseUrl = baseUrl || LOQATE_BASE_URL;
+    this.#countries = countries || DEFAULT_COUNTRIES;
+    this.#filters = filters;
+  }
+  fetchFromApi(url) {
+    return fetch(`${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 (!this.#filters || Object.keys(this.#filters).length === 0) {
+      return "";
+    }
+    const encodedFilters = Object.entries(this.#filters).map(([key, value]) => `${key}:${encodeURIComponent(value)}`).join("&");
+    return `&Filters=${encodedFilters}`;
+  }
+  search(searchTerm) {
+    let url = `${LOQATE_FIND_URL}?Key=${this.#apiKey}&Text=${searchTerm}&Countries=${this.#countries?.join(",")}`;
+    url += this.buildFiltersQuery();
+    return this.fetchFromApi(url);
+  }
+  findById(id) {
+    let url = `${LOQATE_FIND_URL}?Key=${this.#apiKey}&Container=${id}&Countries=${this.#countries?.join(",")}`;
+    url += this.buildFiltersQuery();
+    return this.fetchFromApi(url);
+  }
+  async get(id) {
+    const url = `${LOQATE_RETRIEVE_URL}?Key=${this.#apiKey}&Id=${id}`;
+    const response = await this.fetchFromApi(url);
+    return response.Items[0];
+  }
+};
+
+export {
+  LoqateAddressLookupService
+};
+//# sourceMappingURL=chunk-NXWWQSZA.js.map

package/dist/esm/{chunk-VVL4B2KD.js.map → chunk-NXWWQSZA.js.map}

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/components/AddressLookup/LoqateAddressLookupService.tsx"],
   "sourcesContent": ["import { LoqateAddressLookupError } from \"./LoqateAddressLookupError\";\nimport type {\n  LoqateAddressDetailsItem,\n  LoqateAddressDetailsResponse,\n  LoqateSearchResponse,\n} from \"./types\";\n\nconst LOQATE_BASE_URL = \"https://api.addressy.com/Capture/Interactive\";\nconst LOQATE_FIND_URL = \"/Find/v1.00/json3.ws\";\nconst LOQATE_RETRIEVE_URL = \"/Retrieve/v1.2/json3.ws\";\nconst DEFAULT_COUNTRIES = [\"GB\"];\n\nexport class LoqateAddressLookupService {\n  /**\n   * Base URL for the Loqate API\n   */\n  #baseUrl: string;\n\n  /**\n   * API key for the Loqate API\n   */\n  #apiKey?: string;\n\n  /**\n   * List of allowed country codes for the Loqate API\n   * 2 or 3 character ISO country codes\n   */\n  #countries?: string[];\n\n  /**\n   * Optional filters for the Loqate API\n   * E.g., { AdministrativeArea: \"CA\", PostalCode: \"90210\" }\n   */\n  #filters?: Record<string, string>;\n\n  constructor({\n    baseUrl,\n    apiKey,\n    countries,\n    filters,\n  }: {\n    baseUrl?: string;\n    apiKey?: string;\n    countries?: string[];\n    filters?: Record<string, string>;\n  }) {\n    this.#apiKey = apiKey;\n    this.#baseUrl = baseUrl || LOQATE_BASE_URL;\n    this.#countries = countries || DEFAULT_COUNTRIES;\n    this.#filters = filters;\n  }\n\n  private fetchFromApi<TResponse = unknown>(url: string): Promise<TResponse> {\n    return fetch(`${this.#baseUrl}${url}`)\n      .then(response => response.json())\n      .then(json => {\n        if (json.Items?.some((item: any) => item.Error)) {\n          throw new LoqateAddressLookupError(json);\n        }\n        return json;\n      });\n  }\n\n  /**\n   * Builds the Filters query parameter for Loqate API requests.\n   * - Filter keys (e.g., \"AdministrativeArea\", \"PostalCode\") are predefined by Loqate API (no need to encode)\n   * - Filter values (e.g., \"New York\", \"90210\") contain user input that may have special characters (need encoding)\n   *\n   * @returns Empty string if no filters, otherwise \"&Filters=key1:value1&key2:value2\" (Loqate's expected format for Filters)\n   */\n  private buildFiltersQuery(): string {\n    if (!this.#filters || Object.keys(this.#filters).length === 0) {\n      return \"\";\n    }\n\n    // Transform Record<string, string> to Loqate's \"key:value&key:value\" format\n    const encodedFilters = Object.entries(this.#filters)\n      .map(([key, value]) => `${key}:${encodeURIComponent(value)}`)\n      .join(\"&\");\n\n    return `&Filters=${encodedFilters}`;\n  }\n\n  search(searchTerm: string): Promise<LoqateSearchResponse> {\n    let url = `${LOQATE_FIND_URL}?Key=${this.#apiKey}&Text=${searchTerm}&Countries=${this.#countries?.join(\",\")}`;\n    url += this.buildFiltersQuery();\n    return this.fetchFromApi<LoqateSearchResponse>(url);\n  }\n\n  findById(id: string): Promise<LoqateSearchResponse> {\n    let url = `${LOQATE_FIND_URL}?Key=${this.#apiKey}&Container=${id}&Countries=${this.#countries?.join(\",\")}`;\n    url += this.buildFiltersQuery();\n    return this.fetchFromApi<LoqateSearchResponse>(url);\n  }\n\n  async get(id: string): Promise<LoqateAddressDetailsItem> {\n    const url = `${LOQATE_RETRIEVE_URL}?Key=${this.#apiKey}&Id=${id}`;\n    const response = await this.fetchFromApi<LoqateAddressDetailsResponse>(url);\n    return response.Items[0];\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;AAOA,IAAM,kBAAkB;AACxB,IAAM,kBAAkB;AACxB,IAAM,sBAAsB;AAC5B,IAAM,oBAAoB,CAAC,IAAI;AAV/B;AAYO,IAAM,6BAAN,MAAiC;AAAA,EAuBtC,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GAKG;AA7BH;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AAAA;AAaE,uBAAK,SAAU;AACf,uBAAK,UAAW,WAAW;AAC3B,uBAAK,YAAa,aAAa;AAC/B,uBAAK,UAAW;AAAA,EAClB;AAAA,EAEQ,aAAkC,KAAiC;AACzE,WAAO,MAAM,GAAG,mBAAK,SAAQ,GAAG,GAAG,EAAE,EAClC,KAAK,cAAY,SAAS,KAAK,CAAC,EAChC,KAAK,UAAQ;AACZ,UAAI,KAAK,OAAO,KAAK,CAAC,SAAc,KAAK,KAAK,GAAG;AAC/C,cAAM,IAAI,yBAAyB,IAAI;AAAA,MACzC;AACA,aAAO;AAAA,IACT,CAAC;AAAA,EACL;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASQ,oBAA4B;AAClC,QAAI,CAAC,mBAAK,aAAY,OAAO,KAAK,mBAAK,SAAQ,EAAE,WAAW,GAAG;AAC7D,aAAO;AAAA,IACT;AAGA,UAAM,iBAAiB,OAAO,QAAQ,mBAAK,SAAQ,EAChD,IAAI,CAAC,CAAC,KAAK,KAAK,MAAM,GAAG,GAAG,IAAI,mBAAmB,KAAK,CAAC,EAAE,EAC3D,KAAK,GAAG;AAEX,WAAO,YAAY,cAAc;AAAA,EACnC;AAAA,EAEA,OAAO,YAAmD;AACxD,QAAI,MAAM,GAAG,eAAe,QAAQ,mBAAK,QAAO,SAAS,UAAU,cAAc,mBAAK,aAAY,KAAK,GAAG,CAAC;AAC3G,WAAO,KAAK,kBAAkB;AAC9B,WAAO,KAAK,aAAmC,GAAG;AAAA,EACpD;AAAA,EAEA,SAAS,IAA2C;AAClD,QAAI,MAAM,GAAG,eAAe,QAAQ,mBAAK,QAAO,cAAc,EAAE,cAAc,mBAAK,aAAY,KAAK,GAAG,CAAC;AACxG,WAAO,KAAK,kBAAkB;AAC9B,WAAO,KAAK,aAAmC,GAAG;AAAA,EACpD;AAAA,EAEA,MAAM,IAAI,IAA+C;AACvD,UAAM,MAAM,GAAG,mBAAmB,QAAQ,mBAAK,QAAO,OAAO,EAAE;AAC/D,UAAM,WAAW,MAAM,KAAK,aAA2C,GAAG;AAC1E,WAAO,SAAS,MAAM,CAAC;AAAA,EACzB;AACF;AApFE;AAKA;AAMA;AAMA;",
+  "mappings": ";;;;;AAOA,IAAM,kBAAkB;AACxB,IAAM,kBAAkB;AACxB,IAAM,sBAAsB;AAC5B,IAAM,oBAAoB,CAAC,IAAI;AAExB,IAAM,6BAAN,MAAiC;AAAA;AAAA;AAAA;AAAA,EAItC;AAAA;AAAA;AAAA;AAAA,EAKA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA;AAAA,EAEA,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GAKG;AACD,SAAK,UAAU;AACf,SAAK,WAAW,WAAW;AAC3B,SAAK,aAAa,aAAa;AAC/B,SAAK,WAAW;AAAA,EAClB;AAAA,EAEQ,aAAkC,KAAiC;AACzE,WAAO,MAAM,GAAG,KAAK,QAAQ,GAAG,GAAG,EAAE,EAClC,KAAK,cAAY,SAAS,KAAK,CAAC,EAChC,KAAK,UAAQ;AACZ,UAAI,KAAK,OAAO,KAAK,CAAC,SAAc,KAAK,KAAK,GAAG;AAC/C,cAAM,IAAI,yBAAyB,IAAI;AAAA,MACzC;AACA,aAAO;AAAA,IACT,CAAC;AAAA,EACL;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASQ,oBAA4B;AAClC,QAAI,CAAC,KAAK,YAAY,OAAO,KAAK,KAAK,QAAQ,EAAE,WAAW,GAAG;AAC7D,aAAO;AAAA,IACT;AAGA,UAAM,iBAAiB,OAAO,QAAQ,KAAK,QAAQ,EAChD,IAAI,CAAC,CAAC,KAAK,KAAK,MAAM,GAAG,GAAG,IAAI,mBAAmB,KAAK,CAAC,EAAE,EAC3D,KAAK,GAAG;AAEX,WAAO,YAAY,cAAc;AAAA,EACnC;AAAA,EAEA,OAAO,YAAmD;AACxD,QAAI,MAAM,GAAG,eAAe,QAAQ,KAAK,OAAO,SAAS,UAAU,cAAc,KAAK,YAAY,KAAK,GAAG,CAAC;AAC3G,WAAO,KAAK,kBAAkB;AAC9B,WAAO,KAAK,aAAmC,GAAG;AAAA,EACpD;AAAA,EAEA,SAAS,IAA2C;AAClD,QAAI,MAAM,GAAG,eAAe,QAAQ,KAAK,OAAO,cAAc,EAAE,cAAc,KAAK,YAAY,KAAK,GAAG,CAAC;AACxG,WAAO,KAAK,kBAAkB;AAC9B,WAAO,KAAK,aAAmC,GAAG;AAAA,EACpD;AAAA,EAEA,MAAM,IAAI,IAA+C;AACvD,UAAM,MAAM,GAAG,mBAAmB,QAAQ,KAAK,OAAO,OAAO,EAAE;AAC/D,UAAM,WAAW,MAAM,KAAK,aAA2C,GAAG;AAC1E,WAAO,SAAS,MAAM,CAAC;AAAA,EACzB;AACF;",
   "names": []
 }

package/dist/esm/{chunk-JFDDW3IV.js → chunk-P7TPNRU4.js}

@@ -14,13 +14,9 @@ var Breadcrumbs = ({ ref, ...props }) => {
     otherProps.className
   );
   return /* @__PURE__ */ jsx("nav", { ref, ...otherProps, ...navProps, className: classes, children: /* @__PURE__ */ jsx("ul", { children: childArray.map(
-    (child, i) => cloneElement(
-      child,
-      {
-        key: i,
-        isCurrent: i === childArray.length - 1
-      }
-    )
+    (child, i) => cloneElement(child, {
+      isCurrent: i === childArray.length - 1
+    })
   ) }) });
 };
 Breadcrumbs.displayName = "Breadcrumbs";
@@ -28,4 +24,4 @@ Breadcrumbs.displayName = "Breadcrumbs";
 export {
   Breadcrumbs
 };
-//# sourceMappingURL=chunk-JFDDW3IV.js.map
+//# sourceMappingURL=chunk-P7TPNRU4.js.map

package/dist/esm/{chunk-JFDDW3IV.js.map → chunk-P7TPNRU4.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/Breadcrumbs/Breadcrumbs.tsx"],
-  "sourcesContent": ["\"use client\";\n\nimport type { ReactElement, RefAttributes, ReactNode } from \"react\";\nimport { Children, cloneElement } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport \"./Breadcrumbs.css\";\n\nexport type BreadcrumbsElementType = HTMLElement;\n\nexport interface BreadcrumbsProps extends RefAttributes<BreadcrumbsElementType> {\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  children?: ReactNode;\n  \"aria-label\"?: string;\n}\n\nconst Breadcrumbs = ({ ref, ...props }: BreadcrumbsProps) => {\n  const { \"aria-label\": ariaLabel = \"Breadcrumbs\" } = props;\n  const { navProps } = { navProps: { \"aria-label\": ariaLabel } };\n  const { children, ...otherProps } = props;\n  const childArray = Children.toArray(children);\n\n  // Reshape class name and apply to outer element\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-breadcrumb\",\n    otherProps.className,\n  );\n\n  return (\n    <nav ref={ref} {...otherProps} {...navProps} className={classes}>\n      <ul>\n        {childArray.map((child, i) =>\n          cloneElement(\n            child as ReactElement,\n            {\n              key: i,\n              isCurrent: i === childArray.length - 1,\n            } as { key: number; isCurrent: boolean },\n          ),\n        )}\n      </ul>\n    </nav>\n  );\n};\n\nBreadcrumbs.displayName = \"Breadcrumbs\";\nexport { Breadcrumbs };\n"],
-  "mappings": ";AAGA,SAAS,UAAU,oBAAoB;AACvC,OAAO,gBAAgB;AACvB,OAAO;AA0BD;AAfN,IAAM,cAAc,CAAC,EAAE,KAAK,GAAG,MAAM,MAAwB;AAC3D,QAAM,EAAE,cAAc,YAAY,cAAc,IAAI;AACpD,QAAM,EAAE,SAAS,IAAI,EAAE,UAAU,EAAE,cAAc,UAAU,EAAE;AAC7D,QAAM,EAAE,UAAU,GAAG,WAAW,IAAI;AACpC,QAAM,aAAa,SAAS,QAAQ,QAAQ;AAG5C,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,IACA,WAAW;AAAA,EACb;AAEA,SACE,oBAAC,SAAI,KAAW,GAAG,YAAa,GAAG,UAAU,WAAW,SACtD,8BAAC,QACE,qBAAW;AAAA,IAAI,CAAC,OAAO,MACtB;AAAA,MACE;AAAA,MACA;AAAA,QACE,KAAK;AAAA,QACL,WAAW,MAAM,WAAW,SAAS;AAAA,MACvC;AAAA,IACF;AAAA,EACF,GACF,GACF;AAEJ;AAEA,YAAY,cAAc;",
+  "sourcesContent": ["\"use client\";\n\nimport type { ReactElement, RefAttributes, ReactNode } from \"react\";\nimport { Children, cloneElement } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport \"./Breadcrumbs.css\";\n\nexport type BreadcrumbsElementType = HTMLElement;\n\nexport interface BreadcrumbsProps extends RefAttributes<BreadcrumbsElementType> {\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  children?: ReactNode;\n  \"aria-label\"?: string;\n}\n\nconst Breadcrumbs = ({ ref, ...props }: BreadcrumbsProps) => {\n  const { \"aria-label\": ariaLabel = \"Breadcrumbs\" } = props;\n  const { navProps } = { navProps: { \"aria-label\": ariaLabel } };\n  const { children, ...otherProps } = props;\n  const childArray = Children.toArray(children);\n\n  // Reshape class name and apply to outer element\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-breadcrumb\",\n    otherProps.className,\n  );\n\n  return (\n    <nav ref={ref} {...otherProps} {...navProps} className={classes}>\n      <ul>\n        {childArray.map((child, i) =>\n          cloneElement(child as ReactElement<{ isCurrent?: boolean }>, {\n            isCurrent: i === childArray.length - 1,\n          }),\n        )}\n      </ul>\n    </nav>\n  );\n};\n\nBreadcrumbs.displayName = \"Breadcrumbs\";\nexport { Breadcrumbs };\n"],
+  "mappings": ";AAGA,SAAS,UAAU,oBAAoB;AACvC,OAAO,gBAAgB;AACvB,OAAO;AA0BD;AAfN,IAAM,cAAc,CAAC,EAAE,KAAK,GAAG,MAAM,MAAwB;AAC3D,QAAM,EAAE,cAAc,YAAY,cAAc,IAAI;AACpD,QAAM,EAAE,SAAS,IAAI,EAAE,UAAU,EAAE,cAAc,UAAU,EAAE;AAC7D,QAAM,EAAE,UAAU,GAAG,WAAW,IAAI;AACpC,QAAM,aAAa,SAAS,QAAQ,QAAQ;AAG5C,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,IACA,WAAW;AAAA,EACb;AAEA,SACE,oBAAC,SAAI,KAAW,GAAG,YAAa,GAAG,UAAU,WAAW,SACtD,8BAAC,QACE,qBAAW;AAAA,IAAI,CAAC,OAAO,MACtB,aAAa,OAAgD;AAAA,MAC3D,WAAW,MAAM,WAAW,SAAS;AAAA,IACvC,CAAC;AAAA,EACH,GACF,GACF;AAEJ;AAEA,YAAY,cAAc;",
   "names": []
 }

package/dist/esm/{chunk-VZ3IWSK6.js → chunk-Q5RB4O4S.js}

@@ -1,18 +1,18 @@
 import {
   Button
 } from "./chunk-FD3JTY5L.js";
-import {
-  useAutoUpdate
-} from "./chunk-K3ECDAUR.js";
-import {
-  useFloatingPosition
-} from "./chunk-26KZYRE6.js";
 import {
   useOutsidePress
 } from "./chunk-WYJP7HVL.js";
 import {
   Arrow
 } from "./chunk-CAL44W47.js";
+import {
+  useAutoUpdate
+} from "./chunk-K3ECDAUR.js";
+import {
+  useFloatingPosition
+} from "./chunk-26KZYRE6.js";
 import {
   Icon
 } from "./chunk-TKIP5Q5H.js";
@@ -155,4 +155,4 @@ var Popover = (props) => {
 export {
   Popover
 };
-//# sourceMappingURL=chunk-VZ3IWSK6.js.map
+//# sourceMappingURL=chunk-Q5RB4O4S.js.map

package/dist/esm/{chunk-S4CU4XRB.js → chunk-RBB3WHBJ.js}

@@ -1,6 +1,6 @@
 import {
   TextField
-} from "./chunk-IQKS662C.js";
+} from "./chunk-AKCNBW55.js";
 
 // src/components/NumberField/NumberField.tsx
 import classNames from "classnames/dedupe";
@@ -94,4 +94,4 @@ NumberField.displayName = "NumberField";
 export {
   NumberField
 };
-//# sourceMappingURL=chunk-S4CU4XRB.js.map
+//# sourceMappingURL=chunk-RBB3WHBJ.js.map

package/dist/esm/{chunk-GV36OVX7.js → chunk-TQWUPLN6.js}

@@ -1,6 +1,6 @@
 import {
   TextField
-} from "./chunk-IQKS662C.js";
+} from "./chunk-AKCNBW55.js";
 
 // src/components/MaskedField/index.tsx
 import loadable from "@loadable/component";
@@ -38,4 +38,4 @@ MaskedField.displayName = "MaskedField";
 export {
   MaskedField
 };
-//# sourceMappingURL=chunk-GV36OVX7.js.map
+//# sourceMappingURL=chunk-TQWUPLN6.js.map

package/dist/esm/{chunk-X4CMSAET.js → chunk-YEZ6KR3Q.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-WC3D5GNN.js";
 import {
   TextField
-} from "./chunk-IQKS662C.js";
+} from "./chunk-AKCNBW55.js";
 import {
   mergeRefs
 } from "./chunk-QGGILW3D.js";
@@ -51,4 +51,4 @@ PasswordField.displayName = "PasswordField";
 export {
   PasswordField
 };
-//# sourceMappingURL=chunk-X4CMSAET.js.map
+//# sourceMappingURL=chunk-YEZ6KR3Q.js.map

package/dist/esm/chunk-YWFAKGQQ.js

@@ -0,0 +1,19 @@
+// src/components/StickyOnMobile/StickyOnMobile.tsx
+import classNames from "classnames/dedupe";
+import "@simplybusiness/mobius/src/components/StickyOnMobile/StickyOnMobile.css";
+import { jsx } from "react/jsx-runtime";
+var StickyOnMobile = ({ ref, ...props }) => {
+  const { elementType: Element = "div", ...otherProps } = props;
+  const classes = classNames(
+    "mobius",
+    "mobius-sticky-on-mobile",
+    otherProps.className
+  );
+  return /* @__PURE__ */ jsx(Element, { ref, ...otherProps, className: classes });
+};
+StickyOnMobile.displayName = "StickyOnMobile";
+
+export {
+  StickyOnMobile
+};
+//# sourceMappingURL=chunk-YWFAKGQQ.js.map

package/dist/esm/chunk-YWFAKGQQ.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/StickyOnMobile/StickyOnMobile.tsx"],
+  "sourcesContent": ["import type {\n  RefAttributes,\n  ReactNode,\n  ElementType,\n  CSSProperties,\n  HTMLAttributes,\n} from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport \"./StickyOnMobile.css\";\n\nexport type StickyOnMobileElementType = HTMLElement;\n\nexport interface StickyOnMobileProps\n  extends\n    HTMLAttributes<StickyOnMobileElementType>,\n    RefAttributes<StickyOnMobileElementType> {\n  children?: ReactNode;\n  /** HTML element to render. Defaults to `div`. */\n  elementType?: ElementType;\n  className?: string;\n  style?: CSSProperties;\n}\n\nconst StickyOnMobile = ({ ref, ...props }: StickyOnMobileProps) => {\n  const { elementType: Element = \"div\", ...otherProps } = props;\n\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-sticky-on-mobile\",\n    otherProps.className,\n  );\n\n  return <Element ref={ref} {...otherProps} className={classes} />;\n};\n\nStickyOnMobile.displayName = \"StickyOnMobile\";\nexport { StickyOnMobile };\n"],
+  "mappings": ";AAOA,OAAO,gBAAgB;AACvB,OAAO;AAwBE;AATT,IAAM,iBAAiB,CAAC,EAAE,KAAK,GAAG,MAAM,MAA2B;AACjE,QAAM,EAAE,aAAa,UAAU,OAAO,GAAG,WAAW,IAAI;AAExD,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,IACA,WAAW;AAAA,EACb;AAEA,SAAO,oBAAC,WAAQ,KAAW,GAAG,YAAY,WAAW,SAAS;AAChE;AAEA,eAAe,cAAc;",
+  "names": []
+}

package/dist/esm/{chunk-P6YHEIFT.js → chunk-ZLAAOGRQ.js}

@@ -1,12 +1,12 @@
 import {
   ErrorMessage
 } from "./chunk-MZJT3USG.js";
-import {
-  Stack
-} from "./chunk-XH3OJQMW.js";
 import {
   Label
 } from "./chunk-ZN7OWLZY.js";
+import {
+  Stack
+} from "./chunk-XH3OJQMW.js";
 import {
   Icon
 } from "./chunk-TKIP5Q5H.js";
@@ -103,4 +103,4 @@ Select.displayName = "Select";
 export {
   Select
 };
-//# sourceMappingURL=chunk-P6YHEIFT.js.map
+//# sourceMappingURL=chunk-ZLAAOGRQ.js.map