npm - @economic/taco - Versions diffs - 2.49.0-server.3 → 2.49.0 - Mend

@economic/taco 2.49.0-server.3 → 2.49.0

Files changed (644) hide show

package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useCombobox.js","sources":["../../../../../../../src/components/Combobox/useCombobox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { v4 as uuid } from 'uuid';\nimport debounce from 'lodash/debounce';\nimport { ComboboxProps } from './Combobox';\nimport {\n setInputValueByRef,\n getIndexFromValue,\n findByValue,\n useFlattenedData,\n sanitizeItem,\n getOptionParents,\n filterData,\n} from '../Listbox/util';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { getId, ScrollableListItemValue, ScrollableListPropsWithRef } from '../Listbox/ScrollableList';\nimport { InputProps } from '../Input/Input';\nimport { isElementInsideTable3OrReport } from '../../utils/dom';\n\nconst debouncer = debounce(f => f(), 200);\n\nconst convertToInputValue = (value: ScrollableListItemValue \| undefined) => String(value ?? '');\n\ntype useCombobox = React.HTMLAttributes<HTMLDivElement> & {\n combobox: React.HTMLAttributes<HTMLSpanElement>;\n input: Omit<InputProps, 'defaultValue'> & { ref: React.RefObject<HTMLInputElement> };\n list: ScrollableListPropsWithRef;\n button: { ref: any };\n popover: { open: boolean; onOpenChange: (open: boolean) => void };\n};\n\nexport const useCombobox = (\n {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n data: unfilteredData = [],\n defaultValue,\n disabled,\n id: nativeId,\n inline,\n loading: __,\n onChange,\n onClick,\n onKeyDown,\n onSearch,\n readOnly,\n value,\n ...props\n }: Omit<ComboboxProps, 'dialog'>,\n ref: React.Ref<HTMLInputElement>\n): useCombobox => {\n const inputRef = useMergedRef<HTMLInputElement>(ref);\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n const listRef = React.useRef<HTMLUListElement>(null);\n const [open, setOpen] = React.useState(false);\n const listId = React.useMemo(() => uuid(), []);\n const [inputValue, setInputValue] = React.useState<string>(convertToInputValue(value));\n const shouldFilterData = !onSearch && (!inline \|\| (inline && inputValue !== convertToInputValue(value)));\n const flattenedData = useFlattenedData(unfilteredData);\n const data = React.useMemo(\n () => (shouldFilterData ? filterData(flattenedData, inputValue) : flattenedData),\n [shouldFilterData, inputValue, flattenedData]\n );\n // listbox/select change value _with_ the index, but combobox changes on select of an index (click/enter), so we need state\n const [currentIndex, setCurrentIndex] = React.useState<number \| undefined>(\n inputValue !== undefined ? getIndexFromValue(data, inputValue) : undefined\n );\n\n const setInputValueByIndex = (index: number \| undefined): void => {\n if (index !== undefined) {\n const option = data[index];\n\n if (option && !option.disabled) {\n setInputValueByRef(inputRef.current, option.value, 'focusout');\n }\n }\n };\n\n const setCurrentValue = (index: number \| undefined) => {\n if (index === undefined) {\n return;\n }\n\n const option = data[index];\n\n // if the selected option is not already selected, trigger blur event\n if (option.value !== value) {\n setInputValueByIndex(index);\n } else {\n // if the selected option is already selected, refill input with its value\n setInputValue(convertToInputValue(value));\n }\n };\n\n // ensure the external value is synced with the internal value when mounting, e.g. incase a default value was set\n React.useEffect(() => {\n if (defaultValue && !value) {\n setInputValueByIndex(getIndexFromValue(data, defaultValue));\n }\n }, [data]);\n\n // update input value if it changed 'externally', e.g. clicking/entering an item in the listbox, from a modal etc\n React.useEffect(() => {\n if (value !== undefined && value !== inputValue) {\n setInputValue(convertToInputValue(value));\n }\n }, [value]);\n\n React.useEffect(() => {\n if (onSearch) {\n debouncer(() => {\n onSearch(inputValue);\n });\n }\n }, [inputValue]);\n\n // show listbox based on input value\n React.useEffect(() => {\n // don't show the popover if the internal (input) value already is the current value\n // this prevents the popover showing after selecting a value or pressing escape\n const isCurrentValue = value !== undefined && value !== null && inputValue === String(value);\n\n if (inputValue && data.length && !isCurrentValue) {\n setCurrentIndex(0);\n\n if (!open) {\n setOpen(true);\n }\n } else {\n setOpen(false);\n }\n }, [inputValue, data]);\n\n React.useEffect(() => {\n if (open) {\n setCurrentIndex(getIndexFromValue(data, inputValue) \|\| 0);\n } else {\n setCurrentIndex(undefined);\n }\n }, [open]);\n\n // event handlers\n const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n event.persist();\n\n if (listRef.current && event.relatedTarget === listRef.current) {\n event.preventDefault();\n return;\n }\n\n // event.target.value is always a string so it is important to cast value to a string before checking the equality\n if (onChange && event.target.value !== String(value)) {\n const item = findByValue(flattenedData, event.target.value);\n (event as any).detail = sanitizeItem(item);\n\n const parents = getOptionParents(flattenedData, item?.path);\n\n if (parents !== null && parents.length > 0) {\n (event as any).detail.parents = parents;\n }\n\n onChange(event);\n }\n\n if (props.onBlur) {\n props.onBlur(event);\n }\n };\n\n const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n setInputValue(event.target.value);\n };\n\n const handleInputClick = (event: React.MouseEvent<HTMLInputElement>): void => {\n if (inline \|\| (!open && inputValue && data.length)) {\n setOpen(true);\n }\n\n if (onClick) {\n event.persist();\n onClick(event);\n }\n };\n\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n event.persist();\n\n if (!event.ctrlKey && !event.metaKey) {\n switch (event.key) {\n case 'Backspace': {\n return;\n }\n\n case 'Escape': {\n event.preventDefault();\n setInputValue(convertToInputValue(value));\n setOpen(false);\n return;\n }\n\n case 'Tab': {\n setCurrentValue(currentIndex);\n setOpen(false);\n return;\n }\n\n case 'Enter': {\n event.preventDefault();\n\n if (isElementInsideTable3OrReport(event.currentTarget)) {\n if (inline && !open) {\n setOpen(true);\n } else if (buttonRef.current && !open) {\n buttonRef.current.click();\n }\n }\n\n if (open) {\n setCurrentValue(currentIndex);\n setOpen(false);\n }\n\n return;\n }\n\n case 'ArrowDown':\n if (open) {\n event.preventDefault();\n } else {\n if (!inline && buttonRef.current && !isElementInsideTable3OrReport(event.currentTarget)) {\n buttonRef.current.click();\n }\n }\n break;\n\n case 'ArrowUp':\n case 'Home':\n case 'End': {\n if (open) {\n event.preventDefault();\n }\n break;\n }\n\n default:\n }\n\n // we aren't focused on the list, so manually forward the keydown event to it\n if (listRef.current) {\n listRef.current.dispatchEvent(createCustomKeyboardEvent(event));\n }\n\n if (inline && !open) {\n if (\n (event.key === 'ArrowUp' \|\| event.key === 'ArrowDown') &&\n !isElementInsideTable3OrReport(event.currentTarget)\n ) {\n event.preventDefault();\n const initialIndex = event.key === 'ArrowUp' ? data.length - 1 : 0;\n setCurrentIndex(currentIndex !== undefined ? currentIndex : initialIndex);\n setOpen(true);\n }\n }\n }\n\n if (!event.isDefaultPrevented() && onKeyDown) {\n event.persist();\n onKeyDown(event);\n }\n };\n\n const handleListboxChange = (index: number): void => {\n setCurrentIndex(index);\n };\n\n const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>, index: number): void => {\n event.preventDefault();\n setCurrentValue(index);\n setOpen(false);\n };\n\n const combobox = {\n 'aria-expanded': open,\n 'aria-owns': listId,\n 'aria-haspopup': 'listbox' as const,\n role: 'combobox',\n };\n\n const input = {\n ...props,\n 'aria-controls': listId,\n // Indicates that the autocomplete behavior of the text input is to suggest a list of possible values in a popup and that the suggestions\n // are related to the string that is present in the textbox\n 'aria-autocomplete': 'list' as const,\n // Enables assistive technologies to know which element the application regards as focused while DOM focus remains on the input element\n 'aria-activedescendant':\n currentIndex !== undefined && data[currentIndex] ? getId(listId, String(data[currentIndex].value)) : undefined,\n 'aria-labelledby': ariaLabelledBy,\n disabled,\n onBlur: !disabled && !readOnly ? handleInputBlur : undefined,\n onChange: !disabled && !readOnly ? handleInputChange : undefined,\n onClick: !disabled && !readOnly ? handleInputClick : undefined,\n onKeyDown: !disabled && !readOnly ? handleInputKeyDown : undefined,\n readOnly,\n ref: inputRef,\n type: 'text',\n value: inputValue ?? '',\n };\n\n const list: ScrollableListPropsWithRef = {\n 'aria-labelledby': ariaLabelledBy,\n data,\n disabled,\n id: listId,\n onChange: handleListboxChange,\n onClick: handleListboxClick,\n ref: listRef,\n scrollOnFocus: false,\n tabIndex: -1,\n value: currentIndex,\n };\n\n const button = {\n ref: buttonRef,\n };\n\n return {\n combobox,\n input,\n list,\n button,\n popover: {\n open,\n onOpenChange: setOpen,\n //visible: !data.length ? false : open,\n },\n };\n};\n"],"names":["debouncer","debounce","f","convertToInputValue","value","String","useCombobox","_ref","ref","ariaLabelledBy","_ref$data","data","unfilteredData","defaultValue","disabled","inline","onChange","onClick","onKeyDown","onSearch","readOnly","props","_objectWithoutPropertiesLoose","_excluded","inputRef","useMergedRef","buttonRef","React","listRef","_React$useState","open","setOpen","listId","uuid","_React$useState2","inputValue","setInputValue","shouldFilterData","flattenedData","useFlattenedData","filterData","_React$useState3","undefined","getIndexFromValue","currentIndex","setCurrentIndex","setInputValueByIndex","index","option","setInputValueByRef","current","setCurrentValue","isCurrentValue","length","handleInputBlur","event","persist","relatedTarget","preventDefault","target","item","findByValue","detail","sanitizeItem","parents","getOptionParents","path","onBlur","handleInputChange","handleInputClick","handleInputKeyDown","ctrlKey","metaKey","key","isElementInsideTable3OrReport","currentTarget","click","dispatchEvent","createCustomKeyboardEvent","initialIndex","isDefaultPrevented","handleListboxChange","handleListboxClick","combobox","role","input","_extends","getId","type","list","id","scrollOnFocus","tabIndex","button","popover","onOpenChange"],"mappings":"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"}
1	+ {"version":3,"file":"useCombobox.js","sources":["../../../../../../../src/components/Combobox/useCombobox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { v4 as uuid } from 'uuid';\nimport debounce from 'lodash/debounce';\nimport { ComboboxProps } from './Combobox';\nimport {\n setInputValueByRef,\n getIndexFromValue,\n findByValue,\n useFlattenedData,\n sanitizeItem,\n getOptionParents,\n filterData,\n} from '../Listbox/util';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { getId, ScrollableListItemValue, ScrollableListPropsWithRef } from '../Listbox/ScrollableList';\nimport { InputProps } from '../Input/Input';\nimport { isElementInsideTable3OrReport } from '../../utils/dom';\n\nconst debouncer = debounce(f => f(), 200);\n\nconst convertToInputValue = (value: ScrollableListItemValue \| undefined) => String(value ?? '');\n\ntype useCombobox = React.HTMLAttributes<HTMLDivElement> & {\n combobox: React.HTMLAttributes<HTMLSpanElement>;\n input: Omit<InputProps, 'defaultValue'> & { ref: React.RefObject<HTMLInputElement> };\n list: ScrollableListPropsWithRef;\n button: { ref: any };\n popover: { open: boolean; onOpenChange: (open: boolean) => void };\n};\n\nexport const useCombobox = (\n {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n data: unfilteredData = [],\n defaultValue,\n disabled,\n id: nativeId,\n inline,\n loading: __,\n onChange,\n onClick,\n onKeyDown,\n onSearch,\n readOnly,\n value,\n ...props\n }: Omit<ComboboxProps, 'dialog'>,\n ref: React.Ref<HTMLInputElement>\n): useCombobox => {\n const inputRef = useMergedRef<HTMLInputElement>(ref);\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n const listRef = React.useRef<HTMLUListElement>(null);\n const [open, setOpen] = React.useState(false);\n const listId = React.useMemo(() => uuid(), []);\n const [inputValue, setInputValue] = React.useState<string>(convertToInputValue(value));\n const shouldFilterData = !onSearch && (!inline \|\| (inline && inputValue !== convertToInputValue(value)));\n const flattenedData = useFlattenedData(unfilteredData);\n const data = React.useMemo(\n () => (shouldFilterData ? filterData(flattenedData, inputValue) : flattenedData),\n [shouldFilterData, inputValue, flattenedData]\n );\n // listbox/select change value _with_ the index, but combobox changes on select of an index (click/enter), so we need state\n const [currentIndex, setCurrentIndex] = React.useState<number \| undefined>(\n inputValue !== undefined ? getIndexFromValue(data, inputValue) : undefined\n );\n\n const setInputValueByIndex = (index: number \| undefined): void => {\n if (index !== undefined) {\n const option = data[index];\n\n if (option && !option.disabled) {\n setInputValueByRef(inputRef.current, option.value, 'focusout');\n }\n }\n };\n\n const setCurrentValue = (index: number \| undefined) => {\n if (index === undefined) {\n return;\n }\n\n const option = data[index];\n\n // if the selected option is not already selected, trigger blur event\n if (option.value !== value) {\n setInputValueByIndex(index);\n } else {\n // if the selected option is already selected, refill input with its value\n setInputValue(convertToInputValue(value));\n }\n };\n\n // ensure the external value is synced with the internal value when mounting, e.g. incase a default value was set\n React.useEffect(() => {\n if (defaultValue && !value) {\n setInputValueByIndex(getIndexFromValue(data, defaultValue));\n }\n }, [data]);\n\n // update input value if it changed 'externally', e.g. clicking/entering an item in the listbox, from a modal etc\n React.useEffect(() => {\n if (value !== undefined && value !== inputValue) {\n setInputValue(convertToInputValue(value));\n }\n }, [value]);\n\n React.useEffect(() => {\n if (onSearch) {\n debouncer(() => {\n onSearch(inputValue);\n });\n }\n }, [inputValue]);\n\n // show listbox based on input value\n React.useEffect(() => {\n // don't show the popover if the internal (input) value already is the current value\n // this prevents the popover showing after selecting a value or pressing escape\n const isCurrentValue = value !== undefined && value !== null && inputValue === String(value);\n\n if (inputValue && data.length && !isCurrentValue) {\n setCurrentIndex(0);\n\n if (!open) {\n setOpen(true);\n }\n } else {\n setOpen(false);\n }\n }, [inputValue, data]);\n\n React.useEffect(() => {\n if (open) {\n setCurrentIndex(getIndexFromValue(data, inputValue) \|\| 0);\n } else {\n setCurrentIndex(undefined);\n }\n }, [open]);\n\n // event handlers\n const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n event.persist();\n\n if (listRef.current && event.relatedTarget === listRef.current) {\n event.preventDefault();\n return;\n }\n\n // event.target.value is always a string so it is important to cast value to a string before checking the equality\n if (onChange && event.target.value !== String(value)) {\n const item = findByValue(flattenedData, event.target.value);\n (event as any).detail = sanitizeItem(item);\n\n const parents = getOptionParents(flattenedData, item?.path);\n\n if (parents !== null && parents.length > 0) {\n (event as any).detail.parents = parents;\n }\n\n onChange(event);\n }\n\n if (props.onBlur) {\n props.onBlur(event);\n }\n };\n\n const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n setInputValue(event.target.value);\n };\n\n const handleInputClick = (event: React.MouseEvent<HTMLInputElement>): void => {\n if (inline \|\| (!open && inputValue && data.length)) {\n setOpen(true);\n }\n\n if (onClick) {\n event.persist();\n onClick(event);\n }\n };\n\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n event.persist();\n\n if (!event.ctrlKey && !event.metaKey) {\n switch (event.key) {\n case 'Backspace': {\n return;\n }\n\n case 'Escape': {\n event.preventDefault();\n setInputValue(convertToInputValue(value));\n setOpen(false);\n return;\n }\n\n case 'Tab': {\n setCurrentValue(currentIndex);\n setOpen(false);\n return;\n }\n\n case 'Enter': {\n event.preventDefault();\n\n if (isElementInsideTable3OrReport(event.currentTarget)) {\n if (inline && !open) {\n setOpen(true);\n } else if (buttonRef.current && !open) {\n buttonRef.current.click();\n }\n }\n\n if (open) {\n setCurrentValue(currentIndex);\n setOpen(false);\n }\n\n return;\n }\n\n case 'ArrowDown':\n if (open) {\n event.preventDefault();\n } else {\n if (!inline && buttonRef.current && !isElementInsideTable3OrReport(event.currentTarget)) {\n buttonRef.current.click();\n }\n }\n break;\n\n case 'ArrowUp':\n case 'Home':\n case 'End': {\n if (open) {\n event.preventDefault();\n }\n break;\n }\n\n default:\n }\n\n // we aren't focused on the list, so manually forward the keydown event to it\n if (listRef.current) {\n listRef.current.dispatchEvent(createCustomKeyboardEvent(event));\n }\n\n if (inline && !open) {\n if (\n (event.key === 'ArrowUp' \|\| event.key === 'ArrowDown') &&\n !isElementInsideTable3OrReport(event.currentTarget)\n ) {\n event.preventDefault();\n const initialIndex = event.key === 'ArrowUp' ? data.length - 1 : 0;\n setCurrentIndex(currentIndex !== undefined ? currentIndex : initialIndex);\n setOpen(true);\n }\n }\n }\n\n if (!event.isDefaultPrevented() && onKeyDown) {\n event.persist();\n onKeyDown(event);\n }\n };\n\n const handleListboxChange = (index: number): void => {\n setCurrentIndex(index);\n };\n\n const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>, index: number): void => {\n event.preventDefault();\n setCurrentValue(index);\n setOpen(false);\n };\n\n const combobox = {\n 'aria-expanded': open,\n 'aria-owns': listId,\n 'aria-haspopup': 'listbox' as const,\n role: 'combobox',\n };\n\n const input = {\n ...props,\n 'aria-controls': listId,\n // Indicates that the autocomplete behavior of the text input is to suggest a list of possible values in a popup and that the suggestions\n // are related to the string that is present in the textbox\n 'aria-autocomplete': 'list' as const,\n // Enables assistive technologies to know which element the application regards as focused while DOM focus remains on the input element\n 'aria-activedescendant':\n currentIndex !== undefined && data[currentIndex] ? getId(listId, String(data[currentIndex].value)) : undefined,\n 'aria-labelledby': ariaLabelledBy,\n disabled,\n onBlur: !disabled && !readOnly ? handleInputBlur : undefined,\n onChange: !disabled && !readOnly ? handleInputChange : undefined,\n onClick: !disabled && !readOnly ? handleInputClick : undefined,\n onKeyDown: !disabled && !readOnly ? handleInputKeyDown : undefined,\n readOnly,\n ref: inputRef,\n type: 'text',\n value: inputValue ?? '',\n };\n\n const list: ScrollableListPropsWithRef = {\n 'aria-labelledby': ariaLabelledBy,\n data,\n disabled,\n id: listId,\n onChange: handleListboxChange,\n onClick: handleListboxClick,\n ref: listRef,\n scrollOnFocus: false,\n tabIndex: -1,\n value: currentIndex,\n };\n\n const button = {\n ref: buttonRef,\n };\n\n return {\n combobox,\n input,\n list,\n button,\n popover: {\n open,\n onOpenChange: setOpen,\n //visible: !data.length ? false : open,\n },\n };\n};\n"],"names":["debouncer","debounce","f","convertToInputValue","value","String","useCombobox","ariaLabel","ariaLabelledBy","data","unfilteredData","defaultValue","disabled","id","nativeId","inline","loading","__","onChange","onClick","onKeyDown","onSearch","readOnly","props","ref","inputRef","useMergedRef","buttonRef","React","listRef","open","setOpen","listId","uuid","inputValue","setInputValue","shouldFilterData","flattenedData","useFlattenedData","filterData","currentIndex","setCurrentIndex","undefined","getIndexFromValue","setInputValueByIndex","index","option","setInputValueByRef","current","setCurrentValue","isCurrentValue","length","handleInputBlur","event","persist","relatedTarget","preventDefault","target","item","findByValue","detail","sanitizeItem","parents","getOptionParents","path","onBlur","handleInputChange","handleInputClick","handleInputKeyDown","ctrlKey","metaKey","key","isElementInsideTable3OrReport","currentTarget","click","dispatchEvent","createCustomKeyboardEvent","initialIndex","isDefaultPrevented","handleListboxChange","handleListboxClick","combobox","role","input","getId","type","list","scrollOnFocus","tabIndex","button","popover","onOpenChange"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Datepicker/Datepicker.js CHANGED Viewed

@@ -1,6 +1,5 @@
 import { forwardRef, useRef, useCallback, createElement } from 'react';
 import cn from 'clsx';
-import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { IconButton } from '../IconButton/IconButton.js';
 import { useLocalization } from '../Provider/Localization.js';
 import { Calendar } from '../Calendar/Calendar.js';
@@ -8,28 +7,31 @@ import { Input } from '../Input/Input.js';
 import { useDatepicker } from './useDatepicker.js';
 import { Popover } from '../Popover/Popover.js';
-var _excluded = ["className", "onReset", "style", "shortcuts", "shortcutsText"];
-var Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
-  var externalClassName = props.className,
-    handleReset = props.onReset,
-    style = props.style,
-    shortcuts = props.shortcuts,
-    shortcutsText = props.shortcutsText,
-    otherProps = _objectWithoutPropertiesLoose(props, _excluded);
-  var _useDatepicker = useDatepicker(otherProps, ref),
-    calendar = _useDatepicker.calendar,
-    input = _useDatepicker.input;
-  var _useLocalization = useLocalization(),
-    texts = _useLocalization.texts;
-  var className = cn('inline-flex w-full text-black font-normal', externalClassName);
-  var popoverContentRef = useRef(null);
-  var handleOpenAutofocus = useCallback(function (e) {
+const Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
+  const {
+    className: externalClassName,
+    onReset: handleReset,
+    style,
+    shortcuts,
+    shortcutsText,
+    ...otherProps
+  } = props;
+  const {
+    calendar,
+    input
+  } = useDatepicker(otherProps, ref);
+  const {
+    texts
+  } = useLocalization();
+  const className = cn('inline-flex w-full text-black font-normal', externalClassName);
+  const popoverContentRef = useRef(null);
+  const handleOpenAutofocus = useCallback(e => {
     var _popoverContentRef$cu, _popoverContentRef$cu2;
     e.preventDefault();
-    var currentDay = (_popoverContentRef$cu = popoverContentRef === null || popoverContentRef === void 0 ? void 0 : (_popoverContentRef$cu2 = popoverContentRef.current) === null || _popoverContentRef$cu2 === void 0 ? void 0 : _popoverContentRef$cu2.querySelector('table button[name="day"][aria-selected="true"]')) !== null && _popoverContentRef$cu !== void 0 ? _popoverContentRef$cu : null;
+    const currentDay = (_popoverContentRef$cu = popoverContentRef === null || popoverContentRef === void 0 ? void 0 : (_popoverContentRef$cu2 = popoverContentRef.current) === null || _popoverContentRef$cu2 === void 0 ? void 0 : _popoverContentRef$cu2.querySelector('table button[name="day"][aria-selected="true"]')) !== null && _popoverContentRef$cu !== void 0 ? _popoverContentRef$cu : null;
     currentDay === null || currentDay === void 0 ? void 0 : currentDay.focus();
   }, [popoverContentRef]);
-  var handleCloseAutoFocus = useCallback(function (e) {
+  const handleCloseAutoFocus = useCallback(e => {
     var _input$ref$current;
     e.preventDefault();
     (_input$ref$current = input.ref.current) === null || _input$ref$current === void 0 ? void 0 : _input$ref$current.focus();
@@ -44,47 +46,42 @@ var Datepicker = /*#__PURE__*/forwardRef(function Datepicker(props, ref) {
       disabled: input.disabled || input.readOnly,
       icon: "calendar",
       tabIndex: -1,
-      popover: function popover(props) {
-        return /*#__PURE__*/createElement(Popover, Object.assign({}, props), /*#__PURE__*/createElement(Popover.Content, {
-          onOpenAutoFocus: handleOpenAutofocus,
-          onCloseAutoFocus: handleCloseAutoFocus
-        }, function (_ref) {
-          var close = _ref.close;
-          return /*#__PURE__*/createElement("div", {
-            className: '[&_button[name="day"]:focus]:yt-focus -m-3 flex',
-            ref: popoverContentRef
-          }, /*#__PURE__*/createElement(Calendar, Object.assign({}, calendar, {
-            onChange: function onChange(date, event) {
-              calendar.onChange(date, event);
-              close();
-            }
-          })), shortcuts && (/*#__PURE__*/createElement("div", {
-            className: "border-grey-300 flex flex-col border-l"
-          }, /*#__PURE__*/createElement("span", {
-            className: "m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold"
-          }, shortcutsText !== null && shortcutsText !== void 0 ? shortcutsText : texts.datepicker.shortcuts), /*#__PURE__*/createElement("ul", null, shortcuts.map(function (shortcut) {
-            return /*#__PURE__*/createElement("li", {
-              key: shortcut.text
-            }, /*#__PURE__*/createElement("button", {
-              type: "button",
-              className: "hover:wcag-grey-200 flex w-full items-start px-4 py-1 text-xs",
-              onClick: function onClick(event) {
-                event.persist();
-                shortcut.onClick(event);
-                close();
-              }
-            }, shortcut.text));
-          })), handleReset && (/*#__PURE__*/createElement("button", {
-            type: "button",
-            className: "mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300",
-            onClick: function onClick(event) {
-              event.persist();
-              handleReset(event);
-              close();
-            }
-          }, texts.datepicker.clear)))));
-        }));
-      },
+      popover: props => (/*#__PURE__*/createElement(Popover, Object.assign({}, props), /*#__PURE__*/createElement(Popover.Content, {
+        onOpenAutoFocus: handleOpenAutofocus,
+        onCloseAutoFocus: handleCloseAutoFocus
+      }, ({
+        close
+      }) => (/*#__PURE__*/createElement("div", {
+        className: '[&_button[name="day"]:focus]:yt-focus -m-3 flex',
+        ref: popoverContentRef
+      }, /*#__PURE__*/createElement(Calendar, Object.assign({}, calendar, {
+        onChange: (date, event) => {
+          calendar.onChange(date, event);
+          close();
+        }
+      })), shortcuts && (/*#__PURE__*/createElement("div", {
+        className: "border-grey-300 flex flex-col border-l"
+      }, /*#__PURE__*/createElement("span", {
+        className: "m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold"
+      }, shortcutsText !== null && shortcutsText !== void 0 ? shortcutsText : texts.datepicker.shortcuts), /*#__PURE__*/createElement("ul", null, shortcuts.map(shortcut => (/*#__PURE__*/createElement("li", {
+        key: shortcut.text
+      }, /*#__PURE__*/createElement("button", {
+        type: "button",
+        className: "hover:wcag-grey-200 flex w-full items-start px-4 py-1 text-xs",
+        onClick: event => {
+          event.persist();
+          shortcut.onClick(event);
+          close();
+        }
+      }, shortcut.text))))), handleReset && (/*#__PURE__*/createElement("button", {
+        type: "button",
+        className: "mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300",
+        onClick: event => {
+          event.persist();
+          handleReset(event);
+          close();
+        }
+      }, texts.datepicker.clear))))))))),
       tooltip: texts.datepicker.calendar
     }))
   })));

package/dist/esm/packages/taco/src/components/Datepicker/Datepicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Datepicker.js","sources":["../../../../../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\nimport { Input, InputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\nimport { useDatepicker } from './useDatepicker';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Popover } from '../Popover/Popover';\n\nexport type DatepickerTexts = {\n /** Aria-label for calendar /\n calendar: string;\n /* Clear button text /\n clear: string;\n /\n Aria-label for calendar icon button in the input.\n * Calendar will open when user clicks this icon button.\n /\n expand: string;\n /* Shortcut heading text /\n shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n onClick: (event: React.MouseEvent) => void;\n text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n /* [Calendar](component:calendar) component associated with the DatePicker /\n calendar?: CalendarProps;\n /* List of shortcuts /\n shortcuts?: DatePickerShortcut[];\n /* Title for the shortcuts panel /\n shortcutsText?: string;\n /* Handler to be called when the clear button is clicked /\n onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /\n Date value of the calendar.\n * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n */\n value?: Date \| string;\n};\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n const { calendar, input } = useDatepicker(otherProps, ref);\n const { texts } = useLocalization();\n const className = cn('inline-flex w-full text-black font-normal', externalClassName);\n\n const popoverContentRef = React.useRef<HTMLDivElement>(null);\n\n const handleOpenAutofocus = React.useCallback(\n (e: Event) => {\n e.preventDefault();\n const currentDay: HTMLButtonElement \| null =\n popoverContentRef?.current?.querySelector('table button[name=\"day\"][aria-selected=\"true\"]') ?? null;\n currentDay?.focus();\n },\n [popoverContentRef]\n );\n\n const handleCloseAutoFocus = React.useCallback(\n (e: Event) => {\n e.preventDefault();\n input.ref.current?.focus();\n },\n [input.ref]\n );\n\n return (\n <span className={className} data-taco=\"datepicker\" style={style}>\n <Input\n {...input}\n button={\n input.readOnly ? undefined : (\n <IconButton\n aria-label={texts.datepicker.expand}\n disabled={input.disabled \|\| input.readOnly}\n icon=\"calendar\"\n tabIndex={-1}\n popover={props => (\n <Popover {...props}>\n <Popover.Content\n onOpenAutoFocus={handleOpenAutofocus}\n onCloseAutoFocus={handleCloseAutoFocus}>\n {({ close }) => (\n <div\n className='[&_button[name=\"day\"]:focus]:yt-focus -m-3 flex'\n ref={popoverContentRef}>\n <Calendar\n {...calendar}\n onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n calendar.onChange(date, event);\n close();\n }}\n />\n {shortcuts && (\n <div className=\"border-grey-300 flex flex-col border-l\">\n <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n {shortcutsText ?? texts.datepicker.shortcuts}\n </span>\n <ul>\n {shortcuts.map(shortcut => (\n <li key={shortcut.text}>\n <button\n type=\"button\"\n className=\"hover:wcag-grey-200 flex w-full items-start px-4 py-1 text-xs\"\n onClick={event => {\n event.persist();\n shortcut.onClick(event);\n close();\n }}>\n {shortcut.text}\n </button>\n </li>\n ))}\n </ul>\n {handleReset && (\n <button\n type=\"button\"\n className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n onClick={event => {\n event.persist();\n handleReset(event);\n close();\n }}>\n {texts.datepicker.clear}\n </button>\n )}\n </div>\n )}\n </div>\n )}\n </Popover.Content>\n </Popover>\n )}\n tooltip={texts.datepicker.calendar}\n />\n )\n }\n />\n </span>\n );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["Datepicker","React","props","ref","externalClassName","className","handleReset","onReset","style","shortcuts","shortcutsText","otherProps","_objectWithoutPropertiesLoose","_excluded","_useDatepicker","useDatepicker","calendar","input","_useLocalization","useLocalization","texts","cn","popoverContentRef","handleOpenAutofocus","e","preventDefault","currentDay","_popoverContentRef$cu","_popoverContentRef$cu2","current","querySelector","focus","handleCloseAutoFocus","_input$ref$current","Input","button","readOnly","undefined","IconButton","datepicker","expand","disabled","icon","tabIndex","popover","Popover","Content","onOpenAutoFocus","onCloseAutoFocus","_ref","close","Calendar","onChange","date","event","map","shortcut","key","text","type","onClick","persist","clear","tooltip","displayName"],"mappings":"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"}
1	+ {"version":3,"file":"Datepicker.js","sources":["../../../../../../../src/components/Datepicker/Datepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\nimport { Input, InputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\nimport { useDatepicker } from './useDatepicker';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Popover } from '../Popover/Popover';\n\nexport type DatepickerTexts = {\n /** Aria-label for calendar /\n calendar: string;\n /* Clear button text /\n clear: string;\n /\n Aria-label for calendar icon button in the input.\n * Calendar will open when user clicks this icon button.\n /\n expand: string;\n /* Shortcut heading text /\n shortcuts: string;\n};\n\nexport type DatePickerShortcut = {\n onClick: (event: React.MouseEvent) => void;\n text: string;\n};\n\nexport type DatepickerProps = Omit<InputProps, 'value'> & {\n /* [Calendar](component:calendar) component associated with the DatePicker /\n calendar?: CalendarProps;\n /* List of shortcuts /\n shortcuts?: DatePickerShortcut[];\n /* Title for the shortcuts panel /\n shortcutsText?: string;\n /* Handler to be called when the clear button is clicked /\n onReset?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /\n Date value of the calendar.\n * This will be displayed in DatePicker's input in the format given to the [Provider](component:provider) component\n */\n value?: Date \| string;\n};\n\nexport const Datepicker = React.forwardRef(function Datepicker(props: DatepickerProps, ref: React.Ref<HTMLInputElement>) {\n const { className: externalClassName, onReset: handleReset, style, shortcuts, shortcutsText, ...otherProps } = props;\n const { calendar, input } = useDatepicker(otherProps, ref);\n const { texts } = useLocalization();\n const className = cn('inline-flex w-full text-black font-normal', externalClassName);\n\n const popoverContentRef = React.useRef<HTMLDivElement>(null);\n\n const handleOpenAutofocus = React.useCallback(\n (e: Event) => {\n e.preventDefault();\n const currentDay: HTMLButtonElement \| null =\n popoverContentRef?.current?.querySelector('table button[name=\"day\"][aria-selected=\"true\"]') ?? null;\n currentDay?.focus();\n },\n [popoverContentRef]\n );\n\n const handleCloseAutoFocus = React.useCallback(\n (e: Event) => {\n e.preventDefault();\n input.ref.current?.focus();\n },\n [input.ref]\n );\n\n return (\n <span className={className} data-taco=\"datepicker\" style={style}>\n <Input\n {...input}\n button={\n input.readOnly ? undefined : (\n <IconButton\n aria-label={texts.datepicker.expand}\n disabled={input.disabled \|\| input.readOnly}\n icon=\"calendar\"\n tabIndex={-1}\n popover={props => (\n <Popover {...props}>\n <Popover.Content\n onOpenAutoFocus={handleOpenAutofocus}\n onCloseAutoFocus={handleCloseAutoFocus}>\n {({ close }) => (\n <div\n className='[&_button[name=\"day\"]:focus]:yt-focus -m-3 flex'\n ref={popoverContentRef}>\n <Calendar\n {...calendar}\n onChange={(date: Date, event?: React.MouseEvent<Element>) => {\n calendar.onChange(date, event);\n close();\n }}\n />\n {shortcuts && (\n <div className=\"border-grey-300 flex flex-col border-l\">\n <span className=\"m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold\">\n {shortcutsText ?? texts.datepicker.shortcuts}\n </span>\n <ul>\n {shortcuts.map(shortcut => (\n <li key={shortcut.text}>\n <button\n type=\"button\"\n className=\"hover:wcag-grey-200 flex w-full items-start px-4 py-1 text-xs\"\n onClick={event => {\n event.persist();\n shortcut.onClick(event);\n close();\n }}>\n {shortcut.text}\n </button>\n </li>\n ))}\n </ul>\n {handleReset && (\n <button\n type=\"button\"\n className=\"mx-auto my-4 mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n onClick={event => {\n event.persist();\n handleReset(event);\n close();\n }}>\n {texts.datepicker.clear}\n </button>\n )}\n </div>\n )}\n </div>\n )}\n </Popover.Content>\n </Popover>\n )}\n tooltip={texts.datepicker.calendar}\n />\n )\n }\n />\n </span>\n );\n});\nDatepicker.displayName = 'Datepicker';\n"],"names":["Datepicker","React","props","ref","className","externalClassName","onReset","handleReset","style","shortcuts","shortcutsText","otherProps","calendar","input","useDatepicker","texts","useLocalization","cn","popoverContentRef","handleOpenAutofocus","e","preventDefault","currentDay","_popoverContentRef$cu","_popoverContentRef$cu2","current","querySelector","focus","handleCloseAutoFocus","_input$ref$current","Input","button","readOnly","undefined","IconButton","datepicker","expand","disabled","icon","tabIndex","popover","Popover","Content","onOpenAutoFocus","onCloseAutoFocus","close","Calendar","onChange","date","event","map","shortcut","key","text","type","onClick","persist","clear","tooltip","displayName"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Datepicker/useDatepicker.js CHANGED Viewed

@@ -1,37 +1,36 @@
 import { useState, useEffect } from 'react';
-import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, extends as _extends } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { useLocalization } from '../Provider/Localization.js';
 import { setInputValueByRef } from '../../utils/input.js';
 import { format, parse, parseFromCustomString } from '../../utils/date.js';
-var _excluded = ["defaultValue", "calendar", "onBlur", "onChange", "value"];
-var useDatepicker = function useDatepicker(_ref, ref) {
+const useDatepicker = ({
+  defaultValue: _,
+  calendar,
+  onBlur,
+  onChange,
+  value,
+  ...props
+}, ref) => {
   var _format;
-  var calendar = _ref.calendar,
-    onBlur = _ref.onBlur,
-    onChange = _ref.onChange,
-    value = _ref.value,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var inputRef = useMergedRef(ref);
-  var _useLocalization = useLocalization(),
-    formatting = _useLocalization.formatting;
-  var _React$useState = useState((_format = format(value, formatting.date)) !== null && _format !== void 0 ? _format : ''),
-    internalValue = _React$useState[0],
-    setInternalValue = _React$useState[1];
-  var originalValueAsDate = parse(value);
+  const inputRef = useMergedRef(ref);
+  const {
+    formatting
+  } = useLocalization();
+  const [internalValue, setInternalValue] = useState((_format = format(value, formatting.date)) !== null && _format !== void 0 ? _format : '');
+  const originalValueAsDate = parse(value);
   // update internal value if it changed 'externally'
-  useEffect(function () {
-    var formattedValue = format(value, formatting.date);
+  useEffect(() => {
+    const formattedValue = format(value, formatting.date);
     if (formattedValue !== internalValue) {
       setInternalValue(formattedValue !== null && formattedValue !== void 0 ? formattedValue : '');
     }
   }, [value]);
   // event handlers
-  var handleInputBlur = function handleInputBlur(event) {
+  const handleInputBlur = event => {
     event.persist();
-    var valueAsDate = parseFromCustomString(event.target.value, 'dd.mm.yy', originalValueAsDate === null || originalValueAsDate === void 0 ? void 0 : originalValueAsDate.getMonth(), originalValueAsDate === null || originalValueAsDate === void 0 ? void 0 : originalValueAsDate.getFullYear());
-    var formattedValue = valueAsDate ? format(valueAsDate) || '' : '';
+    const valueAsDate = parseFromCustomString(event.target.value, 'dd.mm.yy', originalValueAsDate === null || originalValueAsDate === void 0 ? void 0 : originalValueAsDate.getMonth(), originalValueAsDate === null || originalValueAsDate === void 0 ? void 0 : originalValueAsDate.getFullYear());
+    const formattedValue = valueAsDate ? format(valueAsDate) || '' : '';
     event.target.value = formattedValue;
     if (onChange) {
       event.detail = valueAsDate;
@@ -44,13 +43,13 @@ var useDatepicker = function useDatepicker(_ref, ref) {
       onBlur(event);
     }
   };
-  var handleInputChange = function handleInputChange(event) {
+  const handleInputChange = event => {
     setInternalValue(event.target.value);
   };
-  var handleChange = function handleChange(date) {
+  const handleChange = date => {
     setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');
   };
-  var handleKeyDown = function handleKeyDown(event) {
+  const handleKeyDown = event => {
     if (props.onKeyDown) {
       props.onKeyDown(event);
     }
@@ -60,7 +59,8 @@ var useDatepicker = function useDatepicker(_ref, ref) {
       }));
     }
   };
-  var inputProps = _extends({}, props, {
+  const inputProps = {
+    ...props,
     autoComplete: 'off',
     onBlur: handleInputBlur,
     onChange: handleInputChange,
@@ -68,11 +68,12 @@ var useDatepicker = function useDatepicker(_ref, ref) {
     ref: inputRef,
     type: 'text',
     value: internalValue
-  });
-  var calendarProps = _extends({}, calendar, {
+  };
+  const calendarProps = {
+    ...calendar,
     onChange: handleChange,
     value: originalValueAsDate
-  });
+  };
   return {
     input: inputProps,
     calendar: calendarProps

package/dist/esm/packages/taco/src/components/Datepicker/useDatepicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDatepicker.js","sources":["../../../../../../../src/components/Datepicker/useDatepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { parseFromCustomString, format, parse } from '../../utils/date';\nimport { useLocalization } from '../Provider/Localization';\nimport { setInputValueByRef } from '../../utils/input';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { DatepickerProps } from './Datepicker';\nimport { CalendarProps } from '../Calendar/Calendar';\nimport { InputProps as BaseInputProps } from '../Input/Input';\n\ntype InputProps = BaseInputProps & { ref: React.RefObject<HTMLInputElement> };\ntype useDatepicker = React.HTMLAttributes<HTMLDivElement> & {\n calendar: CalendarProps;\n input: InputProps;\n};\n\nexport const useDatepicker = (\n { defaultValue: _, calendar, onBlur, onChange, value, ...props }: DatepickerProps,\n ref: React.Ref<HTMLInputElement>\n): useDatepicker => {\n const inputRef = useMergedRef<HTMLInputElement>(ref);\n const { formatting } = useLocalization();\n const [internalValue, setInternalValue] = React.useState(format(value, formatting.date) ?? '');\n const originalValueAsDate = parse(value);\n\n // update internal value if it changed 'externally'\n React.useEffect(() => {\n const formattedValue = format(value, formatting.date);\n\n if (formattedValue !== internalValue) {\n setInternalValue(formattedValue ?? '');\n }\n }, [value]);\n\n // event handlers\n const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n event.persist();\n\n const valueAsDate = parseFromCustomString(\n event.target.value,\n 'dd.mm.yy',\n originalValueAsDate?.getMonth(),\n originalValueAsDate?.getFullYear()\n );\n const formattedValue = valueAsDate ? format(valueAsDate) \|\| '' : '';\n\n event.target.value = formattedValue;\n\n if (onChange) {\n (event as any).detail = valueAsDate;\n onChange(event);\n } else {\n // update the internal value to use the formatted date\n setInternalValue(formattedValue);\n }\n\n if (onBlur) {\n onBlur(event);\n }\n };\n\n const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n setInternalValue(event.target.value);\n };\n\n const handleChange = date => {\n setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (props.onKeyDown) {\n props.onKeyDown(event);\n }\n\n if (event.key === 'Enter') {\n event.target.dispatchEvent(new Event('focusout', { bubbles: true }));\n }\n };\n\n const inputProps: InputProps = {\n ...props,\n autoComplete: 'off',\n onBlur: handleInputBlur,\n onChange: handleInputChange,\n onKeyDown: handleKeyDown,\n ref: inputRef,\n type: 'text',\n value: internalValue,\n };\n\n const calendarProps: CalendarProps = {\n ...calendar,\n onChange: handleChange,\n value: originalValueAsDate,\n };\n\n return {\n input: inputProps,\n calendar: calendarProps,\n };\n};\n"],"names":["useDatepicker","~~_ref~~","~~ref~~","calendar","onBlur","onChange","value","props","~~_objectWithoutPropertiesLoose~~","~~_excluded","~~inputRef","useMergedRef","~~_useLocalization~~","useLocalization","~~formatting~~","~~_React$useState~~","React","_format","format","date","~~internalValue","setInternalValue","~~originalValueAsDate","parse","formattedValue","handleInputBlur","event","persist","valueAsDate","parseFromCustomString","target","getMonth","getFullYear","detail","handleInputChange","handleChange","setInputValueByRef","current","handleKeyDown","onKeyDown","key","dispatchEvent","Event","bubbles","inputProps","~~_extends","~~autoComplete","type","calendarProps","input"],"mappings":"~~;;;;;;;;IAeaA~~,aAAa,~~GAAG~~,~~SAAhBA~~,~~aAAaA~~,~~CAAAC~~,~~IAAA~~,~~EAEtBC,GAAgC;;MADbC,~~QAAQ~~,GAAAF,IAAA,CAARE,QAAQ~~;~~IAAEC~~,MAAM~~,GAAAH,IAAA,CAANG,MAAM~~;~~IAAEC~~,QAAQ~~,GAAAJ,IAAA,CAARI,QAAQ~~;~~IAAEC~~,KAAK,~~GAAAL,IAAA,CAALK,KAAK~~;~~IAAKC~~,~~KAAK~~,~~GAAAC~~,~~6BAAA~~,~~CAAAP,IAAA,EAAAQ,SAAA;EAG9D,IAAMC,~~QAAQ,GAAGC,YAAY,~~CAAmBT~~,GAAG,CAAC;EACpD,~~IAAAU~~,~~gBAAA~~,~~GAAuBC,~~eAAe,EAAE;~~IAAhCC~~,~~UAAU~~,~~GAAAF~~,~~gBAAA~~,~~CAAVE~~,~~UAAU;EAClB~~,~~IAAAC~~,~~eAAA~~,~~GAA0CC,~~QAAc,EAAAC,OAAA,GAACC,MAAM,~~CAACZ~~,KAAK,~~EAAEQ~~,UAAU,~~CAACK~~,IAAI,CAAC,cAAAF,OAAA,cAAAA,OAAA,GAAI,EAAE,CAAC;~~IAAvFG~~,~~aAAa~~,~~GAAAL,eAAA;IAAEM,gBAAgB,GAAAN,eAAA;EACtC,IAAMO,~~mBAAmB,GAAGC,KAAK,~~CAACjB~~,KAAK,CAAC;;~~EAGxCU~~,SAAe,CAAC;IACZ,~~IAAMQ~~,cAAc,~~GAAGN~~,MAAM,~~CAACZ~~,KAAK,~~EAAEQ~~,UAAU,~~CAACK~~,IAAI,CAAC;IAErD,~~IAAIK~~,cAAc,~~KAAKJ~~,aAAa,EAAE;MAClCC,gBAAgB,~~CAACG~~,cAAc,aAAdA,cAAc,cAAdA,cAAc,GAAI,EAAE,CAAC;;GAE7C,EAAE,~~CAAClB~~,KAAK,CAAC,CAAC;;EAGX,~~IAAMmB~~,eAAe,~~GAAG~~,~~SAAlBA,eAAeA,CAAIC,~~KAAyC;IAC9DA,KAAK,CAACC,OAAO,EAAE;IAEf,~~IAAMC~~,WAAW,GAAGC,qBAAqB,CACrCH,KAAK,CAACI,MAAM,~~CAACxB~~,KAAK,EAClB,UAAU,~~EACVgB~~,mBAAmB,aAAnBA,mBAAmB,uBAAnBA,mBAAmB,CAAES,QAAQ,EAAE,EAC/BT,mBAAmB,aAAnBA,mBAAmB,uBAAnBA,mBAAmB,CAAEU,WAAW,EAAE,CACrC;IACD,~~IAAMR~~,cAAc,GAAGI,WAAW,~~GAAGV~~,MAAM,~~CAACU~~,WAAW,CAAC,IAAI,EAAE,GAAG,EAAE;IAEnEF,KAAK,CAACI,MAAM,~~CAACxB~~,KAAK,~~GAAGkB~~,cAAc;IAEnC,~~IAAInB~~,QAAQ,EAAE;~~MACTqB~~,KAAa,CAACO,MAAM,GAAGL,WAAW;~~MACnCvB~~,QAAQ,~~CAACqB~~,KAAK,CAAC;KAClB,MAAM;;~~MAEHL~~,gBAAgB,~~CAACG~~,cAAc,CAAC;;IAGpC,~~IAAIpB~~,MAAM,EAAE;MACRA,MAAM,~~CAACsB~~,KAAK,CAAC;;GAEpB;EAED,~~IAAMQ~~,iBAAiB,~~GAAG~~,~~SAApBA,iBAAiBA,CAAIR,~~KAA0C;~~IACjEL~~,gBAAgB,~~CAACK~~,KAAK,CAACI,MAAM,~~CAACxB~~,KAAK,CAAC;GACvC;EAED,~~IAAM6B~~,YAAY,~~GAAG~~,~~SAAfA,YAAYA,CAAGhB,~~IAAI;~~IACrBiB~~,kBAAkB,~~CAAC1B~~,QAAQ,~~CAAC2B~~,OAAO,~~EAAEnB~~,MAAM,CAACC,IAAI,~~EAAEL~~,UAAU,~~CAACK~~,IAAI,CAAC,EAAE,UAAU,CAAC;GAClF;EAED,~~IAAMmB~~,aAAa,~~GAAG~~,~~SAAhBA,aAAaA,CAAIZ,~~KAA4C;IAC/D,~~IAAInB~~,KAAK,~~CAACgC~~,SAAS,EAAE;~~MACjBhC~~,KAAK,~~CAACgC~~,SAAS,CAACb,KAAK,CAAC;;IAG1B,IAAIA,KAAK,CAACc,GAAG,KAAK,OAAO,EAAE;MACvBd,KAAK,CAACI,MAAM,CAACW,aAAa,CAAC,IAAIC,KAAK,CAAC,UAAU,EAAE;QAAEC,OAAO,EAAE;OAAM,CAAC,CAAC;;GAE3E;EAED,~~IAAMC~~,UAAU,~~GAAAC~~,~~QAAA~~,~~KACTtC,~~KAAK;~~IACRuC~~,YAAY,EAAE,KAAK;~~IACnB1C~~,MAAM,~~EAAEqB~~,eAAe;~~IACvBpB~~,QAAQ,~~EAAE6B~~,iBAAiB;IAC3BK,SAAS,EAAED,aAAa;~~IACxBpC~~,GAAG,~~EAAEQ~~,QAAQ;~~IACbqC~~,IAAI,EAAE,MAAM;~~IACZzC~~,KAAK,~~EAAEc~~;~~IACV~~;EAED,~~IAAM4B~~,aAAa,~~GAAAH~~,~~QAAA~~,~~KACZ1C,~~QAAQ;IACXE,QAAQ,~~EAAE8B~~,YAAY;~~IACtB7B~~,KAAK,~~EAAEgB~~;~~IACV~~;EAED,OAAO;~~IACH2B~~,KAAK,~~EAAEL~~,UAAU;~~IACjBzC~~,QAAQ,~~EAAE6C~~;GACb;AACL;;;;"}
1	+ {"version":3,"file":"useDatepicker.js","sources":["../../../../../../../src/components/Datepicker/useDatepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { parseFromCustomString, format, parse } from '../../utils/date';\nimport { useLocalization } from '../Provider/Localization';\nimport { setInputValueByRef } from '../../utils/input';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { DatepickerProps } from './Datepicker';\nimport { CalendarProps } from '../Calendar/Calendar';\nimport { InputProps as BaseInputProps } from '../Input/Input';\n\ntype InputProps = BaseInputProps & { ref: React.RefObject<HTMLInputElement> };\ntype useDatepicker = React.HTMLAttributes<HTMLDivElement> & {\n calendar: CalendarProps;\n input: InputProps;\n};\n\nexport const useDatepicker = (\n { defaultValue: _, calendar, onBlur, onChange, value, ...props }: DatepickerProps,\n ref: React.Ref<HTMLInputElement>\n): useDatepicker => {\n const inputRef = useMergedRef<HTMLInputElement>(ref);\n const { formatting } = useLocalization();\n const [internalValue, setInternalValue] = React.useState(format(value, formatting.date) ?? '');\n const originalValueAsDate = parse(value);\n\n // update internal value if it changed 'externally'\n React.useEffect(() => {\n const formattedValue = format(value, formatting.date);\n\n if (formattedValue !== internalValue) {\n setInternalValue(formattedValue ?? '');\n }\n }, [value]);\n\n // event handlers\n const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n event.persist();\n\n const valueAsDate = parseFromCustomString(\n event.target.value,\n 'dd.mm.yy',\n originalValueAsDate?.getMonth(),\n originalValueAsDate?.getFullYear()\n );\n const formattedValue = valueAsDate ? format(valueAsDate) \|\| '' : '';\n\n event.target.value = formattedValue;\n\n if (onChange) {\n (event as any).detail = valueAsDate;\n onChange(event);\n } else {\n // update the internal value to use the formatted date\n setInternalValue(formattedValue);\n }\n\n if (onBlur) {\n onBlur(event);\n }\n };\n\n const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n setInternalValue(event.target.value);\n };\n\n const handleChange = date => {\n setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (props.onKeyDown) {\n props.onKeyDown(event);\n }\n\n if (event.key === 'Enter') {\n event.target.dispatchEvent(new Event('focusout', { bubbles: true }));\n }\n };\n\n const inputProps: InputProps = {\n ...props,\n autoComplete: 'off',\n onBlur: handleInputBlur,\n onChange: handleInputChange,\n onKeyDown: handleKeyDown,\n ref: inputRef,\n type: 'text',\n value: internalValue,\n };\n\n const calendarProps: CalendarProps = {\n ...calendar,\n onChange: handleChange,\n value: originalValueAsDate,\n };\n\n return {\n input: inputProps,\n calendar: calendarProps,\n };\n};\n"],"names":["useDatepicker","defaultValue","_","calendar","onBlur","onChange","value","props","ref","inputRef","useMergedRef","formatting","useLocalization","internalValue","setInternalValue","React","_format","format","date","originalValueAsDate","parse","formattedValue","handleInputBlur","event","persist","valueAsDate","parseFromCustomString","target","getMonth","getFullYear","detail","handleInputChange","handleChange","setInputValueByRef","current","handleKeyDown","onKeyDown","key","dispatchEvent","Event","bubbles","inputProps","autoComplete","type","calendarProps","input"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Dialog/Context.js CHANGED Viewed

@@ -1,24 +1,24 @@
 import { createContext, useContext } from 'react';
 /* eslint-disable @typescript-eslint/no-empty-function */
-var DialogContext = /*#__PURE__*/createContext({
+const DialogContext = /*#__PURE__*/createContext({
   closeOnEscape: true,
   draggable: false,
   drawer: {
     open: false,
-    toggle: function toggle() {}
+    toggle: () => {}
   },
   elements: {
     drawer: undefined,
     extra: undefined
   },
-  onClose: function onClose() {},
+  onClose: () => {},
   props: {},
   ref: null,
   showCloseButton: true,
   size: 'sm'
 });
-var useCurrentDialog = function useCurrentDialog() {
+const useCurrentDialog = () => {
   return useContext(DialogContext);
 };

package/dist/esm/packages/taco/src/components/Dialog/Context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Context.js","sources":["../../../../../../../src/components/Dialog/Context.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function /\nimport as React from 'react';\nimport { DialogSize } from './types';\n\nexport type DialogContext = {\n closeOnEscape: boolean;\n draggable: boolean;\n drawer: {\n open: boolean;\n toggle: () => void;\n };\n elements: {\n drawer?: React.ReactNode;\n extra?: React.ReactNode;\n };\n onClose?: () => void;\n props: Record<string, any>;\n ref: React.Ref<HTMLElement>;\n showCloseButton: boolean;\n size: DialogSize;\n};\n\nexport const DialogContext = React.createContext<DialogContext>({\n closeOnEscape: true,\n draggable: false,\n drawer: {\n open: false,\n toggle: () => {},\n },\n elements: {\n drawer: undefined,\n extra: undefined,\n },\n onClose: () => {},\n props: {},\n ref: null,\n showCloseButton: true,\n size: 'sm',\n});\n\nexport const useCurrentDialog = () => {\n return React.useContext(DialogContext);\n};\n"],"names":["DialogContext","React","closeOnEscape","draggable","drawer","open","toggle","elements","undefined","extra","onClose","props","ref","showCloseButton","size","useCurrentDialog"],"mappings":";;AAAA;~~IAsBaA~~,aAAa,gBAAGC,aAAmB,CAAgB;EAC5DC,aAAa,EAAE,IAAI;EACnBC,SAAS,EAAE,KAAK;EAChBC,MAAM,EAAE;IACJC,IAAI,EAAE,KAAK;IACXC,MAAM,~~EAAE,SAAAA~~;GACX;EACDC,QAAQ,EAAE;IACNH,MAAM,EAAEI,SAAS;IACjBC,KAAK,EAAED;GACV;EACDE,OAAO,~~EAAE~~,~~SAAAA,YAAQ~~;EACjBC,KAAK,EAAE,EAAE;EACTC,GAAG,EAAE,IAAI;EACTC,eAAe,EAAE,IAAI;EACrBC,IAAI,EAAE;CACT;~~IAEYC~~,gBAAgB,~~GAAG,SAAnBA,gBAAgBA~~;~~EACzB~~,OAAOd,UAAgB,CAACD,aAAa,CAAC;AAC1C;;;;"}
1	+ {"version":3,"file":"Context.js","sources":["../../../../../../../src/components/Dialog/Context.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function /\nimport as React from 'react';\nimport { DialogSize } from './types';\n\nexport type DialogContext = {\n closeOnEscape: boolean;\n draggable: boolean;\n drawer: {\n open: boolean;\n toggle: () => void;\n };\n elements: {\n drawer?: React.ReactNode;\n extra?: React.ReactNode;\n };\n onClose?: () => void;\n props: Record<string, any>;\n ref: React.Ref<HTMLElement>;\n showCloseButton: boolean;\n size: DialogSize;\n};\n\nexport const DialogContext = React.createContext<DialogContext>({\n closeOnEscape: true,\n draggable: false,\n drawer: {\n open: false,\n toggle: () => {},\n },\n elements: {\n drawer: undefined,\n extra: undefined,\n },\n onClose: () => {},\n props: {},\n ref: null,\n showCloseButton: true,\n size: 'sm',\n});\n\nexport const useCurrentDialog = () => {\n return React.useContext(DialogContext);\n};\n"],"names":["DialogContext","React","closeOnEscape","draggable","drawer","open","toggle","elements","undefined","extra","onClose","props","ref","showCloseButton","size","useCurrentDialog"],"mappings":";;AAAA;MAsBaA,aAAa,gBAAGC,aAAmB,CAAgB;EAC5DC,aAAa,EAAE,IAAI;EACnBC,SAAS,EAAE,KAAK;EAChBC,MAAM,EAAE;IACJC,IAAI,EAAE,KAAK;IACXC,MAAM,EAAEA;GACX;EACDC,QAAQ,EAAE;IACNH,MAAM,EAAEI,SAAS;IACjBC,KAAK,EAAED;GACV;EACDE,OAAO,EAAEA,QAAQ;EACjBC,KAAK,EAAE,EAAE;EACTC,GAAG,EAAE,IAAI;EACTC,eAAe,EAAE,IAAI;EACrBC,IAAI,EAAE;CACT;MAEYC,gBAAgB,GAAGA;EAC5B,OAAOd,UAAgB,CAACD,aAAa,CAAC;AAC1C;;;;"}

package/dist/esm/packages/taco/src/components/Dialog/Dialog.js CHANGED Viewed

@@ -1,5 +1,4 @@
 import { forwardRef, useMemo, Children, useState, createElement } from 'react';
-import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { Root } from '@radix-ui/react-dialog';
 import { DialogContext } from './Context.js';
 import { Trigger } from './components/Trigger.js';
@@ -7,13 +6,12 @@ import { Content, Title, Footer, Close } from './components/Content.js';
 import { DialogDrawer } from './components/DialogDrawer.js';
 import { Extra } from './components/Extra.js';
-var _excluded = ["children", "closeOnEscape", "defaultOpen", "draggable", "onChange", "onClose", "open", "showCloseButton", "size", "trigger"];
-var useSeparatedChildren = function useSeparatedChildren(initialChildren) {
-  return useMemo(function () {
-    var children = [];
-    var drawer;
-    var extra;
-    Children.toArray(initialChildren).forEach(function (child) {
+const useSeparatedChildren = initialChildren => {
+  return useMemo(() => {
+    const children = [];
+    let drawer;
+    let extra;
+    Children.toArray(initialChildren).forEach(child => {
       var _child$type, _child$type2;
       if (((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.displayName) === DialogDrawer.displayName) {
         drawer = child;
@@ -26,52 +24,39 @@ var useSeparatedChildren = function useSeparatedChildren(initialChildren) {
     return [children, drawer, extra];
   }, [initialChildren]);
 };
-var Dialog = /*#__PURE__*/forwardRef(function Dialog(props, ref) {
-  var initialChildren = props.children,
-    _props$closeOnEscape = props.closeOnEscape,
-    closeOnEscape = _props$closeOnEscape === void 0 ? true : _props$closeOnEscape,
-    defaultOpen = props.defaultOpen,
-    _props$draggable = props.draggable,
-    draggable = _props$draggable === void 0 ? false : _props$draggable,
-    onChange = props.onChange,
-    onClose = props.onClose,
-    open = props.open,
-    _props$showCloseButto = props.showCloseButton,
-    showCloseButton = _props$showCloseButto === void 0 ? true : _props$showCloseButto,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'sm' : _props$size,
-    trigger = props.trigger,
-    otherProps = _objectWithoutPropertiesLoose(props, _excluded);
-  var _useSeparatedChildren = useSeparatedChildren(initialChildren),
-    children = _useSeparatedChildren[0],
-    drawer = _useSeparatedChildren[1],
-    extra = _useSeparatedChildren[2];
-  var _React$useState = useState(false),
-    drawerOpen = _React$useState[0],
-    setDrawerOpen = _React$useState[1];
-  var context = useMemo(function () {
-    return {
-      closeOnEscape: closeOnEscape,
-      draggable: draggable,
-      drawer: {
-        open: drawerOpen,
-        toggle: function toggle() {
-          return setDrawerOpen(function (isDrawerOpen) {
-            return !isDrawerOpen;
-          });
-        }
-      },
-      elements: {
-        drawer: drawer,
-        extra: extra
-      },
-      onClose: onClose,
-      props: otherProps,
-      showCloseButton: showCloseButton,
-      size: size,
-      ref: ref
-    };
-  }, [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]);
+const Dialog = /*#__PURE__*/forwardRef(function Dialog(props, ref) {
+  const {
+    children: initialChildren,
+    closeOnEscape = true,
+    defaultOpen,
+    draggable = false,
+    onChange,
+    onClose,
+    open,
+    showCloseButton = true,
+    size = 'sm',
+    trigger,
+    ...otherProps
+  } = props;
+  const [children, drawer, extra] = useSeparatedChildren(initialChildren);
+  const [drawerOpen, setDrawerOpen] = useState(false);
+  const context = useMemo(() => ({
+    closeOnEscape,
+    draggable,
+    drawer: {
+      open: drawerOpen,
+      toggle: () => setDrawerOpen(isDrawerOpen => !isDrawerOpen)
+    },
+    elements: {
+      drawer,
+      extra
+    },
+    onClose,
+    props: otherProps,
+    showCloseButton,
+    size,
+    ref
+  }), [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]);
   return /*#__PURE__*/createElement(DialogContext.Provider, {
     value: context
   }, /*#__PURE__*/createElement(Root, {