@economic/taco 2.33.1 → 2.34.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (38) hide show
  1. package/dist/esm/index.css +4 -4
  2. package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js +4 -5
  3. package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js.map +1 -1
  4. package/dist/esm/packages/taco/src/components/Menu/components/Trigger.js +9 -7
  5. package/dist/esm/packages/taco/src/components/Menu/components/Trigger.js.map +1 -1
  6. package/dist/esm/packages/taco/src/components/Select2/Select2.js +3 -1
  7. package/dist/esm/packages/taco/src/components/Select2/Select2.js.map +1 -1
  8. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js +2 -1
  9. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js.map +1 -1
  10. package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js +1 -1
  11. package/dist/esm/packages/taco/src/components/Table3/components/Row/Row.js.map +1 -1
  12. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js +0 -1
  13. package/dist/esm/packages/taco/src/components/Table3/features/useTableEditing.js.map +1 -1
  14. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js +1 -0
  15. package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js.map +1 -1
  16. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/Body.js +21 -1
  17. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/Body.js.map +1 -1
  18. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.js +12 -3
  19. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/Filter.js.map +1 -1
  20. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterComparator.js +3 -47
  21. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterComparator.js.map +1 -1
  22. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/util.js +44 -1
  23. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/util.js.map +1 -1
  24. package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.js +1 -1
  25. package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableRenderer.js.map +1 -1
  26. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableRowActive.js +5 -5
  27. package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableRowActive.js.map +1 -1
  28. package/dist/esm/packages/taco/src/utils/dom.js +4 -1
  29. package/dist/esm/packages/taco/src/utils/dom.js.map +1 -1
  30. package/dist/index.css +4 -4
  31. package/dist/primitives/Table/Core/components/Body/Body.d.ts +2 -0
  32. package/dist/primitives/Table/Core/components/Toolbar/components/Filters/util.d.ts +2 -1
  33. package/dist/taco.cjs.development.js +98 -72
  34. package/dist/taco.cjs.development.js.map +1 -1
  35. package/dist/taco.cjs.production.min.js +1 -1
  36. package/dist/taco.cjs.production.min.js.map +1 -1
  37. package/dist/utils/dom.d.ts +1 -0
  38. package/package.json +2 -2
@@ -625,16 +625,16 @@ table[data-taco^='table'] tr:last-child th:before {
625
625
  /* row groups */
626
626
 
627
627
  table[data-taco^='table'] tr[data-row-group] {
628
- @apply bg-grey-100 sticky top-[calc((var(--table-header-group-depth)_-_1)_*_40px_+_42px)] z-30 mt-10 print:mt-0;
628
+ @apply bg-grey-100 sticky top-[calc((var(--table-header-group-depth)_-_1)_*_40px_+_42px)] z-30 pt-10 print:pt-0;
629
629
  }
630
630
 
631
631
  table[data-taco^='table'] tr[data-row-group]:first-child {
632
- @apply mt-0;
632
+ @apply pt-0;
633
633
  }
634
634
 
635
635
  table[data-taco^='table'] tr[data-row-group]:not(:first-child):before {
636
636
  content: '';
637
- @apply bg-grey-100 border-grey-300 absolute -top-full left-0 right-0 mt-px h-10 border-t print:top-0 print:h-[2px] print:border-t-2;
637
+ @apply bg-grey-100 border-grey-300 absolute left-0 right-0 top-0 h-10 border-t print:top-0 print:h-[2px] print:border-t-2;
638
638
  }
639
639
 
640
640
  table[data-taco^='table'] tr[data-row-group] td {
@@ -1231,7 +1231,7 @@ table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-mov
1231
1231
  }
1232
1232
 
1233
1233
  table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] td {
1234
- @apply border-b-0;
1234
+ @apply z-30 border-b-0;
1235
1235
  }
1236
1236
 
