@economic/taco 2.45.0-alpha.14 → 2.45.0-alpha.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Table3/Table3.d.ts +4 -8
- package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js +3 -1
- package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/Table3.js +2 -6
- package/dist/esm/packages/taco/src/components/Table3/Table3.js.map +1 -1
- package/dist/taco.cjs.development.js +5 -7
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -2
|
@@ -1,14 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';
|
|
3
3
|
import './style.css';
|
|
4
|
-
declare
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
declare function Group(_: Table3GroupProps): null;
|
|
9
|
-
declare namespace Group {
|
|
10
|
-
var displayName: string;
|
|
11
|
-
}
|
|
4
|
+
declare const Column: React.FC<Table3ColumnProps<unknown>> & {
|
|
5
|
+
<TType = unknown>(_: Table3ColumnProps<TType>): null;
|
|
6
|
+
};
|
|
7
|
+
declare const Group: React.FC<Table3GroupProps>;
|
|
12
8
|
export declare const Table3: (<TType = unknown>(props: (import("./types").Table3WithoutEditingWithClientProps<TType> & React.RefAttributes<Table3Ref>) | (import("./types").Table3WithoutEditingWithServerProps<TType> & React.RefAttributes<Table3Ref>) | (import("./types").Table3WithEditingWithClientProps<TType> & React.RefAttributes<Table3Ref>) | (import("./types").Table3WithEditingWithServerProps<TType> & React.RefAttributes<Table3Ref>)) => JSX.Element) & {
|
|
13
9
|
Column: typeof Column;
|
|
14
10
|
Group: typeof Group;
|
|
@@ -118,7 +118,9 @@ const useCombobox = ({
|
|
|
118
118
|
}
|
|
119
119
|
// listbox is open
|
|
120
120
|
if (currentIndex !== undefined) {
|
|
121
|
-
|
|
121
|
+
setCurrentValue(currentIndex);
|
|
122
|
+
} else if (inputValue !== value) {
|
|
123
|
+
handleChange(inputValue);
|
|
122
124
|
} else if (inputValue === '') {
|
|
123
125
|
handleChange(undefined);
|
|
124
126
|
}
|
|
@@ -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 { getIndexFromValue, findByValue, useFlattenedData, sanitizeItem, getOptionParents, filterData } from '../Listbox/util';\nimport { createCustomEvent, 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\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 handleChange(option.value);\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 }, [defaultValue]);\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 const handleChange = nextValue => {\n const event = createCustomEvent('change');\n\n if (onChange && nextValue !== String(value)) {\n const item = findByValue(flattenedData, nextValue);\n\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\n // event handlers\n const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n if (listRef.current && event.relatedTarget === listRef.current) {\n event.preventDefault();\n return;\n }\n\n // listbox is open\n if (currentIndex !== undefined) {\n handleChange(data[currentIndex].value);\n } else if (inputValue === '') {\n handleChange(undefined);\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 onClick(event);\n }\n };\n\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\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 setOpen(false);\n return;\n }\n\n case 'Enter': {\n event.preventDefault();\n\n if (isElementInsideTable3OrReport(event.currentTarget)) {\n if (inline && !open) {\n setOpen(true);\n } else if (buttonRef.current && !open) {\n buttonRef.current.click();\n }\n }\n\n if (open) {\n setCurrentValue(currentIndex);\n setOpen(false);\n }\n\n return;\n }\n\n case 'ArrowDown':\n if (open) {\n event.preventDefault();\n } else {\n if (!inline && buttonRef.current && !isElementInsideTable3OrReport(event.currentTarget)) {\n buttonRef.current.click();\n }\n }\n break;\n\n case 'ArrowUp':\n case 'Home':\n case 'End': {\n if (open) {\n event.preventDefault();\n }\n break;\n }\n\n default:\n }\n\n // we aren't focused on the list, so manually forward the keydown event to it\n if (listRef.current) {\n listRef.current.dispatchEvent(createCustomKeyboardEvent(event));\n }\n\n if (inline && !open) {\n if (\n (event.key === 'ArrowUp' || event.key === 'ArrowDown') &&\n !isElementInsideTable3OrReport(event.currentTarget)\n ) {\n event.preventDefault();\n const initialIndex = event.key === 'ArrowUp' ? data.length - 1 : 0;\n setCurrentIndex(currentIndex !== undefined ? currentIndex : initialIndex);\n setOpen(true);\n }\n }\n }\n\n if (!event.isDefaultPrevented() && onKeyDown) {\n 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","handleChange","setCurrentValue","isCurrentValue","length","nextValue","event","createCustomEvent","item","findByValue","detail","sanitizeItem","parents","getOptionParents","path","handleInputBlur","current","relatedTarget","preventDefault","onBlur","handleInputChange","target","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
|
+
{"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 { getIndexFromValue, findByValue, useFlattenedData, sanitizeItem, getOptionParents, filterData } from '../Listbox/util';\nimport { createCustomEvent, 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\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 handleChange(option.value);\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 }, [defaultValue]);\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 const handleChange = nextValue => {\n const event = createCustomEvent('change');\n\n if (onChange && nextValue !== String(value)) {\n const item = findByValue(flattenedData, nextValue);\n\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\n // event handlers\n const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n if (listRef.current && event.relatedTarget === listRef.current) {\n event.preventDefault();\n return;\n }\n\n // listbox is open\n if (currentIndex !== undefined) {\n setCurrentValue(currentIndex);\n } else if (inputValue !== value) {\n handleChange(inputValue);\n } else if (inputValue === '') {\n handleChange(undefined);\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 onClick(event);\n }\n };\n\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\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 setOpen(false);\n return;\n }\n\n case 'Enter': {\n event.preventDefault();\n\n if (isElementInsideTable3OrReport(event.currentTarget)) {\n if (inline && !open) {\n setOpen(true);\n } else if (buttonRef.current && !open) {\n buttonRef.current.click();\n }\n }\n\n if (open) {\n setCurrentValue(currentIndex);\n setOpen(false);\n }\n\n return;\n }\n\n case 'ArrowDown':\n if (open) {\n event.preventDefault();\n } else {\n if (!inline && buttonRef.current && !isElementInsideTable3OrReport(event.currentTarget)) {\n buttonRef.current.click();\n }\n }\n break;\n\n case 'ArrowUp':\n case 'Home':\n case 'End': {\n if (open) {\n event.preventDefault();\n }\n break;\n }\n\n default:\n }\n\n // we aren't focused on the list, so manually forward the keydown event to it\n if (listRef.current) {\n listRef.current.dispatchEvent(createCustomKeyboardEvent(event));\n }\n\n if (inline && !open) {\n if (\n (event.key === 'ArrowUp' || event.key === 'ArrowDown') &&\n !isElementInsideTable3OrReport(event.currentTarget)\n ) {\n event.preventDefault();\n const initialIndex = event.key === 'ArrowUp' ? data.length - 1 : 0;\n setCurrentIndex(currentIndex !== undefined ? currentIndex : initialIndex);\n setOpen(true);\n }\n }\n }\n\n if (!event.isDefaultPrevented() && onKeyDown) {\n 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","handleChange","setCurrentValue","isCurrentValue","length","nextValue","event","createCustomEvent","item","findByValue","detail","sanitizeItem","parents","getOptionParents","path","handleInputBlur","current","relatedTarget","preventDefault","onBlur","handleInputChange","target","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":";;;;;;;;;AAWA,MAAMA,SAAS,gBAAGC,QAAQ,CAACC,CAAC,IAAIA,CAAC,EAAE,EAAE,GAAG,CAAC;AAEzC,MAAMC,mBAAmB,GAAIC,KAA0C,IAAKC,MAAM,CAACD,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE,CAAC;MAUlFE,WAAW,GAAGA,CACvB;EACI,YAAY,EAAEC,SAAS;EACvB,iBAAiB,EAAEC,cAAc;EACjCC,IAAI,EAAEC,cAAc,GAAG,EAAE;EACzBC,YAAY;EACZC,QAAQ;EACRC,EAAE,EAAEC,QAAQ;EACZC,MAAM;EACNC,OAAO,EAAEC,EAAE;EACXC,QAAQ;EACRC,OAAO;EACPC,SAAS;EACTC,QAAQ;EACRC,QAAQ;EACRlB,KAAK;EACL,GAAGmB;CACyB,EAChCC,GAAgC;EAEhC,MAAMC,QAAQ,GAAGC,YAAY,CAAmBF,GAAG,CAAC;EACpD,MAAMG,SAAS,GAAGC,MAAY,CAAoB,IAAI,CAAC;EACvD,MAAMC,OAAO,GAAGD,MAAY,CAAmB,IAAI,CAAC;EACpD,MAAM,CAACE,IAAI,EAAEC,OAAO,CAAC,GAAGH,QAAc,CAAC,KAAK,CAAC;EAC7C,MAAMI,MAAM,GAAGJ,OAAa,CAAC,MAAMK,EAAI,EAAE,EAAE,EAAE,CAAC;EAC9C,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGP,QAAc,CAASzB,mBAAmB,CAACC,KAAK,CAAC,CAAC;EAEtF,MAAMgC,gBAAgB,GAAG,CAACf,QAAQ,KAAK,CAACN,MAAM,IAAKA,MAAM,IAAImB,UAAU,KAAK/B,mBAAmB,CAACC,KAAK,CAAE,CAAC;EACxG,MAAMiC,aAAa,GAAGC,gBAAgB,CAAC5B,cAAc,CAAC;EACtD,MAAMD,IAAI,GAAGmB,OAAa,CACtB,MAAOQ,gBAAgB,GAAGG,UAAU,CAACF,aAAa,EAAEH,UAAU,CAAC,GAAGG,aAAc,EAChF,CAACD,gBAAgB,EAAEF,UAAU,EAAEG,aAAa,CAAC,CAChD;;EAED,MAAM,CAACG,YAAY,EAAEC,eAAe,CAAC,GAAGb,QAAc,CAClDM,UAAU,KAAKQ,SAAS,GAAGC,iBAAiB,CAAClC,IAAI,EAAEyB,UAAU,CAAC,GAAGQ,SAAS,CAC7E;EAED,MAAME,oBAAoB,GAAIC,KAAyB;IACnD,IAAIA,KAAK,KAAKH,SAAS,EAAE;MACrB,MAAMI,MAAM,GAAGrC,IAAI,CAACoC,KAAK,CAAC;MAE1B,IAAIC,MAAM,IAAI,CAACA,MAAM,CAAClC,QAAQ,EAAE;QAC5BmC,YAAY,CAACD,MAAM,CAAC1C,KAAK,CAAC;;;GAGrC;EAED,MAAM4C,eAAe,GAAIH,KAAyB;IAC9C,IAAIA,KAAK,KAAKH,SAAS,EAAE;MACrB;;IAGJ,MAAMI,MAAM,GAAGrC,IAAI,CAACoC,KAAK,CAAC;;IAG1B,IAAIC,MAAM,CAAC1C,KAAK,KAAKA,KAAK,EAAE;MACxBwC,oBAAoB,CAACC,KAAK,CAAC;KAC9B,MAAM;;MAEHV,aAAa,CAAChC,mBAAmB,CAACC,KAAK,CAAC,CAAC;;GAEhD;;EAGDwB,SAAe,CAAC;IACZ,IAAIjB,YAAY,IAAI,CAACP,KAAK,EAAE;MACxBwC,oBAAoB,CAACD,iBAAiB,CAAClC,IAAI,EAAEE,YAAY,CAAC,CAAC;;GAElE,EAAE,CAACA,YAAY,CAAC,CAAC;;EAGlBiB,SAAe,CAAC;IACZ,IAAIxB,KAAK,KAAKsC,SAAS,IAAItC,KAAK,KAAK8B,UAAU,EAAE;MAC7CC,aAAa,CAAChC,mBAAmB,CAACC,KAAK,CAAC,CAAC;;GAEhD,EAAE,CAACA,KAAK,CAAC,CAAC;EAEXwB,SAAe,CAAC;IACZ,IAAIP,QAAQ,EAAE;MACVrB,SAAS,CAAC;QACNqB,QAAQ,CAACa,UAAU,CAAC;OACvB,CAAC;;GAET,EAAE,CAACA,UAAU,CAAC,CAAC;;EAGhBN,SAAe,CAAC;;;IAGZ,MAAMqB,cAAc,GAAG7C,KAAK,KAAKsC,SAAS,IAAItC,KAAK,KAAK,IAAI,IAAI8B,UAAU,KAAK7B,MAAM,CAACD,KAAK,CAAC;IAE5F,IAAI8B,UAAU,IAAIzB,IAAI,CAACyC,MAAM,IAAI,CAACD,cAAc,EAAE;MAC9CR,eAAe,CAAC,CAAC,CAAC;MAElB,IAAI,CAACX,IAAI,EAAE;QACPC,OAAO,CAAC,IAAI,CAAC;;KAEpB,MAAM;MACHA,OAAO,CAAC,KAAK,CAAC;;GAErB,EAAE,CAACG,UAAU,EAAEzB,IAAI,CAAC,CAAC;EAEtBmB,SAAe,CAAC;IACZ,IAAIE,IAAI,EAAE;MACNW,eAAe,CAACE,iBAAiB,CAAClC,IAAI,EAAEyB,UAAU,CAAC,IAAI,CAAC,CAAC;KAC5D,MAAM;MACHO,eAAe,CAACC,SAAS,CAAC;;GAEjC,EAAE,CAACZ,IAAI,CAAC,CAAC;EAEV,MAAMiB,YAAY,GAAGI,SAAS;IAC1B,MAAMC,KAAK,GAAGC,iBAAiB,CAAC,QAAQ,CAAC;IAEzC,IAAInC,QAAQ,IAAIiC,SAAS,KAAK9C,MAAM,CAACD,KAAK,CAAC,EAAE;MACzC,MAAMkD,IAAI,GAAGC,WAAW,CAAClB,aAAa,EAAEc,SAAS,CAAC;MAEjDC,KAAa,CAACI,MAAM,GAAGC,YAAY,CAACH,IAAI,CAAC;MAE1C,MAAMI,OAAO,GAAGC,gBAAgB,CAACtB,aAAa,EAAEiB,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEM,IAAI,CAAC;MAE3D,IAAIF,OAAO,KAAK,IAAI,IAAIA,OAAO,CAACR,MAAM,GAAG,CAAC,EAAE;QACvCE,KAAa,CAACI,MAAM,CAACE,OAAO,GAAGA,OAAO;;MAG3CxC,QAAQ,CAACkC,KAAK,CAAC;;GAEtB;;EAGD,MAAMS,eAAe,GAAIT,KAAyC;IAC9D,IAAIvB,OAAO,CAACiC,OAAO,IAAIV,KAAK,CAACW,aAAa,KAAKlC,OAAO,CAACiC,OAAO,EAAE;MAC5DV,KAAK,CAACY,cAAc,EAAE;MACtB;;;IAIJ,IAAIxB,YAAY,KAAKE,SAAS,EAAE;MAC5BM,eAAe,CAACR,YAAY,CAAC;KAChC,MAAM,IAAIN,UAAU,KAAK9B,KAAK,EAAE;MAC7B2C,YAAY,CAACb,UAAU,CAAC;KAC3B,MAAM,IAAIA,UAAU,KAAK,EAAE,EAAE;MAC1Ba,YAAY,CAACL,SAAS,CAAC;;IAG3B,IAAInB,KAAK,CAAC0C,MAAM,EAAE;MACd1C,KAAK,CAAC0C,MAAM,CAACb,KAAK,CAAC;;GAE1B;EAED,MAAMc,iBAAiB,GAAId,KAA0C;IACjEjB,aAAa,CAACiB,KAAK,CAACe,MAAM,CAAC/D,KAAK,CAAC;GACpC;EAED,MAAMgE,gBAAgB,GAAIhB,KAAyC;IAC/D,IAAIrC,MAAM,IAAK,CAACe,IAAI,IAAII,UAAU,IAAIzB,IAAI,CAACyC,MAAO,EAAE;MAChDnB,OAAO,CAAC,IAAI,CAAC;;IAGjB,IAAIZ,OAAO,EAAE;MACTA,OAAO,CAACiC,KAAK,CAAC;;GAErB;EAED,MAAMiB,kBAAkB,GAAIjB,KAA4C;IACpE,IAAI,CAACA,KAAK,CAACkB,OAAO,IAAI,CAAClB,KAAK,CAACmB,OAAO,EAAE;MAClC,QAAQnB,KAAK,CAACoB,GAAG;QACb,KAAK,WAAW;UAAE;YACd;;QAGJ,KAAK,QAAQ;UAAE;YACXpB,KAAK,CAACY,cAAc,EAAE;YACtB7B,aAAa,CAAChC,mBAAmB,CAACC,KAAK,CAAC,CAAC;YACzC2B,OAAO,CAAC,KAAK,CAAC;YACd;;QAGJ,KAAK,KAAK;UAAE;YACRA,OAAO,CAAC,KAAK,CAAC;YACd;;QAGJ,KAAK,OAAO;UAAE;YACVqB,KAAK,CAACY,cAAc,EAAE;YAEtB,IAAIS,6BAA6B,CAACrB,KAAK,CAACsB,aAAa,CAAC,EAAE;cACpD,IAAI3D,MAAM,IAAI,CAACe,IAAI,EAAE;gBACjBC,OAAO,CAAC,IAAI,CAAC;eAChB,MAAM,IAAIJ,SAAS,CAACmC,OAAO,IAAI,CAAChC,IAAI,EAAE;gBACnCH,SAAS,CAACmC,OAAO,CAACa,KAAK,EAAE;;;YAIjC,IAAI7C,IAAI,EAAE;cACNkB,eAAe,CAACR,YAAY,CAAC;cAC7BT,OAAO,CAAC,KAAK,CAAC;;YAGlB;;QAGJ,KAAK,WAAW;UACZ,IAAID,IAAI,EAAE;YACNsB,KAAK,CAACY,cAAc,EAAE;WACzB,MAAM;YACH,IAAI,CAACjD,MAAM,IAAIY,SAAS,CAACmC,OAAO,IAAI,CAACW,6BAA6B,CAACrB,KAAK,CAACsB,aAAa,CAAC,EAAE;cACrF/C,SAAS,CAACmC,OAAO,CAACa,KAAK,EAAE;;;UAGjC;QAEJ,KAAK,SAAS;QACd,KAAK,MAAM;QACX,KAAK,KAAK;UAAE;YACR,IAAI7C,IAAI,EAAE;cACNsB,KAAK,CAACY,cAAc,EAAE;;YAE1B;;;;MAOR,IAAInC,OAAO,CAACiC,OAAO,EAAE;QACjBjC,OAAO,CAACiC,OAAO,CAACc,aAAa,CAACC,yBAAyB,CAACzB,KAAK,CAAC,CAAC;;MAGnE,IAAIrC,MAAM,IAAI,CAACe,IAAI,EAAE;QACjB,IACI,CAACsB,KAAK,CAACoB,GAAG,KAAK,SAAS,IAAIpB,KAAK,CAACoB,GAAG,KAAK,WAAW,KACrD,CAACC,6BAA6B,CAACrB,KAAK,CAACsB,aAAa,CAAC,EACrD;UACEtB,KAAK,CAACY,cAAc,EAAE;UACtB,MAAMc,YAAY,GAAG1B,KAAK,CAACoB,GAAG,KAAK,SAAS,GAAG/D,IAAI,CAACyC,MAAM,GAAG,CAAC,GAAG,CAAC;UAClET,eAAe,CAACD,YAAY,KAAKE,SAAS,GAAGF,YAAY,GAAGsC,YAAY,CAAC;UACzE/C,OAAO,CAAC,IAAI,CAAC;;;;IAKzB,IAAI,CAACqB,KAAK,CAAC2B,kBAAkB,EAAE,IAAI3D,SAAS,EAAE;MAC1CA,SAAS,CAACgC,KAAK,CAAC;;GAEvB;EAED,MAAM4B,mBAAmB,GAAInC,KAAa;IACtCJ,eAAe,CAACI,KAAK,CAAC;GACzB;EAED,MAAMoC,kBAAkB,GAAGA,CAAC7B,KAAsC,EAAEP,KAAa;IAC7EO,KAAK,CAACY,cAAc,EAAE;IACtBhB,eAAe,CAACH,KAAK,CAAC;IACtBd,OAAO,CAAC,KAAK,CAAC;GACjB;EAED,MAAMmD,QAAQ,GAAG;IACb,eAAe,EAAEpD,IAAI;IACrB,WAAW,EAAEE,MAAM;IACnB,eAAe,EAAE,SAAkB;IACnCmD,IAAI,EAAE;GACT;EAED,MAAMC,KAAK,GAAG;IACV,GAAG7D,KAAK;IACR,eAAe,EAAES,MAAM;;;IAGvB,mBAAmB,EAAE,MAAe;;IAEpC,uBAAuB,EACnBQ,YAAY,KAAKE,SAAS,IAAIjC,IAAI,CAAC+B,YAAY,CAAC,GAAG6C,KAAK,CAACrD,MAAM,EAAE3B,MAAM,CAACI,IAAI,CAAC+B,YAAY,CAAC,CAACpC,KAAK,CAAC,CAAC,GAAGsC,SAAS;IAClH,iBAAiB,EAAElC,cAAc;IACjCI,QAAQ;IACRqD,MAAM,EAAE,CAACrD,QAAQ,IAAI,CAACU,QAAQ,GAAGuC,eAAe,GAAGnB,SAAS;IAC5DxB,QAAQ,EAAE,CAACN,QAAQ,IAAI,CAACU,QAAQ,GAAG4C,iBAAiB,GAAGxB,SAAS;IAChEvB,OAAO,EAAE,CAACP,QAAQ,IAAI,CAACU,QAAQ,GAAG8C,gBAAgB,GAAG1B,SAAS;IAC9DtB,SAAS,EAAE,CAACR,QAAQ,IAAI,CAACU,QAAQ,GAAG+C,kBAAkB,GAAG3B,SAAS;IAClEpB,QAAQ;IACRE,GAAG,EAAEC,QAAQ;IACb6D,IAAI,EAAE,MAAM;IACZlF,KAAK,EAAE8B,UAAU,aAAVA,UAAU,cAAVA,UAAU,GAAI;GACxB;EAED,MAAMqD,IAAI,GAA+B;IACrC,iBAAiB,EAAE/E,cAAc;IACjCC,IAAI;IACJG,QAAQ;IACRC,EAAE,EAAEmB,MAAM;IACVd,QAAQ,EAAE8D,mBAAmB;IAC7B7D,OAAO,EAAE8D,kBAAkB;IAC3BzD,GAAG,EAAEK,OAAO;IACZ2D,aAAa,EAAE,KAAK;IACpBC,QAAQ,EAAE,CAAC,CAAC;IACZrF,KAAK,EAAEoC;GACV;EAED,MAAMkD,MAAM,GAAG;IACXlE,GAAG,EAAEG;GACR;EAED,OAAO;IACHuD,QAAQ;IACRE,KAAK;IACLG,IAAI;IACJG,MAAM;IACNC,OAAO,EAAE;MACL7D,IAAI;MACJ8D,YAAY,EAAE7D;;GAGrB;AACL;;;;"}
|
|
@@ -8,13 +8,9 @@ import { Editing } from './components/Toolbar/Editing/Editing.js';
|
|
|
8
8
|
import { CreateNewRow } from './components/Row/Editing/CreateNewRow.js';
|
|
9
9
|
import { TemporaryRow } from './components/Row/Editing/TemporaryRow.js';
|
|
10
10
|
|
|
11
|
-
|
|
12
|
-
return null;
|
|
13
|
-
}
|
|
11
|
+
const Column = () => null;
|
|
14
12
|
Column.displayName = 'Table3Column';
|
|
15
|
-
|
|
16
|
-
return null;
|
|
17
|
-
}
|
|
13
|
+
const Group = () => null;
|
|
18
14
|
Group.displayName = 'Table3Group';
|
|
19
15
|
const BaseTable3 = /*#__PURE__*/fixedForwardRef(function BaseTable3(props, ref) {
|
|
20
16
|
var _table3$meta$editing, _table3$meta$editing2;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport { CreateNewRow } from './components/Row/Editing/CreateNewRow';\nimport { TemporaryRow } from './components/Row/Editing/TemporaryRow';\nimport './style.css';\nimport { isTableScrolled } from './util/editing';\n\
|
|
1
|
+
{"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport { fixedForwardRef } from '../../types';\nimport { useTable3 } from './useTable3';\nimport { Table } from '../../primitives/Table/Core/Table';\nimport { Alert } from './components/Editing/Alert';\nimport { Table3Props, Table3Ref, Table3ColumnProps, Table3GroupProps } from './types';\nimport { Editing } from './components/Toolbar/Editing/Editing';\nimport { CreateNewRow } from './components/Row/Editing/CreateNewRow';\nimport { TemporaryRow } from './components/Row/Editing/TemporaryRow';\nimport './style.css';\nimport { isTableScrolled } from './util/editing';\n\nconst Column: React.FC<Table3ColumnProps<unknown>> & {\n <TType = unknown>(_: Table3ColumnProps<TType>): null;\n} = () => null;\n\nColumn.displayName = 'Table3Column';\n\nconst Group: React.FC<Table3GroupProps> = () => null;\nGroup.displayName = 'Table3Group';\n\nconst BaseTable3 = fixedForwardRef(function BaseTable3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const table3 = useTable3<TType>(props, ref);\n\n const gridAttributes = {\n 'data-table-editing-mode': table3.meta.editing?.isEditing\n ? table3.meta.editing?.isDetailedMode\n ? 'detailed'\n : 'normal'\n : undefined,\n enableHorizontalArrowKeyNavigation: table3.meta.editing.isEditing,\n };\n\n const hasAlertErrors = table3.meta.editing.getErrorsShownInAlert().length;\n const hasCreateWorkflow = table3.meta.editing.isEnabled && props.onEditingCreate;\n const isScrolled = isTableScrolled(table3.ref);\n\n let createWorkflow;\n\n if (hasCreateWorkflow) {\n createWorkflow = (\n <CreateNewRow\n buttonRef={table3.meta.editing.createRowButtonRef}\n isScrolled={isScrolled}\n scrollToIndex={table3.renderer.scrollToIndex}\n table={table3.instance}\n tableMeta={table3.meta}\n />\n );\n }\n\n return (\n <Table>\n <Table.Toolbar<TType> table={table3}>\n {table3.meta.editing.isEnabled ? (\n <Editing scrollToIndex={table3.renderer.scrollToIndex} table={table3.instance} />\n ) : null}\n </Table.Toolbar>\n {hasAlertErrors ? (\n <Alert\n className=\"mb-4\"\n scrollToIndex={table3.renderer.scrollToIndex}\n table={table3.instance}\n tableRef={table3.ref}\n />\n ) : null}\n <Table.Grid<TType>\n {...gridAttributes}\n data-taco=\"table3\"\n footerRows={hasCreateWorkflow && isScrolled ? createWorkflow : undefined}\n table={table3}>\n {hasCreateWorkflow ? (\n <>\n <TemporaryRow\n createRowButtonRef={table3.meta.editing.createRowButtonRef}\n isScrolled={isScrolled}\n table={table3.instance}\n tableMeta={table3.meta}\n tableRef={table3.ref}\n />\n {!isScrolled ? createWorkflow : null}\n </>\n ) : null}\n </Table.Grid>\n </Table>\n );\n});\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const stringifiedChildren = String(props.children);\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n return <BaseTable3<TType> {...props} key={key} ref={ref} />;\n}) as (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n Group: typeof Group;\n};\nTable3.Column = Column;\nTable3.Group = Group;\n\nexport type {\n Table3Ref,\n Table3Props,\n Table3ColumnProps,\n Table3GroupProps,\n Table3EditingSaveHandler,\n Table3EditingValidatorFn,\n Table3Texts,\n Table3FeatureProps,\n Table3CommonProps,\n Table3WithoutEditingWithClientProps,\n Table3WithoutEditingWithServerProps,\n Table3WithEditingProps,\n Table3WithEditingWithClientProps,\n Table3WithEditingWithServerProps,\n Table3EditingChangeHandler,\n Table3EditingCreateHandler,\n} from './types';\n"],"names":["Column","displayName","Group","BaseTable3","fixedForwardRef","props","ref","table3","useTable3","gridAttributes","_table3$meta$editing","meta","editing","isEditing","_table3$meta$editing2","isDetailedMode","undefined","enableHorizontalArrowKeyNavigation","hasAlertErrors","getErrorsShownInAlert","length","hasCreateWorkflow","isEnabled","onEditingCreate","isScrolled","isTableScrolled","createWorkflow","React","CreateNewRow","buttonRef","createRowButtonRef","scrollToIndex","renderer","table","instance","tableMeta","Table","Toolbar","Editing","Alert","className","tableRef","Grid","footerRows","TemporaryRow","Table3","stringifiedChildren","String","children","key","useMemo"],"mappings":"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"}
|
|
@@ -6082,7 +6082,9 @@ const useCombobox = ({
|
|
|
6082
6082
|
}
|
|
6083
6083
|
// listbox is open
|
|
6084
6084
|
if (currentIndex !== undefined) {
|
|
6085
|
-
|
|
6085
|
+
setCurrentValue(currentIndex);
|
|
6086
|
+
} else if (inputValue !== value) {
|
|
6087
|
+
handleChange(inputValue);
|
|
6086
6088
|
} else if (inputValue === '') {
|
|
6087
6089
|
handleChange(undefined);
|
|
6088
6090
|
}
|
|
@@ -20450,13 +20452,9 @@ function TemporaryRow(props) {
|
|
|
20450
20452
|
}))));
|
|
20451
20453
|
}
|
|
20452
20454
|
|
|
20453
|
-
|
|
20454
|
-
return null;
|
|
20455
|
-
}
|
|
20455
|
+
const Column$3 = () => null;
|
|
20456
20456
|
Column$3.displayName = 'Table3Column';
|
|
20457
|
-
|
|
20458
|
-
return null;
|
|
20459
|
-
}
|
|
20457
|
+
const Group$5 = () => null;
|
|
20460
20458
|
Group$5.displayName = 'Table3Group';
|
|
20461
20459
|
const BaseTable3 = /*#__PURE__*/fixedForwardRef(function BaseTable3(props, ref) {
|
|
20462
20460
|
var _table3$meta$editing, _table3$meta$editing2;
|