npm - @adyen/adyen-web - Versions diffs - 6.38.0 → 6.40.0 - Mend

@adyen/adyen-web 6.38.0 → 6.40.0

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 (180) hide show

package/dist/es/components/internal/FormFields/Select/Select.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.js","sources":["../../../../../../src/components/internal/FormFields/Select/Select.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useMemo, useRef, useState } from 'preact/hooks';\nimport cx from 'classnames';\nimport SelectButton from './components/SelectButton';\nimport SelectList from './components/SelectList';\nimport uuid from '../../../../utils/uuid';\nimport { keys } from './constants';\nimport { SelectItem, SelectProps } from './types';\nimport './Select.scss';\nimport { ARIA_CONTEXT_SUFFIX, ARIA_ERROR_SUFFIX } from '../../../../core/Errors/constants';\nimport { simulateFocusScroll } from '../utils';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\n\nfunction Select({\n items = [],\n className = '',\n classNameModifiers = [],\n filterable = true,\n readonly = false,\n onChange = () => {},\n onInput,\n selectedValue,\n name,\n isInvalid,\n isValid,\n placeholder,\n uniqueId,\n disabled,\n disableTextFilter,\n clearOnSelect,\n blurOnClose,\n onListToggle,\n required\n}: Readonly<SelectProps>) {\n const { i18n } = useCoreContext();\n const filterInputRef = useRef(null);\n const selectContainerRef = useRef(null);\n const toggleButtonRef = useRef(null);\n const selectListRef = useRef(null);\n const [textFilter, setTextFilter] = useState<string>(null);\n const [showList, setShowList] = useState<boolean>(false);\n const [statusMessage, setStatusMessage] = useState<string>(null);\n const selectListId: string = useMemo(() => `select-${uuid()}`, []);\n\n const active: SelectItem = items.find(i => i.id === selectedValue) \|\| ({} as SelectItem);\n\n const [inputText, setInputText] = useState<string>();\n\n const [activeOption, setActiveOption] = useState<SelectItem>(active);\n\n const selectedOption = active;\n\n const filteredItems = disableTextFilter ? items : items.filter(item => !textFilter \|\| item.name.toLowerCase().includes(textFilter.toLowerCase()));\n\n const suffix = isInvalid ? ARIA_ERROR_SUFFIX : ARIA_CONTEXT_SUFFIX;\n const ariaDescribedBy = uniqueId ? `${uniqueId}${suffix}` : null;\n\n const setNextActive = () => {\n if (!filteredItems \|\| filteredItems.length < 1) return;\n const possibleNextIndex = filteredItems.findIndex(listItem => listItem === activeOption) + 1;\n const nextIndex = possibleNextIndex < filteredItems.length ? possibleNextIndex : 0;\n const nextItem = filteredItems[nextIndex];\n scrollToItem(nextItem);\n setActiveOption(nextItem);\n };\n\n const setPreviousActive = () => {\n if (!filteredItems \|\| filteredItems.length < 1) return;\n const possibleNextIndex = filteredItems.findIndex(listItem => listItem === activeOption) - 1;\n const nextIndex = possibleNextIndex < 0 ? filteredItems.length - 1 : possibleNextIndex;\n const nextItem = filteredItems[nextIndex];\n scrollToItem(nextItem);\n setActiveOption(nextItem);\n };\n\n const scrollToItem = (item: SelectItem) => {\n if (!item) return;\n const nextElement = document.getElementById(`listItem-${item.id}`);\n simulateFocusScroll(nextElement);\n };\n\n /*\n Closes the selectList, empties the text filter and focuses the button element\n /\n const closeList = () => {\n //blurs the field when the list is closed, makes for a better UX for most users, needs more testing\n blurOnClose && filterInputRef.current.blur();\n setShowList(false);\n };\n\n const openList = () => {\n setShowList(true);\n };\n\n const extractItemFromEvent = (e: Event): SelectItem => {\n const value = (e.currentTarget as HTMLInputElement).getAttribute('data-value');\n return filteredItems.find(listItem => listItem.id == value);\n };\n\n /\n Closes the select list and fires an onChange\n * @param e - Event\n /\n const handleSelect = (e: Event) => {\n e.preventDefault();\n\n // We use a local variable here since writing and if statement is cleaner then a long ternary\n let valueToEmit;\n\n if (e.currentTarget instanceof HTMLElement && e.currentTarget.getAttribute('role') === 'option') {\n // This is the main scenario when clicking and item in the list\n // Item comes from the event\n valueToEmit = extractItemFromEvent(e);\n } else if (activeOption.id && filteredItems.some(item => item.id === activeOption.id)) {\n // This is the scenario where a user is using the keyboard to navigate\n // In the case item comes from the visually select item\n valueToEmit = activeOption;\n } else {\n // This is the scenario the user didn't select anything\n if (textFilter) {\n // if we filtering for something then select the first option\n valueToEmit = filteredItems[0];\n } else {\n // This will happen when we want to keep an already chosen option\n // If no active option we should just emit again with the value that was already selected\n valueToEmit = { id: selectedValue };\n }\n }\n\n if (valueToEmit && !valueToEmit.disabled) {\n onChange({ target: { value: valueToEmit.id, name: name } });\n\n if (clearOnSelect) setInputText(null);\n\n closeList();\n }\n };\n\n /\n Handles hovering and directions\n * @param e - Event\n /\n const handleHover = (e: Event) => {\n e.preventDefault();\n const item = extractItemFromEvent(e);\n setActiveOption(item);\n };\n\n /\n Handle keyDown events on the selectList button\n * Responsible for opening and closing the list\n * @param e - KeyboardEvent\n /\n const handleButtonKeyDown = (e: KeyboardEvent) => {\n if (e.key === keys.enter && filterable && showList && textFilter) {\n handleSelect(e);\n } else if (e.key === keys.escape) {\n // When user has focused Select button but not yet moved into Select list - close list and keep focus on the Select Button re. a11y guidelines\n // https://w3c.github.io/aria-practices/examples/disclosure/disclosure-navigation.html\n closeList();\n } else if ([keys.arrowUp, keys.arrowDown, keys.enter].includes(e.key) \|\| (e.key === keys.space && (!filterable \|\| !showList))) {\n e.preventDefault();\n if (!showList) {\n openList();\n } else {\n handleNavigationKeys(e);\n }\n } else if (e.shiftKey && e.key === keys.tab) {\n // Shift-Tab out of Select - close list re. a11y guidelines (above)\n closeList();\n } else if (e.key === keys.tab) {\n closeList();\n }\n };\n\n /\n Handles movement with navigation keys and enter\n * Navigates through the list, or select an element, or focus the filter input, or close the menu.\n * @param e - KeyDownEvent\n /\n const handleNavigationKeys = (e: KeyboardEvent) => {\n switch (e.key) {\n case keys.space:\n case keys.enter:\n handleSelect(e);\n break;\n case keys.arrowDown:\n e.preventDefault();\n setNextActive();\n break;\n case keys.arrowUp:\n e.preventDefault();\n setPreviousActive();\n break;\n default:\n }\n };\n\n /\n Updates the state with the current text filter value and opens the dropdown\n * @param e - KeyboardEvent\n /\n const handleTextFilter = (e: KeyboardEvent) => {\n const value: string = (e.target as HTMLInputElement).value;\n setInputText(value);\n setTextFilter(value);\n\n // Open the dropdown when user starts typing\n if (!showList) {\n openList();\n }\n\n if (onInput) {\n onInput(value);\n }\n };\n\n /\n Toggles the selectList and focuses in either the filter input or in the selectList button\n * @param e - Event\n /\n const toggleList = (e: Event) => {\n e.preventDefault();\n if (!showList) {\n setInputText(null);\n openList();\n } else {\n setInputText(selectedOption.name);\n closeList();\n }\n };\n\n useEffect(() => {\n if (showList) {\n setInputText(null);\n } else {\n setTextFilter(null);\n }\n }, [showList]);\n\n /\n Focus on the input if filterable\n /\n useEffect(() => {\n if (showList && filterable && filterInputRef.current) {\n filterInputRef.current.focus();\n }\n onListToggle?.(showList);\n }, [showList]);\n\n useEffect(() => {\n /\n Close the select list when clicking outside the list\n * @param e - MouseEvent\n /\n function handleClickOutside(e: MouseEvent) {\n // use composedPath so it can also check when inside a web component\n // if composedPath is not available fallback to e.target\n const clickIsOutside = e.composedPath\n ? !e.composedPath().includes(selectContainerRef.current)\n : !selectContainerRef.current.contains(e.target);\n if (clickIsOutside) {\n closeList();\n }\n }\n\n document.addEventListener('click', handleClickOutside, false);\n\n return () => {\n document.removeEventListener('click', handleClickOutside, false);\n };\n }, [selectContainerRef]);\n\n /\n Update status message for screen readers when no options are found\n */\n useEffect(() => {\n if (showList && filteredItems.length === 0) {\n setStatusMessage(i18n.get('select.noOptionsFound'));\n } else {\n setStatusMessage(null);\n }\n }, [showList, filteredItems.length, i18n]);\n\n return (\n <div\n className={cx(['adyen-checkout__dropdown', className, ...classNameModifiers.map(m => `adyen-checkout__dropdown--${m}`)])}\n ref={selectContainerRef}\n >\n <SelectButton\n inputText={inputText}\n id={uniqueId ?? null}\n active={activeOption}\n selected={selectedOption}\n filterInputRef={filterInputRef}\n filterable={filterable}\n isInvalid={isInvalid}\n isValid={isValid}\n onButtonKeyDown={handleButtonKeyDown}\n onInput={handleTextFilter}\n placeholder={placeholder}\n readonly={readonly}\n selectListId={selectListId}\n showList={showList}\n toggleButtonRef={toggleButtonRef}\n toggleList={toggleList}\n disabled={disabled}\n ariaDescribedBy={ariaDescribedBy}\n required={required}\n />\n <SelectList\n active={activeOption}\n filteredItems={filteredItems}\n onHover={handleHover}\n onSelect={handleSelect}\n selected={selectedOption}\n selectListId={selectListId}\n selectListRef={selectListRef}\n showList={showList}\n />\n <div\n role=\"status\"\n aria-live=\"polite\"\n // aria-relevant seems to be needed here make make sure a second time we get\n // \"No options found\" we still announce the status message.\n // What happens otherwise is that just the first status message is announced\n // tested on VoiceOver on Chrome\n aria-relevant=\"all\"\n className=\"adyen-checkout-sr-panel--sr-only\"\n >\n {statusMessage}\n </div>\n </div>\n );\n}\n\nSelect.defaultProps = {\n className: '',\n classNameModifiers: [],\n filterable: true,\n items: [],\n readonly: false,\n onChange: () => {}\n};\n\nexport default Select;\n"],"names":["Select","items","className","classNameModifiers","filterable","readonly","onChange","onInput","selectedValue","name","isInvalid","isValid","placeholder","uniqueId","disabled","disableTextFilter","clearOnSelect","blurOnClose","onListToggle","required","i18n","useCoreContext","filterInputRef","useRef","selectContainerRef","toggleButtonRef","selectListRef","textFilter","setTextFilter","useState","showList","setShowList","statusMessage","setStatusMessage","selectListId","useMemo","uuid","active","find","i","id","inputText","setInputText","activeOption","setActiveOption","selectedOption","filteredItems","filter","item","toLowerCase","includes","ariaDescribedBy","ARIA_ERROR_SUFFIX","ARIA_CONTEXT_SUFFIX","scrollToItem","nextElement","document","getElementById","simulateFocusScroll","closeList","current","blur","openList","extractItemFromEvent","e","value","currentTarget","getAttribute","listItem","handleSelect","valueToEmit","preventDefault","HTMLElement","some","target","handleNavigationKeys","key","keys","space","enter","arrowDown","length","possibleNextIndex","findIndex","nextIndex","nextItem","setNextActive","arrowUp","setPreviousActive","useEffect","focus","handleClickOutside","composedPath","contains","addEventListener","removeEventListener","get","h","div","cx","map","m","ref","SelectButton","selected","onButtonKeyDown","escape","shiftKey","tab","toggleList","SelectList","onHover","onSelect","role","aria-live","aria-relevant","defaultProps"],"mappings":"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"}
1	+ {"version":3,"file":"Select.js","sources":["../../../../../../src/components/internal/FormFields/Select/Select.tsx"],"sourcesContent":["import { h } from 'preact';\nimport { useEffect, useMemo, useRef, useState } from 'preact/hooks';\nimport cx from 'classnames';\nimport SelectButton from './components/SelectButton';\nimport SelectList from './components/SelectList';\nimport uuid from '../../../../utils/uuid';\nimport { keys } from './constants';\nimport { SelectItem, SelectProps } from './types';\nimport './Select.scss';\nimport { ARIA_CONTEXT_SUFFIX, ARIA_ERROR_SUFFIX } from '../../../../core/Errors/constants';\nimport { simulateFocusScroll } from '../utils';\nimport { useCoreContext } from '../../../../core/Context/CoreProvider';\n\nfunction Select({\n items = [],\n className = '',\n classNameModifiers = [],\n filterable = true,\n readonly = false,\n onChange = () => {},\n onInput,\n selectedValue,\n name,\n isInvalid,\n isValid,\n placeholder,\n uniqueId,\n disabled,\n disableTextFilter,\n clearOnSelect,\n blurOnClose,\n onListToggle,\n required\n}: Readonly<SelectProps>) {\n const { i18n } = useCoreContext();\n const filterInputRef = useRef(null);\n const selectContainerRef = useRef(null);\n const toggleButtonRef = useRef(null);\n const selectListRef = useRef(null);\n const [textFilter, setTextFilter] = useState<string>(null);\n const [showList, setShowList] = useState<boolean>(false);\n const [statusMessage, setStatusMessage] = useState<string \| null>(null);\n const selectListId: string = useMemo(() => `select-${uuid()}`, []);\n\n const active: SelectItem = items.find(i => i.id === selectedValue) \|\| ({} as SelectItem);\n\n const [inputText, setInputText] = useState<string>();\n\n const [activeOption, setActiveOption] = useState<SelectItem>(active);\n\n const selectedOption = active;\n\n const filteredItems = disableTextFilter ? items : items.filter(item => !textFilter \|\| item.name.toLowerCase().includes(textFilter.toLowerCase()));\n\n const suffix = isInvalid ? ARIA_ERROR_SUFFIX : ARIA_CONTEXT_SUFFIX;\n const ariaDescribedBy = uniqueId ? `${uniqueId}${suffix}` : null;\n\n const setNextActive = () => {\n if (!filteredItems \|\| filteredItems.length < 1) return;\n const possibleNextIndex = filteredItems.findIndex(listItem => listItem === activeOption) + 1;\n const nextIndex = possibleNextIndex < filteredItems.length ? possibleNextIndex : 0;\n const nextItem = filteredItems[nextIndex];\n scrollToItem(nextItem);\n setActiveOption(nextItem);\n };\n\n const setPreviousActive = () => {\n if (!filteredItems \|\| filteredItems.length < 1) return;\n const possibleNextIndex = filteredItems.findIndex(listItem => listItem === activeOption) - 1;\n const nextIndex = possibleNextIndex < 0 ? filteredItems.length - 1 : possibleNextIndex;\n const nextItem = filteredItems[nextIndex];\n scrollToItem(nextItem);\n setActiveOption(nextItem);\n };\n\n const scrollToItem = (item: SelectItem) => {\n if (!item) return;\n const nextElement = document.getElementById(`listItem-${item.id}`);\n simulateFocusScroll(nextElement);\n };\n\n /*\n Closes the selectList, empties the text filter and focuses the button element\n /\n const closeList = () => {\n //blurs the field when the list is closed, makes for a better UX for most users, needs more testing\n if (blurOnClose) {\n filterInputRef.current.blur();\n }\n setShowList(false);\n };\n\n const openList = () => {\n setShowList(true);\n };\n\n const extractItemFromEvent = (e: Event): SelectItem => {\n const value = (e.currentTarget as HTMLInputElement).getAttribute('data-value');\n return filteredItems.find(listItem => listItem.id == value);\n };\n\n /\n Closes the select list and fires an onChange\n * @param e - Event\n /\n const handleSelect = (e: Event) => {\n e.preventDefault();\n\n // We use a local variable here since writing and if statement is cleaner then a long ternary\n let valueToEmit;\n\n if (e.currentTarget instanceof HTMLElement && e.currentTarget.getAttribute('role') === 'option') {\n // This is the main scenario when clicking and item in the list\n // Item comes from the event\n valueToEmit = extractItemFromEvent(e);\n } else if (activeOption.id && filteredItems.some(item => item.id === activeOption.id)) {\n // This is the scenario where a user is using the keyboard to navigate\n // In the case item comes from the visually select item\n valueToEmit = activeOption;\n } else {\n // This is the scenario the user didn't select anything\n if (textFilter) {\n // if we filtering for something then select the first option\n valueToEmit = filteredItems[0];\n } else {\n // This will happen when we want to keep an already chosen option\n // If no active option we should just emit again with the value that was already selected\n valueToEmit = { id: selectedValue };\n }\n }\n\n if (valueToEmit && !valueToEmit.disabled) {\n onChange({ target: { value: valueToEmit.id, name: name } });\n\n if (clearOnSelect) setInputText(null);\n\n closeList();\n }\n };\n\n /\n Handles hovering and directions\n * @param e - Event\n /\n const handleHover = (e: Event) => {\n e.preventDefault();\n const item = extractItemFromEvent(e);\n setActiveOption(item);\n };\n\n /\n Handle keyDown events on the selectList button\n * Responsible for opening and closing the list\n * @param e - KeyboardEvent\n /\n const handleButtonKeyDown = (e: KeyboardEvent) => {\n if (e.key === keys.enter && filterable && showList && textFilter) {\n handleSelect(e);\n } else if (e.key === keys.escape) {\n // When user has focused Select button but not yet moved into Select list - close list and keep focus on the Select Button re. a11y guidelines\n // https://w3c.github.io/aria-practices/examples/disclosure/disclosure-navigation.html\n closeList();\n } else if ([keys.arrowUp, keys.arrowDown, keys.enter].includes(e.key) \|\| (e.key === keys.space && (!filterable \|\| !showList))) {\n e.preventDefault();\n if (!showList) {\n openList();\n } else {\n handleNavigationKeys(e);\n }\n } else if (e.shiftKey && e.key === keys.tab) {\n // Shift-Tab out of Select - close list re. a11y guidelines (above)\n closeList();\n } else if (e.key === keys.tab) {\n closeList();\n }\n };\n\n /\n Handles movement with navigation keys and enter\n * Navigates through the list, or select an element, or focus the filter input, or close the menu.\n * @param e - KeyDownEvent\n /\n const handleNavigationKeys = (e: KeyboardEvent) => {\n switch (e.key) {\n case keys.space:\n case keys.enter:\n handleSelect(e);\n break;\n case keys.arrowDown:\n e.preventDefault();\n setNextActive();\n break;\n case keys.arrowUp:\n e.preventDefault();\n setPreviousActive();\n break;\n default:\n }\n };\n\n /\n Updates the state with the current text filter value and opens the dropdown\n * @param e - KeyboardEvent\n /\n const handleTextFilter = (e: KeyboardEvent) => {\n const value: string = (e.target as HTMLInputElement).value;\n setInputText(value);\n setTextFilter(value);\n\n // Open the dropdown when user starts typing\n if (!showList) {\n openList();\n }\n\n if (onInput) {\n onInput(value);\n }\n };\n\n /\n Toggles the selectList and focuses in either the filter input or in the selectList button\n * @param e - Event\n /\n const toggleList = (e: Event) => {\n e.preventDefault();\n if (!showList) {\n setInputText(null);\n openList();\n } else {\n setInputText(selectedOption.name);\n closeList();\n }\n };\n\n useEffect(() => {\n if (showList) {\n setInputText(null);\n } else {\n setTextFilter(null);\n }\n }, [showList]);\n\n /\n Focus on the input if filterable\n /\n useEffect(() => {\n if (showList && filterable && filterInputRef.current) {\n filterInputRef.current.focus();\n }\n onListToggle?.(showList);\n }, [showList]);\n\n useEffect(() => {\n /\n Close the select list when clicking outside the list\n * @param e - MouseEvent\n /\n function handleClickOutside(e: MouseEvent) {\n // use composedPath so it can also check when inside a web component\n // if composedPath is not available fallback to e.target\n const clickIsOutside = e.composedPath\n ? !e.composedPath().includes(selectContainerRef.current)\n : !selectContainerRef.current.contains(e.target);\n if (clickIsOutside) {\n closeList();\n }\n }\n\n document.addEventListener('click', handleClickOutside, false);\n\n return () => {\n document.removeEventListener('click', handleClickOutside, false);\n };\n }, [selectContainerRef]);\n\n /\n Update status message for screen readers when no options are found\n */\n useEffect(() => {\n // Debounce to avoid announcing on every keystroke\n const SR_ANNOUNCEMENT_DELAY_MS = 500;\n const timer = setTimeout(() => {\n if (filteredItems.length === 0) {\n setStatusMessage(i18n.get('select.noOptionsFound'));\n } else {\n setStatusMessage(i18n.get('select.results', { values: { count: filteredItems.length } }));\n }\n }, SR_ANNOUNCEMENT_DELAY_MS);\n\n return () => clearTimeout(timer);\n }, [showList, filteredItems.length, i18n]);\n\n return (\n <div\n className={cx(['adyen-checkout__dropdown', className, ...classNameModifiers.map(m => `adyen-checkout__dropdown--${m}`)])}\n ref={selectContainerRef}\n >\n <SelectButton\n inputText={inputText}\n id={uniqueId ?? null}\n active={activeOption}\n selected={selectedOption}\n filterInputRef={filterInputRef}\n filterable={filterable}\n isInvalid={isInvalid}\n isValid={isValid}\n onButtonKeyDown={handleButtonKeyDown}\n onInput={handleTextFilter}\n placeholder={placeholder}\n readonly={readonly}\n selectListId={selectListId}\n showList={showList}\n toggleButtonRef={toggleButtonRef}\n toggleList={toggleList}\n disabled={disabled}\n ariaDescribedBy={ariaDescribedBy}\n required={required}\n />\n <SelectList\n active={activeOption}\n filteredItems={filteredItems}\n onHover={handleHover}\n onSelect={handleSelect}\n selected={selectedOption}\n selectListId={selectListId}\n selectListRef={selectListRef}\n showList={showList}\n />\n <div\n key={inputText}\n role=\"status\"\n aria-live=\"polite\"\n // aria-relevant seems to be needed here make make sure a second time we get\n // \"No options found\" we still announce the status message.\n // What happens otherwise is that just the first status message is announced\n // tested on VoiceOver on Chrome\n aria-relevant=\"additions text\"\n className=\"adyen-checkout-sr-panel--sr-only\"\n >\n {statusMessage}\n </div>\n </div>\n );\n}\n\nSelect.defaultProps = {\n className: '',\n classNameModifiers: [],\n filterable: true,\n items: [],\n readonly: false,\n onChange: () => {}\n};\n\nexport default Select;\n"],"names":["Select","items","className","classNameModifiers","filterable","readonly","onChange","onInput","selectedValue","name","isInvalid","isValid","placeholder","uniqueId","disabled","disableTextFilter","clearOnSelect","blurOnClose","onListToggle","required","i18n","useCoreContext","filterInputRef","useRef","selectContainerRef","toggleButtonRef","selectListRef","textFilter","setTextFilter","useState","showList","setShowList","statusMessage","setStatusMessage","selectListId","useMemo","uuid","active","find","i","id","inputText","setInputText","activeOption","setActiveOption","selectedOption","filteredItems","filter","item","toLowerCase","includes","ariaDescribedBy","ARIA_ERROR_SUFFIX","ARIA_CONTEXT_SUFFIX","scrollToItem","nextElement","document","getElementById","simulateFocusScroll","closeList","current","blur","openList","extractItemFromEvent","e","value","currentTarget","getAttribute","listItem","handleSelect","valueToEmit","preventDefault","HTMLElement","some","target","handleNavigationKeys","key","keys","space","enter","arrowDown","length","possibleNextIndex","findIndex","nextIndex","nextItem","setNextActive","arrowUp","setPreviousActive","useEffect","focus","handleClickOutside","composedPath","contains","addEventListener","removeEventListener","timer","setTimeout","get","values","count","clearTimeout","h","div","cx","map","m","ref","SelectButton","selected","onButtonKeyDown","escape","shiftKey","tab","toggleList","SelectList","onHover","onSelect","role","aria-live","aria-relevant","defaultProps"],"mappings":"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"}