1237
1237
  table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] > td:first-child {
@@ -1,5 +1,6 @@
1
1
  import { useRef, useState, useMemo, useEffect } from 'react';
2
2
  import { useMergedRef } from '../../hooks/useMergedRef.js';
3
+ import { isElementInsideTable3OrReport } from '../../utils/dom.js';
3
4
  import { v4 } from 'uuid';
4
5
  import debounce from 'lodash-es/debounce';
5
6
  import { getId } from '../Listbox/ScrollableList.js';
@@ -131,9 +132,7 @@ const useCombobox = ({
131
132
  }
132
133
  };
133
134
  const handleInputKeyDown = event => {
134
- var _inputRef$current;
135
135
  event.persist();
136
- const insideTheTable = !!((_inputRef$current = inputRef.current) !== null && _inputRef$current !== void 0 && _inputRef$current.closest('table, [role="rowgroup"]'));
137
136
  if (!event.ctrlKey && !event.metaKey) {
138
137
  switch (event.key) {
139
138
  case 'Backspace':
@@ -155,7 +154,7 @@ const useCombobox = ({
155
154
  }
156
155
  case 'Enter':
157
156
  {
158
- if (insideTheTable) {
157
+ if (isElementInsideTable3OrReport(event.currentTarget)) {
159
158
  event.preventDefault();
160
159
  if (inline && !open) {
161
160
  setOpen(true);
@@ -173,7 +172,7 @@ const useCombobox = ({
173
172
  if (open) {
174
173
  event.preventDefault();
175
174
  } else {
176
- if (!inline && buttonRef.current && !insideTheTable) {
175
+ if (!inline && buttonRef.current && !isElementInsideTable3OrReport(event.currentTarget)) {
177
176
  buttonRef.current.click();
178
177
  }
179
178
  }
@@ -193,7 +192,7 @@ const useCombobox = ({
193
192
  listRef.current.dispatchEvent(createCustomKeyboardEvent(event));
194
193
  }
195
194
  if (inline && !open) {
196
- if ((event.key === 'ArrowUp' || event.key === 'ArrowDown') && !insideTheTable) {
195
+ if ((event.key === 'ArrowUp' || event.key === 'ArrowDown') && !isElementInsideTable3OrReport(event.currentTarget)) {
197
196
  event.preventDefault();
198
197
  const initialIndex = event.key === 'ArrowUp' ? data.length - 1 : 0;
199
198
  setCurrentIndex(currentIndex !== undefined ? currentIndex : initialIndex);
@@ -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';\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 const insideTheTable = !!inputRef.current?.closest('table, [role=\"rowgroup\"]');\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 if (insideTheTable) {\n event.preventDefault();\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 && !insideTheTable) {\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 ((event.key === 'ArrowUp' || event.key === 'ArrowDown') && !insideTheTable) {\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","insideTheTable","_inputRef$current","closest","ctrlKey","metaKey","key","click","dispatchEvent","createCustomKeyboardEvent","initialIndex","isDefaultPrevented","handleListboxChange","handleListboxClick","combobox","role","input","getId","type","list","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 if (isElementInsideTable3OrReport(event.currentTarget)) {\n event.preventDefault();\n\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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"}
@@ -1,5 +1,6 @@
1
1
  import { forwardRef, useEffect, createElement } from 'react';
2
2
  import { useMergedRef } from '../../../hooks/useMergedRef.js';
3
+ import { isElementInsideTable3OrReport } from '../../../utils/dom.js';
3
4
  import { createCustomKeyboardEvent } from '../../../utils/input.js';
4
5
  import { useCurrentMenu } from '../Context.js';
5
6
  import { Trigger as Trigger$1 } from '@radix-ui/react-dropdown-menu';
@@ -7,12 +8,13 @@ import { Trigger as Trigger$1 } from '@radix-ui/react-dropdown-menu';
7
8
  const Trigger = /*#__PURE__*/forwardRef(function MenuTrigger(props, ref) {
8
9
  const menu = useCurrentMenu();
9
10
  const internalRef = useMergedRef(ref);
10
- const preventArrowDownShortcut = event => {
11
- var _internalRef$current;
12
- const isRenderedInTable = !!((_internalRef$current = internalRef.current) !== null && _internalRef$current !== void 0 && _internalRef$current.closest('tbody'));
13
- if (isRenderedInTable && event.key === 'ArrowDown') {
14
- var _internalRef$current2, _internalRef$current3;
15
- internalRef === null || internalRef === void 0 ? void 0 : (_internalRef$current2 = internalRef.current) === null || _internalRef$current2 === void 0 ? void 0 : (_internalRef$current3 = _internalRef$current2.parentNode) === null || _internalRef$current3 === void 0 ? void 0 : _internalRef$current3.dispatchEvent(createCustomKeyboardEvent(event));
11
+ const handleKeyDown = event => {
12
+ if (event.key === 'ArrowDown') {
13
+ if (isElementInsideTable3OrReport(event.currentTarget)) {
14
+ var _event$currentTarget$;
15
+ event.preventDefault();
16
+ (_event$currentTarget$ = event.currentTarget.parentNode) === null || _event$currentTarget$ === void 0 ? void 0 : _event$currentTarget$.dispatchEvent(createCustomKeyboardEvent(event));
17
+ }
16
18
  }
17
19
  };
18
20
  useEffect(() => {
@@ -23,7 +25,7 @@ const Trigger = /*#__PURE__*/forwardRef(function MenuTrigger(props, ref) {
23
25
  return /*#__PURE__*/createElement(Trigger$1, Object.assign({}, props, {
24
26
  asChild: true,
25
27
  ref: internalRef,
26
- onKeyDown: preventArrowDownShortcut
28
+ onKeyDown: handleKeyDown
27
29
  }));
28
30
  });
29
31
 
@@ -1 +1 @@
1
- {"version":3,"file":"Trigger.js","sources":["../../../../../../../../src/components/Menu/components/Trigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { useCurrentMenu } from '../Context';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\n\nexport type MenuTriggerProps = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children'> & {\n children: React.ReactElement;\n};\n\nexport const Trigger = React.forwardRef(function MenuTrigger(props: MenuTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n const menu = useCurrentMenu();\n const internalRef = useMergedRef<HTMLButtonElement>(ref);\n\n const preventArrowDownShortcut = (event: React.KeyboardEvent) => {\n const isRenderedInTable = !!internalRef.current?.closest('tbody');\n\n if (isRenderedInTable && event.key === 'ArrowDown') {\n internalRef?.current?.parentNode?.dispatchEvent(\n createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>)\n );\n }\n };\n\n React.useEffect(() => {\n if (internalRef.current) {\n menu?.setMinWidth(internalRef.current.getBoundingClientRect().width);\n }\n }, [internalRef]);\n\n return <DropdownMenuPrimitive.Trigger {...props} asChild ref={internalRef} onKeyDown={preventArrowDownShortcut} />;\n});\n"],"names":["Trigger","React","MenuTrigger","props","ref","menu","useCurrentMenu","internalRef","useMergedRef","preventArrowDownShortcut","event","isRenderedInTable","_internalRef$current","current","closest","key","_internalRef$current2","_internalRef$current3","parentNode","dispatchEvent","createCustomKeyboardEvent","setMinWidth","getBoundingClientRect","width","DropdownMenuPrimitive","asChild","onKeyDown"],"mappings":";;;;;;MAUaA,OAAO,gBAAGC,UAAgB,CAAC,SAASC,WAAWA,CAACC,KAAuB,EAAEC,GAAiC;EACnH,MAAMC,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAMC,WAAW,GAAGC,YAAY,CAAoBJ,GAAG,CAAC;EAExD,MAAMK,wBAAwB,GAAIC,KAA0B;;IACxD,MAAMC,iBAAiB,GAAG,CAAC,GAAAC,oBAAA,GAACL,WAAW,CAACM,OAAO,cAAAD,oBAAA,eAAnBA,oBAAA,CAAqBE,OAAO,CAAC,OAAO,CAAC;IAEjE,IAAIH,iBAAiB,IAAID,KAAK,CAACK,GAAG,KAAK,WAAW,EAAE;MAAA,IAAAC,qBAAA,EAAAC,qBAAA;MAChDV,WAAW,aAAXA,WAAW,wBAAAS,qBAAA,GAAXT,WAAW,CAAEM,OAAO,cAAAG,qBAAA,wBAAAC,qBAAA,GAApBD,qBAAA,CAAsBE,UAAU,cAAAD,qBAAA,uBAAhCA,qBAAA,CAAkCE,aAAa,CAC3CC,yBAAyB,CAACV,KAA8C,CAAC,CAC5E;;GAER;EAEDT,SAAe,CAAC;IACZ,IAAIM,WAAW,CAACM,OAAO,EAAE;MACrBR,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEgB,WAAW,CAACd,WAAW,CAACM,OAAO,CAACS,qBAAqB,EAAE,CAACC,KAAK,CAAC;;GAE3E,EAAE,CAAChB,WAAW,CAAC,CAAC;EAEjB,oBAAON,cAACuB,SAA6B,oBAAKrB,KAAK;IAAEsB,OAAO;IAACrB,GAAG,EAAEG,WAAW;IAAEmB,SAAS,EAAEjB;KAA4B;AACtH,CAAC;;;;"}
1
+ {"version":3,"file":"Trigger.js","sources":["../../../../../../../../src/components/Menu/components/Trigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { useCurrentMenu } from '../Context';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\nimport { isElementInsideTable3OrReport } from '../../../utils/dom';\n\nexport type MenuTriggerProps = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children'> & {\n children: React.ReactElement;\n};\n\nexport const Trigger = React.forwardRef(function MenuTrigger(props: MenuTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n const menu = useCurrentMenu();\n const internalRef = useMergedRef<HTMLButtonElement>(ref);\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (event.key === 'ArrowDown') {\n if (isElementInsideTable3OrReport(event.currentTarget)) {\n event.preventDefault();\n event.currentTarget.parentNode?.dispatchEvent(\n createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>)\n );\n }\n }\n };\n\n React.useEffect(() => {\n if (internalRef.current) {\n menu?.setMinWidth(internalRef.current.getBoundingClientRect().width);\n }\n }, [internalRef]);\n\n return <DropdownMenuPrimitive.Trigger {...props} asChild ref={internalRef} onKeyDown={handleKeyDown} />;\n});\n"],"names":["Trigger","React","MenuTrigger","props","ref","menu","useCurrentMenu","internalRef","useMergedRef","handleKeyDown","event","key","isElementInsideTable3OrReport","currentTarget","_event$currentTarget$","preventDefault","parentNode","dispatchEvent","createCustomKeyboardEvent","current","setMinWidth","getBoundingClientRect","width","DropdownMenuPrimitive","asChild","onKeyDown"],"mappings":";;;;;;;MAWaA,OAAO,gBAAGC,UAAgB,CAAC,SAASC,WAAWA,CAACC,KAAuB,EAAEC,GAAiC;EACnH,MAAMC,IAAI,GAAGC,cAAc,EAAE;EAC7B,MAAMC,WAAW,GAAGC,YAAY,CAAoBJ,GAAG,CAAC;EAExD,MAAMK,aAAa,GAAIC,KAA0B;IAC7C,IAAIA,KAAK,CAACC,GAAG,KAAK,WAAW,EAAE;MAC3B,IAAIC,6BAA6B,CAACF,KAAK,CAACG,aAAa,CAAC,EAAE;QAAA,IAAAC,qBAAA;QACpDJ,KAAK,CAACK,cAAc,EAAE;QACtB,CAAAD,qBAAA,GAAAJ,KAAK,CAACG,aAAa,CAACG,UAAU,cAAAF,qBAAA,uBAA9BA,qBAAA,CAAgCG,aAAa,CACzCC,yBAAyB,CAACR,KAA8C,CAAC,CAC5E;;;GAGZ;EAEDT,SAAe,CAAC;IACZ,IAAIM,WAAW,CAACY,OAAO,EAAE;MACrBd,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEe,WAAW,CAACb,WAAW,CAACY,OAAO,CAACE,qBAAqB,EAAE,CAACC,KAAK,CAAC;;GAE3E,EAAE,CAACf,WAAW,CAAC,CAAC;EAEjB,oBAAON,cAACsB,SAA6B,oBAAKpB,KAAK;IAAEqB,OAAO;IAACpB,GAAG,EAAEG,WAAW;IAAEkB,SAAS,EAAEhB;KAAiB;AAC3G,CAAC;;;;"}
@@ -1,7 +1,7 @@
1
1
  import React__default from 'react';
2
2
  import cn from 'clsx';
3
3
  import { useMergedRef } from '../../hooks/useMergedRef.js';
4
- import { getNextFocussableElement } from '../../utils/dom.js';
4
+ import { isElementInsideTable3OrReport, getNextFocussableElement } from '../../utils/dom.js';
5
5
  import { useLocalization } from '../Provider/Localization.js';
6
6
  import { Button } from '../Button/Button.js';
7
7
  import { Spinner } from '../Spinner/Spinner.js';
@@ -134,6 +134,8 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
134
134
  var _listboxRef$current;
135
135
  if (open) {
136
136
  event.preventDefault();
137
+ } else if (isElementInsideTable3OrReport(event.currentTarget)) {
138
+ return;
137
139
  } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {
138
140
  setOpen(true);
139
141
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport {\n Select2Children,\n Select2CreateHandler,\n Select2DeleteHandler,\n Select2EditHandler,\n Select2OptionValue,\n Select2Value,\n} from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName, getFontSize } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { isGroup, useChildren } from './hooks/useChildren';\n\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Localization';\nimport { useIsHoverStatePaused } from '../../hooks/useIsHoverStatePaused';\nimport { isAriaDirectionKey } from '../../utils/aria';\nimport { getNextFocussableElement } from '../../utils/dom';\nimport { FontSize, FontSizes } from '../../types';\nimport { Button } from '../Button/Button';\nimport { Spinner } from '../Spinner/Spinner';\n\ntype Select2Texts = {\n allSelect: string;\n allDeselect: string;\n cancel: string;\n chooseColor: string;\n create: string;\n delete: string;\n save: string;\n search: string;\n searchOrCreate: string;\n selectAll: string;\n selectAllResults: string;\n deselectAll: string;\n deselectAllResults: string;\n};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n /** Autofocus Select2 when loaded **/\n autoFocus?: boolean;\n /** Array of options in Select2 */\n children: Select2Children;\n /** Initial value of the input in Select2 */\n defaultValue?: Select2Value;\n /** Set what value should have an empty option in Select2 */\n emptyValue?: Select2OptionValue;\n /** Whether the Select2 is in a disabled state **/\n disabled?: boolean;\n /** Font size of text in Select2 **/\n fontSize?: FontSize;\n /** Draws attention to the Select2 by changing its style and making it visually prominent */\n highlighted?: boolean;\n /** Whether the Select2 is in an invalid state **/\n invalid?: boolean;\n /** Whether the Select2 is loading the data **/\n loading?: boolean;\n /** Whether the Select2 allows selecting multiple values **/\n multiple?: boolean;\n /** Whether the Select2 is in an invalid state **/\n name?: string;\n /** Handler called when user chooses an option from the provided options **/\n onChange?: (value: Select2Value) => void;\n /** Handler called when user creates a new option **/\n onCreate?: Select2CreateHandler;\n /** Handler called when user deletes an option **/\n onDelete?: Select2DeleteHandler;\n /** Handler called when user edits an option **/\n onEdit?: Select2EditHandler;\n /** Placeholder showed when nothing is selected **/\n placeholder?: string;\n /** Whether the Select2 is in a readonly state **/\n readOnly?: boolean;\n required?: boolean;\n /** Renders select options as tags **/\n tags?: boolean;\n /** Value of the input in select2 */\n value?: Select2Value;\n};\ntype Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nconst Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n const {\n children: initChildren,\n defaultValue: defaultProp,\n disabled = false,\n emptyValue = undefined,\n fontSize,\n highlighted = false,\n invalid = false,\n loading,\n multiple = false,\n name,\n onChange,\n onCreate,\n onDelete,\n onEdit,\n placeholder,\n readOnly = false,\n tags = false,\n value: prop,\n ...otherProps\n } = props;\n\n const emptyOption: React.ReactElement<Select2OptionProps> | undefined = React.useMemo(() => {\n if (emptyValue !== undefined && !multiple) {\n // Empty option has 0px height, because it's empty, so need to apply height manually\n return <Option key=\"__empty\" children=\"\" value={emptyValue} className=\"h-8\" />;\n }\n return;\n }, [emptyValue, multiple]);\n\n const initialChildren = React.useMemo(() => {\n if (emptyOption) {\n return [emptyOption, ...initChildren] as Select2Children;\n }\n return initChildren;\n }, [emptyOption, initChildren]);\n\n // refs\n const internalRef = useMergedRef<HTMLButtonElement>(ref);\n const listboxRef = React.useRef<CollectionRef>(null);\n const searchRef = React.useRef<HTMLInputElement>(null);\n const { texts } = useLocalization();\n // align the listbox min width with the width of the input - it should never be smaller\n const dimensions = useBoundingClientRectListener(internalRef);\n\n // state\n const [tabTriggeredClose, setTabTriggeredClose] = React.useState(false);\n const [open, setOpen] = React.useState(false);\n const [value, _setValue] = useControllableState<Select2Value>({\n // uncontrolled\n defaultProp,\n // controlled\n onChange,\n prop,\n });\n const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n const [validationError, setValidationError] = React.useState<Error | undefined>();\n const [shouldPauseHoverState, setShouldPauseHoverState] = useIsHoverStatePaused();\n\n const { flattenedChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n children: initialChildren,\n emptyValue,\n multiple,\n open,\n setValue,\n value,\n });\n\n // context\n const context = {\n disabled,\n highlighted,\n invalid,\n listboxRef,\n multiple,\n onCreate,\n onDelete,\n onEdit,\n open,\n readOnly,\n ref: internalRef,\n searchQuery,\n searchRef,\n setOpen,\n setSearchQuery,\n setValidationError,\n setValue,\n shouldPauseHoverState,\n setShouldPauseHoverState,\n tags,\n fontSize,\n validationError,\n value,\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (open) {\n event.preventDefault();\n } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {\n setOpen(true);\n }\n\n // the focus should always remain on the input, so we forward events on to the listbox\n listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n };\n\n let handleBlur;\n\n if (otherProps.onBlur) {\n // we might be focusing on an input or something inside the dropdown that was triggered by the select\n // so see if the element gaining focus is inside a portal and look up its controller\n // if we don't do this, things like validate on blur occur while simply opening the select\n handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n const elementGainingFocus = event.relatedTarget;\n\n if (elementGainingFocus === undefined) {\n return;\n }\n\n const portalId = elementGainingFocus?.closest('[data-radix-popper-content-wrapper] > :first-child')?.id;\n\n if (!portalId || event.currentTarget.getAttribute(`aria-controls`) !== portalId) {\n otherProps.onBlur?.(event);\n }\n };\n }\n\n const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (isAriaDirectionKey(event)) {\n setShouldPauseHoverState(true);\n }\n };\n\n const handleCloseAutoFocus = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n\n if (tabTriggeredClose) {\n const nextFocussableElement = getNextFocussableElement(internalRef.current);\n\n if (nextFocussableElement) {\n // UX requirement: move focus to the next focussable element when tab key is pressed to select the value\n nextFocussableElement.focus();\n // Reset the tabTriggeredClose state\n setTabTriggeredClose(false);\n }\n } else {\n internalRef.current?.focus();\n }\n };\n\n const selectOptions =\n searchQuery === ''\n ? flattenedChildren.map(child => child.props.value)\n : filteredChildren\n .map(child =>\n isGroup(child)\n ? Array.isArray(child.props.children) && child.props.children.map(subChild => subChild.props.value)\n : child.props.value\n )\n .flatMap(c => c) || [];\n\n const areAllSelected = Array.isArray(value) && selectOptions.every(option => value.includes(option as string));\n\n const selectAllText = React.useMemo(() => {\n if (searchQuery === '') {\n if (areAllSelected) {\n return texts.select2.deselectAll;\n } else {\n return texts.select2.selectAll;\n }\n } else if (areAllSelected) {\n return texts.select2.deselectAllResults;\n } else {\n return texts.select2.selectAllResults;\n }\n }, [areAllSelected, searchQuery]);\n\n const selectAll = () => {\n if (!Array.isArray(value) || value.length === 0) {\n setValue(selectOptions);\n } else {\n // array of all available options which are not selected\n const preselectedValues = selectOptions.filter(option => !value.includes(option));\n setValue([...value, ...preselectedValues]);\n }\n };\n\n const deselectAll = () => {\n if (searchQuery === '') {\n setValue([]);\n } else {\n const nextValue = Array.isArray(value) && value.filter(subValue => !selectOptions.includes(subValue as string));\n setValue(nextValue);\n }\n };\n\n const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none\"', createCollectionClassName());\n\n return (\n <Select2Context.Provider value={context}>\n <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n <ControlledHiddenField\n emptyValue={emptyValue}\n multiple={multiple || tags}\n name={name}\n options={flattenedChildren.map(child => child.props.value)}\n parentRef={internalRef}\n setValue={setValue}\n value={value}\n />\n <PopoverPrimitive.Trigger asChild data-taco=\"Select2\">\n <Trigger\n {...otherProps}\n aria-haspopup=\"listbox\"\n emptyValue={emptyValue}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n ref={internalRef}>\n {flattenedChildren}\n </Trigger>\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n asChild\n align=\"start\"\n onOpenAutoFocus={() => {\n internalRef.current?.focus();\n }}\n onCloseAutoFocus={handleCloseAutoFocus}\n sideOffset={4}\n tabIndex={-1}>\n <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n {flattenedChildren.length > 0 || onCreate ? (\n <>\n <Search\n placeholder={onCreate ? texts.select2.searchOrCreate : texts.select2.search}\n ref={searchRef}\n onTabKeyPress={() => setTabTriggeredClose(true)}\n />\n {multiple && selectOptions.length > 1 && (\n <>\n <Button\n className=\"!justify-start\"\n appearance=\"discrete\"\n onClick={areAllSelected ? deselectAll : selectAll}>\n {selectAllText}\n </Button>\n <div className=\"border-grey-300 mx-3 rounded border-t\" />\n </>\n )}\n </>\n ) : null}\n {loading ? (\n <span className={cn('text-grey-700 flex items-center italic', fontSize && getFontSize(fontSize))}>\n <span>\n <Spinner\n delay={0}\n className={cn('ml-3 mr-2 mt-1.5 h-5 w-5', {\n '!mt-1 !h-3.5 !w-3.5': fontSize === FontSizes.small,\n '!h-4 !w-4': fontSize === FontSizes.medium,\n '!h-5 !w-5': fontSize === FontSizes.large,\n })}\n />\n </span>\n <span>{texts.listbox.loading}</span>\n </span>\n ) : flattenedChildren.length <= 0 ? (\n <div className=\"text-grey-700 -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n No results found...\n </div>\n ) : (\n <ListboxPrimitive.Root\n className=\"flex flex-col gap-0.5\"\n customSelector=\":scope > button\"\n disabled={disabled}\n multiple={multiple}\n onKeyDown={handleListboxKeyDown}\n readOnly={readOnly}\n ref={listboxRef}\n setValue={setValue}\n tabIndex={-1}\n value={value}>\n {searchQuery === '' ? (\n <Collection>{initialChildren}</Collection>\n ) : (\n <Collection>{filteredChildren}</Collection>\n )}\n {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n </ListboxPrimitive.Root>\n )}\n </div>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n </Select2Context.Provider>\n );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n let bubbleValue;\n\n if (isFormControl) {\n if (value !== undefined) {\n if (multiple) {\n bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n } else {\n bubbleValue = value === null ? '' : String(value);\n }\n }\n\n return (\n <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} value={bubbleValue}>\n {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n {options.map(option => (\n <option key={String(option)} value={String(option)} />\n ))}\n </BubbleSelect>\n );\n }\n\n return null;\n};\nSelect2.displayName = 'Select2';\n\nexport { Select2 };\n\nexport type {\n Select2Texts,\n Select2GroupProps,\n Select2OptionProps,\n Select2OptionValue,\n Select2Value,\n Select2Props,\n Select2TitleProps,\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initChildren","defaultValue","defaultProp","disabled","emptyValue","undefined","fontSize","highlighted","invalid","loading","multiple","name","onChange","onCreate","onDelete","onEdit","placeholder","readOnly","tags","value","prop","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","tabTriggeredClose","setTabTriggeredClose","useState","open","setOpen","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","currentTarget","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","stopPropagation","nextFocussableElement","getNextFocussableElement","focus","_internalRef$current","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","length","preselectedValues","filter","nextValue","subValue","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","ControlledHiddenField","options","parentRef","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current2","onCloseAutoFocus","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","onTabKeyPress","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","customSelector","Collection","Create","Group","Title","isFormControl","useIsFormControl","bubbleValue","String","BubbleSelect","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAqGMA,OAAO,gBAAGC,cAAK,CAACC,UAAU,CAAkC,SAASF,OAAOA,CAACG,KAAK,EAAEC,GAAG;EACzF,MAAM;IACFC,QAAQ,EAAEC,YAAY;IACtBC,YAAY,EAAEC,WAAW;IACzBC,QAAQ,GAAG,KAAK;IAChBC,UAAU,GAAGC,SAAS;IACtBC,QAAQ;IACRC,WAAW,GAAG,KAAK;IACnBC,OAAO,GAAG,KAAK;IACfC,OAAO;IACPC,QAAQ,GAAG,KAAK;IAChBC,IAAI;IACJC,QAAQ;IACRC,QAAQ;IACRC,QAAQ;IACRC,MAAM;IACNC,WAAW;IACXC,QAAQ,GAAG,KAAK;IAChBC,IAAI,GAAG,KAAK;IACZC,KAAK,EAAEC,IAAI;IACX,GAAGC;GACN,GAAGxB,KAAK;EAET,MAAMyB,WAAW,GAAuD3B,cAAK,CAAC4B,OAAO,CAAC;IAClF,IAAInB,UAAU,KAAKC,SAAS,IAAI,CAACK,QAAQ,EAAE;;MAEvC,oBAAOf,6BAAC6B,MAAM;QAACC,GAAG,EAAC,SAAS;QAAC1B,QAAQ,EAAC,EAAE;QAACoB,KAAK,EAAEf,UAAU;QAAEsB,SAAS,EAAC;QAAQ;;IAElF;GACH,EAAE,CAACtB,UAAU,EAAEM,QAAQ,CAAC,CAAC;EAE1B,MAAMiB,eAAe,GAAGhC,cAAK,CAAC4B,OAAO,CAAC;IAClC,IAAID,WAAW,EAAE;MACb,OAAO,CAACA,WAAW,EAAE,GAAGtB,YAAY,CAAoB;;IAE5D,OAAOA,YAAY;GACtB,EAAE,CAACsB,WAAW,EAAEtB,YAAY,CAAC,CAAC;;EAG/B,MAAM4B,WAAW,GAAGC,YAAY,CAAoB/B,GAAG,CAAC;EACxD,MAAMgC,UAAU,GAAGnC,cAAK,CAACoC,MAAM,CAAgB,IAAI,CAAC;EACpD,MAAMC,SAAS,GAAGrC,cAAK,CAACoC,MAAM,CAAmB,IAAI,CAAC;EACtD,MAAM;IAAEE;GAAO,GAAGC,eAAe,EAAE;;EAEnC,MAAMC,UAAU,GAAGC,6BAA6B,CAACR,WAAW,CAAC;;EAG7D,MAAM,CAACS,iBAAiB,EAAEC,oBAAoB,CAAC,GAAG3C,cAAK,CAAC4C,QAAQ,CAAC,KAAK,CAAC;EACvE,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAG9C,cAAK,CAAC4C,QAAQ,CAAC,KAAK,CAAC;EAC7C,MAAM,CAACpB,KAAK,EAAEuB,SAAS,CAAC,GAAGC,oBAAoB,CAAe;;IAE1DzC,WAAW;;IAEXU,QAAQ;IACRQ;GACH,CAAC;EACF,MAAMwB,QAAQ,GAAGC,wBAAyC,CAACnC,QAAQ,EAAEgC,SAAS,CAAC;EAC/E,MAAM,CAACI,eAAe,EAAEC,kBAAkB,CAAC,GAAGpD,cAAK,CAAC4C,QAAQ,EAAqB;EACjF,MAAM,CAACS,qBAAqB,EAAEC,wBAAwB,CAAC,GAAGC,qBAAqB,EAAE;EAEjF,MAAM;IAAEC,iBAAiB;IAAEC,gBAAgB;IAAEC,WAAW;IAAEC;GAAgB,GAAGC,WAAW,CAAC;IACrFxD,QAAQ,EAAE4B,eAAe;IACzBvB,UAAU;IACVM,QAAQ;IACR8B,IAAI;IACJI,QAAQ;IACRzB;GACH,CAAC;;EAGF,MAAMqC,OAAO,GAAG;IACZrD,QAAQ;IACRI,WAAW;IACXC,OAAO;IACPsB,UAAU;IACVpB,QAAQ;IACRG,QAAQ;IACRC,QAAQ;IACRC,MAAM;IACNyB,IAAI;IACJvB,QAAQ;IACRnB,GAAG,EAAE8B,WAAW;IAChByB,WAAW;IACXrB,SAAS;IACTS,OAAO;IACPa,cAAc;IACdP,kBAAkB;IAClBH,QAAQ;IACRI,qBAAqB;IACrBC,wBAAwB;IACxB/B,IAAI;IACJZ,QAAQ;IACRwC,eAAe;IACf3B;GACH;EAED,MAAMsC,aAAa,GAAIC,KAAuC;;IAC1D,IAAIlB,IAAI,EAAE;MACNkB,KAAK,CAACC,cAAc,EAAE;KACzB,MAAM,IAAI,CAACD,KAAK,CAACE,OAAO,IAAI,CAACF,KAAK,CAACG,OAAO,KAAKH,KAAK,CAACjC,GAAG,KAAK,WAAW,IAAI,aAAa,CAACqC,IAAI,CAACJ,KAAK,CAACjC,GAAG,CAAC,CAAC,EAAE;MACzGgB,OAAO,CAAC,IAAI,CAAC;;;IAIjB,CAAAsB,mBAAA,GAAAjC,UAAU,CAACkC,OAAO,cAAAD,mBAAA,uBAAlBA,mBAAA,CAAoBE,aAAa,CAACC,yBAAyB,CAACR,KAA8C,CAAC,CAAC;GAC/G;EAED,IAAIS,UAAU;EAEd,IAAI9C,UAAU,CAAC+C,MAAM,EAAE;;;;IAInBD,UAAU,GAAIT,KAA0C;;MACpD,MAAMW,mBAAmB,GAAGX,KAAK,CAACY,aAAa;MAE/C,IAAID,mBAAmB,KAAKhE,SAAS,EAAE;QACnC;;MAGJ,MAAMkE,QAAQ,GAAGF,mBAAmB,aAAnBA,mBAAmB,wBAAAG,qBAAA,GAAnBH,mBAAmB,CAAEI,OAAO,CAAC,oDAAoD,CAAC,cAAAD,qBAAA,uBAAlFA,qBAAA,CAAoFE,EAAE;MAEvG,IAAI,CAACH,QAAQ,IAAIb,KAAK,CAACiB,aAAa,CAACC,YAAY,gBAAgB,CAAC,KAAKL,QAAQ,EAAE;QAAA,IAAAM,kBAAA;QAC7E,CAAAA,kBAAA,GAAAxD,UAAU,CAAC+C,MAAM,cAAAS,kBAAA,uBAAjBA,kBAAA,CAAAC,IAAA,CAAAzD,UAAU,EAAUqC,KAAK,CAAC;;KAEjC;;EAGL,MAAMqB,oBAAoB,GAAIrB,KAAuC;IACjE,IAAIsB,kBAAkB,CAACtB,KAAK,CAAC,EAAE;MAC3BT,wBAAwB,CAAC,IAAI,CAAC;;GAErC;EAED,MAAMgC,oBAAoB,GAAIvB,KAAY;IACtCA,KAAK,CAACC,cAAc,EAAE;IACtBD,KAAK,CAACwB,eAAe,EAAE;IAEvB,IAAI7C,iBAAiB,EAAE;MACnB,MAAM8C,qBAAqB,GAAGC,wBAAwB,CAACxD,WAAW,CAACoC,OAAO,CAAC;MAE3E,IAAImB,qBAAqB,EAAE;;QAEvBA,qBAAqB,CAACE,KAAK,EAAE;;QAE7B/C,oBAAoB,CAAC,KAAK,CAAC;;KAElC,MAAM;MAAA,IAAAgD,oBAAA;MACH,CAAAA,oBAAA,GAAA1D,WAAW,CAACoC,OAAO,cAAAsB,oBAAA,uBAAnBA,oBAAA,CAAqBD,KAAK,EAAE;;GAEnC;EAED,MAAME,aAAa,GACflC,WAAW,KAAK,EAAE,GACZF,iBAAiB,CAACqC,GAAG,CAACC,KAAK,IAAIA,KAAK,CAAC5F,KAAK,CAACsB,KAAK,CAAC,GACjDiC,gBAAgB,CACXoC,GAAG,CAACC,KAAK,IACNC,OAAO,CAACD,KAAK,CAAC,GACRE,KAAK,CAACC,OAAO,CAACH,KAAK,CAAC5F,KAAK,CAACE,QAAQ,CAAC,IAAI0F,KAAK,CAAC5F,KAAK,CAACE,QAAQ,CAACyF,GAAG,CAACK,QAAQ,IAAIA,QAAQ,CAAChG,KAAK,CAACsB,KAAK,CAAC,GACjGsE,KAAK,CAAC5F,KAAK,CAACsB,KAAK,CAC1B,CACA2E,OAAO,CAACC,CAAC,IAAIA,CAAC,CAAC,IAAI,EAAE;EAEpC,MAAMC,cAAc,GAAGL,KAAK,CAACC,OAAO,CAACzE,KAAK,CAAC,IAAIoE,aAAa,CAACU,KAAK,CAACC,MAAM,IAAI/E,KAAK,CAACgF,QAAQ,CAACD,MAAgB,CAAC,CAAC;EAE9G,MAAME,aAAa,GAAGzG,cAAK,CAAC4B,OAAO,CAAC;IAChC,IAAI8B,WAAW,KAAK,EAAE,EAAE;MACpB,IAAI2C,cAAc,EAAE;QAChB,OAAO/D,KAAK,CAACoE,OAAO,CAACC,WAAW;OACnC,MAAM;QACH,OAAOrE,KAAK,CAACoE,OAAO,CAACE,SAAS;;KAErC,MAAM,IAAIP,cAAc,EAAE;MACvB,OAAO/D,KAAK,CAACoE,OAAO,CAACG,kBAAkB;KAC1C,MAAM;MACH,OAAOvE,KAAK,CAACoE,OAAO,CAACI,gBAAgB;;GAE5C,EAAE,CAACT,cAAc,EAAE3C,WAAW,CAAC,CAAC;EAEjC,MAAMkD,SAAS,GAAGA;IACd,IAAI,CAACZ,KAAK,CAACC,OAAO,CAACzE,KAAK,CAAC,IAAIA,KAAK,CAACuF,MAAM,KAAK,CAAC,EAAE;MAC7C9D,QAAQ,CAAC2C,aAAa,CAAC;KAC1B,MAAM;;MAEH,MAAMoB,iBAAiB,GAAGpB,aAAa,CAACqB,MAAM,CAACV,MAAM,IAAI,CAAC/E,KAAK,CAACgF,QAAQ,CAACD,MAAM,CAAC,CAAC;MACjFtD,QAAQ,CAAC,CAAC,GAAGzB,KAAK,EAAE,GAAGwF,iBAAiB,CAAC,CAAC;;GAEjD;EAED,MAAML,WAAW,GAAGA;IAChB,IAAIjD,WAAW,KAAK,EAAE,EAAE;MACpBT,QAAQ,CAAC,EAAE,CAAC;KACf,MAAM;MACH,MAAMiE,SAAS,GAAGlB,KAAK,CAACC,OAAO,CAACzE,KAAK,CAAC,IAAIA,KAAK,CAACyF,MAAM,CAACE,QAAQ,IAAI,CAACvB,aAAa,CAACY,QAAQ,CAACW,QAAkB,CAAC,CAAC;MAC/GlE,QAAQ,CAACiE,SAAS,CAAC;;GAE1B;EAED,MAAMnF,SAAS,GAAGqF,EAAE,CAAC,wEAAwE,EAAEC,yBAAyB,EAAE,CAAC;EAE3H,oBACIrH,6BAACsH,cAAc,CAACC,QAAQ;IAAC/F,KAAK,EAAEqC;kBAC5B7D,6BAACwH,IAAqB;IAAC3E,IAAI,EAAEA,IAAI;IAAE4E,YAAY,EAAE3E;kBAC7C9C,6BAAC0H,qBAAqB;IAClBjH,UAAU,EAAEA,UAAU;IACtBM,QAAQ,EAAEA,QAAQ,IAAIQ,IAAI;IAC1BP,IAAI,EAAEA,IAAI;IACV2G,OAAO,EAAEnE,iBAAiB,CAACqC,GAAG,CAACC,KAAK,IAAIA,KAAK,CAAC5F,KAAK,CAACsB,KAAK,CAAC;IAC1DoG,SAAS,EAAE3F,WAAW;IACtBgB,QAAQ,EAAEA,QAAQ;IAClBzB,KAAK,EAAEA;IACT,eACFxB,6BAACwH,OAAwB;IAACK,OAAO;iBAAW;kBACxC7H,6BAAC8H,SAAO,oBACApG,UAAU;qBACA,SAAS;IACvBjB,UAAU,EAAEA,UAAU;IACtBgE,MAAM,EAAED,UAAU;IAClBuD,SAAS,EAAEjE,aAAa;IACxBzC,WAAW,EAAEA,WAAW;IACxBlB,GAAG,EAAE8B;MACJuB,iBAAiB,CACZ,CACa,eAC3BxD,6BAACwH,MAAuB,qBACpBxH,6BAACwH,OAAwB;IACrBK,OAAO;IACPG,KAAK,EAAC,OAAO;IACbC,eAAe,EAAEA;;MACb,CAAAC,qBAAA,GAAAjG,WAAW,CAACoC,OAAO,cAAA6D,qBAAA,uBAAnBA,qBAAA,CAAqBxC,KAAK,EAAE;KAC/B;IACDyC,gBAAgB,EAAE7C,oBAAoB;IACtC8C,UAAU,EAAE,CAAC;IACbC,QAAQ,EAAE,CAAC;kBACXrI;IAAK+B,SAAS,EAAEA,SAAS;IAAEuG,KAAK,EAAE;MAAEC,QAAQ,EAAE/F,UAAU,aAAVA,UAAU,eAAVA,UAAU,CAAEgG,KAAK,MAAMhG,UAAU,CAACgG,SAAS,GAAG9H;;KACvF8C,iBAAiB,CAACuD,MAAM,GAAG,CAAC,IAAI7F,QAAQ,kBACrClB,yEACIA,6BAACyI,MAAM;IACHpH,WAAW,EAAEH,QAAQ,GAAGoB,KAAK,CAACoE,OAAO,CAACgC,cAAc,GAAGpG,KAAK,CAACoE,OAAO,CAACiC,MAAM;IAC3ExI,GAAG,EAAEkC,SAAS;IACduG,aAAa,EAAEA,MAAMjG,oBAAoB,CAAC,IAAI;IAChD,EACD5B,QAAQ,IAAI6E,aAAa,CAACmB,MAAM,GAAG,CAAC,mBACjC/G,yEACIA,6BAAC6I,MAAM;IACH9G,SAAS,EAAC,gBAAgB;IAC1B+G,UAAU,EAAC,UAAU;IACrBC,OAAO,EAAE1C,cAAc,GAAGM,WAAW,GAAGC;KACvCH,aAAa,CACT,eACTzG;IAAK+B,SAAS,EAAC;IAA0C,CAC1D,CACN,CACF,IACH,IAAI,EACPjB,OAAO,kBACJd;IAAM+B,SAAS,EAAEqF,EAAE,CAAC,wCAAwC,EAAEzG,QAAQ,IAAIqI,WAAW,CAACrI,QAAQ,CAAC;kBAC3FX,wDACIA,6BAACiJ,OAAO;IACJC,KAAK,EAAE,CAAC;IACRnH,SAAS,EAAEqF,EAAE,CAAC,0BAA0B,EAAE;MACtC,qBAAqB,EAAEzG,QAAQ,KAAKwI,SAAS,CAACC,KAAK;MACnD,WAAW,EAAEzI,QAAQ,KAAKwI,SAAS,CAACE,MAAM;MAC1C,WAAW,EAAE1I,QAAQ,KAAKwI,SAAS,CAACG;KACvC;IACH,CACC,eACPtJ,2CAAOsC,KAAK,CAACiH,OAAO,CAACzI,OAAO,CAAQ,CACjC,IACP0C,iBAAiB,CAACuD,MAAM,IAAI,CAAC,kBAC7B/G;IAAK+B,SAAS,EAAC,kDAAkD;IAACyH,IAAI,EAAC;2BAEjE,mBAENxJ,6BAACkD,MAAqB;IAClBnB,SAAS,EAAC,uBAAuB;IACjC0H,cAAc,EAAC,iBAAiB;IAChCjJ,QAAQ,EAAEA,QAAQ;IAClBO,QAAQ,EAAEA,QAAQ;IAClBgH,SAAS,EAAE3C,oBAAoB;IAC/B9D,QAAQ,EAAEA,QAAQ;IAClBnB,GAAG,EAAEgC,UAAU;IACfc,QAAQ,EAAEA,QAAQ;IAClBoF,QAAQ,EAAE,CAAC,CAAC;IACZ7G,KAAK,EAAEA;KACNkC,WAAW,KAAK,EAAE,kBACf1D,6BAAC0J,UAAU,QAAE1H,eAAe,CAAc,mBAE1ChC,6BAAC0J,UAAU,QAAEjG,gBAAgB,CAAc,CAC9C,EACAvC,QAAQ,gBAAGlB,6BAAC2J,MAAM;IAACzI,QAAQ,EAAEA,QAAQ;IAAEyG,OAAO,EAAEnE;IAAqB,GAAG,IAAI,CACzD,CAC3B,CACC,CACiB,CACL,CACN,CACF;AAElC,CAAC;AACDzD,OAAO,CAAC8B,MAAM,GAAGA,MAAM;AACvB9B,OAAO,CAAC6J,KAAK,GAAGA,KAAK;AACrB7J,OAAO,CAAC8J,KAAK,GAAGA,KAAK;AAErB,MAAMnC,qBAAqB,GAAGxH,KAAK;EAC/B,MAAM;IAAEO,UAAU;IAAEM,QAAQ;IAAEC,IAAI;IAAE2G,OAAO;IAAEC,SAAS;IAAEpG,KAAK;IAAEyB;GAAU,GAAG/C,KAAK;EACjF,MAAM4J,aAAa,GAAGC,gBAAgB,CAACnC,SAAS,EAAE,MAAM3E,QAAQ,CAAClC,QAAQ,GAAG,EAAE,GAAGL,SAAS,CAAC,CAAC;EAE5F,IAAIsJ,WAAW;EAEf,IAAIF,aAAa,EAAE;IACf,IAAItI,KAAK,KAAKd,SAAS,EAAE;MACrB,IAAIK,QAAQ,EAAE;QACViJ,WAAW,GAAGhE,KAAK,CAACC,OAAO,CAACzE,KAAK,CAAC,GAAGA,KAAK,CAACqE,GAAG,CAACoE,MAAM,CAAC,GAAG,CAACzI,KAAK,KAAK,IAAI,GAAG,EAAE,GAAGyI,MAAM,CAACzI,KAAK,CAAC,CAAC;OACjG,MAAM;QACHwI,WAAW,GAAGxI,KAAK,KAAK,IAAI,GAAG,EAAE,GAAGyI,MAAM,CAACzI,KAAK,CAAC;;;IAIzD,oBACIxB,6BAACkK,YAAY;;MAAapI,GAAG,EAAEmI,MAAM,CAACD,WAAW,CAAC;MAAEjJ,QAAQ,EAAEA,QAAQ;MAAEC,IAAI,EAAEA,IAAI;MAAEQ,KAAK,EAAEwI;OACtFvJ,UAAU,KAAKC,SAAS,gBAAGV;MAAQwB,KAAK,EAAEf;MAAc,GAAG,IAAI,EAC/DkH,OAAO,CAAC9B,GAAG,CAACU,MAAM,mBACfvG;MAAQ8B,GAAG,EAAEmI,MAAM,CAAC1D,MAAM,CAAC;MAAE/E,KAAK,EAAEyI,MAAM,CAAC1D,MAAM;MAAK,CACzD,CAAC,CACS;;EAIvB,OAAO,IAAI;AACf,CAAC;AACDxG,OAAO,CAACoK,WAAW,GAAG,SAAS;;;;"}
1
+ {"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport {\n Select2Children,\n Select2CreateHandler,\n Select2DeleteHandler,\n Select2EditHandler,\n Select2OptionValue,\n Select2Value,\n} from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName, getFontSize } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { isGroup, useChildren } from './hooks/useChildren';\n\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Localization';\nimport { useIsHoverStatePaused } from '../../hooks/useIsHoverStatePaused';\nimport { isAriaDirectionKey } from '../../utils/aria';\nimport { getNextFocussableElement, isElementInsideTable3OrReport } from '../../utils/dom';\nimport { FontSize, FontSizes } from '../../types';\nimport { Button } from '../Button/Button';\nimport { Spinner } from '../Spinner/Spinner';\n\ntype Select2Texts = {\n allSelect: string;\n allDeselect: string;\n cancel: string;\n chooseColor: string;\n create: string;\n delete: string;\n save: string;\n search: string;\n searchOrCreate: string;\n selectAll: string;\n selectAllResults: string;\n deselectAll: string;\n deselectAllResults: string;\n};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n /** Autofocus Select2 when loaded **/\n autoFocus?: boolean;\n /** Array of options in Select2 */\n children: Select2Children;\n /** Initial value of the input in Select2 */\n defaultValue?: Select2Value;\n /** Set what value should have an empty option in Select2 */\n emptyValue?: Select2OptionValue;\n /** Whether the Select2 is in a disabled state **/\n disabled?: boolean;\n /** Font size of text in Select2 **/\n fontSize?: FontSize;\n /** Draws attention to the Select2 by changing its style and making it visually prominent */\n highlighted?: boolean;\n /** Whether the Select2 is in an invalid state **/\n invalid?: boolean;\n /** Whether the Select2 is loading the data **/\n loading?: boolean;\n /** Whether the Select2 allows selecting multiple values **/\n multiple?: boolean;\n /** Whether the Select2 is in an invalid state **/\n name?: string;\n /** Handler called when user chooses an option from the provided options **/\n onChange?: (value: Select2Value) => void;\n /** Handler called when user creates a new option **/\n onCreate?: Select2CreateHandler;\n /** Handler called when user deletes an option **/\n onDelete?: Select2DeleteHandler;\n /** Handler called when user edits an option **/\n onEdit?: Select2EditHandler;\n /** Placeholder showed when nothing is selected **/\n placeholder?: string;\n /** Whether the Select2 is in a readonly state **/\n readOnly?: boolean;\n required?: boolean;\n /** Renders select options as tags **/\n tags?: boolean;\n /** Value of the input in select2 */\n value?: Select2Value;\n};\ntype Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nconst Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n const {\n children: initChildren,\n defaultValue: defaultProp,\n disabled = false,\n emptyValue = undefined,\n fontSize,\n highlighted = false,\n invalid = false,\n loading,\n multiple = false,\n name,\n onChange,\n onCreate,\n onDelete,\n onEdit,\n placeholder,\n readOnly = false,\n tags = false,\n value: prop,\n ...otherProps\n } = props;\n\n const emptyOption: React.ReactElement<Select2OptionProps> | undefined = React.useMemo(() => {\n if (emptyValue !== undefined && !multiple) {\n // Empty option has 0px height, because it's empty, so need to apply height manually\n return <Option key=\"__empty\" children=\"\" value={emptyValue} className=\"h-8\" />;\n }\n return;\n }, [emptyValue, multiple]);\n\n const initialChildren = React.useMemo(() => {\n if (emptyOption) {\n return [emptyOption, ...initChildren] as Select2Children;\n }\n return initChildren;\n }, [emptyOption, initChildren]);\n\n // refs\n const internalRef = useMergedRef<HTMLButtonElement>(ref);\n const listboxRef = React.useRef<CollectionRef>(null);\n const searchRef = React.useRef<HTMLInputElement>(null);\n const { texts } = useLocalization();\n // align the listbox min width with the width of the input - it should never be smaller\n const dimensions = useBoundingClientRectListener(internalRef);\n\n // state\n const [tabTriggeredClose, setTabTriggeredClose] = React.useState(false);\n const [open, setOpen] = React.useState(false);\n const [value, _setValue] = useControllableState<Select2Value>({\n // uncontrolled\n defaultProp,\n // controlled\n onChange,\n prop,\n });\n const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n const [validationError, setValidationError] = React.useState<Error | undefined>();\n const [shouldPauseHoverState, setShouldPauseHoverState] = useIsHoverStatePaused();\n\n const { flattenedChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n children: initialChildren,\n emptyValue,\n multiple,\n open,\n setValue,\n value,\n });\n\n // context\n const context = {\n disabled,\n highlighted,\n invalid,\n listboxRef,\n multiple,\n onCreate,\n onDelete,\n onEdit,\n open,\n readOnly,\n ref: internalRef,\n searchQuery,\n searchRef,\n setOpen,\n setSearchQuery,\n setValidationError,\n setValue,\n shouldPauseHoverState,\n setShouldPauseHoverState,\n tags,\n fontSize,\n validationError,\n value,\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (open) {\n event.preventDefault();\n } else if (isElementInsideTable3OrReport(event.currentTarget)) {\n return;\n } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {\n setOpen(true);\n }\n\n // the focus should always remain on the input, so we forward events on to the listbox\n listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n };\n\n let handleBlur;\n\n if (otherProps.onBlur) {\n // we might be focusing on an input or something inside the dropdown that was triggered by the select\n // so see if the element gaining focus is inside a portal and look up its controller\n // if we don't do this, things like validate on blur occur while simply opening the select\n handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n const elementGainingFocus = event.relatedTarget;\n\n if (elementGainingFocus === undefined) {\n return;\n }\n\n const portalId = elementGainingFocus?.closest('[data-radix-popper-content-wrapper] > :first-child')?.id;\n\n if (!portalId || event.currentTarget.getAttribute(`aria-controls`) !== portalId) {\n otherProps.onBlur?.(event);\n }\n };\n }\n\n const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (isAriaDirectionKey(event)) {\n setShouldPauseHoverState(true);\n }\n };\n\n const handleCloseAutoFocus = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n\n if (tabTriggeredClose) {\n const nextFocussableElement = getNextFocussableElement(internalRef.current);\n\n if (nextFocussableElement) {\n // UX requirement: move focus to the next focussable element when tab key is pressed to select the value\n nextFocussableElement.focus();\n // Reset the tabTriggeredClose state\n setTabTriggeredClose(false);\n }\n } else {\n internalRef.current?.focus();\n }\n };\n\n const selectOptions =\n searchQuery === ''\n ? flattenedChildren.map(child => child.props.value)\n : filteredChildren\n .map(child =>\n isGroup(child)\n ? Array.isArray(child.props.children) && child.props.children.map(subChild => subChild.props.value)\n : child.props.value\n )\n .flatMap(c => c) || [];\n\n const areAllSelected = Array.isArray(value) && selectOptions.every(option => value.includes(option as string));\n\n const selectAllText = React.useMemo(() => {\n if (searchQuery === '') {\n if (areAllSelected) {\n return texts.select2.deselectAll;\n } else {\n return texts.select2.selectAll;\n }\n } else if (areAllSelected) {\n return texts.select2.deselectAllResults;\n } else {\n return texts.select2.selectAllResults;\n }\n }, [areAllSelected, searchQuery]);\n\n const selectAll = () => {\n if (!Array.isArray(value) || value.length === 0) {\n setValue(selectOptions);\n } else {\n // array of all available options which are not selected\n const preselectedValues = selectOptions.filter(option => !value.includes(option));\n setValue([...value, ...preselectedValues]);\n }\n };\n\n const deselectAll = () => {\n if (searchQuery === '') {\n setValue([]);\n } else {\n const nextValue = Array.isArray(value) && value.filter(subValue => !selectOptions.includes(subValue as string));\n setValue(nextValue);\n }\n };\n\n const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none\"', createCollectionClassName());\n\n return (\n <Select2Context.Provider value={context}>\n <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n <ControlledHiddenField\n emptyValue={emptyValue}\n multiple={multiple || tags}\n name={name}\n options={flattenedChildren.map(child => child.props.value)}\n parentRef={internalRef}\n setValue={setValue}\n value={value}\n />\n <PopoverPrimitive.Trigger asChild data-taco=\"Select2\">\n <Trigger\n {...otherProps}\n aria-haspopup=\"listbox\"\n emptyValue={emptyValue}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n ref={internalRef}>\n {flattenedChildren}\n </Trigger>\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n asChild\n align=\"start\"\n onOpenAutoFocus={() => {\n internalRef.current?.focus();\n }}\n onCloseAutoFocus={handleCloseAutoFocus}\n sideOffset={4}\n tabIndex={-1}>\n <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n {flattenedChildren.length > 0 || onCreate ? (\n <>\n <Search\n placeholder={onCreate ? texts.select2.searchOrCreate : texts.select2.search}\n ref={searchRef}\n onTabKeyPress={() => setTabTriggeredClose(true)}\n />\n {multiple && selectOptions.length > 1 && (\n <>\n <Button\n className=\"!justify-start\"\n appearance=\"discrete\"\n onClick={areAllSelected ? deselectAll : selectAll}>\n {selectAllText}\n </Button>\n <div className=\"border-grey-300 mx-3 rounded border-t\" />\n </>\n )}\n </>\n ) : null}\n {loading ? (\n <span className={cn('text-grey-700 flex items-center italic', fontSize && getFontSize(fontSize))}>\n <span>\n <Spinner\n delay={0}\n className={cn('ml-3 mr-2 mt-1.5 h-5 w-5', {\n '!mt-1 !h-3.5 !w-3.5': fontSize === FontSizes.small,\n '!h-4 !w-4': fontSize === FontSizes.medium,\n '!h-5 !w-5': fontSize === FontSizes.large,\n })}\n />\n </span>\n <span>{texts.listbox.loading}</span>\n </span>\n ) : flattenedChildren.length <= 0 ? (\n <div className=\"text-grey-700 -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n No results found...\n </div>\n ) : (\n <ListboxPrimitive.Root\n className=\"flex flex-col gap-0.5\"\n customSelector=\":scope > button\"\n disabled={disabled}\n multiple={multiple}\n onKeyDown={handleListboxKeyDown}\n readOnly={readOnly}\n ref={listboxRef}\n setValue={setValue}\n tabIndex={-1}\n value={value}>\n {searchQuery === '' ? (\n <Collection>{initialChildren}</Collection>\n ) : (\n <Collection>{filteredChildren}</Collection>\n )}\n {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n </ListboxPrimitive.Root>\n )}\n </div>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n </Select2Context.Provider>\n );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n let bubbleValue;\n\n if (isFormControl) {\n if (value !== undefined) {\n if (multiple) {\n bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n } else {\n bubbleValue = value === null ? '' : String(value);\n }\n }\n\n return (\n <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} value={bubbleValue}>\n {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n {options.map(option => (\n <option key={String(option)} value={String(option)} />\n ))}\n </BubbleSelect>\n );\n }\n\n return null;\n};\nSelect2.displayName = 'Select2';\n\nexport { Select2 };\n\nexport type {\n Select2Texts,\n Select2GroupProps,\n Select2OptionProps,\n Select2OptionValue,\n Select2Value,\n Select2Props,\n Select2TitleProps,\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initChildren","defaultValue","defaultProp","disabled","emptyValue","undefined","fontSize","highlighted","invalid","loading","multiple","name","onChange","onCreate","onDelete","onEdit","placeholder","readOnly","tags","value","prop","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","tabTriggeredClose","setTabTriggeredClose","useState","open","setOpen","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","isElementInsideTable3OrReport","currentTarget","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","stopPropagation","nextFocussableElement","getNextFocussableElement","focus","_internalRef$current","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","length","preselectedValues","filter","nextValue","subValue","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","ControlledHiddenField","options","parentRef","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current2","onCloseAutoFocus","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","onTabKeyPress","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","customSelector","Collection","Create","Group","Title","isFormControl","useIsFormControl","bubbleValue","String","BubbleSelect","displayName"],"mappings":"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"}
@@ -1,5 +1,6 @@
1
1
  import React__default from 'react';
2
2
  import { isElementInsideOrTriggeredFromContainer } from '../../../../../utils/dom.js';
3
+ import { isPressingMetaKey } from '../../../../../utils/keyboard.js';
3
4
  import { Input } from '../../../../Input/Input.js';
4
5
  import { isDate } from 'date-fns';
5
6
  import { isWeakEqual } from '../../../../../utils/date.js';
@@ -158,7 +159,7 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
158
159
  return;
159
160
  }
160
161
  // toggle into detailed mode when actually inputting something
161
- if (/^[a-z0-9]$/i.test(event.key) || event.key === 'Backspace') {
162
+ if (!isPressingMetaKey(event) && (/^[a-z0-9]$/i.test(event.key) || event.key === 'Backspace')) {
162
163
  toggleDetailedMode(true);
163
164
  }
164
165
  };
@@ -1 +1 @@
1
- {"version":3,"file":"EditingControlCell.js","sources":["../../../../../../../../../../src/components/Table3/components/Columns/Cell/EditingControlCell.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { isDate } from 'date-fns';\nimport { Datepicker } from '../../../../Datepicker/Datepicker';\nimport { Switch } from '../../../../Switch/Switch';\nimport { Input } from '../../../../Input/Input';\nimport { TableColumnDataType, TableColumnRendererControl, TableFontSize } from '../../../../../primitives/Table/types';\nimport { isWeakEqual as isWeakEqualDate } from '../../../../../utils/date';\nimport { RowMoveIndicator } from './Editing/RowMoveIndicator';\nimport { TextareaWithAutosizing } from './Editing/TextareaWithAutosizing';\nimport { Field } from '../../../../Field/Field';\nimport { isElementInsideOrTriggeredFromContainer } from '../../../../../utils/dom';\nimport { TableCellRendererProps } from '../../../../../primitives/Table/Core/types';\nimport { RowContext } from '../../../../../primitives/Table/Core/components/Row/RowContext';\nimport { getCellAttributes } from '../../../../../primitives/Table/Core/components/Columns/Cell/util';\nimport { useEditingCellAutofocus } from './util';\n\nexport function EditingControlCell<TType = unknown>(props: TableCellRendererProps<TType>) {\n const { cell, cellRef, isHighlighted, index } = props;\n const { rowIndex } = React.useContext(RowContext);\n const tableMeta = cell.getContext().table.options.meta as ReactTableMeta<TType>;\n const columnMeta = cell.column.columnDef.meta as ReactTableColumnMeta<TType, unknown>;\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n\n const handleFocus = useEditingCellAutofocus<TType>(props);\n\n const handleBlur = () => {\n tableMeta.editing.toggleDetailedMode(false);\n tableMeta.editing.validateCell(cell);\n };\n\n // ensure that blur runs when the cell gets unmounted (when vertically arrow key navigating)\n React.useEffect(() => {\n const ref = cellRef.current;\n\n return () => {\n if (document.activeElement === ref || isElementInsideOrTriggeredFromContainer(document.activeElement, ref)) {\n handleBlur();\n }\n };\n }, []);\n\n const error = tableMeta.editing.getCellError<TType>(cell);\n\n const controlProps = {\n dataType: columnMeta.dataType,\n fontSize: tableMeta.fontSize.size,\n id: cell.column.id,\n invalid: !!error,\n isDetailedMode: tableMeta.editing.isDetailedMode,\n isTruncated: !!columnMeta.enableTruncate,\n onBlur: handleBlur,\n onChange: (value: unknown) => tableMeta.editing.setCellValue(cell, value, rowIndex),\n row: cell.row.original,\n tabIndex: isActiveRow ? 0 : -1,\n toggleEditing: tableMeta.editing.toggleEditing,\n toggleDetailedMode: tableMeta.editing.toggleDetailedMode,\n type: columnMeta.control ?? 'input',\n value: cell.getValue(),\n };\n\n const cellAttributes = {\n ...getCellAttributes(cell, index, isHighlighted),\n 'data-cell-editing-invalid': error ? true : undefined,\n onFocus: handleFocus,\n ref: cellRef,\n tabIndex: -1,\n };\n\n return (\n <td {...cellAttributes}>\n <Field invalid={!!error} message={error}>\n <MemoedEditingCell<TType> {...controlProps} />\n </Field>\n {\n // we show row move indicator here within the cell rather than the row because it is\n // an editing only feature, and we don't want to leak editing into the shared row component\n }\n <RowMoveIndicator cell={cell} cellRef={cellRef} isActiveRow={isActiveRow} />\n </td>\n );\n}\n\ntype MemoedEditingCellProps<TType = unknown, TValue = unknown> = {\n dataType?: TableColumnDataType;\n fontSize: TableFontSize;\n id: string;\n invalid: boolean;\n isDetailedMode: boolean;\n isTruncated: boolean;\n onBlur: () => void;\n onChange: (value: TValue) => void;\n row: TType;\n tabIndex?: number;\n toggleEditing: (editing: React.SetStateAction<boolean>) => void;\n toggleDetailedMode: (detailed: React.SetStateAction<boolean>) => void;\n type: TableColumnRendererControl<TType>;\n value: TValue;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n const {\n dataType,\n fontSize,\n id,\n invalid,\n isDetailedMode,\n isTruncated,\n onBlur,\n onChange,\n row,\n tabIndex = -1,\n toggleEditing,\n toggleDetailedMode,\n type = 'input',\n value,\n } = props;\n const controlRef = React.useRef<HTMLElement>(null);\n const currentValue = row[id];\n const commonProps = {\n onBlur,\n ref: controlRef,\n tabIndex,\n };\n\n if (typeof type === 'function') {\n const controlFnProps = {\n ...commonProps,\n invalid,\n setValue: onChange,\n value,\n };\n return type(controlFnProps, row);\n }\n\n if (type === 'switch') {\n return (\n <Switch\n {...commonProps}\n checked={Boolean(value)}\n onChange={onChange}\n ref={controlRef as React.RefObject<HTMLButtonElement>}\n />\n );\n }\n\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n const target = event.target as HTMLInputElement | HTMLTextAreaElement;\n\n if (target.readOnly) {\n return;\n }\n\n // prevent active row navigation while in detailed mode\n if (\n isDetailedMode &&\n (event.key === 'ArrowUp' || event.key === 'ArrowDown' || event.key === 'ArrowLeft' || event.key === 'ArrowRight')\n ) {\n event.stopPropagation();\n }\n\n // enter or exit detail mode when pressing enter\n if (event.key === 'Enter') {\n // textareas support shift and enter, don't prevent default in that case\n if (event.shiftKey && isDetailedMode) {\n return;\n }\n\n event.preventDefault();\n\n if (isDetailedMode) {\n target.select?.();\n } else {\n target.setSelectionRange?.(target.value?.length, target.value?.length);\n }\n\n toggleDetailedMode(editing => !editing);\n return;\n }\n\n // reset the value, or exit edit mode when pressing escape\n if (event.key === 'Escape') {\n event.preventDefault();\n\n if (isDetailedMode) {\n toggleDetailedMode(false);\n\n if (value !== currentValue) {\n props.onChange(currentValue);\n }\n\n // have to let onChange run before selecting, otherwise the value changes\n requestAnimationFrame(() => target.select?.());\n } else {\n toggleEditing(false);\n }\n\n return;\n }\n\n // toggle into detailed mode when actually inputting something\n if (/^[a-z0-9]$/i.test(event.key) || event.key === 'Backspace') {\n toggleDetailedMode(true);\n }\n };\n\n const handleFocus = (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n if (!isDetailedMode) {\n event.target.select();\n }\n };\n\n if (type === 'datepicker') {\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const newDate = (event as any).detail;\n\n if (!value || !newDate || (isDate(value) && isDate(newDate) && !isWeakEqualDate(value as Date, newDate as Date))) {\n props.onChange((event as any).detail);\n }\n };\n\n return (\n <Datepicker\n {...commonProps}\n invalid={invalid}\n onChange={handleChange}\n onFocus={handleFocus}\n onKeyDown={handleInputKeyDown}\n ref={controlRef as React.RefObject<HTMLInputElement>}\n value={value as Date}\n />\n );\n }\n\n if (type === 'textarea') {\n const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n onChange(event.target.value);\n };\n\n return (\n <TextareaWithAutosizing\n {...commonProps}\n fontSize={fontSize}\n invalid={invalid}\n isTruncated={isTruncated}\n onChange={handleChange}\n onFocus={handleFocus}\n onKeyDown={handleInputKeyDown}\n ref={controlRef as React.RefObject<HTMLTextAreaElement>}\n value={String(value ?? '')}\n />\n );\n }\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n onChange(dataType === 'number' && event.target.value ? Number.parseInt(event.target.value) : event.target.value);\n };\n\n return (\n <Input\n {...commonProps}\n invalid={invalid}\n onChange={handleChange}\n onFocus={handleFocus}\n onKeyDown={handleInputKeyDown}\n ref={controlRef as React.RefObject<HTMLInputElement>}\n type={dataType === 'number' ? 'number' : undefined}\n value={dataType === 'number' ? (value as number) : String(value ?? '')}\n />\n );\n}) as <TType = unknown>(props: MemoedEditingCellProps<TType>) => JSX.Element;\n"],"names":["EditingControlCell","props","cell","cellRef","isHighlighted","index","rowIndex","React","useContext","RowContext","tableMeta","getContext","table","options","meta","columnMeta","column","columnDef","isActiveRow","rowActive","rowActiveIndex","handleFocus","useEditingCellAutofocus","handleBlur","editing","toggleDetailedMode","validateCell","useEffect","ref","current","document","activeElement","isElementInsideOrTriggeredFromContainer","error","getCellError","controlProps","dataType","fontSize","size","id","invalid","isDetailedMode","isTruncated","enableTruncate","onBlur","onChange","value","setCellValue","row","original","tabIndex","toggleEditing","type","_columnMeta$control","control","getValue","cellAttributes","getCellAttributes","undefined","onFocus","Field","message","MemoedEditingCell","RowMoveIndicator","memo","controlRef","useRef","currentValue","commonProps","controlFnProps","setValue","Switch","checked","Boolean","handleInputKeyDown","event","target","readOnly","key","stopPropagation","shiftKey","preventDefault","_target$select","select","call","_target$setSelectionR","_target$value","_target$value2","setSelectionRange","length","requestAnimationFrame","_target$select2","test","handleChange","newDate","detail","isDate","isWeakEqualDate","Datepicker","onKeyDown","TextareaWithAutosizing","String","Number","parseInt","Input"],"mappings":"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"}
1
+ {"version":3,"file":"EditingControlCell.js","sources":["../../../../../../../../../../src/components/Table3/components/Columns/Cell/EditingControlCell.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { isDate } from 'date-fns';\nimport { Datepicker } from '../../../../Datepicker/Datepicker';\nimport { Switch } from '../../../../Switch/Switch';\nimport { Input } from '../../../../Input/Input';\nimport { TableColumnDataType, TableColumnRendererControl, TableFontSize } from '../../../../../primitives/Table/types';\nimport { isWeakEqual as isWeakEqualDate } from '../../../../../utils/date';\nimport { RowMoveIndicator } from './Editing/RowMoveIndicator';\nimport { TextareaWithAutosizing } from './Editing/TextareaWithAutosizing';\nimport { Field } from '../../../../Field/Field';\nimport { isElementInsideOrTriggeredFromContainer } from '../../../../../utils/dom';\nimport { TableCellRendererProps } from '../../../../../primitives/Table/Core/types';\nimport { RowContext } from '../../../../../primitives/Table/Core/components/Row/RowContext';\nimport { getCellAttributes } from '../../../../../primitives/Table/Core/components/Columns/Cell/util';\nimport { useEditingCellAutofocus } from './util';\nimport { isPressingMetaKey } from '../../../../../utils/keyboard';\n\nexport function EditingControlCell<TType = unknown>(props: TableCellRendererProps<TType>) {\n const { cell, cellRef, isHighlighted, index } = props;\n const { rowIndex } = React.useContext(RowContext);\n const tableMeta = cell.getContext().table.options.meta as ReactTableMeta<TType>;\n const columnMeta = cell.column.columnDef.meta as ReactTableColumnMeta<TType, unknown>;\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n\n const handleFocus = useEditingCellAutofocus<TType>(props);\n\n const handleBlur = () => {\n tableMeta.editing.toggleDetailedMode(false);\n tableMeta.editing.validateCell(cell);\n };\n\n // ensure that blur runs when the cell gets unmounted (when vertically arrow key navigating)\n React.useEffect(() => {\n const ref = cellRef.current;\n\n return () => {\n if (document.activeElement === ref || isElementInsideOrTriggeredFromContainer(document.activeElement, ref)) {\n handleBlur();\n }\n };\n }, []);\n\n const error = tableMeta.editing.getCellError<TType>(cell);\n\n const controlProps = {\n dataType: columnMeta.dataType,\n fontSize: tableMeta.fontSize.size,\n id: cell.column.id,\n invalid: !!error,\n isDetailedMode: tableMeta.editing.isDetailedMode,\n isTruncated: !!columnMeta.enableTruncate,\n onBlur: handleBlur,\n onChange: (value: unknown) => tableMeta.editing.setCellValue(cell, value, rowIndex),\n row: cell.row.original,\n tabIndex: isActiveRow ? 0 : -1,\n toggleEditing: tableMeta.editing.toggleEditing,\n toggleDetailedMode: tableMeta.editing.toggleDetailedMode,\n type: columnMeta.control ?? 'input',\n value: cell.getValue(),\n };\n\n const cellAttributes = {\n ...getCellAttributes(cell, index, isHighlighted),\n 'data-cell-editing-invalid': error ? true : undefined,\n onFocus: handleFocus,\n ref: cellRef,\n tabIndex: -1,\n };\n\n return (\n <td {...cellAttributes}>\n <Field invalid={!!error} message={error}>\n <MemoedEditingCell<TType> {...controlProps} />\n </Field>\n {\n // we show row move indicator here within the cell rather than the row because it is\n // an editing only feature, and we don't want to leak editing into the shared row component\n }\n <RowMoveIndicator cell={cell} cellRef={cellRef} isActiveRow={isActiveRow} />\n </td>\n );\n}\n\ntype MemoedEditingCellProps<TType = unknown, TValue = unknown> = {\n dataType?: TableColumnDataType;\n fontSize: TableFontSize;\n id: string;\n invalid: boolean;\n isDetailedMode: boolean;\n isTruncated: boolean;\n onBlur: () => void;\n onChange: (value: TValue) => void;\n row: TType;\n tabIndex?: number;\n toggleEditing: (editing: React.SetStateAction<boolean>) => void;\n toggleDetailedMode: (detailed: React.SetStateAction<boolean>) => void;\n type: TableColumnRendererControl<TType>;\n value: TValue;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n const {\n dataType,\n fontSize,\n id,\n invalid,\n isDetailedMode,\n isTruncated,\n onBlur,\n onChange,\n row,\n tabIndex = -1,\n toggleEditing,\n toggleDetailedMode,\n type = 'input',\n value,\n } = props;\n const controlRef = React.useRef<HTMLElement>(null);\n const currentValue = row[id];\n const commonProps = {\n onBlur,\n ref: controlRef,\n tabIndex,\n };\n\n if (typeof type === 'function') {\n const controlFnProps = {\n ...commonProps,\n invalid,\n setValue: onChange,\n value,\n };\n return type(controlFnProps, row);\n }\n\n if (type === 'switch') {\n return (\n <Switch\n {...commonProps}\n checked={Boolean(value)}\n onChange={onChange}\n ref={controlRef as React.RefObject<HTMLButtonElement>}\n />\n );\n }\n\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n const target = event.target as HTMLInputElement | HTMLTextAreaElement;\n\n if (target.readOnly) {\n return;\n }\n\n // prevent active row navigation while in detailed mode\n if (\n isDetailedMode &&\n (event.key === 'ArrowUp' || event.key === 'ArrowDown' || event.key === 'ArrowLeft' || event.key === 'ArrowRight')\n ) {\n event.stopPropagation();\n }\n\n // enter or exit detail mode when pressing enter\n if (event.key === 'Enter') {\n // textareas support shift and enter, don't prevent default in that case\n if (event.shiftKey && isDetailedMode) {\n return;\n }\n\n event.preventDefault();\n\n if (isDetailedMode) {\n target.select?.();\n } else {\n target.setSelectionRange?.(target.value?.length, target.value?.length);\n }\n\n toggleDetailedMode(editing => !editing);\n return;\n }\n\n // reset the value, or exit edit mode when pressing escape\n if (event.key === 'Escape') {\n event.preventDefault();\n\n if (isDetailedMode) {\n toggleDetailedMode(false);\n\n if (value !== currentValue) {\n props.onChange(currentValue);\n }\n\n // have to let onChange run before selecting, otherwise the value changes\n requestAnimationFrame(() => target.select?.());\n } else {\n toggleEditing(false);\n }\n\n return;\n }\n\n // toggle into detailed mode when actually inputting something\n if (!isPressingMetaKey(event) && (/^[a-z0-9]$/i.test(event.key) || event.key === 'Backspace')) {\n toggleDetailedMode(true);\n }\n };\n\n const handleFocus = (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n if (!isDetailedMode) {\n event.target.select();\n }\n };\n\n if (type === 'datepicker') {\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const newDate = (event as any).detail;\n\n if (!value || !newDate || (isDate(value) && isDate(newDate) && !isWeakEqualDate(value as Date, newDate as Date))) {\n props.onChange((event as any).detail);\n }\n };\n\n return (\n <Datepicker\n {...commonProps}\n invalid={invalid}\n onChange={handleChange}\n onFocus={handleFocus}\n onKeyDown={handleInputKeyDown}\n ref={controlRef as React.RefObject<HTMLInputElement>}\n value={value as Date}\n />\n );\n }\n\n if (type === 'textarea') {\n const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n onChange(event.target.value);\n };\n\n return (\n <TextareaWithAutosizing\n {...commonProps}\n fontSize={fontSize}\n invalid={invalid}\n isTruncated={isTruncated}\n onChange={handleChange}\n onFocus={handleFocus}\n onKeyDown={handleInputKeyDown}\n ref={controlRef as React.RefObject<HTMLTextAreaElement>}\n value={String(value ?? '')}\n />\n );\n }\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n onChange(dataType === 'number' && event.target.value ? Number.parseInt(event.target.value) : event.target.value);\n };\n\n return (\n <Input\n {...commonProps}\n invalid={invalid}\n onChange={handleChange}\n onFocus={handleFocus}\n onKeyDown={handleInputKeyDown}\n ref={controlRef as React.RefObject<HTMLInputElement>}\n type={dataType === 'number' ? 'number' : undefined}\n value={dataType === 'number' ? (value as number) : String(value ?? '')}\n />\n );\n}) as <TType = unknown>(props: MemoedEditingCellProps<TType>) => JSX.Element;\n"],"names":["EditingControlCell","props","cell","cellRef","isHighlighted","index","rowIndex","React","useContext","RowContext","tableMeta","getContext","table","options","meta","columnMeta","column","columnDef","isActiveRow","rowActive","rowActiveIndex","handleFocus","useEditingCellAutofocus","handleBlur","editing","toggleDetailedMode","validateCell","useEffect","ref","current","document","activeElement","isElementInsideOrTriggeredFromContainer","error","getCellError","controlProps","dataType","fontSize","size","id","invalid","isDetailedMode","isTruncated","enableTruncate","onBlur","onChange","value","setCellValue","row","original","tabIndex","toggleEditing","type","_columnMeta$control","control","getValue","cellAttributes","getCellAttributes","undefined","onFocus","Field","message","MemoedEditingCell","RowMoveIndicator","memo","controlRef","useRef","currentValue","commonProps","controlFnProps","setValue","Switch","checked","Boolean","handleInputKeyDown","event","target","readOnly","key","stopPropagation","shiftKey","preventDefault","_target$select","select","call","_target$setSelectionR","_target$value","_target$value2","setSelectionRange","length","requestAnimationFrame","_target$select2","isPressingMetaKey","test","handleChange","newDate","detail","isDate","isWeakEqualDate","Datepicker","onKeyDown","TextareaWithAutosizing","String","Number","parseInt","Input"],"mappings":"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"}
@@ -21,7 +21,7 @@ function Row(props) {
21
21
  if (tableMeta.editing.isEditing && isActiveRow) {
22
22
  var _event$target$closest, _event$target$closest2;
23
23
  const cellIndex = Number((_event$target$closest = (_event$target$closest2 = event.target.closest('td')) === null || _event$target$closest2 === void 0 ? void 0 : _event$target$closest2.getAttribute('data-cell-index')) !== null && _event$target$closest !== void 0 ? _event$target$closest : undefined);
24
- if (!isNaN(cellIndex) && tableMeta.editing.lastFocusedCellIndex !== cellIndex) {
24
+ if (!isNaN(cellIndex)) {
25
25
  tableMeta.editing.setLastFocusedCellIndex(Number(cellIndex));
26
26
  }
27
27
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Row.js","sources":["../../../../../../../../../src/components/Table3/components/Row/Row.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { DisplayRow, DisplayRowProps } from '../../../../primitives/Table/Core/components/Row/BuiltIns/DisplayRow';\nimport { SaveStatus } from './Editing/SaveStatus';\nimport { useAugmentedFocusManager } from '../../../../primitives/Table/Core/components/Body/util';\n\nexport function Row<TType = unknown>(props: DisplayRowProps<TType>) {\n const { row, index, table } = props;\n const focusManager = useAugmentedFocusManager();\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === index;\n\n React.useEffect(() => {\n if (tableMeta.editing.isEditing && isActiveRow && tableMeta.editing.lastFocusedCellIndex === undefined) {\n focusManager.focusFirst();\n }\n }, [tableMeta.editing.isEditing, tableMeta.rowActive.rowActiveIndex, tableMeta.editing.lastFocusedCellIndex]);\n\n const handleFocus = React.useCallback(\n (event: React.FocusEvent<HTMLTableRowElement>) => {\n if (tableMeta.editing.isEditing && isActiveRow) {\n const cellIndex = Number(event.target.closest('td')?.getAttribute('data-cell-index') ?? undefined);\n\n if (!isNaN(cellIndex) && tableMeta.editing.lastFocusedCellIndex !== cellIndex) {\n tableMeta.editing.setLastFocusedCellIndex(Number(cellIndex));\n }\n }\n },\n [tableMeta.editing.isEditing, isActiveRow]\n );\n\n const attributes = {\n 'data-row-editing-invalid':\n tableMeta.editing.isEnabled && tableMeta.editing.hasRowErrors(row.id)\n ? !tableMeta.editing.hasRowErrorsSeen(row.id)\n ? 'unseen'\n : true\n : undefined,\n 'data-row-editing-status':\n tableMeta.editing.isEnabled && tableMeta.editing.getRowSaveStatus(row.id)\n ? tableMeta.editing.getRowSaveStatus(row.id)\n : undefined,\n onFocus: handleFocus,\n };\n\n return (\n <DisplayRow<TType> {...props} {...attributes}>\n {tableMeta.editing.getRowSaveStatus(row.id) ? <SaveStatus rowId={row.id} table={table} /> : null}\n </DisplayRow>\n );\n}\n"],"names":["Row","props","row","index","table","focusManager","useAugmentedFocusManager","tableMeta","options","meta","isActiveRow","rowActive","rowActiveIndex","React","useEffect","editing","isEditing","lastFocusedCellIndex","undefined","focusFirst","handleFocus","useCallback","event","_event$target$closest","_event$target$closest2","cellIndex","Number","target","closest","getAttribute","isNaN","setLastFocusedCellIndex","attributes","isEnabled","hasRowErrors","id","hasRowErrorsSeen","getRowSaveStatus","onFocus","DisplayRow","SaveStatus","rowId"],"mappings":";;;;;SAMgBA,GAAGA,CAAkBC,KAA6B;EAC9D,MAAM;IAAEC,GAAG;IAAEC,KAAK;IAAEC;GAAO,GAAGH,KAAK;EACnC,MAAMI,YAAY,GAAGC,wBAAwB,EAAE;EAC/C,MAAMC,SAAS,GAAGH,KAAK,CAACI,OAAO,CAACC,IAA6B;EAC7D,MAAMC,WAAW,GAAGH,SAAS,CAACI,SAAS,CAACC,cAAc,KAAKT,KAAK;EAEhEU,cAAK,CAACC,SAAS,CAAC;IACZ,IAAIP,SAAS,CAACQ,OAAO,CAACC,SAAS,IAAIN,WAAW,IAAIH,SAAS,CAACQ,OAAO,CAACE,oBAAoB,KAAKC,SAAS,EAAE;MACpGb,YAAY,CAACc,UAAU,EAAE;;GAEhC,EAAE,CAACZ,SAAS,CAACQ,OAAO,CAACC,SAAS,EAAET,SAAS,CAACI,SAAS,CAACC,cAAc,EAAEL,SAAS,CAACQ,OAAO,CAACE,oBAAoB,CAAC,CAAC;EAE7G,MAAMG,WAAW,GAAGP,cAAK,CAACQ,WAAW,CAChCC,KAA4C;IACzC,IAAIf,SAAS,CAACQ,OAAO,CAACC,SAAS,IAAIN,WAAW,EAAE;MAAA,IAAAa,qBAAA,EAAAC,sBAAA;MAC5C,MAAMC,SAAS,GAAGC,MAAM,EAAAH,qBAAA,IAAAC,sBAAA,GAACF,KAAK,CAACK,MAAM,CAACC,OAAO,CAAC,IAAI,CAAC,cAAAJ,sBAAA,uBAA1BA,sBAAA,CAA4BK,YAAY,CAAC,iBAAiB,CAAC,cAAAN,qBAAA,cAAAA,qBAAA,GAAIL,SAAS,CAAC;MAElG,IAAI,CAACY,KAAK,CAACL,SAAS,CAAC,IAAIlB,SAAS,CAACQ,OAAO,CAACE,oBAAoB,KAAKQ,SAAS,EAAE;QAC3ElB,SAAS,CAACQ,OAAO,CAACgB,uBAAuB,CAACL,MAAM,CAACD,SAAS,CAAC,CAAC;;;GAGvE,EACD,CAAClB,SAAS,CAACQ,OAAO,CAACC,SAAS,EAAEN,WAAW,CAAC,CAC7C;EAED,MAAMsB,UAAU,GAAG;IACf,0BAA0B,EACtBzB,SAAS,CAACQ,OAAO,CAACkB,SAAS,IAAI1B,SAAS,CAACQ,OAAO,CAACmB,YAAY,CAAChC,GAAG,CAACiC,EAAE,CAAC,GAC/D,CAAC5B,SAAS,CAACQ,OAAO,CAACqB,gBAAgB,CAAClC,GAAG,CAACiC,EAAE,CAAC,GACvC,QAAQ,GACR,IAAI,GACRjB,SAAS;IACnB,yBAAyB,EACrBX,SAAS,CAACQ,OAAO,CAACkB,SAAS,IAAI1B,SAAS,CAACQ,OAAO,CAACsB,gBAAgB,CAACnC,GAAG,CAACiC,EAAE,CAAC,GACnE5B,SAAS,CAACQ,OAAO,CAACsB,gBAAgB,CAACnC,GAAG,CAACiC,EAAE,CAAC,GAC1CjB,SAAS;IACnBoB,OAAO,EAAElB;GACZ;EAED,oBACIP,6BAAC0B,UAAU,oBAAYtC,KAAK,EAAM+B,UAAU,GACvCzB,SAAS,CAACQ,OAAO,CAACsB,gBAAgB,CAACnC,GAAG,CAACiC,EAAE,CAAC,gBAAGtB,6BAAC2B,UAAU;IAACC,KAAK,EAAEvC,GAAG,CAACiC,EAAE;IAAE/B,KAAK,EAAEA;IAAS,GAAG,IAAI,CACvF;AAErB;;;;"}
1
+ {"version":3,"file":"Row.js","sources":["../../../../../../../../../src/components/Table3/components/Row/Row.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { DisplayRow, DisplayRowProps } from '../../../../primitives/Table/Core/components/Row/BuiltIns/DisplayRow';\nimport { SaveStatus } from './Editing/SaveStatus';\nimport { useAugmentedFocusManager } from '../../../../primitives/Table/Core/components/Body/util';\n\nexport function Row<TType = unknown>(props: DisplayRowProps<TType>) {\n const { row, index, table } = props;\n const focusManager = useAugmentedFocusManager();\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === index;\n\n React.useEffect(() => {\n if (tableMeta.editing.isEditing && isActiveRow && tableMeta.editing.lastFocusedCellIndex === undefined) {\n focusManager.focusFirst();\n }\n }, [tableMeta.editing.isEditing, tableMeta.rowActive.rowActiveIndex, tableMeta.editing.lastFocusedCellIndex]);\n\n const handleFocus = React.useCallback(\n (event: React.FocusEvent<HTMLTableRowElement>) => {\n if (tableMeta.editing.isEditing && isActiveRow) {\n const cellIndex = Number(event.target.closest('td')?.getAttribute('data-cell-index') ?? undefined);\n\n if (!isNaN(cellIndex)) {\n tableMeta.editing.setLastFocusedCellIndex(Number(cellIndex));\n }\n }\n },\n [tableMeta.editing.isEditing, isActiveRow]\n );\n\n const attributes = {\n 'data-row-editing-invalid':\n tableMeta.editing.isEnabled && tableMeta.editing.hasRowErrors(row.id)\n ? !tableMeta.editing.hasRowErrorsSeen(row.id)\n ? 'unseen'\n : true\n : undefined,\n 'data-row-editing-status':\n tableMeta.editing.isEnabled && tableMeta.editing.getRowSaveStatus(row.id)\n ? tableMeta.editing.getRowSaveStatus(row.id)\n : undefined,\n onFocus: handleFocus,\n };\n\n return (\n <DisplayRow<TType> {...props} {...attributes}>\n {tableMeta.editing.getRowSaveStatus(row.id) ? <SaveStatus rowId={row.id} table={table} /> : null}\n </DisplayRow>\n );\n}\n"],"names":["Row","props","row","index","table","focusManager","useAugmentedFocusManager","tableMeta","options","meta","isActiveRow","rowActive","rowActiveIndex","React","useEffect","editing","isEditing","lastFocusedCellIndex","undefined","focusFirst","handleFocus","useCallback","event","_event$target$closest","_event$target$closest2","cellIndex","Number","target","closest","getAttribute","isNaN","setLastFocusedCellIndex","attributes","isEnabled","hasRowErrors","id","hasRowErrorsSeen","getRowSaveStatus","onFocus","DisplayRow","SaveStatus","rowId"],"mappings":";;;;;SAMgBA,GAAGA,CAAkBC,KAA6B;EAC9D,MAAM;IAAEC,GAAG;IAAEC,KAAK;IAAEC;GAAO,GAAGH,KAAK;EACnC,MAAMI,YAAY,GAAGC,wBAAwB,EAAE;EAC/C,MAAMC,SAAS,GAAGH,KAAK,CAACI,OAAO,CAACC,IAA6B;EAC7D,MAAMC,WAAW,GAAGH,SAAS,CAACI,SAAS,CAACC,cAAc,KAAKT,KAAK;EAEhEU,cAAK,CAACC,SAAS,CAAC;IACZ,IAAIP,SAAS,CAACQ,OAAO,CAACC,SAAS,IAAIN,WAAW,IAAIH,SAAS,CAACQ,OAAO,CAACE,oBAAoB,KAAKC,SAAS,EAAE;MACpGb,YAAY,CAACc,UAAU,EAAE;;GAEhC,EAAE,CAACZ,SAAS,CAACQ,OAAO,CAACC,SAAS,EAAET,SAAS,CAACI,SAAS,CAACC,cAAc,EAAEL,SAAS,CAACQ,OAAO,CAACE,oBAAoB,CAAC,CAAC;EAE7G,MAAMG,WAAW,GAAGP,cAAK,CAACQ,WAAW,CAChCC,KAA4C;IACzC,IAAIf,SAAS,CAACQ,OAAO,CAACC,SAAS,IAAIN,WAAW,EAAE;MAAA,IAAAa,qBAAA,EAAAC,sBAAA;MAC5C,MAAMC,SAAS,GAAGC,MAAM,EAAAH,qBAAA,IAAAC,sBAAA,GAACF,KAAK,CAACK,MAAM,CAACC,OAAO,CAAC,IAAI,CAAC,cAAAJ,sBAAA,uBAA1BA,sBAAA,CAA4BK,YAAY,CAAC,iBAAiB,CAAC,cAAAN,qBAAA,cAAAA,qBAAA,GAAIL,SAAS,CAAC;MAElG,IAAI,CAACY,KAAK,CAACL,SAAS,CAAC,EAAE;QACnBlB,SAAS,CAACQ,OAAO,CAACgB,uBAAuB,CAACL,MAAM,CAACD,SAAS,CAAC,CAAC;;;GAGvE,EACD,CAAClB,SAAS,CAACQ,OAAO,CAACC,SAAS,EAAEN,WAAW,CAAC,CAC7C;EAED,MAAMsB,UAAU,GAAG;IACf,0BAA0B,EACtBzB,SAAS,CAACQ,OAAO,CAACkB,SAAS,IAAI1B,SAAS,CAACQ,OAAO,CAACmB,YAAY,CAAChC,GAAG,CAACiC,EAAE,CAAC,GAC/D,CAAC5B,SAAS,CAACQ,OAAO,CAACqB,gBAAgB,CAAClC,GAAG,CAACiC,EAAE,CAAC,GACvC,QAAQ,GACR,IAAI,GACRjB,SAAS;IACnB,yBAAyB,EACrBX,SAAS,CAACQ,OAAO,CAACkB,SAAS,IAAI1B,SAAS,CAACQ,OAAO,CAACsB,gBAAgB,CAACnC,GAAG,CAACiC,EAAE,CAAC,GACnE5B,SAAS,CAACQ,OAAO,CAACsB,gBAAgB,CAACnC,GAAG,CAACiC,EAAE,CAAC,GAC1CjB,SAAS;IACnBoB,OAAO,EAAElB;GACZ;EAED,oBACIP,6BAAC0B,UAAU,oBAAYtC,KAAK,EAAM+B,UAAU,GACvCzB,SAAS,CAACQ,OAAO,CAACsB,gBAAgB,CAACnC,GAAG,CAACiC,EAAE,CAAC,gBAAGtB,6BAAC2B,UAAU;IAACC,KAAK,EAAEvC,GAAG,CAACiC,EAAE;IAAE/B,KAAK,EAAEA;IAAS,GAAG,IAAI,CACvF;AAErB;;;;"}
@@ -24,7 +24,6 @@ function useTableEditing(isEnabled = false, handleSave, validator) {
24
24
  pendingChangesFns.saveChanges();
25
25
  }
26
26
  }, [pendingChangesFns.saveChanges]);
27
- // TODO: using useGlobalKeyDown prevents trigger when focused on inputs, but it's more "proper"
28
27
  useGlobalKeyDown(isEnabled && isEditing ? {
29
28
  key: 's',
30
29
  meta: true,