npm - @economic/taco - Versions diffs - 2.8.0 → 2.9.0 - Mend

@economic/taco 2.8.0 → 2.9.0

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

Files changed (88) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchInput2.js","sources":["../../../../../../../src/components/SearchInput2/SearchInput2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { useGlobalKeyDown } from '../../hooks/useGlobalKeyDown';\nimport { useLocalization } from '../Provider/Localization';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Input } from '../Input/Input';\nimport { Shortcut } from '../Shortcut/Shortcut';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { KeyDownHandlerOptions } from '../../utils/keyboard';\nimport { Spinner } from '../Spinner/Spinner';\nimport { Icon } from '../Icon/Icon';\n\ninterface CommonSearchInput2Props\n extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'defaultValue' \| 'onChange' \| 'value'> {\n loading?: boolean;\n onChange: (value: string) => void;\n settingsContent?: JSX.Element;\n shortcut?: string \| KeyDownHandlerOptions;\n value?: string;\n}\n\ninterface BasicSearchInput2Props extends CommonSearchInput2Props {\n findCurrent?: never;\n findTotal?: never;\n onClickFindNext?: never;\n onClickFindPrevious?: never;\n}\n\ninterface ComplexSearchInput2Props extends CommonSearchInput2Props {\n findCurrent: number \| null;\n findTotal: number \| null;\n onClickFindNext: () => void;\n onClickFindPrevious: () => void;\n}\n\nexport type SearchInput2Props = BasicSearchInput2Props \| ComplexSearchInput2Props;\n\nexport const SearchInput2 = React.forwardRef(function SearchInput2(props: SearchInput2Props, ref: React.Ref<HTMLInputElement>) {\n const {\n findCurrent,\n findTotal,\n loading = false,\n onChange: handleChange,\n onClickFindNext: handleClickFindNext,\n onClickFindPrevious: handleClickFindPrevious,\n settingsContent,\n shortcut,\n value,\n ...attributes\n } = props;\n const internalRef = useMergedRef<HTMLInputElement>(ref);\n const containerRef = React.useRef<HTMLDivElement>(null);\n const [focused, setFocused] = React.useState(false);\n const { texts } = useLocalization();\n const isActive = value?.length;\n const hasFind = handleClickFindNext && handleClickFindPrevious && findCurrent !== undefined && findTotal !== undefined;\n\n useGlobalKeyDown(shortcut, (event: KeyboardEvent) => {\n if (document.activeElement !== internalRef.current) {\n event.preventDefault();\n internalRef.current?.focus();\n }\n });\n\n const handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n if (\n containerRef.current &&\n (containerRef.current === event.relatedTarget \|\| containerRef.current?.contains(event.relatedTarget))\n ) {\n return;\n }\n\n setFocused(false);\n attributes.onBlur?.(event);\n };\n\n const handleClear = () => {\n requestAnimationFrame(() => internalRef.current?.focus());\n handleChange('');\n };\n\n const handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(true);\n attributes.onFocus?.(event);\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n props.onKeyDown?.(event);\n\n if (event.isDefaultPrevented()) {\n return;\n }\n if (event.key === 'Enter') {\n event.preventDefault();\n\n if (hasFind && isActive) {\n if (event.shiftKey) {\n handleClickFindPrevious?.();\n } else {\n handleClickFindNext?.();\n }\n }\n\n return;\n }\n\n if (event.key === 'Escape') {\n handleClear();\n return;\n }\n };\n\n let postfix;\n\n if (!attributes.disabled && !attributes.readOnly && (value \|\| focused)) {\n if (value) {\n postfix = (\n <IconButton\n aria-label={texts.searchInput.clear}\n className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n icon=\"close\"\n onMouseDown={handleClear}\n tabIndex={-1}\n tooltip={\n focused ? (\n <>\n {texts.searchInput.clear} <Shortcut keys=\"Escape\" />\n </>\n ) : (\n texts.searchInput.clear\n )\n }\n />\n );\n }\n\n if (hasFind && isActive) {\n postfix = (\n <>\n <span className=\"text-grey-700 flex h-4 items-center border-r border-black/[0.25] pr-2\">\n {loading ? <Spinner className=\"h-4 w-4\" /> : `${findCurrent ?? 0}/${findTotal ?? 0}`}\n </span>\n {findCurrent ? (\n <>\n <IconButton\n aria-label={texts.searchInput.findPrevious}\n className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n icon=\"chevron-up\"\n onMouseDown={handleClickFindPrevious}\n tabIndex={-1}\n tooltip={\n focused ? (\n <>\n {texts.searchInput.findPrevious} <Shortcut keys={{ shift: true, key: 'Enter' }} />\n </>\n ) : (\n texts.searchInput.findPrevious\n )\n }\n />\n <IconButton\n aria-label={texts.searchInput.findNext}\n className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n icon=\"chevron-down\"\n onMouseDown={handleClickFindNext}\n tabIndex={-1}\n tooltip={\n focused ? (\n <>\n {texts.searchInput.findNext} <Shortcut keys=\"Enter\" />\n </>\n ) : (\n texts.searchInput.findNext\n )\n }\n />\n </>\n ) : null}\n {postfix}\n </>\n );\n }\n } else if (shortcut && !focused && !value) {\n postfix = <Shortcut keys={shortcut} onClickCapture={() => internalRef.current?.focus()} />;\n }\n\n const className = cn(\n '!pl-7 group-focus-within:!w-72 group-focus-within:yt-focus',\n hasFind\n ? {\n '!w-48': !value,\n '!w-72': value,\n }\n : '!w-48',\n {\n '!wcag-blue-100': isActive,\n },\n props.className\n );\n\n const icon = (\n <Icon\n aria-label={texts.searchInput.button}\n className=\"-ml-0.5 scale-95\"\n name=\"search\"\n onClickCapture={() => internalRef.current?.focus()}\n />\n );\n\n const input = (\n <Input\n {...attributes}\n aria-label={attributes['aria-label'] ?? texts.searchInput.placeholder}\n className={className}\n data-taco=\"search-input2\"\n onBlur={handleBlur}\n onChange={event => handleChange(event.target.value)}\n onFocus={handleFocus}\n onKeyDown={handleKeyDown}\n placeholder={attributes.placeholder ?? texts.searchInput.placeholder}\n prefix={icon}\n postfix={postfix}\n ref={internalRef}\n value={value ?? ''}\n />\n );\n\n if (settingsContent) {\n const settingsClassname = cn(\n 'border-grey-300 absolute left-0 right-0 -mt-0.5 hidden top-full group-focus-within:flex focus-within:flex flex-col gap-y-4 rounded-b border border-t-0 bg-white p-3 shadow !pt-[calc(theme(spacing.3)_+_theme(spacing[0.5]))]'\n );\n\n return (\n <div\n className={cn('group relative', { 'z-10 [&_[data-taco=input-container]]:z-10': focused })}\n ref={containerRef}\n // create a new stacking context so our internal z-indexes don't effect external components\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n style={{ opacity: 0.999 }}>\n {input}\n <div\n className={settingsClassname}\n onClickCapture={() => internalRef.current?.focus()}\n // tab index is important, it lets the element show as a relatedTarget on event handlers\n tabIndex={-1}>\n {settingsContent}\n </div>\n </div>\n );\n }\n\n return input;\n});\n"],"names":["SearchInput2","React","forwardRef","props","ref","findCurrent","findTotal","loading","onChange","handleChange","onClickFindNext","handleClickFindNext","onClickFindPrevious","handleClickFindPrevious","settingsContent","shortcut","value","attributes","internalRef","useMergedRef","containerRef","useRef","focused","setFocused","useState","texts","useLocalization","isActive","length","hasFind","undefined","useGlobalKeyDown","event","document","activeElement","current","_internalRef$current","preventDefault","focus","handleBlur","relatedTarget","_containerRef$current","contains","_attributes$onBlur","onBlur","call","handleClear","requestAnimationFrame","_internalRef$current2","handleFocus","_attributes$onFocus","onFocus","handleKeyDown","_props$onKeyDown","onKeyDown","isDefaultPrevented","key","shiftKey","postfix","disabled","readOnly","IconButton","searchInput","clear","className","icon","onMouseDown","tabIndex","tooltip","Shortcut","keys","Spinner","findPrevious","shift","findNext","onClickCapture","_internalRef$current3","cn","Icon","button","name","_internalRef$current4","input","Input","_attributes$ariaLabe","placeholder","target","_attributes$placehold","prefix","settingsClassname","style","opacity","_internalRef$current5"],"mappings":"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"}
1	+ {"version":3,"file":"SearchInput2.js","sources":["../../../../../../../src/components/SearchInput2/SearchInput2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { useGlobalKeyDown } from '../../hooks/useGlobalKeyDown';\nimport { useLocalization } from '../Provider/Localization';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Input } from '../Input/Input';\nimport { Shortcut } from '../Shortcut/Shortcut';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { KeyDownHandlerOptions } from '../../utils/keyboard';\nimport { Spinner } from '../Spinner/Spinner';\nimport { Icon } from '../Icon/Icon';\n\ninterface CommonSearchInput2Props\n extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'defaultValue' \| 'onChange' \| 'value'> {\n loading?: boolean;\n onChange: (value: string) => void;\n settingsContent?: JSX.Element;\n shortcut?: string \| KeyDownHandlerOptions;\n value?: string;\n}\n\ninterface BasicSearchInput2Props extends CommonSearchInput2Props {\n findCurrent?: never;\n findTotal?: never;\n onClickFindNext?: never;\n onClickFindPrevious?: never;\n}\n\ninterface ComplexSearchInput2Props extends CommonSearchInput2Props {\n findCurrent: number \| null;\n findTotal: number \| null;\n onClickFindNext: () => void;\n onClickFindPrevious: () => void;\n}\n\nexport type SearchInput2Props = BasicSearchInput2Props \| ComplexSearchInput2Props;\n\nexport const SearchInput2 = React.forwardRef(function SearchInput2(props: SearchInput2Props, ref: React.Ref<HTMLInputElement>) {\n const {\n findCurrent,\n findTotal,\n loading = false,\n onChange: handleChange,\n onClickFindNext: handleClickFindNext,\n onClickFindPrevious: handleClickFindPrevious,\n settingsContent,\n shortcut,\n value,\n ...attributes\n } = props;\n const internalRef = useMergedRef<HTMLInputElement>(ref);\n const containerRef = React.useRef<HTMLDivElement>(null);\n const [focused, setFocused] = React.useState(false);\n const { texts } = useLocalization();\n const isActive = value?.length;\n const hasFind = handleClickFindNext && handleClickFindPrevious && findCurrent !== undefined && findTotal !== undefined;\n\n useGlobalKeyDown(shortcut, (event: KeyboardEvent) => {\n if (document.activeElement !== internalRef.current) {\n event.preventDefault();\n internalRef.current?.focus();\n }\n });\n\n const handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n if (\n containerRef.current &&\n (containerRef.current === event.relatedTarget \|\| containerRef.current?.contains(event.relatedTarget))\n ) {\n return;\n }\n\n setFocused(false);\n attributes.onBlur?.(event);\n };\n\n const handleClear = () => {\n requestAnimationFrame(() => internalRef.current?.blur());\n handleChange('');\n };\n\n const handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n setFocused(true);\n attributes.onFocus?.(event);\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n props.onKeyDown?.(event);\n\n if (event.isDefaultPrevented()) {\n return;\n }\n if (event.key === 'Enter') {\n event.preventDefault();\n\n if (hasFind && isActive) {\n if (event.shiftKey) {\n handleClickFindPrevious?.();\n } else {\n handleClickFindNext?.();\n }\n }\n\n return;\n }\n\n if (event.key === 'Escape') {\n handleClear();\n return;\n }\n };\n\n let postfix;\n\n if (!attributes.disabled && !attributes.readOnly && (value \|\| focused)) {\n if (value) {\n postfix = (\n <IconButton\n aria-label={texts.searchInput.clear}\n className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n icon=\"close\"\n onMouseDown={handleClear}\n tabIndex={-1}\n tooltip={\n focused ? (\n <>\n {texts.searchInput.clear} <Shortcut keys=\"Escape\" />\n </>\n ) : (\n texts.searchInput.clear\n )\n }\n />\n );\n }\n\n if (hasFind && isActive) {\n postfix = (\n <>\n <span className=\"text-grey-700 flex h-4 items-center border-r border-black/[0.25] pr-2\">\n {loading ? <Spinner className=\"h-4 w-4\" /> : `${findCurrent ?? 0}/${findTotal ?? 0}`}\n </span>\n {findCurrent ? (\n <>\n <IconButton\n aria-label={texts.searchInput.findPrevious}\n className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n icon=\"chevron-up\"\n onMouseDown={handleClickFindPrevious}\n tabIndex={-1}\n tooltip={\n focused ? (\n <>\n {texts.searchInput.findPrevious} <Shortcut keys={{ shift: true, key: 'Enter' }} />\n </>\n ) : (\n texts.searchInput.findPrevious\n )\n }\n />\n <IconButton\n aria-label={texts.searchInput.findNext}\n className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n icon=\"chevron-down\"\n onMouseDown={handleClickFindNext}\n tabIndex={-1}\n tooltip={\n focused ? (\n <>\n {texts.searchInput.findNext} <Shortcut keys=\"Enter\" />\n </>\n ) : (\n texts.searchInput.findNext\n )\n }\n />\n </>\n ) : null}\n {postfix}\n </>\n );\n }\n } else if (shortcut && !focused && !value) {\n postfix = <Shortcut keys={shortcut} onClickCapture={() => internalRef.current?.focus()} />;\n }\n\n const className = cn(\n '!pl-7 group-focus-within:!w-72 group-focus-within:yt-focus',\n hasFind\n ? {\n '!w-48': !value,\n '!w-72': value,\n }\n : '!w-48',\n {\n '!wcag-blue-100': isActive,\n },\n props.className\n );\n\n const icon = (\n <Icon\n aria-label={texts.searchInput.button}\n className=\"-ml-0.5 scale-95\"\n name=\"search\"\n onClickCapture={() => internalRef.current?.focus()}\n />\n );\n\n const input = (\n <Input\n {...attributes}\n aria-label={attributes['aria-label'] ?? texts.searchInput.placeholder}\n className={className}\n data-taco=\"search-input2\"\n onBlur={handleBlur}\n onChange={event => handleChange(event.target.value)}\n onFocus={handleFocus}\n onKeyDown={handleKeyDown}\n placeholder={attributes.placeholder ?? texts.searchInput.placeholder}\n prefix={icon}\n postfix={postfix}\n ref={internalRef}\n value={value ?? ''}\n />\n );\n\n if (settingsContent) {\n const settingsClassname = cn(\n 'border-grey-300 absolute left-0 right-0 -mt-0.5 hidden top-full group-focus-within:flex focus-within:flex flex-col gap-y-4 rounded-b border border-t-0 bg-white p-3 shadow !pt-[calc(theme(spacing.3)_+_theme(spacing[0.5]))]'\n );\n\n return (\n <div\n className={cn('group relative', { 'z-10 [&_[data-taco=input-container]]:z-10': focused })}\n ref={containerRef}\n // create a new stacking context so our internal z-indexes don't effect external components\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n style={{ opacity: 0.999 }}>\n {input}\n <div\n className={settingsClassname}\n onClickCapture={() => internalRef.current?.focus()}\n // tab index is important, it lets the element show as a relatedTarget on event handlers\n tabIndex={-1}>\n {settingsContent}\n </div>\n </div>\n );\n }\n\n return input;\n});\n"],"names":["SearchInput2","React","forwardRef","props","ref","findCurrent","findTotal","loading","onChange","handleChange","onClickFindNext","handleClickFindNext","onClickFindPrevious","handleClickFindPrevious","settingsContent","shortcut","value","attributes","internalRef","useMergedRef","containerRef","useRef","focused","setFocused","useState","texts","useLocalization","isActive","length","hasFind","undefined","useGlobalKeyDown","event","document","activeElement","current","_internalRef$current","preventDefault","focus","handleBlur","relatedTarget","_containerRef$current","contains","_attributes$onBlur","onBlur","call","handleClear","requestAnimationFrame","_internalRef$current2","blur","handleFocus","_attributes$onFocus","onFocus","handleKeyDown","_props$onKeyDown","onKeyDown","isDefaultPrevented","key","shiftKey","postfix","disabled","readOnly","IconButton","searchInput","clear","className","icon","onMouseDown","tabIndex","tooltip","Shortcut","keys","Spinner","findPrevious","shift","findNext","onClickCapture","_internalRef$current3","cn","Icon","button","name","_internalRef$current4","input","Input","_attributes$ariaLabe","placeholder","target","_attributes$placehold","prefix","settingsClassname","style","opacity","_internalRef$current5"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table/hooks/useTableKeyboardNavigation.js CHANGED Viewed

@@ -16,9 +16,9 @@ const useTableKeyboardNavigation = (props, rows, rowProps, ref) => {
     }
   });
   const onKeyDown = event => {
-    var _document$activeEleme;
+    var _document$activeEleme, _document$activeEleme2;
     const isModifierKeyPressed = event.metaKey || event.ctrlKey || event.altKey || event.shiftKey;
-    if (useGlobalKeyboardNavigation && document.activeElement !== ref.current && ((_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 ? void 0 : _document$activeEleme.getAttribute('type')) !== 'search' && document.activeElement !== document.body) {
+    if (useGlobalKeyboardNavigation && document.activeElement !== ref.current && ((_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 ? void 0 : _document$activeEleme.getAttribute('type')) !== 'search' && document.activeElement !== document.body && ((_document$activeEleme2 = document.activeElement) === null || _document$activeEleme2 === void 0 ? void 0 : _document$activeEleme2.getAttribute('role')) !== 'dialog') {
       return;
     }
     // abort key handling if other elements inside table are focused and we don't use global keyboard navigation

package/dist/esm/packages/taco/src/components/Table/hooks/useTableKeyboardNavigation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useTableKeyboardNavigation.js","sources":["../../../../../../../../src/components/Table/hooks/useTableKeyboardNavigation.ts"],"sourcesContent":["import React from 'react';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { getNextIndexFromKey } from '../../../utils/hooks/useListKeyboardNavigation';\nimport { sanitizeRowProps } from '../util';\nimport { TableProps } from '../types';\n\nexport const useTableKeyboardNavigation = <T extends {}>(\n props: TableProps<T>,\n rows: any[],\n rowProps: any,\n ref: React.RefObject<HTMLDivElement>\n): [\n number \| undefined,\n (index: number) => void,\n (event: React.KeyboardEvent<HTMLElement>) => void,\n (event: React.FocusEvent<HTMLElement>) => void\n] => {\n const useGlobalKeyboardNavigation = props.dangerouslyHijackGlobalKeyboardNavigation;\n\n const [activeIndex, setActiveIndex] = useControllableState<number \| undefined>({\n prop: props.activeIndex,\n defaultProp:\n props.defaultActiveIndex !== undefined ? props.defaultActiveIndex : useGlobalKeyboardNavigation ? 0 : undefined,\n onChange: index => {\n if (index !== undefined) {\n props.onChangeActiveIndex?.(index);\n }\n },\n });\n\n const onKeyDown = (event: KeyboardEvent): void => {\n const isModifierKeyPressed = event.metaKey \|\| event.ctrlKey \|\| event.altKey \|\| event.shiftKey;\n\n if (\n useGlobalKeyboardNavigation &&\n document.activeElement !== ref.current &&\n document.activeElement?.getAttribute('type') !== 'search' &&\n document.activeElement !== document.body\n ) {\n return;\n }\n // abort key handling if other elements inside table are focused and we don't use global keyboard navigation\n if (!useGlobalKeyboardNavigation && document.activeElement !== ref.current) {\n return;\n }\n\n if (activeIndex !== undefined) {\n const currentRow = rows[activeIndex];\n\n if (currentRow) {\n const sanitizedRow = sanitizeRowProps(currentRow, rowProps.rowExpansionRenderer);\n\n if (rowProps.onRowClick && event.key === 'Enter') {\n event.preventDefault();\n rowProps.onRowClick(sanitizedRow);\n return;\n }\n\n if (currentRow.toggleRowSelected && event.key === ' ') {\n event.preventDefault();\n currentRow.toggleRowSelected();\n return;\n }\n\n if (currentRow.toggleRowExpanded) {\n if (currentRow.isExpanded && event.key === 'ArrowLeft') {\n event.preventDefault();\n currentRow.toggleRowExpanded();\n return;\n } else if (!currentRow.isExpanded && event.key === 'ArrowRight') {\n event.preventDefault();\n currentRow.toggleRowExpanded();\n return;\n }\n }\n\n // inline editing\n if (currentRow.toggleRowEditing) {\n if (currentRow.canEdit && !currentRow.isEditing) {\n if (rowProps.onRowCreate && event.shiftKey && event.key === 'n') {\n event.preventDefault();\n\n if (!currentRow.isExpanded) {\n currentRow.toggleRowExpanded();\n }\n\n rowProps.onRowCreate(sanitizedRow, event);\n return;\n }\n\n if (event.key === 'e') {\n event.preventDefault();\n currentRow.toggleRowEditing();\n return;\n }\n }\n }\n\n if (rowProps.onRowEdit && event.key === 'e' && !isModifierKeyPressed) {\n event.preventDefault();\n rowProps.onRowEdit(sanitizedRow, event);\n return;\n }\n\n if (rowProps.onRowCopy && event.key === 'c' && !isModifierKeyPressed) {\n event.preventDefault();\n rowProps.onRowCopy(sanitizedRow, event);\n return;\n }\n\n if (rowProps.onRowDelete && event.key === 'Delete' && !isModifierKeyPressed) {\n event.preventDefault();\n rowProps.onRowDelete(sanitizedRow, event);\n return;\n }\n }\n }\n\n const nextIndex = getNextIndexFromKey(event.key, rows.length, activeIndex);\n\n if (nextIndex !== undefined) {\n event.preventDefault();\n setActiveIndex(nextIndex);\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n if (!useGlobalKeyboardNavigation) {\n onKeyDown(event.nativeEvent);\n }\n };\n\n React.useEffect(() => {\n if (useGlobalKeyboardNavigation) {\n window.addEventListener('keydown', onKeyDown);\n }\n\n return () => {\n if (useGlobalKeyboardNavigation) {\n window.removeEventListener('keydown', onKeyDown);\n }\n };\n }, [onKeyDown]);\n\n const handleFocus = (): void => {\n if (activeIndex === undefined && rows.length) {\n setActiveIndex(0);\n }\n };\n\n return [activeIndex, setActiveIndex, handleKeyDown, handleFocus];\n};\n"],"names":["useTableKeyboardNavigation","props","rows","rowProps","ref","useGlobalKeyboardNavigation","dangerouslyHijackGlobalKeyboardNavigation","activeIndex","setActiveIndex","useControllableState","prop","defaultProp","defaultActiveIndex","undefined","onChange","index","_props$onChangeActive","onChangeActiveIndex","call","onKeyDown","event","isModifierKeyPressed","metaKey","ctrlKey","altKey","shiftKey","document","activeElement","current","_document$activeEleme","getAttribute","body","currentRow","sanitizedRow","sanitizeRowProps","rowExpansionRenderer","onRowClick","key","preventDefault","toggleRowSelected","toggleRowExpanded","isExpanded","toggleRowEditing","canEdit","isEditing","onRowCreate","onRowEdit","onRowCopy","onRowDelete","nextIndex","getNextIndexFromKey","length","handleKeyDown","nativeEvent","React","useEffect","window","addEventListener","removeEventListener","handleFocus"],"mappings":"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"}
1	+ {"version":3,"file":"useTableKeyboardNavigation.js","sources":["../../../../../../../../src/components/Table/hooks/useTableKeyboardNavigation.ts"],"sourcesContent":["import React from 'react';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { getNextIndexFromKey } from '../../../utils/hooks/useListKeyboardNavigation';\nimport { sanitizeRowProps } from '../util';\nimport { TableProps } from '../types';\n\nexport const useTableKeyboardNavigation = <T extends {}>(\n props: TableProps<T>,\n rows: any[],\n rowProps: any,\n ref: React.RefObject<HTMLDivElement>\n): [\n number \| undefined,\n (index: number) => void,\n (event: React.KeyboardEvent<HTMLElement>) => void,\n (event: React.FocusEvent<HTMLElement>) => void\n] => {\n const useGlobalKeyboardNavigation = props.dangerouslyHijackGlobalKeyboardNavigation;\n\n const [activeIndex, setActiveIndex] = useControllableState<number \| undefined>({\n prop: props.activeIndex,\n defaultProp:\n props.defaultActiveIndex !== undefined ? props.defaultActiveIndex : useGlobalKeyboardNavigation ? 0 : undefined,\n onChange: index => {\n if (index !== undefined) {\n props.onChangeActiveIndex?.(index);\n }\n },\n });\n\n const onKeyDown = (event: KeyboardEvent): void => {\n const isModifierKeyPressed = event.metaKey \|\| event.ctrlKey \|\| event.altKey \|\| event.shiftKey;\n\n if (\n useGlobalKeyboardNavigation &&\n document.activeElement !== ref.current &&\n document.activeElement?.getAttribute('type') !== 'search' &&\n document.activeElement !== document.body &&\n document.activeElement?.getAttribute('role') !== 'dialog'\n ) {\n return;\n }\n // abort key handling if other elements inside table are focused and we don't use global keyboard navigation\n if (!useGlobalKeyboardNavigation && document.activeElement !== ref.current) {\n return;\n }\n\n if (activeIndex !== undefined) {\n const currentRow = rows[activeIndex];\n\n if (currentRow) {\n const sanitizedRow = sanitizeRowProps(currentRow, rowProps.rowExpansionRenderer);\n\n if (rowProps.onRowClick && event.key === 'Enter') {\n event.preventDefault();\n rowProps.onRowClick(sanitizedRow);\n return;\n }\n\n if (currentRow.toggleRowSelected && event.key === ' ') {\n event.preventDefault();\n currentRow.toggleRowSelected();\n return;\n }\n\n if (currentRow.toggleRowExpanded) {\n if (currentRow.isExpanded && event.key === 'ArrowLeft') {\n event.preventDefault();\n currentRow.toggleRowExpanded();\n return;\n } else if (!currentRow.isExpanded && event.key === 'ArrowRight') {\n event.preventDefault();\n currentRow.toggleRowExpanded();\n return;\n }\n }\n\n // inline editing\n if (currentRow.toggleRowEditing) {\n if (currentRow.canEdit && !currentRow.isEditing) {\n if (rowProps.onRowCreate && event.shiftKey && event.key === 'n') {\n event.preventDefault();\n\n if (!currentRow.isExpanded) {\n currentRow.toggleRowExpanded();\n }\n\n rowProps.onRowCreate(sanitizedRow, event);\n return;\n }\n\n if (event.key === 'e') {\n event.preventDefault();\n currentRow.toggleRowEditing();\n return;\n }\n }\n }\n\n if (rowProps.onRowEdit && event.key === 'e' && !isModifierKeyPressed) {\n event.preventDefault();\n rowProps.onRowEdit(sanitizedRow, event);\n return;\n }\n\n if (rowProps.onRowCopy && event.key === 'c' && !isModifierKeyPressed) {\n event.preventDefault();\n rowProps.onRowCopy(sanitizedRow, event);\n return;\n }\n\n if (rowProps.onRowDelete && event.key === 'Delete' && !isModifierKeyPressed) {\n event.preventDefault();\n rowProps.onRowDelete(sanitizedRow, event);\n return;\n }\n }\n }\n\n const nextIndex = getNextIndexFromKey(event.key, rows.length, activeIndex);\n\n if (nextIndex !== undefined) {\n event.preventDefault();\n setActiveIndex(nextIndex);\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n if (!useGlobalKeyboardNavigation) {\n onKeyDown(event.nativeEvent);\n }\n };\n\n React.useEffect(() => {\n if (useGlobalKeyboardNavigation) {\n window.addEventListener('keydown', onKeyDown);\n }\n\n return () => {\n if (useGlobalKeyboardNavigation) {\n window.removeEventListener('keydown', onKeyDown);\n }\n };\n }, [onKeyDown]);\n\n const handleFocus = (): void => {\n if (activeIndex === undefined && rows.length) {\n setActiveIndex(0);\n }\n };\n\n return [activeIndex, setActiveIndex, handleKeyDown, handleFocus];\n};\n"],"names":["useTableKeyboardNavigation","props","rows","rowProps","ref","useGlobalKeyboardNavigation","dangerouslyHijackGlobalKeyboardNavigation","activeIndex","setActiveIndex","useControllableState","prop","defaultProp","defaultActiveIndex","undefined","onChange","index","_props$onChangeActive","onChangeActiveIndex","call","onKeyDown","event","isModifierKeyPressed","metaKey","ctrlKey","altKey","shiftKey","document","activeElement","current","_document$activeEleme","getAttribute","body","_document$activeEleme2","currentRow","sanitizedRow","sanitizeRowProps","rowExpansionRenderer","onRowClick","key","preventDefault","toggleRowSelected","toggleRowExpanded","isExpanded","toggleRowEditing","canEdit","isEditing","onRowCreate","onRowEdit","onRowCopy","onRowDelete","nextIndex","getNextIndexFromKey","length","handleKeyDown","nativeEvent","React","useEffect","window","addEventListener","removeEventListener","handleFocus"],"mappings":"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"}

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

@@ -45,9 +45,12 @@ const Table = /*#__PURE__*/fixedForwardRef(function Table3(props, ref) {
   const bodyRef = React__default.useRef(null);
   React__default.useEffect(() => {
     const handleKeyDown = event => {
-      const dialog = document.querySelector('[role="dialog"]');
-      // Don't trigger global shortcuts on the table if it is outside of the dialog
-      if (dialog && !(dialog !== null && dialog !== void 0 && dialog.contains(internalRef.current))) {
+      const target = event.target;
+      const dialog = target.closest('[role="dialog"]');
+      const eventOriginatedFromCombobox = !!target.closest('[role="combobox"]');
+      // Don't trigger global shortcuts on the table if event originated from a combobox or if table is
+      // outside the dialog
+      if (eventOriginatedFromCombobox || dialog && !(dialog !== null && dialog !== void 0 && dialog.contains(internalRef.current))) {
         return;
       }
       tableMeta.hoverState.handleKeyDown(event);
@@ -81,9 +84,11 @@ const Table = /*#__PURE__*/fixedForwardRef(function Table3(props, ref) {
     'text-sm': tableMeta.fontSize.size === 'medium',
     'text-base': tableMeta.fontSize.size === 'large'
   });
+  // Print tables have "_print" as the postfix for the table id, so we can use the it to determine
+  // if the table is a print table or not.
   const {
     style: cssGridStyle
-  } = useCssGrid(table);
+  } = useCssGrid(table, props.id.endsWith('_print'));
   const {
     style: cssVars
   } = useCssVars(tableMeta.rowHeight.height, tableMeta.fontSize.size);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { flexRender, TableMeta } from '@tanstack/react-table';\nimport { FocusScope } from '@react-aria/focus';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useCssGrid } from './hooks/useCssGrid';\nimport { useTable } from './hooks/useTable';\nimport { useTableRenderStrategy } from './strategies';\nimport { Table3ColumnProps, Table3Props, Table3Ref } from './types';\nimport { Toolbar } from './components/toolbar/Toolbar';\nimport { useColumnFreezingStyle } from './hooks/features/useColumnFreezing';\nimport { useTableRefInstanceSetup } from './hooks/useTableRefInstanceSetup';\nimport { Summary } from './components/columns/footer/Summary';\nimport { useCssVars } from './hooks/useCssVars';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\n\ntype FixedForwardRef = <T, P = {}>(\n render: (props: P, ref: React.Ref<T>) => JSX.Element\n) => (props: P & React.RefAttributes<T>) => JSX.Element;\n\n// Cast the old forwardRef to the new one\nexport const fixedForwardRef = React.forwardRef as FixedForwardRef;\n\nconst Table = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const { emptyState: EmptyState, toolbarLeft, toolbarRight } = props;\n const internalRef = useMergedRef<Table3Ref>(ref);\n\n const { table, length } = useTable<TType>(props);\n useTableRefInstanceSetup(table, internalRef);\n\n React.useEffect(() => {\n if (props.autoFocus) {\n internalRef.current?.focus();\n }\n }, []);\n\n const { renderBody, scrollToIndex } = useTableRenderStrategy<TType>(props, table, internalRef);\n const tableMeta = table.options.meta as TableMeta<TType>;\n const state = table.getState();\n\n const bodyRef = React.useRef<HTMLDivElement \| null>(null);\n\n React.useEffect(\n () => {\n const handleKeyDown = (event: KeyboardEvent) => {\n const dialog = document.querySelector('[role=\"dialog\"]');\n\n // Don't trigger global shortcuts on the table if it is outside of the dialog\n if (dialog && !dialog?.contains(internalRef.current)) {\n return;\n }\n\n tableMeta.hoverState.handleKeyDown(event);\n tableMeta.currentRow.handleKeyDown(event, table.getRowModel().rows.length, scrollToIndex);\n tableMeta.rowClick.handleKeyDown(event, table);\n tableMeta.rowSelection.handleKeyDown(event, table);\n tableMeta.editing.handleKeyDown(event);\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n },\n // See https://github.com/e-conomic/taco/blob/dev/packages/taco/src/components/Table3/strategies/virtualised.tsx#L143\n // scrollToIndex function changes when row count changes, so it is important to update handlers with new\n // scrollToIndex function.\n [scrollToIndex, internalRef.current]\n );\n\n const handleBlur = (event: React.FocusEvent) => {\n tableMeta.editing.handleBlur(event);\n };\n\n const handleScroll = async (event: React.MouseEvent<HTMLDivElement>) => {\n tableMeta.columnFreezing.handleScroll(event);\n };\n\n const className = cn(\n 'border-grey-300 relative grid h-full w-full flex-grow overflow-auto rounded border bg-white scroll-mt-[41px]',\n '[&[data-resizing=\"true\"]]:select-none',\n {\n 'text-xs': tableMeta.fontSize.size === 'small',\n 'text-sm': tableMeta.fontSize.size === 'medium',\n 'text-base': tableMeta.fontSize.size === 'large',\n }\n );\n\n const { style: cssGridStyle } = useCssGrid<TType>(table);\n const { style: cssVars } = useCssVars(tableMeta.rowHeight.height, tableMeta.fontSize.size);\n\n const style = {\n ...cssVars,\n ...cssGridStyle,\n // create a new stacking context so our internal z-indexes don't effect external components\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n opacity: 0.999,\n };\n\n const columnFreezingStyle = useColumnFreezingStyle(props.id, table);\n const isServerLoadingAndNotReady = tableMeta.isUsingServer && props.length === undefined;\n\n return (\n <>\n {columnFreezingStyle ? <style data-taco=\"table3-column-freezing-styles\">{columnFreezingStyle}</style> : null}\n <Toolbar\n table={table}\n tableProps={props}\n total={length}\n left={toolbarLeft}\n right={toolbarRight}\n scrollToIndex={scrollToIndex}\n />\n <div\n className={className}\n id={props.id}\n data-font-size={tableMeta.fontSize.size}\n data-editing={tableMeta.editing.isEditing}\n data-horizontally-scrolled={tableMeta.columnFreezing.horizontallyScrolled}\n data-pause-hover={tableMeta?.hoverState.isPaused}\n data-resizing={!!state.columnSizingInfo.isResizingColumn}\n data-taco=\"table2\"\n onBlur={handleBlur}\n onScroll={handleScroll}\n ref={internalRef}\n role=\"table\"\n style={style}>\n {isServerLoadingAndNotReady ? null : (\n <div className=\"group/header contents\" data-taco=\"table2-header\" role=\"rowgroup\">\n {table.getHeaderGroups().map(headerGroup => (\n <div className=\"contents\" key={headerGroup.id} role=\"row\">\n {headerGroup.headers.map(header => (\n <React.Fragment key={header.id}>\n {flexRender(header.column.columnDef.header, { ...header.getContext(), scrollToIndex })}\n </React.Fragment>\n ))}\n </div>\n ))}\n </div>\n )}\n {table.getRowModel().rows.length ? (\n <>\n <FocusScope>\n <div className=\"group/body contents\" data-taco=\"table2-body\" role=\"rowgroup\" ref={bodyRef}>\n {renderBody()}\n </div>\n </FocusScope>\n {/* This div makes sure that there is always a free space between the rows and footer when\n table height exceeds the cumulative height of all rows. See useCSSGrid.ts /}\n {/ By vertically translating the div a pixel down, we hide the div border below footer so that\n the footer border doesn't appear an extra pixel thick */}\n <div className=\"border-grey-300 col-span-full translate-y-px border-t\" />\n {tableMeta.enableFooter ? (\n <div className=\"group/footer contents\" data-taco=\"table2-footer\" role=\"rowgroup\">\n {table.getFooterGroups().map(footerGroup => (\n <div className=\"contents\" key={footerGroup.id} role=\"row\">\n {footerGroup.headers.map(footer => (\n <React.Fragment key={footer.id}>\n {flexRender(footer.column.columnDef.footer, footer.getContext())}\n </React.Fragment>\n ))}\n </div>\n ))}\n {length ? (\n <Summary currentLength={table.getRowModel().rows.length} length={length} table={table} />\n ) : null}\n </div>\n ) : null}\n </>\n ) : (\n <div className=\"col-span-full min-h-[theme(spacing.8)]\">{EmptyState ? <EmptyState /> : null}</div>\n )}\n </div>\n </>\n );\n});\n\ntype Table3WithStatics = (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\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 <Table<TType> {...props} key={key} ref={ref} />;\n}) as Table3WithStatics;\nTable3.Column = Column;\n\n// hooks\nexport { useTable3DataLoader } from './hooks/useTableDataLoader';\n\n// types\nexport type {\n useTable3DataFetcher,\n useTable3DataOptions,\n useTable3DataFetcherValues as useTableDataValues,\n} from './hooks/useTableDataLoader';\n\nexport type {\n Table3Ref,\n Table3Props,\n Table3Preset,\n Table3Settings,\n Table3SettingsHandler,\n Table3RowHeight,\n Table3FilterComparator,\n Table3FilterHandler,\n Table3LoadPageHandler,\n Table3LoadAllHandler,\n Table3RowGotoHandler,\n Table3SortHandler,\n Table3Shortcuts,\n Table3ShortcutHandlerFn,\n Table3ShortcutHandlerObject,\n Table3FontSize,\n Table3SortDirection,\n Table3SortFn,\n Table3RowActionRenderer,\n Table3RowSelectionHandler,\n Table3RowExpansionRenderer,\n Table3RowDropHandler,\n Table3RowDragHandler,\n Table3RowClickHandler,\n Table3ColumnProps,\n Table3ColumnAlignment,\n Table3ColumnDataType,\n Table3ColumnHeaderMenu,\n Table3ColumnClassNameHandler,\n Table3ColumnFooterRenderer,\n Table3ColumnRenderer,\n Table3ColumnControlRenderer,\n Table3ColumnControlProps,\n} from './types';\n"],"names":["Column","_","fixedForwardRef","React","forwardRef","Table","Table3","props","ref","emptyState","EmptyState","toolbarLeft","toolbarRight","internalRef","useMergedRef","table","length","useTable","useTableRefInstanceSetup","useEffect","autoFocus","_internalRef$current","current","focus","renderBody","scrollToIndex","useTableRenderStrategy","tableMeta","options","meta","state","getState","bodyRef","useRef","handleKeyDown","event","dialog","document","querySelector","contains","hoverState","currentRow","getRowModel","rows","rowClick","rowSelection","editing","addEventListener","removeEventListener","handleBlur","handleScroll","columnFreezing","Promise","resolve","e","reject","className","cn","fontSize","size","style","cssGridStyle","useCssGrid","cssVars","useCssVars","rowHeight","height","opacity","columnFreezingStyle","useColumnFreezingStyle","id","isServerLoadingAndNotReady","isUsingServer","undefined","Toolbar","tableProps","total","left","right","isEditing","horizontallyScrolled","isPaused","columnSizingInfo","isResizingColumn","onBlur","onScroll","role","getHeaderGroups","map","headerGroup","key","headers","header","Fragment","flexRender","column","columnDef","getContext","FocusScope","enableFooter","getFooterGroups","footerGroup","footer","Summary","currentLength","stringifiedChildren","String","children","useMemo"],"mappings":"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"}
1	+ {"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { flexRender, TableMeta } from '@tanstack/react-table';\nimport { FocusScope } from '@react-aria/focus';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useCssGrid } from './hooks/useCssGrid';\nimport { useTable } from './hooks/useTable';\nimport { useTableRenderStrategy } from './strategies';\nimport { Table3ColumnProps, Table3Props, Table3Ref } from './types';\nimport { Toolbar } from './components/toolbar/Toolbar';\nimport { useColumnFreezingStyle } from './hooks/features/useColumnFreezing';\nimport { useTableRefInstanceSetup } from './hooks/useTableRefInstanceSetup';\nimport { Summary } from './components/columns/footer/Summary';\nimport { useCssVars } from './hooks/useCssVars';\nimport './style.css';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\n\ntype FixedForwardRef = <T, P = {}>(\n render: (props: P, ref: React.Ref<T>) => JSX.Element\n) => (props: P & React.RefAttributes<T>) => JSX.Element;\n\n// Cast the old forwardRef to the new one\nexport const fixedForwardRef = React.forwardRef as FixedForwardRef;\n\nconst Table = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const { emptyState: EmptyState, toolbarLeft, toolbarRight } = props;\n const internalRef = useMergedRef<Table3Ref>(ref);\n\n const { table, length } = useTable<TType>(props);\n useTableRefInstanceSetup(table, internalRef);\n\n React.useEffect(() => {\n if (props.autoFocus) {\n internalRef.current?.focus();\n }\n }, []);\n\n const { renderBody, scrollToIndex } = useTableRenderStrategy<TType>(props, table, internalRef);\n const tableMeta = table.options.meta as TableMeta<TType>;\n const state = table.getState();\n\n const bodyRef = React.useRef<HTMLDivElement \| null>(null);\n\n React.useEffect(\n () => {\n const handleKeyDown = (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n const dialog = target.closest('[role=\"dialog\"]');\n const eventOriginatedFromCombobox = !!target.closest('[role=\"combobox\"]');\n\n // Don't trigger global shortcuts on the table if event originated from a combobox or if table is\n // outside the dialog\n if (eventOriginatedFromCombobox \|\| (dialog && !dialog?.contains(internalRef.current))) {\n return;\n }\n\n tableMeta.hoverState.handleKeyDown(event);\n tableMeta.currentRow.handleKeyDown(event, table.getRowModel().rows.length, scrollToIndex);\n tableMeta.rowClick.handleKeyDown(event, table);\n tableMeta.rowSelection.handleKeyDown(event, table);\n tableMeta.editing.handleKeyDown(event);\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n },\n // See https://github.com/e-conomic/taco/blob/dev/packages/taco/src/components/Table3/strategies/virtualised.tsx#L143\n // scrollToIndex function changes when row count changes, so it is important to update handlers with new\n // scrollToIndex function.\n [scrollToIndex, internalRef.current]\n );\n\n const handleBlur = (event: React.FocusEvent) => {\n tableMeta.editing.handleBlur(event);\n };\n\n const handleScroll = async (event: React.MouseEvent<HTMLDivElement>) => {\n tableMeta.columnFreezing.handleScroll(event);\n };\n\n const className = cn(\n 'border-grey-300 relative grid h-full w-full flex-grow overflow-auto rounded border bg-white scroll-mt-[41px]',\n '[&[data-resizing=\"true\"]]:select-none',\n {\n 'text-xs': tableMeta.fontSize.size === 'small',\n 'text-sm': tableMeta.fontSize.size === 'medium',\n 'text-base': tableMeta.fontSize.size === 'large',\n }\n );\n\n // Print tables have \"_print\" as the postfix for the table id, so we can use the it to determine\n // if the table is a print table or not.\n const { style: cssGridStyle } = useCssGrid<TType>(table, props.id.endsWith('_print'));\n const { style: cssVars } = useCssVars(tableMeta.rowHeight.height, tableMeta.fontSize.size);\n\n const style = {\n ...cssVars,\n ...cssGridStyle,\n // create a new stacking context so our internal z-indexes don't effect external components\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n opacity: 0.999,\n };\n\n const columnFreezingStyle = useColumnFreezingStyle(props.id, table);\n const isServerLoadingAndNotReady = tableMeta.isUsingServer && props.length === undefined;\n\n return (\n <>\n {columnFreezingStyle ? <style data-taco=\"table3-column-freezing-styles\">{columnFreezingStyle}</style> : null}\n <Toolbar\n table={table}\n tableProps={props}\n total={length}\n left={toolbarLeft}\n right={toolbarRight}\n scrollToIndex={scrollToIndex}\n />\n <div\n className={className}\n id={props.id}\n data-font-size={tableMeta.fontSize.size}\n data-editing={tableMeta.editing.isEditing}\n data-horizontally-scrolled={tableMeta.columnFreezing.horizontallyScrolled}\n data-pause-hover={tableMeta?.hoverState.isPaused}\n data-resizing={!!state.columnSizingInfo.isResizingColumn}\n data-taco=\"table2\"\n onBlur={handleBlur}\n onScroll={handleScroll}\n ref={internalRef}\n role=\"table\"\n style={style}>\n {isServerLoadingAndNotReady ? null : (\n <div className=\"group/header contents\" data-taco=\"table2-header\" role=\"rowgroup\">\n {table.getHeaderGroups().map(headerGroup => (\n <div className=\"contents\" key={headerGroup.id} role=\"row\">\n {headerGroup.headers.map(header => (\n <React.Fragment key={header.id}>\n {flexRender(header.column.columnDef.header, { ...header.getContext(), scrollToIndex })}\n </React.Fragment>\n ))}\n </div>\n ))}\n </div>\n )}\n {table.getRowModel().rows.length ? (\n <>\n <FocusScope>\n <div className=\"group/body contents\" data-taco=\"table2-body\" role=\"rowgroup\" ref={bodyRef}>\n {renderBody()}\n </div>\n </FocusScope>\n {/* This div makes sure that there is always a free space between the rows and footer when\n table height exceeds the cumulative height of all rows. See useCSSGrid.ts /}\n {/ By vertically translating the div a pixel down, we hide the div border below footer so that\n the footer border doesn't appear an extra pixel thick */}\n <div className=\"border-grey-300 col-span-full translate-y-px border-t\" />\n {tableMeta.enableFooter ? (\n <div className=\"group/footer contents\" data-taco=\"table2-footer\" role=\"rowgroup\">\n {table.getFooterGroups().map(footerGroup => (\n <div className=\"contents\" key={footerGroup.id} role=\"row\">\n {footerGroup.headers.map(footer => (\n <React.Fragment key={footer.id}>\n {flexRender(footer.column.columnDef.footer, footer.getContext())}\n </React.Fragment>\n ))}\n </div>\n ))}\n {length ? (\n <Summary currentLength={table.getRowModel().rows.length} length={length} table={table} />\n ) : null}\n </div>\n ) : null}\n </>\n ) : (\n <div className=\"col-span-full min-h-[theme(spacing.8)]\">{EmptyState ? <EmptyState /> : null}</div>\n )}\n </div>\n </>\n );\n});\n\ntype Table3WithStatics = (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\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 <Table<TType> {...props} key={key} ref={ref} />;\n}) as Table3WithStatics;\nTable3.Column = Column;\n\n// hooks\nexport { useTable3DataLoader } from './hooks/useTableDataLoader';\n\n// types\nexport type {\n useTable3DataFetcher,\n useTable3DataOptions,\n useTable3DataFetcherValues as useTableDataValues,\n} from './hooks/useTableDataLoader';\n\nexport type {\n Table3Ref,\n Table3Props,\n Table3Preset,\n Table3Settings,\n Table3SettingsHandler,\n Table3RowHeight,\n Table3FilterComparator,\n Table3FilterHandler,\n Table3LoadPageHandler,\n Table3LoadAllHandler,\n Table3RowGotoHandler,\n Table3SortHandler,\n Table3Shortcuts,\n Table3ShortcutHandlerFn,\n Table3ShortcutHandlerObject,\n Table3FontSize,\n Table3SortDirection,\n Table3SortFn,\n Table3RowActionRenderer,\n Table3RowSelectionHandler,\n Table3RowExpansionRenderer,\n Table3RowDropHandler,\n Table3RowDragHandler,\n Table3RowClickHandler,\n Table3ColumnProps,\n Table3ColumnAlignment,\n Table3ColumnDataType,\n Table3ColumnHeaderMenu,\n Table3ColumnClassNameHandler,\n Table3ColumnFooterRenderer,\n Table3ColumnRenderer,\n Table3ColumnControlRenderer,\n Table3ColumnControlProps,\n} from './types';\n"],"names":["Column","_","fixedForwardRef","React","forwardRef","Table","Table3","props","ref","emptyState","EmptyState","toolbarLeft","toolbarRight","internalRef","useMergedRef","table","length","useTable","useTableRefInstanceSetup","useEffect","autoFocus","_internalRef$current","current","focus","renderBody","scrollToIndex","useTableRenderStrategy","tableMeta","options","meta","state","getState","bodyRef","useRef","handleKeyDown","event","target","dialog","closest","eventOriginatedFromCombobox","contains","hoverState","currentRow","getRowModel","rows","rowClick","rowSelection","editing","document","addEventListener","removeEventListener","handleBlur","handleScroll","columnFreezing","Promise","resolve","e","reject","className","cn","fontSize","size","style","cssGridStyle","useCssGrid","id","endsWith","cssVars","useCssVars","rowHeight","height","opacity","columnFreezingStyle","useColumnFreezingStyle","isServerLoadingAndNotReady","isUsingServer","undefined","Toolbar","tableProps","total","left","right","isEditing","horizontallyScrolled","isPaused","columnSizingInfo","isResizingColumn","onBlur","onScroll","role","getHeaderGroups","map","headerGroup","key","headers","header","Fragment","flexRender","column","columnDef","getContext","FocusScope","enableFooter","getFooterGroups","footerGroup","footer","Summary","currentLength","stringifiedChildren","String","children","useMemo"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/Cell.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { DisplayCell } from './DisplayCell.js';
 import { EditingCell } from './EditingCell.js';
 function Cell(props) {
-  var _rows$tableMeta$curre;
+  var _rows$currentRowIndex;
   const {
     column,
     row,
@@ -16,7 +16,8 @@ function Cell(props) {
   const rows = table.getRowModel().rows;
   const tableMeta = table.options.meta;
   const columnMeta = column.columnDef.meta;
-  const isCurrentRow = ((_rows$tableMeta$curre = rows[tableMeta.currentRow.currentRowIndex]) === null || _rows$tableMeta$curre === void 0 ? void 0 : _rows$tableMeta$curre.id) === row.id;
+  const currentRowIndex = tableMeta.currentRow.currentRowIndex;
+  const isCurrentRow = currentRowIndex !== undefined && ((_rows$currentRowIndex = rows[currentRowIndex]) === null || _rows$currentRowIndex === void 0 ? void 0 : _rows$currentRowIndex.id) === row.id;
   if (tableMeta.editing.isEditing && columnMeta.control && (isCurrentRow || isHoveredRow && !tableMeta.hoverState.isPaused)) {
     return /*#__PURE__*/React__default.createElement(EditingCell, Object.assign({}, props));
   }

package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/Cell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Cell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, ColumnMeta, TableMeta } from '@tanstack/react-table';\nimport { DisplayCell } from './DisplayCell';\nimport { EditingCell } from './EditingCell';\nimport { useRowContext } from '../../rows/RowContext';\n\nexport type CellProps<TType = unknown> = CellContext<TType, unknown> & {\n children?: string \| JSX.Element;\n};\n\nexport function Cell<TType = unknown>(props: CellProps<TType>) {\n const { column, row, table } = props;\n const { isHovered: isHoveredRow } = useRowContext();\n const rows = table.getRowModel().rows;\n const tableMeta = table.options.meta as TableMeta<unknown>;\n const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n\n const ~~isCurrentRow~~ = ~~rows[~~tableMeta.currentRow.currentRowIndex]?.id === row.id;\n\n if (tableMeta.editing.isEditing && columnMeta.control && (isCurrentRow \|\| (isHoveredRow && !tableMeta.hoverState.isPaused))) {\n return <EditingCell {...props} />;\n }\n\n return <DisplayCell {...props} />;\n}\n"],"names":["Cell","props","column","row","table","isHovered","isHoveredRow","useRowContext","rows","getRowModel","tableMeta","options","meta","columnMeta","columnDef","~~isCurrentRow~~","~~_rows$tableMeta$curre~~","~~currentRow~~","currentRowIndex","id","editing","isEditing","control","hoverState","isPaused","React","EditingCell","DisplayCell"],"mappings":";;;;;SAUgBA,IAAIA,CAAkBC,KAAuB;;EACzD,MAAM;IAAEC,MAAM;IAAEC,GAAG;IAAEC;GAAO,GAAGH,KAAK;EACpC,MAAM;IAAEI,SAAS,EAAEC;GAAc,GAAGC,aAAa,EAAE;EACnD,MAAMC,IAAI,GAAGJ,KAAK,CAACK,WAAW,EAAE,CAACD,IAAI;EACrC,MAAME,SAAS,GAAGN,KAAK,CAACO,OAAO,CAACC,IAA0B;EAC1D,MAAMC,UAAU,GAAGX,MAAM,CAACY,SAAS,CAACF,IAAkC;EAEtE,MAAMG,YAAY,~~GAAG~~,~~EAAAC~~,~~qBAAA~~,~~GAAAR~~,IAAI,~~CAACE~~,~~SAAS~~,~~CAACO~~,~~UAAU~~,~~CAACC~~,eAAe,CAAC,~~cAAAF~~,qBAAA,~~uBAA1CA~~,qBAAA,~~CAA4CG~~,EAAE,~~MAAKhB~~,GAAG,~~CAACgB~~,EAAE;~~EAE9E~~,~~IAAIT~~,SAAS,~~CAACU~~,OAAO,CAACC,SAAS,~~IAAIR~~,UAAU,~~CAACS~~,OAAO,~~KAAKP~~,YAAY,~~IAAKT~~,YAAY,IAAI,CAACI,SAAS,~~CAACa~~,UAAU,CAACC,QAAS,CAAC,EAAE;IACzH,oBAAOC,6BAACC,WAAW,~~oBAAKzB~~,KAAK,EAAI;;EAGrC,~~oBAAOwB~~,6BAACE,WAAW,~~oBAAK1B~~,KAAK,EAAI;AACrC;;;;"}
1	+ {"version":3,"file":"Cell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, ColumnMeta, TableMeta } from '@tanstack/react-table';\nimport { DisplayCell } from './DisplayCell';\nimport { EditingCell } from './EditingCell';\nimport { useRowContext } from '../../rows/RowContext';\n\nexport type CellProps<TType = unknown> = CellContext<TType, unknown> & {\n children?: string \| JSX.Element;\n};\n\nexport function Cell<TType = unknown>(props: CellProps<TType>) {\n const { column, row, table } = props;\n const { isHovered: isHoveredRow } = useRowContext();\n const rows = table.getRowModel().rows;\n const tableMeta = table.options.meta as TableMeta<unknown>;\n const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n\n const currentRowIndex = tableMeta.currentRow.currentRowIndex;\n const isCurrentRow =\n currentRowIndex !== undefined && rows[currentRowIndex]?.id === row.id;\n\n if (tableMeta.editing.isEditing && columnMeta.control && (isCurrentRow \|\| (isHoveredRow && !tableMeta.hoverState.isPaused))) {\n return <EditingCell {...props} />;\n }\n\n return <DisplayCell {...props} />;\n}\n"],"names":["Cell","props","column","row","table","isHovered","isHoveredRow","useRowContext","rows","getRowModel","tableMeta","options","meta","columnMeta","columnDef","currentRowIndex","currentRow","isCurrentRow","undefined","_rows$currentRowIndex","id","editing","isEditing","control","hoverState","isPaused","React","EditingCell","DisplayCell"],"mappings":";;;;;SAUgBA,IAAIA,CAAkBC,KAAuB;;EACzD,MAAM;IAAEC,MAAM;IAAEC,GAAG;IAAEC;GAAO,GAAGH,KAAK;EACpC,MAAM;IAAEI,SAAS,EAAEC;GAAc,GAAGC,aAAa,EAAE;EACnD,MAAMC,IAAI,GAAGJ,KAAK,CAACK,WAAW,EAAE,CAACD,IAAI;EACrC,MAAME,SAAS,GAAGN,KAAK,CAACO,OAAO,CAACC,IAA0B;EAC1D,MAAMC,UAAU,GAAGX,MAAM,CAACY,SAAS,CAACF,IAAkC;EAEtE,MAAMG,eAAe,GAAGL,SAAS,CAACM,UAAU,CAACD,eAAe;EAC5D,MAAME,YAAY,GACdF,eAAe,KAAKG,SAAS,IAAI,EAAAC,qBAAA,GAAAX,IAAI,CAACO,eAAe,CAAC,cAAAI,qBAAA,uBAArBA,qBAAA,CAAuBC,EAAE,MAAKjB,GAAG,CAACiB,EAAE;EAEzE,IAAIV,SAAS,CAACW,OAAO,CAACC,SAAS,IAAIT,UAAU,CAACU,OAAO,KAAKN,YAAY,IAAKX,YAAY,IAAI,CAACI,SAAS,CAACc,UAAU,CAACC,QAAS,CAAC,EAAE;IACzH,oBAAOC,6BAACC,WAAW,oBAAK1B,KAAK,EAAI;;EAGrC,oBAAOyB,6BAACE,WAAW,oBAAK3B,KAAK,EAAI;AACrC;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/EditingCell.js CHANGED Viewed

@@ -20,7 +20,7 @@ function EditingCell(props) {
   }));
 }
 const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditingCell(props) {
-  var _tableMeta$editing$ge, _tableMeta$editing$ro, _rows$tableMeta$curre, _column$columnDef$met;
+  var _tableMeta$editing$ge, _tableMeta$editing$ro, _rows$currentRowIndex, _column$columnDef$met;
   const {
     cell,
     column,
@@ -72,7 +72,8 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
   // row move indicator
   const moveReason = (_tableMeta$editing$ro = tableMeta.editing.rowMoveReason[cell.column.id]) !== null && _tableMeta$editing$ro !== void 0 ? _tableMeta$editing$ro : null;
   const rows = table.getRowModel().rows;
-  const isCurrentRow = ((_rows$tableMeta$curre = rows[tableMeta.currentRow.currentRowIndex]) === null || _rows$tableMeta$curre === void 0 ? void 0 : _rows$tableMeta$curre.id) === row.id;
+  const currentRowIndex = tableMeta.currentRow.currentRowIndex;
+  const isCurrentRow = currentRowIndex !== undefined && ((_rows$currentRowIndex = rows[currentRowIndex]) === null || _rows$currentRowIndex === void 0 ? void 0 : _rows$currentRowIndex.id) === row.id;
   const mountNode = React__default.useMemo(() => {
     if (moveReason) {
       var _cellRef$current2, _cellRef$current2$par;

package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/EditingCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EditingCell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/EditingCell.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport _ from 'lodash';\nimport { TableMeta, CellContext, ColumnMeta, Cell as RTCell, Table as RTTable } from '@tanstack/react-table';\nimport { Indicator, IndicatorReason } from './Indicator';\nimport { columnFilterFn, globalFilterFn } from '../../../util/filtering';\nimport { Table3FilterValue } from '../../../types';\nimport { hasChanged, willRowMoveAfterSorting } from '../../../util/editing';\nimport { getCurrentRowCellElement } from '../../../util/columns';\nimport { EDITING_ACTIONS_WIDTH } from '../internal/EditingActions';\nimport { EditingControl } from './EditingControl';\nimport { useRowContext } from '../../rows/RowContext';\n\nexport type EditingCellProps<TType = unknown> = CellContext<TType, unknown> & {\n children?: string \| JSX.Element;\n};\n\nexport function EditingCell<TType = unknown>(props: EditingCellProps<TType>) {\n const { isHovered } = useRowContext();\n // Need to explicitly pass tableMeta, because just passing the table object will not trigger editing change since table object is not mutatable.\n const tableMeta = props.table.options.meta as TableMeta<TType>;\n return <MemoedEditingCell<TType> {...props} isHovered={isHovered} tableMeta={tableMeta} />;\n}\n\n// Memoization\nexport type MemoedEditingCellProps<TType = unknown> = EditingCellProps<TType> & {\n isHovered: boolean;\n tableMeta: TableMeta<TType>;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n const { cell, column, index, getValue, table, tableRef, row, isHovered, tableMeta } = props;\n const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n\n const cellRef = React.useRef<HTMLDivElement>(null);\n const controlRef = React.useRef<HTMLElement>(null);\n\n const handleChange = (value: unknown) => tableMeta.editing.setCellValue(cell, value);\n const value = tableMeta.editing.getCellValue(cell) ?? getValue();\n\n const handleFocus = event => {\n // Check if cell is hidden behind pinned columns or edititng actions, and scroll to it.\n const frozenColumnIndex = tableMeta.columnFreezing.frozenColumnIndex;\n const tableElement = tableRef.current;\n\n if (tableElement && frozenColumnIndex !== undefined && index > frozenColumnIndex) {\n const lastFrozenColumnElement = getCurrentRowCellElement(frozenColumnIndex, tableElement);\n const cellRect = cellRef.current?.getBoundingClientRect();\n const lastFrozenRect = lastFrozenColumnElement?.getBoundingClientRect();\n const tableRect = tableElement.getBoundingClientRect();\n\n // Check for pinned columns overlap\n if (cellRect && lastFrozenRect && cellRect.left < lastFrozenRect.left + lastFrozenRect.width) {\n const pinnedColumnsWidth = lastFrozenRect.left + lastFrozenRect.width;\n tableElement.scrollTo(cellRect.left - pinnedColumnsWidth, tableElement.scrollTop);\n // Check for editing actions overlap\n } else if (cellRect && tableRect && cellRect.right > tableRect.right - EDITING_ACTIONS_WIDTH) {\n const spaceBetweenCellAndEditingActions = 10;\n tableElement.scrollTo(\n // Need to take into account if table has been already scrolled.\n tableElement.scrollLeft + EDITING_ACTIONS_WIDTH + spaceBetweenCellAndEditingActions,\n tableElement.scrollTop\n );\n }\n }\n\n if (event.target?.select) {\n requestAnimationFrame(() => {\n event.target.select();\n });\n }\n };\n\n const handleBlur = () => {\n tableMeta.editing.setDetailModeEditing(false);\n };\n\n // row move indicator\n const moveReason = tableMeta.editing.rowMoveReason[cell.column.id] ?? null;\n const rows = table.getRowModel().rows;\n const isCurrentRow = rows[tableMeta.currentRow.currentRowIndex]?.id === row.id;\n const mountNode = React.useMemo(() => {\n if (moveReason) {\n return cellRef.current?.parentElement?.firstChild as Element \| null;\n }\n return null;\n }, [moveReason, cellRef]);\n\n const removeMoveReason = () => {\n tableMeta.editing.removeRowMoveReason(cell.column.id);\n };\n\n React.useEffect(() => {\n // To avoid reseting move reason on another row hover,\n // we need to check for changes only if value got changed in the current row.\n if (!isCurrentRow) {\n return;\n }\n\n if (hasChanged(getValue(), value)) {\n const moveReason = getRowMoveReason(table, row.index, row.original, cell, value);\n tableMeta.editing.setRowMoveReason({ [cell.column.id]: moveReason });\n } else {\n removeMoveReason();\n }\n return removeMoveReason;\n }, [value]);\n\n const controlRenderer = column.columnDef.meta?.control;\n\n const className = cn(\n '!px-[0.4375rem] py-[calc(var(--table3-row-padding)_-_0.06rem)]',\n {\n relative: (isCurrentRow \|\| isHovered) && controlRenderer === 'textarea',\n // Need to set higher z-index, so that the current row textarea (in expanded state, when positioned absolute) overlaps rows below,\n // but at the same time it should not overlap the table headers which has z-10.\n 'z-[9]': isCurrentRow && controlRenderer === 'textarea',\n },\n\n // component overrides - grayscale for editing hover\n '[[role=\"row\"][data-current=\"false\"]:hover_&>*]:!grayscale [[role=\"row\"][data-current=\"false\"]:hover_&_.bg-white]:!bg-grey-100',\n // we alias to any because className conflicts with the Table2 definition,\n // when Table2 is gone, remove this as any\n typeof columnMeta.className === 'function' ? (columnMeta.className as any)(row.original) : columnMeta.className\n );\n\n return (\n <>\n {moveReason !== null && mountNode && (\n <Indicator\n reason={moveReason}\n columnName={String(cell.column.columnDef.header)}\n mountNode={mountNode}\n validationErrors={[]}\n />\n )}\n <div className={className} data-align={columnMeta.align} data-column-index={index} role=\"cell\" ref={cellRef}>\n <EditingControl\n align={columnMeta.align}\n column={cell.column}\n data={cell.row.original}\n initialValue={getValue()}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onChange={handleChange}\n ref={controlRef}\n table={table}\n tableRef={tableRef}\n value={value}\n cell={cell}\n isCurrentRow={isCurrentRow}\n />\n </div>\n </>\n );\n}) as <TType = unknown>(props: MemoedEditingCellProps<TType>) => JSX.Element;\n\nfunction getRowMoveReason<TType>(\n table: RTTable<any>,\n rowIndex: number,\n rowValues: TType,\n cell: RTCell<any, unknown>,\n newValue: any\n) {\n let rowMoveReason: IndicatorReason \| null = null;\n const { globalFilter } = table.getState();\n\n const isFilteredByGlobalFilter = Object.values<unknown>({ ...rowValues, [cell.id]: newValue }).some(cellValue =>\n // Global filter can be undefined when there is no text being searched so we pass an empty string to\n // globalFilterFn as query in that case.\n globalFilterFn(String(cellValue), globalFilter ? String(globalFilter) : '')\n );\n\n if (!isFilteredByGlobalFilter) {\n rowMoveReason = IndicatorReason.SEARCH;\n } else if (cell.column.getIsFiltered() && !columnFilterFn(newValue, cell.column.getFilterValue() as Table3FilterValue)) {\n rowMoveReason = IndicatorReason.FILTER;\n } else if (\n !rowMoveReason &&\n cell.column.getIsSorted() &&\n willRowMoveAfterSorting(\n newValue,\n cell,\n rowIndex,\n table.getRowModel().rows,\n !!table.getState().sorting.find(s => s.id === cell.column.id)?.desc\n )\n ) {\n rowMoveReason = IndicatorReason.SORTING;\n }\n\n return rowMoveReason;\n}\n"],"names":["EditingCell","props","isHovered","useRowContext","tableMeta","table","options","meta","React","MemoedEditingCell","memo","cell","column","index","getValue","tableRef","row","columnMeta","columnDef","cellRef","useRef","controlRef","handleChange","value","editing","setCellValue","_tableMeta$editing$ge","getCellValue","handleFocus","event","frozenColumnIndex","columnFreezing","tableElement","current","undefined","_cellRef$current","lastFrozenColumnElement","getCurrentRowCellElement","cellRect","getBoundingClientRect","lastFrozenRect","tableRect","left","width","pinnedColumnsWidth","scrollTo","scrollTop","right","EDITING_ACTIONS_WIDTH","spaceBetweenCellAndEditingActions","scrollLeft","_event$target","target","select","requestAnimationFrame","handleBlur","setDetailModeEditing","moveReason","_tableMeta$editing$ro","rowMoveReason","id","rows","getRowModel","isCurrentRow","_rows$tableMeta$curre","currentRow","currentRowIndex","mountNode","useMemo","_cellRef$current2","_cellRef$current2$par","parentElement","firstChild","removeMoveReason","removeRowMoveReason","useEffect","hasChanged","getRowMoveReason","original","setRowMoveReason","controlRenderer","_column$columnDef$met","control","className","cn","relative","Indicator","reason","columnName","String","header","validationErrors","align","role","ref","EditingControl","data","initialValue","onBlur","onFocus","onChange","rowIndex","rowValues","newValue","globalFilter","getState","isFilteredByGlobalFilter","Object","values","some","cellValue","globalFilterFn","IndicatorReason","SEARCH","getIsFiltered","columnFilterFn","getFilterValue","FILTER","getIsSorted","willRowMoveAfterSorting","_table$getState$sorti","sorting","find","s","desc","SORTING"],"mappings":"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"}
1	+ {"version":3,"file":"EditingCell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/EditingCell.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport _ from 'lodash';\nimport { TableMeta, CellContext, ColumnMeta, Cell as RTCell, Table as RTTable } from '@tanstack/react-table';\nimport { Indicator, IndicatorReason } from './Indicator';\nimport { columnFilterFn, globalFilterFn } from '../../../util/filtering';\nimport { Table3FilterValue } from '../../../types';\nimport { hasChanged, willRowMoveAfterSorting } from '../../../util/editing';\nimport { getCurrentRowCellElement } from '../../../util/columns';\nimport { EDITING_ACTIONS_WIDTH } from '../internal/EditingActions';\nimport { EditingControl } from './EditingControl';\nimport { useRowContext } from '../../rows/RowContext';\n\nexport type EditingCellProps<TType = unknown> = CellContext<TType, unknown> & {\n children?: string \| JSX.Element;\n};\n\nexport function EditingCell<TType = unknown>(props: EditingCellProps<TType>) {\n const { isHovered } = useRowContext();\n // Need to explicitly pass tableMeta, because just passing the table object will not trigger editing change since table object is not mutatable.\n const tableMeta = props.table.options.meta as TableMeta<TType>;\n return <MemoedEditingCell<TType> {...props} isHovered={isHovered} tableMeta={tableMeta} />;\n}\n\n// Memoization\nexport type MemoedEditingCellProps<TType = unknown> = EditingCellProps<TType> & {\n isHovered: boolean;\n tableMeta: TableMeta<TType>;\n};\n\nconst MemoedEditingCell = React.memo(function MemoedEditingCell<TType = unknown>(props: MemoedEditingCellProps<TType>) {\n const { cell, column, index, getValue, table, tableRef, row, isHovered, tableMeta } = props;\n const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n\n const cellRef = React.useRef<HTMLDivElement>(null);\n const controlRef = React.useRef<HTMLElement>(null);\n\n const handleChange = (value: unknown) => tableMeta.editing.setCellValue(cell, value);\n const value = tableMeta.editing.getCellValue(cell) ?? getValue();\n\n const handleFocus = event => {\n // Check if cell is hidden behind pinned columns or edititng actions, and scroll to it.\n const frozenColumnIndex = tableMeta.columnFreezing.frozenColumnIndex;\n const tableElement = tableRef.current;\n\n if (tableElement && frozenColumnIndex !== undefined && index > frozenColumnIndex) {\n const lastFrozenColumnElement = getCurrentRowCellElement(frozenColumnIndex, tableElement);\n const cellRect = cellRef.current?.getBoundingClientRect();\n const lastFrozenRect = lastFrozenColumnElement?.getBoundingClientRect();\n const tableRect = tableElement.getBoundingClientRect();\n\n // Check for pinned columns overlap\n if (cellRect && lastFrozenRect && cellRect.left < lastFrozenRect.left + lastFrozenRect.width) {\n const pinnedColumnsWidth = lastFrozenRect.left + lastFrozenRect.width;\n tableElement.scrollTo(cellRect.left - pinnedColumnsWidth, tableElement.scrollTop);\n // Check for editing actions overlap\n } else if (cellRect && tableRect && cellRect.right > tableRect.right - EDITING_ACTIONS_WIDTH) {\n const spaceBetweenCellAndEditingActions = 10;\n tableElement.scrollTo(\n // Need to take into account if table has been already scrolled.\n tableElement.scrollLeft + EDITING_ACTIONS_WIDTH + spaceBetweenCellAndEditingActions,\n tableElement.scrollTop\n );\n }\n }\n\n if (event.target?.select) {\n requestAnimationFrame(() => {\n event.target.select();\n });\n }\n };\n\n const handleBlur = () => {\n tableMeta.editing.setDetailModeEditing(false);\n };\n\n // row move indicator\n const moveReason = tableMeta.editing.rowMoveReason[cell.column.id] ?? null;\n const rows = table.getRowModel().rows;\n const currentRowIndex = tableMeta.currentRow.currentRowIndex;\n const isCurrentRow =\n currentRowIndex !== undefined && rows[currentRowIndex]?.id === row.id;\n const mountNode = React.useMemo(() => {\n if (moveReason) {\n return cellRef.current?.parentElement?.firstChild as Element \| null;\n }\n return null;\n }, [moveReason, cellRef]);\n\n const removeMoveReason = () => {\n tableMeta.editing.removeRowMoveReason(cell.column.id);\n };\n\n React.useEffect(() => {\n // To avoid reseting move reason on another row hover,\n // we need to check for changes only if value got changed in the current row.\n if (!isCurrentRow) {\n return;\n }\n\n if (hasChanged(getValue(), value)) {\n const moveReason = getRowMoveReason(table, row.index, row.original, cell, value);\n tableMeta.editing.setRowMoveReason({ [cell.column.id]: moveReason });\n } else {\n removeMoveReason();\n }\n return removeMoveReason;\n }, [value]);\n\n const controlRenderer = column.columnDef.meta?.control;\n\n const className = cn(\n '!px-[0.4375rem] py-[calc(var(--table3-row-padding)_-_0.06rem)]',\n {\n relative: (isCurrentRow \|\| isHovered) && controlRenderer === 'textarea',\n // Need to set higher z-index, so that the current row textarea (in expanded state, when positioned absolute) overlaps rows below,\n // but at the same time it should not overlap the table headers which has z-10.\n 'z-[9]': isCurrentRow && controlRenderer === 'textarea',\n },\n\n // component overrides - grayscale for editing hover\n '[[role=\"row\"][data-current=\"false\"]:hover_&>*]:!grayscale [[role=\"row\"][data-current=\"false\"]:hover_&_.bg-white]:!bg-grey-100',\n // we alias to any because className conflicts with the Table2 definition,\n // when Table2 is gone, remove this as any\n typeof columnMeta.className === 'function' ? (columnMeta.className as any)(row.original) : columnMeta.className\n );\n\n return (\n <>\n {moveReason !== null && mountNode && (\n <Indicator\n reason={moveReason}\n columnName={String(cell.column.columnDef.header)}\n mountNode={mountNode}\n validationErrors={[]}\n />\n )}\n <div className={className} data-align={columnMeta.align} data-column-index={index} role=\"cell\" ref={cellRef}>\n <EditingControl\n align={columnMeta.align}\n column={cell.column}\n data={cell.row.original}\n initialValue={getValue()}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onChange={handleChange}\n ref={controlRef}\n table={table}\n tableRef={tableRef}\n value={value}\n cell={cell}\n isCurrentRow={isCurrentRow}\n />\n </div>\n </>\n );\n}) as <TType = unknown>(props: MemoedEditingCellProps<TType>) => JSX.Element;\n\nfunction getRowMoveReason<TType>(\n table: RTTable<any>,\n rowIndex: number,\n rowValues: TType,\n cell: RTCell<any, unknown>,\n newValue: any\n) {\n let rowMoveReason: IndicatorReason \| null = null;\n const { globalFilter } = table.getState();\n\n const isFilteredByGlobalFilter = Object.values<unknown>({ ...rowValues, [cell.id]: newValue }).some(cellValue =>\n // Global filter can be undefined when there is no text being searched so we pass an empty string to\n // globalFilterFn as query in that case.\n globalFilterFn(String(cellValue), globalFilter ? String(globalFilter) : '')\n );\n\n if (!isFilteredByGlobalFilter) {\n rowMoveReason = IndicatorReason.SEARCH;\n } else if (cell.column.getIsFiltered() && !columnFilterFn(newValue, cell.column.getFilterValue() as Table3FilterValue)) {\n rowMoveReason = IndicatorReason.FILTER;\n } else if (\n !rowMoveReason &&\n cell.column.getIsSorted() &&\n willRowMoveAfterSorting(\n newValue,\n cell,\n rowIndex,\n table.getRowModel().rows,\n !!table.getState().sorting.find(s => s.id === cell.column.id)?.desc\n )\n ) {\n rowMoveReason = IndicatorReason.SORTING;\n }\n\n return rowMoveReason;\n}\n"],"names":["EditingCell","props","isHovered","useRowContext","tableMeta","table","options","meta","React","MemoedEditingCell","memo","cell","column","index","getValue","tableRef","row","columnMeta","columnDef","cellRef","useRef","controlRef","handleChange","value","editing","setCellValue","_tableMeta$editing$ge","getCellValue","handleFocus","event","frozenColumnIndex","columnFreezing","tableElement","current","undefined","_cellRef$current","lastFrozenColumnElement","getCurrentRowCellElement","cellRect","getBoundingClientRect","lastFrozenRect","tableRect","left","width","pinnedColumnsWidth","scrollTo","scrollTop","right","EDITING_ACTIONS_WIDTH","spaceBetweenCellAndEditingActions","scrollLeft","_event$target","target","select","requestAnimationFrame","handleBlur","setDetailModeEditing","moveReason","_tableMeta$editing$ro","rowMoveReason","id","rows","getRowModel","currentRowIndex","currentRow","isCurrentRow","_rows$currentRowIndex","mountNode","useMemo","_cellRef$current2","_cellRef$current2$par","parentElement","firstChild","removeMoveReason","removeRowMoveReason","useEffect","hasChanged","getRowMoveReason","original","setRowMoveReason","controlRenderer","_column$columnDef$met","control","className","cn","relative","Indicator","reason","columnName","String","header","validationErrors","align","role","ref","EditingControl","data","initialValue","onBlur","onFocus","onChange","rowIndex","rowValues","newValue","globalFilter","getState","isFilteredByGlobalFilter","Object","values","some","cellValue","globalFilterFn","IndicatorReason","SEARCH","getIsFiltered","columnFilterFn","getFilterValue","FILTER","getIsSorted","willRowMoveAfterSorting","_table$getState$sorti","sorting","find","s","desc","SORTING"],"mappings":";;;;;;;;;;SAiBgBA,WAAWA,CAAkBC,KAA8B;EACvE,MAAM;IAAEC;GAAW,GAAGC,aAAa,EAAE;;EAErC,MAAMC,SAAS,GAAGH,KAAK,CAACI,KAAK,CAACC,OAAO,CAACC,IAAwB;EAC9D,oBAAOC,6BAACC,iBAAiB,oBAAYR,KAAK;IAAEC,SAAS,EAAEA,SAAS;IAAEE,SAAS,EAAEA;KAAa;AAC9F;AAQA,MAAMK,iBAAiB,gBAAGD,cAAK,CAACE,IAAI,CAAC,SAASD,iBAAiBA,CAAkBR,KAAoC;;EACjH,MAAM;IAAEU,IAAI;IAAEC,MAAM;IAAEC,KAAK;IAAEC,QAAQ;IAAET,KAAK;IAAEU,QAAQ;IAAEC,GAAG;IAAEd,SAAS;IAAEE;GAAW,GAAGH,KAAK;EAC3F,MAAMgB,UAAU,GAAGL,MAAM,CAACM,SAAS,CAACX,IAAkC;EAEtE,MAAMY,OAAO,GAAGX,cAAK,CAACY,MAAM,CAAiB,IAAI,CAAC;EAClD,MAAMC,UAAU,GAAGb,cAAK,CAACY,MAAM,CAAc,IAAI,CAAC;EAElD,MAAME,YAAY,GAAIC,KAAc,IAAKnB,SAAS,CAACoB,OAAO,CAACC,YAAY,CAACd,IAAI,EAAEY,KAAK,CAAC;EACpF,MAAMA,KAAK,IAAAG,qBAAA,GAAGtB,SAAS,CAACoB,OAAO,CAACG,YAAY,CAAChB,IAAI,CAAC,cAAAe,qBAAA,cAAAA,qBAAA,GAAIZ,QAAQ,EAAE;EAEhE,MAAMc,WAAW,GAAGC,KAAK;;;IAErB,MAAMC,iBAAiB,GAAG1B,SAAS,CAAC2B,cAAc,CAACD,iBAAiB;IACpE,MAAME,YAAY,GAAGjB,QAAQ,CAACkB,OAAO;IAErC,IAAID,YAAY,IAAIF,iBAAiB,KAAKI,SAAS,IAAIrB,KAAK,GAAGiB,iBAAiB,EAAE;MAAA,IAAAK,gBAAA;MAC9E,MAAMC,uBAAuB,GAAGC,wBAAwB,CAACP,iBAAiB,EAAEE,YAAY,CAAC;MACzF,MAAMM,QAAQ,IAAAH,gBAAA,GAAGhB,OAAO,CAACc,OAAO,cAAAE,gBAAA,uBAAfA,gBAAA,CAAiBI,qBAAqB,EAAE;MACzD,MAAMC,cAAc,GAAGJ,uBAAuB,aAAvBA,uBAAuB,uBAAvBA,uBAAuB,CAAEG,qBAAqB,EAAE;MACvE,MAAME,SAAS,GAAGT,YAAY,CAACO,qBAAqB,EAAE;;MAGtD,IAAID,QAAQ,IAAIE,cAAc,IAAIF,QAAQ,CAACI,IAAI,GAAGF,cAAc,CAACE,IAAI,GAAGF,cAAc,CAACG,KAAK,EAAE;QAC1F,MAAMC,kBAAkB,GAAGJ,cAAc,CAACE,IAAI,GAAGF,cAAc,CAACG,KAAK;QACrEX,YAAY,CAACa,QAAQ,CAACP,QAAQ,CAACI,IAAI,GAAGE,kBAAkB,EAAEZ,YAAY,CAACc,SAAS,CAAC;;OAEpF,MAAM,IAAIR,QAAQ,IAAIG,SAAS,IAAIH,QAAQ,CAACS,KAAK,GAAGN,SAAS,CAACM,KAAK,GAAGC,qBAAqB,EAAE;QAC1F,MAAMC,iCAAiC,GAAG,EAAE;QAC5CjB,YAAY,CAACa,QAAQ;;QAEjBb,YAAY,CAACkB,UAAU,GAAGF,qBAAqB,GAAGC,iCAAiC,EACnFjB,YAAY,CAACc,SAAS,CACzB;;;IAIT,KAAAK,aAAA,GAAItB,KAAK,CAACuB,MAAM,cAAAD,aAAA,eAAZA,aAAA,CAAcE,MAAM,EAAE;MACtBC,qBAAqB,CAAC;QAClBzB,KAAK,CAACuB,MAAM,CAACC,MAAM,EAAE;OACxB,CAAC;;GAET;EAED,MAAME,UAAU,GAAGA;IACfnD,SAAS,CAACoB,OAAO,CAACgC,oBAAoB,CAAC,KAAK,CAAC;GAChD;;EAGD,MAAMC,UAAU,IAAAC,qBAAA,GAAGtD,SAAS,CAACoB,OAAO,CAACmC,aAAa,CAAChD,IAAI,CAACC,MAAM,CAACgD,EAAE,CAAC,cAAAF,qBAAA,cAAAA,qBAAA,GAAI,IAAI;EAC1E,MAAMG,IAAI,GAAGxD,KAAK,CAACyD,WAAW,EAAE,CAACD,IAAI;EACrC,MAAME,eAAe,GAAG3D,SAAS,CAAC4D,UAAU,CAACD,eAAe;EAC5D,MAAME,YAAY,GACdF,eAAe,KAAK7B,SAAS,IAAI,EAAAgC,qBAAA,GAAAL,IAAI,CAACE,eAAe,CAAC,cAAAG,qBAAA,uBAArBA,qBAAA,CAAuBN,EAAE,MAAK5C,GAAG,CAAC4C,EAAE;EACzE,MAAMO,SAAS,GAAG3D,cAAK,CAAC4D,OAAO,CAAC;IAC5B,IAAIX,UAAU,EAAE;MAAA,IAAAY,iBAAA,EAAAC,qBAAA;MACZ,QAAAD,iBAAA,GAAOlD,OAAO,CAACc,OAAO,cAAAoC,iBAAA,wBAAAC,qBAAA,GAAfD,iBAAA,CAAiBE,aAAa,cAAAD,qBAAA,uBAA9BA,qBAAA,CAAgCE,UAA4B;;IAEvE,OAAO,IAAI;GACd,EAAE,CAACf,UAAU,EAAEtC,OAAO,CAAC,CAAC;EAEzB,MAAMsD,gBAAgB,GAAGA;IACrBrE,SAAS,CAACoB,OAAO,CAACkD,mBAAmB,CAAC/D,IAAI,CAACC,MAAM,CAACgD,EAAE,CAAC;GACxD;EAEDpD,cAAK,CAACmE,SAAS,CAAC;;;IAGZ,IAAI,CAACV,YAAY,EAAE;MACf;;IAGJ,IAAIW,UAAU,CAAC9D,QAAQ,EAAE,EAAES,KAAK,CAAC,EAAE;MAC/B,MAAMkC,UAAU,GAAGoB,gBAAgB,CAACxE,KAAK,EAAEW,GAAG,CAACH,KAAK,EAAEG,GAAG,CAAC8D,QAAQ,EAAEnE,IAAI,EAAEY,KAAK,CAAC;MAChFnB,SAAS,CAACoB,OAAO,CAACuD,gBAAgB,CAAC;QAAE,CAACpE,IAAI,CAACC,MAAM,CAACgD,EAAE,GAAGH;OAAY,CAAC;KACvE,MAAM;MACHgB,gBAAgB,EAAE;;IAEtB,OAAOA,gBAAgB;GAC1B,EAAE,CAAClD,KAAK,CAAC,CAAC;EAEX,MAAMyD,eAAe,IAAAC,qBAAA,GAAGrE,MAAM,CAACM,SAAS,CAACX,IAAI,cAAA0E,qBAAA,uBAArBA,qBAAA,CAAuBC,OAAO;EAEtD,MAAMC,SAAS,GAAGC,EAAE,CAChB,gEAAgE,EAChE;IACIC,QAAQ,EAAE,CAACpB,YAAY,IAAI/D,SAAS,KAAK8E,eAAe,KAAK,UAAU;;;IAGvE,OAAO,EAAEf,YAAY,IAAIe,eAAe,KAAK;GAChD;;EAGD,+HAA+H;;;EAG/H,OAAO/D,UAAU,CAACkE,SAAS,KAAK,UAAU,GAAIlE,UAAU,CAACkE,SAAiB,CAACnE,GAAG,CAAC8D,QAAQ,CAAC,GAAG7D,UAAU,CAACkE,SAAS,CAClH;EAED,oBACI3E,4DACKiD,UAAU,KAAK,IAAI,IAAIU,SAAS,iBAC7B3D,6BAAC8E,SAAS;IACNC,MAAM,EAAE9B,UAAU;IAClB+B,UAAU,EAAEC,MAAM,CAAC9E,IAAI,CAACC,MAAM,CAACM,SAAS,CAACwE,MAAM,CAAC;IAChDvB,SAAS,EAAEA,SAAS;IACpBwB,gBAAgB,EAAE;IAEzB,eACDnF;IAAK2E,SAAS,EAAEA,SAAS;kBAAclE,UAAU,CAAC2E,KAAK;yBAAqB/E,KAAK;IAAEgF,IAAI,EAAC,MAAM;IAACC,GAAG,EAAE3E;kBAChGX,6BAACuF,cAAc;IACXH,KAAK,EAAE3E,UAAU,CAAC2E,KAAK;IACvBhF,MAAM,EAAED,IAAI,CAACC,MAAM;IACnBoF,IAAI,EAAErF,IAAI,CAACK,GAAG,CAAC8D,QAAQ;IACvBmB,YAAY,EAAEnF,QAAQ,EAAE;IACxBoF,MAAM,EAAE3C,UAAU;IAClB4C,OAAO,EAAEvE,WAAW;IACpBwE,QAAQ,EAAE9E,YAAY;IACtBwE,GAAG,EAAEzE,UAAU;IACfhB,KAAK,EAAEA,KAAK;IACZU,QAAQ,EAAEA,QAAQ;IAClBQ,KAAK,EAAEA,KAAK;IACZZ,IAAI,EAAEA,IAAI;IACVsD,YAAY,EAAEA;IAChB,CACA,CACP;AAEX,CAAC,CAA2E;AAE5E,SAASY,gBAAgBA,CACrBxE,KAAmB,EACnBgG,QAAgB,EAChBC,SAAgB,EAChB3F,IAA0B,EAC1B4F,QAAa;;EAEb,IAAI5C,aAAa,GAA2B,IAAI;EAChD,MAAM;IAAE6C;GAAc,GAAGnG,KAAK,CAACoG,QAAQ,EAAE;EAEzC,MAAMC,wBAAwB,GAAGC,MAAM,CAACC,MAAM,CAAU;IAAE,GAAGN,SAAS;IAAE,CAAC3F,IAAI,CAACiD,EAAE,GAAG2C;GAAU,CAAC,CAACM,IAAI,CAACC,SAAS;;;EAGzGC,cAAc,CAACtB,MAAM,CAACqB,SAAS,CAAC,EAAEN,YAAY,GAAGf,MAAM,CAACe,YAAY,CAAC,GAAG,EAAE,CAAC,CAC9E;EAED,IAAI,CAACE,wBAAwB,EAAE;IAC3B/C,aAAa,GAAGqD,eAAe,CAACC,MAAM;GACzC,MAAM,IAAItG,IAAI,CAACC,MAAM,CAACsG,aAAa,EAAE,IAAI,CAACC,cAAc,CAACZ,QAAQ,EAAE5F,IAAI,CAACC,MAAM,CAACwG,cAAc,EAAuB,CAAC,EAAE;IACpHzD,aAAa,GAAGqD,eAAe,CAACK,MAAM;GACzC,MAAM,IACH,CAAC1D,aAAa,IACdhD,IAAI,CAACC,MAAM,CAAC0G,WAAW,EAAE,IACzBC,uBAAuB,CACnBhB,QAAQ,EACR5F,IAAI,EACJ0F,QAAQ,EACRhG,KAAK,CAACyD,WAAW,EAAE,CAACD,IAAI,EACxB,CAAC,GAAA2D,qBAAA,GAACnH,KAAK,CAACoG,QAAQ,EAAE,CAACgB,OAAO,CAACC,IAAI,CAACC,CAAC,IAAIA,CAAC,CAAC/D,EAAE,KAAKjD,IAAI,CAACC,MAAM,CAACgD,EAAE,CAAC,cAAA4D,qBAAA,eAA3DA,qBAAA,CAA6DI,IAAI,EACtE,EACH;IACEjE,aAAa,GAAGqD,eAAe,CAACa,OAAO;;EAG3C,OAAOlE,aAAa;AACxB;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/styles.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import cn from 'classnames';
 const MIN_COLUMN_SIZE = 80; // accounts for padding and sort controls
+const PRINT_MIN_COLUMN_SIZE = 20; // while printing, it accounts for minimum width each column can take
 const getCellAlignmentClasses = (alignment = 'left') => {
   return cn({
     'justify-start text-left': alignment === 'left',
@@ -13,5 +14,5 @@ const getInputAppearanceClassnames = () => {
   return cn('[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none');
 };
-export { MIN_COLUMN_SIZE, getCellAlignmentClasses, getInputAppearanceClassnames };
+export { MIN_COLUMN_SIZE, PRINT_MIN_COLUMN_SIZE, getCellAlignmentClasses, getInputAppearanceClassnames };
 //# sourceMappingURL=styles.js.map

package/dist/esm/packages/taco/src/components/Table3/components/columns/styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.js","sources":["../../../../../../../../../src/components/Table3/components/columns/styles.ts"],"sourcesContent":["import cn from 'classnames';\nimport { Table3ColumnAlignment } from '../../types';\n\nexport const MIN_COLUMN_SIZE = 80; // accounts for padding and sort controls\n\nexport const getCellAlignmentClasses = (alignment: Table3ColumnAlignment = 'left') => {\n return cn({\n 'justify-start text-left': alignment === 'left',\n 'justify-end text-right': alignment === 'right',\n 'justify-center text-center': alignment === 'center',\n });\n};\n\n// Hiding input number spin buttons\nexport const getInputAppearanceClassnames = () => {\n return cn(\n '[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none'\n );\n};\n"],"names":["MIN_COLUMN_SIZE","getCellAlignmentClasses","alignment","cn","getInputAppearanceClassnames"],"mappings":";;MAGaA,eAAe,GAAG,GAAG;~~MAErBC~~,uBAAuB,GAAGA,CAACC,YAAmC,MAAM;EAC7E,OAAOC,EAAE,CAAC;IACN,yBAAyB,EAAED,SAAS,KAAK,MAAM;IAC/C,wBAAwB,EAAEA,SAAS,KAAK,OAAO;IAC/C,4BAA4B,EAAEA,SAAS,KAAK;GAC/C,CAAC;AACN;AAEA;MACaE,4BAA4B,GAAGA;EACxC,OAAOD,EAAE,CACL,sHAAsH,CACzH;AACL;;;;"}
1	+ {"version":3,"file":"styles.js","sources":["../../../../../../../../../src/components/Table3/components/columns/styles.ts"],"sourcesContent":["import cn from 'classnames';\nimport { Table3ColumnAlignment } from '../../types';\n\nexport const MIN_COLUMN_SIZE = 80; // accounts for padding and sort controls\nexport const PRINT_MIN_COLUMN_SIZE = 20; // while printing, it accounts for minimum width each column can take\n\nexport const getCellAlignmentClasses = (alignment: Table3ColumnAlignment = 'left') => {\n return cn({\n 'justify-start text-left': alignment === 'left',\n 'justify-end text-right': alignment === 'right',\n 'justify-center text-center': alignment === 'center',\n });\n};\n\n// Hiding input number spin buttons\nexport const getInputAppearanceClassnames = () => {\n return cn(\n '[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none'\n );\n};\n"],"names":["MIN_COLUMN_SIZE","PRINT_MIN_COLUMN_SIZE","getCellAlignmentClasses","alignment","cn","getInputAppearanceClassnames"],"mappings":";;MAGaA,eAAe,GAAG,GAAG;MACrBC,qBAAqB,GAAG,GAAG;MAE3BC,uBAAuB,GAAGA,CAACC,YAAmC,MAAM;EAC7E,OAAOC,EAAE,CAAC;IACN,yBAAyB,EAAED,SAAS,KAAK,MAAM;IAC/C,wBAAwB,EAAEA,SAAS,KAAK,OAAO;IAC/C,4BAA4B,EAAEA,SAAS,KAAK;GAC/C,CAAC;AACN;AAEA;MACaE,4BAA4B,GAAGA;EACxC,OAAOD,EAAE,CACL,sHAAsH,CACzH;AACL;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/ColumnSettings.js CHANGED Viewed

@@ -2,7 +2,6 @@ import React__default from 'react';
 import cn from 'classnames';
 import { Icon } from '../../../Icon/Icon.js';
 import { useLocalization } from '../../../Provider/Localization.js';
-import { Button } from '../../../Button/Button.js';
 import { Checkbox } from '../../../Checkbox/Checkbox.js';
 import { Input } from '../../../Input/Input.js';
 import { Popover } from '../../../Popover/Popover.js';
@@ -43,9 +42,11 @@ const Column = /*#__PURE__*/React__default.forwardRef(function Column(props, ref
     onChange: () => column.toggleVisibility(!isVisible)
   }) : null);
 });
-function ColumnSettings(props) {
+function ColumnSettingsPopover(props) {
   const {
-    table
+    table,
+    trigger,
+    ...popoverProps
   } = props;
   const {
     texts
@@ -67,39 +68,37 @@ function ColumnSettings(props) {
     }
     table.setColumnOrder(currentOrder => ensureOrdering(allColumns, arrayMove(currentOrder, currentOrder.findIndex(c => c === activeId), currentOrder.findIndex(c => c === overId))));
   };
-  return /*#__PURE__*/React__default.createElement(Button, {
-    popover: popoverProps => /*#__PURE__*/React__default.createElement(Popover, Object.assign({}, popoverProps), /*#__PURE__*/React__default.createElement(Popover.Content, null, /*#__PURE__*/React__default.createElement("div", {
-      className: "flex w-60 flex-col gap-2"
-    }, table.options.enableHiding ? /*#__PURE__*/React__default.createElement(Input, {
-      onChange: event => setQuery(event.target.value),
-      placeholder: texts.table3.columnSettings.search,
-      value: query
-    }) : null, tableMeta.columnOrdering.isEnabled && columns.length && !(query !== null && query !== void 0 && query.length) ? /*#__PURE__*/React__default.createElement(Container, {
-      reorder: handleReorder
-    }, /*#__PURE__*/React__default.createElement(List, {
-      id: "columns",
-      className: listClassName
-    }, columns.map(column => {
-      var _column$columnDef$met4, _column$columnDef$met5;
-      return /*#__PURE__*/React__default.createElement(Item, {
-        key: column.id,
-        id: column.id,
-        disabled: !((_column$columnDef$met4 = column.columnDef.meta) !== null && _column$columnDef$met4 !== void 0 && _column$columnDef$met4.enableOrdering),
-        asChild: true
-      }, /*#__PURE__*/React__default.createElement(Column, {
-        column: column,
-        draggable: (_column$columnDef$met5 = column.columnDef.meta) === null || _column$columnDef$met5 === void 0 ? void 0 : _column$columnDef$met5.enableOrdering
-      }));
-    }))) : /*#__PURE__*/React__default.createElement("div", {
-      className: listClassName
-    }, columns.length ? columns.map(column => /*#__PURE__*/React__default.createElement(Column, {
+  return /*#__PURE__*/React__default.createElement(Popover, Object.assign({}, popoverProps, {
+    anchor: trigger
+  }), /*#__PURE__*/React__default.createElement(Popover.Content, null, /*#__PURE__*/React__default.createElement("div", {
+    className: "flex w-60 flex-col gap-2"
+  }, table.options.enableHiding ? /*#__PURE__*/React__default.createElement(Input, {
+    onChange: event => setQuery(event.target.value),
+    placeholder: texts.table3.columnSettings.search,
+    value: query
+  }) : null, tableMeta.columnOrdering.isEnabled && columns.length && !(query !== null && query !== void 0 && query.length) ? /*#__PURE__*/React__default.createElement(Container, {
+    reorder: handleReorder
+  }, /*#__PURE__*/React__default.createElement(List, {
+    id: "columns",
+    className: listClassName
+  }, columns.map(column => {
+    var _column$columnDef$met4, _column$columnDef$met5;
+    return /*#__PURE__*/React__default.createElement(Item, {
+      key: column.id,
+      id: column.id,
+      disabled: !((_column$columnDef$met4 = column.columnDef.meta) !== null && _column$columnDef$met4 !== void 0 && _column$columnDef$met4.enableOrdering),
+      asChild: true
+    }, /*#__PURE__*/React__default.createElement(Column, {
       column: column,
-      key: column.id
-    })) : texts.table3.columnSettings.noResults))))
-  }, /*#__PURE__*/React__default.createElement(Icon, {
-    name: "columns"
-  }), texts.table3.columnSettings.button);
+      draggable: (_column$columnDef$met5 = column.columnDef.meta) === null || _column$columnDef$met5 === void 0 ? void 0 : _column$columnDef$met5.enableOrdering
+    }));
+  }))) : /*#__PURE__*/React__default.createElement("div", {
+    className: listClassName
+  }, columns.length ? columns.map(column => /*#__PURE__*/React__default.createElement(Column, {
+    column: column,
+    key: column.id
+  })) : texts.table3.columnSettings.noResults))));
 }
-export { ColumnSettings };
+export { ColumnSettingsPopover };
 //# sourceMappingURL=ColumnSettings.js.map