package/dist/es/components/internal/FormFields/Select/components/SelectList.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../../../external/preact/dist/preact.js";import t from"../../../../../_virtual/index.js";import o from"./SelectListItem.js";import{useCoreContext as i}from"../../../../../core/Context/CoreProvider.js";function n({selected:n,active:r,filteredItems:d,showList:s,...c}){const{i18n:l}=i();return e("ul",{className:t({"adyen-checkout__dropdown__list":!0,"adyen-checkout__dropdown__list--active":s}),id:c.selectListId,ref:c.selectListRef,role:"listbox"},d.length?d.map(t=>e(o,{active:t.id===r.id,item:t,key:t.id,onSelect:c.onSelect,onHover:c.onHover,selected:t.id===n.id})):e("div",{className:"adyen-checkout__dropdown__element adyen-checkout__dropdown__element--no-options"},l.get("select.noOptionsFound")))}export{n as default};
+import{createElement as e}from"../../../../../external/preact/dist/preact.js";import t from"../../../../../_virtual/index.js";import o from"./SelectListItem.js";import{useCoreContext as i}from"../../../../../core/Context/CoreProvider.js";function n({selected:n,active:r,filteredItems:d,showList:s,...c}){const{i18n:l}=i();return e("ul",{className:t({"adyen-checkout__dropdown__list":!0,"adyen-checkout__dropdown__list--active":s}),id:c.selectListId,ref:c.selectListRef,role:"listbox"},d.length?d.map(t=>e(o,{active:t.id===r.id,item:t,key:t.id,onSelect:c.onSelect,onHover:c.onHover,selected:t.id===n.id})):e("li",null,e("div",{className:"adyen-checkout__dropdown__element adyen-checkout__dropdown__element--no-options"},l.get("select.noOptionsFound"))))}export{n as default};
 //# sourceMappingURL=SelectList.js.map

