@simplybusiness/mobius 10.4.3 → 10.5.0

package/dist/cjs/components/AddressLookup/index.js

@@ -5,9 +5,6 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __typeError = (msg) => {
-  throw TypeError(msg);
-};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -29,10 +26,6 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-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);
 
 // src/components/AddressLookup/index.tsx
 var AddressLookup_exports = {};
@@ -44,12 +37,12 @@ module.exports = __toCommonJS(AddressLookup_exports);
 
 // src/components/AddressLookup/AddressLookup.tsx
 var import_icons2 = require("@simplybusiness/icons");
-var import_react10 = require("react");
+var import_react11 = require("react");
 
 // src/components/Combobox/Combobox.tsx
 var import_mobius_hooks3 = require("@simplybusiness/mobius-hooks");
 var import_dedupe11 = __toESM(require("classnames/dedupe"));
-var import_react9 = require("react");
+var import_react10 = require("react");
 
 // src/hooks/useBreakpoint/useBreakpoint.tsx
 var import_mobius_hooks = require("@simplybusiness/mobius-hooks");
@@ -241,6 +234,7 @@ var useValidationClasses = (props) => {
 
 // src/components/TextField/TextField.tsx
 var import_dedupe8 = __toESM(require("classnames/dedupe"));
+var import_react6 = require("react");
 
 // src/components/ErrorMessage/ErrorMessage.tsx
 var import_icons = require("@simplybusiness/icons");
@@ -458,9 +452,10 @@ var import_dedupe7 = __toESM(require("classnames/dedupe"));
 var import_react5 = require("react");
 var adornmentWithClassName = (component, validationClasses, className) => {
   if (!component) return null;
-  return (0, import_react5.cloneElement)(component, {
+  const typedComponent = component;
+  return (0, import_react5.cloneElement)(typedComponent, {
     className: (0, import_dedupe7.default)(
-      component.props.className,
+      typedComponent.props.className,
       validationClasses,
       className
     )
@@ -470,7 +465,7 @@ var adornmentWithClassName = (component, validationClasses, className) => {
 // src/components/TextField/TextField.tsx
 var import_TextField = require("@simplybusiness/mobius/src/components/TextField/TextField.css");
 var import_jsx_runtime7 = require("react/jsx-runtime");
-var TextField = ({ ref, ...props }) => {
+var TextFieldInner = ({ ref, ...props }) => {
   const {
     isDisabled,
     type = "text",
@@ -564,6 +559,7 @@ var TextField = ({ ref, ...props }) => {
     /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorMessage, { ...errorMessageProps, errorMessage })
   ] });
 };
+var TextField = (0, import_react6.memo)(TextFieldInner);
 TextField.displayName = "TextField";
 
 // src/components/VisuallyHidden/VisuallyHidden.tsx
@@ -601,7 +597,7 @@ function VisuallyHidden(props) {
 var import_dedupe10 = __toESM(require("classnames/dedupe"));
 
 // src/components/Combobox/Option.tsx
-var import_react6 = require("react");
+var import_react7 = require("react");
 var import_dedupe9 = __toESM(require("classnames/dedupe"));
 
 // src/components/Combobox/utils.tsx
@@ -636,13 +632,13 @@ var Option = ({
   optionTestIdPrefix,
   id
 }) => {
-  const optionRef = (0, import_react6.useRef)(null);
+  const optionRef = (0, import_react7.useRef)(null);
   const optionValue = getOptionValue(option) || "";
   const testId = buildOptionTestId(
     optionTestIdPrefix || "combobox-option",
     optionValue
   );
-  (0, import_react6.useEffect)(() => {
+  (0, import_react7.useEffect)(() => {
     if (isHighlighted && optionRef.current && optionRef.current.scrollIntoView) {
       optionRef.current.scrollIntoView({ block: "nearest" });
     }
@@ -746,12 +742,12 @@ var Listbox = ({
 };
 
 // src/components/Combobox/useComboboxHighlight.tsx
-var import_react7 = require("react");
+var import_react8 = require("react");
 function useComboboxHighlight(options) {
-  const [highlightedIndex, setHighlightedIndex] = (0, import_react7.useState)(
+  const [highlightedIndex, setHighlightedIndex] = (0, import_react8.useState)(
     options && options.length ? 0 : -1
   );
-  const [highlightedGroupIndex, setHighlightedGroupIndex] = (0, import_react7.useState)(0);
+  const [highlightedGroupIndex, setHighlightedGroupIndex] = (0, import_react8.useState)(0);
   function highlightNextOption() {
     const isGroup = isOptionGroup(options);
     if (!options) {
@@ -830,7 +826,7 @@ function useComboboxHighlight(options) {
 
 // src/components/Combobox/useComboboxOptions.ts
 var import_mobius_hooks2 = require("@simplybusiness/mobius-hooks");
-var import_react8 = require("react");
+var import_react9 = require("react");
 function useComboboxOptions({
   options,
   asyncOptions,
@@ -840,19 +836,19 @@ function useComboboxOptions({
   skipNextDebounceRef,
   onSearched
 }) {
-  const [filteredOptions, setFilteredOptions] = (0, import_react8.useState)(void 0);
+  const [filteredOptions, setFilteredOptions] = (0, import_react9.useState)(void 0);
   const debouncedInputValue = (0, import_mobius_hooks2.useDebouncedValue)(
     inputValue,
     // Don't debounce synchronous options
     options ? 0 : delay
   );
-  const [isLoading, setIsLoading] = (0, import_react8.useState)(false);
-  const [error2, setError] = (0, import_react8.useState)(null);
-  const asyncOptionsRef = (0, import_react8.useRef)(asyncOptions);
+  const [isLoading, setIsLoading] = (0, import_react9.useState)(false);
+  const [error2, setError] = (0, import_react9.useState)(null);
+  const asyncOptionsRef = (0, import_react9.useRef)(asyncOptions);
   asyncOptionsRef.current = asyncOptions;
-  const onSearchedRef = (0, import_react8.useRef)(onSearched);
+  const onSearchedRef = (0, import_react9.useRef)(onSearched);
   onSearchedRef.current = onSearched;
-  (0, import_react8.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     const controller = new AbortController();
     const { signal } = controller;
     const fetchOptions = async () => {
@@ -939,11 +935,11 @@ var ComboboxInner = ({
     errorMessage,
     ...otherProps
   } = props;
-  const skipNextDebounceRef = (0, import_react9.useRef)(false);
-  const fallbackRef = (0, import_react9.useRef)(null);
-  const [inputValue, setInputValue] = (0, import_react9.useState)(defaultValue || "");
-  const [isOpen, setIsOpen] = (0, import_react9.useState)(false);
-  const [isChanging, setIsChanging] = (0, import_react9.useState)(false);
+  const skipNextDebounceRef = (0, import_react10.useRef)(false);
+  const fallbackRef = (0, import_react10.useRef)(null);
+  const [inputValue, setInputValue] = (0, import_react10.useState)(defaultValue || "");
+  const [isOpen, setIsOpen] = (0, import_react10.useState)(false);
+  const [isChanging, setIsChanging] = (0, import_react10.useState)(false);
   const { filteredOptions, updateFilteredOptions, isLoading, error: error2 } = useComboboxOptions({
     options,
     asyncOptions,
@@ -952,7 +948,7 @@ var ComboboxInner = ({
     minSearchLength,
     skipNextDebounceRef
   });
-  const [validationError, setValidationError] = (0, import_react9.useState)(
+  const [validationError, setValidationError] = (0, import_react10.useState)(
     error2?.message || errorMessage
   );
   const {
@@ -965,14 +961,14 @@ var ComboboxInner = ({
     clearHighlight
   } = useComboboxHighlight(filteredOptions);
   const inputRef = ref || fallbackRef;
-  const listboxId = (0, import_react9.useId)();
-  const statusId = (0, import_react9.useId)();
-  const blurTimeoutRef = (0, import_react9.useRef)(null);
-  const userInteractedRef = (0, import_react9.useRef)(false);
-  const justSelectedRef = (0, import_react9.useRef)(false);
+  const listboxId = (0, import_react10.useId)();
+  const statusId = (0, import_react10.useId)();
+  const blurTimeoutRef = (0, import_react10.useRef)(null);
+  const userInteractedRef = (0, import_react10.useRef)(false);
+  const justSelectedRef = (0, import_react10.useRef)(false);
   const { down } = useBreakpoint();
   const isMobile = down("md");
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     setValidationError(error2?.message || errorMessage);
   }, [error2, errorMessage]);
   const getEmptyValue = () => {
@@ -1001,7 +997,7 @@ var ComboboxInner = ({
       justSelectedRef.current = false;
     }
   };
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (!inputRef || typeof inputRef === "function") return;
     const inputElement = inputRef.current;
     if (!inputElement) return;
@@ -1154,12 +1150,12 @@ var ComboboxInner = ({
       default:
     }
   };
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (value) {
       setInputValue(value);
     }
   }, [value]);
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (asyncOptions && isChanging) {
       setIsOpen(!!filteredOptions && filteredOptions.length > 0);
     }
@@ -1270,15 +1266,15 @@ var AddressLookup = ({
   errorMessage,
   ...otherProps
 }) => {
-  const [error2, _setError] = (0, import_react10.useState)(null);
-  const setError = (0, import_react10.useCallback)(
+  const [error2, _setError] = (0, import_react11.useState)(null);
+  const setError = (0, import_react11.useCallback)(
     (newError) => {
       if (newError != null) onError?.(newError);
       _setError(newError);
     },
     [onError]
   );
-  const asyncOptions = (0, import_react10.useCallback)(
+  const asyncOptions = (0, import_react11.useCallback)(
     async (searchTerm) => {
       try {
         const response = await addressLookupService.search(searchTerm);
@@ -1334,39 +1330,38 @@ 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 {
+  /**
+   * 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
   }) {
-    /**
-     * 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);
+    this.#apiKey = apiKey;
+    this.#baseUrl = baseUrl || LOQATE_BASE_URL;
+    this.#countries = countries || DEFAULT_COUNTRIES;
+    this.#filters = filters;
   }
   fetchFromApi(url) {
-    return fetch(`${__privateGet(this, _baseUrl)}${url}`).then((response) => response.json()).then((json) => {
+    return fetch(`${this.#baseUrl}${url}`).then((response) => response.json()).then((json) => {
       if (json.Items?.some((item) => item.Error)) {
         throw new LoqateAddressLookupError(json);
       }
@@ -1381,30 +1376,26 @@ var LoqateAddressLookupService = class {
    * @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) {
+    if (!this.#filters || Object.keys(this.#filters).length === 0) {
       return "";
     }
-    const encodedFilters = Object.entries(__privateGet(this, _filters)).map(([key, value]) => `${key}:${encodeURIComponent(value)}`).join("&");
+    const encodedFilters = Object.entries(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(",")}`;
+    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=${__privateGet(this, _apiKey)}&Container=${id}&Countries=${__privateGet(this, _countries)?.join(",")}`;
+    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=${__privateGet(this, _apiKey)}&Id=${id}`;
+    const url = `${LOQATE_RETRIEVE_URL}?Key=${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();
 //# sourceMappingURL=index.js.map