npm - @transferwise/components - Versions diffs - 46.120.0 → 46.120.1 - Mend

@transferwise/components 46.120.0 → 46.120.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2345) hide show

package/build/expressiveMoneyInput/amountInput/AmountInput.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AmountInput.mjs","sources":["../../../src/expressiveMoneyInput/amountInput/AmountInput.tsx"],"sourcesContent":["import { formatAmount } from '@transferwise/formatting';\nimport { clsx } from 'clsx';\nimport { AnimatePresence } from 'framer-motion';\nimport { type ChangeEvent, type KeyboardEvent, useEffect, useMemo, useRef, useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\nimport { AnimatedNumber } from '../animatedNumber/AnimatedNumber';\nimport { useFocus } from '../hooks/useFocus';\nimport { useInputStyle } from '../hooks/useInputStyle';\nimport {\n getDecimalCount,\n getDecimalSeparator,\n getEnteredDecimalsCount,\n getFormattedString,\n getGroupSeparator,\n getUnformattedNumber,\n isAllowedInputKey,\n isInputPossiblyOverflowing,\n} from './utils';\n\ntype Props = {\n id: string;\n describedById?: string;\n amount?: number \| null;\n currency: string;\n autoFocus?: boolean;\n onChange: (amount: number \| null) => void;\n onFocusChange?: (focused: boolean) => void;\n} & Pick<ExpressiveMoneyInputProps, 'loading'>;\n\nexport const AmountInput = ({\n id,\n describedById,\n amount,\n currency,\n autoFocus,\n onChange,\n onFocusChange,\n loading,\n}: Props) => {\n const intl = useIntl();\n const { focus, setFocus, visualFocus, setVisualFocus } = useFocus();\n\n const [value, setValue] = useState<string>(\n amount\n ? getFormattedString({\n value: amount,\n currency,\n locale: intl.locale,\n })\n : '',\n );\n const numericValue = useMemo(() => {\n return getUnformattedNumber({\n value,\n currency,\n locale: intl.locale,\n });\n }, [value, currency, intl.locale]);\n\n const valueWithFullDecimals = useMemo(() => {\n return getFormattedString({\n value: numericValue ?? 0,\n currency,\n locale: intl.locale,\n alwaysShowDecimals: true,\n });\n }, [numericValue, currency, intl.locale]);\n\n const ref = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (autoFocus) {\n ref.current?.focus();\n }\n }, []);\n\n const placeholder = getPlaceholder(currency, intl.locale);\n const groupSeparator = getGroupSeparator(currency, intl.locale);\n const decimalSeparator = getDecimalSeparator(currency, intl.locale);\n const maxDecimalCount = getDecimalCount(currency, intl.locale);\n\n const decimalPart = getDecimalPart(value, decimalSeparator);\n const decimalMode = decimalSeparator && value.includes(decimalSeparator);\n\n useEffect(() => {\n if (!focus) {\n setValue(\n amount\n ? getFormattedString({\n value: amount,\n currency,\n locale: intl.locale,\n })\n : '',\n );\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [amount]);\n\n useEffect(() => {\n onFocusChange?.(visualFocus);\n }, [visualFocus]);\n\n const shouldReformatAfterUserInput = (newValue: string) => {\n // don't reformat if formatting would wipe out user's input\n if (reformatValue(newValue) === '') {\n return false;\n }\n\n const endsWithDecimalSeparator = decimalSeparator && newValue.endsWith(decimalSeparator);\n const endsWithGroupSeparator = groupSeparator && newValue.endsWith(groupSeparator);\n\n // if the user has entered a seperator to the end, formatting would delete it\n if (endsWithDecimalSeparator \|\| endsWithGroupSeparator) {\n return false;\n }\n\n const containsDecimalSeparator = decimalSeparator && newValue.includes(decimalSeparator);\n\n if (containsDecimalSeparator) {\n const enteredDecimalsCount = getEnteredDecimalsCount(newValue, decimalSeparator);\n // don't reformat until user has entered all the allowed decimals\n // for example, we don't want 1.1 to be reformatted to 1.10 immediately\n if (enteredDecimalsCount < maxDecimalCount) {\n return false;\n }\n }\n\n return true;\n };\n\n const reformatValue = (newValue: string) => {\n const unformattedValue = getUnformattedNumber({\n value: newValue,\n currency,\n locale: intl.locale,\n });\n const formattedValue = unformattedValue\n ? getFormattedString({\n value: unformattedValue,\n currency,\n locale: intl.locale,\n })\n : '';\n return formattedValue;\n };\n\n const handleChange = (newValue: string) => {\n const oldCursorPosition = ref.current?.selectionStart ?? 0;\n\n const newFormattedString = shouldReformatAfterUserInput(newValue)\n ? reformatValue(newValue)\n : newValue;\n setValue(newFormattedString);\n\n const newNumber = getUnformattedNumber({\n value: newFormattedString,\n currency,\n locale: intl.locale,\n });\n\n if (newNumber !== numericValue) {\n if (numericValue \|\| newNumber) {\n onChange(newNumber);\n }\n }\n\n const newCursorPosition = oldCursorPosition + (newFormattedString.length - newValue.length);\n requestAnimationFrame(() => {\n ref?.current?.setSelectionRange(newCursorPosition, newCursorPosition);\n });\n };\n\n const handlePaste = (e: React.ClipboardEvent<HTMLInputElement>) => {\n e.preventDefault();\n\n const clipboardData = e.clipboardData?.getData('text/plain');\n if (!clipboardData) {\n return;\n }\n\n // need to sanitise the pasted value otherwise other validation logic will ignore the input entirely\n const sanitisedValue = reformatValue(clipboardData);\n\n handleChange(sanitisedValue);\n };\n\n const handleBlur = () => {\n setFocus(false);\n setValue(reformatValue(value));\n };\n\n const handleBackspace = (e: KeyboardEvent<HTMLInputElement>) => {\n const input = e.target as HTMLInputElement;\n // using the updated selection range after the backspace key has been processed, instead of the current selection range in state\n const { value: currentValue, selectionStart, selectionEnd } = input;\n\n if (selectionStart === selectionEnd && selectionStart && selectionStart > 0) {\n const charBeforeCursor = currentValue[selectionStart - 1];\n\n // if the user deletes a thousands separator, remove the digit before it as well\n if (charBeforeCursor === groupSeparator) {\n e.preventDefault();\n const beforeCursor = currentValue.slice(0, selectionStart - 2);\n const afterCursor = currentValue.slice(selectionStart);\n const newValue = `${beforeCursor}${afterCursor}`;\n input.setSelectionRange(beforeCursor.length, beforeCursor.length);\n handleChange(newValue);\n }\n }\n };\n\n const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n setFocus(true);\n if (!isAllowedInputKey(e)) {\n e.preventDefault();\n }\n\n if (e.key === 'Backspace') {\n handleBackspace(e);\n }\n };\n\n const isAllowedInput = (e: ChangeEvent<HTMLInputElement>) => {\n const hasMultipleDecimalSeparators =\n decimalSeparator && e.target.value.split(decimalSeparator).length > 2;\n if (hasMultipleDecimalSeparators) {\n return false;\n }\n\n const newNumericValue = getUnformattedNumber({\n value: e.target.value,\n currency,\n locale: intl.locale,\n });\n const maxLength = Number.MAX_SAFE_INTEGER.toString().length;\n if (String(newNumericValue).length > maxLength) {\n return false;\n }\n\n return true;\n };\n\n const addonContent = useMemo((): string \| null \| undefined => {\n // because we're using a separate \"addon\" element for the placeholder decimals, there is a possibility that the input itself will become scrollable\n // and the decimals will appear on top of the input. Safest thing to do is to just hide the addon if there is not enough room\n if (isInputPossiblyOverflowing({ ref, value })) {\n return null;\n }\n if (!decimalSeparator \|\| !value) {\n return null;\n }\n\n // if the user has typed a decimal separator, show the full decimal part as a placeholder\n // this returns a string even if there is no content, typing should replace the placeholder immediately without animation\n // otherwise there is an ugly animation when going from 1.23 to 1.2 due to AnimatePresence\n if (focus && decimalMode) {\n // reuse getDecimalPart\n const fullDecimalPart = getDecimalPart(valueWithFullDecimals, decimalSeparator);\n // show only the characters that are not already displayed by the input\n return fullDecimalPart?.slice(decimalPart?.length);\n }\n\n // in unfocused state, always show the full decimal part unless the user has already entered decimals\n if (!focus && !decimalMode) {\n const [_, decimalPlaceholder] = placeholder.split(decimalSeparator);\n return decimalSeparator + decimalPlaceholder;\n }\n\n return null;\n }, [\n decimalMode,\n decimalPart?.length,\n decimalSeparator,\n focus,\n placeholder,\n value,\n valueWithFullDecimals,\n ]);\n\n const style = useInputStyle({\n // whenever decimals are shown, we need to account for the full decimal part for the font size calculation\n value: addonContent ? valueWithFullDecimals : value,\n focus: visualFocus,\n inputElement: ref.current,\n loading,\n });\n\n return (\n <div className=\"wds-amount-input-container\">\n <div\n className={clsx('wds-amount-input-input-container', 'np-text-display-large')}\n style={style}\n >\n <input\n ref={ref}\n className=\"wds-amount-input-input\"\n id={id}\n autoComplete=\"off\"\n inputMode=\"decimal\"\n value={value}\n type=\"text\"\n placeholder={placeholder}\n aria-describedby={describedById}\n /* without this, the input tries to keep an aspect ratio and doesn't respect CSS width rules */\n size={1}\n onChange={(e) => {\n if (isAllowedInput(e)) {\n handleChange(e.target.value);\n }\n }}\n onBlurCapture={() => handleBlur()}\n onPaste={(e) => handlePaste(e)}\n onFocus={() => {\n setFocus(true);\n }}\n onBlur={() => {\n setTimeout(() => setVisualFocus(false), 30);\n }}\n onKeyDown={(e) => handleKeyDown(e)}\n />\n <AnimatePresence initial={false}>\n {addonContent !== null && (\n <AnimatedNumber\n className={clsx(\n 'wds-amount-input-placeholder',\n visualFocus && 'wds-amount-input-placeholder-focus',\n )}\n onClick={() => ref.current?.focus()}\n >\n {addonContent}\n </AnimatedNumber>\n )}\n </AnimatePresence>\n </div>\n </div>\n );\n};\n\nconst getPlaceholder = (currency: string, locale: string) => {\n return formatAmount(0, currency, locale, { alwaysShowDecimals: true });\n};\n\nconst getDecimalPart = (value: string, decimalSeparator: string \| null) => {\n if (!value \|\| !decimalSeparator) {\n return undefined;\n }\n\n const [_, decimalPart] = value.split(decimalSeparator);\n return decimalPart ?? undefined;\n};\n"],"names":["AmountInput","id","describedById","amount","currency","autoFocus","onChange","onFocusChange","loading","intl","useIntl","focus","setFocus","visualFocus","setVisualFocus","useFocus","value","setValue","useState","getFormattedString","locale","numericValue","useMemo","getUnformattedNumber","valueWithFullDecimals","alwaysShowDecimals","ref","useRef","useEffect","current","placeholder","getPlaceholder","groupSeparator","getGroupSeparator","decimalSeparator","getDecimalSeparator","maxDecimalCount","getDecimalCount","decimalPart","getDecimalPart","decimalMode","includes","shouldReformatAfterUserInput","newValue","reformatValue","endsWithDecimalSeparator","endsWith","endsWithGroupSeparator","containsDecimalSeparator","enteredDecimalsCount","getEnteredDecimalsCount","unformattedValue","formattedValue","handleChange","oldCursorPosition","selectionStart","newFormattedString","newNumber","newCursorPosition","length","requestAnimationFrame","setSelectionRange","handlePaste","e","preventDefault","clipboardData","getData","sanitisedValue","handleBlur","handleBackspace","input","target","currentValue","selectionEnd","charBeforeCursor","beforeCursor","slice","afterCursor","handleKeyDown","isAllowedInputKey","key","isAllowedInput","hasMultipleDecimalSeparators","split","newNumericValue","maxLength","Number","MAX_SAFE_INTEGER","toString","String","addonContent","isInputPossiblyOverflowing","fullDecimalPart","_","decimalPlaceholder","style","useInputStyle","inputElement","_jsx","className","children","_jsxs","clsx","autoComplete","inputMode","type","size","onBlurCapture","onPaste","onFocus","onBlur","setTimeout","onKeyDown","AnimatePresence","initial","AnimatedNumber","onClick","formatAmount","undefined"],"mappings":"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"}
1	+ {"version":3,"file":"AmountInput.mjs","sources":["../../../src/expressiveMoneyInput/amountInput/AmountInput.tsx"],"sourcesContent":["import { formatAmount } from '@transferwise/formatting';\nimport { clsx } from 'clsx';\nimport { AnimatePresence } from 'framer-motion';\nimport { type ChangeEvent, type KeyboardEvent, useEffect, useMemo, useRef, useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\nimport { AnimatedNumber } from '../animatedNumber/AnimatedNumber';\nimport { useFocus } from '../hooks/useFocus';\nimport { useInputStyle } from '../hooks/useInputStyle';\nimport {\n getDecimalCount,\n getDecimalSeparator,\n getEnteredDecimalsCount,\n getFormattedString,\n getGroupSeparator,\n getUnformattedNumber,\n isAllowedInputKey,\n isInputPossiblyOverflowing,\n} from './utils';\n\ntype Props = {\n id: string;\n describedById?: string;\n amount?: number \| null;\n currency: string;\n autoFocus?: boolean;\n onChange: (amount: number \| null) => void;\n onFocusChange?: (focused: boolean) => void;\n} & Pick<ExpressiveMoneyInputProps, 'loading'>;\n\nexport const AmountInput = ({\n id,\n describedById,\n amount,\n currency,\n autoFocus,\n onChange,\n onFocusChange,\n loading,\n}: Props) => {\n const intl = useIntl();\n const { focus, setFocus, visualFocus, setVisualFocus } = useFocus();\n\n const [value, setValue] = useState<string>(\n amount\n ? getFormattedString({\n value: amount,\n currency,\n locale: intl.locale,\n })\n : '',\n );\n const numericValue = useMemo(() => {\n return getUnformattedNumber({\n value,\n currency,\n locale: intl.locale,\n });\n }, [value, currency, intl.locale]);\n\n const valueWithFullDecimals = useMemo(() => {\n return getFormattedString({\n value: numericValue ?? 0,\n currency,\n locale: intl.locale,\n alwaysShowDecimals: true,\n });\n }, [numericValue, currency, intl.locale]);\n\n const ref = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (autoFocus) {\n ref.current?.focus();\n }\n }, []);\n\n const placeholder = getPlaceholder(currency, intl.locale);\n const groupSeparator = getGroupSeparator(currency, intl.locale);\n const decimalSeparator = getDecimalSeparator(currency, intl.locale);\n const maxDecimalCount = getDecimalCount(currency, intl.locale);\n\n const decimalPart = getDecimalPart(value, decimalSeparator);\n const decimalMode = decimalSeparator && value.includes(decimalSeparator);\n\n useEffect(() => {\n if (!focus) {\n setValue(\n amount\n ? getFormattedString({\n value: amount,\n currency,\n locale: intl.locale,\n })\n : '',\n );\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [amount]);\n\n useEffect(() => {\n onFocusChange?.(visualFocus);\n }, [visualFocus]);\n\n const shouldReformatAfterUserInput = (newValue: string) => {\n // don't reformat if formatting would wipe out user's input\n if (reformatValue(newValue) === '') {\n return false;\n }\n\n const endsWithDecimalSeparator = decimalSeparator && newValue.endsWith(decimalSeparator);\n const endsWithGroupSeparator = groupSeparator && newValue.endsWith(groupSeparator);\n\n // if the user has entered a seperator to the end, formatting would delete it\n if (endsWithDecimalSeparator \|\| endsWithGroupSeparator) {\n return false;\n }\n\n const containsDecimalSeparator = decimalSeparator && newValue.includes(decimalSeparator);\n\n if (containsDecimalSeparator) {\n const enteredDecimalsCount = getEnteredDecimalsCount(newValue, decimalSeparator);\n // don't reformat until user has entered all the allowed decimals\n // for example, we don't want 1.1 to be reformatted to 1.10 immediately\n if (enteredDecimalsCount < maxDecimalCount) {\n return false;\n }\n }\n\n return true;\n };\n\n const reformatValue = (newValue: string) => {\n const unformattedValue = getUnformattedNumber({\n value: newValue,\n currency,\n locale: intl.locale,\n });\n const formattedValue = unformattedValue\n ? getFormattedString({\n value: unformattedValue,\n currency,\n locale: intl.locale,\n })\n : '';\n return formattedValue;\n };\n\n const handleChange = (newValue: string) => {\n const oldCursorPosition = ref.current?.selectionStart ?? 0;\n\n const newFormattedString = shouldReformatAfterUserInput(newValue)\n ? reformatValue(newValue)\n : newValue;\n setValue(newFormattedString);\n\n const newNumber = getUnformattedNumber({\n value: newFormattedString,\n currency,\n locale: intl.locale,\n });\n\n if (newNumber !== numericValue) {\n if (numericValue \|\| newNumber) {\n onChange(newNumber);\n }\n }\n\n const newCursorPosition = oldCursorPosition + (newFormattedString.length - newValue.length);\n requestAnimationFrame(() => {\n ref?.current?.setSelectionRange(newCursorPosition, newCursorPosition);\n });\n };\n\n const handlePaste = (e: React.ClipboardEvent<HTMLInputElement>) => {\n e.preventDefault();\n\n const clipboardData = e.clipboardData?.getData('text/plain');\n if (!clipboardData) {\n return;\n }\n\n // need to sanitise the pasted value otherwise other validation logic will ignore the input entirely\n const sanitisedValue = reformatValue(clipboardData);\n\n handleChange(sanitisedValue);\n };\n\n const handleBlur = () => {\n setFocus(false);\n setValue(reformatValue(value));\n };\n\n const handleBackspace = (e: KeyboardEvent<HTMLInputElement>) => {\n const input = e.target as HTMLInputElement;\n // using the updated selection range after the backspace key has been processed, instead of the current selection range in state\n const { value: currentValue, selectionStart, selectionEnd } = input;\n\n if (selectionStart === selectionEnd && selectionStart && selectionStart > 0) {\n const charBeforeCursor = currentValue[selectionStart - 1];\n\n // if the user deletes a thousands separator, remove the digit before it as well\n if (charBeforeCursor === groupSeparator) {\n e.preventDefault();\n const beforeCursor = currentValue.slice(0, selectionStart - 2);\n const afterCursor = currentValue.slice(selectionStart);\n const newValue = `${beforeCursor}${afterCursor}`;\n input.setSelectionRange(beforeCursor.length, beforeCursor.length);\n handleChange(newValue);\n }\n }\n };\n\n const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n setFocus(true);\n if (!isAllowedInputKey(e)) {\n e.preventDefault();\n }\n\n if (e.key === 'Backspace') {\n handleBackspace(e);\n }\n };\n\n const isAllowedInput = (e: ChangeEvent<HTMLInputElement>) => {\n const hasMultipleDecimalSeparators =\n decimalSeparator && e.target.value.split(decimalSeparator).length > 2;\n if (hasMultipleDecimalSeparators) {\n return false;\n }\n\n const newNumericValue = getUnformattedNumber({\n value: e.target.value,\n currency,\n locale: intl.locale,\n });\n const maxLength = Number.MAX_SAFE_INTEGER.toString().length;\n if (String(newNumericValue).length > maxLength) {\n return false;\n }\n\n return true;\n };\n\n const addonContent = useMemo((): string \| null \| undefined => {\n // because we're using a separate \"addon\" element for the placeholder decimals, there is a possibility that the input itself will become scrollable\n // and the decimals will appear on top of the input. Safest thing to do is to just hide the addon if there is not enough room\n if (isInputPossiblyOverflowing({ ref, value })) {\n return null;\n }\n if (!decimalSeparator \|\| !value) {\n return null;\n }\n\n // if the user has typed a decimal separator, show the full decimal part as a placeholder\n // this returns a string even if there is no content, typing should replace the placeholder immediately without animation\n // otherwise there is an ugly animation when going from 1.23 to 1.2 due to AnimatePresence\n if (focus && decimalMode) {\n // reuse getDecimalPart\n const fullDecimalPart = getDecimalPart(valueWithFullDecimals, decimalSeparator);\n // show only the characters that are not already displayed by the input\n return fullDecimalPart?.slice(decimalPart?.length);\n }\n\n // in unfocused state, always show the full decimal part unless the user has already entered decimals\n if (!focus && !decimalMode) {\n const [_, decimalPlaceholder] = placeholder.split(decimalSeparator);\n return decimalSeparator + decimalPlaceholder;\n }\n\n return null;\n }, [\n decimalMode,\n decimalPart?.length,\n decimalSeparator,\n focus,\n placeholder,\n value,\n valueWithFullDecimals,\n ]);\n\n const style = useInputStyle({\n // whenever decimals are shown, we need to account for the full decimal part for the font size calculation\n value: addonContent ? valueWithFullDecimals : value,\n focus: visualFocus,\n inputElement: ref.current,\n loading,\n });\n\n return (\n <div className=\"wds-amount-input-container\">\n <div\n className={clsx('wds-amount-input-input-container', 'np-text-display-large')}\n style={style}\n >\n <input\n ref={ref}\n className=\"wds-amount-input-input\"\n id={id}\n autoComplete=\"off\"\n inputMode=\"decimal\"\n value={value}\n type=\"text\"\n placeholder={placeholder}\n aria-describedby={describedById}\n /* without this, the input tries to keep an aspect ratio and doesn't respect CSS width rules */\n size={1}\n onChange={(e) => {\n if (isAllowedInput(e)) {\n handleChange(e.target.value);\n }\n }}\n onBlurCapture={() => handleBlur()}\n onPaste={(e) => handlePaste(e)}\n onFocus={() => {\n setFocus(true);\n }}\n onBlur={() => {\n setTimeout(() => setVisualFocus(false), 30);\n }}\n onKeyDown={(e) => handleKeyDown(e)}\n />\n <AnimatePresence initial={false}>\n {addonContent !== null && (\n <AnimatedNumber\n className={clsx(\n 'wds-amount-input-placeholder',\n visualFocus && 'wds-amount-input-placeholder-focus',\n )}\n onClick={() => ref.current?.focus()}\n >\n {addonContent}\n </AnimatedNumber>\n )}\n </AnimatePresence>\n </div>\n </div>\n );\n};\n\nconst getPlaceholder = (currency: string, locale: string) => {\n return formatAmount(0, currency, locale, { alwaysShowDecimals: true });\n};\n\nconst getDecimalPart = (value: string, decimalSeparator: string \| null) => {\n if (!value \|\| !decimalSeparator) {\n return undefined;\n }\n\n const [_, decimalPart] = value.split(decimalSeparator);\n return decimalPart ?? undefined;\n};\n"],"names":["AmountInput","id","describedById","amount","currency","autoFocus","onChange","onFocusChange","loading","intl","useIntl","focus","setFocus","visualFocus","setVisualFocus","useFocus","value","setValue","useState","getFormattedString","locale","numericValue","useMemo","getUnformattedNumber","valueWithFullDecimals","alwaysShowDecimals","ref","useRef","useEffect","current","placeholder","getPlaceholder","groupSeparator","getGroupSeparator","decimalSeparator","getDecimalSeparator","maxDecimalCount","getDecimalCount","decimalPart","getDecimalPart","decimalMode","includes","shouldReformatAfterUserInput","newValue","reformatValue","endsWithDecimalSeparator","endsWith","endsWithGroupSeparator","containsDecimalSeparator","enteredDecimalsCount","getEnteredDecimalsCount","unformattedValue","formattedValue","handleChange","oldCursorPosition","selectionStart","newFormattedString","newNumber","newCursorPosition","length","requestAnimationFrame","setSelectionRange","handlePaste","e","preventDefault","clipboardData","getData","sanitisedValue","handleBlur","handleBackspace","input","target","currentValue","selectionEnd","charBeforeCursor","beforeCursor","slice","afterCursor","handleKeyDown","isAllowedInputKey","key","isAllowedInput","hasMultipleDecimalSeparators","split","newNumericValue","maxLength","Number","MAX_SAFE_INTEGER","toString","String","addonContent","isInputPossiblyOverflowing","fullDecimalPart","_","decimalPlaceholder","style","useInputStyle","inputElement","_jsx","className","children","_jsxs","clsx","autoComplete","inputMode","type","size","onBlurCapture","onPaste","onFocus","onBlur","setTimeout","onKeyDown","AnimatePresence","initial","AnimatedNumber","onClick","formatAmount","undefined"],"mappings":"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"}

package/build/expressiveMoneyInput/amountInput/utils.js CHANGED Viewed

@@ -29,10 +29,8 @@ const getUnformattedNumber = ({
   if (!formattedValue) {
     return null;
   }
   // parseFloat can't handle thousands separators
   const withoutGroupSeparator = groupSeparator ? formattedValue.replace(/ /gu, '').replace(new RegExp(`\\${groupSeparator}`, 'g'), '') : formattedValue;
   // parseFloat can only handle . as decimal separator
   const withNormalisedDecimalSeparator = decimalSeparator ? withoutGroupSeparator.replace(decimalSeparator, '.') : withoutGroupSeparator;
   const parsedValue = Number.parseFloat(withNormalisedDecimalSeparator);

package/build/expressiveMoneyInput/amountInput/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sources":["../../../src/expressiveMoneyInput/amountInput/utils.ts"],"sourcesContent":["import { formatAmount } from '@transferwise/formatting';\nimport type { KeyboardEvent } from 'react';\n\nexport const getDecimalSeparator = (currency: string, locale: string): string \| null => {\n return formatAmount(1.1, currency, locale).replace(/\\p{Number}/gu, '');\n};\n\nexport const getGroupSeparator = (currency: string, locale: string): string \| null => {\n return formatAmount(10000000, currency, locale).replace(/\\p{Number}/gu, '')[0];\n};\n\nexport const getDecimalCount = (currency: string, locale: string): number => {\n const decimalSeparator = getDecimalSeparator(currency, locale);\n if (!decimalSeparator) {\n return 0;\n }\n const parts = formatAmount(1.1, currency, locale).split(decimalSeparator);\n return parts.length === 2 ? parts[1].length : 0;\n};\n\nexport const getEnteredDecimalsCount = (value: string, decimalSeparator: string) => {\n return value.split(decimalSeparator)[1]?.length ?? 0;\n};\n\nexport const getUnformattedNumber = ({\n value: formattedValue,\n currency,\n locale,\n}: {\n value: string;\n currency: string;\n locale: string;\n}): number \| null => {\n const groupSeparator = getGroupSeparator(currency, locale);\n const decimalSeparator = getDecimalSeparator(currency, locale);\n if (!formattedValue) {\n return null;\n }\n\n // parseFloat can't handle thousands separators\n const withoutGroupSeparator = groupSeparator\n ? formattedValue.replace(/ /gu, '').replace(new RegExp(`\\\\${groupSeparator}`, 'g'), '')\n : formattedValue;\n\n // parseFloat can only handle . as decimal separator\n const withNormalisedDecimalSeparator = decimalSeparator\n ? withoutGroupSeparator.replace(decimalSeparator, '.')\n : withoutGroupSeparator;\n\n const parsedValue = Number.parseFloat(withNormalisedDecimalSeparator);\n return parsedValue;\n};\n\nexport const getFormattedString = ({\n value: unformattedValue,\n currency,\n locale,\n alwaysShowDecimals = false,\n}: {\n value: number;\n currency: string;\n locale: string;\n alwaysShowDecimals?: boolean;\n}): string => {\n const decimalSeparator = getDecimalSeparator(currency, locale);\n // formatAmount rounds extra decimals, so 1.999 will become 2. Instead we will manually strip extra decimals so that it becomes 1.99 after formatting\n const decimalCount = getDecimalCount(currency, locale);\n const unformattedString = unformattedValue.toString();\n\n const [integerPart, decimalPart] = decimalSeparator\n ? unformattedString.split(decimalSeparator)\n : [unformattedString, undefined];\n\n const formattedDecimalPart = decimalPart ? decimalPart.slice(0, decimalCount) : '';\n\n const sanitisedUnformattedValue = Number.parseFloat(`${integerPart}.${formattedDecimalPart}`);\n\n return formatAmount(sanitisedUnformattedValue, currency, locale, {\n alwaysShowDecimals,\n });\n};\n\nexport const isInputPossiblyOverflowing = ({\n ref,\n value,\n}: {\n ref: React.RefObject<HTMLInputElement>;\n value: string;\n}) => {\n const textLength = value.length;\n const inputWidth = ref.current?.clientWidth;\n if (!inputWidth \|\| !textLength) {\n return;\n }\n\n const maxCharactersWithoutOverflow = Math.floor(inputWidth / 19);\n return textLength > maxCharactersWithoutOverflow;\n};\n\nconst allowedInputKeys = new Set([\n 'Backspace',\n 'Delete',\n ',',\n '.',\n 'ArrowLeft',\n 'ArrowRight',\n 'Enter',\n 'Tab',\n]);\n\nexport const isAllowedInputKey = (e: KeyboardEvent<HTMLInputElement>) => {\n const { metaKey, key, ctrlKey } = e;\n const isNumberKey = !Number.isNaN(Number.parseInt(key, 10));\n\n return isNumberKey \|\| metaKey \|\| ctrlKey \|\| allowedInputKeys.has(key);\n};\n"],"names":["getDecimalSeparator","currency","locale","formatAmount","replace","getGroupSeparator","getDecimalCount","decimalSeparator","parts","split","length","getEnteredDecimalsCount","value","getUnformattedNumber","formattedValue","groupSeparator","withoutGroupSeparator","RegExp","withNormalisedDecimalSeparator","parsedValue","Number","parseFloat","getFormattedString","unformattedValue","alwaysShowDecimals","decimalCount","unformattedString","toString","integerPart","decimalPart","undefined","formattedDecimalPart","slice","sanitisedUnformattedValue","isInputPossiblyOverflowing","ref","textLength","inputWidth","current","clientWidth","maxCharactersWithoutOverflow","Math","floor","allowedInputKeys","Set","isAllowedInputKey","e","metaKey","key","ctrlKey","isNumberKey","isNaN","parseInt","has"],"mappings":";;;;MAGaA,mBAAmB,GAAGA,CAACC,QAAgB,EAAEC,MAAc,~~KAAoB~~;~~AACtF~~,EAAA,OAAOC,uBAAY,CAAC,GAAG,EAAEF,QAAQ,EAAEC,MAAM,CAAC,CAACE,OAAO,CAAC,cAAc,EAAE,EAAE,CAAC;AACxE;MAEaC,iBAAiB,GAAGA,CAACJ,QAAgB,EAAEC,MAAc,~~KAAoB~~;~~AACpF~~,EAAA,OAAOC,uBAAY,CAAC,QAAQ,EAAEF,QAAQ,EAAEC,MAAM,CAAC,CAACE,OAAO,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAChF;MAEaE,eAAe,GAAGA,CAACL,QAAgB,EAAEC,MAAc,~~KAAa~~;~~AAC3E~~,EAAA,MAAMK,gBAAgB,GAAGP,mBAAmB,CAACC,QAAQ,EAAEC,MAAM,CAAC;EAC9D,IAAI,CAACK,gBAAgB,EAAE;AACrB,IAAA,OAAO,CAAC;AACV,EAAA;AACA,EAAA,MAAMC,KAAK,GAAGL,uBAAY,CAAC,GAAG,EAAEF,QAAQ,EAAEC,MAAM,CAAC,CAACO,KAAK,CAACF,gBAAgB,CAAC;AACzE,EAAA,OAAOC,KAAK,CAACE,MAAM,KAAK,CAAC,GAAGF,KAAK,CAAC,CAAC,CAAC,CAACE,MAAM,GAAG,CAAC;AACjD;MAEaC,uBAAuB,GAAGA,CAACC,KAAa,EAAEL,gBAAwB,~~KAAK~~;~~AAClF~~,EAAA,OAAOK,KAAK,CAACH,KAAK,CAACF,gBAAgB,CAAC,CAAC,CAAC,CAAC,EAAEG,MAAM,IAAI,CAAC;AACtD;AAEO,MAAMG,oBAAoB,GAAGA,CAAC;AACnCD,EAAAA,KAAK,EAAEE,cAAc;EACrBb,QAAQ;AACRC,EAAAA;~~AAKF~~,~~CAAC~~,~~KAAoB~~;~~AACnB~~,EAAA,MAAMa,cAAc,GAAGV,iBAAiB,CAACJ,QAAQ,EAAEC,MAAM,CAAC;AAC1D,EAAA,MAAMK,gBAAgB,GAAGP,mBAAmB,CAACC,QAAQ,EAAEC,MAAM,CAAC;EAC9D,IAAI,CAACY,cAAc,EAAE;AACnB,IAAA,OAAO,IAAI;AACb,EAAA;;AAEA;AACA,EAAA,MAAME,qBAAqB,GAAGD,cAAc,GACxCD,cAAc,CAACV,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAACA,OAAO,CAAC,IAAIa,MAAM,CAAC,CAAA,EAAA,EAAKF,cAAc,CAAA,CAAE,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC,GACrFD,cAAc;;AAElB;AACA,EAAA,MAAMI,8BAA8B,GAAGX,gBAAgB,GACnDS,qBAAqB,CAACZ,OAAO,CAACG,gBAAgB,EAAE,GAAG,CAAC,GACpDS,qBAAqB;AAEzB,EAAA,MAAMG,WAAW,GAAGC,MAAM,CAACC,UAAU,CAACH,8BAA8B,CAAC;AACrE,EAAA,OAAOC,WAAW;AACpB;AAEO,MAAMG,kBAAkB,GAAGA,CAAC;AACjCV,EAAAA,KAAK,EAAEW,gBAAgB;EACvBtB,QAAQ;EACRC,MAAM;AACNsB,EAAAA,kBAAkB,GAAG;~~AAMvB~~,~~CAAC~~,~~KAAa~~;~~AACZ~~,EAAA,MAAMjB,gBAAgB,GAAGP,mBAAmB,CAACC,QAAQ,EAAEC,MAAM,CAAC;AAC9D;AACA,EAAA,MAAMuB,YAAY,GAAGnB,eAAe,CAACL,QAAQ,EAAEC,MAAM,CAAC;AACtD,EAAA,MAAMwB,iBAAiB,GAAGH,gBAAgB,CAACI,QAAQ,EAAE;AAErD,EAAA,MAAM,CAACC,WAAW,EAAEC,WAAW,CAAC,GAAGtB,gBAAgB,GAC/CmB,iBAAiB,CAACjB,KAAK,CAACF,gBAAgB,CAAC,GACzC,CAACmB,iBAAiB,EAAEI,SAAS,CAAC;AAElC,EAAA,MAAMC,oBAAoB,GAAGF,WAAW,GAAGA,WAAW,CAACG,KAAK,CAAC,CAAC,EAAEP,YAAY,CAAC,GAAG,EAAE;EAElF,MAAMQ,yBAAyB,GAAGb,MAAM,CAACC,UAAU,CAAC,CAAA,EAAGO,WAAW,CAAA,CAAA,EAAIG,oBAAoB,CAAA,CAAE,CAAC;AAE7F,EAAA,OAAO5B,uBAAY,CAAC8B,yBAAyB,EAAEhC,QAAQ,EAAEC,MAAM,EAAE;AAC/DsB,IAAAA;~~AACF~~,~~GAAC~~,CAAC;AACJ;AAEO,MAAMU,0BAA0B,GAAGA,CAAC;EACzCC,GAAG;AACHvB,EAAAA;~~AAIF~~,~~CAAC~~,~~KAAK~~;~~AACJ~~,EAAA,MAAMwB,UAAU,GAAGxB,KAAK,CAACF,MAAM;AAC/B,EAAA,MAAM2B,UAAU,GAAGF,GAAG,CAACG,OAAO,EAAEC,WAAW;AAC3C,EAAA,IAAI,CAACF,UAAU,IAAI,CAACD,UAAU,EAAE;AAC9B,IAAA;AACF,EAAA;EAEA,MAAMI,4BAA4B,GAAGC,IAAI,CAACC,KAAK,CAACL,UAAU,GAAG,EAAE,CAAC;EAChE,OAAOD,UAAU,GAAGI,4BAA4B;AAClD;AAEA,MAAMG,gBAAgB,GAAG,IAAIC,GAAG,CAAC,CAC/B,WAAW,EACX,QAAQ,EACR,GAAG,EACH,GAAG,EACH,WAAW,EACX,YAAY,EACZ,OAAO,EACP,KAAK,CACN,CAAC;AAEK,MAAMC,iBAAiB,GAAIC,CAAkC,~~IAAK~~;~~EACvE~~,MAAM;IAAEC,OAAO;IAAEC,GAAG;AAAEC,IAAAA;~~AAAQ~~,~~GAAC~~,GAAGH,CAAC;AACnC,EAAA,MAAMI,WAAW,GAAG,CAAC9B,MAAM,CAAC+B,KAAK,CAAC/B,MAAM,CAACgC,QAAQ,CAACJ,GAAG,EAAE,EAAE,CAAC,CAAC;EAE3D,OAAOE,WAAW,IAAIH,OAAO,IAAIE,OAAO,IAAIN,gBAAgB,CAACU,GAAG,CAACL,GAAG,CAAC;AACvE;;;;;;;;;;;"}
1	+ {"version":3,"file":"utils.js","sources":["../../../src/expressiveMoneyInput/amountInput/utils.ts"],"sourcesContent":["import { formatAmount } from '@transferwise/formatting';\nimport type { KeyboardEvent } from 'react';\n\nexport const getDecimalSeparator = (currency: string, locale: string): string \| null => {\n return formatAmount(1.1, currency, locale).replace(/\\p{Number}/gu, '');\n};\n\nexport const getGroupSeparator = (currency: string, locale: string): string \| null => {\n return formatAmount(10000000, currency, locale).replace(/\\p{Number}/gu, '')[0];\n};\n\nexport const getDecimalCount = (currency: string, locale: string): number => {\n const decimalSeparator = getDecimalSeparator(currency, locale);\n if (!decimalSeparator) {\n return 0;\n }\n const parts = formatAmount(1.1, currency, locale).split(decimalSeparator);\n return parts.length === 2 ? parts[1].length : 0;\n};\n\nexport const getEnteredDecimalsCount = (value: string, decimalSeparator: string) => {\n return value.split(decimalSeparator)[1]?.length ?? 0;\n};\n\nexport const getUnformattedNumber = ({\n value: formattedValue,\n currency,\n locale,\n}: {\n value: string;\n currency: string;\n locale: string;\n}): number \| null => {\n const groupSeparator = getGroupSeparator(currency, locale);\n const decimalSeparator = getDecimalSeparator(currency, locale);\n if (!formattedValue) {\n return null;\n }\n\n // parseFloat can't handle thousands separators\n const withoutGroupSeparator = groupSeparator\n ? formattedValue.replace(/ /gu, '').replace(new RegExp(`\\\\${groupSeparator}`, 'g'), '')\n : formattedValue;\n\n // parseFloat can only handle . as decimal separator\n const withNormalisedDecimalSeparator = decimalSeparator\n ? withoutGroupSeparator.replace(decimalSeparator, '.')\n : withoutGroupSeparator;\n\n const parsedValue = Number.parseFloat(withNormalisedDecimalSeparator);\n return parsedValue;\n};\n\nexport const getFormattedString = ({\n value: unformattedValue,\n currency,\n locale,\n alwaysShowDecimals = false,\n}: {\n value: number;\n currency: string;\n locale: string;\n alwaysShowDecimals?: boolean;\n}): string => {\n const decimalSeparator = getDecimalSeparator(currency, locale);\n // formatAmount rounds extra decimals, so 1.999 will become 2. Instead we will manually strip extra decimals so that it becomes 1.99 after formatting\n const decimalCount = getDecimalCount(currency, locale);\n const unformattedString = unformattedValue.toString();\n\n const [integerPart, decimalPart] = decimalSeparator\n ? unformattedString.split(decimalSeparator)\n : [unformattedString, undefined];\n\n const formattedDecimalPart = decimalPart ? decimalPart.slice(0, decimalCount) : '';\n\n const sanitisedUnformattedValue = Number.parseFloat(`${integerPart}.${formattedDecimalPart}`);\n\n return formatAmount(sanitisedUnformattedValue, currency, locale, {\n alwaysShowDecimals,\n });\n};\n\nexport const isInputPossiblyOverflowing = ({\n ref,\n value,\n}: {\n ref: React.RefObject<HTMLInputElement>;\n value: string;\n}) => {\n const textLength = value.length;\n const inputWidth = ref.current?.clientWidth;\n if (!inputWidth \|\| !textLength) {\n return;\n }\n\n const maxCharactersWithoutOverflow = Math.floor(inputWidth / 19);\n return textLength > maxCharactersWithoutOverflow;\n};\n\nconst allowedInputKeys = new Set([\n 'Backspace',\n 'Delete',\n ',',\n '.',\n 'ArrowLeft',\n 'ArrowRight',\n 'Enter',\n 'Tab',\n]);\n\nexport const isAllowedInputKey = (e: KeyboardEvent<HTMLInputElement>) => {\n const { metaKey, key, ctrlKey } = e;\n const isNumberKey = !Number.isNaN(Number.parseInt(key, 10));\n\n return isNumberKey \|\| metaKey \|\| ctrlKey \|\| allowedInputKeys.has(key);\n};\n"],"names":["getDecimalSeparator","currency","locale","formatAmount","replace","getGroupSeparator","getDecimalCount","decimalSeparator","parts","split","length","getEnteredDecimalsCount","value","getUnformattedNumber","formattedValue","groupSeparator","withoutGroupSeparator","RegExp","withNormalisedDecimalSeparator","parsedValue","Number","parseFloat","getFormattedString","unformattedValue","alwaysShowDecimals","decimalCount","unformattedString","toString","integerPart","decimalPart","undefined","formattedDecimalPart","slice","sanitisedUnformattedValue","isInputPossiblyOverflowing","ref","textLength","inputWidth","current","clientWidth","maxCharactersWithoutOverflow","Math","floor","allowedInputKeys","Set","isAllowedInputKey","e","metaKey","key","ctrlKey","isNumberKey","isNaN","parseInt","has"],"mappings":"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"}

package/build/expressiveMoneyInput/amountInput/utils.mjs CHANGED Viewed

@@ -27,10 +27,8 @@ const getUnformattedNumber = ({
   if (!formattedValue) {
     return null;
   }
   // parseFloat can't handle thousands separators
   const withoutGroupSeparator = groupSeparator ? formattedValue.replace(/ /gu, '').replace(new RegExp(`\\${groupSeparator}`, 'g'), '') : formattedValue;
   // parseFloat can only handle . as decimal separator
   const withNormalisedDecimalSeparator = decimalSeparator ? withoutGroupSeparator.replace(decimalSeparator, '.') : withoutGroupSeparator;
   const parsedValue = Number.parseFloat(withNormalisedDecimalSeparator);

package/build/expressiveMoneyInput/amountInput/utils.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.mjs","sources":["../../../src/expressiveMoneyInput/amountInput/utils.ts"],"sourcesContent":["import { formatAmount } from '@transferwise/formatting';\nimport type { KeyboardEvent } from 'react';\n\nexport const getDecimalSeparator = (currency: string, locale: string): string \| null => {\n return formatAmount(1.1, currency, locale).replace(/\\p{Number}/gu, '');\n};\n\nexport const getGroupSeparator = (currency: string, locale: string): string \| null => {\n return formatAmount(10000000, currency, locale).replace(/\\p{Number}/gu, '')[0];\n};\n\nexport const getDecimalCount = (currency: string, locale: string): number => {\n const decimalSeparator = getDecimalSeparator(currency, locale);\n if (!decimalSeparator) {\n return 0;\n }\n const parts = formatAmount(1.1, currency, locale).split(decimalSeparator);\n return parts.length === 2 ? parts[1].length : 0;\n};\n\nexport const getEnteredDecimalsCount = (value: string, decimalSeparator: string) => {\n return value.split(decimalSeparator)[1]?.length ?? 0;\n};\n\nexport const getUnformattedNumber = ({\n value: formattedValue,\n currency,\n locale,\n}: {\n value: string;\n currency: string;\n locale: string;\n}): number \| null => {\n const groupSeparator = getGroupSeparator(currency, locale);\n const decimalSeparator = getDecimalSeparator(currency, locale);\n if (!formattedValue) {\n return null;\n }\n\n // parseFloat can't handle thousands separators\n const withoutGroupSeparator = groupSeparator\n ? formattedValue.replace(/ /gu, '').replace(new RegExp(`\\\\${groupSeparator}`, 'g'), '')\n : formattedValue;\n\n // parseFloat can only handle . as decimal separator\n const withNormalisedDecimalSeparator = decimalSeparator\n ? withoutGroupSeparator.replace(decimalSeparator, '.')\n : withoutGroupSeparator;\n\n const parsedValue = Number.parseFloat(withNormalisedDecimalSeparator);\n return parsedValue;\n};\n\nexport const getFormattedString = ({\n value: unformattedValue,\n currency,\n locale,\n alwaysShowDecimals = false,\n}: {\n value: number;\n currency: string;\n locale: string;\n alwaysShowDecimals?: boolean;\n}): string => {\n const decimalSeparator = getDecimalSeparator(currency, locale);\n // formatAmount rounds extra decimals, so 1.999 will become 2. Instead we will manually strip extra decimals so that it becomes 1.99 after formatting\n const decimalCount = getDecimalCount(currency, locale);\n const unformattedString = unformattedValue.toString();\n\n const [integerPart, decimalPart] = decimalSeparator\n ? unformattedString.split(decimalSeparator)\n : [unformattedString, undefined];\n\n const formattedDecimalPart = decimalPart ? decimalPart.slice(0, decimalCount) : '';\n\n const sanitisedUnformattedValue = Number.parseFloat(`${integerPart}.${formattedDecimalPart}`);\n\n return formatAmount(sanitisedUnformattedValue, currency, locale, {\n alwaysShowDecimals,\n });\n};\n\nexport const isInputPossiblyOverflowing = ({\n ref,\n value,\n}: {\n ref: React.RefObject<HTMLInputElement>;\n value: string;\n}) => {\n const textLength = value.length;\n const inputWidth = ref.current?.clientWidth;\n if (!inputWidth \|\| !textLength) {\n return;\n }\n\n const maxCharactersWithoutOverflow = Math.floor(inputWidth / 19);\n return textLength > maxCharactersWithoutOverflow;\n};\n\nconst allowedInputKeys = new Set([\n 'Backspace',\n 'Delete',\n ',',\n '.',\n 'ArrowLeft',\n 'ArrowRight',\n 'Enter',\n 'Tab',\n]);\n\nexport const isAllowedInputKey = (e: KeyboardEvent<HTMLInputElement>) => {\n const { metaKey, key, ctrlKey } = e;\n const isNumberKey = !Number.isNaN(Number.parseInt(key, 10));\n\n return isNumberKey \|\| metaKey \|\| ctrlKey \|\| allowedInputKeys.has(key);\n};\n"],"names":["getDecimalSeparator","currency","locale","formatAmount","replace","getGroupSeparator","getDecimalCount","decimalSeparator","parts","split","length","getEnteredDecimalsCount","value","getUnformattedNumber","formattedValue","groupSeparator","withoutGroupSeparator","RegExp","withNormalisedDecimalSeparator","parsedValue","Number","parseFloat","getFormattedString","unformattedValue","alwaysShowDecimals","decimalCount","unformattedString","toString","integerPart","decimalPart","undefined","formattedDecimalPart","slice","sanitisedUnformattedValue","isInputPossiblyOverflowing","ref","textLength","inputWidth","current","clientWidth","maxCharactersWithoutOverflow","Math","floor","allowedInputKeys","Set","isAllowedInputKey","e","metaKey","key","ctrlKey","isNumberKey","isNaN","parseInt","has"],"mappings":";;MAGaA,mBAAmB,GAAGA,CAACC,QAAgB,EAAEC,MAAc,~~KAAoB~~;~~AACtF~~,EAAA,OAAOC,YAAY,CAAC,GAAG,EAAEF,QAAQ,EAAEC,MAAM,CAAC,CAACE,OAAO,CAAC,cAAc,EAAE,EAAE,CAAC;AACxE;MAEaC,iBAAiB,GAAGA,CAACJ,QAAgB,EAAEC,MAAc,~~KAAoB~~;~~AACpF~~,EAAA,OAAOC,YAAY,CAAC,QAAQ,EAAEF,QAAQ,EAAEC,MAAM,CAAC,CAACE,OAAO,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAChF;MAEaE,eAAe,GAAGA,CAACL,QAAgB,EAAEC,MAAc,~~KAAa~~;~~AAC3E~~,EAAA,MAAMK,gBAAgB,GAAGP,mBAAmB,CAACC,QAAQ,EAAEC,MAAM,CAAC;EAC9D,IAAI,CAACK,gBAAgB,EAAE;AACrB,IAAA,OAAO,CAAC;AACV,EAAA;AACA,EAAA,MAAMC,KAAK,GAAGL,YAAY,CAAC,GAAG,EAAEF,QAAQ,EAAEC,MAAM,CAAC,CAACO,KAAK,CAACF,gBAAgB,CAAC;AACzE,EAAA,OAAOC,KAAK,CAACE,MAAM,KAAK,CAAC,GAAGF,KAAK,CAAC,CAAC,CAAC,CAACE,MAAM,GAAG,CAAC;AACjD;MAEaC,uBAAuB,GAAGA,CAACC,KAAa,EAAEL,gBAAwB,~~KAAK~~;~~AAClF~~,EAAA,OAAOK,KAAK,CAACH,KAAK,CAACF,gBAAgB,CAAC,CAAC,CAAC,CAAC,EAAEG,MAAM,IAAI,CAAC;AACtD;AAEO,MAAMG,oBAAoB,GAAGA,CAAC;AACnCD,EAAAA,KAAK,EAAEE,cAAc;EACrBb,QAAQ;AACRC,EAAAA;~~AAKF~~,~~CAAC~~,~~KAAoB~~;~~AACnB~~,EAAA,MAAMa,cAAc,GAAGV,iBAAiB,CAACJ,QAAQ,EAAEC,MAAM,CAAC;AAC1D,EAAA,MAAMK,gBAAgB,GAAGP,mBAAmB,CAACC,QAAQ,EAAEC,MAAM,CAAC;EAC9D,IAAI,CAACY,cAAc,EAAE;AACnB,IAAA,OAAO,IAAI;AACb,EAAA;;AAEA;AACA,EAAA,MAAME,qBAAqB,GAAGD,cAAc,GACxCD,cAAc,CAACV,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAACA,OAAO,CAAC,IAAIa,MAAM,CAAC,CAAA,EAAA,EAAKF,cAAc,CAAA,CAAE,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC,GACrFD,cAAc;;AAElB;AACA,EAAA,MAAMI,8BAA8B,GAAGX,gBAAgB,GACnDS,qBAAqB,CAACZ,OAAO,CAACG,gBAAgB,EAAE,GAAG,CAAC,GACpDS,qBAAqB;AAEzB,EAAA,MAAMG,WAAW,GAAGC,MAAM,CAACC,UAAU,CAACH,8BAA8B,CAAC;AACrE,EAAA,OAAOC,WAAW;AACpB;AAEO,MAAMG,kBAAkB,GAAGA,CAAC;AACjCV,EAAAA,KAAK,EAAEW,gBAAgB;EACvBtB,QAAQ;EACRC,MAAM;AACNsB,EAAAA,kBAAkB,GAAG;~~AAMvB~~,~~CAAC~~,~~KAAa~~;~~AACZ~~,EAAA,MAAMjB,gBAAgB,GAAGP,mBAAmB,CAACC,QAAQ,EAAEC,MAAM,CAAC;AAC9D;AACA,EAAA,MAAMuB,YAAY,GAAGnB,eAAe,CAACL,QAAQ,EAAEC,MAAM,CAAC;AACtD,EAAA,MAAMwB,iBAAiB,GAAGH,gBAAgB,CAACI,QAAQ,EAAE;AAErD,EAAA,MAAM,CAACC,WAAW,EAAEC,WAAW,CAAC,GAAGtB,gBAAgB,GAC/CmB,iBAAiB,CAACjB,KAAK,CAACF,gBAAgB,CAAC,GACzC,CAACmB,iBAAiB,EAAEI,SAAS,CAAC;AAElC,EAAA,MAAMC,oBAAoB,GAAGF,WAAW,GAAGA,WAAW,CAACG,KAAK,CAAC,CAAC,EAAEP,YAAY,CAAC,GAAG,EAAE;EAElF,MAAMQ,yBAAyB,GAAGb,MAAM,CAACC,UAAU,CAAC,CAAA,EAAGO,WAAW,CAAA,CAAA,EAAIG,oBAAoB,CAAA,CAAE,CAAC;AAE7F,EAAA,OAAO5B,YAAY,CAAC8B,yBAAyB,EAAEhC,QAAQ,EAAEC,MAAM,EAAE;AAC/DsB,IAAAA;~~AACF~~,~~GAAC~~,CAAC;AACJ;AAEO,MAAMU,0BAA0B,GAAGA,CAAC;EACzCC,GAAG;AACHvB,EAAAA;~~AAIF~~,~~CAAC~~,~~KAAK~~;~~AACJ~~,EAAA,MAAMwB,UAAU,GAAGxB,KAAK,CAACF,MAAM;AAC/B,EAAA,MAAM2B,UAAU,GAAGF,GAAG,CAACG,OAAO,EAAEC,WAAW;AAC3C,EAAA,IAAI,CAACF,UAAU,IAAI,CAACD,UAAU,EAAE;AAC9B,IAAA;AACF,EAAA;EAEA,MAAMI,4BAA4B,GAAGC,IAAI,CAACC,KAAK,CAACL,UAAU,GAAG,EAAE,CAAC;EAChE,OAAOD,UAAU,GAAGI,4BAA4B;AAClD;AAEA,MAAMG,gBAAgB,GAAG,IAAIC,GAAG,CAAC,CAC/B,WAAW,EACX,QAAQ,EACR,GAAG,EACH,GAAG,EACH,WAAW,EACX,YAAY,EACZ,OAAO,EACP,KAAK,CACN,CAAC;AAEK,MAAMC,iBAAiB,GAAIC,CAAkC,~~IAAK~~;~~EACvE~~,MAAM;IAAEC,OAAO;IAAEC,GAAG;AAAEC,IAAAA;~~AAAQ~~,~~GAAC~~,GAAGH,CAAC;AACnC,EAAA,MAAMI,WAAW,GAAG,CAAC9B,MAAM,CAAC+B,KAAK,CAAC/B,MAAM,CAACgC,QAAQ,CAACJ,GAAG,EAAE,EAAE,CAAC,CAAC;EAE3D,OAAOE,WAAW,IAAIH,OAAO,IAAIE,OAAO,IAAIN,gBAAgB,CAACU,GAAG,CAACL,GAAG,CAAC;AACvE;;;;"}
1	+ {"version":3,"file":"utils.mjs","sources":["../../../src/expressiveMoneyInput/amountInput/utils.ts"],"sourcesContent":["import { formatAmount } from '@transferwise/formatting';\nimport type { KeyboardEvent } from 'react';\n\nexport const getDecimalSeparator = (currency: string, locale: string): string \| null => {\n return formatAmount(1.1, currency, locale).replace(/\\p{Number}/gu, '');\n};\n\nexport const getGroupSeparator = (currency: string, locale: string): string \| null => {\n return formatAmount(10000000, currency, locale).replace(/\\p{Number}/gu, '')[0];\n};\n\nexport const getDecimalCount = (currency: string, locale: string): number => {\n const decimalSeparator = getDecimalSeparator(currency, locale);\n if (!decimalSeparator) {\n return 0;\n }\n const parts = formatAmount(1.1, currency, locale).split(decimalSeparator);\n return parts.length === 2 ? parts[1].length : 0;\n};\n\nexport const getEnteredDecimalsCount = (value: string, decimalSeparator: string) => {\n return value.split(decimalSeparator)[1]?.length ?? 0;\n};\n\nexport const getUnformattedNumber = ({\n value: formattedValue,\n currency,\n locale,\n}: {\n value: string;\n currency: string;\n locale: string;\n}): number \| null => {\n const groupSeparator = getGroupSeparator(currency, locale);\n const decimalSeparator = getDecimalSeparator(currency, locale);\n if (!formattedValue) {\n return null;\n }\n\n // parseFloat can't handle thousands separators\n const withoutGroupSeparator = groupSeparator\n ? formattedValue.replace(/ /gu, '').replace(new RegExp(`\\\\${groupSeparator}`, 'g'), '')\n : formattedValue;\n\n // parseFloat can only handle . as decimal separator\n const withNormalisedDecimalSeparator = decimalSeparator\n ? withoutGroupSeparator.replace(decimalSeparator, '.')\n : withoutGroupSeparator;\n\n const parsedValue = Number.parseFloat(withNormalisedDecimalSeparator);\n return parsedValue;\n};\n\nexport const getFormattedString = ({\n value: unformattedValue,\n currency,\n locale,\n alwaysShowDecimals = false,\n}: {\n value: number;\n currency: string;\n locale: string;\n alwaysShowDecimals?: boolean;\n}): string => {\n const decimalSeparator = getDecimalSeparator(currency, locale);\n // formatAmount rounds extra decimals, so 1.999 will become 2. Instead we will manually strip extra decimals so that it becomes 1.99 after formatting\n const decimalCount = getDecimalCount(currency, locale);\n const unformattedString = unformattedValue.toString();\n\n const [integerPart, decimalPart] = decimalSeparator\n ? unformattedString.split(decimalSeparator)\n : [unformattedString, undefined];\n\n const formattedDecimalPart = decimalPart ? decimalPart.slice(0, decimalCount) : '';\n\n const sanitisedUnformattedValue = Number.parseFloat(`${integerPart}.${formattedDecimalPart}`);\n\n return formatAmount(sanitisedUnformattedValue, currency, locale, {\n alwaysShowDecimals,\n });\n};\n\nexport const isInputPossiblyOverflowing = ({\n ref,\n value,\n}: {\n ref: React.RefObject<HTMLInputElement>;\n value: string;\n}) => {\n const textLength = value.length;\n const inputWidth = ref.current?.clientWidth;\n if (!inputWidth \|\| !textLength) {\n return;\n }\n\n const maxCharactersWithoutOverflow = Math.floor(inputWidth / 19);\n return textLength > maxCharactersWithoutOverflow;\n};\n\nconst allowedInputKeys = new Set([\n 'Backspace',\n 'Delete',\n ',',\n '.',\n 'ArrowLeft',\n 'ArrowRight',\n 'Enter',\n 'Tab',\n]);\n\nexport const isAllowedInputKey = (e: KeyboardEvent<HTMLInputElement>) => {\n const { metaKey, key, ctrlKey } = e;\n const isNumberKey = !Number.isNaN(Number.parseInt(key, 10));\n\n return isNumberKey \|\| metaKey \|\| ctrlKey \|\| allowedInputKeys.has(key);\n};\n"],"names":["getDecimalSeparator","currency","locale","formatAmount","replace","getGroupSeparator","getDecimalCount","decimalSeparator","parts","split","length","getEnteredDecimalsCount","value","getUnformattedNumber","formattedValue","groupSeparator","withoutGroupSeparator","RegExp","withNormalisedDecimalSeparator","parsedValue","Number","parseFloat","getFormattedString","unformattedValue","alwaysShowDecimals","decimalCount","unformattedString","toString","integerPart","decimalPart","undefined","formattedDecimalPart","slice","sanitisedUnformattedValue","isInputPossiblyOverflowing","ref","textLength","inputWidth","current","clientWidth","maxCharactersWithoutOverflow","Math","floor","allowedInputKeys","Set","isAllowedInputKey","e","metaKey","key","ctrlKey","isNumberKey","isNaN","parseInt","has"],"mappings":"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"}

package/build/expressiveMoneyInput/animatedNumber/AnimatedNumber.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnimatedNumber.js","sources":["../../../src/expressiveMoneyInput/animatedNumber/AnimatedNumber.tsx"],"sourcesContent":["import { motion, useReducedMotion } from 'framer-motion';\nimport type { ReactNode } from 'react';\n\ninterface Props {\n children: ReactNode;\n onClick?: () => void;\n className?: string;\n}\n\nexport const AnimatedNumber = ({ children, onClick, className }: Props) => {\n const reducedMotion = useReducedMotion();\n\n return (\n <motion.span\n className={className}\n aria-hidden\n initial={{ zoom: 0.01 }}\n animate={{ zoom: 1 }}\n exit={{ zoom: 0.01 }}\n transition={{\n duration: reducedMotion ? 0 : 0.3,\n type: 'tween',\n ease: [0.3, 0, 0.1, 1],\n }}\n onClick={() => onClick?.()}\n >\n <motion.span\n initial={{ opacity: 0 }}\n animate={{ opacity: [0, 0, 1] }}\n exit={{ opacity: [1, 0, 0] }}\n transition={{\n duration: reducedMotion ? 0 : 0.3,\n times: [0, 0.5, 1],\n }}\n >\n {children}\n </motion.span>\n </motion.span>\n );\n};\n"],"names":["AnimatedNumber","children","onClick","className","reducedMotion","useReducedMotion","_jsx","motion","span","initial","zoom","animate","exit","transition","duration","type","ease","opacity","times"],"mappings":";;;;;AASO,MAAMA,cAAc,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA;~~AAAiB~~,~~CAAC~~,~~KAAK~~;~~AACzE~~,EAAA,MAAMC,aAAa,GAAGC,6BAAgB,EAAE;AAExC,EAAA,oBACEC,cAAA,CAACC,mBAAM,CAACC,IAAI,EAAA;AACVL,IAAAA,SAAS,EAAEA,SAAU;IACrB,aAAA,EAAA,IAAW;AACXM,IAAAA,OAAO,EAAE;AAAEC,MAAAA,IAAI,EAAE;KAAO;AACxBC,IAAAA,OAAO,EAAE;AAAED,MAAAA,IAAI,EAAE;KAAI;AACrBE,IAAAA,IAAI,EAAE;AAAEF,MAAAA,IAAI,EAAE;KAAO;AACrBG,IAAAA,UAAU,EAAE;AACVC,MAAAA,QAAQ,EAAEV,aAAa,GAAG,CAAC,GAAG,GAAG;AACjCW,MAAAA,IAAI,EAAE,OAAO;MACbC,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC;KACrB;AACFd,IAAAA,OAAO,EAAEA,MAAMA,OAAO,IAAK;AAAAD,IAAAA,QAAA,eAE3BK,cAAA,CAACC,mBAAM,CAACC,IAAI,EAAA;AACVC,MAAAA,OAAO,EAAE;AAAEQ,QAAAA,OAAO,EAAE;OAAI;AACxBN,MAAAA,OAAO,EAAE;AAAEM,QAAAA,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;OAAI;AAChCL,MAAAA,IAAI,EAAE;AAAEK,QAAAA,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;OAAI;AAC7BJ,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAEV,aAAa,GAAG,CAAC,GAAG,GAAG;AACjCc,QAAAA,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;OACjB;AAAAjB,MAAAA,QAAA,EAEDA;KACU;~~AAAC~~,~~GACH~~,CAAC;AAElB;;;;"}
1	+ {"version":3,"file":"AnimatedNumber.js","sources":["../../../src/expressiveMoneyInput/animatedNumber/AnimatedNumber.tsx"],"sourcesContent":["import { motion, useReducedMotion } from 'framer-motion';\nimport type { ReactNode } from 'react';\n\ninterface Props {\n children: ReactNode;\n onClick?: () => void;\n className?: string;\n}\n\nexport const AnimatedNumber = ({ children, onClick, className }: Props) => {\n const reducedMotion = useReducedMotion();\n\n return (\n <motion.span\n className={className}\n aria-hidden\n initial={{ zoom: 0.01 }}\n animate={{ zoom: 1 }}\n exit={{ zoom: 0.01 }}\n transition={{\n duration: reducedMotion ? 0 : 0.3,\n type: 'tween',\n ease: [0.3, 0, 0.1, 1],\n }}\n onClick={() => onClick?.()}\n >\n <motion.span\n initial={{ opacity: 0 }}\n animate={{ opacity: [0, 0, 1] }}\n exit={{ opacity: [1, 0, 0] }}\n transition={{\n duration: reducedMotion ? 0 : 0.3,\n times: [0, 0.5, 1],\n }}\n >\n {children}\n </motion.span>\n </motion.span>\n );\n};\n"],"names":["AnimatedNumber","children","onClick","className","reducedMotion","useReducedMotion","_jsx","motion","span","initial","zoom","animate","exit","transition","duration","type","ease","opacity","times"],"mappings":";;;;;AASO,MAAMA,cAAc,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA;AAAS,CAAS,KAAI;AACxE,EAAA,MAAMC,aAAa,GAAGC,6BAAgB,EAAE;AAExC,EAAA,oBACEC,cAAA,CAACC,mBAAM,CAACC,IAAI,EAAA;AACVL,IAAAA,SAAS,EAAEA,SAAU;IACrB,aAAA,EAAA,IAAW;AACXM,IAAAA,OAAO,EAAE;AAAEC,MAAAA,IAAI,EAAE;KAAO;AACxBC,IAAAA,OAAO,EAAE;AAAED,MAAAA,IAAI,EAAE;KAAI;AACrBE,IAAAA,IAAI,EAAE;AAAEF,MAAAA,IAAI,EAAE;KAAO;AACrBG,IAAAA,UAAU,EAAE;AACVC,MAAAA,QAAQ,EAAEV,aAAa,GAAG,CAAC,GAAG,GAAG;AACjCW,MAAAA,IAAI,EAAE,OAAO;MACbC,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC;KACrB;AACFd,IAAAA,OAAO,EAAEA,MAAMA,OAAO,IAAK;AAAAD,IAAAA,QAAA,eAE3BK,cAAA,CAACC,mBAAM,CAACC,IAAI,EAAA;AACVC,MAAAA,OAAO,EAAE;AAAEQ,QAAAA,OAAO,EAAE;OAAI;AACxBN,MAAAA,OAAO,EAAE;AAAEM,QAAAA,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;OAAI;AAChCL,MAAAA,IAAI,EAAE;AAAEK,QAAAA,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;OAAI;AAC7BJ,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAEV,aAAa,GAAG,CAAC,GAAG,GAAG;AACjCc,QAAAA,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;OACjB;AAAAjB,MAAAA,QAAA,EAEDA;KACU;AACf,GAAa,CAAC;AAElB;;;;"}

package/build/expressiveMoneyInput/animatedNumber/AnimatedNumber.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnimatedNumber.mjs","sources":["../../../src/expressiveMoneyInput/animatedNumber/AnimatedNumber.tsx"],"sourcesContent":["import { motion, useReducedMotion } from 'framer-motion';\nimport type { ReactNode } from 'react';\n\ninterface Props {\n children: ReactNode;\n onClick?: () => void;\n className?: string;\n}\n\nexport const AnimatedNumber = ({ children, onClick, className }: Props) => {\n const reducedMotion = useReducedMotion();\n\n return (\n <motion.span\n className={className}\n aria-hidden\n initial={{ zoom: 0.01 }}\n animate={{ zoom: 1 }}\n exit={{ zoom: 0.01 }}\n transition={{\n duration: reducedMotion ? 0 : 0.3,\n type: 'tween',\n ease: [0.3, 0, 0.1, 1],\n }}\n onClick={() => onClick?.()}\n >\n <motion.span\n initial={{ opacity: 0 }}\n animate={{ opacity: [0, 0, 1] }}\n exit={{ opacity: [1, 0, 0] }}\n transition={{\n duration: reducedMotion ? 0 : 0.3,\n times: [0, 0.5, 1],\n }}\n >\n {children}\n </motion.span>\n </motion.span>\n );\n};\n"],"names":["AnimatedNumber","children","onClick","className","reducedMotion","useReducedMotion","_jsx","motion","span","initial","zoom","animate","exit","transition","duration","type","ease","opacity","times"],"mappings":";;;AASO,MAAMA,cAAc,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA;~~AAAiB~~,~~CAAC~~,~~KAAK~~;~~AACzE~~,EAAA,MAAMC,aAAa,GAAGC,gBAAgB,EAAE;AAExC,EAAA,oBACEC,GAAA,CAACC,MAAM,CAACC,IAAI,EAAA;AACVL,IAAAA,SAAS,EAAEA,SAAU;IACrB,aAAA,EAAA,IAAW;AACXM,IAAAA,OAAO,EAAE;AAAEC,MAAAA,IAAI,EAAE;KAAO;AACxBC,IAAAA,OAAO,EAAE;AAAED,MAAAA,IAAI,EAAE;KAAI;AACrBE,IAAAA,IAAI,EAAE;AAAEF,MAAAA,IAAI,EAAE;KAAO;AACrBG,IAAAA,UAAU,EAAE;AACVC,MAAAA,QAAQ,EAAEV,aAAa,GAAG,CAAC,GAAG,GAAG;AACjCW,MAAAA,IAAI,EAAE,OAAO;MACbC,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC;KACrB;AACFd,IAAAA,OAAO,EAAEA,MAAMA,OAAO,IAAK;AAAAD,IAAAA,QAAA,eAE3BK,GAAA,CAACC,MAAM,CAACC,IAAI,EAAA;AACVC,MAAAA,OAAO,EAAE;AAAEQ,QAAAA,OAAO,EAAE;OAAI;AACxBN,MAAAA,OAAO,EAAE;AAAEM,QAAAA,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;OAAI;AAChCL,MAAAA,IAAI,EAAE;AAAEK,QAAAA,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;OAAI;AAC7BJ,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAEV,aAAa,GAAG,CAAC,GAAG,GAAG;AACjCc,QAAAA,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;OACjB;AAAAjB,MAAAA,QAAA,EAEDA;KACU;~~AAAC~~,~~GACH~~,CAAC;AAElB;;;;"}
1	+ {"version":3,"file":"AnimatedNumber.mjs","sources":["../../../src/expressiveMoneyInput/animatedNumber/AnimatedNumber.tsx"],"sourcesContent":["import { motion, useReducedMotion } from 'framer-motion';\nimport type { ReactNode } from 'react';\n\ninterface Props {\n children: ReactNode;\n onClick?: () => void;\n className?: string;\n}\n\nexport const AnimatedNumber = ({ children, onClick, className }: Props) => {\n const reducedMotion = useReducedMotion();\n\n return (\n <motion.span\n className={className}\n aria-hidden\n initial={{ zoom: 0.01 }}\n animate={{ zoom: 1 }}\n exit={{ zoom: 0.01 }}\n transition={{\n duration: reducedMotion ? 0 : 0.3,\n type: 'tween',\n ease: [0.3, 0, 0.1, 1],\n }}\n onClick={() => onClick?.()}\n >\n <motion.span\n initial={{ opacity: 0 }}\n animate={{ opacity: [0, 0, 1] }}\n exit={{ opacity: [1, 0, 0] }}\n transition={{\n duration: reducedMotion ? 0 : 0.3,\n times: [0, 0.5, 1],\n }}\n >\n {children}\n </motion.span>\n </motion.span>\n );\n};\n"],"names":["AnimatedNumber","children","onClick","className","reducedMotion","useReducedMotion","_jsx","motion","span","initial","zoom","animate","exit","transition","duration","type","ease","opacity","times"],"mappings":";;;AASO,MAAMA,cAAc,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA;AAAS,CAAS,KAAI;AACxE,EAAA,MAAMC,aAAa,GAAGC,gBAAgB,EAAE;AAExC,EAAA,oBACEC,GAAA,CAACC,MAAM,CAACC,IAAI,EAAA;AACVL,IAAAA,SAAS,EAAEA,SAAU;IACrB,aAAA,EAAA,IAAW;AACXM,IAAAA,OAAO,EAAE;AAAEC,MAAAA,IAAI,EAAE;KAAO;AACxBC,IAAAA,OAAO,EAAE;AAAED,MAAAA,IAAI,EAAE;KAAI;AACrBE,IAAAA,IAAI,EAAE;AAAEF,MAAAA,IAAI,EAAE;KAAO;AACrBG,IAAAA,UAAU,EAAE;AACVC,MAAAA,QAAQ,EAAEV,aAAa,GAAG,CAAC,GAAG,GAAG;AACjCW,MAAAA,IAAI,EAAE,OAAO;MACbC,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC;KACrB;AACFd,IAAAA,OAAO,EAAEA,MAAMA,OAAO,IAAK;AAAAD,IAAAA,QAAA,eAE3BK,GAAA,CAACC,MAAM,CAACC,IAAI,EAAA;AACVC,MAAAA,OAAO,EAAE;AAAEQ,QAAAA,OAAO,EAAE;OAAI;AACxBN,MAAAA,OAAO,EAAE;AAAEM,QAAAA,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;OAAI;AAChCL,MAAAA,IAAI,EAAE;AAAEK,QAAAA,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;OAAI;AAC7BJ,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAEV,aAAa,GAAG,CAAC,GAAG,GAAG;AACjCc,QAAAA,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;OACjB;AAAAjB,MAAAA,QAAA,EAEDA;KACU;AACf,GAAa,CAAC;AAElB;;;;"}

package/build/expressiveMoneyInput/chevron/Chevron.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chevron.js","sources":["../../../src/expressiveMoneyInput/chevron/Chevron.tsx"],"sourcesContent":["import { ChevronLeft } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { motion } from 'framer-motion';\n\ninterface Props {\n shouldShow: boolean;\n}\n\nexport const Chevron = ({ shouldShow = true }: Props) => {\n return (\n <div\n className={clsx(\n 'd-flex align-items-center',\n 'wds-chevron-container',\n !shouldShow && 'wds-chevron-hidden',\n )}\n >\n <motion.div\n animate={{\n x: [12, 0, 0, -12],\n opacity: [0, 1, 1, 0],\n }}\n transition={{\n duration: 3,\n ease: [[0.3, 0, 0.1, 1], 'linear', [0.3, 0, 0.1, 1]],\n times: [0, 0.1, 0.9, 1],\n repeat: Infinity,\n repeatType: 'loop',\n }}\n >\n <ChevronLeft />\n </motion.div>\n </div>\n );\n};\n"],"names":["Chevron","shouldShow","_jsx","className","clsx","children","motion","div","animate","x","opacity","transition","duration","ease","times","repeat","Infinity","repeatType","ChevronLeft"],"mappings":";;;;;;;AAQO,MAAMA,OAAO,GAAGA,CAAC;AAAEC,EAAAA,UAAU,GAAG;~~AAAY~~,~~CAAC~~,~~KAAK~~;~~AACvD~~,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;IACEC,SAAS,EAAEC,SAAI,CACb,2BAA2B,EAC3B,uBAAuB,EACvB,CAACH,UAAU,IAAI,~~oBACjB~~,~~CAAE~~;AAAAI,IAAAA,QAAA,eAEFH,cAAA,CAACI,mBAAM,CAACC,GAAG,EAAA;AACTC,MAAAA,OAAO,EAAE;QACPC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;QAClBC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;OACpB;AACFC,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAE,CAAC;QACXC,IAAI,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;QACpDC,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;AACvBC,QAAAA,MAAM,EAAEC,QAAQ;AAChBC,QAAAA,UAAU,EAAE;OACZ;AAAAZ,MAAAA,QAAA,eAEFH,cAAA,CAACgB,iBAAW,EAAA,~~EAAE~~;~~KACJ~~;~~AAAC~~,~~GACV~~,CAAC;AAEV;;;;"}
1	+ {"version":3,"file":"Chevron.js","sources":["../../../src/expressiveMoneyInput/chevron/Chevron.tsx"],"sourcesContent":["import { ChevronLeft } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { motion } from 'framer-motion';\n\ninterface Props {\n shouldShow: boolean;\n}\n\nexport const Chevron = ({ shouldShow = true }: Props) => {\n return (\n <div\n className={clsx(\n 'd-flex align-items-center',\n 'wds-chevron-container',\n !shouldShow && 'wds-chevron-hidden',\n )}\n >\n <motion.div\n animate={{\n x: [12, 0, 0, -12],\n opacity: [0, 1, 1, 0],\n }}\n transition={{\n duration: 3,\n ease: [[0.3, 0, 0.1, 1], 'linear', [0.3, 0, 0.1, 1]],\n times: [0, 0.1, 0.9, 1],\n repeat: Infinity,\n repeatType: 'loop',\n }}\n >\n <ChevronLeft />\n </motion.div>\n </div>\n );\n};\n"],"names":["Chevron","shouldShow","_jsx","className","clsx","children","motion","div","animate","x","opacity","transition","duration","ease","times","repeat","Infinity","repeatType","ChevronLeft"],"mappings":";;;;;;;AAQO,MAAMA,OAAO,GAAGA,CAAC;AAAEC,EAAAA,UAAU,GAAG;AAAI,CAAS,KAAI;AACtD,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;IACEC,SAAS,EAAEC,SAAI,CACb,2BAA2B,EAC3B,uBAAuB,EACvB,CAACH,UAAU,IAAI,oBAAoB,CACnC;AAAAI,IAAAA,QAAA,eAEFH,cAAA,CAACI,mBAAM,CAACC,GAAG,EAAA;AACTC,MAAAA,OAAO,EAAE;QACPC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;QAClBC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;OACpB;AACFC,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAE,CAAC;QACXC,IAAI,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;QACpDC,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;AACvBC,QAAAA,MAAM,EAAEC,QAAQ;AAChBC,QAAAA,UAAU,EAAE;OACZ;AAAAZ,MAAAA,QAAA,eAEFH,cAAA,CAACgB,iBAAW,EAAA,EAAA;KACF;AACd,GAAK,CAAC;AAEV;;;;"}

package/build/expressiveMoneyInput/chevron/Chevron.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chevron.mjs","sources":["../../../src/expressiveMoneyInput/chevron/Chevron.tsx"],"sourcesContent":["import { ChevronLeft } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { motion } from 'framer-motion';\n\ninterface Props {\n shouldShow: boolean;\n}\n\nexport const Chevron = ({ shouldShow = true }: Props) => {\n return (\n <div\n className={clsx(\n 'd-flex align-items-center',\n 'wds-chevron-container',\n !shouldShow && 'wds-chevron-hidden',\n )}\n >\n <motion.div\n animate={{\n x: [12, 0, 0, -12],\n opacity: [0, 1, 1, 0],\n }}\n transition={{\n duration: 3,\n ease: [[0.3, 0, 0.1, 1], 'linear', [0.3, 0, 0.1, 1]],\n times: [0, 0.1, 0.9, 1],\n repeat: Infinity,\n repeatType: 'loop',\n }}\n >\n <ChevronLeft />\n </motion.div>\n </div>\n );\n};\n"],"names":["Chevron","shouldShow","_jsx","className","clsx","children","motion","div","animate","x","opacity","transition","duration","ease","times","repeat","Infinity","repeatType","ChevronLeft"],"mappings":";;;;;AAQO,MAAMA,OAAO,GAAGA,CAAC;AAAEC,EAAAA,UAAU,GAAG;~~AAAY~~,~~CAAC~~,~~KAAK~~;~~AACvD~~,EAAA,oBACEC,GAAA,CAAA,KAAA,EAAA;IACEC,SAAS,EAAEC,IAAI,CACb,2BAA2B,EAC3B,uBAAuB,EACvB,CAACH,UAAU,IAAI,~~oBACjB~~,~~CAAE~~;AAAAI,IAAAA,QAAA,eAEFH,GAAA,CAACI,MAAM,CAACC,GAAG,EAAA;AACTC,MAAAA,OAAO,EAAE;QACPC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;QAClBC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;OACpB;AACFC,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAE,CAAC;QACXC,IAAI,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;QACpDC,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;AACvBC,QAAAA,MAAM,EAAEC,QAAQ;AAChBC,QAAAA,UAAU,EAAE;OACZ;AAAAZ,MAAAA,QAAA,eAEFH,GAAA,CAACgB,WAAW,EAAA,~~EAAE~~;~~KACJ~~;~~AAAC~~,~~GACV~~,CAAC;AAEV;;;;"}
1	+ {"version":3,"file":"Chevron.mjs","sources":["../../../src/expressiveMoneyInput/chevron/Chevron.tsx"],"sourcesContent":["import { ChevronLeft } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { motion } from 'framer-motion';\n\ninterface Props {\n shouldShow: boolean;\n}\n\nexport const Chevron = ({ shouldShow = true }: Props) => {\n return (\n <div\n className={clsx(\n 'd-flex align-items-center',\n 'wds-chevron-container',\n !shouldShow && 'wds-chevron-hidden',\n )}\n >\n <motion.div\n animate={{\n x: [12, 0, 0, -12],\n opacity: [0, 1, 1, 0],\n }}\n transition={{\n duration: 3,\n ease: [[0.3, 0, 0.1, 1], 'linear', [0.3, 0, 0.1, 1]],\n times: [0, 0.1, 0.9, 1],\n repeat: Infinity,\n repeatType: 'loop',\n }}\n >\n <ChevronLeft />\n </motion.div>\n </div>\n );\n};\n"],"names":["Chevron","shouldShow","_jsx","className","clsx","children","motion","div","animate","x","opacity","transition","duration","ease","times","repeat","Infinity","repeatType","ChevronLeft"],"mappings":";;;;;AAQO,MAAMA,OAAO,GAAGA,CAAC;AAAEC,EAAAA,UAAU,GAAG;AAAI,CAAS,KAAI;AACtD,EAAA,oBACEC,GAAA,CAAA,KAAA,EAAA;IACEC,SAAS,EAAEC,IAAI,CACb,2BAA2B,EAC3B,uBAAuB,EACvB,CAACH,UAAU,IAAI,oBAAoB,CACnC;AAAAI,IAAAA,QAAA,eAEFH,GAAA,CAACI,MAAM,CAACC,GAAG,EAAA;AACTC,MAAAA,OAAO,EAAE;QACPC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;QAClBC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;OACpB;AACFC,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAE,CAAC;QACXC,IAAI,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;QACpDC,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;AACvBC,QAAAA,MAAM,EAAEC,QAAQ;AAChBC,QAAAA,UAAU,EAAE;OACZ;AAAAZ,MAAAA,QAAA,eAEFH,GAAA,CAACgB,WAAW,EAAA,EAAA;KACF;AACd,GAAK,CAAC;AAEV;;;;"}

package/build/expressiveMoneyInput/currencySelector/CurrencySelector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CurrencySelector.js","sources":["../../../src/expressiveMoneyInput/currencySelector/CurrencySelector.tsx"],"sourcesContent":["import type { AvatarLayoutProps } from '../../avatarLayout';\nimport Button from '../../button';\nimport {\n SelectInput,\n SelectInputOptionContent,\n SelectInputTriggerButton,\n} from '../../inputs/SelectInput';\nimport { CurrencyType, Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\nimport { ChevronDown } from '@transferwise/icons';\nimport { Flag } from '@wise/art';\nimport {\n type ButtonHTMLAttributes,\n forwardRef,\n type MouseEventHandler,\n useMemo,\n useState,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../ExpressiveMoneyInput.messages';\n\nexport interface CurrencyOption {\n label?: string;\n code: string;\n keywords: string[] \| undefined;\n}\n\nexport interface CurrencySection {\n title: string;\n currencies: CurrencyOption[];\n}\n\nexport type CurrencyOptions = CurrencySection[];\n\nexport type Props = {\n id: string;\n labelId: string;\n options?: CurrencyOptions;\n onChange?: (currency: CurrencyType) => void;\n onOpen?: () => void;\n addons?: AvatarLayoutProps['avatars'];\n onSearchChange?: (payload: { query: string; resultCount: number }) => void;\n} & Pick<ExpressiveMoneyInputProps, 'currency'>;\n\nexport const CurrencySelector = ({\n id,\n currency,\n options = [],\n labelId,\n onChange,\n addons,\n onOpen,\n onSearchChange,\n}: Props) => {\n const intl = useIntl();\n\n const allCurrencyOptions = useMemo(() => getUniqueCurrencies(options), [options]);\n\n const activeCurrencyOption = useMemo(() => {\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n return allCurrencyOptions.find((option) => option.code === currency)!;\n }, [currency, allCurrencyOptions]);\n\n const disabled =\n !onChange \|\|\n options.length === 0 \|\|\n (options.length === 1 && options[0].currencies.length <= 1);\n\n const [searchQuery, setSearchQuery] = useState<string>('');\n\n const handleTriggerClick: MouseEventHandler = (event) => {\n const triggerEl = event.currentTarget;\n if (triggerEl?.getAttribute('aria-expanded') === 'false') {\n onOpen?.();\n }\n };\n\n const items = searchQuery\n ? filterAndSortCurrenciesForQuery(allCurrencyOptions, searchQuery).map(getCurrencySelectOption)\n : options.map(getCurrencyGroup);\n\n return (\n <SelectInput\n compareValues=\"code\"\n disabled={disabled}\n id={id}\n value={activeCurrencyOption}\n filterable\n filterPlaceholder={intl.formatMessage(messages.currencySelectorSearchPlaceholder)}\n UNSAFE_triggerButtonProps={{\n id: undefined,\n 'aria-labelledby': undefined,\n 'aria-describedby': labelId,\n 'aria-invalid': undefined,\n 'aria-label': intl.formatMessage(messages.currencySelectorSelectCurrency),\n }}\n items={items}\n renderValue={({ code, label }) => {\n return (\n <SelectInputOptionContent\n title={code}\n note={label}\n icon={<Flag code={code} intrinsicSize={24} />}\n />\n );\n }}\n renderTrigger={() => (\n <SelectInputTriggerButton\n as={ButtonInput}\n // @ts-expect-error new (v2) ButtonProps\n addonStart={{\n type: 'avatar',\n value: [\n addons ? addons[0] : null,\n {\n ...(addons && addons.length > 1\n ? { ...addons[1] }\n : {\n asset: <Flag code={currency} />,\n }),\n },\n ]\n .filter(Boolean)\n .filter((avatar) => !(avatar && Object.keys(avatar).length === 0)),\n }}\n addonEnd={disabled ? undefined : { type: 'icon', value: <ChevronDown /> }}\n onClick={(event) => handleTriggerClick(event)}\n >\n {currency}\n </SelectInputTriggerButton>\n )}\n onChange={(newValue) => {\n onChange?.(newValue.code);\n }}\n onFilterChange={({ queryNormalized }) => {\n setSearchQuery(queryNormalized ?? '');\n if (queryNormalized) {\n onSearchChange?.({\n query: queryNormalized,\n resultCount: filterAndSortCurrenciesForQuery(allCurrencyOptions, queryNormalized)\n .length,\n });\n }\n }}\n />\n );\n};\n\nexport const ButtonInput = forwardRef(function ButtonInput(\n { children, ...rest }: React.PropsWithChildren<ButtonHTMLAttributes<HTMLButtonElement>>,\n ref: React.ForwardedRef<HTMLButtonElement \| null>,\n) {\n return (\n <Button\n ref={ref}\n size=\"md\"\n v2\n className=\"wds-currency-selector\"\n priority=\"secondary-neutral\"\n {...rest}\n >\n {children}\n </Button>\n );\n});\n\nconst getCurrencySelectOption = (currency: CurrencyOption) => {\n return {\n type: 'option' as const,\n value: currency,\n filterMatchers: currency.keywords,\n };\n};\n\nconst getCurrencyGroup = (section: CurrencySection) => {\n return {\n type: 'group' as const,\n label: section.title,\n options: section.currencies.map(getCurrencySelectOption),\n };\n};\n\nconst getUniqueCurrencies = (options: CurrencyOptions) => {\n const allCurrencyOptions = options.flatMap((section) => section.currencies);\n const uniqueCurrencies = new Map<string, CurrencyOption>();\n\n allCurrencyOptions.forEach((currencyObj) => {\n uniqueCurrencies.set(currencyObj.code, currencyObj);\n });\n\n return Array.from(uniqueCurrencies.values());\n};\n\nconst filterAndSortCurrenciesForQuery = (\n currencies: CurrencyOption[],\n query: string,\n): CurrencyOption[] => {\n return (\n currencies\n .filter((currency) => {\n return (\n currency.code.toLowerCase().includes(query) \|\|\n (currency.label ?? '').toLowerCase().includes(query) \|\|\n currency.keywords?.some((keyword) => keyword.toLowerCase().includes(query))\n );\n })\n // prefer exact matches, then sort alphabetically by code\n .sort((a, b) => {\n const aCode = a.code.toLowerCase();\n const bCode = b.code.toLowerCase();\n if (aCode === query) {\n return -1;\n }\n if (bCode === query) {\n return 1;\n }\n return aCode.localeCompare(bCode);\n })\n );\n};\n"],"names":["CurrencySelector","id","currency","options","labelId","onChange","addons","onOpen","onSearchChange","intl","useIntl","allCurrencyOptions","useMemo","getUniqueCurrencies","activeCurrencyOption","find","option","code","disabled","length","currencies","searchQuery","setSearchQuery","useState","handleTriggerClick","event","triggerEl","currentTarget","getAttribute","items","filterAndSortCurrenciesForQuery","map","getCurrencySelectOption","getCurrencyGroup","_jsx","SelectInput","compareValues","value","filterable","filterPlaceholder","formatMessage","messages","currencySelectorSearchPlaceholder","UNSAFE_triggerButtonProps","undefined","currencySelectorSelectCurrency","renderValue","label","SelectInputOptionContent","title","note","icon","Flag","intrinsicSize","renderTrigger","SelectInputTriggerButton","as","ButtonInput","addonStart","type","asset","filter","Boolean","avatar","Object","keys","addonEnd","ChevronDown","onClick","children","newValue","onFilterChange","queryNormalized","query","resultCount","forwardRef","rest","ref","Button","size","v2","className","priority","filterMatchers","keywords","section","flatMap","uniqueCurrencies","Map","forEach","currencyObj","set","Array","from","values","toLowerCase","includes","some","keyword","sort","a","b","aCode","bCode","localeCompare"],"mappings":"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"}
1	+ {"version":3,"file":"CurrencySelector.js","sources":["../../../src/expressiveMoneyInput/currencySelector/CurrencySelector.tsx"],"sourcesContent":["import type { AvatarLayoutProps } from '../../avatarLayout';\nimport Button from '../../button';\nimport {\n SelectInput,\n SelectInputOptionContent,\n SelectInputTriggerButton,\n} from '../../inputs/SelectInput';\nimport { CurrencyType, Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\nimport { ChevronDown } from '@transferwise/icons';\nimport { Flag } from '@wise/art';\nimport {\n type ButtonHTMLAttributes,\n forwardRef,\n type MouseEventHandler,\n useMemo,\n useState,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../ExpressiveMoneyInput.messages';\n\nexport interface CurrencyOption {\n label?: string;\n code: string;\n keywords: string[] \| undefined;\n}\n\nexport interface CurrencySection {\n title: string;\n currencies: CurrencyOption[];\n}\n\nexport type CurrencyOptions = CurrencySection[];\n\nexport type Props = {\n id: string;\n labelId: string;\n options?: CurrencyOptions;\n onChange?: (currency: CurrencyType) => void;\n onOpen?: () => void;\n addons?: AvatarLayoutProps['avatars'];\n onSearchChange?: (payload: { query: string; resultCount: number }) => void;\n} & Pick<ExpressiveMoneyInputProps, 'currency'>;\n\nexport const CurrencySelector = ({\n id,\n currency,\n options = [],\n labelId,\n onChange,\n addons,\n onOpen,\n onSearchChange,\n}: Props) => {\n const intl = useIntl();\n\n const allCurrencyOptions = useMemo(() => getUniqueCurrencies(options), [options]);\n\n const activeCurrencyOption = useMemo(() => {\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n return allCurrencyOptions.find((option) => option.code === currency)!;\n }, [currency, allCurrencyOptions]);\n\n const disabled =\n !onChange \|\|\n options.length === 0 \|\|\n (options.length === 1 && options[0].currencies.length <= 1);\n\n const [searchQuery, setSearchQuery] = useState<string>('');\n\n const handleTriggerClick: MouseEventHandler = (event) => {\n const triggerEl = event.currentTarget;\n if (triggerEl?.getAttribute('aria-expanded') === 'false') {\n onOpen?.();\n }\n };\n\n const items = searchQuery\n ? filterAndSortCurrenciesForQuery(allCurrencyOptions, searchQuery).map(getCurrencySelectOption)\n : options.map(getCurrencyGroup);\n\n return (\n <SelectInput\n compareValues=\"code\"\n disabled={disabled}\n id={id}\n value={activeCurrencyOption}\n filterable\n filterPlaceholder={intl.formatMessage(messages.currencySelectorSearchPlaceholder)}\n UNSAFE_triggerButtonProps={{\n id: undefined,\n 'aria-labelledby': undefined,\n 'aria-describedby': labelId,\n 'aria-invalid': undefined,\n 'aria-label': intl.formatMessage(messages.currencySelectorSelectCurrency),\n }}\n items={items}\n renderValue={({ code, label }) => {\n return (\n <SelectInputOptionContent\n title={code}\n note={label}\n icon={<Flag code={code} intrinsicSize={24} />}\n />\n );\n }}\n renderTrigger={() => (\n <SelectInputTriggerButton\n as={ButtonInput}\n // @ts-expect-error new (v2) ButtonProps\n addonStart={{\n type: 'avatar',\n value: [\n addons ? addons[0] : null,\n {\n ...(addons && addons.length > 1\n ? { ...addons[1] }\n : {\n asset: <Flag code={currency} />,\n }),\n },\n ]\n .filter(Boolean)\n .filter((avatar) => !(avatar && Object.keys(avatar).length === 0)),\n }}\n addonEnd={disabled ? undefined : { type: 'icon', value: <ChevronDown /> }}\n onClick={(event) => handleTriggerClick(event)}\n >\n {currency}\n </SelectInputTriggerButton>\n )}\n onChange={(newValue) => {\n onChange?.(newValue.code);\n }}\n onFilterChange={({ queryNormalized }) => {\n setSearchQuery(queryNormalized ?? '');\n if (queryNormalized) {\n onSearchChange?.({\n query: queryNormalized,\n resultCount: filterAndSortCurrenciesForQuery(allCurrencyOptions, queryNormalized)\n .length,\n });\n }\n }}\n />\n );\n};\n\nexport const ButtonInput = forwardRef(function ButtonInput(\n { children, ...rest }: React.PropsWithChildren<ButtonHTMLAttributes<HTMLButtonElement>>,\n ref: React.ForwardedRef<HTMLButtonElement \| null>,\n) {\n return (\n <Button\n ref={ref}\n size=\"md\"\n v2\n className=\"wds-currency-selector\"\n priority=\"secondary-neutral\"\n {...rest}\n >\n {children}\n </Button>\n );\n});\n\nconst getCurrencySelectOption = (currency: CurrencyOption) => {\n return {\n type: 'option' as const,\n value: currency,\n filterMatchers: currency.keywords,\n };\n};\n\nconst getCurrencyGroup = (section: CurrencySection) => {\n return {\n type: 'group' as const,\n label: section.title,\n options: section.currencies.map(getCurrencySelectOption),\n };\n};\n\nconst getUniqueCurrencies = (options: CurrencyOptions) => {\n const allCurrencyOptions = options.flatMap((section) => section.currencies);\n const uniqueCurrencies = new Map<string, CurrencyOption>();\n\n allCurrencyOptions.forEach((currencyObj) => {\n uniqueCurrencies.set(currencyObj.code, currencyObj);\n });\n\n return Array.from(uniqueCurrencies.values());\n};\n\nconst filterAndSortCurrenciesForQuery = (\n currencies: CurrencyOption[],\n query: string,\n): CurrencyOption[] => {\n return (\n currencies\n .filter((currency) => {\n return (\n currency.code.toLowerCase().includes(query) \|\|\n (currency.label ?? '').toLowerCase().includes(query) \|\|\n currency.keywords?.some((keyword) => keyword.toLowerCase().includes(query))\n );\n })\n // prefer exact matches, then sort alphabetically by code\n .sort((a, b) => {\n const aCode = a.code.toLowerCase();\n const bCode = b.code.toLowerCase();\n if (aCode === query) {\n return -1;\n }\n if (bCode === query) {\n return 1;\n }\n return aCode.localeCompare(bCode);\n })\n );\n};\n"],"names":["CurrencySelector","id","currency","options","labelId","onChange","addons","onOpen","onSearchChange","intl","useIntl","allCurrencyOptions","useMemo","getUniqueCurrencies","activeCurrencyOption","find","option","code","disabled","length","currencies","searchQuery","setSearchQuery","useState","handleTriggerClick","event","triggerEl","currentTarget","getAttribute","items","filterAndSortCurrenciesForQuery","map","getCurrencySelectOption","getCurrencyGroup","_jsx","SelectInput","compareValues","value","filterable","filterPlaceholder","formatMessage","messages","currencySelectorSearchPlaceholder","UNSAFE_triggerButtonProps","undefined","currencySelectorSelectCurrency","renderValue","label","SelectInputOptionContent","title","note","icon","Flag","intrinsicSize","renderTrigger","SelectInputTriggerButton","as","ButtonInput","addonStart","type","asset","filter","Boolean","avatar","Object","keys","addonEnd","ChevronDown","onClick","children","newValue","onFilterChange","queryNormalized","query","resultCount","forwardRef","rest","ref","Button","size","v2","className","priority","filterMatchers","keywords","section","flatMap","uniqueCurrencies","Map","forEach","currencyObj","set","Array","from","values","toLowerCase","includes","some","keyword","sort","a","b","aCode","bCode","localeCompare"],"mappings":"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"}

package/build/expressiveMoneyInput/currencySelector/CurrencySelector.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CurrencySelector.mjs","sources":["../../../src/expressiveMoneyInput/currencySelector/CurrencySelector.tsx"],"sourcesContent":["import type { AvatarLayoutProps } from '../../avatarLayout';\nimport Button from '../../button';\nimport {\n SelectInput,\n SelectInputOptionContent,\n SelectInputTriggerButton,\n} from '../../inputs/SelectInput';\nimport { CurrencyType, Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\nimport { ChevronDown } from '@transferwise/icons';\nimport { Flag } from '@wise/art';\nimport {\n type ButtonHTMLAttributes,\n forwardRef,\n type MouseEventHandler,\n useMemo,\n useState,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../ExpressiveMoneyInput.messages';\n\nexport interface CurrencyOption {\n label?: string;\n code: string;\n keywords: string[] \| undefined;\n}\n\nexport interface CurrencySection {\n title: string;\n currencies: CurrencyOption[];\n}\n\nexport type CurrencyOptions = CurrencySection[];\n\nexport type Props = {\n id: string;\n labelId: string;\n options?: CurrencyOptions;\n onChange?: (currency: CurrencyType) => void;\n onOpen?: () => void;\n addons?: AvatarLayoutProps['avatars'];\n onSearchChange?: (payload: { query: string; resultCount: number }) => void;\n} & Pick<ExpressiveMoneyInputProps, 'currency'>;\n\nexport const CurrencySelector = ({\n id,\n currency,\n options = [],\n labelId,\n onChange,\n addons,\n onOpen,\n onSearchChange,\n}: Props) => {\n const intl = useIntl();\n\n const allCurrencyOptions = useMemo(() => getUniqueCurrencies(options), [options]);\n\n const activeCurrencyOption = useMemo(() => {\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n return allCurrencyOptions.find((option) => option.code === currency)!;\n }, [currency, allCurrencyOptions]);\n\n const disabled =\n !onChange \|\|\n options.length === 0 \|\|\n (options.length === 1 && options[0].currencies.length <= 1);\n\n const [searchQuery, setSearchQuery] = useState<string>('');\n\n const handleTriggerClick: MouseEventHandler = (event) => {\n const triggerEl = event.currentTarget;\n if (triggerEl?.getAttribute('aria-expanded') === 'false') {\n onOpen?.();\n }\n };\n\n const items = searchQuery\n ? filterAndSortCurrenciesForQuery(allCurrencyOptions, searchQuery).map(getCurrencySelectOption)\n : options.map(getCurrencyGroup);\n\n return (\n <SelectInput\n compareValues=\"code\"\n disabled={disabled}\n id={id}\n value={activeCurrencyOption}\n filterable\n filterPlaceholder={intl.formatMessage(messages.currencySelectorSearchPlaceholder)}\n UNSAFE_triggerButtonProps={{\n id: undefined,\n 'aria-labelledby': undefined,\n 'aria-describedby': labelId,\n 'aria-invalid': undefined,\n 'aria-label': intl.formatMessage(messages.currencySelectorSelectCurrency),\n }}\n items={items}\n renderValue={({ code, label }) => {\n return (\n <SelectInputOptionContent\n title={code}\n note={label}\n icon={<Flag code={code} intrinsicSize={24} />}\n />\n );\n }}\n renderTrigger={() => (\n <SelectInputTriggerButton\n as={ButtonInput}\n // @ts-expect-error new (v2) ButtonProps\n addonStart={{\n type: 'avatar',\n value: [\n addons ? addons[0] : null,\n {\n ...(addons && addons.length > 1\n ? { ...addons[1] }\n : {\n asset: <Flag code={currency} />,\n }),\n },\n ]\n .filter(Boolean)\n .filter((avatar) => !(avatar && Object.keys(avatar).length === 0)),\n }}\n addonEnd={disabled ? undefined : { type: 'icon', value: <ChevronDown /> }}\n onClick={(event) => handleTriggerClick(event)}\n >\n {currency}\n </SelectInputTriggerButton>\n )}\n onChange={(newValue) => {\n onChange?.(newValue.code);\n }}\n onFilterChange={({ queryNormalized }) => {\n setSearchQuery(queryNormalized ?? '');\n if (queryNormalized) {\n onSearchChange?.({\n query: queryNormalized,\n resultCount: filterAndSortCurrenciesForQuery(allCurrencyOptions, queryNormalized)\n .length,\n });\n }\n }}\n />\n );\n};\n\nexport const ButtonInput = forwardRef(function ButtonInput(\n { children, ...rest }: React.PropsWithChildren<ButtonHTMLAttributes<HTMLButtonElement>>,\n ref: React.ForwardedRef<HTMLButtonElement \| null>,\n) {\n return (\n <Button\n ref={ref}\n size=\"md\"\n v2\n className=\"wds-currency-selector\"\n priority=\"secondary-neutral\"\n {...rest}\n >\n {children}\n </Button>\n );\n});\n\nconst getCurrencySelectOption = (currency: CurrencyOption) => {\n return {\n type: 'option' as const,\n value: currency,\n filterMatchers: currency.keywords,\n };\n};\n\nconst getCurrencyGroup = (section: CurrencySection) => {\n return {\n type: 'group' as const,\n label: section.title,\n options: section.currencies.map(getCurrencySelectOption),\n };\n};\n\nconst getUniqueCurrencies = (options: CurrencyOptions) => {\n const allCurrencyOptions = options.flatMap((section) => section.currencies);\n const uniqueCurrencies = new Map<string, CurrencyOption>();\n\n allCurrencyOptions.forEach((currencyObj) => {\n uniqueCurrencies.set(currencyObj.code, currencyObj);\n });\n\n return Array.from(uniqueCurrencies.values());\n};\n\nconst filterAndSortCurrenciesForQuery = (\n currencies: CurrencyOption[],\n query: string,\n): CurrencyOption[] => {\n return (\n currencies\n .filter((currency) => {\n return (\n currency.code.toLowerCase().includes(query) \|\|\n (currency.label ?? '').toLowerCase().includes(query) \|\|\n currency.keywords?.some((keyword) => keyword.toLowerCase().includes(query))\n );\n })\n // prefer exact matches, then sort alphabetically by code\n .sort((a, b) => {\n const aCode = a.code.toLowerCase();\n const bCode = b.code.toLowerCase();\n if (aCode === query) {\n return -1;\n }\n if (bCode === query) {\n return 1;\n }\n return aCode.localeCompare(bCode);\n })\n );\n};\n"],"names":["CurrencySelector","id","currency","options","labelId","onChange","addons","onOpen","onSearchChange","intl","useIntl","allCurrencyOptions","useMemo","getUniqueCurrencies","activeCurrencyOption","find","option","code","disabled","length","currencies","searchQuery","setSearchQuery","useState","handleTriggerClick","event","triggerEl","currentTarget","getAttribute","items","filterAndSortCurrenciesForQuery","map","getCurrencySelectOption","getCurrencyGroup","_jsx","SelectInput","compareValues","value","filterable","filterPlaceholder","formatMessage","messages","currencySelectorSearchPlaceholder","UNSAFE_triggerButtonProps","undefined","currencySelectorSelectCurrency","renderValue","label","SelectInputOptionContent","title","note","icon","Flag","intrinsicSize","renderTrigger","SelectInputTriggerButton","as","ButtonInput","addonStart","type","asset","filter","Boolean","avatar","Object","keys","addonEnd","ChevronDown","onClick","children","newValue","onFilterChange","queryNormalized","query","resultCount","forwardRef","rest","ref","Button","size","v2","className","priority","filterMatchers","keywords","section","flatMap","uniqueCurrencies","Map","forEach","currencyObj","set","Array","from","values","toLowerCase","includes","some","keyword","sort","a","b","aCode","bCode","localeCompare"],"mappings":";;;;;;;;;AA4CO,MAAMA,gBAAgB,GAAGA,CAAC;EAC/BC,EAAE;EACFC,QAAQ;AACRC,EAAAA,OAAO,GAAG,EAAE;EACZC,OAAO;EACPC,QAAQ;EACRC,MAAM;EACNC,MAAM;AACNC,EAAAA;AACK,CAAC,KAAK;AACX,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE;AAEtB,EAAA,MAAMC,kBAAkB,GAAGC,OAAO,CAAC,MAAMC,mBAAmB,CAACV,OAAO,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;AAEjF,EAAA,MAAMW,oBAAoB,GAAGF,OAAO,CAAC,MAAM;AACzC;IACA,OAAOD,kBAAkB,CAACI,IAAI,CAAEC,MAAM,IAAKA,MAAM,CAACC,IAAI,KAAKf,QAAQ,CAAC;AACtE,EAAA,CAAC,EAAE,CAACA,QAAQ,EAAES,kBAAkB,CAAC,CAAC;EAElC,MAAMO,QAAQ,GACZ,CAACb,QAAQ,IACTF,OAAO,CAACgB,MAAM,KAAK,CAAC,IACnBhB,OAAO,CAACgB,MAAM,KAAK,CAAC,IAAIhB,OAAO,CAAC,CAAC,CAAC,CAACiB,UAAU,CAACD,MAAM,IAAI,CAAE;EAE7D,MAAM,CAACE,WAAW,EAAEC,cAAc,CAAC,GAAGC,QAAQ,CAAS,EAAE,CAAC;EAE1D,MAAMC,kBAAqC,GAAIC,KAAK,IAAK;AACvD,IAAA,MAAMC,SAAS,GAAGD,KAAK,CAACE,aAAa;IACrC,IAAID,SAAS,EAAEE,YAAY,CAAC,eAAe,CAAC,KAAK,OAAO,EAAE;AACxDrB,MAAAA,MAAM,IAAI;AACZ,IAAA;EACF,CAAC;EAED,MAAMsB,KAAK,GAAGR,WAAW,GACrBS,+BAA+B,CAACnB,kBAAkB,EAAEU,WAAW,CAAC,CAACU,GAAG,CAACC,uBAAuB,CAAC,GAC7F7B,OAAO,CAAC4B,GAAG,CAACE,gBAAgB,CAAC;EAEjC,oBACEC,GAAA,CAACC,WAAW,EAAA;AACVC,IAAAA,aAAa,EAAC,MAAM;AACpBlB,IAAAA,QAAQ,EAAEA,QAAS;AACnBjB,IAAAA,EAAE,EAAEA,EAAG;AACPoC,IAAAA,KAAK,EAAEvB,oBAAqB;IAC5BwB,UAAU,EAAA,IAAA;IACVC,iBAAiB,EAAE9B,IAAI,CAAC+B,aAAa,CAACC,QAAQ,CAACC,iCAAiC,CAAE;AAClFC,IAAAA,yBAAyB,EAAE;AACzB1C,MAAAA,EAAE,EAAE2C,SAAS;AACb,MAAA,iBAAiB,EAAEA,SAAS;AAC5B,MAAA,kBAAkB,EAAExC,OAAO;AAC3B,MAAA,cAAc,EAAEwC,SAAS;AACzB,MAAA,YAAY,EAAEnC,IAAI,CAAC+B,aAAa,CAACC,QAAQ,CAACI,8BAA8B;KACxE;AACFhB,IAAAA,KAAK,EAAEA,KAAM;AACbiB,IAAAA,WAAW,EAAEA,CAAC;MAAE7B,IAAI;AAAE8B,MAAAA;AAAM,KAAC,KAAK;MAChC,oBACEb,GAAA,CAACc,wBAAwB,EAAA;AACvBC,QAAAA,KAAK,EAAEhC,IAAK;AACZiC,QAAAA,IAAI,EAAEH,KAAM;QACZI,IAAI,eAAEjB,GAAA,CAACkB,IAAI,EAAA;AAACnC,UAAAA,IAAI,EAAEA,IAAK;AAACoC,UAAAA,aAAa,EAAE;SAAK;AAAE,OAC/C,CAAC;IAEN,CAAE;AACFC,IAAAA,aAAa,EAAEA,mBACbpB,GAAA,CAACqB,wBAAwB,EAAA;AACvBC,MAAAA,EAAE,EAAEC;AACJ;AAAA;AACAC,MAAAA,UAAU,EAAE;AACVC,QAAAA,IAAI,EAAE,QAAQ;QACdtB,KAAK,EAAE,CACL/B,MAAM,GAAGA,MAAM,CAAC,CAAC,CAAC,GAAG,IAAI,EACzB;AACE,UAAA,IAAIA,MAAM,IAAIA,MAAM,CAACa,MAAM,GAAG,CAAC,GAC3B;YAAE,GAAGb,MAAM,CAAC,CAAC;AAAE,WAAC,GAChB;YACEsD,KAAK,eAAE1B,GAAA,CAACkB,IAAI,EAAA;AAACnC,cAAAA,IAAI,EAAEf;aAAW;WAC/B;SACN,CACF,CACE2D,MAAM,CAACC,OAAO,CAAC,CACfD,MAAM,CAAEE,MAAM,IAAK,EAAEA,MAAM,IAAIC,MAAM,CAACC,IAAI,CAACF,MAAM,CAAC,CAAC5C,MAAM,KAAK,CAAC,CAAC;OACnE;AACF+C,MAAAA,QAAQ,EAAEhD,QAAQ,GAAG0B,SAAS,GAAG;AAAEe,QAAAA,IAAI,EAAE,MAAM;AAAEtB,QAAAA,KAAK,eAAEH,GAAA,CAACiC,WAAW,EAAA,EAAE;OAAI;AAC1EC,MAAAA,OAAO,EAAG3C,KAAK,IAAKD,kBAAkB,CAACC,KAAK,CAAE;AAAA4C,MAAAA,QAAA,EAE7CnE;AAAQ,KACe,CAC1B;IACFG,QAAQ,EAAGiE,QAAQ,IAAK;AACtBjE,MAAAA,QAAQ,GAAGiE,QAAQ,CAACrD,IAAI,CAAC;IAC3B,CAAE;AACFsD,IAAAA,cAAc,EAAEA,CAAC;AAAEC,MAAAA;AAAgB,KAAC,KAAK;AACvClD,MAAAA,cAAc,CAACkD,eAAe,IAAI,EAAE,CAAC;AACrC,MAAA,IAAIA,eAAe,EAAE;AACnBhE,QAAAA,cAAc,GAAG;AACfiE,UAAAA,KAAK,EAAED,eAAe;AACtBE,UAAAA,WAAW,EAAE5C,+BAA+B,CAACnB,kBAAkB,EAAE6D,eAAe,CAAC,CAC9ErD;AACL,SAAC,CAAC;AACJ,MAAA;AACF,IAAA;AAAE,GACH,CAAC;AAEN;MAEasC,WAAW,gBAAGkB,UAAU,CAAC,SAASlB,WAAWA,CACxD;EAAEY,QAAQ;EAAE,GAAGO;AAAuE,CAAC,EACvFC,GAAiD,EACjD;EACA,oBACE3C,GAAA,CAAC4C,MAAM,EAAA;AACLD,IAAAA,GAAG,EAAEA,GAAI;AACTE,IAAAA,IAAI,EAAC,IAAI;IACTC,EAAE,EAAA,IAAA;AACFC,IAAAA,SAAS,EAAC,uBAAuB;AACjCC,IAAAA,QAAQ,EAAC,mBAAmB;AAAA,IAAA,GACxBN,IAAI;AAAAP,IAAAA,QAAA,EAEPA;AAAQ,GACH,CAAC;AAEb,CAAC;AAED,MAAMrC,uBAAuB,GAAI9B,QAAwB,IAAK;EAC5D,OAAO;AACLyD,IAAAA,IAAI,EAAE,QAAiB;AACvBtB,IAAAA,KAAK,EAAEnC,QAAQ;IACfiF,cAAc,EAAEjF,QAAQ,CAACkF;GAC1B;AACH,CAAC;AAED,MAAMnD,gBAAgB,GAAIoD,OAAwB,IAAK;EACrD,OAAO;AACL1B,IAAAA,IAAI,EAAE,OAAgB;IACtBZ,KAAK,EAAEsC,OAAO,CAACpC,KAAK;AACpB9C,IAAAA,OAAO,EAAEkF,OAAO,CAACjE,UAAU,CAACW,GAAG,CAACC,uBAAuB;GACxD;AACH,CAAC;AAED,MAAMnB,mBAAmB,GAAIV,OAAwB,IAAK;EACxD,MAAMQ,kBAAkB,GAAGR,OAAO,CAACmF,OAAO,CAAED,OAAO,IAAKA,OAAO,CAACjE,UAAU,CAAC;AAC3E,EAAA,MAAMmE,gBAAgB,GAAG,IAAIC,GAAG,EAA0B;AAE1D7E,EAAAA,kBAAkB,CAAC8E,OAAO,CAAEC,WAAW,IAAK;IAC1CH,gBAAgB,CAACI,GAAG,CAACD,WAAW,CAACzE,IAAI,EAAEyE,WAAW,CAAC;AACrD,EAAA,CAAC,CAAC;EAEF,OAAOE,KAAK,CAACC,IAAI,CAACN,gBAAgB,CAACO,MAAM,EAAE,CAAC;AAC9C,CAAC;AAED,MAAMhE,+BAA+B,GAAGA,CACtCV,UAA4B,EAC5BqD,KAAa,KACQ;AACrB,EAAA,OACErD,UAAU,CACPyC,MAAM,CAAE3D,QAAQ,IAAK;IACpB,OACEA,QAAQ,CAACe,IAAI,CAAC8E,WAAW,EAAE,CAACC,QAAQ,CAACvB,KAAK,CAAC,IAC3C,CAACvE,QAAQ,CAAC6C,KAAK,IAAI,EAAE,EAAEgD,WAAW,EAAE,CAACC,QAAQ,CAACvB,KAAK,CAAC,IACpDvE,QAAQ,CAACkF,QAAQ,EAAEa,IAAI,CAAEC,OAAO,IAAKA,OAAO,CAACH,WAAW,EAAE,CAACC,QAAQ,CAACvB,KAAK,CAAC,CAAC;EAE/E,CAAC;AACD;AAAA,GACC0B,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;IACd,MAAMC,KAAK,GAAGF,CAAC,CAACnF,IAAI,CAAC8E,WAAW,EAAE;IAClC,MAAMQ,KAAK,GAAGF,CAAC,CAACpF,IAAI,CAAC8E,WAAW,EAAE;IAClC,IAAIO,KAAK,KAAK7B,KAAK,EAAE;AACnB,MAAA,OAAO,EAAE;AACX,IAAA;IACA,IAAI8B,KAAK,KAAK9B,KAAK,EAAE;AACnB,MAAA,OAAO,CAAC;AACV,IAAA;AACA,IAAA,OAAO6B,KAAK,CAACE,aAAa,CAACD,KAAK,CAAC;AACnC,EAAA,CAAC,CAAC;AAER,CAAC;;;;"}
1	+ {"version":3,"file":"CurrencySelector.mjs","sources":["../../../src/expressiveMoneyInput/currencySelector/CurrencySelector.tsx"],"sourcesContent":["import type { AvatarLayoutProps } from '../../avatarLayout';\nimport Button from '../../button';\nimport {\n SelectInput,\n SelectInputOptionContent,\n SelectInputTriggerButton,\n} from '../../inputs/SelectInput';\nimport { CurrencyType, Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\nimport { ChevronDown } from '@transferwise/icons';\nimport { Flag } from '@wise/art';\nimport {\n type ButtonHTMLAttributes,\n forwardRef,\n type MouseEventHandler,\n useMemo,\n useState,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../ExpressiveMoneyInput.messages';\n\nexport interface CurrencyOption {\n label?: string;\n code: string;\n keywords: string[] \| undefined;\n}\n\nexport interface CurrencySection {\n title: string;\n currencies: CurrencyOption[];\n}\n\nexport type CurrencyOptions = CurrencySection[];\n\nexport type Props = {\n id: string;\n labelId: string;\n options?: CurrencyOptions;\n onChange?: (currency: CurrencyType) => void;\n onOpen?: () => void;\n addons?: AvatarLayoutProps['avatars'];\n onSearchChange?: (payload: { query: string; resultCount: number }) => void;\n} & Pick<ExpressiveMoneyInputProps, 'currency'>;\n\nexport const CurrencySelector = ({\n id,\n currency,\n options = [],\n labelId,\n onChange,\n addons,\n onOpen,\n onSearchChange,\n}: Props) => {\n const intl = useIntl();\n\n const allCurrencyOptions = useMemo(() => getUniqueCurrencies(options), [options]);\n\n const activeCurrencyOption = useMemo(() => {\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n return allCurrencyOptions.find((option) => option.code === currency)!;\n }, [currency, allCurrencyOptions]);\n\n const disabled =\n !onChange \|\|\n options.length === 0 \|\|\n (options.length === 1 && options[0].currencies.length <= 1);\n\n const [searchQuery, setSearchQuery] = useState<string>('');\n\n const handleTriggerClick: MouseEventHandler = (event) => {\n const triggerEl = event.currentTarget;\n if (triggerEl?.getAttribute('aria-expanded') === 'false') {\n onOpen?.();\n }\n };\n\n const items = searchQuery\n ? filterAndSortCurrenciesForQuery(allCurrencyOptions, searchQuery).map(getCurrencySelectOption)\n : options.map(getCurrencyGroup);\n\n return (\n <SelectInput\n compareValues=\"code\"\n disabled={disabled}\n id={id}\n value={activeCurrencyOption}\n filterable\n filterPlaceholder={intl.formatMessage(messages.currencySelectorSearchPlaceholder)}\n UNSAFE_triggerButtonProps={{\n id: undefined,\n 'aria-labelledby': undefined,\n 'aria-describedby': labelId,\n 'aria-invalid': undefined,\n 'aria-label': intl.formatMessage(messages.currencySelectorSelectCurrency),\n }}\n items={items}\n renderValue={({ code, label }) => {\n return (\n <SelectInputOptionContent\n title={code}\n note={label}\n icon={<Flag code={code} intrinsicSize={24} />}\n />\n );\n }}\n renderTrigger={() => (\n <SelectInputTriggerButton\n as={ButtonInput}\n // @ts-expect-error new (v2) ButtonProps\n addonStart={{\n type: 'avatar',\n value: [\n addons ? addons[0] : null,\n {\n ...(addons && addons.length > 1\n ? { ...addons[1] }\n : {\n asset: <Flag code={currency} />,\n }),\n },\n ]\n .filter(Boolean)\n .filter((avatar) => !(avatar && Object.keys(avatar).length === 0)),\n }}\n addonEnd={disabled ? undefined : { type: 'icon', value: <ChevronDown /> }}\n onClick={(event) => handleTriggerClick(event)}\n >\n {currency}\n </SelectInputTriggerButton>\n )}\n onChange={(newValue) => {\n onChange?.(newValue.code);\n }}\n onFilterChange={({ queryNormalized }) => {\n setSearchQuery(queryNormalized ?? '');\n if (queryNormalized) {\n onSearchChange?.({\n query: queryNormalized,\n resultCount: filterAndSortCurrenciesForQuery(allCurrencyOptions, queryNormalized)\n .length,\n });\n }\n }}\n />\n );\n};\n\nexport const ButtonInput = forwardRef(function ButtonInput(\n { children, ...rest }: React.PropsWithChildren<ButtonHTMLAttributes<HTMLButtonElement>>,\n ref: React.ForwardedRef<HTMLButtonElement \| null>,\n) {\n return (\n <Button\n ref={ref}\n size=\"md\"\n v2\n className=\"wds-currency-selector\"\n priority=\"secondary-neutral\"\n {...rest}\n >\n {children}\n </Button>\n );\n});\n\nconst getCurrencySelectOption = (currency: CurrencyOption) => {\n return {\n type: 'option' as const,\n value: currency,\n filterMatchers: currency.keywords,\n };\n};\n\nconst getCurrencyGroup = (section: CurrencySection) => {\n return {\n type: 'group' as const,\n label: section.title,\n options: section.currencies.map(getCurrencySelectOption),\n };\n};\n\nconst getUniqueCurrencies = (options: CurrencyOptions) => {\n const allCurrencyOptions = options.flatMap((section) => section.currencies);\n const uniqueCurrencies = new Map<string, CurrencyOption>();\n\n allCurrencyOptions.forEach((currencyObj) => {\n uniqueCurrencies.set(currencyObj.code, currencyObj);\n });\n\n return Array.from(uniqueCurrencies.values());\n};\n\nconst filterAndSortCurrenciesForQuery = (\n currencies: CurrencyOption[],\n query: string,\n): CurrencyOption[] => {\n return (\n currencies\n .filter((currency) => {\n return (\n currency.code.toLowerCase().includes(query) \|\|\n (currency.label ?? '').toLowerCase().includes(query) \|\|\n currency.keywords?.some((keyword) => keyword.toLowerCase().includes(query))\n );\n })\n // prefer exact matches, then sort alphabetically by code\n .sort((a, b) => {\n const aCode = a.code.toLowerCase();\n const bCode = b.code.toLowerCase();\n if (aCode === query) {\n return -1;\n }\n if (bCode === query) {\n return 1;\n }\n return aCode.localeCompare(bCode);\n })\n );\n};\n"],"names":["CurrencySelector","id","currency","options","labelId","onChange","addons","onOpen","onSearchChange","intl","useIntl","allCurrencyOptions","useMemo","getUniqueCurrencies","activeCurrencyOption","find","option","code","disabled","length","currencies","searchQuery","setSearchQuery","useState","handleTriggerClick","event","triggerEl","currentTarget","getAttribute","items","filterAndSortCurrenciesForQuery","map","getCurrencySelectOption","getCurrencyGroup","_jsx","SelectInput","compareValues","value","filterable","filterPlaceholder","formatMessage","messages","currencySelectorSearchPlaceholder","UNSAFE_triggerButtonProps","undefined","currencySelectorSelectCurrency","renderValue","label","SelectInputOptionContent","title","note","icon","Flag","intrinsicSize","renderTrigger","SelectInputTriggerButton","as","ButtonInput","addonStart","type","asset","filter","Boolean","avatar","Object","keys","addonEnd","ChevronDown","onClick","children","newValue","onFilterChange","queryNormalized","query","resultCount","forwardRef","rest","ref","Button","size","v2","className","priority","filterMatchers","keywords","section","flatMap","uniqueCurrencies","Map","forEach","currencyObj","set","Array","from","values","toLowerCase","includes","some","keyword","sort","a","b","aCode","bCode","localeCompare"],"mappings":"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"}

package/build/expressiveMoneyInput/hooks/useFocus.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFocus.js","sources":["../../../src/expressiveMoneyInput/hooks/useFocus.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nconst focusTimeout = 5 * 1000;\n\nexport const useFocus = () => {\n const [focus, setFocus] = useState(false);\n const [visualFocus, setVisualFocus] = useState(false);\n const [counter, setCounter] = useState(0);\n\n useEffect(() => {\n if (focus) {\n const timeout = setTimeout(() => {\n setVisualFocus(false);\n }, focusTimeout);\n return () => clearTimeout(timeout);\n }\n }, [focus, counter]);\n\n return {\n focus,\n setFocus: (value: boolean) => {\n setFocus(value);\n if (value) {\n setVisualFocus(true);\n }\n // any call to setFocus should reset the timeout, even if the input was already in focus\n // updating the counter will trigger the useEffect to reset the timeout\n setCounter((prev) => prev + 1);\n },\n visualFocus,\n setVisualFocus: (value: boolean) => {\n setVisualFocus(value);\n },\n };\n};\n"],"names":["focusTimeout","useFocus","focus","setFocus","useState","visualFocus","setVisualFocus","counter","setCounter","useEffect","timeout","setTimeout","clearTimeout","value","prev"],"mappings":";;;;AAEA,MAAMA,YAAY,GAAG,CAAC,GAAG,IAAI;AAEtB,MAAMC,QAAQ,GAAGA,~~MAAM~~;~~EAC5B~~,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC;EACzC,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGF,cAAQ,CAAC,KAAK,CAAC;EACrD,MAAM,CAACG,OAAO,EAAEC,UAAU,CAAC,GAAGJ,cAAQ,CAAC,CAAC,CAAC;AAEzCK,EAAAA,eAAS,CAAC,~~MAAM~~;~~AACd~~,IAAA,IAAIP,KAAK,EAAE;AACT,MAAA,MAAMQ,OAAO,GAAGC,UAAU,CAAC,~~MAAM~~;~~QAC/BL~~,cAAc,CAAC,KAAK,CAAC;MACvB,CAAC,EAAEN,YAAY,CAAC;AAChB,MAAA,OAAO,MAAMY,YAAY,CAACF,OAAO,CAAC;AACpC,IAAA;AACF,EAAA,CAAC,EAAE,CAACR,KAAK,EAAEK,OAAO,CAAC,CAAC;EAEpB,OAAO;IACLL,KAAK;IACLC,QAAQ,EAAGU,KAAc,~~IAAK~~;~~MAC5BV~~,QAAQ,CAACU,KAAK,CAAC;AACf,MAAA,IAAIA,KAAK,EAAE;QACTP,cAAc,CAAC,IAAI,CAAC;AACtB,MAAA;AACA;AACA;AACAE,MAAAA,UAAU,CAAEM,IAAI,IAAKA,IAAI,GAAG,CAAC,CAAC;IAChC,CAAC;IACDT,WAAW;IACXC,cAAc,EAAGO,KAAc,~~IAAK~~;~~MAClCP~~,cAAc,CAACO,KAAK,CAAC;AACvB,IAAA;GACD;AACH;;;;"}
1	+ {"version":3,"file":"useFocus.js","sources":["../../../src/expressiveMoneyInput/hooks/useFocus.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nconst focusTimeout = 5 * 1000;\n\nexport const useFocus = () => {\n const [focus, setFocus] = useState(false);\n const [visualFocus, setVisualFocus] = useState(false);\n const [counter, setCounter] = useState(0);\n\n useEffect(() => {\n if (focus) {\n const timeout = setTimeout(() => {\n setVisualFocus(false);\n }, focusTimeout);\n return () => clearTimeout(timeout);\n }\n }, [focus, counter]);\n\n return {\n focus,\n setFocus: (value: boolean) => {\n setFocus(value);\n if (value) {\n setVisualFocus(true);\n }\n // any call to setFocus should reset the timeout, even if the input was already in focus\n // updating the counter will trigger the useEffect to reset the timeout\n setCounter((prev) => prev + 1);\n },\n visualFocus,\n setVisualFocus: (value: boolean) => {\n setVisualFocus(value);\n },\n };\n};\n"],"names":["focusTimeout","useFocus","focus","setFocus","useState","visualFocus","setVisualFocus","counter","setCounter","useEffect","timeout","setTimeout","clearTimeout","value","prev"],"mappings":";;;;AAEA,MAAMA,YAAY,GAAG,CAAC,GAAG,IAAI;AAEtB,MAAMC,QAAQ,GAAGA,MAAK;EAC3B,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC;EACzC,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGF,cAAQ,CAAC,KAAK,CAAC;EACrD,MAAM,CAACG,OAAO,EAAEC,UAAU,CAAC,GAAGJ,cAAQ,CAAC,CAAC,CAAC;AAEzCK,EAAAA,eAAS,CAAC,MAAK;AACb,IAAA,IAAIP,KAAK,EAAE;AACT,MAAA,MAAMQ,OAAO,GAAGC,UAAU,CAAC,MAAK;QAC9BL,cAAc,CAAC,KAAK,CAAC;MACvB,CAAC,EAAEN,YAAY,CAAC;AAChB,MAAA,OAAO,MAAMY,YAAY,CAACF,OAAO,CAAC;AACpC,IAAA;AACF,EAAA,CAAC,EAAE,CAACR,KAAK,EAAEK,OAAO,CAAC,CAAC;EAEpB,OAAO;IACLL,KAAK;IACLC,QAAQ,EAAGU,KAAc,IAAI;MAC3BV,QAAQ,CAACU,KAAK,CAAC;AACf,MAAA,IAAIA,KAAK,EAAE;QACTP,cAAc,CAAC,IAAI,CAAC;AACtB,MAAA;AACA;AACA;AACAE,MAAAA,UAAU,CAAEM,IAAI,IAAKA,IAAI,GAAG,CAAC,CAAC;IAChC,CAAC;IACDT,WAAW;IACXC,cAAc,EAAGO,KAAc,IAAI;MACjCP,cAAc,CAACO,KAAK,CAAC;AACvB,IAAA;GACD;AACH;;;;"}

package/build/expressiveMoneyInput/hooks/useFocus.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFocus.mjs","sources":["../../../src/expressiveMoneyInput/hooks/useFocus.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nconst focusTimeout = 5 * 1000;\n\nexport const useFocus = () => {\n const [focus, setFocus] = useState(false);\n const [visualFocus, setVisualFocus] = useState(false);\n const [counter, setCounter] = useState(0);\n\n useEffect(() => {\n if (focus) {\n const timeout = setTimeout(() => {\n setVisualFocus(false);\n }, focusTimeout);\n return () => clearTimeout(timeout);\n }\n }, [focus, counter]);\n\n return {\n focus,\n setFocus: (value: boolean) => {\n setFocus(value);\n if (value) {\n setVisualFocus(true);\n }\n // any call to setFocus should reset the timeout, even if the input was already in focus\n // updating the counter will trigger the useEffect to reset the timeout\n setCounter((prev) => prev + 1);\n },\n visualFocus,\n setVisualFocus: (value: boolean) => {\n setVisualFocus(value);\n },\n };\n};\n"],"names":["focusTimeout","useFocus","focus","setFocus","useState","visualFocus","setVisualFocus","counter","setCounter","useEffect","timeout","setTimeout","clearTimeout","value","prev"],"mappings":";;AAEA,MAAMA,YAAY,GAAG,CAAC,GAAG,IAAI;AAEtB,MAAMC,QAAQ,GAAGA,~~MAAM~~;~~EAC5B~~,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC;EACzC,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGF,QAAQ,CAAC,KAAK,CAAC;EACrD,MAAM,CAACG,OAAO,EAAEC,UAAU,CAAC,GAAGJ,QAAQ,CAAC,CAAC,CAAC;AAEzCK,EAAAA,SAAS,CAAC,~~MAAM~~;~~AACd~~,IAAA,IAAIP,KAAK,EAAE;AACT,MAAA,MAAMQ,OAAO,GAAGC,UAAU,CAAC,~~MAAM~~;~~QAC/BL~~,cAAc,CAAC,KAAK,CAAC;MACvB,CAAC,EAAEN,YAAY,CAAC;AAChB,MAAA,OAAO,MAAMY,YAAY,CAACF,OAAO,CAAC;AACpC,IAAA;AACF,EAAA,CAAC,EAAE,CAACR,KAAK,EAAEK,OAAO,CAAC,CAAC;EAEpB,OAAO;IACLL,KAAK;IACLC,QAAQ,EAAGU,KAAc,~~IAAK~~;~~MAC5BV~~,QAAQ,CAACU,KAAK,CAAC;AACf,MAAA,IAAIA,KAAK,EAAE;QACTP,cAAc,CAAC,IAAI,CAAC;AACtB,MAAA;AACA;AACA;AACAE,MAAAA,UAAU,CAAEM,IAAI,IAAKA,IAAI,GAAG,CAAC,CAAC;IAChC,CAAC;IACDT,WAAW;IACXC,cAAc,EAAGO,KAAc,~~IAAK~~;~~MAClCP~~,cAAc,CAACO,KAAK,CAAC;AACvB,IAAA;GACD;AACH;;;;"}
1	+ {"version":3,"file":"useFocus.mjs","sources":["../../../src/expressiveMoneyInput/hooks/useFocus.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nconst focusTimeout = 5 * 1000;\n\nexport const useFocus = () => {\n const [focus, setFocus] = useState(false);\n const [visualFocus, setVisualFocus] = useState(false);\n const [counter, setCounter] = useState(0);\n\n useEffect(() => {\n if (focus) {\n const timeout = setTimeout(() => {\n setVisualFocus(false);\n }, focusTimeout);\n return () => clearTimeout(timeout);\n }\n }, [focus, counter]);\n\n return {\n focus,\n setFocus: (value: boolean) => {\n setFocus(value);\n if (value) {\n setVisualFocus(true);\n }\n // any call to setFocus should reset the timeout, even if the input was already in focus\n // updating the counter will trigger the useEffect to reset the timeout\n setCounter((prev) => prev + 1);\n },\n visualFocus,\n setVisualFocus: (value: boolean) => {\n setVisualFocus(value);\n },\n };\n};\n"],"names":["focusTimeout","useFocus","focus","setFocus","useState","visualFocus","setVisualFocus","counter","setCounter","useEffect","timeout","setTimeout","clearTimeout","value","prev"],"mappings":";;AAEA,MAAMA,YAAY,GAAG,CAAC,GAAG,IAAI;AAEtB,MAAMC,QAAQ,GAAGA,MAAK;EAC3B,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC;EACzC,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGF,QAAQ,CAAC,KAAK,CAAC;EACrD,MAAM,CAACG,OAAO,EAAEC,UAAU,CAAC,GAAGJ,QAAQ,CAAC,CAAC,CAAC;AAEzCK,EAAAA,SAAS,CAAC,MAAK;AACb,IAAA,IAAIP,KAAK,EAAE;AACT,MAAA,MAAMQ,OAAO,GAAGC,UAAU,CAAC,MAAK;QAC9BL,cAAc,CAAC,KAAK,CAAC;MACvB,CAAC,EAAEN,YAAY,CAAC;AAChB,MAAA,OAAO,MAAMY,YAAY,CAACF,OAAO,CAAC;AACpC,IAAA;AACF,EAAA,CAAC,EAAE,CAACR,KAAK,EAAEK,OAAO,CAAC,CAAC;EAEpB,OAAO;IACLL,KAAK;IACLC,QAAQ,EAAGU,KAAc,IAAI;MAC3BV,QAAQ,CAACU,KAAK,CAAC;AACf,MAAA,IAAIA,KAAK,EAAE;QACTP,cAAc,CAAC,IAAI,CAAC;AACtB,MAAA;AACA;AACA;AACAE,MAAAA,UAAU,CAAEM,IAAI,IAAKA,IAAI,GAAG,CAAC,CAAC;IAChC,CAAC;IACDT,WAAW;IACXC,cAAc,EAAGO,KAAc,IAAI;MACjCP,cAAc,CAACO,KAAK,CAAC;AACvB,IAAA;GACD;AACH;;;;"}

package/build/expressiveMoneyInput/hooks/useInputStyle.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useInputStyle.js","sources":["../../../src/expressiveMoneyInput/hooks/useInputStyle.ts"],"sourcesContent":["import { type CSSProperties, useEffect, useLayoutEffect, useState } from 'react';\nimport { Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\n\ntype InputStyleObject = {\n value: string;\n focus: boolean;\n inputElement: HTMLInputElement \| null;\n} & Pick<ExpressiveMoneyInputProps, 'loading'>;\n\nexport const useInputStyle = ({ value, focus, inputElement, loading }: InputStyleObject) => {\n const initialRender = !useTimeout(300);\n const inputWidth = useFirstDefinedValue(inputElement?.clientWidth, [inputElement, value]);\n\n const getStyle = (): CSSProperties => {\n const fontSize = getFontSize(value, focus, inputWidth);\n\n return {\n fontSize,\n height: fontSize,\n // aligns the top of the digit with the currency button\n marginTop: fontSize * -0.19,\n // if the input loads with a pre-filled value, we don't want to animate the font-size immediately\n transition: initialRender ? 'none' : undefined,\n color: loading ? 'var(--color-interactive-secondary)' : undefined,\n };\n };\n\n const [style, setStyle] = useState(getStyle());\n\n useLayoutEffect(() => {\n setStyle(getStyle());\n }, [value, focus, loading, inputWidth]);\n\n return style;\n};\n\nfunction getFontSize(inputValue: string, isFocused: boolean, inputWidth: number \| undefined) {\n const defaultFontSize = 52;\n const focusFontSize = 90;\n const minimumFontSize = 34;\n\n let fontSize = isFocused ? focusFontSize : defaultFontSize;\n\n if (typeof inputWidth === 'undefined') {\n return fontSize;\n }\n const textLength = inputValue.length;\n const maxCharactersWithoutShrinking = Math.floor(inputWidth / 40);\n\n if (textLength > maxCharactersWithoutShrinking) {\n const adjustedSize = Math.round((inputWidth / textLength) * 1.9);\n fontSize = Math.min(fontSize, adjustedSize);\n }\n\n return Math.max(fontSize, minimumFontSize);\n}\n\nconst useFirstDefinedValue = (newValue: number \| undefined, dependencies: unknown[]) => {\n const [value, setValue] = useState<number \| undefined>(newValue);\n\n useLayoutEffect(() => {\n if (typeof newValue !== 'undefined' && typeof value === 'undefined') {\n setValue(newValue);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [...dependencies, value]);\n\n return value;\n};\n\nconst useTimeout = (delay: number) => {\n const [ready, setReady] = useState(false);\n\n useEffect(() => {\n const timeout = setTimeout(() => {\n setReady(true);\n }, delay);\n\n return () => {\n clearTimeout(timeout);\n };\n }, [delay]);\n\n return ready;\n};\n"],"names":["useInputStyle","value","focus","inputElement","loading","initialRender","useTimeout","inputWidth","useFirstDefinedValue","clientWidth","getStyle","fontSize","getFontSize","height","marginTop","transition","undefined","color","style","setStyle","useState","useLayoutEffect","inputValue","isFocused","defaultFontSize","focusFontSize","minimumFontSize","textLength","length","maxCharactersWithoutShrinking","Math","floor","adjustedSize","round","min","max","newValue","dependencies","setValue","delay","ready","setReady","useEffect","timeout","setTimeout","clearTimeout"],"mappings":";;;;AASO,MAAMA,aAAa,GAAGA,CAAC;EAAEC,KAAK;EAAEC,KAAK;EAAEC,YAAY;AAAEC,EAAAA;~~AAA0B~~,~~CAAC~~,~~KAAK~~;~~AAC1F~~,EAAA,MAAMC,aAAa,GAAG,CAACC,UAAU,CAAC,GAAG,CAAC;AACtC,EAAA,MAAMC,UAAU,GAAGC,oBAAoB,CAACL,YAAY,EAAEM,WAAW,EAAE,CAACN,YAAY,EAAEF,KAAK,CAAC,CAAC;EAEzF,MAAMS,QAAQ,GAAGA,~~MAAqB~~;~~IACpC~~,MAAMC,QAAQ,GAAGC,WAAW,CAACX,KAAK,EAAEC,KAAK,EAAEK,UAAU,CAAC;IAEtD,OAAO;MACLI,QAAQ;AACRE,MAAAA,MAAM,EAAEF,QAAQ;AAChB;AACAG,MAAAA,SAAS,EAAEH,QAAQ,GAAG,KAAK;AAC3B;AACAI,MAAAA,UAAU,EAAEV,aAAa,GAAG,MAAM,GAAGW,SAAS;AAC9CC,MAAAA,KAAK,EAAEb,OAAO,GAAG,oCAAoC,GAAGY;KACzD;EACH,CAAC;EAED,MAAM,CAACE,KAAK,EAAEC,QAAQ,CAAC,GAAGC,cAAQ,CAACV,QAAQ,EAAE,CAAC;AAE9CW,EAAAA,qBAAe,CAAC,~~MAAM~~;~~AACpBF~~,IAAAA,QAAQ,CAACT,QAAQ,EAAE,CAAC;EACtB,CAAC,EAAE,CAACT,KAAK,EAAEC,KAAK,EAAEE,OAAO,EAAEG,UAAU,CAAC,CAAC;AAEvC,EAAA,OAAOW,KAAK;AACd;AAEA,SAASN,WAAWA,CAACU,UAAkB,EAAEC,SAAkB,EAAEhB,UAA8B,~~EAAE~~;~~EAC3F~~,MAAMiB,eAAe,GAAG,EAAE;EAC1B,MAAMC,aAAa,GAAG,EAAE;EACxB,MAAMC,eAAe,GAAG,EAAE;AAE1B,EAAA,IAAIf,QAAQ,GAAGY,SAAS,GAAGE,aAAa,GAAGD,eAAe;AAE1D,EAAA,IAAI,OAAOjB,UAAU,KAAK,WAAW,EAAE;AACrC,IAAA,OAAOI,QAAQ;AACjB,EAAA;AACA,EAAA,MAAMgB,UAAU,GAAGL,UAAU,CAACM,MAAM;EACpC,MAAMC,6BAA6B,GAAGC,IAAI,CAACC,KAAK,CAACxB,UAAU,GAAG,EAAE,CAAC;EAEjE,IAAIoB,UAAU,GAAGE,6BAA6B,EAAE;IAC9C,MAAMG,YAAY,GAAGF,IAAI,CAACG,KAAK,CAAE1B,UAAU,GAAGoB,UAAU,GAAI,GAAG,CAAC;IAChEhB,QAAQ,GAAGmB,IAAI,CAACI,GAAG,CAACvB,QAAQ,EAAEqB,YAAY,CAAC;AAC7C,EAAA;AAEA,EAAA,OAAOF,IAAI,CAACK,GAAG,CAACxB,QAAQ,EAAEe,eAAe,CAAC;AAC5C;AAEA,MAAMlB,oBAAoB,GAAGA,CAAC4B,QAA4B,EAAEC,YAAuB,~~KAAK~~;~~EACtF~~,MAAM,CAACpC,KAAK,EAAEqC,QAAQ,CAAC,GAAGlB,cAAQ,CAAqBgB,QAAQ,CAAC;AAEhEf,EAAAA,qBAAe,CAAC,~~MAAM~~;~~IACpB~~,IAAI,OAAOe,QAAQ,KAAK,WAAW,IAAI,OAAOnC,KAAK,KAAK,WAAW,EAAE;MACnEqC,QAAQ,CAACF,QAAQ,CAAC;AACpB,IAAA;AACA;AACF,EAAA,CAAC,EAAE,CAAC,GAAGC,YAAY,EAAEpC,KAAK,CAAC,CAAC;AAE5B,EAAA,OAAOA,KAAK;AACd,CAAC;AAED,MAAMK,UAAU,GAAIiC,KAAa,~~IAAK~~;~~EACpC~~,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGrB,cAAQ,CAAC,KAAK,CAAC;AAEzCsB,EAAAA,eAAS,CAAC,~~MAAM~~;~~AACd~~,IAAA,MAAMC,OAAO,GAAGC,UAAU,CAAC,~~MAAM~~;~~MAC/BH~~,QAAQ,CAAC,IAAI,CAAC;IAChB,CAAC,EAAEF,KAAK,CAAC;AAET,IAAA,OAAO,~~MAAM~~;~~MACXM~~,YAAY,CAACF,OAAO,CAAC;IACvB,CAAC;AACH,EAAA,CAAC,EAAE,CAACJ,KAAK,CAAC,CAAC;AAEX,EAAA,OAAOC,KAAK;AACd,CAAC;;;;"}
1	+ {"version":3,"file":"useInputStyle.js","sources":["../../../src/expressiveMoneyInput/hooks/useInputStyle.ts"],"sourcesContent":["import { type CSSProperties, useEffect, useLayoutEffect, useState } from 'react';\nimport { Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\n\ntype InputStyleObject = {\n value: string;\n focus: boolean;\n inputElement: HTMLInputElement \| null;\n} & Pick<ExpressiveMoneyInputProps, 'loading'>;\n\nexport const useInputStyle = ({ value, focus, inputElement, loading }: InputStyleObject) => {\n const initialRender = !useTimeout(300);\n const inputWidth = useFirstDefinedValue(inputElement?.clientWidth, [inputElement, value]);\n\n const getStyle = (): CSSProperties => {\n const fontSize = getFontSize(value, focus, inputWidth);\n\n return {\n fontSize,\n height: fontSize,\n // aligns the top of the digit with the currency button\n marginTop: fontSize * -0.19,\n // if the input loads with a pre-filled value, we don't want to animate the font-size immediately\n transition: initialRender ? 'none' : undefined,\n color: loading ? 'var(--color-interactive-secondary)' : undefined,\n };\n };\n\n const [style, setStyle] = useState(getStyle());\n\n useLayoutEffect(() => {\n setStyle(getStyle());\n }, [value, focus, loading, inputWidth]);\n\n return style;\n};\n\nfunction getFontSize(inputValue: string, isFocused: boolean, inputWidth: number \| undefined) {\n const defaultFontSize = 52;\n const focusFontSize = 90;\n const minimumFontSize = 34;\n\n let fontSize = isFocused ? focusFontSize : defaultFontSize;\n\n if (typeof inputWidth === 'undefined') {\n return fontSize;\n }\n const textLength = inputValue.length;\n const maxCharactersWithoutShrinking = Math.floor(inputWidth / 40);\n\n if (textLength > maxCharactersWithoutShrinking) {\n const adjustedSize = Math.round((inputWidth / textLength) * 1.9);\n fontSize = Math.min(fontSize, adjustedSize);\n }\n\n return Math.max(fontSize, minimumFontSize);\n}\n\nconst useFirstDefinedValue = (newValue: number \| undefined, dependencies: unknown[]) => {\n const [value, setValue] = useState<number \| undefined>(newValue);\n\n useLayoutEffect(() => {\n if (typeof newValue !== 'undefined' && typeof value === 'undefined') {\n setValue(newValue);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [...dependencies, value]);\n\n return value;\n};\n\nconst useTimeout = (delay: number) => {\n const [ready, setReady] = useState(false);\n\n useEffect(() => {\n const timeout = setTimeout(() => {\n setReady(true);\n }, delay);\n\n return () => {\n clearTimeout(timeout);\n };\n }, [delay]);\n\n return ready;\n};\n"],"names":["useInputStyle","value","focus","inputElement","loading","initialRender","useTimeout","inputWidth","useFirstDefinedValue","clientWidth","getStyle","fontSize","getFontSize","height","marginTop","transition","undefined","color","style","setStyle","useState","useLayoutEffect","inputValue","isFocused","defaultFontSize","focusFontSize","minimumFontSize","textLength","length","maxCharactersWithoutShrinking","Math","floor","adjustedSize","round","min","max","newValue","dependencies","setValue","delay","ready","setReady","useEffect","timeout","setTimeout","clearTimeout"],"mappings":"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"}

package/build/expressiveMoneyInput/hooks/useInputStyle.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useInputStyle.mjs","sources":["../../../src/expressiveMoneyInput/hooks/useInputStyle.ts"],"sourcesContent":["import { type CSSProperties, useEffect, useLayoutEffect, useState } from 'react';\nimport { Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\n\ntype InputStyleObject = {\n value: string;\n focus: boolean;\n inputElement: HTMLInputElement \| null;\n} & Pick<ExpressiveMoneyInputProps, 'loading'>;\n\nexport const useInputStyle = ({ value, focus, inputElement, loading }: InputStyleObject) => {\n const initialRender = !useTimeout(300);\n const inputWidth = useFirstDefinedValue(inputElement?.clientWidth, [inputElement, value]);\n\n const getStyle = (): CSSProperties => {\n const fontSize = getFontSize(value, focus, inputWidth);\n\n return {\n fontSize,\n height: fontSize,\n // aligns the top of the digit with the currency button\n marginTop: fontSize * -0.19,\n // if the input loads with a pre-filled value, we don't want to animate the font-size immediately\n transition: initialRender ? 'none' : undefined,\n color: loading ? 'var(--color-interactive-secondary)' : undefined,\n };\n };\n\n const [style, setStyle] = useState(getStyle());\n\n useLayoutEffect(() => {\n setStyle(getStyle());\n }, [value, focus, loading, inputWidth]);\n\n return style;\n};\n\nfunction getFontSize(inputValue: string, isFocused: boolean, inputWidth: number \| undefined) {\n const defaultFontSize = 52;\n const focusFontSize = 90;\n const minimumFontSize = 34;\n\n let fontSize = isFocused ? focusFontSize : defaultFontSize;\n\n if (typeof inputWidth === 'undefined') {\n return fontSize;\n }\n const textLength = inputValue.length;\n const maxCharactersWithoutShrinking = Math.floor(inputWidth / 40);\n\n if (textLength > maxCharactersWithoutShrinking) {\n const adjustedSize = Math.round((inputWidth / textLength) * 1.9);\n fontSize = Math.min(fontSize, adjustedSize);\n }\n\n return Math.max(fontSize, minimumFontSize);\n}\n\nconst useFirstDefinedValue = (newValue: number \| undefined, dependencies: unknown[]) => {\n const [value, setValue] = useState<number \| undefined>(newValue);\n\n useLayoutEffect(() => {\n if (typeof newValue !== 'undefined' && typeof value === 'undefined') {\n setValue(newValue);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [...dependencies, value]);\n\n return value;\n};\n\nconst useTimeout = (delay: number) => {\n const [ready, setReady] = useState(false);\n\n useEffect(() => {\n const timeout = setTimeout(() => {\n setReady(true);\n }, delay);\n\n return () => {\n clearTimeout(timeout);\n };\n }, [delay]);\n\n return ready;\n};\n"],"names":["useInputStyle","value","focus","inputElement","loading","initialRender","useTimeout","inputWidth","useFirstDefinedValue","clientWidth","getStyle","fontSize","getFontSize","height","marginTop","transition","undefined","color","style","setStyle","useState","useLayoutEffect","inputValue","isFocused","defaultFontSize","focusFontSize","minimumFontSize","textLength","length","maxCharactersWithoutShrinking","Math","floor","adjustedSize","round","min","max","newValue","dependencies","setValue","delay","ready","setReady","useEffect","timeout","setTimeout","clearTimeout"],"mappings":";;AASO,MAAMA,aAAa,GAAGA,CAAC;EAAEC,KAAK;EAAEC,KAAK;EAAEC,YAAY;AAAEC,EAAAA;~~AAA0B~~,~~CAAC~~,~~KAAK~~;~~AAC1F~~,EAAA,MAAMC,aAAa,GAAG,CAACC,UAAU,CAAC,GAAG,CAAC;AACtC,EAAA,MAAMC,UAAU,GAAGC,oBAAoB,CAACL,YAAY,EAAEM,WAAW,EAAE,CAACN,YAAY,EAAEF,KAAK,CAAC,CAAC;EAEzF,MAAMS,QAAQ,GAAGA,~~MAAqB~~;~~IACpC~~,MAAMC,QAAQ,GAAGC,WAAW,CAACX,KAAK,EAAEC,KAAK,EAAEK,UAAU,CAAC;IAEtD,OAAO;MACLI,QAAQ;AACRE,MAAAA,MAAM,EAAEF,QAAQ;AAChB;AACAG,MAAAA,SAAS,EAAEH,QAAQ,GAAG,KAAK;AAC3B;AACAI,MAAAA,UAAU,EAAEV,aAAa,GAAG,MAAM,GAAGW,SAAS;AAC9CC,MAAAA,KAAK,EAAEb,OAAO,GAAG,oCAAoC,GAAGY;KACzD;EACH,CAAC;EAED,MAAM,CAACE,KAAK,EAAEC,QAAQ,CAAC,GAAGC,QAAQ,CAACV,QAAQ,EAAE,CAAC;AAE9CW,EAAAA,eAAe,CAAC,~~MAAM~~;~~AACpBF~~,IAAAA,QAAQ,CAACT,QAAQ,EAAE,CAAC;EACtB,CAAC,EAAE,CAACT,KAAK,EAAEC,KAAK,EAAEE,OAAO,EAAEG,UAAU,CAAC,CAAC;AAEvC,EAAA,OAAOW,KAAK;AACd;AAEA,SAASN,WAAWA,CAACU,UAAkB,EAAEC,SAAkB,EAAEhB,UAA8B,~~EAAE~~;~~EAC3F~~,MAAMiB,eAAe,GAAG,EAAE;EAC1B,MAAMC,aAAa,GAAG,EAAE;EACxB,MAAMC,eAAe,GAAG,EAAE;AAE1B,EAAA,IAAIf,QAAQ,GAAGY,SAAS,GAAGE,aAAa,GAAGD,eAAe;AAE1D,EAAA,IAAI,OAAOjB,UAAU,KAAK,WAAW,EAAE;AACrC,IAAA,OAAOI,QAAQ;AACjB,EAAA;AACA,EAAA,MAAMgB,UAAU,GAAGL,UAAU,CAACM,MAAM;EACpC,MAAMC,6BAA6B,GAAGC,IAAI,CAACC,KAAK,CAACxB,UAAU,GAAG,EAAE,CAAC;EAEjE,IAAIoB,UAAU,GAAGE,6BAA6B,EAAE;IAC9C,MAAMG,YAAY,GAAGF,IAAI,CAACG,KAAK,CAAE1B,UAAU,GAAGoB,UAAU,GAAI,GAAG,CAAC;IAChEhB,QAAQ,GAAGmB,IAAI,CAACI,GAAG,CAACvB,QAAQ,EAAEqB,YAAY,CAAC;AAC7C,EAAA;AAEA,EAAA,OAAOF,IAAI,CAACK,GAAG,CAACxB,QAAQ,EAAEe,eAAe,CAAC;AAC5C;AAEA,MAAMlB,oBAAoB,GAAGA,CAAC4B,QAA4B,EAAEC,YAAuB,~~KAAK~~;~~EACtF~~,MAAM,CAACpC,KAAK,EAAEqC,QAAQ,CAAC,GAAGlB,QAAQ,CAAqBgB,QAAQ,CAAC;AAEhEf,EAAAA,eAAe,CAAC,~~MAAM~~;~~IACpB~~,IAAI,OAAOe,QAAQ,KAAK,WAAW,IAAI,OAAOnC,KAAK,KAAK,WAAW,EAAE;MACnEqC,QAAQ,CAACF,QAAQ,CAAC;AACpB,IAAA;AACA;AACF,EAAA,CAAC,EAAE,CAAC,GAAGC,YAAY,EAAEpC,KAAK,CAAC,CAAC;AAE5B,EAAA,OAAOA,KAAK;AACd,CAAC;AAED,MAAMK,UAAU,GAAIiC,KAAa,~~IAAK~~;~~EACpC~~,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGrB,QAAQ,CAAC,KAAK,CAAC;AAEzCsB,EAAAA,SAAS,CAAC,~~MAAM~~;~~AACd~~,IAAA,MAAMC,OAAO,GAAGC,UAAU,CAAC,~~MAAM~~;~~MAC/BH~~,QAAQ,CAAC,IAAI,CAAC;IAChB,CAAC,EAAEF,KAAK,CAAC;AAET,IAAA,OAAO,~~MAAM~~;~~MACXM~~,YAAY,CAACF,OAAO,CAAC;IACvB,CAAC;AACH,EAAA,CAAC,EAAE,CAACJ,KAAK,CAAC,CAAC;AAEX,EAAA,OAAOC,KAAK;AACd,CAAC;;;;"}
1	+ {"version":3,"file":"useInputStyle.mjs","sources":["../../../src/expressiveMoneyInput/hooks/useInputStyle.ts"],"sourcesContent":["import { type CSSProperties, useEffect, useLayoutEffect, useState } from 'react';\nimport { Props as ExpressiveMoneyInputProps } from '../ExpressiveMoneyInput';\n\ntype InputStyleObject = {\n value: string;\n focus: boolean;\n inputElement: HTMLInputElement \| null;\n} & Pick<ExpressiveMoneyInputProps, 'loading'>;\n\nexport const useInputStyle = ({ value, focus, inputElement, loading }: InputStyleObject) => {\n const initialRender = !useTimeout(300);\n const inputWidth = useFirstDefinedValue(inputElement?.clientWidth, [inputElement, value]);\n\n const getStyle = (): CSSProperties => {\n const fontSize = getFontSize(value, focus, inputWidth);\n\n return {\n fontSize,\n height: fontSize,\n // aligns the top of the digit with the currency button\n marginTop: fontSize * -0.19,\n // if the input loads with a pre-filled value, we don't want to animate the font-size immediately\n transition: initialRender ? 'none' : undefined,\n color: loading ? 'var(--color-interactive-secondary)' : undefined,\n };\n };\n\n const [style, setStyle] = useState(getStyle());\n\n useLayoutEffect(() => {\n setStyle(getStyle());\n }, [value, focus, loading, inputWidth]);\n\n return style;\n};\n\nfunction getFontSize(inputValue: string, isFocused: boolean, inputWidth: number \| undefined) {\n const defaultFontSize = 52;\n const focusFontSize = 90;\n const minimumFontSize = 34;\n\n let fontSize = isFocused ? focusFontSize : defaultFontSize;\n\n if (typeof inputWidth === 'undefined') {\n return fontSize;\n }\n const textLength = inputValue.length;\n const maxCharactersWithoutShrinking = Math.floor(inputWidth / 40);\n\n if (textLength > maxCharactersWithoutShrinking) {\n const adjustedSize = Math.round((inputWidth / textLength) * 1.9);\n fontSize = Math.min(fontSize, adjustedSize);\n }\n\n return Math.max(fontSize, minimumFontSize);\n}\n\nconst useFirstDefinedValue = (newValue: number \| undefined, dependencies: unknown[]) => {\n const [value, setValue] = useState<number \| undefined>(newValue);\n\n useLayoutEffect(() => {\n if (typeof newValue !== 'undefined' && typeof value === 'undefined') {\n setValue(newValue);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [...dependencies, value]);\n\n return value;\n};\n\nconst useTimeout = (delay: number) => {\n const [ready, setReady] = useState(false);\n\n useEffect(() => {\n const timeout = setTimeout(() => {\n setReady(true);\n }, delay);\n\n return () => {\n clearTimeout(timeout);\n };\n }, [delay]);\n\n return ready;\n};\n"],"names":["useInputStyle","value","focus","inputElement","loading","initialRender","useTimeout","inputWidth","useFirstDefinedValue","clientWidth","getStyle","fontSize","getFontSize","height","marginTop","transition","undefined","color","style","setStyle","useState","useLayoutEffect","inputValue","isFocused","defaultFontSize","focusFontSize","minimumFontSize","textLength","length","maxCharactersWithoutShrinking","Math","floor","adjustedSize","round","min","max","newValue","dependencies","setValue","delay","ready","setReady","useEffect","timeout","setTimeout","clearTimeout"],"mappings":"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"}

package/build/field/Field.js CHANGED Viewed

@@ -2,7 +2,25 @@
 var clsx = require('clsx');
 var React = require('react');
+require('../common/theme.js');
+require('../common/direction.js');
+require('../common/propsValues/control.js');
+require('../common/propsValues/breakpoint.js');
+require('../common/propsValues/size.js');
+require('../common/propsValues/typography.js');
+require('../common/propsValues/width.js');
+require('../common/propsValues/type.js');
+require('../common/propsValues/dateMode.js');
+require('../common/propsValues/monthFormat.js');
+require('../common/propsValues/position.js');
+require('../common/propsValues/layouts.js');
+require('../common/propsValues/status.js');
 var sentiment = require('../common/propsValues/sentiment.js');
+require('../common/propsValues/profileType.js');
+require('../common/propsValues/variant.js');
+require('../common/propsValues/scroll.js');
+require('../common/propsValues/markdownNodeType.js');
+require('../common/fileType.js');
 require('@transferwise/icons');
 require('react-intl');
 require('../common/closeButton/CloseButton.messages.js');
@@ -34,7 +52,6 @@ const Field = ({
   const inputId = id !== null ? id ?? fallbackInputId : undefined;
   const messageId = React.useId();
   const descriptionId = React.useId();
   /**
    * form control can have multiple messages to describe it,
    * e.g the description underneath the label and inline alert