package/dist/es/components/internal/FormFields/Select/components/SelectList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectList.js","sources":["../../../../../../../src/components/internal/FormFields/Select/components/SelectList.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\nimport SelectListItem from './SelectListItem';\nimport { useCoreContext } from '../../../../../core/Context/CoreProvider';\nimport { SelectListProps } from '../types';\n\nfunction SelectList({ selected, active, filteredItems, showList, ...props }: Readonly<SelectListProps>) {\n const { i18n } = useCoreContext();\n\n return (\n /* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n <ul\n className={cx({\n 'adyen-checkout__dropdown__list': true,\n 'adyen-checkout__dropdown__list--active': showList\n })}\n id={props.selectListId}\n ref={props.selectListRef}\n role=\"listbox\"\n >\n {filteredItems.length ? (\n filteredItems.map(item => (\n <SelectListItem\n active={item.id === active.id}\n item={item}\n key={item.id}\n onSelect={props.onSelect}\n onHover={props.onHover}\n selected={item.id === selected.id}\n />\n ))\n ) : (\n <div className=\"adyen-checkout__dropdown__element adyen-checkout__dropdown__element--no-options\">\n {i18n.get('select.noOptionsFound')}\n </div>\n )}\n </ul>\n );\n}\n\nexport default SelectList;\n"],"names":["SelectList","selected","active","filteredItems","showList","props","i18n","useCoreContext","h","ul","className","cx","id","selectListId","ref","selectListRef","role","length","map","item","SelectListItem","key","onSelect","onHover","div","get"],"mappings":"8OAMA,SAASA,GAAWC,SAAEA,EAAQC,OAAEA,EAAMC,cAAEA,EAAaC,SAAEA,KAAaC,IAChE,MAAMC,KAAEA,GAASC,IAEjB,OAEIC,EAACC,KAAAA,CACGC,UAAWC,EAAG,CACV,kCAAkC,EAClC,yCAA0CP,IAE9CQ,GAAIP,EAAMQ,aACVC,IAAKT,EAAMU,cACXC,KAAK,WAEJb,EAAcc,OACXd,EAAce,IAAIC,GACdX,EAACY,EAAAA,CACGlB,OAAQiB,EAAKP,KAAOV,EAAOU,GAC3BO,KAAMA,EACNE,IAAKF,EAAKP,GACVU,SAAUjB,EAAMiB,SAChBC,QAASlB,EAAMkB,QACftB,SAAUkB,EAAKP,KAAOX,EAASW,MAIvCJ,EAACgB,MAAAA,~~CAAId~~,UAAU,mFACVJ,~~EAAKmB~~,IAAI,~~0BAK9B~~"}
1	+ {"version":3,"file":"SelectList.js","sources":["../../../../../../../src/components/internal/FormFields/Select/components/SelectList.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\nimport SelectListItem from './SelectListItem';\nimport { useCoreContext } from '../../../../../core/Context/CoreProvider';\nimport { SelectListProps } from '../types';\n\nfunction SelectList({ selected, active, filteredItems, showList, ...props }: Readonly<SelectListProps>) {\n const { i18n } = useCoreContext();\n\n return (\n /* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n <ul\n className={cx({\n 'adyen-checkout__dropdown__list': true,\n 'adyen-checkout__dropdown__list--active': showList\n })}\n id={props.selectListId}\n ref={props.selectListRef}\n role=\"listbox\"\n >\n {filteredItems.length ? (\n filteredItems.map(item => (\n <SelectListItem\n active={item.id === active.id}\n item={item}\n key={item.id}\n onSelect={props.onSelect}\n onHover={props.onHover}\n selected={item.id === selected.id}\n />\n ))\n ) : (\n <li>\n <div className=\"adyen-checkout__dropdown__element adyen-checkout__dropdown__element--no-options\">\n {i18n.get('select.noOptionsFound')}\n </div>\n </li>\n )}\n </ul>\n );\n}\n\nexport default SelectList;\n"],"names":["SelectList","selected","active","filteredItems","showList","props","i18n","useCoreContext","h","ul","className","cx","id","selectListId","ref","selectListRef","role","length","map","item","SelectListItem","key","onSelect","onHover","li","div","get"],"mappings":"8OAMA,SAASA,GAAWC,SAAEA,EAAQC,OAAEA,EAAMC,cAAEA,EAAaC,SAAEA,KAAaC,IAChE,MAAMC,KAAEA,GAASC,IAEjB,OAEIC,EAACC,KAAAA,CACGC,UAAWC,EAAG,CACV,kCAAkC,EAClC,yCAA0CP,IAE9CQ,GAAIP,EAAMQ,aACVC,IAAKT,EAAMU,cACXC,KAAK,WAEJb,EAAcc,OACXd,EAAce,IAAIC,GACdX,EAACY,EAAAA,CACGlB,OAAQiB,EAAKP,KAAOV,EAAOU,GAC3BO,KAAMA,EACNE,IAAKF,EAAKP,GACVU,SAAUjB,EAAMiB,SAChBC,QAASlB,EAAMkB,QACftB,SAAUkB,EAAKP,KAAOX,EAASW,MAIvCJ,EAACgB,UACGhB,EAACiB,MAAAA,CAAIf,UAAU,mFACVJ,EAAKoB,IAAI,2BAMlC"}

package/dist/es/components/internal/IbanInput/IbanInput.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{Component as e,createElement as a}from"../../../external/preact/dist/preact.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import r from"../FormFields/Field/Field.js";import{isValidHolder as s,checkIbanStatus as i}from"./validate.js";import{electronicFormat as n,formatIban as o,getCountryCode as l,getNextCursorPosition as d}from"./utils.js";import h from"../FormFields/Fieldset/Fieldset.js";import u from"../FormFields/InputText.js";function b(e,a,t){return a in e?Object.defineProperty(e,a,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[a]=t,e}const m={isValid:!1,errorMessage:"ach.accountHolderNameField.invalid",error:"ach.accountHolderNameField.invalid"},c={isValid:!1,errorMessage:"sepaDirectDebit.ibanField.invalid",error:"sepaDirectDebit.ibanField.invalid"};class p extends e{setStatus(e){this.setState({status:e})}onChange(){const e=!this.props.holderName||s(this.state.data.ownerName),a="valid"===i(this.state.data.ibanNumber).status&&e,t={data:this.state.data,isValid:a,errors:this.state.errors};this.props.onChange(t)}showValidation(){const e=i(this.state.data.ibanNumber).status,a=s(this.state.data.ownerName);this.setError("iban","valid"!==e?c:null);const t=a?null:m;this.setError("holder",t,this.onChange)}render({placeholders:e},{data:s,errors:i,valid:n}){const{i18n:o}=t();return a(h,{classNameModifiers:["iban-input"],label:this.props.label},this.props.holderName&&a(r,{className:"adyen-checkout__field--owner-name",label:o.get("sepa.ownerName"),filled:s.ownerName&&s.ownerName.length,errorMessage:!!i.holder&&o.get(i.holder.error),dir:"ltr",i18n:o,name:"ownerName"},a(u,{name:"ownerName",className:"adyen-checkout__iban-input__owner-name",placeholder:e?.ownerName,value:s.ownerName,"aria-invalid":!!this.state.errors.holder,"aria-label":o.get("sepa.ownerName"),onInput:e=>this.handleHolderInput(e.target.value),onBlur:e=>this.handleHolderInput(e.target.value)})),a(r,{className:"adyen-checkout__field--iban-number",label:o.get("sepa.ibanNumber"),errorMessage:!!i.iban&&o.get(i.iban.error),filled:s.ibanNumber&&s.ibanNumber.length,isValid:n.iban,onBlur:this.handleIbanBlur,dir:"ltr",i18n:o,name:"ibanNumber"},a(u,{setRef:e=>{this.ibanNumber=e},name:"ibanNumber",className:"adyen-checkout__iban-input__iban-number",classNameModifiers:["large"],placeholder:e?.ibanNumber,value:s.ibanNumber,onInput:this.handleIbanInput,"aria-invalid":!!this.state.errors.iban,"aria-label":o.get("sepa.ibanNumber"),autocorrect:"off",spellcheck:!1})),this.props.showPayButton&&this.props.payButton({status:this.state.status}))}constructor(e){if(super(e),b(this,"ibanNumber",void 0),b(this,"setData",(e,a,t)=>{this.setState(t=>({data:{...t.data,[e]:a}}),t)}),b(this,"setError",(e,a,t)=>{this.setState(t=>({errors:{...t.errors,[e]:a}}),t)}),b(this,"setValid",(e,a,t)=>{this.setState(t=>({valid:{...t.valid,[e]:a}}),t)}),b(this,"handleHolderInput",e=>{this.setState(a=>({data:{...a.data,ownerName:e}}),()=>{const e=s(this.state.data.ownerName),a=null==e||e?null:m;this.setError("holder",a,this.onChange)})}),b(this,"handleIbanInput",e=>{const a=e.target.value,t=n(a),r=o(t),s=i(r).status,h=l(t),u=e.target.selectionStart,b=this.state.data.ibanNumber,m=d(u,r,b);this.setState(e=>({data:{...e.data,ibanNumber:r,countryCode:h},errors:{...e.errors,iban:"invalid"===s?c:null},valid:{...e.valid,iban:"valid"===s}}),()=>{e.target.setSelectionRange(m,m),this.onChange()})}),b(this,"handleIbanBlur",e=>{const a=e.target.value;if(a.length>0){const e=i(a).status;this.setError("iban","valid"!==e?c:null,this.onChange)}else this.setError("iban",null,this.onChange)}),this.state={status:"ready",data:{ownerName:e?.data?.ownerName||"",ibanNumber:e?.data?.ibanNumber||"",countryCode:e?.data?.countryCode||""},isValid:!1,cursor:0,errors:{},valid:{}},this.state.data.ibanNumber){const e=n(this.state.data.ibanNumber);this.state.data.ibanNumber=o(e)}if(this.state.data.ibanNumber||this.state.data.ownerName){const e=this.props.holderName?s(this.state.data.ownerName):"",a=(this.state.data.ibanNumber?"valid"===i(this.state.data.ibanNumber).status:"")&&e,t={data:this.state.data,isValid:a};this.props.onChange(t)}}}b(p,"defaultProps",{onChange:()=>{},countryCode:null,holderName:!0,placeholders:{},label:null});export{p as default};
+import{Component as e,createElement as a}from"../../../external/preact/dist/preact.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import r from"../FormFields/Field/Field.js";import{isValidHolder as s,checkIbanStatus as i}from"./validate.js";import{electronicFormat as n,formatIban as o,getCountryCode as l,getNextCursorPosition as d}from"./utils.js";import h from"../FormFields/Fieldset/Fieldset.js";import u from"../FormFields/InputText.js";function m(e,a,t){return a in e?Object.defineProperty(e,a,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[a]=t,e}const b={isValid:!1,errorMessage:"ach.accountHolderNameField.invalid",error:"ach.accountHolderNameField.invalid"},c={isValid:!1,errorMessage:"sepaDirectDebit.ibanField.invalid",error:"sepaDirectDebit.ibanField.invalid"};class p extends e{setStatus(e){this.setState({status:e})}onChange(){const e=!this.props.holderName||s(this.state.data.ownerName),a="valid"===i(this.state.data.ibanNumber).status&&e,t={data:this.state.data,isValid:a,errors:this.state.errors};this.props.onChange(t)}showValidation(){const e=i(this.state.data.ibanNumber).status,a=s(this.state.data.ownerName);this.setError("iban","valid"!==e?c:null);const t=a?null:b;this.setError("holder",t,this.onChange)}render({placeholders:e},{data:s,errors:i,valid:n}){const{i18n:o}=t();return a(h,{classNameModifiers:["iban-input"],label:this.props.label},this.props.holderName&&a(r,{className:"adyen-checkout__field--owner-name",label:o.get("sepa.ownerName"),filled:s.ownerName&&s.ownerName.length,errorMessage:!!i.holder&&o.get(i.holder.error),dir:"ltr",i18n:o,name:"ownerName"},a(u,{name:"ownerName",className:"adyen-checkout__iban-input__owner-name",placeholder:e?.ownerName,value:s.ownerName,"aria-invalid":!!this.state.errors.holder,"aria-label":o.get("sepa.ownerName"),onInput:e=>this.handleHolderInput(e.target.value),onBlur:e=>this.handleHolderInput(e.target.value),autocomplete:"name"})),a(r,{className:"adyen-checkout__field--iban-number",label:o.get("sepa.ibanNumber"),errorMessage:!!i.iban&&o.get(i.iban.error),filled:s.ibanNumber&&s.ibanNumber.length,isValid:n.iban,onBlur:this.handleIbanBlur,dir:"ltr",i18n:o,name:"ibanNumber"},a(u,{setRef:e=>{this.ibanNumber=e},name:"ibanNumber",className:"adyen-checkout__iban-input__iban-number",classNameModifiers:["large"],placeholder:e?.ibanNumber,value:s.ibanNumber,onInput:this.handleIbanInput,"aria-invalid":!!this.state.errors.iban,"aria-label":o.get("sepa.ibanNumber"),autocorrect:"off",spellcheck:!1,autocomplete:void 0})),this.props.showPayButton&&this.props.payButton({status:this.state.status}))}constructor(e){if(super(e),m(this,"ibanNumber",void 0),m(this,"setData",(e,a,t)=>{this.setState(t=>({data:{...t.data,[e]:a}}),t)}),m(this,"setError",(e,a,t)=>{this.setState(t=>({errors:{...t.errors,[e]:a}}),t)}),m(this,"setValid",(e,a,t)=>{this.setState(t=>({valid:{...t.valid,[e]:a}}),t)}),m(this,"handleHolderInput",e=>{this.setState(a=>({data:{...a.data,ownerName:e}}),()=>{const e=s(this.state.data.ownerName),a=null==e||e?null:b;this.setError("holder",a,this.onChange)})}),m(this,"handleIbanInput",e=>{const a=e.target.value,t=n(a),r=o(t),s=i(r).status,h=l(t),u=e.target.selectionStart,m=this.state.data.ibanNumber,b=d(u,r,m);this.setState(e=>({data:{...e.data,ibanNumber:r,countryCode:h},errors:{...e.errors,iban:"invalid"===s?c:null},valid:{...e.valid,iban:"valid"===s}}),()=>{e.target.setSelectionRange(b,b),this.onChange()})}),m(this,"handleIbanBlur",e=>{const a=e.target.value;if(a.length>0){const e=i(a).status;this.setError("iban","valid"!==e?c:null,this.onChange)}else this.setError("iban",null,this.onChange)}),this.state={status:"ready",data:{ownerName:e?.data?.ownerName||"",ibanNumber:e?.data?.ibanNumber||"",countryCode:e?.data?.countryCode||""},isValid:!1,cursor:0,errors:{},valid:{}},this.state.data.ibanNumber){const e=n(this.state.data.ibanNumber);this.state.data.ibanNumber=o(e)}if(this.state.data.ibanNumber||this.state.data.ownerName){const e=this.props.holderName?s(this.state.data.ownerName):"",a=(this.state.data.ibanNumber?"valid"===i(this.state.data.ibanNumber).status:"")&&e,t={data:this.state.data,isValid:a};this.props.onChange(t)}}}m(p,"defaultProps",{onChange:()=>{},countryCode:null,holderName:!0,placeholders:{},label:null});export{p as default};
 //# sourceMappingURL=IbanInput.js.map

package/dist/es/components/internal/IbanInput/IbanInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IbanInput.js","sources":["../../../../../src/components/internal/IbanInput/IbanInput.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../FormFields/Field';\nimport { checkIbanStatus, isValidHolder } from './validate';\nimport { electronicFormat, formatIban, getCountryCode, getNextCursorPosition } from './utils';\nimport Fieldset from '../FormFields/Fieldset';\nimport { GenericError } from '../../../core/Errors/types';\nimport InputText from '../FormFields/InputText';\n\ninterface IbanInputProps {\n holderName?: boolean;\n placeholders?: Omit<IbanData, 'countryCode'>;\n countryCode?: string;\n showPayButton?: boolean;\n payButton?: any;\n onChange: (data) => void;\n label: string;\n data: IbanData;\n}\n\ninterface IbanData {\n ownerName?: string;\n ibanNumber?: string;\n countryCode?: string;\n}\n\ninterface IbanInputState {\n data: any;\n errors: any;\n valid: any;\n status: string;\n isValid: boolean;\n cursor: number;\n}\n\nconst ibanHolderNameErrorObj: GenericError = {\n isValid: false,\n errorMessage: 'ach.accountHolderNameField.invalid', // TODO create bespoke translation key\n error: 'ach.accountHolderNameField.invalid'\n};\n\nconst ibanErrorObj: GenericError = {\n isValid: false,\n errorMessage: 'sepaDirectDebit.ibanField.invalid',\n error: 'sepaDirectDebit.ibanField.invalid'\n};\n\nclass IbanInput extends Component<Readonly<IbanInputProps>, IbanInputState> {\n private ibanNumber: HTMLInputElement;\n\n constructor(props) {\n super(props);\n\n this.state = {\n status: 'ready',\n data: {\n ownerName: props?.data?.ownerName \|\| '',\n ibanNumber: props?.data?.ibanNumber \|\| '',\n countryCode: props?.data?.countryCode \|\| ''\n },\n isValid: false,\n cursor: 0,\n errors: {},\n valid: {}\n };\n\n if (this.state.data['ibanNumber']) {\n const electronicFormatIban = electronicFormat(this.state.data['ibanNumber']); // example: NL13TEST0123456789\n this.state.data['ibanNumber'] = formatIban(electronicFormatIban); // example: NL13 TEST 0123 4567 89\n }\n\n if (this.state.data['ibanNumber'] \|\| this.state.data['ownerName']) {\n const holderNameValid = this.props.holderName ? isValidHolder(this.state.data['ownerName']) : '';\n const ibanValid = this.state.data['ibanNumber'] ? checkIbanStatus(this.state.data['ibanNumber']).status === 'valid' : '';\n const isValid = ibanValid && holderNameValid;\n const data = { data: this.state.data, isValid };\n\n this.props.onChange(data);\n }\n }\n\n public static readonly defaultProps = {\n onChange: () => {},\n countryCode: null,\n holderName: true,\n placeholders: {},\n label: null\n };\n\n setStatus(status) {\n this.setState({ status });\n }\n\n onChange() {\n const holderNameValid = this.props.holderName ? isValidHolder(this.state.data['ownerName']) : true;\n const ibanValid = checkIbanStatus(this.state.data['ibanNumber']).status === 'valid';\n const isValid = ibanValid && holderNameValid;\n const data = { data: this.state.data, isValid, errors: this.state.errors };\n\n this.props.onChange(data);\n }\n\n public setData = (key, value, cb?) => {\n this.setState(prevState => ({ data: { ...prevState.data, [key]: value } }), cb);\n };\n\n public setError = (key, value, cb?) => {\n this.setState(prevState => ({ errors: { ...prevState.errors, [key]: value } }), cb);\n };\n\n public setValid = (key, value, cb?) => {\n this.setState(prevState => ({ valid: { ...prevState.valid, [key]: value } }), cb);\n };\n\n public handleHolderInput = holder => {\n this.setState(\n prevState => ({ data: { ...prevState.data, ownerName: holder } }),\n () => {\n const holderStatus = isValidHolder(this.state.data['ownerName']);\n const holderErr =\n holderStatus != null && !holderStatus // don't consider null, i.e. a value that has just been deleted, to be in error\n ? ibanHolderNameErrorObj\n : null;\n\n this.setError('holder', holderErr, this.onChange);\n }\n );\n };\n\n public handleIbanInput = e => {\n const inputValue = e.target.value;\n const electronicFormatIban = electronicFormat(inputValue); // example: NL13TEST0123456789\n const iban = formatIban(electronicFormatIban); // example: NL13 TEST 0123 4567 89\n const validationStatus = checkIbanStatus(iban).status;\n\n const countryCode = getCountryCode(electronicFormatIban);\n\n // calculate cursor's new position\n const cursor = e.target.selectionStart;\n const previousIban = this.state.data['ibanNumber'];\n const newCursorPosition = getNextCursorPosition(cursor, iban, previousIban);\n\n this.setState(\n prevState => ({\n data: { ...prevState.data, ibanNumber: iban, countryCode: countryCode },\n errors: {\n ...prevState.errors,\n iban: validationStatus === 'invalid' ? ibanErrorObj : null\n },\n valid: { ...prevState.valid, iban: validationStatus === 'valid' }\n }),\n () => {\n e.target.setSelectionRange(newCursorPosition, newCursorPosition);\n this.onChange();\n }\n );\n };\n\n public handleIbanBlur = e => {\n const currentIban = e.target.value;\n\n if (currentIban.length > 0) {\n const validationStatus = checkIbanStatus(currentIban).status;\n this.setError('iban', validationStatus !== 'valid' ? ibanErrorObj : null, this.onChange);\n } else {\n // Empty field is not in error\n this.setError('iban', null, this.onChange);\n }\n };\n\n showValidation() {\n const validationStatus = checkIbanStatus(this.state.data['ibanNumber']).status;\n const holderStatus = isValidHolder(this.state.data['ownerName']);\n this.setError('iban', validationStatus !== 'valid' ? ibanErrorObj : null);\n\n const holderErr = !holderStatus // do consider null, i.e. an empty field, to be in error\n ? ibanHolderNameErrorObj\n : null;\n\n this.setError('holder', holderErr, this.onChange); // add callback param to force propagation of state to parent comp\n }\n\n render({ placeholders }: IbanInputProps, { data, errors, valid }) {\n const { i18n } = useCoreContext();\n return (\n <Fieldset classNameModifiers={['iban-input']} label={this.props.label}>\n {this.props.holderName && (\n <Field\n className={'adyen-checkout__field--owner-name'}\n label={i18n.get('sepa.ownerName')}\n filled={data['ownerName'] && data['ownerName'].length}\n errorMessage={errors.holder ? i18n.get(errors.holder.error) : false}\n dir={'ltr'}\n i18n={i18n}\n name={'ownerName'}\n >\n <InputText\n name={'ownerName'}\n className={'adyen-checkout__iban-input__owner-name'}\n placeholder={placeholders?.ownerName}\n value={data['ownerName']}\n aria-invalid={!!this.state.errors.holder}\n aria-label={i18n.get('sepa.ownerName')}\n onInput={e => this.handleHolderInput((e.target as HTMLInputElement).value)}\n onBlur={e => this.handleHolderInput((e.target as HTMLInputElement).value)}\n />\n </Field>\n )}\n\n <Field\n className={'adyen-checkout__field--iban-number'}\n label={i18n.get('sepa.ibanNumber')}\n errorMessage={errors.iban ? i18n.get(errors.iban.error) : false}\n filled={data['ibanNumber'] && data['ibanNumber'].length}\n isValid={valid.iban}\n onBlur={this.handleIbanBlur}\n dir={'ltr'}\n i18n={i18n}\n name={'ibanNumber'}\n >\n <InputText\n setRef={ref => {\n this.ibanNumber = ref;\n }}\n name={'ibanNumber'}\n className={'adyen-checkout__iban-input__iban-number'}\n classNameModifiers={['large']}\n placeholder={placeholders?.ibanNumber}\n value={data['ibanNumber']}\n onInput={this.handleIbanInput}\n aria-invalid={!!this.state.errors.iban}\n aria-label={i18n.get('sepa.ibanNumber')}\n autocorrect={'off'}\n spellcheck={false}\n />\n </Field>\n\n {this.props.showPayButton && this.props.payButton({ status: this.state.status })}\n </Fieldset>\n );\n }\n}\n\nexport default IbanInput;\n"],"names":["ibanHolderNameErrorObj","isValid","errorMessage","error","ibanErrorObj","IbanInput","Component","setStatus","status","this","setState","onChange","holderNameValid","props","holderName","isValidHolder","state","data","checkIbanStatus","errors","showValidation","validationStatus","holderStatus","setError","holderErr","render","placeholders","valid","i18n","useCoreContext","h","Fieldset","classNameModifiers","label","Field","className","get","filled","length","holder","dir","name","InputText","placeholder","ownerName","value","aria-invalid","aria-label","onInput","e","handleHolderInput","target","onBlur","iban","handleIbanBlur","setRef","ref","ibanNumber","handleIbanInput","autocorrect","spellcheck","showPayButton","payButton","constructor","super","_define_property","setData","key","cb","prevState","setValid","inputValue","electronicFormatIban","electronicFormat","formatIban","countryCode","getCountryCode","cursor","selectionStart","previousIban","newCursorPosition","getNextCursorPosition","setSelectionRange","currentIban","defaultProps"],"mappings":"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"}
1	+ {"version":3,"file":"IbanInput.js","sources":["../../../../../src/components/internal/IbanInput/IbanInput.tsx"],"sourcesContent":["import { Component, h } from 'preact';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../FormFields/Field';\nimport { checkIbanStatus, isValidHolder } from './validate';\nimport { electronicFormat, formatIban, getCountryCode, getNextCursorPosition } from './utils';\nimport Fieldset from '../FormFields/Fieldset';\nimport { GenericError } from '../../../core/Errors/types';\nimport InputText from '../FormFields/InputText';\n\ninterface IbanInputProps {\n holderName?: boolean;\n placeholders?: Omit<IbanData, 'countryCode'>;\n countryCode?: string;\n showPayButton?: boolean;\n payButton?: any;\n onChange: (data) => void;\n label: string;\n data: IbanData;\n}\n\ninterface IbanData {\n ownerName?: string;\n ibanNumber?: string;\n countryCode?: string;\n}\n\ninterface IbanInputState {\n data: any;\n errors: any;\n valid: any;\n status: string;\n isValid: boolean;\n cursor: number;\n}\n\nconst ibanHolderNameErrorObj: GenericError = {\n isValid: false,\n errorMessage: 'ach.accountHolderNameField.invalid', // TODO create bespoke translation key\n error: 'ach.accountHolderNameField.invalid'\n};\n\nconst ibanErrorObj: GenericError = {\n isValid: false,\n errorMessage: 'sepaDirectDebit.ibanField.invalid',\n error: 'sepaDirectDebit.ibanField.invalid'\n};\n\nclass IbanInput extends Component<Readonly<IbanInputProps>, IbanInputState> {\n private ibanNumber: HTMLInputElement;\n\n constructor(props) {\n super(props);\n\n this.state = {\n status: 'ready',\n data: {\n ownerName: props?.data?.ownerName \|\| '',\n ibanNumber: props?.data?.ibanNumber \|\| '',\n countryCode: props?.data?.countryCode \|\| ''\n },\n isValid: false,\n cursor: 0,\n errors: {},\n valid: {}\n };\n\n if (this.state.data['ibanNumber']) {\n const electronicFormatIban = electronicFormat(this.state.data['ibanNumber']); // example: NL13TEST0123456789\n this.state.data['ibanNumber'] = formatIban(electronicFormatIban); // example: NL13 TEST 0123 4567 89\n }\n\n if (this.state.data['ibanNumber'] \|\| this.state.data['ownerName']) {\n const holderNameValid = this.props.holderName ? isValidHolder(this.state.data['ownerName']) : '';\n const ibanValid = this.state.data['ibanNumber'] ? checkIbanStatus(this.state.data['ibanNumber']).status === 'valid' : '';\n const isValid = ibanValid && holderNameValid;\n const data = { data: this.state.data, isValid };\n\n this.props.onChange(data);\n }\n }\n\n public static readonly defaultProps = {\n onChange: () => {},\n countryCode: null,\n holderName: true,\n placeholders: {},\n label: null\n };\n\n setStatus(status) {\n this.setState({ status });\n }\n\n onChange() {\n const holderNameValid = this.props.holderName ? isValidHolder(this.state.data['ownerName']) : true;\n const ibanValid = checkIbanStatus(this.state.data['ibanNumber']).status === 'valid';\n const isValid = ibanValid && holderNameValid;\n const data = { data: this.state.data, isValid, errors: this.state.errors };\n\n this.props.onChange(data);\n }\n\n public setData = (key, value, cb?) => {\n this.setState(prevState => ({ data: { ...prevState.data, [key]: value } }), cb);\n };\n\n public setError = (key, value, cb?) => {\n this.setState(prevState => ({ errors: { ...prevState.errors, [key]: value } }), cb);\n };\n\n public setValid = (key, value, cb?) => {\n this.setState(prevState => ({ valid: { ...prevState.valid, [key]: value } }), cb);\n };\n\n public handleHolderInput = holder => {\n this.setState(\n prevState => ({ data: { ...prevState.data, ownerName: holder } }),\n () => {\n const holderStatus = isValidHolder(this.state.data['ownerName']);\n const holderErr =\n holderStatus != null && !holderStatus // don't consider null, i.e. a value that has just been deleted, to be in error\n ? ibanHolderNameErrorObj\n : null;\n\n this.setError('holder', holderErr, this.onChange);\n }\n );\n };\n\n public handleIbanInput = e => {\n const inputValue = e.target.value;\n const electronicFormatIban = electronicFormat(inputValue); // example: NL13TEST0123456789\n const iban = formatIban(electronicFormatIban); // example: NL13 TEST 0123 4567 89\n const validationStatus = checkIbanStatus(iban).status;\n\n const countryCode = getCountryCode(electronicFormatIban);\n\n // calculate cursor's new position\n const cursor = e.target.selectionStart;\n const previousIban = this.state.data['ibanNumber'];\n const newCursorPosition = getNextCursorPosition(cursor, iban, previousIban);\n\n this.setState(\n prevState => ({\n data: { ...prevState.data, ibanNumber: iban, countryCode: countryCode },\n errors: {\n ...prevState.errors,\n iban: validationStatus === 'invalid' ? ibanErrorObj : null\n },\n valid: { ...prevState.valid, iban: validationStatus === 'valid' }\n }),\n () => {\n e.target.setSelectionRange(newCursorPosition, newCursorPosition);\n this.onChange();\n }\n );\n };\n\n public handleIbanBlur = e => {\n const currentIban = e.target.value;\n\n if (currentIban.length > 0) {\n const validationStatus = checkIbanStatus(currentIban).status;\n this.setError('iban', validationStatus !== 'valid' ? ibanErrorObj : null, this.onChange);\n } else {\n // Empty field is not in error\n this.setError('iban', null, this.onChange);\n }\n };\n\n showValidation() {\n const validationStatus = checkIbanStatus(this.state.data['ibanNumber']).status;\n const holderStatus = isValidHolder(this.state.data['ownerName']);\n this.setError('iban', validationStatus !== 'valid' ? ibanErrorObj : null);\n\n const holderErr = !holderStatus // do consider null, i.e. an empty field, to be in error\n ? ibanHolderNameErrorObj\n : null;\n\n this.setError('holder', holderErr, this.onChange); // add callback param to force propagation of state to parent comp\n }\n\n render({ placeholders }: IbanInputProps, { data, errors, valid }) {\n const { i18n } = useCoreContext();\n return (\n <Fieldset classNameModifiers={['iban-input']} label={this.props.label}>\n {this.props.holderName && (\n <Field\n className={'adyen-checkout__field--owner-name'}\n label={i18n.get('sepa.ownerName')}\n filled={data['ownerName'] && data['ownerName'].length}\n errorMessage={errors.holder ? i18n.get(errors.holder.error) : false}\n dir={'ltr'}\n i18n={i18n}\n name={'ownerName'}\n >\n <InputText\n name={'ownerName'}\n className={'adyen-checkout__iban-input__owner-name'}\n placeholder={placeholders?.ownerName}\n value={data['ownerName']}\n aria-invalid={!!this.state.errors.holder}\n aria-label={i18n.get('sepa.ownerName')}\n onInput={e => this.handleHolderInput((e.target as HTMLInputElement).value)}\n onBlur={e => this.handleHolderInput((e.target as HTMLInputElement).value)}\n autocomplete={'name'}\n />\n </Field>\n )}\n\n <Field\n className={'adyen-checkout__field--iban-number'}\n label={i18n.get('sepa.ibanNumber')}\n errorMessage={errors.iban ? i18n.get(errors.iban.error) : false}\n filled={data['ibanNumber'] && data['ibanNumber'].length}\n isValid={valid.iban}\n onBlur={this.handleIbanBlur}\n dir={'ltr'}\n i18n={i18n}\n name={'ibanNumber'}\n >\n <InputText\n setRef={ref => {\n this.ibanNumber = ref;\n }}\n name={'ibanNumber'}\n className={'adyen-checkout__iban-input__iban-number'}\n classNameModifiers={['large']}\n placeholder={placeholders?.ibanNumber}\n value={data['ibanNumber']}\n onInput={this.handleIbanInput}\n aria-invalid={!!this.state.errors.iban}\n aria-label={i18n.get('sepa.ibanNumber')}\n autocorrect={'off'}\n spellcheck={false}\n autocomplete={undefined}\n />\n </Field>\n\n {this.props.showPayButton && this.props.payButton({ status: this.state.status })}\n </Fieldset>\n );\n }\n}\n\nexport default IbanInput;\n"],"names":["ibanHolderNameErrorObj","isValid","errorMessage","error","ibanErrorObj","IbanInput","Component","setStatus","status","this","setState","onChange","holderNameValid","props","holderName","isValidHolder","state","data","checkIbanStatus","errors","showValidation","validationStatus","holderStatus","setError","holderErr","render","placeholders","valid","i18n","useCoreContext","h","Fieldset","classNameModifiers","label","Field","className","get","filled","length","holder","dir","name","InputText","placeholder","ownerName","value","aria-invalid","aria-label","onInput","e","handleHolderInput","target","onBlur","autocomplete","iban","handleIbanBlur","setRef","ref","ibanNumber","handleIbanInput","autocorrect","spellcheck","undefined","showPayButton","payButton","constructor","super","_define_property","setData","key","cb","prevState","setValid","inputValue","electronicFormatIban","electronicFormat","formatIban","countryCode","getCountryCode","cursor","selectionStart","previousIban","newCursorPosition","getNextCursorPosition","setSelectionRange","currentIban","defaultProps"],"mappings":"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"}

package/dist/es/components/internal/PersonalDetails/PersonalDetails.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import{useMemo as r,useRef as a,useEffect as t}from"../../../external/preact/hooks/dist/hooks.js";import s from"../FormFields/Fieldset/Fieldset.js";import l from"../FormFields/Field/Field.js";import i from"./ReadOnlyPersonalDetails.js";import{personalDetailsValidationRules as o}from"./validate.js";import{useCoreContext as m}from"../../../core/Context/CoreProvider.js";import{checkDateInputSupport as n}from"../FormFields/InputDate/utils.js";import{getFormattedData as d}from"./utils.js";import p from"../../../utils/useForm/useForm.js";import"../SecuredFields/lib/CSF/utils/userAgent.js";import u from"../FormFields/InputText.js";import f from"../FormFields/InputDate/InputDate.js";import h from"../FormFields/InputEmail.js";import c from"../FormFields/InputTelephone.js";import{getErrorMessage as N}from"../../../utils/getErrorMessage.js";const b=["firstName","lastName","dateOfBirth","shopperEmail","telephoneNumber"];function g(b){const{label:g="",namePrefix:F,placeholders:M,requiredFields:B,visibility:j}=b,{i18n:E}=m(),O=r(n,[]),{handleChangeFor:v,triggerValidation:I,data:C,valid:q,errors:x,isValid:D}=p({schema:B,rules:{...o,...b.validationRules},defaultData:b.data}),R=a({showValidation:()=>{I()}});t(()=>{b.setComponentRef(R.current)},[b.setComponentRef]);const k=e=>r=>{const{name:a}=r.target,t=a.split(`${F}.`).pop();v(t,e)(r)},y=e=>`${F?`${F}.`:""}${e}`;return t(()=>{const e=d(C);b.onChange({data:e,valid:q,errors:x,isValid:D})},[C,q,x,D]),"hidden"===j?null:"readOnly"===j?e(i,{...b,data:C}):e(s,{classNameModifiers:["personalDetails"],label:g},B.includes("firstName")&&e(l,{label:E.get("firstName"),classNameModifiers:["col-50","firstName"],errorMessage:N(E,x.firstName,E.get("firstName")),name:"firstName",i18n:E},e(u,{name:y("firstName"),value:C.firstName,classNameModifiers:["firstName"],onInput:k("input"),onBlur:k("blur"),placeholder:M.firstName,spellcheck:!1,required:!0})),B.includes("lastName")&&e(l,{label:E.get("lastName"),classNameModifiers:["col-50","lastName"],errorMessage:N(E,x.lastName,E.get("lastName")),name:"lastName",i18n:E},e(u,{name:y("lastName"),value:C.lastName,classNameModifiers:["lastName"],onInput:k("input"),onBlur:k("blur"),placeholder:M.lastName,spellcheck:!1,required:!0})),B.includes("dateOfBirth")&&e(l,{label:E.get("dateOfBirth"),classNameModifiers:["col-50","dateOfBirth"],errorMessage:N(E,x.dateOfBirth,E.get("dateOfBirth")),helper:O?null:E.get("dateOfBirth.format"),name:"dateOfBirth",i18n:E},e(f,{name:y("dateOfBirth"),value:C.dateOfBirth,classNameModifiers:["dateOfBirth"],onInput:k("input"),onBlur:k("blur"),placeholder:M.dateOfBirth,required:!0})),B.includes("shopperEmail")&&e(l,{label:E.get("shopperEmail"),classNameModifiers:["shopperEmail"],errorMessage:N(E,x.shopperEmail,E.get("shopperEmail")),dir:"ltr",name:"emailAddress",i18n:E},e(h,{name:y("shopperEmail"),value:C.shopperEmail,classNameModifiers:["shopperEmail"],onInput:k("input"),onBlur:k("blur"),placeholder:M.shopperEmail,required:!0})),B.includes("telephoneNumber")&&e(l,{label:E.get("telephoneNumber"),classNameModifiers:["telephoneNumber"],errorMessage:N(E,x.telephoneNumber,E.get("telephoneNumber")),dir:"ltr",name:"telephoneNumber",i18n:E},e(c,{name:y("telephoneNumber"),value:C.telephoneNumber,classNameModifiers:["telephoneNumber"],onInput:k("input"),onBlur:k("blur"),placeholder:M.telephoneNumber,required:!0})))}g.defaultProps={data:{},onChange:()=>{},placeholders:{},requiredFields:b,validationRules:o,visibility:"editable"};export{b as PERSONAL_DETAILS_SCHEMA,g as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import{useMemo as r,useRef as a,useEffect as t}from"../../../external/preact/hooks/dist/hooks.js";import l from"../FormFields/Fieldset/Fieldset.js";import s from"../FormFields/Field/Field.js";import i from"./ReadOnlyPersonalDetails.js";import{personalDetailsValidationRules as o}from"./validate.js";import{useCoreContext as m}from"../../../core/Context/CoreProvider.js";import{checkDateInputSupport as n}from"../FormFields/InputDate/utils.js";import{getFormattedData as p}from"./utils.js";import d from"../../../utils/useForm/useForm.js";import"../SecuredFields/lib/CSF/utils/userAgent.js";import u from"../FormFields/InputText.js";import f from"../FormFields/InputDate/InputDate.js";import h from"../FormFields/InputEmail.js";import c from"../FormFields/InputTelephone.js";import{getErrorMessage as N}from"../../../utils/getErrorMessage.js";const b=["firstName","lastName","dateOfBirth","shopperEmail","telephoneNumber"];function g(b){const{label:g="",namePrefix:F,placeholders:M,requiredFields:B,visibility:j}=b,{i18n:v}=m(),E=r(n,[]),{handleChangeFor:O,triggerValidation:I,data:C,valid:q,errors:x,isValid:y}=d({schema:B,rules:{...o,...b.validationRules},defaultData:b.data}),D=a({showValidation:()=>{I()}});t(()=>{b.setComponentRef(D.current)},[b.setComponentRef]);const R=e=>r=>{const{name:a}=r.target,t=a.split(`${F}.`).pop();O(t,e)(r)},k=e=>`${F?`${F}.`:""}${e}`;return t(()=>{const e=p(C);b.onChange({data:e,valid:q,errors:x,isValid:y})},[C,q,x,y]),"hidden"===j?null:"readOnly"===j?e(i,{...b,data:C}):e(l,{classNameModifiers:["personalDetails"],label:g},B.includes("firstName")&&e(s,{label:v.get("firstName"),classNameModifiers:["col-50","firstName"],errorMessage:N(v,x.firstName,v.get("firstName")),name:"firstName",i18n:v},e(u,{name:k("firstName"),value:C.firstName,classNameModifiers:["firstName"],onInput:R("input"),onBlur:R("blur"),placeholder:M.firstName,spellcheck:!1,required:!0,autocomplete:"given-name"})),B.includes("lastName")&&e(s,{label:v.get("lastName"),classNameModifiers:["col-50","lastName"],errorMessage:N(v,x.lastName,v.get("lastName")),name:"lastName",i18n:v},e(u,{name:k("lastName"),value:C.lastName,classNameModifiers:["lastName"],onInput:R("input"),onBlur:R("blur"),placeholder:M.lastName,spellcheck:!1,required:!0,autocomplete:"family-name"})),B.includes("dateOfBirth")&&e(s,{label:v.get("dateOfBirth"),classNameModifiers:["col-50","dateOfBirth"],errorMessage:N(v,x.dateOfBirth,v.get("dateOfBirth")),helper:E?null:v.get("dateOfBirth.format"),name:"dateOfBirth",i18n:v},e(f,{name:k("dateOfBirth"),value:C.dateOfBirth,classNameModifiers:["dateOfBirth"],onInput:R("input"),onBlur:R("blur"),placeholder:M.dateOfBirth,required:!0,autocomplete:"bday"})),B.includes("shopperEmail")&&e(s,{label:v.get("shopperEmail"),classNameModifiers:["shopperEmail"],errorMessage:N(v,x.shopperEmail,v.get("shopperEmail")),dir:"ltr",name:"emailAddress",i18n:v},e(h,{name:k("shopperEmail"),value:C.shopperEmail,classNameModifiers:["shopperEmail"],onInput:R("input"),onBlur:R("blur"),placeholder:M.shopperEmail,required:!0,autocomplete:"email"})),B.includes("telephoneNumber")&&e(s,{label:v.get("telephoneNumber"),classNameModifiers:["telephoneNumber"],errorMessage:N(v,x.telephoneNumber,v.get("telephoneNumber")),dir:"ltr",name:"telephoneNumber",i18n:v},e(c,{name:k("telephoneNumber"),value:C.telephoneNumber,classNameModifiers:["telephoneNumber"],onInput:R("input"),onBlur:R("blur"),placeholder:M.telephoneNumber,required:!0,autocomplete:"tel"})))}g.defaultProps={data:{},onChange:()=>{},placeholders:{},requiredFields:b,validationRules:o,visibility:"editable"};export{b as PERSONAL_DETAILS_SCHEMA,g as default};
 //# sourceMappingURL=PersonalDetails.js.map

package/dist/es/components/internal/PersonalDetails/PersonalDetails.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PersonalDetails.js","sources":["../../../../../src/components/internal/PersonalDetails/PersonalDetails.tsx"],"sourcesContent":["import { GenericEventHandler, h } from 'preact';\nimport { useEffect, useMemo, useRef } from 'preact/hooks';\nimport Fieldset from '../FormFields/Fieldset';\nimport Field from '../FormFields/Field';\nimport ReadOnlyPersonalDetails from './ReadOnlyPersonalDetails';\nimport { personalDetailsValidationRules } from './validate';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { PersonalDetailsProps } from './types';\nimport { checkDateInputSupport } from '../FormFields/InputDate/utils';\nimport { PersonalDetailsSchema } from '../../../types';\nimport { getFormattedData } from './utils';\nimport useForm from '../../../utils/useForm';\nimport InputText from '../FormFields/InputText';\nimport InputDate from '../FormFields/InputDate';\nimport InputEmail from '../FormFields/InputEmail';\nimport InputTelephone from '../FormFields/InputTelephone';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport { ComponentMethodsRef } from '../UIElement/types';\nimport { HandleChangeForModeType } from '../../../utils/useForm/types';\nimport './PersonalDetails.scss';\n\nexport const PERSONAL_DETAILS_SCHEMA = ['firstName', 'lastName', 'dateOfBirth', 'shopperEmail', 'telephoneNumber'];\n\nexport default function PersonalDetails(props: Readonly<PersonalDetailsProps>) {\n const { label = '', namePrefix, placeholders, requiredFields, visibility } = props;\n\n const { i18n } = useCoreContext();\n\n const isDateInputSupported = useMemo(checkDateInputSupport, []);\n const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<PersonalDetailsSchema>({\n schema: requiredFields,\n // Ensure any passed validation rules are merged with the default ones\n rules: { ...personalDetailsValidationRules, ...props.validationRules },\n defaultData: props.data\n });\n\n const personalDetailsRef = useRef<ComponentMethodsRef>({\n showValidation: () => {\n triggerValidation();\n }\n });\n\n useEffect(() => {\n props.setComponentRef(personalDetailsRef.current);\n }, [props.setComponentRef]);\n\n const eventHandler =\n (mode: HandleChangeForModeType): GenericEventHandler<EventTarget> =>\n (e: Event): void => {\n const { name } = e.target as HTMLInputElement;\n const key = name.split(`${namePrefix}.`).pop();\n\n handleChangeFor(key, mode)(e);\n };\n\n const generateFieldName = (name: string): string => `${namePrefix ? `${namePrefix}.` : ''}${name}`;\n\n useEffect(() => {\n const formattedData = getFormattedData(data);\n props.onChange({ data: formattedData, valid, errors, isValid });\n }, [data, valid, errors, isValid]);\n\n if (visibility === 'hidden') return null;\n if (visibility === 'readOnly') return <ReadOnlyPersonalDetails {...props} data={data} />;\n\n return (\n <Fieldset classNameModifiers={['personalDetails']} label={label}>\n {requiredFields.includes('firstName') && (\n <Field\n label={i18n.get('firstName')}\n classNameModifiers={['col-50', 'firstName']}\n errorMessage={getErrorMessage(i18n, errors.firstName, i18n.get('firstName'))}\n name={'firstName'}\n i18n={i18n}\n >\n <InputText\n name={generateFieldName('firstName')}\n value={data.firstName}\n classNameModifiers={['firstName']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.firstName}\n spellcheck={false}\n required={true}\n />\n </Field>\n )}\n\n {requiredFields.includes('lastName') && (\n <Field\n label={i18n.get('lastName')}\n classNameModifiers={['col-50', 'lastName']}\n errorMessage={getErrorMessage(i18n, errors.lastName, i18n.get('lastName'))}\n name={'lastName'}\n i18n={i18n}\n >\n <InputText\n name={generateFieldName('lastName')}\n value={data.lastName}\n classNameModifiers={['lastName']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.lastName}\n spellcheck={false}\n required={true}\n />\n </Field>\n )}\n\n {requiredFields.includes('dateOfBirth') && (\n <Field\n label={i18n.get('dateOfBirth')}\n classNameModifiers={['col-50', 'dateOfBirth']}\n errorMessage={getErrorMessage(i18n, errors.dateOfBirth, i18n.get('dateOfBirth'))}\n helper={isDateInputSupported ? null : i18n.get('dateOfBirth.format')}\n name={'dateOfBirth'}\n i18n={i18n}\n >\n <InputDate\n name={generateFieldName('dateOfBirth')}\n value={data.dateOfBirth}\n classNameModifiers={['dateOfBirth']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.dateOfBirth}\n required={true}\n />\n </Field>\n )}\n\n {requiredFields.includes('shopperEmail') && (\n <Field\n label={i18n.get('shopperEmail')}\n classNameModifiers={['shopperEmail']}\n errorMessage={getErrorMessage(i18n, errors.shopperEmail, i18n.get('shopperEmail'))}\n dir={'ltr'}\n name={'emailAddress'}\n i18n={i18n}\n >\n <InputEmail\n name={generateFieldName('shopperEmail')}\n value={data.shopperEmail}\n classNameModifiers={['shopperEmail']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.shopperEmail}\n required={true}\n />\n </Field>\n )}\n\n {requiredFields.includes('telephoneNumber') && (\n <Field\n label={i18n.get('telephoneNumber')}\n classNameModifiers={['telephoneNumber']}\n errorMessage={getErrorMessage(i18n, errors.telephoneNumber, i18n.get('telephoneNumber'))}\n dir={'ltr'}\n name={'telephoneNumber'}\n i18n={i18n}\n >\n <InputTelephone\n name={generateFieldName('telephoneNumber')}\n value={data.telephoneNumber}\n classNameModifiers={['telephoneNumber']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.telephoneNumber}\n required={true}\n />\n </Field>\n )}\n </Fieldset>\n );\n}\n\nPersonalDetails.defaultProps = {\n data: {},\n onChange: () => {},\n placeholders: {},\n requiredFields: PERSONAL_DETAILS_SCHEMA,\n validationRules: personalDetailsValidationRules,\n visibility: 'editable'\n};\n"],"names":["PERSONAL_DETAILS_SCHEMA","PersonalDetails","props","label","namePrefix","placeholders","requiredFields","visibility","i18n","useCoreContext","isDateInputSupported","useMemo","checkDateInputSupport","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","rules","personalDetailsValidationRules","validationRules","defaultData","personalDetailsRef","useRef","showValidation","useEffect","setComponentRef","current","eventHandler","mode","e","name","target","key","split","pop","generateFieldName","formattedData","getFormattedData","onChange","h","ReadOnlyPersonalDetails","Fieldset","classNameModifiers","includes","Field","get","errorMessage","getErrorMessage","firstName","InputText","value","onInput","onBlur","placeholder","spellcheck","required","lastName","dateOfBirth","helper","InputDate","shopperEmail","dir","InputEmail","telephoneNumber","InputTelephone","defaultProps"],"mappings":"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"}
1	+ {"version":3,"file":"PersonalDetails.js","sources":["../../../../../src/components/internal/PersonalDetails/PersonalDetails.tsx"],"sourcesContent":["import { GenericEventHandler, h } from 'preact';\nimport { useEffect, useMemo, useRef } from 'preact/hooks';\nimport Fieldset from '../FormFields/Fieldset';\nimport Field from '../FormFields/Field';\nimport ReadOnlyPersonalDetails from './ReadOnlyPersonalDetails';\nimport { personalDetailsValidationRules } from './validate';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport { PersonalDetailsProps } from './types';\nimport { checkDateInputSupport } from '../FormFields/InputDate/utils';\nimport { PersonalDetailsSchema } from '../../../types';\nimport { getFormattedData } from './utils';\nimport useForm from '../../../utils/useForm';\nimport InputText from '../FormFields/InputText';\nimport InputDate from '../FormFields/InputDate';\nimport InputEmail from '../FormFields/InputEmail';\nimport InputTelephone from '../FormFields/InputTelephone';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\nimport { ComponentMethodsRef } from '../UIElement/types';\nimport { HandleChangeForModeType } from '../../../utils/useForm/types';\nimport './PersonalDetails.scss';\n\nexport const PERSONAL_DETAILS_SCHEMA = ['firstName', 'lastName', 'dateOfBirth', 'shopperEmail', 'telephoneNumber'];\n\nexport default function PersonalDetails(props: Readonly<PersonalDetailsProps>) {\n const { label = '', namePrefix, placeholders, requiredFields, visibility } = props;\n\n const { i18n } = useCoreContext();\n\n const isDateInputSupported = useMemo(checkDateInputSupport, []);\n const { handleChangeFor, triggerValidation, data, valid, errors, isValid } = useForm<PersonalDetailsSchema>({\n schema: requiredFields,\n // Ensure any passed validation rules are merged with the default ones\n rules: { ...personalDetailsValidationRules, ...props.validationRules },\n defaultData: props.data\n });\n\n const personalDetailsRef = useRef<ComponentMethodsRef>({\n showValidation: () => {\n triggerValidation();\n }\n });\n\n useEffect(() => {\n props.setComponentRef(personalDetailsRef.current);\n }, [props.setComponentRef]);\n\n const eventHandler =\n (mode: HandleChangeForModeType): GenericEventHandler<EventTarget> =>\n (e: Event): void => {\n const { name } = e.target as HTMLInputElement;\n const key = name.split(`${namePrefix}.`).pop();\n\n handleChangeFor(key, mode)(e);\n };\n\n const generateFieldName = (name: string): string => `${namePrefix ? `${namePrefix}.` : ''}${name}`;\n\n useEffect(() => {\n const formattedData = getFormattedData(data);\n props.onChange({ data: formattedData, valid, errors, isValid });\n }, [data, valid, errors, isValid]);\n\n if (visibility === 'hidden') return null;\n if (visibility === 'readOnly') return <ReadOnlyPersonalDetails {...props} data={data} />;\n\n return (\n <Fieldset classNameModifiers={['personalDetails']} label={label}>\n {requiredFields.includes('firstName') && (\n <Field\n label={i18n.get('firstName')}\n classNameModifiers={['col-50', 'firstName']}\n errorMessage={getErrorMessage(i18n, errors.firstName, i18n.get('firstName'))}\n name={'firstName'}\n i18n={i18n}\n >\n <InputText\n name={generateFieldName('firstName')}\n value={data.firstName}\n classNameModifiers={['firstName']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.firstName}\n spellcheck={false}\n required={true}\n autocomplete={'given-name'}\n />\n </Field>\n )}\n\n {requiredFields.includes('lastName') && (\n <Field\n label={i18n.get('lastName')}\n classNameModifiers={['col-50', 'lastName']}\n errorMessage={getErrorMessage(i18n, errors.lastName, i18n.get('lastName'))}\n name={'lastName'}\n i18n={i18n}\n >\n <InputText\n name={generateFieldName('lastName')}\n value={data.lastName}\n classNameModifiers={['lastName']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.lastName}\n spellcheck={false}\n required={true}\n autocomplete={'family-name'}\n />\n </Field>\n )}\n\n {requiredFields.includes('dateOfBirth') && (\n <Field\n label={i18n.get('dateOfBirth')}\n classNameModifiers={['col-50', 'dateOfBirth']}\n errorMessage={getErrorMessage(i18n, errors.dateOfBirth, i18n.get('dateOfBirth'))}\n helper={isDateInputSupported ? null : i18n.get('dateOfBirth.format')}\n name={'dateOfBirth'}\n i18n={i18n}\n >\n <InputDate\n name={generateFieldName('dateOfBirth')}\n value={data.dateOfBirth}\n classNameModifiers={['dateOfBirth']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.dateOfBirth}\n required={true}\n autocomplete={'bday'}\n />\n </Field>\n )}\n\n {requiredFields.includes('shopperEmail') && (\n <Field\n label={i18n.get('shopperEmail')}\n classNameModifiers={['shopperEmail']}\n errorMessage={getErrorMessage(i18n, errors.shopperEmail, i18n.get('shopperEmail'))}\n dir={'ltr'}\n name={'emailAddress'}\n i18n={i18n}\n >\n <InputEmail\n name={generateFieldName('shopperEmail')}\n value={data.shopperEmail}\n classNameModifiers={['shopperEmail']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.shopperEmail}\n required={true}\n autocomplete={'email'}\n />\n </Field>\n )}\n\n {requiredFields.includes('telephoneNumber') && (\n <Field\n label={i18n.get('telephoneNumber')}\n classNameModifiers={['telephoneNumber']}\n errorMessage={getErrorMessage(i18n, errors.telephoneNumber, i18n.get('telephoneNumber'))}\n dir={'ltr'}\n name={'telephoneNumber'}\n i18n={i18n}\n >\n <InputTelephone\n name={generateFieldName('telephoneNumber')}\n value={data.telephoneNumber}\n classNameModifiers={['telephoneNumber']}\n onInput={eventHandler('input')}\n onBlur={eventHandler('blur')}\n placeholder={placeholders.telephoneNumber}\n required={true}\n autocomplete={'tel'}\n />\n </Field>\n )}\n </Fieldset>\n );\n}\n\nPersonalDetails.defaultProps = {\n data: {},\n onChange: () => {},\n placeholders: {},\n requiredFields: PERSONAL_DETAILS_SCHEMA,\n validationRules: personalDetailsValidationRules,\n visibility: 'editable'\n};\n"],"names":["PERSONAL_DETAILS_SCHEMA","PersonalDetails","props","label","namePrefix","placeholders","requiredFields","visibility","i18n","useCoreContext","isDateInputSupported","useMemo","checkDateInputSupport","handleChangeFor","triggerValidation","data","valid","errors","isValid","useForm","schema","rules","personalDetailsValidationRules","validationRules","defaultData","personalDetailsRef","useRef","showValidation","useEffect","setComponentRef","current","eventHandler","mode","e","name","target","key","split","pop","generateFieldName","formattedData","getFormattedData","onChange","h","ReadOnlyPersonalDetails","Fieldset","classNameModifiers","includes","Field","get","errorMessage","getErrorMessage","firstName","InputText","value","onInput","onBlur","placeholder","spellcheck","required","autocomplete","lastName","dateOfBirth","helper","InputDate","shopperEmail","dir","InputEmail","telephoneNumber","InputTelephone","defaultProps"],"mappings":"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"}

package/dist/es/components/internal/PhoneInput/PhoneInputFields.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{createElement as e,Fragment as r}from"../../../external/preact/dist/preact.js";import{useEffect as o}from"../../../external/preact/hooks/dist/hooks.js";import n from"../FormFields/Field/Field.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import a from"../FormFields/Select/Select.js";import l from"../FormFields/InputText.js";function i({getError:i,showNumber:p,showPrefix:h,form:m,canSelectPrefix:u=!0,errorLive:s,...c}){const{i18n:d}=t(),{handleChangeFor:f,data:b,valid:N}=m;return o(()=>{b.phoneNumber&&f("phoneNumber","blur")(b.phoneNumber)},[b.phonePrefix]),e(r,null,h&&e(n,{className:"adyen-checkout-field--phone-prefix",label:d.get("telephonePrefix"),errorMessage:i("phonePrefix"),showValidIcon:!1,isValid:N.phonePrefix,dir:"ltr",i18n:d,name:"phonePrefix",errorLive:s},e(a,{readonly:!u,className:"adyen-checkout-dropdown adyen-checkout-dropdown--countrycode-selector",name:"phonePrefix",items:c.items,onChange:f("phonePrefix"),placeholder:c?.placeholders?.phonePrefix,selectedValue:b.phonePrefix})),p&&e(n,{className:"adyen-checkout-field--phone-number",label:c.phoneNumberKey?d.get(c.phoneNumberKey):d.get("telephoneNumber"),errorMessage:i("phoneNumber"),isValid:N.phoneNumber,filled:b?.phoneNumber?.length>0,dir:"ltr",i18n:d,name:"phoneNumber",errorLive:s},e(l,{className:"adyen-checkout__input adyen-checkout-input adyen-checkout-input--phone-number",type:"tel",name:"phoneNumber",value:b.phoneNumber,onInput:f("phoneNumber","input"),onBlur:f("phoneNumber","blur"),placeholder:c?.placeholders?.phoneNumber,autoCorrect:"off",required:!0})))}export{i as default};
+import{createElement as e,Fragment as r}from"../../../external/preact/dist/preact.js";import{useEffect as o}from"../../../external/preact/hooks/dist/hooks.js";import n from"../FormFields/Field/Field.js";import{useCoreContext as t}from"../../../core/Context/CoreProvider.js";import l from"../FormFields/Select/Select.js";import a from"../FormFields/InputText.js";function p({getError:p,showNumber:i,showPrefix:h,form:m,canSelectPrefix:u=!0,errorLive:s,...c}){const{i18n:d}=t(),{handleChangeFor:f,data:b,valid:N}=m;return o(()=>{b.phoneNumber&&f("phoneNumber","blur")(b.phoneNumber)},[b.phonePrefix]),e(r,null,h&&e(n,{className:"adyen-checkout-field--phone-prefix",label:d.get("telephonePrefix"),errorMessage:p("phonePrefix"),showValidIcon:!1,isValid:N.phonePrefix,dir:"ltr",i18n:d,name:"phonePrefix",errorLive:s},e(l,{readonly:!u,className:"adyen-checkout-dropdown adyen-checkout-dropdown--countrycode-selector",name:"phonePrefix",items:c.items,onChange:f("phonePrefix"),placeholder:c?.placeholders?.phonePrefix,selectedValue:b.phonePrefix})),i&&e(n,{className:"adyen-checkout-field--phone-number",label:c.phoneNumberKey?d.get(c.phoneNumberKey):d.get("telephoneNumber"),errorMessage:p("phoneNumber"),isValid:N.phoneNumber,filled:b?.phoneNumber?.length>0,dir:"ltr",i18n:d,name:"phoneNumber",errorLive:s},e(a,{className:"adyen-checkout__input adyen-checkout-input adyen-checkout-input--phone-number",type:"tel",name:"phoneNumber",value:b.phoneNumber,onInput:f("phoneNumber","input"),onBlur:f("phoneNumber","blur"),placeholder:c?.placeholders?.phoneNumber,autoCorrect:"off",required:!0,autocomplete:"tel"})))}export{p as default};
 //# sourceMappingURL=PhoneInputFields.js.map

package/dist/es/components/internal/PhoneInput/PhoneInputFields.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PhoneInputFields.js","sources":["../../../../../src/components/internal/PhoneInput/PhoneInputFields.tsx"],"sourcesContent":["import { Fragment, h } from 'preact';\nimport { useEffect } from 'preact/hooks';\nimport Field from '../FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './PhoneInput.scss';\nimport Select from '../FormFields/Select';\nimport { PhoneInputSchema } from './types';\nimport InputText from '../FormFields/InputText';\nimport { DataSet } from '../../../core/Services/data-set';\nimport { Form } from '../../../utils/useForm/types';\n\nexport interface PhoneInputFieldProps {\n items: DataSet;\n requiredFields?: string[];\n form: Form<PhoneInputSchema>;\n getError: (key: string) => string \| boolean;\n phoneNumberKey?: string;\n phonePrefixErrorKey?: string;\n phoneNumberErrorKey?: string;\n placeholders?: PhoneInputSchema;\n showPrefix?: boolean;\n showNumber?: boolean;\n canSelectPrefix?: boolean;\n errorLive?: boolean;\n}\n/*\n \n * @param PhoneInputFormProps\n * @constructor\n */\nexport default function PhoneInputFields({\n getError,\n showNumber,\n showPrefix,\n form,\n canSelectPrefix = true,\n errorLive,\n ...props\n}: Readonly<PhoneInputFieldProps>) {\n const { i18n } = useCoreContext();\n\n const { handleChangeFor, data, valid } = form;\n\n // Force re-validation of the phoneNumber when data.phonePrefix changes (since the validation rules will also change)\n useEffect((): void => {\n if (data.phoneNumber) {\n handleChangeFor('phoneNumber', 'blur')(data.phoneNumber);\n }\n }, [data.phonePrefix]);\n\n return (\n <Fragment>\n {showPrefix && (\n <Field\n className={'adyen-checkout-field--phone-prefix'}\n label={i18n.get('telephonePrefix')}\n errorMessage={getError('phonePrefix')}\n showValidIcon={false}\n isValid={valid.phonePrefix}\n dir={'ltr'}\n i18n={i18n}\n name={'phonePrefix'}\n errorLive={errorLive}\n >\n <Select\n readonly={!canSelectPrefix}\n className={'adyen-checkout-dropdown adyen-checkout-dropdown--countrycode-selector'}\n name={'phonePrefix'}\n items={props.items}\n onChange={handleChangeFor('phonePrefix')}\n placeholder={props?.placeholders?.phonePrefix}\n selectedValue={data.phonePrefix}\n />\n </Field>\n )}\n\n {showNumber && (\n <Field\n className={'adyen-checkout-field--phone-number'}\n label={props.phoneNumberKey ? i18n.get(props.phoneNumberKey) : i18n.get('telephoneNumber')}\n errorMessage={getError('phoneNumber')}\n isValid={valid.phoneNumber}\n filled={data?.phoneNumber?.length > 0}\n dir={'ltr'}\n i18n={i18n}\n name={'phoneNumber'}\n errorLive={errorLive}\n >\n <InputText\n className=\"adyen-checkout__input adyen-checkout-input adyen-checkout-input--phone-number\"\n type=\"tel\"\n name=\"phoneNumber\"\n value={data.phoneNumber}\n onInput={handleChangeFor('phoneNumber', 'input')}\n onBlur={handleChangeFor('phoneNumber', 'blur')}\n placeholder={props?.placeholders?.phoneNumber}\n autoCorrect=\"off\"\n required={true}\n />\n </Field>\n )}\n </Fragment>\n );\n}\n"],"names":["PhoneInputFields","getError","showNumber","showPrefix","form","canSelectPrefix","errorLive","props","i18n","useCoreContext","handleChangeFor","data","valid","useEffect","phoneNumber","phonePrefix","h","Fragment","Field","className","label","get","errorMessage","showValidIcon","isValid","dir","name","Select","readonly","items","onChange","placeholder","placeholders","selectedValue","phoneNumberKey","filled","length","InputText","type","value","onInput","onBlur","autoCorrect","required"],"mappings":"0WA8Be,SAASA,GAAiBC,SACrCA,EAAQC,WACRA,EAAUC,WACVA,EAAUC,KACVA,EAAIC,gBACJA,GAAkB,EAAIC,UACtBA,KACGC,IAEH,MAAMC,KAAEA,GAASC,KAEXC,gBAAEA,EAAeC,KAAEA,EAAIC,MAAEA,GAAUR,EASzC,OANAS,EAAU,KACFF,EAAKG,aACLJ,EAAgB,cAAe,OAA/BA,CAAuCC,EAAKG,cAEjD,CAACH,EAAKI,cAGLC,EAACC,EAAAA,KACId,GACGa,EAACE,EAAAA,CACGC,UAAW,qCACXC,MAAOZ,EAAKa,IAAI,mBAChBC,aAAcrB,EAAS,eACvBsB,eAAe,EACfC,QAASZ,EAAMG,YACfU,IAAK,MACLjB,KAAMA,EACNkB,KAAM,cACNpB,UAAWA,GAEXU,EAACW,EAAAA,CACGC,UAAWvB,EACXc,UAAW,wEACXO,KAAM,cACNG,MAAOtB,EAAMsB,MACbC,SAAUpB,EAAgB,eAC1BqB,YAAaxB,GAAOyB,cAAcjB,YAClCkB,cAAetB,EAAKI,eAK/Bb,GACGc,EAACE,EAAAA,CACGC,UAAW,qCACXC,MAAOb,EAAM2B,eAAiB1B,EAAKa,IAAId,EAAM2B,gBAAkB1B,EAAKa,IAAI,mBACxEC,aAAcrB,EAAS,eACvBuB,QAASZ,EAAME,YACfqB,OAAQxB,GAAMG,aAAasB,OAAS,EACpCX,IAAK,MACLjB,KAAMA,EACNkB,KAAM,cACNpB,UAAWA,GAEXU,EAACqB,EAAAA,CACGlB,UAAU,gFACVmB,KAAK,MACLZ,KAAK,cACLa,MAAO5B,EAAKG,YACZ0B,QAAS9B,EAAgB,cAAe,SACxC+B,OAAQ/B,EAAgB,cAAe,QACvCqB,YAAaxB,GAAOyB,cAAclB,YAClC4B,YAAY,MACZC,UAAU,~~KAMlC~~"}
1	+ {"version":3,"file":"PhoneInputFields.js","sources":["../../../../../src/components/internal/PhoneInput/PhoneInputFields.tsx"],"sourcesContent":["import { Fragment, h } from 'preact';\nimport { useEffect } from 'preact/hooks';\nimport Field from '../FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport './PhoneInput.scss';\nimport Select from '../FormFields/Select';\nimport { PhoneInputSchema } from './types';\nimport InputText from '../FormFields/InputText';\nimport { DataSet } from '../../../core/Services/data-set';\nimport { Form } from '../../../utils/useForm/types';\n\nexport interface PhoneInputFieldProps {\n items: DataSet;\n requiredFields?: string[];\n form: Form<PhoneInputSchema>;\n getError: (key: string) => string \| boolean;\n phoneNumberKey?: string;\n phonePrefixErrorKey?: string;\n phoneNumberErrorKey?: string;\n placeholders?: PhoneInputSchema;\n showPrefix?: boolean;\n showNumber?: boolean;\n canSelectPrefix?: boolean;\n errorLive?: boolean;\n}\n/*\n \n * @param PhoneInputFormProps\n * @constructor\n */\nexport default function PhoneInputFields({\n getError,\n showNumber,\n showPrefix,\n form,\n canSelectPrefix = true,\n errorLive,\n ...props\n}: Readonly<PhoneInputFieldProps>) {\n const { i18n } = useCoreContext();\n\n const { handleChangeFor, data, valid } = form;\n\n // Force re-validation of the phoneNumber when data.phonePrefix changes (since the validation rules will also change)\n useEffect((): void => {\n if (data.phoneNumber) {\n handleChangeFor('phoneNumber', 'blur')(data.phoneNumber);\n }\n }, [data.phonePrefix]);\n\n return (\n <Fragment>\n {showPrefix && (\n <Field\n className={'adyen-checkout-field--phone-prefix'}\n label={i18n.get('telephonePrefix')}\n errorMessage={getError('phonePrefix')}\n showValidIcon={false}\n isValid={valid.phonePrefix}\n dir={'ltr'}\n i18n={i18n}\n name={'phonePrefix'}\n errorLive={errorLive}\n >\n <Select\n readonly={!canSelectPrefix}\n className={'adyen-checkout-dropdown adyen-checkout-dropdown--countrycode-selector'}\n name={'phonePrefix'}\n items={props.items}\n onChange={handleChangeFor('phonePrefix')}\n placeholder={props?.placeholders?.phonePrefix}\n selectedValue={data.phonePrefix}\n />\n </Field>\n )}\n\n {showNumber && (\n <Field\n className={'adyen-checkout-field--phone-number'}\n label={props.phoneNumberKey ? i18n.get(props.phoneNumberKey) : i18n.get('telephoneNumber')}\n errorMessage={getError('phoneNumber')}\n isValid={valid.phoneNumber}\n filled={data?.phoneNumber?.length > 0}\n dir={'ltr'}\n i18n={i18n}\n name={'phoneNumber'}\n errorLive={errorLive}\n >\n <InputText\n className=\"adyen-checkout__input adyen-checkout-input adyen-checkout-input--phone-number\"\n type=\"tel\"\n name=\"phoneNumber\"\n value={data.phoneNumber}\n onInput={handleChangeFor('phoneNumber', 'input')}\n onBlur={handleChangeFor('phoneNumber', 'blur')}\n placeholder={props?.placeholders?.phoneNumber}\n autoCorrect=\"off\"\n required={true}\n autocomplete={'tel'}\n />\n </Field>\n )}\n </Fragment>\n );\n}\n"],"names":["PhoneInputFields","getError","showNumber","showPrefix","form","canSelectPrefix","errorLive","props","i18n","useCoreContext","handleChangeFor","data","valid","useEffect","phoneNumber","phonePrefix","h","Fragment","Field","className","label","get","errorMessage","showValidIcon","isValid","dir","name","Select","readonly","items","onChange","placeholder","placeholders","selectedValue","phoneNumberKey","filled","length","InputText","type","value","onInput","onBlur","autoCorrect","required","autocomplete"],"mappings":"0WA8Be,SAASA,GAAiBC,SACrCA,EAAQC,WACRA,EAAUC,WACVA,EAAUC,KACVA,EAAIC,gBACJA,GAAkB,EAAIC,UACtBA,KACGC,IAEH,MAAMC,KAAEA,GAASC,KAEXC,gBAAEA,EAAeC,KAAEA,EAAIC,MAAEA,GAAUR,EASzC,OANAS,EAAU,KACFF,EAAKG,aACLJ,EAAgB,cAAe,OAA/BA,CAAuCC,EAAKG,cAEjD,CAACH,EAAKI,cAGLC,EAACC,EAAAA,KACId,GACGa,EAACE,EAAAA,CACGC,UAAW,qCACXC,MAAOZ,EAAKa,IAAI,mBAChBC,aAAcrB,EAAS,eACvBsB,eAAe,EACfC,QAASZ,EAAMG,YACfU,IAAK,MACLjB,KAAMA,EACNkB,KAAM,cACNpB,UAAWA,GAEXU,EAACW,EAAAA,CACGC,UAAWvB,EACXc,UAAW,wEACXO,KAAM,cACNG,MAAOtB,EAAMsB,MACbC,SAAUpB,EAAgB,eAC1BqB,YAAaxB,GAAOyB,cAAcjB,YAClCkB,cAAetB,EAAKI,eAK/Bb,GACGc,EAACE,EAAAA,CACGC,UAAW,qCACXC,MAAOb,EAAM2B,eAAiB1B,EAAKa,IAAId,EAAM2B,gBAAkB1B,EAAKa,IAAI,mBACxEC,aAAcrB,EAAS,eACvBuB,QAASZ,EAAME,YACfqB,OAAQxB,GAAMG,aAAasB,OAAS,EACpCX,IAAK,MACLjB,KAAMA,EACNkB,KAAM,cACNpB,UAAWA,GAEXU,EAACqB,EAAAA,CACGlB,UAAU,gFACVmB,KAAK,MACLZ,KAAK,cACLa,MAAO5B,EAAKG,YACZ0B,QAAS9B,EAAgB,cAAe,SACxC+B,OAAQ/B,EAAgB,cAAe,QACvCqB,YAAaxB,GAAOyB,cAAclB,YAClC4B,YAAY,MACZC,UAAU,EACVC,aAAc,SAMtC"}

package/dist/es/components/internal/SendCopyToEmail/SendCopyToEmail.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import o from"../../../_virtual/index.js";import{useState as r}from"../../../external/preact/hooks/dist/hooks.js";import{useCoreContext as s}from"../../../core/Context/CoreProvider.js";import a from"../FormFields/Field/Field.js";import t from"../FormFields/Checkbox/Checkbox.js";import l from"../FormFields/InputEmail.js";import{getErrorMessage as m}from"../../../utils/getErrorMessage.js";function i(i){const{errors:n,value:p,onInput:c,onBlur:d}=i,{i18n:u}=s(),[f,h]=r(!1);return e("div",{className:o("adyen-checkout__fieldset","adyen-checkout__fieldset--sendCopyToEmail",i.classNames)},e(a,{classNameModifiers:["sendCopyToEmail","consentCheckbox"],name:"sendCopyToEmail",useLabelElement:!1,showErrorElement:!1},e(t,{onChange:e=>{h(e.target.checked),i.onToggle(f)},label:u.get("boleto.sendCopyToEmail"),name:"sendCopyToEmail"})),f&&e(a,{label:u.get("shopperEmail"),classNameModifiers:["shopperEmail"],errorMessage:m(u,n,u.get("shopperEmail")),name:"shopperEmail"},e(l,{name:"shopperEmail",autoCorrect:"off",spellcheck:!1,value:p,onInput:c,onBlur:d})))}export{i as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import o from"../../../_virtual/index.js";import{useState as r}from"../../../external/preact/hooks/dist/hooks.js";import{useCoreContext as s}from"../../../core/Context/CoreProvider.js";import a from"../FormFields/Field/Field.js";import t from"../FormFields/Checkbox/Checkbox.js";import l from"../FormFields/InputEmail.js";import{getErrorMessage as m}from"../../../utils/getErrorMessage.js";function i(i){const{errors:n,value:p,onInput:c,onBlur:d}=i,{i18n:u}=s(),[f,h]=r(!1);return e("div",{className:o("adyen-checkout__fieldset","adyen-checkout__fieldset--sendCopyToEmail",i.classNames)},e(a,{classNameModifiers:["sendCopyToEmail","consentCheckbox"],name:"sendCopyToEmail",useLabelElement:!1,showErrorElement:!1},e(t,{onChange:e=>{h(e.target.checked),i.onToggle(f)},label:u.get("boleto.sendCopyToEmail"),name:"sendCopyToEmail"})),f&&e(a,{label:u.get("shopperEmail"),classNameModifiers:["shopperEmail"],errorMessage:m(u,n,u.get("shopperEmail")),name:"shopperEmail"},e(l,{name:"shopperEmail",autoCorrect:"off",spellcheck:!1,value:p,onInput:c,onBlur:d,autocomplete:"email"})))}export{i as default};
 //# sourceMappingURL=SendCopyToEmail.js.map

package/dist/es/components/internal/SendCopyToEmail/SendCopyToEmail.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SendCopyToEmail.js","sources":["../../../../../src/components/internal/SendCopyToEmail/SendCopyToEmail.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\nimport { useState } from 'preact/hooks';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../FormFields/Field';\nimport Checkbox from '../FormFields/Checkbox';\nimport InputEmail from '../FormFields/InputEmail';\nimport './SendCopyToEmail.scss';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\n\nexport default function SendCopyToEmail(props) {\n const { errors, value, onInput, onBlur } = props;\n const { i18n } = useCoreContext();\n const [sendCopyToEmail, setSendCopyToEmail] = useState(false);\n\n const toggleEmailField = e => {\n setSendCopyToEmail(e.target.checked);\n props.onToggle(sendCopyToEmail);\n };\n\n return (\n <div className={cx('adyen-checkout__fieldset', 'adyen-checkout__fieldset--sendCopyToEmail', props.classNames)}>\n <Field\n classNameModifiers={['sendCopyToEmail', 'consentCheckbox']}\n name={'sendCopyToEmail'}\n useLabelElement={false}\n showErrorElement={false}\n >\n <Checkbox onChange={toggleEmailField} label={i18n.get('boleto.sendCopyToEmail')} name={'sendCopyToEmail'} />\n </Field>\n\n {sendCopyToEmail && (\n <Field\n label={i18n.get('shopperEmail')}\n classNameModifiers={['shopperEmail']}\n errorMessage={getErrorMessage(i18n, errors, i18n.get('shopperEmail'))}\n name={'shopperEmail'}\n >\n <InputEmail name={'shopperEmail'} autoCorrect={'off'} spellcheck={false} value={value} onInput={onInput} onBlur={onBlur} />\n </Field>\n )}\n </div>\n );\n}\n"],"names":["SendCopyToEmail","props","errors","value","onInput","onBlur","i18n","useCoreContext","sendCopyToEmail","setSendCopyToEmail","useState","h","div","className","cx","classNames","Field","classNameModifiers","name","useLabelElement","showErrorElement","Checkbox","onChange","e","target","checked","onToggle","label","get","errorMessage","getErrorMessage","InputEmail","autoCorrect","spellcheck"],"mappings":"8cAUe,SAASA,EAAgBC,GACpC,MAAMC,OAAEA,EAAMC,MAAEA,EAAKC,QAAEA,EAAOC,OAAEA,GAAWJ,GACrCK,KAAEA,GAASC,KACVC,EAAiBC,GAAsBC,GAAS,GAOvD,OACIC,EAACC,MAAAA,CAAIC,UAAWC,EAAG,2BAA4B,4CAA6Cb,EAAMc,aAC9FJ,EAACK,EAAAA,CACGC,mBAAoB,CAAC,kBAAmB,mBACxCC,KAAM,kBACNC,iBAAiB,EACjBC,kBAAkB,GAElBT,EAACU,EAAAA,CAASC,SAbGC,IACrBd,EAAmBc,EAAEC,OAAOC,SAC5BxB,EAAMyB,SAASlB,IAW+BmB,MAAOrB,EAAKsB,IAAI,0BAA2BV,KAAM,qBAG1FV,GACGG,EAACK,EAAAA,CACGW,MAAOrB,EAAKsB,IAAI,gBAChBX,mBAAoB,CAAC,gBACrBY,aAAcC,EAAgBxB,EAAMJ,EAAQI,EAAKsB,IAAI,iBACrDV,KAAM,gBAENP,EAACoB,EAAAA,~~CAAWb~~,KAAM,~~eAAgBc~~,YAAa,~~MAAOC~~,YAAY,~~EAAO9B~~,MAAOA,~~EAAOC~~,QAASA,~~EAASC~~,OAAQA,~~KAKrI~~"}
1	+ {"version":3,"file":"SendCopyToEmail.js","sources":["../../../../../src/components/internal/SendCopyToEmail/SendCopyToEmail.tsx"],"sourcesContent":["import { h } from 'preact';\nimport cx from 'classnames';\nimport { useState } from 'preact/hooks';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport Field from '../FormFields/Field';\nimport Checkbox from '../FormFields/Checkbox';\nimport InputEmail from '../FormFields/InputEmail';\nimport './SendCopyToEmail.scss';\nimport { getErrorMessage } from '../../../utils/getErrorMessage';\n\nexport default function SendCopyToEmail(props) {\n const { errors, value, onInput, onBlur } = props;\n const { i18n } = useCoreContext();\n const [sendCopyToEmail, setSendCopyToEmail] = useState(false);\n\n const toggleEmailField = e => {\n setSendCopyToEmail(e.target.checked);\n props.onToggle(sendCopyToEmail);\n };\n\n return (\n <div className={cx('adyen-checkout__fieldset', 'adyen-checkout__fieldset--sendCopyToEmail', props.classNames)}>\n <Field\n classNameModifiers={['sendCopyToEmail', 'consentCheckbox']}\n name={'sendCopyToEmail'}\n useLabelElement={false}\n showErrorElement={false}\n >\n <Checkbox onChange={toggleEmailField} label={i18n.get('boleto.sendCopyToEmail')} name={'sendCopyToEmail'} />\n </Field>\n\n {sendCopyToEmail && (\n <Field\n label={i18n.get('shopperEmail')}\n classNameModifiers={['shopperEmail']}\n errorMessage={getErrorMessage(i18n, errors, i18n.get('shopperEmail'))}\n name={'shopperEmail'}\n >\n <InputEmail\n name={'shopperEmail'}\n autoCorrect={'off'}\n spellcheck={false}\n value={value}\n onInput={onInput}\n onBlur={onBlur}\n autocomplete={'email'}\n />\n </Field>\n )}\n </div>\n );\n}\n"],"names":["SendCopyToEmail","props","errors","value","onInput","onBlur","i18n","useCoreContext","sendCopyToEmail","setSendCopyToEmail","useState","h","div","className","cx","classNames","Field","classNameModifiers","name","useLabelElement","showErrorElement","Checkbox","onChange","e","target","checked","onToggle","label","get","errorMessage","getErrorMessage","InputEmail","autoCorrect","spellcheck","autocomplete"],"mappings":"8cAUe,SAASA,EAAgBC,GACpC,MAAMC,OAAEA,EAAMC,MAAEA,EAAKC,QAAEA,EAAOC,OAAEA,GAAWJ,GACrCK,KAAEA,GAASC,KACVC,EAAiBC,GAAsBC,GAAS,GAOvD,OACIC,EAACC,MAAAA,CAAIC,UAAWC,EAAG,2BAA4B,4CAA6Cb,EAAMc,aAC9FJ,EAACK,EAAAA,CACGC,mBAAoB,CAAC,kBAAmB,mBACxCC,KAAM,kBACNC,iBAAiB,EACjBC,kBAAkB,GAElBT,EAACU,EAAAA,CAASC,SAbGC,IACrBd,EAAmBc,EAAEC,OAAOC,SAC5BxB,EAAMyB,SAASlB,IAW+BmB,MAAOrB,EAAKsB,IAAI,0BAA2BV,KAAM,qBAG1FV,GACGG,EAACK,EAAAA,CACGW,MAAOrB,EAAKsB,IAAI,gBAChBX,mBAAoB,CAAC,gBACrBY,aAAcC,EAAgBxB,EAAMJ,EAAQI,EAAKsB,IAAI,iBACrDV,KAAM,gBAENP,EAACoB,EAAAA,CACGb,KAAM,eACNc,YAAa,MACbC,YAAY,EACZ9B,MAAOA,EACPC,QAASA,EACTC,OAAQA,EACR6B,aAAc,WAMtC"}

package/dist/es/components/internal/SocialSecurityNumberBrazil/BrazilPersonalDetail.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import e from"../FormFields/Field/Field.js";import a from"./SocialSecurityNumberBrazil.js";import{createElement as r}from"../../../external/preact/dist/preact.js";import t from"../FormFields/InputText.js";import s from"../FormFields/Fieldset/Fieldset.js";function l(l){const{i18n:i,data:o,handleChangeFor:m,errors:c,valid:u}=l,n=e=>e&&e.errorMessage?i.get(e.errorMessage):!!e;return r("div",{className:"adyen-checkout__fieldset adyen-checkout__fieldset--address adyen-checkout__fieldset--personalDetails"},r("div",{className:"adyen-checkout__fieldset__title"},i.get("personalDetails")),r(s,null,r(e,{label:i.get("firstName"),classNameModifiers:["firstName","col-50"],errorMessage:n(c.firstName),name:"firstName"},r(t,{name:"firstName",autocorrect:"off",spellcheck:!1,value:o.firstName,onInput:m("firstName","input"),onBlur:m("firstName","blur")})),r(e,{label:i.get("lastName"),classNameModifiers:["lastName","col-50"],errorMessage:n(c.lastName),name:"lastName"},r(t,{name:"lastName",autocorrect:"off",spellcheck:!1,value:o.lastName,onInput:m("lastName","input"),onBlur:m("lastName","blur")})),r(a,{data:o.socialSecurityNumber,error:c.socialSecurityNumber,valid:u.socialSecurityNumber,onInput:m("socialSecurityNumber","input"),onBlur:m("socialSecurityNumber","blur")})))}export{l as BrazilPersonalDetail};
+import e from"../FormFields/Field/Field.js";import a from"./SocialSecurityNumberBrazil.js";import{createElement as r}from"../../../external/preact/dist/preact.js";import t from"../FormFields/InputText.js";import s from"../FormFields/Fieldset/Fieldset.js";function l(l){const{i18n:i,data:o,handleChangeFor:m,errors:c,valid:u}=l,n=e=>e&&e.errorMessage?i.get(e.errorMessage):!!e;return r("div",{className:"adyen-checkout__fieldset adyen-checkout__fieldset--address adyen-checkout__fieldset--personalDetails"},r("div",{className:"adyen-checkout__fieldset__title"},i.get("personalDetails")),r(s,null,r(e,{label:i.get("firstName"),classNameModifiers:["firstName","col-50"],errorMessage:n(c.firstName),name:"firstName"},r(t,{name:"firstName",autocorrect:"off",spellcheck:!1,value:o.firstName,onInput:m("firstName","input"),onBlur:m("firstName","blur"),autocomplete:"given-name"})),r(e,{label:i.get("lastName"),classNameModifiers:["lastName","col-50"],errorMessage:n(c.lastName),name:"lastName"},r(t,{name:"lastName",autocorrect:"off",spellcheck:!1,value:o.lastName,onInput:m("lastName","input"),onBlur:m("lastName","blur"),autocomplete:"family-name"})),r(a,{data:o.socialSecurityNumber,error:c.socialSecurityNumber,valid:u.socialSecurityNumber,onInput:m("socialSecurityNumber","input"),onBlur:m("socialSecurityNumber","blur")})))}export{l as BrazilPersonalDetail};
 //# sourceMappingURL=BrazilPersonalDetail.js.map

package/dist/es/components/internal/SocialSecurityNumberBrazil/BrazilPersonalDetail.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BrazilPersonalDetail.js","sources":["../../../../../src/components/internal/SocialSecurityNumberBrazil/BrazilPersonalDetail.tsx"],"sourcesContent":["import Field from '../FormFields/Field';\nimport SocialSecurityNumberBrazil from './SocialSecurityNumberBrazil';\nimport { h } from 'preact';\nimport InputText from '../FormFields/InputText';\nimport Fieldset from '../FormFields/Fieldset';\n\nexport function BrazilPersonalDetail(props) {\n const { i18n, data, handleChangeFor, errors, valid } = props;\n const getErrorMessage = error => (error && error.errorMessage ? i18n.get(error.errorMessage) : !!error);\n return (\n <div className={'adyen-checkout__fieldset adyen-checkout__fieldset--address adyen-checkout__fieldset--personalDetails'}>\n <div className=\"adyen-checkout__fieldset__title\">{i18n.get('personalDetails')}</div>\n\n <Fieldset>\n <Field\n label={i18n.get('firstName')}\n classNameModifiers={['firstName', 'col-50']}\n errorMessage={getErrorMessage(errors.firstName)}\n name={'firstName'}\n >\n <InputText\n name={'firstName'}\n autocorrect={'off'}\n spellcheck={false}\n value={data.firstName}\n onInput={handleChangeFor('firstName', 'input')}\n onBlur={handleChangeFor('firstName', 'blur')}\n />\n </Field>\n\n <Field\n label={i18n.get('lastName')}\n classNameModifiers={['lastName', 'col-50']}\n errorMessage={getErrorMessage(errors.lastName)}\n name={'lastName'}\n >\n <InputText\n name={'lastName'}\n autocorrect={'off'}\n spellcheck={false}\n value={data.lastName}\n onInput={handleChangeFor('lastName', 'input')}\n onBlur={handleChangeFor('lastName', 'blur')}\n />\n </Field>\n <SocialSecurityNumberBrazil\n data={data.socialSecurityNumber}\n error={errors.socialSecurityNumber}\n valid={valid.socialSecurityNumber}\n onInput={handleChangeFor('socialSecurityNumber', 'input')}\n onBlur={handleChangeFor('socialSecurityNumber', 'blur')}\n />\n </Fieldset>\n </div>\n );\n}\n"],"names":["BrazilPersonalDetail","props","i18n","data","handleChangeFor","errors","valid","getErrorMessage","error","errorMessage","get","h","div","className","Fieldset","Field","label","classNameModifiers","firstName","name","InputText","autocorrect","spellcheck","value","onInput","onBlur","lastName","SocialSecurityNumberBrazil","socialSecurityNumber"],"mappings":"+PAMO,SAASA,EAAqBC,GACjC,MAAMC,KAAEA,EAAIC,KAAEA,EAAIC,gBAAEA,EAAeC,OAAEA,EAAMC,MAAEA,GAAUL,EACjDM,EAAkBC,GAAUA,GAASA,EAAMC,aAAeP,EAAKQ,IAAIF,EAAMC,gBAAkBD,EACjG,OACIG,EAACC,MAAAA,CAAIC,UAAW,wGACZF,EAACC,MAAAA,CAAIC,UAAU,mCAAmCX,EAAKQ,IAAI,oBAE3DC,EAACG,OACGH,EAACI,EAAAA,CACGC,MAAOd,EAAKQ,IAAI,aAChBO,mBAAoB,CAAC,YAAa,UAClCR,aAAcF,EAAgBF,EAAOa,WACrCC,KAAM,aAENR,EAACS,EAAAA,CACGD,KAAM,YACNE,YAAa,MACbC,YAAY,EACZC,MAAOpB,EAAKe,UACZM,QAASpB,EAAgB,YAAa,SACtCqB,OAAQrB,EAAgB,YAAa,~~WAI7CO~~,EAACI,EAAAA,CACGC,MAAOd,EAAKQ,IAAI,YAChBO,mBAAoB,CAAC,WAAY,UACjCR,aAAcF,EAAgBF,~~EAAOqB~~,~~UACrCP~~,KAAM,YAENR,EAACS,EAAAA,CACGD,KAAM,WACNE,YAAa,MACbC,YAAY,EACZC,MAAOpB,~~EAAKuB~~,~~SACZF~~,QAASpB,EAAgB,WAAY,SACrCqB,OAAQrB,EAAgB,WAAY,~~WAG5CO~~,~~EAACgB~~,EAAAA,~~CACGxB~~,KAAMA,~~EAAKyB~~,~~qBACXpB~~,MAAOH,~~EAAOuB~~,~~qBACdtB~~,MAAOA,~~EAAMsB~~,~~qBACbJ~~,QAASpB,EAAgB,uBAAwB,SACjDqB,OAAQrB,EAAgB,uBAAwB,WAKpE"}
1	+ {"version":3,"file":"BrazilPersonalDetail.js","sources":["../../../../../src/components/internal/SocialSecurityNumberBrazil/BrazilPersonalDetail.tsx"],"sourcesContent":["import Field from '../FormFields/Field';\nimport SocialSecurityNumberBrazil from './SocialSecurityNumberBrazil';\nimport { h } from 'preact';\nimport InputText from '../FormFields/InputText';\nimport Fieldset from '../FormFields/Fieldset';\n\nexport function BrazilPersonalDetail(props) {\n const { i18n, data, handleChangeFor, errors, valid } = props;\n const getErrorMessage = error => (error && error.errorMessage ? i18n.get(error.errorMessage) : !!error);\n return (\n <div className={'adyen-checkout__fieldset adyen-checkout__fieldset--address adyen-checkout__fieldset--personalDetails'}>\n <div className=\"adyen-checkout__fieldset__title\">{i18n.get('personalDetails')}</div>\n\n <Fieldset>\n <Field\n label={i18n.get('firstName')}\n classNameModifiers={['firstName', 'col-50']}\n errorMessage={getErrorMessage(errors.firstName)}\n name={'firstName'}\n >\n <InputText\n name={'firstName'}\n autocorrect={'off'}\n spellcheck={false}\n value={data.firstName}\n onInput={handleChangeFor('firstName', 'input')}\n onBlur={handleChangeFor('firstName', 'blur')}\n autocomplete={'given-name'}\n />\n </Field>\n\n <Field\n label={i18n.get('lastName')}\n classNameModifiers={['lastName', 'col-50']}\n errorMessage={getErrorMessage(errors.lastName)}\n name={'lastName'}\n >\n <InputText\n name={'lastName'}\n autocorrect={'off'}\n spellcheck={false}\n value={data.lastName}\n onInput={handleChangeFor('lastName', 'input')}\n onBlur={handleChangeFor('lastName', 'blur')}\n autocomplete={'family-name'}\n />\n </Field>\n <SocialSecurityNumberBrazil\n data={data.socialSecurityNumber}\n error={errors.socialSecurityNumber}\n valid={valid.socialSecurityNumber}\n onInput={handleChangeFor('socialSecurityNumber', 'input')}\n onBlur={handleChangeFor('socialSecurityNumber', 'blur')}\n />\n </Fieldset>\n </div>\n );\n}\n"],"names":["BrazilPersonalDetail","props","i18n","data","handleChangeFor","errors","valid","getErrorMessage","error","errorMessage","get","h","div","className","Fieldset","Field","label","classNameModifiers","firstName","name","InputText","autocorrect","spellcheck","value","onInput","onBlur","autocomplete","lastName","SocialSecurityNumberBrazil","socialSecurityNumber"],"mappings":"+PAMO,SAASA,EAAqBC,GACjC,MAAMC,KAAEA,EAAIC,KAAEA,EAAIC,gBAAEA,EAAeC,OAAEA,EAAMC,MAAEA,GAAUL,EACjDM,EAAkBC,GAAUA,GAASA,EAAMC,aAAeP,EAAKQ,IAAIF,EAAMC,gBAAkBD,EACjG,OACIG,EAACC,MAAAA,CAAIC,UAAW,wGACZF,EAACC,MAAAA,CAAIC,UAAU,mCAAmCX,EAAKQ,IAAI,oBAE3DC,EAACG,OACGH,EAACI,EAAAA,CACGC,MAAOd,EAAKQ,IAAI,aAChBO,mBAAoB,CAAC,YAAa,UAClCR,aAAcF,EAAgBF,EAAOa,WACrCC,KAAM,aAENR,EAACS,EAAAA,CACGD,KAAM,YACNE,YAAa,MACbC,YAAY,EACZC,MAAOpB,EAAKe,UACZM,QAASpB,EAAgB,YAAa,SACtCqB,OAAQrB,EAAgB,YAAa,QACrCsB,aAAc,gBAItBf,EAACI,EAAAA,CACGC,MAAOd,EAAKQ,IAAI,YAChBO,mBAAoB,CAAC,WAAY,UACjCR,aAAcF,EAAgBF,EAAOsB,UACrCR,KAAM,YAENR,EAACS,EAAAA,CACGD,KAAM,WACNE,YAAa,MACbC,YAAY,EACZC,MAAOpB,EAAKwB,SACZH,QAASpB,EAAgB,WAAY,SACrCqB,OAAQrB,EAAgB,WAAY,QACpCsB,aAAc,iBAGtBf,EAACiB,EAAAA,CACGzB,KAAMA,EAAK0B,qBACXrB,MAAOH,EAAOwB,qBACdvB,MAAOA,EAAMuB,qBACbL,QAASpB,EAAgB,uBAAwB,SACjDqB,OAAQrB,EAAgB,uBAAwB,WAKpE"}

package/dist/es/components/internal/SocialSecurityNumberBrazil/SocialSecurityNumberBrazil.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../FormFields/Field/Field.js";import{useCoreContext as o}from"../../../core/Context/CoreProvider.js";import l from"../FormFields/InputText.js";const i=({onBlur:i,onInput:t,valid:s=!1,error:a=null,data:u="",required:c=!1,disabled:n=!1,onFieldFocusAnalytics:m=null,onFieldBlurAnalytics:d=null})=>{const{i18n:p}=o();return e(r,{label:`${p.get("boleto.socialSecurityNumber")}`,classNameModifiers:["socialSecurityNumber"],errorMessage:a&&a.errorMessage?p.get(a.errorMessage):!!a,isValid:Boolean(s),name:"socialSecurityNumber",onFocus:e=>m?.("socialSecurityNumber",e),onBlur:e=>d?.("socialSecurityNumber",e)},e(l,{name:"socialSecurityNumber",autocorrect:"off",spellcheck:!1,value:u,maxlength:18,onInput:t,onBlur:i,required:c,disabled:n}))};export{i as default};
+import{createElement as e}from"../../../external/preact/dist/preact.js";import r from"../FormFields/Field/Field.js";import{useCoreContext as o}from"../../../core/Context/CoreProvider.js";import l from"../FormFields/InputText.js";const t=({onBlur:t,onInput:i,valid:a=!1,error:s=null,data:u="",required:c=!1,disabled:n=!1,onFieldFocusAnalytics:m=null,onFieldBlurAnalytics:d=null})=>{const{i18n:p}=o();return e(r,{label:`${p.get("boleto.socialSecurityNumber")}`,classNameModifiers:["socialSecurityNumber"],errorMessage:s&&s.errorMessage?p.get(s.errorMessage):!!s,isValid:Boolean(a),name:"socialSecurityNumber",onFocus:e=>m?.("socialSecurityNumber",e),onBlur:e=>d?.("socialSecurityNumber",e)},e(l,{name:"socialSecurityNumber",autocorrect:"off",spellcheck:!1,value:u,maxlength:18,onInput:i,onBlur:t,required:c,disabled:n,autocomplete:void 0}))};export{t as default};
 //# sourceMappingURL=SocialSecurityNumberBrazil.js.map

package/dist/es/components/internal/SocialSecurityNumberBrazil/SocialSecurityNumberBrazil.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SocialSecurityNumberBrazil.js","sources":["../../../../../src/components/internal/SocialSecurityNumberBrazil/SocialSecurityNumberBrazil.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../FormFields/InputText';\n\nconst SocialSecurityNumberBrazil = ({\n onBlur,\n onInput,\n valid = false,\n error = null,\n data = '',\n required = false,\n disabled = false,\n onFieldFocusAnalytics = null,\n onFieldBlurAnalytics = null\n}) => {\n const { i18n } = useCoreContext();\n\n return (\n <Field\n label={`${i18n.get('boleto.socialSecurityNumber')}`}\n classNameModifiers={['socialSecurityNumber']}\n errorMessage={error && error.errorMessage ? i18n.get(error.errorMessage) : !!error}\n isValid={Boolean(valid)}\n name={'socialSecurityNumber'}\n onFocus={e => onFieldFocusAnalytics?.('socialSecurityNumber', e)}\n onBlur={e => onFieldBlurAnalytics?.('socialSecurityNumber', e)}\n >\n <InputText\n name={'socialSecurityNumber'}\n autocorrect={'off'}\n spellcheck={false}\n value={data}\n maxlength={18}\n onInput={onInput}\n onBlur={onBlur}\n required={required}\n disabled={disabled}\n />\n </Field>\n );\n};\n\nexport default SocialSecurityNumberBrazil;\n"],"names":["SocialSecurityNumberBrazil","onBlur","onInput","valid","error","data","required","disabled","onFieldFocusAnalytics","onFieldBlurAnalytics","i18n","useCoreContext","h","Field","label","get","classNameModifiers","errorMessage","isValid","Boolean","name","onFocus","e","InputText","autocorrect","spellcheck","value","maxlength"],"mappings":"qOAKA,MAAMA,EAA6B,EAC/BC,SACAC,UACAC,SAAQ,EACRC,QAAQ,KACRC,OAAO,GACPC,YAAW,EACXC,YAAW,EACXC,wBAAwB,KACxBC,uBAAuB,SAEvB,MAAMC,KAAEA,GAASC,IAEjB,OACIC,EAACC,EAAAA,CACGC,MAAO,GAAGJ,EAAKK,IAAI,iCACnBC,mBAAoB,CAAC,wBACrBC,aAAcb,GAASA,EAAMa,aAAeP,EAAKK,IAAIX,EAAMa,gBAAkBb,EAC7Ec,QAASC,QAAQhB,GACjBiB,KAAM,uBACNC,QAASC,GAAKd,IAAwB,uBAAwBc,GAC9DrB,OAAQqB,GAAKb,IAAuB,uBAAwBa,IAE5DV,EAACW,EAAAA,CACGH,KAAM,uBACNI,YAAa,MACbC,YAAY,EACZC,MAAOrB,EACPsB,UAAW,GACXzB,QAASA,EACTD,OAAQA,EACRK,SAAUA,EACVC,SAAUA"}
1	+ {"version":3,"file":"SocialSecurityNumberBrazil.js","sources":["../../../../../src/components/internal/SocialSecurityNumberBrazil/SocialSecurityNumberBrazil.tsx"],"sourcesContent":["import { h } from 'preact';\nimport Field from '../../internal/FormFields/Field';\nimport { useCoreContext } from '../../../core/Context/CoreProvider';\nimport InputText from '../FormFields/InputText';\n\nconst SocialSecurityNumberBrazil = ({\n onBlur,\n onInput,\n valid = false,\n error = null,\n data = '',\n required = false,\n disabled = false,\n onFieldFocusAnalytics = null,\n onFieldBlurAnalytics = null\n}) => {\n const { i18n } = useCoreContext();\n\n return (\n <Field\n label={`${i18n.get('boleto.socialSecurityNumber')}`}\n classNameModifiers={['socialSecurityNumber']}\n errorMessage={error && error.errorMessage ? i18n.get(error.errorMessage) : !!error}\n isValid={Boolean(valid)}\n name={'socialSecurityNumber'}\n onFocus={e => onFieldFocusAnalytics?.('socialSecurityNumber', e)}\n onBlur={e => onFieldBlurAnalytics?.('socialSecurityNumber', e)}\n >\n <InputText\n name={'socialSecurityNumber'}\n autocorrect={'off'}\n spellcheck={false}\n value={data}\n maxlength={18}\n onInput={onInput}\n onBlur={onBlur}\n required={required}\n disabled={disabled}\n autocomplete={undefined}\n />\n </Field>\n );\n};\n\nexport default SocialSecurityNumberBrazil;\n"],"names":["SocialSecurityNumberBrazil","onBlur","onInput","valid","error","data","required","disabled","onFieldFocusAnalytics","onFieldBlurAnalytics","i18n","useCoreContext","h","Field","label","get","classNameModifiers","errorMessage","isValid","Boolean","name","onFocus","e","InputText","autocorrect","spellcheck","value","maxlength","autocomplete","undefined"],"mappings":"qOAKA,MAAMA,EAA6B,EAC/BC,SACAC,UACAC,SAAQ,EACRC,QAAQ,KACRC,OAAO,GACPC,YAAW,EACXC,YAAW,EACXC,wBAAwB,KACxBC,uBAAuB,SAEvB,MAAMC,KAAEA,GAASC,IAEjB,OACIC,EAACC,EAAAA,CACGC,MAAO,GAAGJ,EAAKK,IAAI,iCACnBC,mBAAoB,CAAC,wBACrBC,aAAcb,GAASA,EAAMa,aAAeP,EAAKK,IAAIX,EAAMa,gBAAkBb,EAC7Ec,QAASC,QAAQhB,GACjBiB,KAAM,uBACNC,QAASC,GAAKd,IAAwB,uBAAwBc,GAC9DrB,OAAQqB,GAAKb,IAAuB,uBAAwBa,IAE5DV,EAACW,EAAAA,CACGH,KAAM,uBACNI,YAAa,MACbC,YAAY,EACZC,MAAOrB,EACPsB,UAAW,GACXzB,QAASA,EACTD,OAAQA,EACRK,SAAUA,EACVC,SAAUA,EACVqB,kBAAcC"}

package/dist/es/core/config.js CHANGED Viewed

@@ -1,2 +1,2 @@
-function e(e,n){if(null==e)throw new Error(n);return e}const n="https://checkoutshopper-live.adyen.com/checkoutshopper/",o=e("6.38.0","LIBRARY_VERSION is not defined"),t=e("esm","BUNDLE_TYPE is not defined"),r=["amount","secondaryAmount","countryCode","environment","_environmentUrls","loadingContext","i18n","modules","order","session","clientKey","showPayButton","redirectFromTopWhenInIframe","donation","onPaymentCompleted","onPaymentFailed","beforeRedirect","beforeSubmit","onSubmit","onActionHandled","onAdditionalDetails","onChange","onEnterKeyPressed","onError","onBalanceCheck","onOrderCancel","onOrderRequest","onOrderUpdated","onPaymentMethodsRequest"],i=6e4;var d=function(e){return e.WEB="web",e}({});const a="web";var s=function(e){return e.NATIVE="nativeComponent",e.GENERIC="genericComponent",e}({});export{d as CHANNEL,i as DEFAULT_HTTP_TIMEOUT,n as FALLBACK_CONTEXT,r as GENERIC_OPTIONS,t as LIBRARY_BUNDLE_TYPE,o as LIBRARY_VERSION,s as PAYMENT_METHOD_BEHAVIOR,a as PLATFORM};
+function e(e,n){if(null==e)throw new Error(n);return e}const n="https://checkoutshopper-live.adyen.com/checkoutshopper/",o=e("6.40.0","LIBRARY_VERSION is not defined"),t=e("esm","BUNDLE_TYPE is not defined"),r=["amount","secondaryAmount","countryCode","environment","_environmentUrls","loadingContext","i18n","modules","order","session","clientKey","showPayButton","redirectFromTopWhenInIframe","donation","onPaymentCompleted","onPaymentFailed","beforeRedirect","beforeSubmit","onSubmit","onActionHandled","onAdditionalDetails","onChange","onEnterKeyPressed","onError","onBalanceCheck","onOrderCancel","onOrderRequest","onOrderUpdated","onPaymentMethodsRequest"],i=6e4;var d=function(e){return e.WEB="web",e}({});const a="web";var s=function(e){return e.NATIVE="nativeComponent",e.GENERIC="genericComponent",e}({});export{d as CHANNEL,i as DEFAULT_HTTP_TIMEOUT,n as FALLBACK_CONTEXT,r as GENERIC_OPTIONS,t as LIBRARY_BUNDLE_TYPE,o as LIBRARY_VERSION,s as PAYMENT_METHOD_BEHAVIOR,a as PLATFORM};
 //# sourceMappingURL=config.js.map

package/dist/es/external/preact/dist/preact.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e,n,t,_,l,o,r,u,i,s,c,f,p,a,h,d={},v=[],y=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,m=Array.isArray;function g(e,n){for(var t in n)e[t]=n[t];return e}function k(e){e&&e.parentNode&&e.parentNode.removeChild(e)}function b(n,t,_){var l,o,r,u={};for(r in t)"key"==r?l=t[r]:"ref"==r?o=t[r]:u[r]=t[r];if(arguments.length>2&&(u.children=arguments.length>3?e.call(arguments,2):_),"function"==typeof n&&null!=n.defaultProps)for(r in n.defaultProps)void 0===u[r]&&(u[r]=n.defaultProps[r]);return w(n,u,l,o,null)}function w(e,_,l,o,r){var u={type:e,props:_,key:l,ref:o,__k:null,__:null,__b:0,__e:null,__c:null,constructor:void 0,__v:null==r?++t:r,__i:-1,__u:0};return null==r&&null!=n.vnode&&n.vnode(u),u}function x(){return{current:null}}function C(e){return e.children}function P(e,n){this.props=e,this.context=n}function S(e,n){if(null==n)return e.__?S(e.__,e.__i+1):null;for(var t;n<e.__k.length;n++)if(null!=(t=e.__k[n])&&null!=t.__e)return t.__e;return"function"==typeof e.type?S(e):null}function U(e){if(e.__P&&e.__d){var t=e.__v,_=t.__e,l=[],o=[],r=g({},t);r.__v=t.__v+1,n.vnode&&n.vnode(r),I(e.__P,r,t,e.__n,e.__P.namespaceURI,32&t.__u?[_]:null,l,null==_?S(t):_,!!(32&t.__u),o),r.__v=t.__v,r.__.__k[r.__i]=r,B(l,r,o),t.__e=t.__=null,r.__e!=_&&T(r)}}function T(e){if(null!=(e=e.__)&&null!=e.__c)return e.__e=e.__c.base=null,e.__k.some(function(n){if(null!=n&&null!=n.__e)return e.__e=e.__c.base=n.__e}),T(e)}function M(e){(!e.__d&&(e.__d=!0)&&_.push(e)&&!D.__r++||l!=n.debounceRendering)&&((l=n.debounceRendering)||o)(D)}function D(){try{for(var e,n=1;_.length;)_.length>n&&_.sort(r),e=_.shift(),n=_.length,U(e)}finally{_.length=D.__r=0}}function E(e,n,t,_,l,o,r,u,i,s,c){var f,p,a,h,y,m,g,k=_&&_.__k||v,b=n.length;for(i=W(t,n,k,i,b),f=0;f<b;f++)null!=(a=t.__k[f])&&(p=-1!=a.__i&&k[a.__i]||d,a.__i=f,m=I(e,a,p,l,o,r,u,i,s,c),h=a.__e,a.ref&&p.ref!=a.ref&&(p.ref&&z(p.ref,null,a),c.push(a.ref,a.__c||h,a)),null==y&&null!=h&&(y=h),(g=!!(4&a.__u))||p.__k===a.__k?(i=F(a,i,e,g),g&&p.__e&&(p.__e=null)):"function"==typeof a.type&&void 0!==m?i=m:h&&(i=h.nextSibling),a.__u&=-7);return t.__e=y,i}function W(e,n,t,_,l){var o,r,u,i,s,c=t.length,f=c,p=0;for(e.__k=new Array(l),o=0;o<l;o++)null!=(r=n[o])&&"boolean"!=typeof r&&"function"!=typeof r?("string"==typeof r||"number"==typeof r||"bigint"==typeof r||r.constructor==String?r=e.__k[o]=w(null,r,null,null,null):m(r)?r=e.__k[o]=w(C,{children:r},null,null,null):void 0===r.constructor&&r.__b>0?r=e.__k[o]=w(r.type,r.props,r.key,r.ref?r.ref:null,r.__v):e.__k[o]=r,i=o+p,r.__=e,r.__b=e.__b+1,u=null,-1!=(s=r.__i=N(r,t,i,f))&&(f--,(u=t[s])&&(u.__u|=2)),null==u||null==u.__v?(-1==s&&(l>c?p--:l<c&&p++),"function"!=typeof r.type&&(r.__u|=4)):s!=i&&(s==i-1?p--:s==i+1?p++:(s>i?p--:p++,r.__u|=4))):e.__k[o]=null;if(f)for(o=0;o<c;o++)null!=(u=t[o])&&!(2&u.__u)&&(u.__e==_&&(_=S(u)),V(u,u));return _}function F(e,n,t,_){var l,o;if("function"==typeof e.type){for(l=e.__k,o=0;l&&o<l.length;o++)l[o]&&(l[o].__=e,n=F(l[o],n,t,_));return n}e.__e!=n&&(_&&(n&&e.type&&!n.parentNode&&(n=S(e)),t.insertBefore(e.__e,n||null)),n=e.__e);do{n=n&&n.nextSibling}while(null!=n&&8==n.nodeType);return n}function L(e,n){return n=n||[],null==e||"boolean"==typeof e||(m(e)?e.some(function(e){L(e,n)}):n.push(e)),n}function N(e,n,t,_){var l,o,r,u=e.key,i=e.type,s=n[t],c=null!=s&&!(2&s.__u);if(null===s&&null==u||c&&u==s.key&&i==s.type)return t;if(_>(c?1:0))for(l=t-1,o=t+1;l>=0||o<n.length;)if(null!=(s=n[r=l>=0?l--:o++])&&!(2&s.__u)&&u==s.key&&i==s.type)return r;return-1}function A(e,n,t){"-"==n[0]?e.setProperty(n,null==t?"":t):e[n]=null==t?"":"number"!=typeof t||y.test(n)?t:t+"px"}function R(e,n,t,_,l){var o,r;e:if("style"==n)if("string"==typeof t)e.style.cssText=t;else{if("string"==typeof _&&(e.style.cssText=_=""),_)for(n in _)t&&n in t||A(e.style,n,"");if(t)for(n in t)_&&t[n]==_[n]||A(e.style,n,t[n])}else if("o"==n[0]&&"n"==n[1])o=n!=(n=n.replace(c,"$1")),r=n.toLowerCase(),n=r in e||"onFocusOut"==n||"onFocusIn"==n?r.slice(2):n.slice(2),e.l||(e.l={}),e.l[n+o]=t,t?_?t[s]=_[s]:(t[s]=f,e.addEventListener(n,o?a:p,o)):e.removeEventListener(n,o?a:p,o);else{if("http://www.w3.org/2000/svg"==l)n=n.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if("width"!=n&&"height"!=n&&"href"!=n&&"list"!=n&&"form"!=n&&"tabIndex"!=n&&"download"!=n&&"rowSpan"!=n&&"colSpan"!=n&&"role"!=n&&"popover"!=n&&n in e)try{e[n]=null==t?"":t;break e}catch(e){}"function"==typeof t||(null==t||!1===t&&"-"!=n[4]?e.removeAttribute(n):e.setAttribute(n,"popover"==n&&1==t?"":t))}}function H(e){return function(t){if(this.l){var _=this.l[t.type+e];if(null==t[i])t[i]=f++;else if(t[i]<_[s])return;return _(n.event?n.event(t):t)}}}function I(e,t,_,l,o,r,u,i,s,c){var f,p,a,h,d,y,b,w,x,S,U,T,M,D,W,F=t.type;if(void 0!==t.constructor)return null;128&_.__u&&(s=!!(32&_.__u),r=[i=t.__e=_.__e]),(f=n.__b)&&f(t);e:if("function"==typeof F)try{if(w=t.props,x=F.prototype&&F.prototype.render,S=(f=F.contextType)&&l[f.__c],U=f?S?S.props.value:f.__:l,_.__c?b=(p=t.__c=_.__c).__=p.__E:(x?t.__c=p=new F(w,U):(t.__c=p=new P(w,U),p.constructor=F,p.render=q),S&&S.sub(p),p.state||(p.state={}),p.__n=l,a=p.__d=!0,p.__h=[],p._sb=[]),x&&null==p.__s&&(p.__s=p.state),x&&null!=F.getDerivedStateFromProps&&(p.__s==p.state&&(p.__s=g({},p.__s)),g(p.__s,F.getDerivedStateFromProps(w,p.__s))),h=p.props,d=p.state,p.__v=t,a)x&&null==F.getDerivedStateFromProps&&null!=p.componentWillMount&&p.componentWillMount(),x&&null!=p.componentDidMount&&p.__h.push(p.componentDidMount);else{if(x&&null==F.getDerivedStateFromProps&&w!==h&&null!=p.componentWillReceiveProps&&p.componentWillReceiveProps(w,U),t.__v==_.__v||!p.__e&&null!=p.shouldComponentUpdate&&!1===p.shouldComponentUpdate(w,p.__s,U)){t.__v!=_.__v&&(p.props=w,p.state=p.__s,p.__d=!1),t.__e=_.__e,t.__k=_.__k,t.__k.some(function(e){e&&(e.__=t)}),v.push.apply(p.__h,p._sb),p._sb=[],p.__h.length&&u.push(p);break e}null!=p.componentWillUpdate&&p.componentWillUpdate(w,p.__s,U),x&&null!=p.componentDidUpdate&&p.__h.push(function(){p.componentDidUpdate(h,d,y)})}if(p.context=U,p.props=w,p.__P=e,p.__e=!1,T=n.__r,M=0,x)p.state=p.__s,p.__d=!1,T&&T(t),f=p.render(p.props,p.state,p.context),v.push.apply(p.__h,p._sb),p._sb=[];else do{p.__d=!1,T&&T(t),f=p.render(p.props,p.state,p.context),p.state=p.__s}while(p.__d&&++M<25);p.state=p.__s,null!=p.getChildContext&&(l=g(g({},l),p.getChildContext())),x&&!a&&null!=p.getSnapshotBeforeUpdate&&(y=p.getSnapshotBeforeUpdate(h,d)),D=null!=f&&f.type===C&&null==f.key?O(f.props.children):f,i=E(e,m(D)?D:[D],t,_,l,o,r,u,i,s,c),p.base=t.__e,t.__u&=-161,p.__h.length&&u.push(p),b&&(p.__E=p.__=null)}catch(e){if(t.__v=null,s||null!=r)if(e.then){for(t.__u|=s?160:128;i&&8==i.nodeType&&i.nextSibling;)i=i.nextSibling;r[r.indexOf(i)]=null,t.__e=i}else{for(W=r.length;W--;)k(r[W]);$(t)}else t.__e=_.__e,t.__k=_.__k,e.then||$(t);n.__e(e,t,_)}else null==r&&t.__v==_.__v?(t.__k=_.__k,t.__e=_.__e):i=t.__e=j(_.__e,t,_,l,o,r,u,s,c);return(f=n.diffed)&&f(t),128&t.__u?void 0:i}function $(e){e&&(e.__c&&(e.__c.__e=!0),e.__k&&e.__k.some($))}function B(e,t,_){for(var l=0;l<_.length;l++)z(_[l],_[++l],_[++l]);n.__c&&n.__c(t,e),e.some(function(t){try{e=t.__h,t.__h=[],e.some(function(e){e.call(t)})}catch(e){n.__e(e,t.__v)}})}function O(e){return"object"!=typeof e||null==e||e.__b>0?e:m(e)?e.map(O):g({},e)}function j(t,_,l,o,r,u,i,s,c){var f,p,a,h,v,y,g,b=l.props||d,w=_.props,x=_.type;if("svg"==x?r="http://www.w3.org/2000/svg":"math"==x?r="http://www.w3.org/1998/Math/MathML":r||(r="http://www.w3.org/1999/xhtml"),null!=u)for(f=0;f<u.length;f++)if((v=u[f])&&"setAttribute"in v==!!x&&(x?v.localName==x:3==v.nodeType)){t=v,u[f]=null;break}if(null==t){if(null==x)return document.createTextNode(w);t=document.createElementNS(r,x,w.is&&w),s&&(n.__m&&n.__m(_,u),s=!1),u=null}if(null==x)b===w||s&&t.data==w||(t.data=w);else{if(u=u&&e.call(t.childNodes),!s&&null!=u)for(b={},f=0;f<t.attributes.length;f++)b[(v=t.attributes[f]).name]=v.value;for(f in b)v=b[f],"dangerouslySetInnerHTML"==f?a=v:"children"==f||f in w||"value"==f&&"defaultValue"in w||"checked"==f&&"defaultChecked"in w||R(t,f,null,v,r);for(f in w)v=w[f],"children"==f?h=v:"dangerouslySetInnerHTML"==f?p=v:"value"==f?y=v:"checked"==f?g=v:s&&"function"!=typeof v||b[f]===v||R(t,f,v,b[f],r);if(p)s||a&&(p.__html==a.__html||p.__html==t.innerHTML)||(t.innerHTML=p.__html),_.__k=[];else if(a&&(t.innerHTML=""),E("template"==_.type?t.content:t,m(h)?h:[h],_,l,o,"foreignObject"==x?"http://www.w3.org/1999/xhtml":r,u,i,u?u[0]:l.__k&&S(l,0),s,c),null!=u)for(f=u.length;f--;)k(u[f]);s||(f="value","progress"==x&&null==y?t.removeAttribute("value"):null!=y&&(y!==t[f]||"progress"==x&&!y||"option"==x&&y!=b[f])&&R(t,f,y,b[f],r),f="checked",null!=g&&g!=t[f]&&R(t,f,g,b[f],r))}return t}function z(e,t,_){try{if("function"==typeof e){var l="function"==typeof e.__u;l&&e.__u(),l&&null==t||(e.__u=e(t))}else e.current=t}catch(e){n.__e(e,_)}}function V(e,t,_){var l,o;if(n.unmount&&n.unmount(e),(l=e.ref)&&(l.current&&l.current!=e.__e||z(l,null,t)),null!=(l=e.__c)){if(l.componentWillUnmount)try{l.componentWillUnmount()}catch(e){n.__e(e,t)}l.base=l.__P=null}if(l=e.__k)for(o=0;o<l.length;o++)l[o]&&V(l[o],t,_||"function"!=typeof e.type);_||k(e.__e),e.__c=e.__=e.__e=void 0}function q(e,n,t){return this.constructor(e,t)}function G(t,_,l){var o,r,u;_==document&&(_=document.documentElement),n.__&&n.__(t,_),o=!1?null:_.__k,r=[],u=[],I(_,t=_.__k=b(C,null,[t]),o||d,d,_.namespaceURI,o?null:_.firstChild?e.call(_.childNodes):null,r,o?o.__e:_.firstChild,false,u),B(r,t,u)}function J(n,t,_){var l,o,r,u,i=g({},n.props);for(r in n.type&&n.type.defaultProps&&(u=n.type.defaultProps),t)"key"==r?l=t[r]:"ref"==r?o=t[r]:i[r]=void 0===t[r]&&null!=u?u[r]:t[r];return arguments.length>2&&(i.children=arguments.length>3?e.call(arguments,2):_),w(n.type,i,l||n.key,o||n.ref,null)}function K(e){function n(e){var t,_;return this.getChildContext||(t=new Set,(_={})[n.__c]=this,this.getChildContext=function(){return _},this.componentWillUnmount=function(){t=null},this.shouldComponentUpdate=function(e){this.props.value!=e.value&&t.forEach(function(e){e.__e=!0,M(e)})},this.sub=function(e){t.add(e);var n=e.componentWillUnmount;e.componentWillUnmount=function(){t&&t.delete(e),n&&n.call(e)}}),e.children}return n.__c="__cC"+h++,n.__=e,n.Provider=n.__l=(n.Consumer=function(e,n){return e.children(n)}).contextType=n,n}e=v.slice,n={__e:function(e,n,t,_){for(var l,o,r;n=n.__;)if((l=n.__c)&&!l.__)try{if((o=l.constructor)&&null!=o.getDerivedStateFromError&&(l.setState(o.getDerivedStateFromError(e)),r=l.__d),null!=l.componentDidCatch&&(l.componentDidCatch(e,_||{}),r=l.__d),r)return l.__E=l}catch(n){e=n}throw e}},t=0,P.prototype.setState=function(e,n){var t;t=null!=this.__s&&this.__s!=this.state?this.__s:this.__s=g({},this.state),"function"==typeof e&&(e=e(g({},t),this.props)),e&&g(t,e),null!=e&&this.__v&&(n&&this._sb.push(n),M(this))},P.prototype.forceUpdate=function(e){this.__v&&(this.__e=!0,e&&this.__h.push(e),M(this))},P.prototype.render=C,_=[],o="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,r=function(e,n){return e.__v.__b-n.__v.__b},D.__r=0,u=Math.random().toString(8),i="__d"+u,s="__a"+u,c=/(PointerCapture)$|Capture$/i,f=0,p=H(!1),a=H(!0),h=0;export{P as Component,C as Fragment,J as cloneElement,K as createContext,b as createElement,x as createRef,b as h,n as options,G as render,L as toChildArray};
+var e,n,t,_,l,o,r,u,i,s,c,f,p,a,h,d={},v=[],y=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,m=Array.isArray;function g(e,n){for(var t in n)e[t]=n[t];return e}function k(e){e&&e.parentNode&&e.parentNode.removeChild(e)}function b(n,t,_){var l,o,r,u={};for(r in t)"key"==r?l=t[r]:"ref"==r?o=t[r]:u[r]=t[r];if(arguments.length>2&&(u.children=arguments.length>3?e.call(arguments,2):_),"function"==typeof n&&null!=n.defaultProps)for(r in n.defaultProps)void 0===u[r]&&(u[r]=n.defaultProps[r]);return w(n,u,l,o,null)}function w(e,_,l,o,r){var u={type:e,props:_,key:l,ref:o,__k:null,__:null,__b:0,__e:null,__c:null,constructor:void 0,__v:null==r?++t:r,__i:-1,__u:0};return null==r&&null!=n.vnode&&n.vnode(u),u}function x(){return{current:null}}function C(e){return e.children}function P(e,n){this.props=e,this.context=n}function S(e,n){if(null==n)return e.__?S(e.__,e.__i+1):null;for(var t;n<e.__k.length;n++)if(null!=(t=e.__k[n])&&null!=t.__e)return t.__e;return"function"==typeof e.type?S(e):null}function U(e){if(e.__P&&e.__d){var t=e.__v,_=t.__e,l=[],o=[],r=g({},t);r.__v=t.__v+1,n.vnode&&n.vnode(r),I(e.__P,r,t,e.__n,e.__P.namespaceURI,32&t.__u?[_]:null,l,null==_?S(t):_,!!(32&t.__u),o),r.__v=t.__v,r.__.__k[r.__i]=r,B(l,r,o),t.__e=t.__=null,r.__e!=_&&T(r)}}function T(e){if(null!=(e=e.__)&&null!=e.__c)return e.__e=e.__c.base=null,e.__k.some(function(n){if(null!=n&&null!=n.__e)return e.__e=e.__c.base=n.__e}),T(e)}function M(e){(!e.__d&&(e.__d=!0)&&_.push(e)&&!D.__r++||l!=n.debounceRendering)&&((l=n.debounceRendering)||o)(D)}function D(){try{for(var e,n=1;_.length;)_.length>n&&_.sort(r),e=_.shift(),n=_.length,U(e)}finally{_.length=D.__r=0}}function E(e,n,t,_,l,o,r,u,i,s,c){var f,p,a,h,y,m,g,k=_&&_.__k||v,b=n.length;for(i=W(t,n,k,i,b),f=0;f<b;f++)null!=(a=t.__k[f])&&(p=-1!=a.__i&&k[a.__i]||d,a.__i=f,m=I(e,a,p,l,o,r,u,i,s,c),h=a.__e,a.ref&&p.ref!=a.ref&&(p.ref&&V(p.ref,null,a),c.push(a.ref,a.__c||h,a)),null==y&&null!=h&&(y=h),(g=!!(4&a.__u))||p.__k===a.__k?(i=F(a,i,e,g),g&&p.__e&&(p.__e=null)):"function"==typeof a.type&&void 0!==m?i=m:h&&(i=h.nextSibling),a.__u&=-7);return t.__e=y,i}function W(e,n,t,_,l){var o,r,u,i,s,c=t.length,f=c,p=0;for(e.__k=new Array(l),o=0;o<l;o++)null!=(r=n[o])&&"boolean"!=typeof r&&"function"!=typeof r?("string"==typeof r||"number"==typeof r||"bigint"==typeof r||r.constructor==String?r=e.__k[o]=w(null,r,null,null,null):m(r)?r=e.__k[o]=w(C,{children:r},null,null,null):void 0===r.constructor&&r.__b>0?r=e.__k[o]=w(r.type,r.props,r.key,r.ref?r.ref:null,r.__v):e.__k[o]=r,i=o+p,r.__=e,r.__b=e.__b+1,u=null,-1!=(s=r.__i=N(r,t,i,f))&&(f--,(u=t[s])&&(u.__u|=2)),null==u||null==u.__v?(-1==s&&(l>c?p--:l<c&&p++),"function"!=typeof r.type&&(r.__u|=4)):s!=i&&(s==i-1?p--:s==i+1?p++:(s>i?p--:p++,r.__u|=4))):e.__k[o]=null;if(f)for(o=0;o<c;o++)null!=(u=t[o])&&!(2&u.__u)&&(u.__e==_&&(_=S(u)),z(u,u));return _}function F(e,n,t,_){var l,o;if("function"==typeof e.type){for(l=e.__k,o=0;l&&o<l.length;o++)l[o]&&(l[o].__=e,n=F(l[o],n,t,_));return n}e.__e!=n&&(_&&(n&&e.type&&!n.parentNode&&(n=S(e)),t.insertBefore(e.__e,n||null)),n=e.__e);do{n=n&&n.nextSibling}while(null!=n&&8==n.nodeType);return n}function L(e,n){return n=n||[],null==e||"boolean"==typeof e||(m(e)?e.some(function(e){L(e,n)}):n.push(e)),n}function N(e,n,t,_){var l,o,r,u=e.key,i=e.type,s=n[t],c=null!=s&&!(2&s.__u);if(null===s&&null==u||c&&u==s.key&&i==s.type)return t;if(_>(c?1:0))for(l=t-1,o=t+1;l>=0||o<n.length;)if(null!=(s=n[r=l>=0?l--:o++])&&!(2&s.__u)&&u==s.key&&i==s.type)return r;return-1}function A(e,n,t){"-"==n[0]?e.setProperty(n,null==t?"":t):e[n]=null==t?"":"number"!=typeof t||y.test(n)?t:t+"px"}function R(e,n,t,_,l){var o,r;e:if("style"==n)if("string"==typeof t)e.style.cssText=t;else{if("string"==typeof _&&(e.style.cssText=_=""),_)for(n in _)t&&n in t||A(e.style,n,"");if(t)for(n in t)_&&t[n]==_[n]||A(e.style,n,t[n])}else if("o"==n[0]&&"n"==n[1])o=n!=(n=n.replace(c,"$1")),r=n.toLowerCase(),n=r in e||"onFocusOut"==n||"onFocusIn"==n?r.slice(2):n.slice(2),e.l||(e.l={}),e.l[n+o]=t,t?_?t[s]=_[s]:(t[s]=f,e.addEventListener(n,o?a:p,o)):e.removeEventListener(n,o?a:p,o);else{if("http://www.w3.org/2000/svg"==l)n=n.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if("width"!=n&&"height"!=n&&"href"!=n&&"list"!=n&&"form"!=n&&"tabIndex"!=n&&"download"!=n&&"rowSpan"!=n&&"colSpan"!=n&&"role"!=n&&"popover"!=n&&n in e)try{e[n]=null==t?"":t;break e}catch(e){}"function"==typeof t||(null==t||!1===t&&"-"!=n[4]?e.removeAttribute(n):e.setAttribute(n,"popover"==n&&1==t?"":t))}}function H(e){return function(t){if(this.l){var _=this.l[t.type+e];if(null==t[i])t[i]=f++;else if(t[i]<_[s])return;return _(n.event?n.event(t):t)}}}function I(e,t,_,l,o,r,u,i,s,c){var f,p,a,h,d,y,b,w,x,S,U,T,M,D,W,F=t.type;if(void 0!==t.constructor)return null;128&_.__u&&(s=!!(32&_.__u),r=[i=t.__e=_.__e]),(f=n.__b)&&f(t);e:if("function"==typeof F)try{if(w=t.props,x=F.prototype&&F.prototype.render,S=(f=F.contextType)&&l[f.__c],U=f?S?S.props.value:f.__:l,_.__c?b=(p=t.__c=_.__c).__=p.__E:(x?t.__c=p=new F(w,U):(t.__c=p=new P(w,U),p.constructor=F,p.render=q),S&&S.sub(p),p.state||(p.state={}),p.__n=l,a=p.__d=!0,p.__h=[],p._sb=[]),x&&null==p.__s&&(p.__s=p.state),x&&null!=F.getDerivedStateFromProps&&(p.__s==p.state&&(p.__s=g({},p.__s)),g(p.__s,F.getDerivedStateFromProps(w,p.__s))),h=p.props,d=p.state,p.__v=t,a)x&&null==F.getDerivedStateFromProps&&null!=p.componentWillMount&&p.componentWillMount(),x&&null!=p.componentDidMount&&p.__h.push(p.componentDidMount);else{if(x&&null==F.getDerivedStateFromProps&&w!==h&&null!=p.componentWillReceiveProps&&p.componentWillReceiveProps(w,U),t.__v==_.__v||!p.__e&&null!=p.shouldComponentUpdate&&!1===p.shouldComponentUpdate(w,p.__s,U)){t.__v!=_.__v&&(p.props=w,p.state=p.__s,p.__d=!1),t.__e=_.__e,t.__k=_.__k,t.__k.some(function(e){e&&(e.__=t)}),v.push.apply(p.__h,p._sb),p._sb=[],p.__h.length&&u.push(p);break e}null!=p.componentWillUpdate&&p.componentWillUpdate(w,p.__s,U),x&&null!=p.componentDidUpdate&&p.__h.push(function(){p.componentDidUpdate(h,d,y)})}if(p.context=U,p.props=w,p.__P=e,p.__e=!1,T=n.__r,M=0,x)p.state=p.__s,p.__d=!1,T&&T(t),f=p.render(p.props,p.state,p.context),v.push.apply(p.__h,p._sb),p._sb=[];else do{p.__d=!1,T&&T(t),f=p.render(p.props,p.state,p.context),p.state=p.__s}while(p.__d&&++M<25);p.state=p.__s,null!=p.getChildContext&&(l=g(g({},l),p.getChildContext())),x&&!a&&null!=p.getSnapshotBeforeUpdate&&(y=p.getSnapshotBeforeUpdate(h,d)),D=null!=f&&f.type===C&&null==f.key?O(f.props.children):f,i=E(e,m(D)?D:[D],t,_,l,o,r,u,i,s,c),p.base=t.__e,t.__u&=-161,p.__h.length&&u.push(p),b&&(p.__E=p.__=null)}catch(e){if(t.__v=null,s||null!=r)if(e.then){for(t.__u|=s?160:128;i&&8==i.nodeType&&i.nextSibling;)i=i.nextSibling;r[r.indexOf(i)]=null,t.__e=i}else{for(W=r.length;W--;)k(r[W]);$(t)}else t.__e=_.__e,t.__k=_.__k,e.then||$(t);n.__e(e,t,_)}else null==r&&t.__v==_.__v?(t.__k=_.__k,t.__e=_.__e):i=t.__e=j(_.__e,t,_,l,o,r,u,s,c);return(f=n.diffed)&&f(t),128&t.__u?void 0:i}function $(e){e&&(e.__c&&(e.__c.__e=!0),e.__k&&e.__k.some($))}function B(e,t,_){for(var l=0;l<_.length;l++)V(_[l],_[++l],_[++l]);n.__c&&n.__c(t,e),e.some(function(t){try{e=t.__h,t.__h=[],e.some(function(e){e.call(t)})}catch(e){n.__e(e,t.__v)}})}function O(e){return"object"!=typeof e||null==e||e.__b>0?e:m(e)?e.map(O):void 0!==e.constructor?null:g({},e)}function j(t,_,l,o,r,u,i,s,c){var f,p,a,h,v,y,g,b=l.props||d,w=_.props,x=_.type;if("svg"==x?r="http://www.w3.org/2000/svg":"math"==x?r="http://www.w3.org/1998/Math/MathML":r||(r="http://www.w3.org/1999/xhtml"),null!=u)for(f=0;f<u.length;f++)if((v=u[f])&&"setAttribute"in v==!!x&&(x?v.localName==x:3==v.nodeType)){t=v,u[f]=null;break}if(null==t){if(null==x)return document.createTextNode(w);t=document.createElementNS(r,x,w.is&&w),s&&(n.__m&&n.__m(_,u),s=!1),u=null}if(null==x)b===w||s&&t.data==w||(t.data=w);else{if(u="textarea"==x&&null!=w.defaultValue?null:u&&e.call(t.childNodes),!s&&null!=u)for(b={},f=0;f<t.attributes.length;f++)b[(v=t.attributes[f]).name]=v.value;for(f in b)v=b[f],"dangerouslySetInnerHTML"==f?a=v:"children"==f||f in w||"value"==f&&"defaultValue"in w||"checked"==f&&"defaultChecked"in w||R(t,f,null,v,r);for(f in w)v=w[f],"children"==f?h=v:"dangerouslySetInnerHTML"==f?p=v:"value"==f?y=v:"checked"==f?g=v:s&&"function"!=typeof v||b[f]===v||R(t,f,v,b[f],r);if(p)s||a&&(p.__html==a.__html||p.__html==t.innerHTML)||(t.innerHTML=p.__html),_.__k=[];else if(a&&(t.innerHTML=""),E("template"==_.type?t.content:t,m(h)?h:[h],_,l,o,"foreignObject"==x?"http://www.w3.org/1999/xhtml":r,u,i,u?u[0]:l.__k&&S(l,0),s,c),null!=u)for(f=u.length;f--;)k(u[f]);s&&"textarea"!=x||(f="value","progress"==x&&null==y?t.removeAttribute("value"):null!=y&&(y!==t[f]||"progress"==x&&!y||"option"==x&&y!=b[f])&&R(t,f,y,b[f],r),f="checked",null!=g&&g!=t[f]&&R(t,f,g,b[f],r))}return t}function V(e,t,_){try{if("function"==typeof e){var l="function"==typeof e.__u;l&&e.__u(),l&&null==t||(e.__u=e(t))}else e.current=t}catch(e){n.__e(e,_)}}function z(e,t,_){var l,o;if(n.unmount&&n.unmount(e),(l=e.ref)&&(l.current&&l.current!=e.__e||V(l,null,t)),null!=(l=e.__c)){if(l.componentWillUnmount)try{l.componentWillUnmount()}catch(e){n.__e(e,t)}l.base=l.__P=null}if(l=e.__k)for(o=0;o<l.length;o++)l[o]&&z(l[o],t,_||"function"!=typeof e.type);_||k(e.__e),e.__c=e.__=e.__e=void 0}function q(e,n,t){return this.constructor(e,t)}function G(t,_,l){var o,r,u;_==document&&(_=document.documentElement),n.__&&n.__(t,_),o=!1?null:_.__k,r=[],u=[],I(_,t=_.__k=b(C,null,[t]),o||d,d,_.namespaceURI,o?null:_.firstChild?e.call(_.childNodes):null,r,o?o.__e:_.firstChild,false,u),B(r,t,u)}function J(n,t,_){var l,o,r,u,i=g({},n.props);for(r in n.type&&n.type.defaultProps&&(u=n.type.defaultProps),t)"key"==r?l=t[r]:"ref"==r?o=t[r]:i[r]=void 0===t[r]&&null!=u?u[r]:t[r];return arguments.length>2&&(i.children=arguments.length>3?e.call(arguments,2):_),w(n.type,i,l||n.key,o||n.ref,null)}function K(e){function n(e){var t,_;return this.getChildContext||(t=new Set,(_={})[n.__c]=this,this.getChildContext=function(){return _},this.componentWillUnmount=function(){t=null},this.shouldComponentUpdate=function(e){this.props.value!=e.value&&t.forEach(function(e){e.__e=!0,M(e)})},this.sub=function(e){t.add(e);var n=e.componentWillUnmount;e.componentWillUnmount=function(){t&&t.delete(e),n&&n.call(e)}}),e.children}return n.__c="__cC"+h++,n.__=e,n.Provider=n.__l=(n.Consumer=function(e,n){return e.children(n)}).contextType=n,n}e=v.slice,n={__e:function(e,n,t,_){for(var l,o,r;n=n.__;)if((l=n.__c)&&!l.__)try{if((o=l.constructor)&&null!=o.getDerivedStateFromError&&(l.setState(o.getDerivedStateFromError(e)),r=l.__d),null!=l.componentDidCatch&&(l.componentDidCatch(e,_||{}),r=l.__d),r)return l.__E=l}catch(n){e=n}throw e}},t=0,P.prototype.setState=function(e,n){var t;t=null!=this.__s&&this.__s!=this.state?this.__s:this.__s=g({},this.state),"function"==typeof e&&(e=e(g({},t),this.props)),e&&g(t,e),null!=e&&this.__v&&(n&&this._sb.push(n),M(this))},P.prototype.forceUpdate=function(e){this.__v&&(this.__e=!0,e&&this.__h.push(e),M(this))},P.prototype.render=C,_=[],o="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,r=function(e,n){return e.__v.__b-n.__v.__b},D.__r=0,u=Math.random().toString(8),i="__d"+u,s="__a"+u,c=/(PointerCapture)$|Capture$/i,f=0,p=H(!1),a=H(!0),h=0;export{P as Component,C as Fragment,J as cloneElement,K as createContext,b as createElement,x as createRef,b as h,n as options,G as render,L as toChildArray};
 //# sourceMappingURL=preact.js.map