@pega/cosmos-react-core 3.0.0-dev.8.0 → 3.0.0-dev.9.0

package/lib/components/Number/utils.js

@@ -14,46 +14,32 @@ export function getFraction(value) {
     const substrLength = decPos === -1 ? value.length : decPos;
     return value.substring(substrLength);
 }
-export function getCleanedValue(value, decimal, maximumFractionDigits) {
-    const regex = new RegExp(`[^-\\d${decimal}]`, 'g');
-    value = value.trim().replace(regex, '');
-    if (decimal) {
-        const decimalString = new RegExp(`\\${decimal}`, 'g');
-        value = value.replace(decimalString, '.');
-    }
-    if (value.startsWith('.'))
-        value = `0${value}`;
-    if (value.startsWith('-.'))
-        value = `-0${value.substring(1)}`;
-    const match = value.match(new RegExp(`-?\\d*(\\.\\d{0,${maximumFractionDigits}})?`));
+export function getCleanedValue(value, decimalSign, maximumFractionDigits) {
+    let rawValue = value.replace(new RegExp(`[^${decimalSign}\\d-]+`, 'gu'), '');
+    if (decimalSign && decimalSign !== '.')
+        rawValue = rawValue.replace(decimalSign, '.');
+    if (rawValue.startsWith('.'))
+        rawValue = `0${value}`;
+    if (rawValue.startsWith('-.'))
+        rawValue = `-0${value.substring(1)}`;
+    const match = rawValue.match(new RegExp(`-?\\d*(\\.\\d{0,${maximumFractionDigits}})?`));
     if (match && match.length > 0) {
-        value = match[0];
+        rawValue = match[0];
     }
-    return value;
+    return rawValue;
 }
 export function getFormattedValue(value, locale, showGroupSeparators, maximumFractionDigits = 0) {
     let valueNumber;
-    let sign = '';
-    const cleanedValue = getCleanedValue(value, '.', maximumFractionDigits);
-    let integer = getInteger(cleanedValue);
+    const integer = getInteger(value);
     const decimal = getDecimal(locale);
-    const fractionPart = getFraction(cleanedValue).replace('.', decimal);
-    if (integer && integer.startsWith('-')) {
-        sign = '-';
-        integer = integer.substring(1);
-    }
-    if (!integer && maximumFractionDigits && fractionPart.startsWith(decimal)) {
-        integer = '0';
-    }
-    if (cleanedValue && !Number.isNaN(parseFloat(integer))) {
+    const fractionPart = getFraction(value).replace('.', decimal);
+    if (value && !Number.isNaN(parseFloat(integer))) {
         valueNumber = BigInt(integer);
-        return (sign +
-            new Intl.NumberFormat(locale, { useGrouping: showGroupSeparators })
-                .format(valueNumber)
-                .trim() +
-            (maximumFractionDigits ? fractionPart : ''));
+        return (new Intl.NumberFormat(locale, { useGrouping: showGroupSeparators })
+            .format(valueNumber)
+            .trim() + (maximumFractionDigits ? fractionPart : ''));
     }
-    return cleanedValue;
+    return value;
 }
 export function isValueInRange(value, min, max) {
     return !((min !== undefined && value < min) || (max !== undefined && value > max));

package/lib/components/Number/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import BigNumber from 'bignumber.js';\n\nexport function getInteger(value: string): string {\n  const decPos = value.indexOf('.');\n  const substrLength = decPos === -1 ? value.length : decPos;\n  return value.substring(0, substrLength);\n}\n\nexport function getDecimal(locale: string, options?: Intl.NumberFormatOptions) {\n  return (\n    new Intl.NumberFormat(locale, options)\n      .formatToParts(0.1)\n      .filter((part: { type: string; value: string }) => part.type === 'decimal')[0]?.value || ''\n  );\n}\n\nexport function getFraction(value: string) {\n  const decPos = value.indexOf('.');\n  const substrLength = decPos === -1 ? value.length : decPos;\n  return value.substring(substrLength);\n}\n\nexport function getCleanedValue(\n  value: string,\n  decimal: string,\n  maximumFractionDigits: number\n): string {\n  const regex = new RegExp(`[^-\\\\d${decimal}]`, 'g');\n  value = value.trim().replace(regex, '');\n  if (decimal) {\n    const decimalString = new RegExp(`\\\\${decimal}`, 'g');\n    value = value.replace(decimalString, '.');\n  }\n  if (value.startsWith('.')) value = `0${value}`;\n  if (value.startsWith('-.')) value = `-0${value.substring(1)}`;\n  const match = value.match(new RegExp(`-?\\\\d*(\\\\.\\\\d{0,${maximumFractionDigits}})?`));\n  if (match && match.length > 0) {\n    value = match[0];\n  }\n  return value;\n}\n\nexport function getFormattedValue(\n  value: string,\n  locale: string,\n  showGroupSeparators: boolean,\n  maximumFractionDigits: number = 0\n): string {\n  let valueNumber;\n  let sign = '';\n  const cleanedValue = getCleanedValue(value, '.', maximumFractionDigits);\n  let integer = getInteger(cleanedValue);\n  const decimal = getDecimal(locale);\n  const fractionPart = getFraction(cleanedValue).replace('.', decimal);\n  if (integer && integer.startsWith('-')) {\n    sign = '-';\n    integer = integer.substring(1);\n  }\n  if (!integer && maximumFractionDigits && fractionPart.startsWith(decimal)) {\n    integer = '0';\n  }\n  if (cleanedValue && !Number.isNaN(parseFloat(integer))) {\n    valueNumber = BigInt(integer);\n    return (\n      sign +\n      new Intl.NumberFormat(locale, { useGrouping: showGroupSeparators })\n        .format(valueNumber)\n        .trim() +\n      (maximumFractionDigits ? fractionPart : '')\n    );\n  }\n  return cleanedValue;\n}\n\nexport function isValueInRange(\n  value: number,\n  min: number | undefined,\n  max: number | undefined\n): boolean {\n  return !((min !== undefined && value < min) || (max !== undefined && value > max));\n}\n\nexport function getIncrementedValue(value: string, min: number, max: number, step: number): string {\n  const numberValue = parseFloat(value) || 0;\n  const newValue = new BigNumber(numberValue).plus(step);\n  if (isValueInRange(newValue.toNumber(), min, max)) {\n    return newValue.toFixed();\n  }\n  if (min !== undefined && newValue.toNumber() < min) {\n    return min.toString();\n  }\n  return value;\n}\n\nexport function getDecrementedValue(value: string, min: number, max: number, step: number): string {\n  const numberValue = parseFloat(value) || 0;\n  const newValue = new BigNumber(numberValue).minus(step);\n  if (isValueInRange(newValue.toNumber(), min, max)) {\n    return newValue.toFixed();\n  }\n  if (max !== undefined && newValue.toNumber() > max) {\n    return max.toString();\n  }\n  return value;\n}\n\ninterface NumberFormatOptions {\n  locale: string;\n  options?: Intl.NumberFormatOptions;\n}\n\nexport function formatNumber(value: number | bigint, { locale, options }: NumberFormatOptions) {\n  const formatter = new Intl.NumberFormat(locale, options);\n\n  return formatter.format(value);\n}\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import BigNumber from 'bignumber.js';\n\nexport function getInteger(value: string): string {\n  const decPos = value.indexOf('.');\n  const substrLength = decPos === -1 ? value.length : decPos;\n  return value.substring(0, substrLength);\n}\n\nexport function getDecimal(locale: string, options?: Intl.NumberFormatOptions) {\n  return (\n    new Intl.NumberFormat(locale, options)\n      .formatToParts(0.1)\n      .filter((part: { type: string; value: string }) => part.type === 'decimal')[0]?.value || ''\n  );\n}\n\nexport function getFraction(value: string) {\n  const decPos = value.indexOf('.');\n  const substrLength = decPos === -1 ? value.length : decPos;\n  return value.substring(substrLength);\n}\n\nexport function getCleanedValue(\n  value: string,\n  decimalSign: string,\n  maximumFractionDigits: number\n): string {\n  let rawValue = value.replace(new RegExp(`[^${decimalSign}\\\\d-]+`, 'gu'), '');\n  if (decimalSign && decimalSign !== '.') rawValue = rawValue.replace(decimalSign, '.');\n  if (rawValue.startsWith('.')) rawValue = `0${value}`;\n  if (rawValue.startsWith('-.')) rawValue = `-0${value.substring(1)}`;\n  const match = rawValue.match(new RegExp(`-?\\\\d*(\\\\.\\\\d{0,${maximumFractionDigits}})?`));\n  if (match && match.length > 0) {\n    rawValue = match[0];\n  }\n  return rawValue;\n}\n\nexport function getFormattedValue(\n  value: string,\n  locale: string,\n  showGroupSeparators: boolean,\n  maximumFractionDigits: number = 0\n): string {\n  let valueNumber;\n  const integer = getInteger(value);\n  const decimal = getDecimal(locale);\n  const fractionPart = getFraction(value).replace('.', decimal);\n  if (value && !Number.isNaN(parseFloat(integer))) {\n    valueNumber = BigInt(integer);\n    return (\n      new Intl.NumberFormat(locale, { useGrouping: showGroupSeparators })\n        .format(valueNumber)\n        .trim() + (maximumFractionDigits ? fractionPart : '')\n    );\n  }\n  return value;\n}\n\nexport function isValueInRange(\n  value: number,\n  min: number | undefined,\n  max: number | undefined\n): boolean {\n  return !((min !== undefined && value < min) || (max !== undefined && value > max));\n}\n\nexport function getIncrementedValue(value: string, min: number, max: number, step: number): string {\n  const numberValue = parseFloat(value) || 0;\n  const newValue = new BigNumber(numberValue).plus(step);\n  if (isValueInRange(newValue.toNumber(), min, max)) {\n    return newValue.toFixed();\n  }\n  if (min !== undefined && newValue.toNumber() < min) {\n    return min.toString();\n  }\n  return value;\n}\n\nexport function getDecrementedValue(value: string, min: number, max: number, step: number): string {\n  const numberValue = parseFloat(value) || 0;\n  const newValue = new BigNumber(numberValue).minus(step);\n  if (isValueInRange(newValue.toNumber(), min, max)) {\n    return newValue.toFixed();\n  }\n  if (max !== undefined && newValue.toNumber() > max) {\n    return max.toString();\n  }\n  return value;\n}\n\ninterface NumberFormatOptions {\n  locale: string;\n  options?: Intl.NumberFormatOptions;\n}\n\nexport function formatNumber(value: number | bigint, { locale, options }: NumberFormatOptions) {\n  const formatter = new Intl.NumberFormat(locale, options);\n\n  return formatter.format(value);\n}\n"]}

package/lib/components/Phone/PhoneInput.d.ts

@@ -16,7 +16,7 @@ export interface PhoneInputProps extends FormControlProps, BaseProps, NoChildren
     /** CCallback fired when the component gets focus */
     onFocus?: (value: string) => void;
     /** Ref for the wrapping element. */
-    ref?: Ref<HTMLDivElement>;
+    ref?: Ref<HTMLInputElement>;
 }
 declare const PhoneInput: FunctionComponent<PhoneInputProps & ForwardProps>;
 export default PhoneInput;

package/lib/components/Phone/PhoneInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAEjB,GAAG,EAKJ,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAqB,MAAM,aAAa,CAAC;AAEzF,OAAO,EAAE,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAerE,MAAM,WAAW,eAAgB,SAAQ,gBAAgB,EAAE,SAAS,EAAE,cAAc;IAClF;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oDAAoD;IACpD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAwBD,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAkIjE,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAEjB,GAAG,EAGJ,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAqB,MAAM,aAAa,CAAC;AAEzF,OAAO,EAAE,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAUrE,MAAM,WAAW,eAAgB,SAAQ,gBAAgB,EAAE,SAAS,EAAE,cAAc;IAClF;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oDAAoD;IACpD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAwBD,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CA+GjE,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/Phone/PhoneInput.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useEffect, useMemo, useRef, useState } from 'react';
+import { forwardRef, useCallback, useRef } from 'react';
 import styled, { css } from 'styled-components';
-import { useAfterInitialEffect, useDirection, useFocusWithin } from '../../hooks';
+import { useConsolidatedRef, useDirection, useFocusWithin, useInputFormatter } from '../../hooks';
 import { defaultThemeProp } from '../../theme';
 import FormField from '../FormField';
 import { StyledFormControl } from '../FormControl';
@@ -11,7 +11,7 @@ import Input from '../Input';
 import { StyledSelect } from '../Select/Select';
 import Flex from '../Flex';
 import callingCodes from './callingCodes';
-import { calculateCursorPosition, convertToCallbackParameter, formatPhoneNumber, getPhoneNumberParts } from './utils';
+import { convertToCallbackParameter, formatPhoneNumber, getPhoneNumberParts } from './utils';
 const StyledPhoneInput = styled.div(() => {
     const { start, end } = useDirection();
     return css `
@@ -31,50 +31,33 @@ const StyledPhoneInput = styled.div(() => {
 });
 StyledPhoneInput.defaultProps = defaultThemeProp;
 const PhoneInput = forwardRef((props, ref) => {
-    const { defaultValue, value = defaultValue, id, label, labelHidden, info, status, required, readOnly, disabled, showCountryCode = false, callingCodesList = callingCodes, onChange, onBlur, onFocus, ...restProps } = props;
-    const phoneNumberParts = useMemo(() => {
-        return value ? getPhoneNumberParts(value, callingCodesList) : undefined;
-    }, [callingCodesList, value]);
-    const [countryCode, setCountryCode] = useState(showCountryCode ? phoneNumberParts?.[0] || callingCodesList[0] : phoneNumberParts?.[0]);
-    const [phoneNumber, setPhoneNumber] = useState(phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : '');
-    useAfterInitialEffect(() => {
-        setCountryCode(phoneNumberParts?.[0]);
-        setPhoneNumber(phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : '');
-    }, [phoneNumberParts]);
-    const [cursor, setCursor] = useState(undefined);
-    const inputRef = useRef(null);
-    useEffect(() => {
-        if (cursor !== undefined)
-            inputRef.current?.setSelectionRange(cursor, cursor);
-    }, [cursor, inputRef.current]);
+    const { value, id, label, labelHidden, info, status, required, readOnly, disabled, showCountryCode = false, callingCodesList = callingCodes, onChange, onBlur, onFocus, ...restProps } = props;
+    const [countryCode = callingCodesList[0], subscriberNumber = ''] = value
+        ? getPhoneNumberParts(value, callingCodesList)
+        : [];
     const onFocusChange = (focused) => {
-        const callbackParam = convertToCallbackParameter(countryCode, phoneNumber);
+        const callbackParam = convertToCallbackParameter(countryCode, subscriberNumber);
         if (focused)
             onFocus?.(callbackParam);
         else
             onBlur?.(callbackParam);
     };
-    const containerRef = useRef(null);
-    useFocusWithin([containerRef], onFocusChange);
     const onInputChange = (e) => {
-        const inputValue = e.target.value;
-        const selectionStart = e.target.selectionStart;
-        const formatted = formatPhoneNumber(inputValue, countryCode);
-        setPhoneNumber(formatted);
-        if (countryCode) {
-            setCursor(calculateCursorPosition(formatted, phoneNumber, countryCode, selectionStart));
-        }
-        onChange?.(convertToCallbackParameter(countryCode, formatted));
+        onChange?.(convertToCallbackParameter(countryCode, e.target.value));
     };
     const onSelectChange = (e) => {
-        const selectValue = e.target.value;
-        setCountryCode(selectValue);
-        setPhoneNumber(formatPhoneNumber(phoneNumber, selectValue));
-        onChange?.(convertToCallbackParameter(selectValue, phoneNumber));
+        onChange?.(convertToCallbackParameter(e.target.value, subscriberNumber));
     };
+    const inputRef = useConsolidatedRef(ref);
+    const containerRef = useRef(null);
+    useFocusWithin([containerRef], onFocusChange);
+    const formatter = useCallback(number => {
+        return formatPhoneNumber(number.replace(/\D+/g, ''), countryCode);
+    }, [countryCode]);
+    const formatted = useInputFormatter(inputRef, subscriberNumber, formatter);
     const codesOptions = (_jsx(_Fragment, { children: callingCodesList.map(code => (_jsx(Option, { value: code, children: code }, code))) }));
-    const Comp = (_jsxs(StyledPhoneInput, { as: StyledFormControl, forwardedAs: Flex, container: { alignItems: 'center', wrap: 'nowrap' }, ref: containerRef, status: status, readOnly: readOnly, disabled: disabled, children: [showCountryCode && (_jsx(Select, { value: countryCode, onChange: onSelectChange, required: required, status: status, readOnly: readOnly, disabled: disabled, children: codesOptions })), _jsx(Input, { ...restProps, inputMode: 'tel', ref: inputRef, value: phoneNumber, onChange: onInputChange, required: required, status: status, readOnly: readOnly, disabled: disabled })] }));
-    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, ref, status, required, disabled }, children: Comp })) : (Comp);
+    const Comp = (_jsxs(StyledPhoneInput, { as: StyledFormControl, forwardedAs: Flex, container: { alignItems: 'center', wrap: 'nowrap' }, ref: containerRef, status: status, readOnly: readOnly, disabled: disabled, children: [showCountryCode && (_jsx(Select, { value: countryCode, onChange: onSelectChange, required: required, status: status, readOnly: readOnly, disabled: disabled, autocomplete: 'tel-country-code', children: codesOptions })), _jsx(Input, { ...restProps, inputMode: 'tel', ref: inputRef, value: formatted, onChange: onInputChange, required: required, status: status, readOnly: readOnly, disabled: disabled, autocomplete: 'tel-national' })] }));
+    return label ? (_jsx(FormField, { as: 'fieldset', labelAs: 'legend', ...{ label, labelHidden, id, info, status, required, disabled }, children: Comp })) : (Comp);
 });
 export default PhoneInput;
 //# sourceMappingURL=PhoneInput.js.map

package/lib/components/Phone/PhoneInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneInput.js","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeEvent,\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useAfterInitialEffect, useDirection, useFocusWithin } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, NoChildrenProp, PropsWithDefaults } from '../../types';\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport StyledInput from '../Input/Input.styles';\nimport Select, { Option } from '../Select';\nimport Input from '../Input';\nimport { StyledSelect } from '../Select/Select';\nimport Flex from '../Flex';\n\nimport callingCodes from './callingCodes';\nimport {\n  calculateCursorPosition,\n  convertToCallbackParameter,\n  formatPhoneNumber,\n  getPhoneNumberParts\n} from './utils';\n\nexport interface PhoneInputProps extends FormControlProps, BaseProps, NoChildrenProp {\n  /**\n   * Display select with countries calling codes\n   * @default false\n   */\n  showCountryCode?: boolean;\n  /** Changes lists of countries calling codes */\n  callingCodesList?: string[];\n  /** Callback fired on input value change */\n  onChange?: (value: string) => void;\n  /** Callback fired when the component loses focus */\n  onBlur?: (value: string) => void;\n  /** CCallback fired when the component gets focus */\n  onFocus?: (value: string) => void;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\ntype PhoneInputPropsWithDefaults = PropsWithDefaults<PhoneInputProps>;\n\nconst StyledPhoneInput = styled.div<PhoneInputPropsWithDefaults>(() => {\n  const { start, end } = useDirection();\n  return css`\n    border: 0;\n    > ${StyledSelect} {\n      max-width: max-content;\n      border-inline-end: none;\n      ${`border-top-${end}-radius`}: 0;\n      ${`border-bottom-${end}-radius`}: 0;\n    }\n\n    > ${StyledSelect} + ${StyledInput} {\n      ${`border-top-${start}-radius`}: 0;\n      ${`border-bottom-${start}-radius`}: 0;\n    }\n  `;\n});\n\nStyledPhoneInput.defaultProps = defaultThemeProp;\n\nconst PhoneInput: FunctionComponent<PhoneInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<PhoneInputProps>, ref: PhoneInputProps['ref']) => {\n    const {\n      defaultValue,\n      value = defaultValue,\n      id,\n      label,\n      labelHidden,\n      info,\n      status,\n      required,\n      readOnly,\n      disabled,\n      showCountryCode = false,\n      callingCodesList = callingCodes,\n      onChange,\n      onBlur,\n      onFocus,\n      ...restProps\n    } = props;\n\n    const phoneNumberParts = useMemo(() => {\n      return value ? getPhoneNumberParts(value, callingCodesList) : undefined;\n    }, [callingCodesList, value]);\n\n    const [countryCode, setCountryCode] = useState(\n      showCountryCode ? phoneNumberParts?.[0] || callingCodesList[0] : phoneNumberParts?.[0]\n    );\n\n    const [phoneNumber, setPhoneNumber] = useState(\n      phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : ''\n    );\n\n    useAfterInitialEffect(() => {\n      setCountryCode(phoneNumberParts?.[0]);\n      setPhoneNumber(phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : '');\n    }, [phoneNumberParts]);\n\n    const [cursor, setCursor] = useState<number | undefined>(undefined);\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    useEffect(() => {\n      if (cursor !== undefined) inputRef.current?.setSelectionRange(cursor, cursor);\n    }, [cursor, inputRef.current]);\n\n    const onFocusChange = (focused: boolean) => {\n      const callbackParam = convertToCallbackParameter(countryCode, phoneNumber);\n      if (focused) onFocus?.(callbackParam);\n      else onBlur?.(callbackParam);\n    };\n\n    const containerRef = useRef<HTMLElement>(null);\n    useFocusWithin([containerRef], onFocusChange);\n\n    const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n      const inputValue = e.target.value;\n      const selectionStart = e.target.selectionStart;\n      const formatted = formatPhoneNumber(inputValue, countryCode);\n      setPhoneNumber(formatted);\n      if (countryCode) {\n        setCursor(calculateCursorPosition(formatted, phoneNumber, countryCode, selectionStart));\n      }\n      onChange?.(convertToCallbackParameter(countryCode, formatted));\n    };\n\n    const onSelectChange = (e: ChangeEvent<HTMLSelectElement>) => {\n      const selectValue = e.target.value;\n      setCountryCode(selectValue);\n      setPhoneNumber(formatPhoneNumber(phoneNumber, selectValue));\n      onChange?.(convertToCallbackParameter(selectValue, phoneNumber));\n    };\n\n    const codesOptions = (\n      <>\n        {callingCodesList.map(code => (\n          <Option key={code} value={code}>\n            {code}\n          </Option>\n        ))}\n      </>\n    );\n\n    const Comp = (\n      <StyledPhoneInput\n        as={StyledFormControl}\n        forwardedAs={Flex as any}\n        container={{ alignItems: 'center', wrap: 'nowrap' }}\n        ref={containerRef}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled}\n      >\n        {showCountryCode && (\n          <Select\n            value={countryCode}\n            onChange={onSelectChange}\n            required={required}\n            status={status}\n            readOnly={readOnly}\n            disabled={disabled}\n          >\n            {codesOptions}\n          </Select>\n        )}\n        <Input\n          {...restProps}\n          inputMode='tel'\n          ref={inputRef}\n          value={phoneNumber}\n          onChange={onInputChange}\n          required={required}\n          status={status}\n          readOnly={readOnly}\n          disabled={disabled}\n        />\n      </StyledPhoneInput>\n    );\n\n    return label ? (\n      <FormField\n        as='fieldset'\n        labelAs='legend'\n        {...{ label, labelHidden, id, info, ref, status, required, disabled }}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default PhoneInput;\n"]}
+{"version":3,"file":"PhoneInput.js","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeEvent,\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  Ref,\n  useCallback,\n  useRef\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef, useDirection, useFocusWithin, useInputFormatter } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, NoChildrenProp, PropsWithDefaults } from '../../types';\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport StyledInput from '../Input/Input.styles';\nimport Select, { Option } from '../Select';\nimport Input from '../Input';\nimport { StyledSelect } from '../Select/Select';\nimport Flex from '../Flex';\n\nimport callingCodes from './callingCodes';\nimport { convertToCallbackParameter, formatPhoneNumber, getPhoneNumberParts } from './utils';\n\nexport interface PhoneInputProps extends FormControlProps, BaseProps, NoChildrenProp {\n  /**\n   * Display select with countries calling codes\n   * @default false\n   */\n  showCountryCode?: boolean;\n  /** Changes lists of countries calling codes */\n  callingCodesList?: string[];\n  /** Callback fired on input value change */\n  onChange?: (value: string) => void;\n  /** Callback fired when the component loses focus */\n  onBlur?: (value: string) => void;\n  /** CCallback fired when the component gets focus */\n  onFocus?: (value: string) => void;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLInputElement>;\n}\n\ntype PhoneInputPropsWithDefaults = PropsWithDefaults<PhoneInputProps>;\n\nconst StyledPhoneInput = styled.div<PhoneInputPropsWithDefaults>(() => {\n  const { start, end } = useDirection();\n  return css`\n    border: 0;\n    > ${StyledSelect} {\n      max-width: max-content;\n      border-inline-end: none;\n      ${`border-top-${end}-radius`}: 0;\n      ${`border-bottom-${end}-radius`}: 0;\n    }\n\n    > ${StyledSelect} + ${StyledInput} {\n      ${`border-top-${start}-radius`}: 0;\n      ${`border-bottom-${start}-radius`}: 0;\n    }\n  `;\n});\n\nStyledPhoneInput.defaultProps = defaultThemeProp;\n\nconst PhoneInput: FunctionComponent<PhoneInputProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<PhoneInputProps>, ref: PhoneInputProps['ref']) => {\n    const {\n      value,\n      id,\n      label,\n      labelHidden,\n      info,\n      status,\n      required,\n      readOnly,\n      disabled,\n      showCountryCode = false,\n      callingCodesList = callingCodes,\n      onChange,\n      onBlur,\n      onFocus,\n      ...restProps\n    } = props;\n\n    const [countryCode = callingCodesList[0], subscriberNumber = ''] = value\n      ? getPhoneNumberParts(value, callingCodesList)\n      : [];\n\n    const onFocusChange = (focused: boolean) => {\n      const callbackParam = convertToCallbackParameter(countryCode, subscriberNumber);\n      if (focused) onFocus?.(callbackParam);\n      else onBlur?.(callbackParam);\n    };\n\n    const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n      onChange?.(convertToCallbackParameter(countryCode, e.target.value));\n    };\n\n    const onSelectChange = (e: ChangeEvent<HTMLSelectElement>) => {\n      onChange?.(convertToCallbackParameter(e.target.value, subscriberNumber));\n    };\n\n    const inputRef = useConsolidatedRef<HTMLInputElement>(ref);\n    const containerRef = useRef<HTMLElement>(null);\n    useFocusWithin([containerRef], onFocusChange);\n\n    const formatter = useCallback(\n      number => {\n        return formatPhoneNumber(number.replace(/\\D+/g, ''), countryCode);\n      },\n      [countryCode]\n    );\n\n    const formatted = useInputFormatter(inputRef, subscriberNumber, formatter);\n\n    const codesOptions = (\n      <>\n        {callingCodesList.map(code => (\n          <Option key={code} value={code}>\n            {code}\n          </Option>\n        ))}\n      </>\n    );\n\n    const Comp = (\n      <StyledPhoneInput\n        as={StyledFormControl}\n        forwardedAs={Flex as any}\n        container={{ alignItems: 'center', wrap: 'nowrap' }}\n        ref={containerRef}\n        status={status}\n        readOnly={readOnly}\n        disabled={disabled}\n      >\n        {showCountryCode && (\n          <Select\n            value={countryCode}\n            onChange={onSelectChange}\n            required={required}\n            status={status}\n            readOnly={readOnly}\n            disabled={disabled}\n            autocomplete='tel-country-code'\n          >\n            {codesOptions}\n          </Select>\n        )}\n        <Input\n          {...restProps}\n          inputMode='tel'\n          ref={inputRef}\n          value={formatted}\n          onChange={onInputChange}\n          required={required}\n          status={status}\n          readOnly={readOnly}\n          disabled={disabled}\n          autocomplete='tel-national'\n        />\n      </StyledPhoneInput>\n    );\n\n    return label ? (\n      <FormField\n        as='fieldset'\n        labelAs='legend'\n        {...{ label, labelHidden, id, info, status, required, disabled }}\n      >\n        {Comp}\n      </FormField>\n    ) : (\n      Comp\n    );\n  }\n);\n\nexport default PhoneInput;\n"]}

package/lib/components/Phone/utils.d.ts

@@ -1,9 +1,8 @@
 export declare const getPhoneNumberParts: (phoneNumber: string, codesList: string[]) => [string | undefined, string];
-export declare const cleanNumber: (phoneNumber: string) => string;
+export declare const cleanSubscriberNumber: (phoneNumber: string) => string;
 export declare const getCountry: (countryCode: string, number: string) => import("libphonenumber-js").CountryCode | undefined;
 export declare const formatPhoneNumber: (numberToFormat: string, countryCode?: string) => string;
 export declare const convertToCallbackParameter: (codePart: string | undefined, numberPart: string) => string;
-export declare const calculateCursorPosition: (newValue: string, prevValue: string, countryCode: string, prevCursorPosition: number | null) => number | undefined;
 export declare const formatPhone: (value: string) => string | undefined;
 export default getPhoneNumberParts;
 //# sourceMappingURL=utils.d.ts.map

package/lib/components/Phone/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/Phone/utils.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,mBAAmB,gBACjB,MAAM,aACR,MAAM,EAAE,KAClB,CAAC,MAAM,GAAG,SAAS,EAAE,MAAM,CAK7B,CAAC;AAEF,eAAO,MAAM,WAAW,gBAAiB,MAAM,WAE9C,CAAC;AAEF,eAAO,MAAM,UAAU,gBAAiB,MAAM,UAAU,MAAM,wDAI7D,CAAC;AAEF,eAAO,MAAM,iBAAiB,mBAAoB,MAAM,gBAAe,MAAM,WAO5E,CAAC;AAEF,eAAO,MAAM,0BAA0B,aAAc,MAAM,GAAG,SAAS,cAAc,MAAM,WAE1F,CAAC;AAEF,eAAO,MAAM,uBAAuB,aACxB,MAAM,aACL,MAAM,eACJ,MAAM,sBACC,MAAM,GAAG,IAAI,uBAyBlC,CAAC;AAEF,eAAO,MAAM,WAAW,UAAW,MAAM,uBAExC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/Phone/utils.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,mBAAmB,gBACjB,MAAM,aACR,MAAM,EAAE,KAClB,CAAC,MAAM,GAAG,SAAS,EAAE,MAAM,CAK7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,gBAAiB,MAAM,WAExD,CAAC;AAEF,eAAO,MAAM,UAAU,gBAAiB,MAAM,UAAU,MAAM,wDAI7D,CAAC;AAEF,eAAO,MAAM,iBAAiB,mBAAoB,MAAM,gBAAe,MAAM,WAO5E,CAAC;AAEF,eAAO,MAAM,0BAA0B,aAAc,MAAM,GAAG,SAAS,cAAc,MAAM,WAE1F,CAAC;AAEF,eAAO,MAAM,WAAW,UAAW,MAAM,uBAExC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/lib/components/Phone/utils.js

@@ -6,7 +6,7 @@ export const getPhoneNumberParts = (phoneNumber, codesList) => {
     const subscriberNumber = phoneNumber.substring(countryCode?.length || 0);
     return [countryCode, subscriberNumber];
 };
-export const cleanNumber = (phoneNumber) => {
+export const cleanSubscriberNumber = (phoneNumber) => {
     return phoneNumber.replace(/\D/g, '');
 };
 export const getCountry = (countryCode, number) => {
@@ -15,7 +15,7 @@ export const getCountry = (countryCode, number) => {
     return countryCode === '+1' ? 'US' : asYouTypeCode.getNumber()?.country;
 };
 export const formatPhoneNumber = (numberToFormat, countryCode = '') => {
-    let formatted = cleanNumber(numberToFormat);
+    let formatted = cleanSubscriberNumber(numberToFormat);
     if (countryCode) {
         const country = getCountry(countryCode, formatted);
         formatted = formatIncompletePhoneNumber(formatted, country);
@@ -23,30 +23,7 @@ export const formatPhoneNumber = (numberToFormat, countryCode = '') => {
     return formatted;
 };
 export const convertToCallbackParameter = (codePart, numberPart) => {
-    return [codePart, cleanNumber(numberPart)].join('');
-};
-export const calculateCursorPosition = (newValue, prevValue, countryCode, prevCursorPosition) => {
-    if (prevCursorPosition !== undefined && prevCursorPosition !== null) {
-        const country = getCountry(countryCode, cleanNumber(newValue));
-        let numbersCount = cleanNumber(prevValue.slice(0, prevCursorPosition - 1)).length + 1;
-        if (cleanNumber(prevValue).length > cleanNumber(newValue).length) {
-            numbersCount = cleanNumber(prevValue.slice(0, prevCursorPosition)).length;
-        }
-        let newCursorPosition = 0;
-        let count = 0;
-        const asYouTypeNew = new AsYouType(country);
-        asYouTypeNew.input(newValue);
-        while (newCursorPosition < asYouTypeNew.getTemplate().length) {
-            if (count === numbersCount) {
-                break;
-            }
-            if (asYouTypeNew.getTemplate()[newCursorPosition] === 'x') {
-                count += 1;
-            }
-            newCursorPosition += 1;
-        }
-        return newCursorPosition;
-    }
+    return [codePart, cleanSubscriberNumber(numberPart)].join('');
 };
 export const formatPhone = (value) => {
     return parsePhoneNumber(value)?.formatInternational();

package/lib/components/Phone/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/Phone/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import parsePhoneNumber, { AsYouType, formatIncompletePhoneNumber } from 'libphonenumber-js';\n\nexport const getPhoneNumberParts = (\n  phoneNumber: string,\n  codesList: string[]\n): [string | undefined, string] => {\n  if (!phoneNumber.startsWith('+') || phoneNumber.startsWith('+0')) return [undefined, phoneNumber];\n  const countryCode = codesList.find(code => phoneNumber.startsWith(code));\n  const subscriberNumber = phoneNumber.substring(countryCode?.length || 0);\n  return [countryCode, subscriberNumber];\n};\n\nexport const cleanNumber = (phoneNumber: string) => {\n  return phoneNumber.replace(/\\D/g, '');\n};\n\nexport const getCountry = (countryCode: string, number: string) => {\n  const asYouTypeCode = new AsYouType();\n  asYouTypeCode.input(countryCode + number);\n  return countryCode === '+1' ? 'US' : asYouTypeCode.getNumber()?.country;\n};\n\nexport const formatPhoneNumber = (numberToFormat: string, countryCode: string = '') => {\n  let formatted = cleanNumber(numberToFormat);\n  if (countryCode) {\n    const country = getCountry(countryCode, formatted);\n    formatted = formatIncompletePhoneNumber(formatted, country);\n  }\n  return formatted;\n};\n\nexport const convertToCallbackParameter = (codePart: string | undefined, numberPart: string) => {\n  return [codePart, cleanNumber(numberPart)].join('');\n};\n\nexport const calculateCursorPosition = (\n  newValue: string,\n  prevValue: string,\n  countryCode: string,\n  prevCursorPosition: number | null\n) => {\n  if (prevCursorPosition !== undefined && prevCursorPosition !== null) {\n    const country = getCountry(countryCode, cleanNumber(newValue));\n    let numbersCount = cleanNumber(prevValue.slice(0, prevCursorPosition - 1)).length + 1;\n\n    if (cleanNumber(prevValue).length > cleanNumber(newValue).length) {\n      numbersCount = cleanNumber(prevValue.slice(0, prevCursorPosition)).length;\n    }\n\n    let newCursorPosition = 0;\n    let count = 0;\n    const asYouTypeNew = new AsYouType(country);\n    asYouTypeNew.input(newValue);\n    while (newCursorPosition < asYouTypeNew.getTemplate().length) {\n      if (count === numbersCount) {\n        break;\n      }\n      if (asYouTypeNew.getTemplate()[newCursorPosition] === 'x') {\n        count += 1;\n      }\n      newCursorPosition += 1;\n    }\n    return newCursorPosition;\n  }\n};\n\nexport const formatPhone = (value: string) => {\n  return parsePhoneNumber(value)?.formatInternational();\n};\n\nexport default getPhoneNumberParts;\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/Phone/utils.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,EAAE,EAAE,SAAS,EAAE,2BAA2B,EAAE,MAAM,mBAAmB,CAAC;AAE7F,MAAM,CAAC,MAAM,mBAAmB,GAAG,CACjC,WAAmB,EACnB,SAAmB,EACW,EAAE;IAChC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC;QAAE,OAAO,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;IAClG,MAAM,WAAW,GAAG,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC;IACzE,MAAM,gBAAgB,GAAG,WAAW,CAAC,SAAS,CAAC,WAAW,EAAE,MAAM,IAAI,CAAC,CAAC,CAAC;IACzE,OAAO,CAAC,WAAW,EAAE,gBAAgB,CAAC,CAAC;AACzC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,WAAmB,EAAE,EAAE;IAC3D,OAAO,WAAW,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;AACxC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,WAAmB,EAAE,MAAc,EAAE,EAAE;IAChE,MAAM,aAAa,GAAG,IAAI,SAAS,EAAE,CAAC;IACtC,aAAa,CAAC,KAAK,CAAC,WAAW,GAAG,MAAM,CAAC,CAAC;IAC1C,OAAO,WAAW,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,SAAS,EAAE,EAAE,OAAO,CAAC;AAC1E,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,cAAsB,EAAE,cAAsB,EAAE,EAAE,EAAE;IACpF,IAAI,SAAS,GAAG,qBAAqB,CAAC,cAAc,CAAC,CAAC;IACtD,IAAI,WAAW,EAAE;QACf,MAAM,OAAO,GAAG,UAAU,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;QACnD,SAAS,GAAG,2BAA2B,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;KAC7D;IACD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,QAA4B,EAAE,UAAkB,EAAE,EAAE;IAC7F,OAAO,CAAC,QAAQ,EAAE,qBAAqB,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChE,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,EAAE;IAC3C,OAAO,gBAAgB,CAAC,KAAK,CAAC,EAAE,mBAAmB,EAAE,CAAC;AACxD,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC","sourcesContent":["import parsePhoneNumber, { AsYouType, formatIncompletePhoneNumber } from 'libphonenumber-js';\n\nexport const getPhoneNumberParts = (\n  phoneNumber: string,\n  codesList: string[]\n): [string | undefined, string] => {\n  if (!phoneNumber.startsWith('+') || phoneNumber.startsWith('+0')) return [undefined, phoneNumber];\n  const countryCode = codesList.find(code => phoneNumber.startsWith(code));\n  const subscriberNumber = phoneNumber.substring(countryCode?.length || 0);\n  return [countryCode, subscriberNumber];\n};\n\nexport const cleanSubscriberNumber = (phoneNumber: string) => {\n  return phoneNumber.replace(/\\D/g, '');\n};\n\nexport const getCountry = (countryCode: string, number: string) => {\n  const asYouTypeCode = new AsYouType();\n  asYouTypeCode.input(countryCode + number);\n  return countryCode === '+1' ? 'US' : asYouTypeCode.getNumber()?.country;\n};\n\nexport const formatPhoneNumber = (numberToFormat: string, countryCode: string = '') => {\n  let formatted = cleanSubscriberNumber(numberToFormat);\n  if (countryCode) {\n    const country = getCountry(countryCode, formatted);\n    formatted = formatIncompletePhoneNumber(formatted, country);\n  }\n  return formatted;\n};\n\nexport const convertToCallbackParameter = (codePart: string | undefined, numberPart: string) => {\n  return [codePart, cleanSubscriberNumber(numberPart)].join('');\n};\n\nexport const formatPhone = (value: string) => {\n  return parsePhoneNumber(value)?.formatInternational();\n};\n\nexport default getPhoneNumberParts;\n"]}

package/lib/components/Tabs/Tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAOf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAG3C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIzC,eAAO,MAAM,UAAU,yHAUtB,CAAC;AAIF;;;GAGG;AACH,QAAA,MAAM,IAAI,EAAE,iBAAiB,CAAC,SAAS,GAAG,YAAY,CAwGrD,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAOf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAG3C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIzC,eAAO,MAAM,UAAU,yHAUtB,CAAC;AAIF;;;GAGG;AACH,QAAA,MAAM,IAAI,EAAE,iBAAiB,CAAC,SAAS,GAAG,YAAY,CAyGrD,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/lib/components/Tabs/Tabs.js

@@ -58,7 +58,7 @@ const Tabs = forwardRef(({ tabs = [], type = 'horizontal', currentTabId, onTabCl
     }
     return (_jsx(Flex, { ...restProps, container: {
             direction: type !== 'horizontal' ? 'column' : undefined
-        }, item: { shrink: 0 }, as: StyledTabs, ref: ref, type: type, role: 'tablist', children: tabs.map((tab, i) => {
+        }, item: { shrink: 0 }, as: StyledTabs, ref: ref, type: type, role: 'tablist', "aria-orientation": type, children: tabs.map((tab, i) => {
             const { href, name, count, id, disabled } = tab;
             const selected = id === currentTabId;
             return (_jsx(Tab, { id: id, "aria-selected": selected, "aria-controls": `${id}-panel`, content: name, count: typeof count === 'number' && (_jsx(Count, { variant: selected ? 'interactive' : badgeVariant, children: count })), href: href, inverted: inverted || false, selected: selected, onClick: (event) => {

package/lib/components/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  MouseEvent,\n  KeyboardEvent,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useRef\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport Link from '../Link';\nimport Count from '../Badges/Count';\nimport { ForwardProps } from '../../types';\n\nimport Tab from './Tab';\nimport { TabsProps } from './Tabs.types';\n\ntype TabItem = TabsProps['tabs'][number];\n\nexport const StyledTabs = styled.div<Partial<TabsProps>>(\n  ({ type, theme }) => css`\n    position: relative;\n    overflow: ${type === 'horizontal' ? 'auto' : 'visible'};\n    ${type === 'horizontal' &&\n    css`\n      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n      height: max-content;\n    `}\n  `\n);\n\nStyledTabs.defaultProps = defaultThemeProp;\n\n/**\n * The tabs component will take a list of tab data objects and render out a list of tabs in either vertical or horizontal direction.\n * The tabs component handles which tab is active but will give you a callback function that allows you to make changes when a new tab is activated\n */\nconst Tabs: FunctionComponent<TabsProps & ForwardProps> = forwardRef(\n  (\n    {\n      tabs = [],\n      type = 'horizontal',\n      currentTabId,\n      onTabClick,\n      inverted = false,\n      ...restProps\n    }: PropsWithoutRef<TabsProps>,\n    ref: Ref<HTMLElement>\n  ) => {\n    // Used to keep a reference for every tab in order to focus them with key presses\n    const tabRefs = useRef<(HTMLButtonElement | HTMLAnchorElement)[]>([]);\n\n    // Handles arrow keypresses for changing the focus\n    const changeTabFocus = (event: KeyboardEvent, index: number): void => {\n      if (tabRefs.current?.length) {\n        const { key } = event;\n        if (key === 'ArrowRight' || key === 'ArrowDown') {\n          const nextIndex = index + 1 < tabs.length ? index + 1 : 0;\n          const nextTab = tabRefs.current[nextIndex] as HTMLButtonElement;\n\n          if (!nextTab?.disabled) {\n            nextTab?.focus();\n          } else {\n            changeTabFocus(event, nextIndex);\n          }\n        } else if (key === 'ArrowLeft' || key === 'ArrowUp') {\n          const prevIndex = index === 0 ? tabs.length - 1 : index - 1;\n          const prevTab = tabRefs.current[prevIndex] as HTMLButtonElement;\n          if (!prevTab?.disabled) {\n            prevTab?.focus();\n          } else {\n            changeTabFocus(event, prevIndex);\n          }\n        }\n      }\n    };\n\n    let badgeVariant: 'inverted' | 'default';\n    if (inverted) {\n      badgeVariant = 'inverted';\n    } else {\n      badgeVariant = 'default';\n    }\n\n    return (\n      <Flex\n        {...restProps}\n        container={{\n          direction: type !== 'horizontal' ? 'column' : undefined\n        }}\n        item={{ shrink: 0 }}\n        as={StyledTabs}\n        ref={ref}\n        type={type}\n        role='tablist'\n      >\n        {tabs.map((tab: TabItem, i) => {\n          const { href, name, count, id, disabled } = tab;\n          const selected = id === currentTabId;\n\n          return (\n            <Tab\n              id={id}\n              aria-selected={selected}\n              aria-controls={`${id}-panel`}\n              content={name}\n              count={\n                typeof count === 'number' && (\n                  <Count variant={selected ? 'interactive' : badgeVariant}>{count}</Count>\n                )\n              }\n              href={href}\n              inverted={inverted || false}\n              selected={selected}\n              onClick={(event: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n                onTabClick?.(id, event);\n              }}\n              role='tab'\n              ref={(el: HTMLButtonElement | HTMLAnchorElement) => {\n                tabRefs.current[i] = el;\n              }}\n              onKeyDown={(e: KeyboardEvent) => {\n                if (['ArrowRight', 'ArrowDown', 'ArrowLeft', 'ArrowUp'].includes(e.key)) {\n                  e.preventDefault();\n                }\n              }}\n              onKeyUp={(e: KeyboardEvent<any>) => {\n                changeTabFocus(e, i);\n              }}\n              key={id}\n              as={href ? Link : undefined}\n              tabIndex={selected ? undefined : -1}\n              aria-label={name}\n              type={type}\n              disabled={disabled}\n            />\n          );\n        })}\n      </Flex>\n    );\n  }\n);\n\nexport default Tabs;\n"]}
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  MouseEvent,\n  KeyboardEvent,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useRef\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport Link from '../Link';\nimport Count from '../Badges/Count';\nimport { ForwardProps } from '../../types';\n\nimport Tab from './Tab';\nimport { TabsProps } from './Tabs.types';\n\ntype TabItem = TabsProps['tabs'][number];\n\nexport const StyledTabs = styled.div<Partial<TabsProps>>(\n  ({ type, theme }) => css`\n    position: relative;\n    overflow: ${type === 'horizontal' ? 'auto' : 'visible'};\n    ${type === 'horizontal' &&\n    css`\n      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n      height: max-content;\n    `}\n  `\n);\n\nStyledTabs.defaultProps = defaultThemeProp;\n\n/**\n * The tabs component will take a list of tab data objects and render out a list of tabs in either vertical or horizontal direction.\n * The tabs component handles which tab is active but will give you a callback function that allows you to make changes when a new tab is activated\n */\nconst Tabs: FunctionComponent<TabsProps & ForwardProps> = forwardRef(\n  (\n    {\n      tabs = [],\n      type = 'horizontal',\n      currentTabId,\n      onTabClick,\n      inverted = false,\n      ...restProps\n    }: PropsWithoutRef<TabsProps>,\n    ref: Ref<HTMLElement>\n  ) => {\n    // Used to keep a reference for every tab in order to focus them with key presses\n    const tabRefs = useRef<(HTMLButtonElement | HTMLAnchorElement)[]>([]);\n\n    // Handles arrow keypresses for changing the focus\n    const changeTabFocus = (event: KeyboardEvent, index: number): void => {\n      if (tabRefs.current?.length) {\n        const { key } = event;\n        if (key === 'ArrowRight' || key === 'ArrowDown') {\n          const nextIndex = index + 1 < tabs.length ? index + 1 : 0;\n          const nextTab = tabRefs.current[nextIndex] as HTMLButtonElement;\n\n          if (!nextTab?.disabled) {\n            nextTab?.focus();\n          } else {\n            changeTabFocus(event, nextIndex);\n          }\n        } else if (key === 'ArrowLeft' || key === 'ArrowUp') {\n          const prevIndex = index === 0 ? tabs.length - 1 : index - 1;\n          const prevTab = tabRefs.current[prevIndex] as HTMLButtonElement;\n          if (!prevTab?.disabled) {\n            prevTab?.focus();\n          } else {\n            changeTabFocus(event, prevIndex);\n          }\n        }\n      }\n    };\n\n    let badgeVariant: 'inverted' | 'default';\n    if (inverted) {\n      badgeVariant = 'inverted';\n    } else {\n      badgeVariant = 'default';\n    }\n\n    return (\n      <Flex\n        {...restProps}\n        container={{\n          direction: type !== 'horizontal' ? 'column' : undefined\n        }}\n        item={{ shrink: 0 }}\n        as={StyledTabs}\n        ref={ref}\n        type={type}\n        role='tablist'\n        aria-orientation={type}\n      >\n        {tabs.map((tab: TabItem, i) => {\n          const { href, name, count, id, disabled } = tab;\n          const selected = id === currentTabId;\n\n          return (\n            <Tab\n              id={id}\n              aria-selected={selected}\n              aria-controls={`${id}-panel`}\n              content={name}\n              count={\n                typeof count === 'number' && (\n                  <Count variant={selected ? 'interactive' : badgeVariant}>{count}</Count>\n                )\n              }\n              href={href}\n              inverted={inverted || false}\n              selected={selected}\n              onClick={(event: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n                onTabClick?.(id, event);\n              }}\n              role='tab'\n              ref={(el: HTMLButtonElement | HTMLAnchorElement) => {\n                tabRefs.current[i] = el;\n              }}\n              onKeyDown={(e: KeyboardEvent) => {\n                if (['ArrowRight', 'ArrowDown', 'ArrowLeft', 'ArrowUp'].includes(e.key)) {\n                  e.preventDefault();\n                }\n              }}\n              onKeyUp={(e: KeyboardEvent<any>) => {\n                changeTabFocus(e, i);\n              }}\n              key={id}\n              as={href ? Link : undefined}\n              tabIndex={selected ? undefined : -1}\n              aria-label={name}\n              type={type}\n              disabled={disabled}\n            />\n          );\n        })}\n      </Flex>\n    );\n  }\n);\n\nexport default Tabs;\n"]}

package/lib/hooks/index.d.ts

@@ -13,8 +13,10 @@ export { default as useEvent } from './useEvent';
 export { default as useFocusTrap } from './useFocusTrap';
 export { default as useFocusWithin } from './useFocusWithin';
 export { default as useI18n } from './useI18n';
+export { default as useInputFormatter } from './useInputFormatter';
 export { default as useItemIntersection } from './useItemIntersection';
 export { default as useLongPress } from './useLongPress';
+export { default as useOS } from './useOS';
 export { default as useOuterEvent } from './useOuterEvent';
 export { default as useOverride } from './useOverride';
 export { default as usePrevious } from './usePrevious';

package/lib/hooks/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,mBAAmB,EAC9B,yBAAyB,EACzB,iBAAiB,EAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,mBAAmB,EAC9B,yBAAyB,EACzB,iBAAiB,EAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC"}

package/lib/hooks/index.js

@@ -13,8 +13,10 @@ export { default as useEvent } from './useEvent';
 export { default as useFocusTrap } from './useFocusTrap';
 export { default as useFocusWithin } from './useFocusWithin';
 export { default as useI18n } from './useI18n';
+export { default as useInputFormatter } from './useInputFormatter';
 export { default as useItemIntersection } from './useItemIntersection';
 export { default as useLongPress } from './useLongPress';
+export { default as useOS } from './useOS';
 export { default as useOuterEvent } from './useOuterEvent';
 export { default as useOverride } from './useOverride';
 export { default as usePrevious } from './usePrevious';

package/lib/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,mBAAmB,EAE9B,iBAAiB,EAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export {\n  default as useActiveDescendant,\n  UseActiveDescendantConfig,\n  useLazyDescendant\n} from './useActiveDescendant';\nexport { default as useAfterInitialEffect } from './useAfterInitialEffect';\nexport { default as useArrows } from './useArrows';\nexport { default as useAutoResize } from './useAutoResize';\nexport { default as useBreakpoint } from './useBreakpoint';\nexport { default as useConfiguration } from './useConfiguration';\nexport { default as useConsolidatedRef } from './useConsolidatedRef';\nexport { default as useDirection } from './useDirection';\nexport { default as useDraggable } from './useDraggable';\nexport { default as useElement } from './useElement';\nexport { default as useEscape } from './useEscape';\nexport { default as useEvent } from './useEvent';\nexport { default as useFocusTrap } from './useFocusTrap';\nexport { default as useFocusWithin } from './useFocusWithin';\nexport { default as useI18n } from './useI18n';\nexport { default as useItemIntersection } from './useItemIntersection';\nexport { default as useLongPress } from './useLongPress';\nexport { default as useOuterEvent } from './useOuterEvent';\nexport { default as useOverride } from './useOverride';\nexport { default as usePrevious } from './usePrevious';\nexport { default as useScrollStick } from './useScrollStick';\nexport { default as useScrollToggle } from './useScrollToggle';\nexport { default as useTheme } from './useTheme';\nexport { default as useTransitionState } from './useTransitionState';\nexport { default as useTriggerableEffect } from './useTriggerableEffect';\nexport { default as useTriggerableLayoutEffect } from './useTriggerableLayoutEffect';\nexport { default as useUID } from './useUID';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,mBAAmB,EAE9B,iBAAiB,EAClB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AACrF,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export {\n  default as useActiveDescendant,\n  UseActiveDescendantConfig,\n  useLazyDescendant\n} from './useActiveDescendant';\nexport { default as useAfterInitialEffect } from './useAfterInitialEffect';\nexport { default as useArrows } from './useArrows';\nexport { default as useAutoResize } from './useAutoResize';\nexport { default as useBreakpoint } from './useBreakpoint';\nexport { default as useConfiguration } from './useConfiguration';\nexport { default as useConsolidatedRef } from './useConsolidatedRef';\nexport { default as useDirection } from './useDirection';\nexport { default as useDraggable } from './useDraggable';\nexport { default as useElement } from './useElement';\nexport { default as useEscape } from './useEscape';\nexport { default as useEvent } from './useEvent';\nexport { default as useFocusTrap } from './useFocusTrap';\nexport { default as useFocusWithin } from './useFocusWithin';\nexport { default as useI18n } from './useI18n';\nexport { default as useInputFormatter } from './useInputFormatter';\nexport { default as useItemIntersection } from './useItemIntersection';\nexport { default as useLongPress } from './useLongPress';\nexport { default as useOS } from './useOS';\nexport { default as useOuterEvent } from './useOuterEvent';\nexport { default as useOverride } from './useOverride';\nexport { default as usePrevious } from './usePrevious';\nexport { default as useScrollStick } from './useScrollStick';\nexport { default as useScrollToggle } from './useScrollToggle';\nexport { default as useTheme } from './useTheme';\nexport { default as useTransitionState } from './useTransitionState';\nexport { default as useTriggerableEffect } from './useTriggerableEffect';\nexport { default as useTriggerableLayoutEffect } from './useTriggerableLayoutEffect';\nexport { default as useUID } from './useUID';\n"]}

package/lib/hooks/useActiveDescendant.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useActiveDescendant.d.ts","sourceRoot":"","sources":["../../src/hooks/useActiveDescendant.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,cAAc,EAAuB,MAAM,OAAO,CAAC;AAIjF,MAAM,WAAW,yBAAyB;IACxC,4DAA4D;IAC5D,OAAO,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,wCAAwC;IACxC,KAAK,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,6EAA6E;IAC7E,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,iBAAiB,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACvC,qDAAqD;IACrD,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC;;OAEG;IACH,aAAa,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACnC,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,+DAA+D;IAC/D,OAAO,CAAC,EAAE,CAAC,mBAAmB,EAAE,WAAW,KAAK,IAAI,CAAC;IACrD;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,wDAAwD;IACxD,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC;;OAEG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACrC;AAED,aAAK,iBAAiB,GAAG,WAAW,GAAG,SAAS,CAAC;AACjD,aAAK,WAAW,GAAG,WAAW,EAAE,GAAG,IAAI,CAAC;AAExC,QAAA,MAAM,mBAAmB,6NAepB,yBAAyB;sBAGV,iBAAiB;iBACtB,WAAW;CA6OzB,CAAC;AAEF,eAAO,MAAM,iBAAiB;aASnB,OAAO;iBACH,WAAW;8BACE,iBAAiB;sBACzB,iBAAiB;mBACpB,yBAAyB,CAAC,eAAe,CAAC;2BAClC,WAAW,GAAG,IAAI,GAAG,SAAS,KAAK,IAAI;;UAgC/D,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"useActiveDescendant.d.ts","sourceRoot":"","sources":["../../src/hooks/useActiveDescendant.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,cAAc,EAAuB,MAAM,OAAO,CAAC;AAIjF,MAAM,WAAW,yBAAyB;IACxC,4DAA4D;IAC5D,OAAO,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,wCAAwC;IACxC,KAAK,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,6EAA6E;IAC7E,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,iBAAiB,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACvC,qDAAqD;IACrD,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC;;OAEG;IACH,aAAa,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACnC,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,+DAA+D;IAC/D,OAAO,CAAC,EAAE,CAAC,mBAAmB,EAAE,WAAW,KAAK,IAAI,CAAC;IACrD;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,wDAAwD;IACxD,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC;;OAEG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACrC;AAED,aAAK,iBAAiB,GAAG,WAAW,GAAG,SAAS,CAAC;AACjD,aAAK,WAAW,GAAG,WAAW,EAAE,GAAG,IAAI,CAAC;AAExC,QAAA,MAAM,mBAAmB,6NAepB,yBAAyB;sBAGV,iBAAiB;iBACtB,WAAW;CAiPzB,CAAC;AAEF,eAAO,MAAM,iBAAiB;aASnB,OAAO;iBACH,WAAW;8BACE,iBAAiB;sBACzB,iBAAiB;mBACpB,yBAAyB,CAAC,eAAe,CAAC;2BAClC,WAAW,GAAG,IAAI,GAAG,SAAS,KAAK,IAAI;;UAgC/D,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/lib/hooks/useActiveDescendant.js

@@ -18,7 +18,12 @@ const useActiveDescendant = ({ focusEl, scope, scopeSelector, selector, focusDes
     useEffect(() => {
         if (!scope || !focusEl)
             return;
-        scope.setAttribute('data-active-scope', document.activeElement === focusEl ? 'true' : 'false');
+        const rootNode = focusEl.getRootNode();
+        let activeElement = rootNode.activeElement;
+        if (activeElement?.tagName === 'IFRAME') {
+            activeElement = activeElement.contentDocument?.activeElement;
+        }
+        scope.setAttribute('data-active-scope', activeElement === focusEl ? 'true' : 'false');
         const onFocus = () => {
             scope.setAttribute('data-active-scope', 'true');
         };

package/lib/hooks/useActiveDescendant.js.map

@@ -1 +1 @@
-{"version":3,"file":"useActiveDescendant.js","sourceRoot":"","sources":["../../src/hooks/useActiveDescendant.ts"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useState, DependencyList, useCallback, useRef } from 'react';\n\nimport { createUID } from '../utils';\n\nexport interface UseActiveDescendantConfig {\n  /** DOM element which controls and has active descendants */\n  focusEl: HTMLElement | null;\n  /** Root scope for descendant options */\n  scope: HTMLElement | null;\n  /** Custom selector for specific descendant scope in root descendant scope */\n  scopeSelector?: string;\n  /** Custom selector for descendant options */\n  selector?: string;\n  /** One-time override for the focused descendant, triggers re-evaluation.\n   * Include `clearFocusDescendantEl` for cleanup.\n   */\n  focusDescendantEl?: HTMLElement | null;\n  /** Callback to clear focusDescendantEl after use. */\n  clearFocusDescendant?: () => void;\n  /** One-time override for focused element on NEXT re-evaluation of active descendants.\n   * Include `clearFocusReturn` for cleanup.\n   */\n  focusReturnEl?: HTMLElement | null;\n  /** Callback to clear focusReturnEl after use. */\n  clearFocusReturn?: () => void;\n  /**\n   * Descendant ID used for continuous override of current active descendant,\n   * used for external focus control / keyDown bindings (see RTE).\n   * NOTE: setting currentDescendantId once effectively disables the keybindings of this hook.\n   * If you only need to set the current element once, use focusReturnEl & clearFocusReturn.\n   * @deprecated\n   */\n  currentDescendantId?: string;\n  /** Explicit onClick handler called on keydown 'enter' event */\n  onClick?: (currentDescendantEl: HTMLElement) => void;\n  /** Prevent scrolling to the active descendant on the initial render.\n   * Include `preventInitialScroll` for cleanup.\n   */\n  preventInitialScroll?: boolean;\n  /** Callback to clear preventInitialScroll after use. */\n  clearPreventScroll?: () => void;\n  /** Boolean to prevent descendant evaluation.\n   * @default false\n   */\n  pauseDescendantEvaluation?: boolean;\n}\n\ntype CurrentDescendant = HTMLElement | undefined;\ntype Descendants = HTMLElement[] | null;\n\nconst useActiveDescendant = (\n  {\n    focusEl,\n    scope,\n    scopeSelector,\n    selector,\n    focusDescendantEl,\n    clearFocusDescendant,\n    focusReturnEl,\n    clearFocusReturn,\n    currentDescendantId,\n    onClick,\n    preventInitialScroll,\n    pauseDescendantEvaluation = false,\n    clearPreventScroll\n  }: UseActiveDescendantConfig,\n  dependencyArray: DependencyList = []\n): {\n  activeDescendant: CurrentDescendant;\n  descendants: Descendants;\n} => {\n  const [resetId, setResetId] = useState(0);\n  const previousActiveId = useRef('');\n  const [focusDescendantElIndex, setFocusDescendantElIndex] = useState<number | null>(null);\n  const [currentIndex, setCurrentIndex] = useState<number | null>(null);\n  const [descendants, setDescendants] = useState<Descendants>();\n\n  const clearThenSetDescendants = useCallback(\n    (setVal: NodeListOf<Element> | null) => {\n      descendants?.forEach(node => {\n        node.setAttribute('data-current', 'false');\n      });\n\n      setDescendants(\n        setVal\n          ? Array.from(setVal).filter((item): item is HTMLElement => item instanceof HTMLElement)\n          : null\n      );\n    },\n    [descendants]\n  );\n\n  // ## Toggle active scope data attr.\n  useEffect(() => {\n    if (!scope || !focusEl) return;\n\n    scope.setAttribute('data-active-scope', document.activeElement === focusEl ? 'true' : 'false');\n\n    const onFocus = () => {\n      scope.setAttribute('data-active-scope', 'true');\n    };\n    const onBlur = () => {\n      scope.setAttribute('data-active-scope', 'false');\n    };\n\n    focusEl.addEventListener('focus', onFocus);\n    focusEl.addEventListener('blur', onBlur);\n\n    return () => {\n      focusEl.removeEventListener('focus', onFocus);\n      focusEl.removeEventListener('blur', onBlur);\n    };\n  }, [scope, focusEl]);\n\n  // ## Update descendants\n  useEffect(() => {\n    if (!pauseDescendantEvaluation) {\n      // 0 second timeout added because descendantScope needs to be up to date before running query after dependencyArray change\n      setTimeout(() => {\n        let hasScope = scope;\n\n        if (hasScope && hasScope instanceof HTMLElement) {\n          if (scopeSelector) {\n            hasScope = hasScope.querySelector(scopeSelector);\n          }\n\n          if (!hasScope) {\n            clearThenSetDescendants(null);\n            return;\n          }\n\n          if (selector) {\n            clearThenSetDescendants(hasScope.querySelectorAll(selector));\n          } else {\n            clearThenSetDescendants(\n              hasScope.querySelectorAll(\n                'a, button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"])'\n              )\n            );\n          }\n        } else {\n          clearThenSetDescendants(null);\n        }\n      }, 0);\n    }\n  }, [pauseDescendantEvaluation, scope, scopeSelector, selector, focusEl, ...dependencyArray]);\n\n  // ## Set IDs and aria-owns\n  useEffect(() => {\n    const ownedIds: string[] = [];\n    setCurrentIndex(0);\n\n    if (descendants && descendants.length) {\n      descendants.forEach(node => {\n        node.id = node.id || createUID();\n        ownedIds.push(node.id);\n      });\n    }\n\n    focusEl?.setAttribute('aria-owns', ownedIds.join(' '));\n\n    return () => {\n      focusEl?.removeAttribute('aria-owns');\n    };\n  }, [focusEl, descendants]);\n\n  // ## Bind focus el keyDown\n  useEffect(() => {\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (descendants && descendants.length) {\n        switch (e.key) {\n          case 'ArrowDown':\n            e.preventDefault();\n            // Focus next or first\n            clearFocusReturn?.();\n            clearPreventScroll?.();\n            if (currentIndex !== null && currentIndex + 1 < descendants.length) {\n              setCurrentIndex(currentIndex + 1);\n            } else {\n              setCurrentIndex(0);\n            }\n            break;\n          case 'ArrowUp':\n            e.preventDefault();\n            // Focus previous or last\n            clearFocusReturn?.();\n            clearPreventScroll?.();\n            if (currentIndex !== null && currentIndex - 1 > -1) {\n              setCurrentIndex(currentIndex - 1);\n            } else {\n              setCurrentIndex(descendants.length - 1);\n            }\n            break;\n          case 'Enter':\n            e.preventDefault();\n            // Click focused item\n            if (descendants && descendants.length && currentIndex !== null) {\n              if (onClick) {\n                onClick(descendants[currentIndex]);\n                break;\n              }\n\n              const nodeName = descendants[currentIndex].nodeName.toLowerCase();\n              if (nodeName === 'input' || nodeName === 'button' || nodeName === 'a') {\n                descendants[currentIndex].click();\n              } else {\n                descendants[currentIndex].querySelector<HTMLElement>('button, a, input')?.click();\n              }\n            }\n            break;\n          default:\n            break;\n        }\n      }\n    };\n\n    // Do not rebind once / if `currentDescendantId` control is defined\n    if (focusEl && descendants?.length && !currentDescendantId) {\n      focusEl.addEventListener('keydown', onKeyDown);\n    }\n\n    return () => {\n      focusEl?.removeEventListener('keydown', onKeyDown);\n    };\n  }, [focusEl, currentIndex, descendants]);\n\n  // ## Handle independent control update\n  useEffect(() => {\n    if (descendants && currentDescendantId) {\n      descendants.forEach((node, index) => {\n        if (node.id === currentDescendantId) {\n          setCurrentIndex(index);\n        }\n      });\n    }\n  }, [currentDescendantId, descendants]);\n\n  // ## Set and scroll to current descendant\n  useEffect(() => {\n    const nextIndex = focusDescendantElIndex || currentIndex;\n    const focusReturnId = focusReturnEl?.id;\n    let focusReturnIndex;\n    const focusDescendantElId = focusDescendantEl?.id;\n    let focusDescendantIndex;\n    let foundFocusDescendantEl = false;\n\n    if (descendants && descendants.length) {\n      // clear previous & catch focusReturn / focusDescendantEl index\n      descendants.forEach((node, index) => {\n        if (focusDescendantElIndex === null && node.id === focusDescendantElId) {\n          focusDescendantIndex = index;\n          foundFocusDescendantEl = true;\n          setFocusDescendantElIndex(index);\n        }\n        if (node.id === focusReturnId) {\n          focusReturnIndex = index;\n        }\n        node.setAttribute('data-current', 'false');\n      });\n\n      // early return for focusReturn / focusDescendantEl\n      if (focusReturnIndex && focusReturnIndex !== currentIndex) {\n        setCurrentIndex(focusReturnIndex);\n        clearFocusReturn?.();\n        return;\n      }\n      if (foundFocusDescendantEl && focusDescendantIndex !== undefined) {\n        // hard reset to continue focusDescendantEl process even if it is the active descendant\n        setResetId(Math.random());\n        setCurrentIndex(focusDescendantIndex);\n        return;\n      }\n\n      // set new\n      if (nextIndex !== null && descendants[nextIndex]) {\n        const itemEl = descendants[nextIndex!];\n        itemEl.setAttribute('data-current', 'true');\n        focusEl?.setAttribute('aria-activedescendant', itemEl.id);\n\n        // scroll to element\n        if (itemEl.id !== previousActiveId.current && !preventInitialScroll) {\n          const scrollTo: (this: Element, arg: boolean) => void =\n            Element.prototype.scrollIntoViewIfNeeded ?? Element.prototype.scrollIntoView;\n\n          scrollTo?.call(itemEl, false);\n        }\n\n        // focusDescendantEl cleanup\n        if (focusDescendantElIndex !== null) {\n          setFocusDescendantElIndex(null);\n          clearFocusDescendant?.();\n        }\n\n        previousActiveId.current = itemEl.id;\n      }\n    }\n\n    return () => {\n      focusEl?.removeAttribute('aria-activedescendant');\n    };\n  }, [descendants, currentIndex, focusDescendantEl, focusEl, resetId]);\n\n  return {\n    activeDescendant: currentIndex !== null && descendants ? descendants[currentIndex] : undefined,\n    descendants: descendants || null\n  };\n};\n\nexport const useLazyDescendant = ({\n  loading,\n  descendants,\n  previousActiveDescendant,\n  activeDescendant,\n  focusReturnEl,\n  setFocusReturnEl,\n  scrollEl\n}: {\n  loading: boolean;\n  descendants: Descendants;\n  previousActiveDescendant: CurrentDescendant;\n  activeDescendant: CurrentDescendant;\n  focusReturnEl: UseActiveDescendantConfig['focusReturnEl'];\n  setFocusReturnEl: (el: HTMLElement | null | undefined) => void;\n  scrollEl?: HTMLElement | null;\n}) => {\n  // Bump scroll & set return element when descendant focused in loading state.\n  useEffect(() => {\n    if (loading && descendants && descendants.length && activeDescendant) {\n      const descendantList = [...descendants];\n      const lastItem = descendantList.pop();\n      const lastId = lastItem?.id || undefined;\n\n      if (lastId === activeDescendant.id) {\n        if (scrollEl) {\n          scrollEl.scrollTop = scrollEl.scrollHeight - scrollEl.offsetHeight;\n        }\n\n        if (focusReturnEl?.id !== activeDescendant.id) {\n          // Set focus return to AD on 'nextTick', to avoid reset of AD on update\n          setTimeout(() => {\n            setFocusReturnEl(lastItem);\n          }, 0);\n        }\n      }\n      // If not last item\n      else if (focusReturnEl?.id !== activeDescendant.id) {\n        // Set focus return to AD on 'nextTick' to avoid reset of AD on update\n        // Do not D.R.Y to avoid conflicting calls with immediately prior elements.\n        setTimeout(() => {\n          setFocusReturnEl(activeDescendant);\n        }, 0);\n      }\n    }\n  }, [loading, descendants, previousActiveDescendant, activeDescendant, scrollEl, focusReturnEl]);\n};\n\nexport default useActiveDescendant;\n"]}
+{"version":3,"file":"useActiveDescendant.js","sourceRoot":"","sources":["../../src/hooks/useActiveDescendant.ts"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useState, DependencyList, useCallback, useRef } from 'react';\n\nimport { createUID } from '../utils';\n\nexport interface UseActiveDescendantConfig {\n  /** DOM element which controls and has active descendants */\n  focusEl: HTMLElement | null;\n  /** Root scope for descendant options */\n  scope: HTMLElement | null;\n  /** Custom selector for specific descendant scope in root descendant scope */\n  scopeSelector?: string;\n  /** Custom selector for descendant options */\n  selector?: string;\n  /** One-time override for the focused descendant, triggers re-evaluation.\n   * Include `clearFocusDescendantEl` for cleanup.\n   */\n  focusDescendantEl?: HTMLElement | null;\n  /** Callback to clear focusDescendantEl after use. */\n  clearFocusDescendant?: () => void;\n  /** One-time override for focused element on NEXT re-evaluation of active descendants.\n   * Include `clearFocusReturn` for cleanup.\n   */\n  focusReturnEl?: HTMLElement | null;\n  /** Callback to clear focusReturnEl after use. */\n  clearFocusReturn?: () => void;\n  /**\n   * Descendant ID used for continuous override of current active descendant,\n   * used for external focus control / keyDown bindings (see RTE).\n   * NOTE: setting currentDescendantId once effectively disables the keybindings of this hook.\n   * If you only need to set the current element once, use focusReturnEl & clearFocusReturn.\n   * @deprecated\n   */\n  currentDescendantId?: string;\n  /** Explicit onClick handler called on keydown 'enter' event */\n  onClick?: (currentDescendantEl: HTMLElement) => void;\n  /** Prevent scrolling to the active descendant on the initial render.\n   * Include `preventInitialScroll` for cleanup.\n   */\n  preventInitialScroll?: boolean;\n  /** Callback to clear preventInitialScroll after use. */\n  clearPreventScroll?: () => void;\n  /** Boolean to prevent descendant evaluation.\n   * @default false\n   */\n  pauseDescendantEvaluation?: boolean;\n}\n\ntype CurrentDescendant = HTMLElement | undefined;\ntype Descendants = HTMLElement[] | null;\n\nconst useActiveDescendant = (\n  {\n    focusEl,\n    scope,\n    scopeSelector,\n    selector,\n    focusDescendantEl,\n    clearFocusDescendant,\n    focusReturnEl,\n    clearFocusReturn,\n    currentDescendantId,\n    onClick,\n    preventInitialScroll,\n    pauseDescendantEvaluation = false,\n    clearPreventScroll\n  }: UseActiveDescendantConfig,\n  dependencyArray: DependencyList = []\n): {\n  activeDescendant: CurrentDescendant;\n  descendants: Descendants;\n} => {\n  const [resetId, setResetId] = useState(0);\n  const previousActiveId = useRef('');\n  const [focusDescendantElIndex, setFocusDescendantElIndex] = useState<number | null>(null);\n  const [currentIndex, setCurrentIndex] = useState<number | null>(null);\n  const [descendants, setDescendants] = useState<Descendants>();\n\n  const clearThenSetDescendants = useCallback(\n    (setVal: NodeListOf<Element> | null) => {\n      descendants?.forEach(node => {\n        node.setAttribute('data-current', 'false');\n      });\n\n      setDescendants(\n        setVal\n          ? Array.from(setVal).filter((item): item is HTMLElement => item instanceof HTMLElement)\n          : null\n      );\n    },\n    [descendants]\n  );\n\n  // ## Toggle active scope data attr.\n  useEffect(() => {\n    if (!scope || !focusEl) return;\n    const rootNode = focusEl.getRootNode() as Document;\n    let activeElement: Element | null | undefined = rootNode.activeElement;\n    if (activeElement?.tagName === 'IFRAME') {\n      activeElement = (activeElement as HTMLIFrameElement).contentDocument?.activeElement;\n    }\n    scope.setAttribute('data-active-scope', activeElement === focusEl ? 'true' : 'false');\n\n    const onFocus = () => {\n      scope.setAttribute('data-active-scope', 'true');\n    };\n    const onBlur = () => {\n      scope.setAttribute('data-active-scope', 'false');\n    };\n\n    focusEl.addEventListener('focus', onFocus);\n    focusEl.addEventListener('blur', onBlur);\n\n    return () => {\n      focusEl.removeEventListener('focus', onFocus);\n      focusEl.removeEventListener('blur', onBlur);\n    };\n  }, [scope, focusEl]);\n\n  // ## Update descendants\n  useEffect(() => {\n    if (!pauseDescendantEvaluation) {\n      // 0 second timeout added because descendantScope needs to be up to date before running query after dependencyArray change\n      setTimeout(() => {\n        let hasScope = scope;\n\n        if (hasScope && hasScope instanceof HTMLElement) {\n          if (scopeSelector) {\n            hasScope = hasScope.querySelector(scopeSelector);\n          }\n\n          if (!hasScope) {\n            clearThenSetDescendants(null);\n            return;\n          }\n\n          if (selector) {\n            clearThenSetDescendants(hasScope.querySelectorAll(selector));\n          } else {\n            clearThenSetDescendants(\n              hasScope.querySelectorAll(\n                'a, button, input, textarea, select, details, [tabindex]:not([tabindex=\"-1\"])'\n              )\n            );\n          }\n        } else {\n          clearThenSetDescendants(null);\n        }\n      }, 0);\n    }\n  }, [pauseDescendantEvaluation, scope, scopeSelector, selector, focusEl, ...dependencyArray]);\n\n  // ## Set IDs and aria-owns\n  useEffect(() => {\n    const ownedIds: string[] = [];\n    setCurrentIndex(0);\n\n    if (descendants && descendants.length) {\n      descendants.forEach(node => {\n        node.id = node.id || createUID();\n        ownedIds.push(node.id);\n      });\n    }\n\n    focusEl?.setAttribute('aria-owns', ownedIds.join(' '));\n\n    return () => {\n      focusEl?.removeAttribute('aria-owns');\n    };\n  }, [focusEl, descendants]);\n\n  // ## Bind focus el keyDown\n  useEffect(() => {\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (descendants && descendants.length) {\n        switch (e.key) {\n          case 'ArrowDown':\n            e.preventDefault();\n            // Focus next or first\n            clearFocusReturn?.();\n            clearPreventScroll?.();\n            if (currentIndex !== null && currentIndex + 1 < descendants.length) {\n              setCurrentIndex(currentIndex + 1);\n            } else {\n              setCurrentIndex(0);\n            }\n            break;\n          case 'ArrowUp':\n            e.preventDefault();\n            // Focus previous or last\n            clearFocusReturn?.();\n            clearPreventScroll?.();\n            if (currentIndex !== null && currentIndex - 1 > -1) {\n              setCurrentIndex(currentIndex - 1);\n            } else {\n              setCurrentIndex(descendants.length - 1);\n            }\n            break;\n          case 'Enter':\n            e.preventDefault();\n            // Click focused item\n            if (descendants && descendants.length && currentIndex !== null) {\n              if (onClick) {\n                onClick(descendants[currentIndex]);\n                break;\n              }\n\n              const nodeName = descendants[currentIndex].nodeName.toLowerCase();\n              if (nodeName === 'input' || nodeName === 'button' || nodeName === 'a') {\n                descendants[currentIndex].click();\n              } else {\n                descendants[currentIndex].querySelector<HTMLElement>('button, a, input')?.click();\n              }\n            }\n            break;\n          default:\n            break;\n        }\n      }\n    };\n\n    // Do not rebind once / if `currentDescendantId` control is defined\n    if (focusEl && descendants?.length && !currentDescendantId) {\n      focusEl.addEventListener('keydown', onKeyDown);\n    }\n\n    return () => {\n      focusEl?.removeEventListener('keydown', onKeyDown);\n    };\n  }, [focusEl, currentIndex, descendants]);\n\n  // ## Handle independent control update\n  useEffect(() => {\n    if (descendants && currentDescendantId) {\n      descendants.forEach((node, index) => {\n        if (node.id === currentDescendantId) {\n          setCurrentIndex(index);\n        }\n      });\n    }\n  }, [currentDescendantId, descendants]);\n\n  // ## Set and scroll to current descendant\n  useEffect(() => {\n    const nextIndex = focusDescendantElIndex || currentIndex;\n    const focusReturnId = focusReturnEl?.id;\n    let focusReturnIndex;\n    const focusDescendantElId = focusDescendantEl?.id;\n    let focusDescendantIndex;\n    let foundFocusDescendantEl = false;\n\n    if (descendants && descendants.length) {\n      // clear previous & catch focusReturn / focusDescendantEl index\n      descendants.forEach((node, index) => {\n        if (focusDescendantElIndex === null && node.id === focusDescendantElId) {\n          focusDescendantIndex = index;\n          foundFocusDescendantEl = true;\n          setFocusDescendantElIndex(index);\n        }\n        if (node.id === focusReturnId) {\n          focusReturnIndex = index;\n        }\n        node.setAttribute('data-current', 'false');\n      });\n\n      // early return for focusReturn / focusDescendantEl\n      if (focusReturnIndex && focusReturnIndex !== currentIndex) {\n        setCurrentIndex(focusReturnIndex);\n        clearFocusReturn?.();\n        return;\n      }\n      if (foundFocusDescendantEl && focusDescendantIndex !== undefined) {\n        // hard reset to continue focusDescendantEl process even if it is the active descendant\n        setResetId(Math.random());\n        setCurrentIndex(focusDescendantIndex);\n        return;\n      }\n\n      // set new\n      if (nextIndex !== null && descendants[nextIndex]) {\n        const itemEl = descendants[nextIndex!];\n        itemEl.setAttribute('data-current', 'true');\n        focusEl?.setAttribute('aria-activedescendant', itemEl.id);\n\n        // scroll to element\n        if (itemEl.id !== previousActiveId.current && !preventInitialScroll) {\n          const scrollTo: (this: Element, arg: boolean) => void =\n            Element.prototype.scrollIntoViewIfNeeded ?? Element.prototype.scrollIntoView;\n\n          scrollTo?.call(itemEl, false);\n        }\n\n        // focusDescendantEl cleanup\n        if (focusDescendantElIndex !== null) {\n          setFocusDescendantElIndex(null);\n          clearFocusDescendant?.();\n        }\n\n        previousActiveId.current = itemEl.id;\n      }\n    }\n\n    return () => {\n      focusEl?.removeAttribute('aria-activedescendant');\n    };\n  }, [descendants, currentIndex, focusDescendantEl, focusEl, resetId]);\n\n  return {\n    activeDescendant: currentIndex !== null && descendants ? descendants[currentIndex] : undefined,\n    descendants: descendants || null\n  };\n};\n\nexport const useLazyDescendant = ({\n  loading,\n  descendants,\n  previousActiveDescendant,\n  activeDescendant,\n  focusReturnEl,\n  setFocusReturnEl,\n  scrollEl\n}: {\n  loading: boolean;\n  descendants: Descendants;\n  previousActiveDescendant: CurrentDescendant;\n  activeDescendant: CurrentDescendant;\n  focusReturnEl: UseActiveDescendantConfig['focusReturnEl'];\n  setFocusReturnEl: (el: HTMLElement | null | undefined) => void;\n  scrollEl?: HTMLElement | null;\n}) => {\n  // Bump scroll & set return element when descendant focused in loading state.\n  useEffect(() => {\n    if (loading && descendants && descendants.length && activeDescendant) {\n      const descendantList = [...descendants];\n      const lastItem = descendantList.pop();\n      const lastId = lastItem?.id || undefined;\n\n      if (lastId === activeDescendant.id) {\n        if (scrollEl) {\n          scrollEl.scrollTop = scrollEl.scrollHeight - scrollEl.offsetHeight;\n        }\n\n        if (focusReturnEl?.id !== activeDescendant.id) {\n          // Set focus return to AD on 'nextTick', to avoid reset of AD on update\n          setTimeout(() => {\n            setFocusReturnEl(lastItem);\n          }, 0);\n        }\n      }\n      // If not last item\n      else if (focusReturnEl?.id !== activeDescendant.id) {\n        // Set focus return to AD on 'nextTick' to avoid reset of AD on update\n        // Do not D.R.Y to avoid conflicting calls with immediately prior elements.\n        setTimeout(() => {\n          setFocusReturnEl(activeDescendant);\n        }, 0);\n      }\n    }\n  }, [loading, descendants, previousActiveDescendant, activeDescendant, scrollEl, focusReturnEl]);\n};\n\nexport default useActiveDescendant;\n"]}