npm - @economic/taco - Versions diffs - 2.45.0-alpha.1 → 2.45.0-alpha.10 - Mend

@economic/taco 2.45.0-alpha.1 → 2.45.0-alpha.10

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

package/dist/esm/packages/taco/src/primitives/Collection/components/Root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Root.js","sources":["../../../../../../../../src/primitives/Collection/components/Root.tsx"],"sourcesContent":["import React from 'react';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { isAriaDirectionKey } from '../../../utils/aria';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\n\n/* This component provides a keyboard navigable collection primitive for use in lists\n * It is unlikely you need to edit this component\n */\n\nexport type CollectionProps = React.HTMLAttributes<HTMLDivElement> & {\n querySelector: string;\n};\n\nexport type CollectionRef = HTMLDivElement & {\n setActiveIndexByElement: (option: HTMLDivElement) => void;\n};\n\nconst getOptionsFromCollection = (collection: HTMLDivElement, selector: string): NodeListOf<Element> =>\n collection.querySelectorAll(selector);\n\n// we use javascript to set attributes (rather than cloning children and adding them)\n// so that we can support nesting (e.g. groups) - child elements that aren't options.\n// without doing this we would have to unwrap and flatten all groups\nexport const Root = React.forwardRef<CollectionRef, CollectionProps>(function CollectionRoot(props, ref) {\n const { querySelector, tabIndex = 0, ...otherProps } = props;\n const internalRef = useMergedRef<CollectionRef>(ref);\n const [activeIndex, setActiveIndex] = React.useState<number \| undefined>();\n\n const setActiveOption = (index: number, collection: HTMLDivElement, option: Element) => {\n collection.querySelector(`[aria-current]`)?.removeAttribute('aria-current');\n option.setAttribute('aria-current', 'true');\n option.scrollIntoView({ block: 'nearest' });\n setActiveIndex(index);\n };\n\n const setActiveIndexByElement = React.useCallback(\n (option: HTMLDivElement) => {\n if (internalRef.current) {\n if (option.matches(querySelector)) {\n const options = getOptionsFromCollection(internalRef.current, querySelector);\n const nextActiveIndex = Array.from(options).indexOf(option);\n\n if (nextActiveIndex > -1) {\n setActiveOption(nextActiveIndex, internalRef.current, option);\n }\n }\n }\n },\n [internalRef.current, querySelector]\n );\n\n React.useEffect(() => {\n if (internalRef.current) {\n internalRef.current.setActiveIndexByElement = setActiveIndexByElement;\n }\n }, [internalRef.current]);\n\n React.useEffect(() => {\n if (internalRef.current) {\n const options = getOptionsFromCollection(internalRef.current, querySelector);\n\n if (options.length) {\n let selected = internalRef.current.querySelectorAll(`[aria-current=\"true\"]`);\n\n if (selected.length === 0) {\n selected = internalRef.current.querySelectorAll(`[aria-selected]`);\n }\n\n if (selected.length === 1) {\n if (options) {\n const firstSelected = selected.item(0);\n const selectedIndex = Array.from(options).indexOf(firstSelected);\n\n if (selectedIndex > -1) {\n setActiveOption(selectedIndex, internalRef.current, firstSelected);\n }\n }\n } else {\n // multiple selected or none selected should go to 0\n setActiveOption(0, internalRef.current, options.item(0));\n }\n }\n }\n }, [props.children]);\n\n const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n const option = event.target as HTMLElement;\n\n if (option.matches(querySelector)) {\n const options = getOptionsFromCollection(event.currentTarget, querySelector);\n const nextActiveIndex = Array.from(options).indexOf(option);\n\n if (nextActiveIndex > -1) {\n setActiveOption(nextActiveIndex, event.currentTarget, option);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n // this stops the event dispatched to the option rebounding back and starting an infinite loop\n if (event.target !== event.currentTarget) {\n return;\n }\n\n if (otherProps.onKeyDown) {\n otherProps.onKeyDown(event);\n }\n\n if (event.isDefaultPrevented()) {\n return;\n }\n\n const options = getOptionsFromCollection(event.currentTarget, querySelector);\n\n if (options) {\n if (isAriaDirectionKey(event)) {\n event.preventDefault();\n event.stopPropagation();\n const nextActiveIndex = getNextEnabledItem(event, options, activeIndex);\n\n if (nextActiveIndex !== undefined && nextActiveIndex !== activeIndex) {\n setActiveOption(nextActiveIndex, event.currentTarget, options.item(nextActiveIndex));\n }\n } else if (activeIndex !== undefined && !!options.item(activeIndex)) {\n // forward events onto the underlying option - this lets consumers place onKeyDown handlers on their own components\n options\n .item(activeIndex)\n ?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n }\n }\n };\n\n return <div {...otherProps} onClick={handleClick} onKeyDown={handleKeyDown} ref={internalRef} tabIndex={tabIndex} />;\n});\n\nexport const getNextIndexFromKeycode = (\n event: React.KeyboardEvent,\n length: number,\n activeIndex: number \| undefined\n): number \| undefined => {\n switch (event.key) {\n case 'ArrowUp':\n return activeIndex === undefined ? length - 1 : activeIndex > 0 ? activeIndex - 1 : activeIndex;\n\n case 'ArrowDown':\n return activeIndex === undefined ? 0 : activeIndex < length - 1 ? activeIndex + 1 : activeIndex;\n\n case 'Home':\n return 0;\n\n case 'End':\n return length - 1;\n\n default:\n return;\n }\n};\n\nexport const getNextEnabledItem = (\n event: React.KeyboardEvent<HTMLElement>,\n options: NodeListOf<Element>,\n activeIndex: number \| undefined,\n recurse = true\n): number \| undefined => {\n const nextIndex = getNextIndexFromKeycode(event, options.length, activeIndex);\n\n if (nextIndex !== undefined) {\n if (nextIndex === activeIndex) {\n return activeIndex;\n } else if (options.item(nextIndex) && isSkippableItem(options.item(nextIndex))) {\n // check in the other direction if the first or last item is disabled,\n // but prevent infinite loops if all elements are disabled by disabling recursion\n if (recurse) {\n if (nextIndex === 0) {\n return getNextEnabledItem(\n new KeyboardEvent(event.type, { ...(event as any), key: 'ArrowDown' }) as any,\n options,\n nextIndex,\n false\n );\n } else if (nextIndex === options.length - 1) {\n return getNextEnabledItem(\n new KeyboardEvent(event.type, { ...(event as any), key: 'ArrowUp' }) as any,\n options,\n nextIndex,\n false\n );\n }\n }\n\n return getNextEnabledItem(event, options, nextIndex, recurse);\n }\n }\n\n return nextIndex;\n};\n\nconst isSkippableItem = (element: Element) => {\n return (\n element.getAttribute('role') === 'presentation' \|\|\n !!element.hasAttribute('disabled') \|\|\n !!element.getAttribute('aria-disabled') \|\|\n !!element.getAttribute('aria-hidden')\n );\n};\n"],"names":["getOptionsFromCollection","collection","selector","querySelectorAll","Root","React","forwardRef","CollectionRoot","props","ref","querySelector","tabIndex","otherProps","internalRef","useMergedRef","activeIndex","setActiveIndex","useState","setActiveOption","index","option","_collection$querySele","removeAttribute","setAttribute","scrollIntoView","block","setActiveIndexByElement","useCallback","current","matches","options","nextActiveIndex","Array","from","indexOf","useEffect","length","selected","firstSelected","item","selectedIndex","children","handleClick","event","target","currentTarget","handleKeyDown","onKeyDown","isDefaultPrevented","isAriaDirectionKey","preventDefault","stopPropagation","getNextEnabledItem","undefined","_options$item","dispatchEvent","createCustomKeyboardEvent","onClick","getNextIndexFromKeycode","key","recurse","nextIndex","isSkippableItem","KeyboardEvent","type","element","getAttribute","hasAttribute"],"mappings":"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"}
1	+ {"version":3,"file":"Root.js","sources":["../../../../../../../../src/primitives/Collection/components/Root.tsx"],"sourcesContent":["import React from 'react';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { isAriaDirectionKey } from '../../../utils/aria';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\n\n/* This component provides a keyboard navigable collection primitive for use in lists\n * It is unlikely you need to edit this component\n */\n\nexport type CollectionProps = React.HTMLAttributes<HTMLDivElement> & {\n querySelector: string;\n resetOnChange?: unknown;\n};\n\nexport type CollectionRef = HTMLDivElement & {\n setActiveIndexByElement: (option: HTMLDivElement) => void;\n};\n\nconst getOptionsFromCollection = (collection: HTMLDivElement, selector: string): NodeListOf<Element> =>\n collection.querySelectorAll(selector);\n\n// we use javascript to set attributes (rather than cloning children and adding them)\n// so that we can support nesting (e.g. groups) - child elements that aren't options.\n// without doing this we would have to unwrap and flatten all groups\nexport const Root = React.forwardRef<CollectionRef, CollectionProps>(function CollectionRoot(props, ref) {\n const { querySelector, resetOnChange, tabIndex = 0, ...otherProps } = props;\n const internalRef = useMergedRef<CollectionRef>(ref);\n const [activeIndex, setActiveIndex] = React.useState<number \| undefined>();\n\n const setActiveOption = (index: number, collection: HTMLDivElement, option: Element) => {\n collection.querySelector(`[aria-current]`)?.removeAttribute('aria-current');\n option.setAttribute('aria-current', 'true');\n option.scrollIntoView({ block: 'nearest' });\n setActiveIndex(index);\n };\n\n const setActiveIndexByElement = React.useCallback(\n (option: HTMLDivElement) => {\n if (internalRef.current) {\n if (option.matches(querySelector)) {\n const options = getOptionsFromCollection(internalRef.current, querySelector);\n const nextActiveIndex = Array.from(options).indexOf(option);\n\n if (nextActiveIndex > -1) {\n setActiveOption(nextActiveIndex, internalRef.current, option);\n }\n }\n }\n },\n [internalRef.current, querySelector]\n );\n\n React.useEffect(() => {\n if (internalRef.current) {\n internalRef.current.setActiveIndexByElement = setActiveIndexByElement;\n }\n }, [internalRef.current]);\n\n React.useEffect(() => {\n if (internalRef.current) {\n const selected = internalRef.current.querySelectorAll(`[aria-current=\"true\"]`);\n const options = getOptionsFromCollection(internalRef.current, querySelector);\n\n if (options.length && selected.length === 1) {\n const firstSelected = internalRef.current.querySelector(`[aria-selected]`);\n\n if (firstSelected) {\n const selectedIndex = Array.from(options).indexOf(firstSelected);\n\n if (selectedIndex > -1) {\n setActiveOption(selectedIndex, internalRef.current, firstSelected);\n }\n }\n }\n }\n }, [resetOnChange]);\n\n React.useEffect(() => {\n if (internalRef.current) {\n const options = getOptionsFromCollection(internalRef.current, querySelector);\n\n if (options.length) {\n let selected = internalRef.current.querySelectorAll(`[aria-current=\"true\"]`);\n\n // if nothing is current (keyboard visible), look for selected items\n if (selected.length === 0) {\n selected = internalRef.current.querySelectorAll(`[aria-selected]`);\n }\n\n // if one item is selected, make sure it's current\n if (selected.length === 1) {\n if (options) {\n const firstSelected = selected.item(0);\n const selectedIndex = Array.from(options).indexOf(firstSelected);\n\n if (selectedIndex > -1) {\n setActiveOption(selectedIndex, internalRef.current, firstSelected);\n }\n }\n } else {\n // multiple selected or none selected should go to 0\n setActiveOption(0, internalRef.current, options.item(0));\n }\n }\n }\n }, [props.children]);\n\n const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n const option = event.target as HTMLElement;\n\n if (option.matches(querySelector)) {\n const options = getOptionsFromCollection(event.currentTarget, querySelector);\n const nextActiveIndex = Array.from(options).indexOf(option);\n\n if (nextActiveIndex > -1) {\n setActiveOption(nextActiveIndex, event.currentTarget, option);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n // this stops the event dispatched to the option rebounding back and starting an infinite loop\n if (event.target !== event.currentTarget) {\n return;\n }\n\n if (otherProps.onKeyDown) {\n otherProps.onKeyDown(event);\n }\n\n if (event.isDefaultPrevented()) {\n return;\n }\n\n const options = getOptionsFromCollection(event.currentTarget, querySelector);\n\n if (options) {\n if (isAriaDirectionKey(event)) {\n event.preventDefault();\n event.stopPropagation();\n const nextActiveIndex = getNextEnabledItem(event, options, activeIndex);\n\n if (nextActiveIndex !== undefined && nextActiveIndex !== activeIndex) {\n setActiveOption(nextActiveIndex, event.currentTarget, options.item(nextActiveIndex));\n }\n } else if (activeIndex !== undefined && !!options.item(activeIndex)) {\n // forward events onto the underlying option - this lets consumers place onKeyDown handlers on their own components\n options\n .item(activeIndex)\n ?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n }\n }\n };\n\n return <div {...otherProps} onClick={handleClick} onKeyDown={handleKeyDown} ref={internalRef} tabIndex={tabIndex} />;\n});\n\nexport const getNextIndexFromKeycode = (\n event: React.KeyboardEvent,\n length: number,\n activeIndex: number \| undefined\n): number \| undefined => {\n switch (event.key) {\n case 'ArrowUp':\n return activeIndex === undefined ? length - 1 : activeIndex > 0 ? activeIndex - 1 : activeIndex;\n\n case 'ArrowDown':\n return activeIndex === undefined ? 0 : activeIndex < length - 1 ? activeIndex + 1 : activeIndex;\n\n case 'Home':\n return 0;\n\n case 'End':\n return length - 1;\n\n default:\n return;\n }\n};\n\nexport const getNextEnabledItem = (\n event: React.KeyboardEvent<HTMLElement>,\n options: NodeListOf<Element>,\n activeIndex: number \| undefined,\n recurse = true\n): number \| undefined => {\n const nextIndex = getNextIndexFromKeycode(event, options.length, activeIndex);\n\n if (nextIndex !== undefined) {\n if (nextIndex === activeIndex) {\n return activeIndex;\n } else if (options.item(nextIndex) && isSkippableItem(options.item(nextIndex))) {\n // check in the other direction if the first or last item is disabled,\n // but prevent infinite loops if all elements are disabled by disabling recursion\n if (recurse) {\n if (nextIndex === 0) {\n return getNextEnabledItem(\n new KeyboardEvent(event.type, { ...(event as any), key: 'ArrowDown' }) as any,\n options,\n nextIndex,\n false\n );\n } else if (nextIndex === options.length - 1) {\n return getNextEnabledItem(\n new KeyboardEvent(event.type, { ...(event as any), key: 'ArrowUp' }) as any,\n options,\n nextIndex,\n false\n );\n }\n }\n\n return getNextEnabledItem(event, options, nextIndex, recurse);\n }\n }\n\n return nextIndex;\n};\n\nconst isSkippableItem = (element: Element) => {\n return (\n element.getAttribute('role') === 'presentation' \|\|\n !!element.hasAttribute('disabled') \|\|\n !!element.getAttribute('aria-disabled') \|\|\n !!element.getAttribute('aria-hidden')\n );\n};\n"],"names":["getOptionsFromCollection","collection","selector","querySelectorAll","Root","React","forwardRef","CollectionRoot","props","ref","querySelector","resetOnChange","tabIndex","otherProps","internalRef","useMergedRef","activeIndex","setActiveIndex","useState","setActiveOption","index","option","_collection$querySele","removeAttribute","setAttribute","scrollIntoView","block","setActiveIndexByElement","useCallback","current","matches","options","nextActiveIndex","Array","from","indexOf","useEffect","selected","length","firstSelected","selectedIndex","item","children","handleClick","event","target","currentTarget","handleKeyDown","onKeyDown","isDefaultPrevented","isAriaDirectionKey","preventDefault","stopPropagation","getNextEnabledItem","undefined","_options$item","dispatchEvent","createCustomKeyboardEvent","onClick","getNextIndexFromKeycode","key","recurse","nextIndex","isSkippableItem","KeyboardEvent","type","element","getAttribute","hasAttribute"],"mappings":"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"}

package/dist/esm/packages/taco/src/primitives/Listbox2/components/Option.js CHANGED Viewed

@@ -36,10 +36,6 @@ const Option = /*#__PURE__*/React__default.forwardRef(function Listbox2Option(pr
     if (disabled || listboxDisabled || listboxReadOnly) {
       event.stopPropagation();
       return;
-    }
-    // UX requirement: if tab key is pressed and the current option is selected then keydown event is ignored
-    else if (event.key === 'Tab' && selected) {
-      return;
     } else if (isAriaSelectionKey(event)) {
       setValue(value);
     }
@@ -50,7 +46,6 @@ const Option = /*#__PURE__*/React__default.forwardRef(function Listbox2Option(pr
   return /*#__PURE__*/React__default.createElement("div", Object.assign({}, otherProps, {
     "aria-disabled": listboxDisabled || disabled ? 'true' : undefined,
     "aria-selected": selected ? 'true' : undefined,
-    key: `${value}_${String(selected)}`,
     id: id,
     onClick: handleClick,
     onKeyDown: handleKeyDown,

package/dist/esm/packages/taco/src/primitives/Listbox2/components/Option.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Option.js","sources":["../../../../../../../../src/primitives/Listbox2/components/Option.tsx"],"sourcesContent":["import React from 'react';\nimport { useId } from '../../../hooks/useId';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { Listbox2OptionValue } from '../types';\nimport { useListbox2Context } from './Context';\n\nexport type Listbox2OptionProps = React.HTMLAttributes<HTMLDivElement> & {\n disabled?: boolean;\n value: Listbox2OptionValue;\n};\n\nexport const Option = React.forwardRef<HTMLDivElement, Listbox2OptionProps>(function Listbox2Option(props, ref) {\n const { disabled, id: nativeId, title, value, ...otherProps } = props;\n const { disabled: listboxDisabled, readOnly: listboxReadOnly, setValue, value: currentValue } = useListbox2Context();\n // The id name cannot start with a number, otherwise unit tests will fail when trying to querry element with such id.\n // That's why adding prefix.\n const id = 'option-' + useId(nativeId);\n const selected = Array.isArray(currentValue) ? currentValue.includes(value) : currentValue === value;\n\n const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n if (disabled \|\| listboxDisabled \|\| listboxReadOnly) {\n event.stopPropagation();\n return;\n } else {\n setValue(value);\n }\n\n if (typeof props.onClick === 'function') {\n props.onClick(event);\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (disabled \|\| listboxDisabled \|\| listboxReadOnly) {\n event.stopPropagation();\n return;\n }~~\n //~~ ~~UX requirement: if tab key is pressed and the current option is selected then keydown event is ignored\n~~ else if (~~event.key === 'Tab' && selected) {\n return;\n } else if (~~isAriaSelectionKey(event)) {\n setValue(value);\n }\n\n if (typeof props.onKeyDown === 'function') {\n props.onKeyDown(event);\n }\n };\n\n return (\n <div\n {...otherProps}\n aria-disabled={listboxDisabled \|\| disabled ? 'true' : undefined}\n aria-selected={selected ? 'true' : undefined}\n ~~key={`${value}_${String(selected)}`}\n~~ id={id}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n ref={ref}\n role=\"option\"\n />\n );\n});\n"],"names":["Option","React","forwardRef","Listbox2Option","props","ref","disabled","id","nativeId","title","value","otherProps","listboxDisabled","readOnly","listboxReadOnly","setValue","currentValue","useListbox2Context","useId","selected","Array","isArray","includes","handleClick","event","stopPropagation","onClick","handleKeyDown","~~key","~~isAriaSelectionKey","onKeyDown","undefined","~~String","~~role"],"mappings":";;;;;MAWaA,MAAM,gBAAGC,cAAK,CAACC,UAAU,CAAsC,SAASC,cAAcA,CAACC,KAAK,EAAEC,GAAG;EAC1G,MAAM;IAAEC,QAAQ;IAAEC,EAAE,EAAEC,QAAQ;IAAEC,KAAK;IAAEC,KAAK;IAAE,GAAGC;GAAY,GAAGP,KAAK;EACrE,MAAM;IAAEE,QAAQ,EAAEM,eAAe;IAAEC,QAAQ,EAAEC,eAAe;IAAEC,QAAQ;IAAEL,KAAK,EAAEM;GAAc,GAAGC,kBAAkB,EAAE;;;EAGpH,MAAMV,EAAE,GAAG,SAAS,GAAGW,KAAK,CAACV,QAAQ,CAAC;EACtC,MAAMW,QAAQ,GAAGC,KAAK,CAACC,OAAO,CAACL,YAAY,CAAC,GAAGA,YAAY,CAACM,QAAQ,CAACZ,KAAK,CAAC,GAAGM,YAAY,KAAKN,KAAK;EAEpG,MAAMa,WAAW,GAAIC,KAAuC;IACxD,IAAIlB,QAAQ,IAAIM,eAAe,IAAIE,eAAe,EAAE;MAChDU,KAAK,CAACC,eAAe,EAAE;MACvB;KACH,MAAM;MACHV,QAAQ,CAACL,KAAK,CAAC;;IAGnB,IAAI,OAAON,KAAK,CAACsB,OAAO,KAAK,UAAU,EAAE;MACrCtB,KAAK,CAACsB,OAAO,CAACF,KAAK,CAAC;;GAE3B;EAED,MAAMG,aAAa,GAAIH,KAA0C;IAC7D,IAAIlB,QAAQ,IAAIM,eAAe,IAAIE,eAAe,EAAE;MAChDU,KAAK,CAACC,eAAe,EAAE;MACvB~~;;;SAGC,IAAID,KAAK,CAACI,GAAG,KAAK,KAAK,IAAIT,QAAQ,EAAE~~;~~MACtC;~~KACH,MAAM,~~IAAIU~~,kBAAkB,~~CAACL~~,KAAK,CAAC,EAAE;MAClCT,QAAQ,CAACL,KAAK,CAAC;;IAGnB,IAAI,OAAON,KAAK,~~CAAC0B~~,SAAS,KAAK,UAAU,EAAE;~~MACvC1B~~,KAAK,~~CAAC0B~~,SAAS,~~CAACN~~,KAAK,CAAC;;GAE7B;EAED,oBACIvB,sDACQU,UAAU;qBACCC,eAAe,IAAIN,QAAQ,GAAG,MAAM,~~GAAGyB~~,SAAS;~~qBAChDZ~~,QAAQ,GAAG,MAAM,~~GAAGY~~,SAAS;~~IAC5CH~~,~~GAAG,~~EAAE,~~GAAGlB,KAAK,IAAIsB,MAAM,CAACb,QAAQ,CAAC,EAAE;IACnCZ,EAAE,~~EAAEA,EAAE;IACNmB,OAAO,EAAEH,WAAW;~~IACpBO~~,SAAS,~~EAAEH~~,aAAa;IACxBtB,GAAG,EAAEA,GAAG;~~IACR4B~~,IAAI,EAAC;KACP;AAEV,CAAC;;;;"}
1	+ {"version":3,"file":"Option.js","sources":["../../../../../../../../src/primitives/Listbox2/components/Option.tsx"],"sourcesContent":["import React from 'react';\nimport { useId } from '../../../hooks/useId';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { Listbox2OptionValue } from '../types';\nimport { useListbox2Context } from './Context';\n\nexport type Listbox2OptionProps = React.HTMLAttributes<HTMLDivElement> & {\n disabled?: boolean;\n value: Listbox2OptionValue;\n};\n\nexport const Option = React.forwardRef<HTMLDivElement, Listbox2OptionProps>(function Listbox2Option(props, ref) {\n const { disabled, id: nativeId, title, value, ...otherProps } = props;\n const { disabled: listboxDisabled, readOnly: listboxReadOnly, setValue, value: currentValue } = useListbox2Context();\n // The id name cannot start with a number, otherwise unit tests will fail when trying to querry element with such id.\n // That's why adding prefix.\n const id = 'option-' + useId(nativeId);\n const selected = Array.isArray(currentValue) ? currentValue.includes(value) : currentValue === value;\n\n const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n if (disabled \|\| listboxDisabled \|\| listboxReadOnly) {\n event.stopPropagation();\n return;\n } else {\n setValue(value);\n }\n\n if (typeof props.onClick === 'function') {\n props.onClick(event);\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (disabled \|\| listboxDisabled \|\| listboxReadOnly) {\n event.stopPropagation();\n return;\n } else if (isAriaSelectionKey(event)) {\n setValue(value);\n }\n\n if (typeof props.onKeyDown === 'function') {\n props.onKeyDown(event);\n }\n };\n\n return (\n <div\n {...otherProps}\n aria-disabled={listboxDisabled \|\| disabled ? 'true' : undefined}\n aria-selected={selected ? 'true' : undefined}\n id={id}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n ref={ref}\n role=\"option\"\n />\n );\n});\n"],"names":["Option","React","forwardRef","Listbox2Option","props","ref","disabled","id","nativeId","title","value","otherProps","listboxDisabled","readOnly","listboxReadOnly","setValue","currentValue","useListbox2Context","useId","selected","Array","isArray","includes","handleClick","event","stopPropagation","onClick","handleKeyDown","isAriaSelectionKey","onKeyDown","undefined","role"],"mappings":";;;;;MAWaA,MAAM,gBAAGC,cAAK,CAACC,UAAU,CAAsC,SAASC,cAAcA,CAACC,KAAK,EAAEC,GAAG;EAC1G,MAAM;IAAEC,QAAQ;IAAEC,EAAE,EAAEC,QAAQ;IAAEC,KAAK;IAAEC,KAAK;IAAE,GAAGC;GAAY,GAAGP,KAAK;EACrE,MAAM;IAAEE,QAAQ,EAAEM,eAAe;IAAEC,QAAQ,EAAEC,eAAe;IAAEC,QAAQ;IAAEL,KAAK,EAAEM;GAAc,GAAGC,kBAAkB,EAAE;;;EAGpH,MAAMV,EAAE,GAAG,SAAS,GAAGW,KAAK,CAACV,QAAQ,CAAC;EACtC,MAAMW,QAAQ,GAAGC,KAAK,CAACC,OAAO,CAACL,YAAY,CAAC,GAAGA,YAAY,CAACM,QAAQ,CAACZ,KAAK,CAAC,GAAGM,YAAY,KAAKN,KAAK;EAEpG,MAAMa,WAAW,GAAIC,KAAuC;IACxD,IAAIlB,QAAQ,IAAIM,eAAe,IAAIE,eAAe,EAAE;MAChDU,KAAK,CAACC,eAAe,EAAE;MACvB;KACH,MAAM;MACHV,QAAQ,CAACL,KAAK,CAAC;;IAGnB,IAAI,OAAON,KAAK,CAACsB,OAAO,KAAK,UAAU,EAAE;MACrCtB,KAAK,CAACsB,OAAO,CAACF,KAAK,CAAC;;GAE3B;EAED,MAAMG,aAAa,GAAIH,KAA0C;IAC7D,IAAIlB,QAAQ,IAAIM,eAAe,IAAIE,eAAe,EAAE;MAChDU,KAAK,CAACC,eAAe,EAAE;MACvB;KACH,MAAM,IAAIG,kBAAkB,CAACJ,KAAK,CAAC,EAAE;MAClCT,QAAQ,CAACL,KAAK,CAAC;;IAGnB,IAAI,OAAON,KAAK,CAACyB,SAAS,KAAK,UAAU,EAAE;MACvCzB,KAAK,CAACyB,SAAS,CAACL,KAAK,CAAC;;GAE7B;EAED,oBACIvB,sDACQU,UAAU;qBACCC,eAAe,IAAIN,QAAQ,GAAG,MAAM,GAAGwB,SAAS;qBAChDX,QAAQ,GAAG,MAAM,GAAGW,SAAS;IAC5CvB,EAAE,EAAEA,EAAE;IACNmB,OAAO,EAAEH,WAAW;IACpBM,SAAS,EAAEF,aAAa;IACxBtB,GAAG,EAAEA,GAAG;IACR0B,IAAI,EAAC;KACP;AAEV,CAAC;;;;"}

package/dist/esm/packages/taco/src/primitives/Listbox2/components/Root.js CHANGED Viewed

@@ -36,6 +36,7 @@ const Root = /*#__PURE__*/React__default.forwardRef(function Listbox2(props, ref
     id: id,
     querySelector: customSelector ? `${DEFAULT_SELECTOR}, ${customSelector}` : DEFAULT_SELECTOR,
     ref: ref,
+    resetOnChange: value,
     role: "listbox"
   }), children)));
 });

package/dist/esm/packages/taco/src/primitives/Listbox2/components/Root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Root.js","sources":["../../../../../../../../src/primitives/Listbox2/components/Root.tsx"],"sourcesContent":["import React from 'react';\nimport { useId } from '../../../hooks/useId';\nimport * as CollectionPrimitive from '../../Collection/Collection';\nimport { Listbox2Value } from '../types';\nimport { Listbox2Context } from './Context';\n\nexport type Listbox2Props = React.HTMLAttributes<HTMLDivElement> & {\n customSelector?: string;\n disabled?: boolean;\n multiple?: boolean;\n readOnly?: boolean;\n setValue: (value: Listbox2Value) => void;\n value?: Listbox2Value;\n};\n\nconst DEFAULT_SELECTOR = '[role=\"option\"]';\n\nexport const Root = React.forwardRef<CollectionPrimitive.CollectionRef, Listbox2Props>(function Listbox2(props, ref) {\n const {\n children,\n customSelector,\n disabled = false,\n id: nativeId,\n multiple,\n readOnly = false,\n setValue,\n title,\n value,\n ...otherProps\n } = props;\n // The id name cannot start with a number, otherwise unit tests will fail when trying to querry element with such id.\n // That's why adding prefix.\n const id = 'listbox2-' + useId(nativeId);\n\n const context = React.useMemo(\n () => ({\n disabled,\n readOnly,\n setValue,\n value,\n }),\n [disabled, readOnly, value]\n );\n\n return (\n <Listbox2Context.Provider value={context}>\n <div data-taco=\"listbox2\">\n <CollectionPrimitive.Root\n {...otherProps}\n aria-multiselectable={multiple ? true : undefined}\n id={id}\n querySelector={customSelector ? `${DEFAULT_SELECTOR}, ${customSelector}` : DEFAULT_SELECTOR}\n ref={ref}\n role=\"listbox\">\n {children}\n </CollectionPrimitive.Root>\n </div>\n </Listbox2Context.Provider>\n );\n});\n\nexport const createListboxValueSetter =\n (multiple: boolean, setValue: React.Dispatch<React.SetStateAction<Listbox2Value \| undefined>>) =>\n (nextValue: Listbox2Value) => {\n setValue(value => {\n if (Array.isArray(nextValue)) {\n return nextValue;\n }\n\n if (multiple) {\n if (value === undefined) {\n return [nextValue];\n } else if (Array.isArray(value)) {\n if (value.includes(nextValue)) {\n return value.filter(v => v !== nextValue);\n }\n\n return [...value, nextValue];\n } else if (value === nextValue) {\n return [];\n }\n\n return [value, nextValue];\n }\n\n return nextValue;\n });\n };\n"],"names":["DEFAULT_SELECTOR","Root","React","forwardRef","Listbox2","props","ref","children","customSelector","disabled","id","nativeId","multiple","readOnly","setValue","title","value","otherProps","useId","context","useMemo","Listbox2Context","Provider","CollectionPrimitive","undefined","querySelector","role","createListboxValueSetter","nextValue","Array","isArray","includes","filter","v"],"mappings":";;;;;;AAeA,MAAMA,gBAAgB,GAAG,iBAAiB;MAE7BC,IAAI,gBAAGC,cAAK,CAACC,UAAU,CAAmD,SAASC,QAAQA,CAACC,KAAK,EAAEC,GAAG;EAC/G,MAAM;IACFC,QAAQ;IACRC,cAAc;IACdC,QAAQ,GAAG,KAAK;IAChBC,EAAE,EAAEC,QAAQ;IACZC,QAAQ;IACRC,QAAQ,GAAG,KAAK;IAChBC,QAAQ;IACRC,KAAK;IACLC,KAAK;IACL,GAAGC;GACN,GAAGZ,KAAK;;;EAGT,MAAMK,EAAE,GAAG,WAAW,GAAGQ,KAAK,CAACP,QAAQ,CAAC;EAExC,MAAMQ,OAAO,GAAGjB,cAAK,CAACkB,OAAO,CACzB,OAAO;IACHX,QAAQ;IACRI,QAAQ;IACRC,QAAQ;IACRE;GACH,CAAC,EACF,CAACP,QAAQ,EAAEI,QAAQ,EAAEG,KAAK,CAAC,CAC9B;EAED,oBACId,6BAACmB,eAAe,CAACC,QAAQ;IAACN,KAAK,EAAEG;kBAC7BjB;iBAAe;kBACXA,6BAACqB,MAAwB,oBACjBN,UAAU;4BACQL,QAAQ,GAAG,IAAI,GAAGY,SAAS;IACjDd,EAAE,EAAEA,EAAE;IACNe,aAAa,EAAEjB,cAAc,GAAG,GAAGR,gBAAgB,KAAKQ,cAAc,EAAE,GAAGR,gBAAgB;IAC3FM,GAAG,EAAEA,GAAG;IACRoB,IAAI,EAAC;~~MACJnB~~,QAAQ,CACc,CACzB,CACiB;AAEnC,CAAC;~~MAEYoB~~,wBAAwB,GACjCA,~~CAACf~~,QAAiB,EAAEE,QAAyE,~~KAC5Fc~~,SAAwB;~~EACrBd~~,QAAQ,CAACE,KAAK;IACV,~~IAAIa~~,KAAK,CAACC,OAAO,CAACF,SAAS,CAAC,EAAE;MAC1B,OAAOA,SAAS;;IAGpB,~~IAAIhB~~,QAAQ,EAAE;MACV,IAAII,KAAK,KAAKQ,SAAS,EAAE;QACrB,OAAO,~~CAACI~~,SAAS,CAAC;OACrB,MAAM,IAAIC,KAAK,CAACC,OAAO,~~CAACd~~,KAAK,CAAC,EAAE;QAC7B,IAAIA,KAAK,~~CAACe~~,QAAQ,CAACH,SAAS,CAAC,EAAE;UAC3B,~~OAAOZ~~,KAAK,~~CAACgB~~,MAAM,CAACC,CAAC,IAAIA,CAAC,KAAKL,SAAS,CAAC;;QAG7C,OAAO,CAAC,~~GAAGZ~~,KAAK,~~EAAEY~~,SAAS,CAAC;OAC/B,MAAM,~~IAAIZ~~,KAAK,~~KAAKY~~,SAAS,EAAE;QAC5B,OAAO,EAAE;;MAGb,OAAO,~~CAACZ~~,KAAK,~~EAAEY~~,SAAS,CAAC;;IAG7B,OAAOA,SAAS;GACnB,CAAC;AACN;;;;"}
1	+ {"version":3,"file":"Root.js","sources":["../../../../../../../../src/primitives/Listbox2/components/Root.tsx"],"sourcesContent":["import React from 'react';\nimport { useId } from '../../../hooks/useId';\nimport * as CollectionPrimitive from '../../Collection/Collection';\nimport { Listbox2Value } from '../types';\nimport { Listbox2Context } from './Context';\n\nexport type Listbox2Props = React.HTMLAttributes<HTMLDivElement> & {\n customSelector?: string;\n disabled?: boolean;\n multiple?: boolean;\n readOnly?: boolean;\n setValue: (value: Listbox2Value) => void;\n value?: Listbox2Value;\n};\n\nconst DEFAULT_SELECTOR = '[role=\"option\"]';\n\nexport const Root = React.forwardRef<CollectionPrimitive.CollectionRef, Listbox2Props>(function Listbox2(props, ref) {\n const {\n children,\n customSelector,\n disabled = false,\n id: nativeId,\n multiple,\n readOnly = false,\n setValue,\n title,\n value,\n ...otherProps\n } = props;\n // The id name cannot start with a number, otherwise unit tests will fail when trying to querry element with such id.\n // That's why adding prefix.\n const id = 'listbox2-' + useId(nativeId);\n\n const context = React.useMemo(\n () => ({\n disabled,\n readOnly,\n setValue,\n value,\n }),\n [disabled, readOnly, value]\n );\n\n return (\n <Listbox2Context.Provider value={context}>\n <div data-taco=\"listbox2\">\n <CollectionPrimitive.Root\n {...otherProps}\n aria-multiselectable={multiple ? true : undefined}\n id={id}\n querySelector={customSelector ? `${DEFAULT_SELECTOR}, ${customSelector}` : DEFAULT_SELECTOR}\n ref={ref}\n resetOnChange={value}\n role=\"listbox\">\n {children}\n </CollectionPrimitive.Root>\n </div>\n </Listbox2Context.Provider>\n );\n});\n\nexport const createListboxValueSetter =\n (multiple: boolean, setValue: React.Dispatch<React.SetStateAction<Listbox2Value \| undefined>>) =>\n (nextValue: Listbox2Value) => {\n setValue(value => {\n if (Array.isArray(nextValue)) {\n return nextValue;\n }\n\n if (multiple) {\n if (value === undefined) {\n return [nextValue];\n } else if (Array.isArray(value)) {\n if (value.includes(nextValue)) {\n return value.filter(v => v !== nextValue);\n }\n\n return [...value, nextValue];\n } else if (value === nextValue) {\n return [];\n }\n\n return [value, nextValue];\n }\n\n return nextValue;\n });\n };\n"],"names":["DEFAULT_SELECTOR","Root","React","forwardRef","Listbox2","props","ref","children","customSelector","disabled","id","nativeId","multiple","readOnly","setValue","title","value","otherProps","useId","context","useMemo","Listbox2Context","Provider","CollectionPrimitive","undefined","querySelector","resetOnChange","role","createListboxValueSetter","nextValue","Array","isArray","includes","filter","v"],"mappings":";;;;;;AAeA,MAAMA,gBAAgB,GAAG,iBAAiB;MAE7BC,IAAI,gBAAGC,cAAK,CAACC,UAAU,CAAmD,SAASC,QAAQA,CAACC,KAAK,EAAEC,GAAG;EAC/G,MAAM;IACFC,QAAQ;IACRC,cAAc;IACdC,QAAQ,GAAG,KAAK;IAChBC,EAAE,EAAEC,QAAQ;IACZC,QAAQ;IACRC,QAAQ,GAAG,KAAK;IAChBC,QAAQ;IACRC,KAAK;IACLC,KAAK;IACL,GAAGC;GACN,GAAGZ,KAAK;;;EAGT,MAAMK,EAAE,GAAG,WAAW,GAAGQ,KAAK,CAACP,QAAQ,CAAC;EAExC,MAAMQ,OAAO,GAAGjB,cAAK,CAACkB,OAAO,CACzB,OAAO;IACHX,QAAQ;IACRI,QAAQ;IACRC,QAAQ;IACRE;GACH,CAAC,EACF,CAACP,QAAQ,EAAEI,QAAQ,EAAEG,KAAK,CAAC,CAC9B;EAED,oBACId,6BAACmB,eAAe,CAACC,QAAQ;IAACN,KAAK,EAAEG;kBAC7BjB;iBAAe;kBACXA,6BAACqB,MAAwB,oBACjBN,UAAU;4BACQL,QAAQ,GAAG,IAAI,GAAGY,SAAS;IACjDd,EAAE,EAAEA,EAAE;IACNe,aAAa,EAAEjB,cAAc,GAAG,GAAGR,gBAAgB,KAAKQ,cAAc,EAAE,GAAGR,gBAAgB;IAC3FM,GAAG,EAAEA,GAAG;IACRoB,aAAa,EAAEV,KAAK;IACpBW,IAAI,EAAC;MACJpB,QAAQ,CACc,CACzB,CACiB;AAEnC,CAAC;MAEYqB,wBAAwB,GACjCA,CAAChB,QAAiB,EAAEE,QAAyE,KAC5Fe,SAAwB;EACrBf,QAAQ,CAACE,KAAK;IACV,IAAIc,KAAK,CAACC,OAAO,CAACF,SAAS,CAAC,EAAE;MAC1B,OAAOA,SAAS;;IAGpB,IAAIjB,QAAQ,EAAE;MACV,IAAII,KAAK,KAAKQ,SAAS,EAAE;QACrB,OAAO,CAACK,SAAS,CAAC;OACrB,MAAM,IAAIC,KAAK,CAACC,OAAO,CAACf,KAAK,CAAC,EAAE;QAC7B,IAAIA,KAAK,CAACgB,QAAQ,CAACH,SAAS,CAAC,EAAE;UAC3B,OAAOb,KAAK,CAACiB,MAAM,CAACC,CAAC,IAAIA,CAAC,KAAKL,SAAS,CAAC;;QAG7C,OAAO,CAAC,GAAGb,KAAK,EAAEa,SAAS,CAAC;OAC/B,MAAM,IAAIb,KAAK,KAAKa,SAAS,EAAE;QAC5B,OAAO,EAAE;;MAGb,OAAO,CAACb,KAAK,EAAEa,SAAS,CAAC;;IAG7B,OAAOA,SAAS;GACnB,CAAC;AACN;;;;"}

package/dist/esm/packages/taco/src/primitives/Sortable/components/Item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Item.js","sources":["../../../../../../../../src/primitives/Sortable/components/Item.tsx"],"sourcesContent":["import React from 'react';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\n\nexport type SortableItemId = string \| number;\n\nexport type SortableListItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'id'> & {\n disabled?: boolean;\n id: SortableItemId;\n asChild: boolean;\n};\n\nconst isFormElement = (element: HTMLElement) => {\n const formElementNodeNames = ['BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'FIELDSET'];\n\n return formElementNodeNames.includes(element.nodeName);\n};\n\nexport function Item(props: SortableListItemProps) {\n const { asChild, children, disabled = false, id } = props;\n const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ disabled, id });\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n };\n\n const onPointerDown = (event: ~~any~~) => {\n // allow form components, like checkboxes, to be active\n if (event.currentTarget.contains(event.target) && !isFormElement(event.target)) {\n listeners?.onPointerDown(event);\n }\n };\n\n const elProps = { ...attributes, ...listeners, onPointerDown, ref: setNodeRef, style };\n\n if (asChild) {\n return React.cloneElement(children as React.ReactElement, elProps);\n }\n\n return <div {...elProps}>{children}</div>;\n}\nItem.displayName = 'SortableListItem';\n"],"names":["isFormElement","element","formElementNodeNames","includes","nodeName","Item","props","asChild","children","disabled","id","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","Transform","toString","onPointerDown","event","currentTarget","contains","target","elProps","ref","React","cloneElement","displayName"],"mappings":";;;;AAYA,MAAMA,aAAa,GAAIC,OAAoB;EACvC,MAAMC,oBAAoB,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,CAAC;EAElF,OAAOA,oBAAoB,CAACC,QAAQ,CAACF,OAAO,CAACG,QAAQ,CAAC;AAC1D,CAAC;SAEeC,IAAIA,CAACC,KAA4B;EAC7C,MAAM;IAAEC,OAAO;IAAEC,QAAQ;IAAEC,QAAQ,GAAG,KAAK;IAAEC;GAAI,GAAGJ,KAAK;EACzD,MAAM;IAAEK,UAAU;IAAEC,SAAS;IAAEC,UAAU;IAAEC,SAAS;IAAEC;GAAY,GAAGC,WAAW,CAAC;IAAEP,QAAQ;IAAEC;GAAI,CAAC;EAElG,MAAMO,KAAK,GAAG;IACVH,SAAS,EAAEI,GAAG,CAACC,SAAS,CAACC,QAAQ,CAACN,SAAS,CAAC;IAC5CC;GACH;EAED,MAAMM,aAAa,GAAIC,~~KAAU~~;;~~IAE7B~~,IAAIA,KAAK,CAACC,aAAa,CAACC,QAAQ,CAACF,KAAK,CAACG,~~MAAM~~,CAAC,IAAI,CAACzB,aAAa,CAACsB,KAAK,CAACG,~~MAAM~~,CAAC,EAAE;~~MAC5Eb~~,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAES,aAAa,CAACC,KAAK,CAAC;;GAEtC;EAED,MAAMI,OAAO,GAAG;IAAE,GAAGf,UAAU;IAAE,GAAGC,SAAS;IAAES,aAAa;IAAEM,GAAG,EAAEd,UAAU;IAAEI;GAAO;EAEtF,IAAIV,OAAO,EAAE;IACT,oBAAOqB,cAAK,CAACC,YAAY,CAACrB,QAA8B,EAAEkB,OAAO,CAAC;;EAGtE,oBAAOE,sDAASF,OAAO,GAAGlB,QAAQ,CAAO;AAC7C;AACAH,IAAI,CAACyB,WAAW,GAAG,kBAAkB;;;;"}
1	+ {"version":3,"file":"Item.js","sources":["../../../../../../../../src/primitives/Sortable/components/Item.tsx"],"sourcesContent":["import React from 'react';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\n\nexport type SortableItemId = string \| number;\n\nexport type SortableListItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'id'> & {\n disabled?: boolean;\n id: SortableItemId;\n asChild: boolean;\n};\n\nconst isFormElement = (element: HTMLElement) => {\n const formElementNodeNames = ['BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'FIELDSET'];\n\n return formElementNodeNames.includes(element.nodeName);\n};\n\nexport function Item(props: SortableListItemProps) {\n const { asChild, children, disabled = false, id } = props;\n const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ disabled, id });\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n };\n\n const onPointerDown = (event: React.PointerEvent) => {\n // allow form components, like checkboxes, to be active\n if (event.currentTarget.contains(event.target as HTMLElement) && !isFormElement(event.target as HTMLElement)) {\n listeners?.onPointerDown(event);\n }\n };\n\n const elProps = { ...attributes, ...listeners, onPointerDown, ref: setNodeRef, style };\n\n if (asChild) {\n return React.cloneElement(children as React.ReactElement, elProps);\n }\n\n return <div {...elProps}>{children}</div>;\n}\nItem.displayName = 'SortableListItem';\n"],"names":["isFormElement","element","formElementNodeNames","includes","nodeName","Item","props","asChild","children","disabled","id","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","Transform","toString","onPointerDown","event","currentTarget","contains","target","elProps","ref","React","cloneElement","displayName"],"mappings":";;;;AAYA,MAAMA,aAAa,GAAIC,OAAoB;EACvC,MAAMC,oBAAoB,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,CAAC;EAElF,OAAOA,oBAAoB,CAACC,QAAQ,CAACF,OAAO,CAACG,QAAQ,CAAC;AAC1D,CAAC;SAEeC,IAAIA,CAACC,KAA4B;EAC7C,MAAM;IAAEC,OAAO;IAAEC,QAAQ;IAAEC,QAAQ,GAAG,KAAK;IAAEC;GAAI,GAAGJ,KAAK;EACzD,MAAM;IAAEK,UAAU;IAAEC,SAAS;IAAEC,UAAU;IAAEC,SAAS;IAAEC;GAAY,GAAGC,WAAW,CAAC;IAAEP,QAAQ;IAAEC;GAAI,CAAC;EAElG,MAAMO,KAAK,GAAG;IACVH,SAAS,EAAEI,GAAG,CAACC,SAAS,CAACC,QAAQ,CAACN,SAAS,CAAC;IAC5CC;GACH;EAED,MAAMM,aAAa,GAAIC,KAAyB;;IAE5C,IAAIA,KAAK,CAACC,aAAa,CAACC,QAAQ,CAACF,KAAK,CAACG,MAAqB,CAAC,IAAI,CAACzB,aAAa,CAACsB,KAAK,CAACG,MAAqB,CAAC,EAAE;MAC1Gb,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAES,aAAa,CAACC,KAAK,CAAC;;GAEtC;EAED,MAAMI,OAAO,GAAG;IAAE,GAAGf,UAAU;IAAE,GAAGC,SAAS;IAAES,aAAa;IAAEM,GAAG,EAAEd,UAAU;IAAEI;GAAO;EAEtF,IAAIV,OAAO,EAAE;IACT,oBAAOqB,cAAK,CAACC,YAAY,CAACrB,QAA8B,EAAEkB,OAAO,CAAC;;EAGtE,oBAAOE,sDAASF,OAAO,GAAGlB,QAAQ,CAAO;AAC7C;AACAH,IAAI,CAACyB,WAAW,GAAG,kBAAkB;;;;"}

package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js CHANGED Viewed

@@ -12,7 +12,7 @@ function Table(props) {
 }
 Table.Toolbar = TableToolbar;
 Table.Grid = TableGrid;
-function getFilterReason(table) {
+function getEmptyStateReason(table) {
   if (table.instance.getFilteredRowModel().rows.length === 0 && table.instance.getCoreRowModel().rows.length !== 0) {
     const state = table.instance.getState();
     if (table.meta.search.enableGlobalFilter && !!state.globalFilter) {
@@ -29,15 +29,14 @@ function TableGrid(props) {
   var _table$state$grouping;
   const {
     enableHorizontalArrowKeyNavigation,
+    footerRows,
     table,
     ...attributes
   } = props;
   const handleFocus = table.meta.rowActive.rowActiveIndex === undefined ? event => {
     table.meta.rowActive.handleFocus(event, table.meta.length, table.renderer.scrollToIndex);
   } : undefined;
-  const filterReason = getFilterReason(table);
-  const searchNotApplied = !table.state.globalFilter || table.state.globalFilter === '';
-  const filtersNotApplied = !table.state.columnFilters || table.state.columnFilters.length === 0;
+  const emptyStateReason = getEmptyStateReason(table);
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("style", null, table.stylesheet), /*#__PURE__*/React__default.createElement(FocusScope, null, /*#__PURE__*/React__default.createElement("table", Object.assign({}, attributes, {
     id: table.id,
     "data-table-font-size": table.meta.fontSize.size,
@@ -53,14 +52,19 @@ function TableGrid(props) {
     style: table.style,
     tabIndex: -1
   }), /*#__PURE__*/React__default.createElement("thead", null, table.instance.getHeaderGroups().map(headerGroup => (/*#__PURE__*/React__default.createElement("tr", {
-    key: headerGroup.id
+    key: headerGroup.id,
+    onFocus: event => {
+      // prevents rowActive.handleFocus from running when clicking on column-header menus.
+      event.stopPropagation();
+    }
   }, headerGroup.headers.map(props => (/*#__PURE__*/React__default.createElement(Header, {
     key: props.id,
     header: props,
     scrollToIndex: table.renderer.scrollToIndex
-  }))))))), filterReason ? (/*#__PURE__*/React__default.createElement(EmptyStateBody, {
+  }))))))), emptyStateReason ? (/*#__PURE__*/React__default.createElement(EmptyStateBody, {
     emptyState: props.table.props.emptyState,
-    reason: filterReason
+    isReady: table.meta.server.isEnabled ? table.meta.server.isReady : true,
+    reason: emptyStateReason
   })) : (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Body, {
     enableHorizontalArrowKeyNavigation: enableHorizontalArrowKeyNavigation,
     table: table.instance,
@@ -70,9 +74,9 @@ function TableGrid(props) {
       ...table.renderer.style,
       height: table.renderer.style.height + ROW_HEIGHT_ESTIMATES[table.meta.rowHeight.height]
     } : table.renderer.style
-  }, table.renderer.rows, searchNotApplied && filtersNotApplied && props.children), table.meta.footer.isEnabled ? /*#__PURE__*/React__default.createElement(Foot, {
+  }, table.renderer.rows, props.children), table.meta.footer.isEnabled ? /*#__PURE__*/React__default.createElement(Foot, {
     table: table.instance
-  }) : null)))));
+  }, footerRows) : null)))));
 }
 export { Table, TableGrid };

package/dist/esm/packages/taco/src/primitives/Table/Core/Table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.js","sources":["../../../../../../../../src/primitives/Table/Core/Table.tsx"],"sourcesContent":["import React from 'react';\nimport { FocusScope } from '@react-aria/focus';\nimport { Header } from './components/Header/Header';\nimport { Body } from './components/Body/Body';\nimport { Foot } from './components/Footer/Footer';\nimport { EmptyStateBody } from './components/Body/EmptyStateBody';\nimport { useTableReturnValue } from './useTable';\nimport { TableToolbar } from './components/Toolbar/Toolbar';\nimport ~~'./style.css';\nimport~~ { TableEmptyStateReason } from '../types';\nimport { ROW_HEIGHT_ESTIMATES } from './util/rows';\n\ntype TableProps = {\n children: JSX.Element \| Array<JSX.Element \| null>;\n};\n\nexport function Table(props: TableProps) {\n return <>{props.children}</>;\n}\nTable.Toolbar = TableToolbar;\nTable.Grid = TableGrid;\n\nexport type TableGridProps<TType = unknown> = React.TableHTMLAttributes<HTMLTableElement> & {\n 'data-taco': string;\n enableHorizontalArrowKeyNavigation?: boolean;\n table: useTableReturnValue<TType>;\n};\n\nfunction ~~getFilterReason~~<TType = unknown>(table: useTableReturnValue<TType>): TableEmptyStateReason \| null {\n if (table.instance.getFilteredRowModel().rows.length === 0 && table.instance.getCoreRowModel().rows.length !== 0) {\n const state = table.instance.getState();\n\n if (table.meta.search.enableGlobalFilter && !!state.globalFilter) {\n return 'searching';\n }\n\n return 'filtering';\n }\n if (table.instance.getCoreRowModel().rows.length === 0) {\n return 'empty';\n }\n\n return null;\n}\n\nexport function TableGrid<TType = unknown>(props: TableGridProps<TType>) {\n const { enableHorizontalArrowKeyNavigation, table, ...attributes } = props;\n const handleFocus =\n table.meta.rowActive.rowActiveIndex === undefined\n ? (event: React.FocusEvent) => {\n table.meta.rowActive.handleFocus(event, table.meta.length, table.renderer.scrollToIndex);\n }\n : undefined;\n const ~~filterReason~~ = ~~getFilterReason~~(table);\n\n ~~const searchNotApplied = !table.state.globalFilter \|\| table.state.globalFilter === '';\n const filtersNotApplied = !table.state.columnFilters \|\| table.state.columnFilters.length === 0;\n\n~~ return (\n <>\n <style>{table.stylesheet}</style>\n <FocusScope>\n <table\n {...attributes}\n id={table.id}\n data-table-font-size={table.meta.fontSize.size}\n data-table-grouped={!!table.state.grouping?.length}\n data-table-horizontally-scrolled={table.meta.columnFreezing.isHorizontallyScrolled ? true : undefined}\n data-table-status={table.meta.server.isEnabled ? (table.meta.server.isReady ? 'ready' : undefined) : 'ready'}\n data-table-pause-hover={table.meta.rowActive.isHoverStatePaused ? true : undefined}\n data-table-resizing={table.state.columnSizingInfo.isResizingColumn ? true : undefined}\n data-table-row-height={table.meta.rowHeight.height}\n onFocus={handleFocus}\n onScroll={table.meta.columnFreezing.handleScroll}\n ref={table.ref}\n style={table.style}\n tabIndex={-1}>\n <thead>\n {table.instance.getHeaderGroups().map(headerGroup => (\n <tr key={headerGroup.id}>\n {headerGroup.headers.map(props => (\n <Header key={props.id} header={props} scrollToIndex={table.renderer.scrollToIndex} />\n ))}\n </tr>\n ))}\n </thead>\n {~~filterReason~~ ? (\n <EmptyStateBody emptyState={props.table.props.emptyState} reason={~~filterReason~~} />\n ) : (\n <>\n <Body\n enableHorizontalArrowKeyNavigation={enableHorizontalArrowKeyNavigation}\n table={table.instance}\n tableElement={table.ref.current}\n scrollToIndex={table.renderer.scrollToIndex}\n style={\n props.children\n ? {\n ...table.renderer.style,\n height:\n (table.renderer.style.height as number) +\n ROW_HEIGHT_ESTIMATES[table.meta.rowHeight.height],\n }\n : table.renderer.style\n }>\n {table.renderer.rows}\n {~~searchNotApplied && filtersNotApplied &&~~ props.children}\n </Body>\n {table.meta.footer.isEnabled ? <Foot table={table.instance} /> : null}\n </>\n )}\n </table>\n </FocusScope>\n </>\n );\n}\n"],"names":["Table","props","React","children","Toolbar","TableToolbar","Grid","TableGrid","~~getFilterReason~~","table","instance","getFilteredRowModel","rows","length","getCoreRowModel","state","getState","meta","search","enableGlobalFilter","globalFilter","enableHorizontalArrowKeyNavigation","attributes","handleFocus","rowActive","rowActiveIndex","undefined","event","renderer","scrollToIndex","~~filterReason~~","~~searchNotApplied","filtersNotApplied","columnFilters","~~stylesheet","FocusScope","id","fontSize","size","_table$state$grouping","grouping","columnFreezing","isHorizontallyScrolled","server","isEnabled","isReady","isHoverStatePaused","columnSizingInfo","isResizingColumn","rowHeight","height","onFocus","onScroll","handleScroll","ref","style","tabIndex","getHeaderGroups","map","headerGroup","key","headers","Header","header","EmptyStateBody","emptyState","reason","Body","tableElement","current","ROW_HEIGHT_ESTIMATES","footer","Foot"],"mappings":";;;;;;;;;SAgBgBA,KAAKA,CAACC,KAAiB;EACnC,oBAAOC,4DAAGD,KAAK,CAACE,QAAQ,CAAI;AAChC;AACAH,KAAK,CAACI,OAAO,GAAGC,YAAY;AAC5BL,KAAK,CAACM,IAAI,GAAGC,SAAS;~~AAQtB~~,SAASC,~~eAAeA~~,CAAkBC,KAAiC;~~EACvE~~,IAAIA,KAAK,CAACC,QAAQ,CAACC,mBAAmB,EAAE,CAACC,IAAI,CAACC,MAAM,KAAK,CAAC,IAAIJ,KAAK,CAACC,QAAQ,CAACI,eAAe,EAAE,CAACF,IAAI,CAACC,MAAM,KAAK,CAAC,EAAE;IAC9G,MAAME,KAAK,GAAGN,KAAK,CAACC,QAAQ,CAACM,QAAQ,EAAE;IAEvC,IAAIP,KAAK,CAACQ,IAAI,CAACC,MAAM,CAACC,kBAAkB,IAAI,CAAC,CAACJ,KAAK,CAACK,YAAY,EAAE;MAC9D,OAAO,WAAW;;IAGtB,OAAO,WAAW;;EAEtB,IAAIX,KAAK,CAACC,QAAQ,CAACI,eAAe,EAAE,CAACF,IAAI,CAACC,MAAM,KAAK,CAAC,EAAE;IACpD,OAAO,OAAO;;EAGlB,OAAO,IAAI;AACf;SAEgBN,SAASA,CAAkBN,KAA4B;;EACnE,MAAM;IAAEoB,kCAAkC;~~IAAEZ~~,KAAK;IAAE,~~GAAGa~~;GAAY,~~GAAGrB~~,KAAK;~~EAC1E~~,~~MAAMsB~~,WAAW,~~GACbd~~,KAAK,CAACQ,IAAI,~~CAACO~~,SAAS,CAACC,cAAc,KAAKC,SAAS,GAC1CC,KAAuB;~~IACpBlB~~,KAAK,CAACQ,IAAI,~~CAACO~~,SAAS,CAACD,WAAW,CAACI,KAAK,~~EAAElB~~,KAAK,CAACQ,IAAI,CAACJ,MAAM,EAAEJ,KAAK,~~CAACmB~~,QAAQ,CAACC,aAAa,CAAC;GAC3F,GACDH,SAAS;EACnB,MAAMI,~~YAAY~~,~~GAAGtB~~,~~eAAe~~,CAACC,KAAK,CAAC;~~EAE3C~~,~~MAAMsB~~,gBAAgB,GAAG,CAACtB,KAAK,CAACM,KAAK,CAACK,YAAY,IAAIX,KAAK,CAACM,KAAK,CAACK,YAAY,KAAK,EAAE;EACrF,MAAMY,iBAAiB,GAAG,CAACvB,KAAK,CAACM,KAAK,CAACkB,aAAa,IAAIxB,KAAK,CAACM,KAAK,CAACkB,aAAa,CAACpB,MAAM,KAAK,CAAC;EAE9F,oBACIX,yEACIA,4CAAQO,KAAK,~~CAACyB~~,UAAU,CAAS,~~eACjChC~~,~~6BAACiC~~,UAAU,~~qBACPjC~~,~~wDACQoB~~,UAAU;~~IACdc~~,EAAE,~~EAAE3B~~,KAAK,~~CAAC2B~~,EAAE;~~4BACU3B~~,KAAK,CAACQ,IAAI,~~CAACoB~~,QAAQ,CAACC,IAAI;0BAC1B,CAAC,GAAAC,qBAAA,~~GAAC9B~~,KAAK,CAACM,KAAK,~~CAACyB~~,QAAQ,cAAAD,qBAAA,eAApBA,qBAAA,~~CAAsB1B~~,MAAM;wCAChBJ,KAAK,CAACQ,IAAI,~~CAACwB~~,cAAc,CAACC,sBAAsB,GAAG,IAAI,~~GAAGhB~~,SAAS;~~yBAClFjB~~,KAAK,CAACQ,IAAI,~~CAAC0B~~,MAAM,CAACC,SAAS,~~GAAInC~~,KAAK,CAACQ,IAAI,~~CAAC0B~~,MAAM,CAACE,OAAO,GAAG,OAAO,~~GAAGnB~~,SAAS,GAAI,OAAO;~~8BACpFjB~~,KAAK,CAACQ,IAAI,~~CAACO~~,SAAS,~~CAACsB~~,kBAAkB,GAAG,IAAI,~~GAAGpB~~,SAAS;~~2BAC7DjB~~,KAAK,CAACM,KAAK,~~CAACgC~~,gBAAgB,CAACC,gBAAgB,GAAG,IAAI,~~GAAGtB~~,SAAS;~~6BAC9DjB~~,KAAK,CAACQ,IAAI,~~CAACgC~~,SAAS,CAACC,MAAM;IAClDC,OAAO,~~EAAE5B~~,WAAW;~~IACpB6B~~,QAAQ,~~EAAE3C~~,KAAK,CAACQ,IAAI,~~CAACwB~~,cAAc,CAACY,YAAY;IAChDC,GAAG,~~EAAE7C~~,KAAK,~~CAAC6C~~,GAAG;IACdC,KAAK,~~EAAE9C~~,KAAK,~~CAAC8C~~,KAAK;IAClBC,QAAQ,EAAE,CAAC;~~mBACXtD~~,4CACKO,KAAK,CAACC,QAAQ,~~CAAC+C~~,eAAe,EAAE,CAACC,GAAG,CAACC,WAAW,~~kBAC7CzD~~;~~IAAI0D~~,GAAG,EAAED,WAAW,CAACvB;~~KAChBuB~~,WAAW,~~CAACE~~,OAAO,~~CAACH~~,GAAG,~~CAACzD~~,KAAK,kBAC1BC,~~6BAAC4D~~,MAAM;~~IAACF~~,GAAG,~~EAAE3D~~,KAAK,~~CAACmC~~,EAAE;~~IAAE2B~~,MAAM,~~EAAE9D~~,KAAK;~~IAAE4B~~,aAAa,~~EAAEpB~~,KAAK,~~CAACmB~~,QAAQ,CAACC;IAAiB,CACxF,CAAC,CACD,CACR,CAAC,CACE,EACPC,~~YAAY~~,~~iBACT5B~~,~~6BAAC8D~~,cAAc;~~IAACC~~,UAAU,~~EAAEhE~~,KAAK,CAACQ,KAAK,CAACR,KAAK,~~CAACgE~~,UAAU;~~IAAEC~~,MAAM,~~EAAEpC~~;~~IAAgB~~,~~kBAElF5B~~,yEACIA,~~6BAACiE~~,IAAI;~~IACD9C~~,kCAAkC,EAAEA,kCAAkC;IACtEZ,KAAK,EAAEA,KAAK,CAACC,QAAQ;~~IACrB0D~~,YAAY,~~EAAE3D~~,KAAK,~~CAAC6C~~,GAAG,~~CAACe~~,OAAO;IAC/~~BxC~~,aAAa,~~EAAEpB~~,KAAK,~~CAACmB~~,QAAQ,CAACC,aAAa;~~IAC3C0B~~,KAAK,~~EACDtD~~,KAAK,CAACE,QAAQ,GACR;MACI,GAAGM,KAAK,~~CAACmB~~,QAAQ,~~CAAC2B~~,KAAK;MACvBL,MAAM,~~EACDzC~~,KAAK,~~CAACmB~~,QAAQ,~~CAAC2B~~,KAAK,CAACL,MAAiB,~~GACvCoB~~,oBAAoB,~~CAAC7D~~,KAAK,CAACQ,IAAI,~~CAACgC~~,SAAS,CAACC,MAAM;KACvD,~~GACDzC~~,KAAK,~~CAACmB~~,QAAQ,~~CAAC2B~~;~~KAExB9C~~,KAAK,~~CAACmB~~,QAAQ,~~CAAChB~~,IAAI,~~EACnBmB~~,~~gBAAgB,IAAIC,iBAAiB,IAAI/B,~~KAAK,CAACE,QAAQ,~~CACrD~~,EACNM,KAAK,CAACQ,IAAI,~~CAACsD~~,MAAM,~~CAAC3B~~,SAAS,~~gBAAG1C~~,~~6BAACsE~~,IAAI;~~IAAC/D~~,KAAK,EAAEA,KAAK,CAACC;~~IAAY~~,GAAG,IAAI,~~CACtE~~,CACN,CACG,CACC,CACd;AAEX;;;;"}
1	+ {"version":3,"file":"Table.js","sources":["../../../../../../../../src/primitives/Table/Core/Table.tsx"],"sourcesContent":["import React from 'react';\nimport { FocusScope } from '@react-aria/focus';\nimport { Header } from './components/Header/Header';\nimport { Body } from './components/Body/Body';\nimport { Foot } from './components/Footer/Footer';\nimport { EmptyStateBody } from './components/Body/EmptyStateBody';\nimport { useTableReturnValue } from './useTable';\nimport { TableToolbar } from './components/Toolbar/Toolbar';\nimport { TableEmptyStateReason } from '../types';\nimport { ROW_HEIGHT_ESTIMATES } from './util/rows';\nimport './style.css';\n\ntype TableProps = {\n children: JSX.Element \| Array<JSX.Element \| null>;\n};\n\nexport function Table(props: TableProps) {\n return <>{props.children}</>;\n}\nTable.Toolbar = TableToolbar;\nTable.Grid = TableGrid;\n\nexport type TableGridProps<TType = unknown> = React.TableHTMLAttributes<HTMLTableElement> & {\n 'data-taco': string;\n enableHorizontalArrowKeyNavigation?: boolean;\n footerRows?: null \| JSX.Element \| JSX.Element[];\n table: useTableReturnValue<TType>;\n};\n\nfunction getEmptyStateReason<TType = unknown>(table: useTableReturnValue<TType>): TableEmptyStateReason \| null {\n if (table.instance.getFilteredRowModel().rows.length === 0 && table.instance.getCoreRowModel().rows.length !== 0) {\n const state = table.instance.getState();\n\n if (table.meta.search.enableGlobalFilter && !!state.globalFilter) {\n return 'searching';\n }\n\n return 'filtering';\n }\n if (table.instance.getCoreRowModel().rows.length === 0) {\n return 'empty';\n }\n\n return null;\n}\n\nexport function TableGrid<TType = unknown>(props: TableGridProps<TType>) {\n const { enableHorizontalArrowKeyNavigation, footerRows, table, ...attributes } = props;\n const handleFocus =\n table.meta.rowActive.rowActiveIndex === undefined\n ? (event: React.FocusEvent) => {\n table.meta.rowActive.handleFocus(event, table.meta.length, table.renderer.scrollToIndex);\n }\n : undefined;\n const emptyStateReason = getEmptyStateReason(table);\n\n return (\n <>\n <style>{table.stylesheet}</style>\n <FocusScope>\n <table\n {...attributes}\n id={table.id}\n data-table-font-size={table.meta.fontSize.size}\n data-table-grouped={!!table.state.grouping?.length}\n data-table-horizontally-scrolled={table.meta.columnFreezing.isHorizontallyScrolled ? true : undefined}\n data-table-status={table.meta.server.isEnabled ? (table.meta.server.isReady ? 'ready' : undefined) : 'ready'}\n data-table-pause-hover={table.meta.rowActive.isHoverStatePaused ? true : undefined}\n data-table-resizing={table.state.columnSizingInfo.isResizingColumn ? true : undefined}\n data-table-row-height={table.meta.rowHeight.height}\n onFocus={handleFocus}\n onScroll={table.meta.columnFreezing.handleScroll}\n ref={table.ref}\n style={table.style}\n tabIndex={-1}>\n <thead>\n {table.instance.getHeaderGroups().map(headerGroup => (\n <tr\n key={headerGroup.id}\n onFocus={event => {\n // prevents rowActive.handleFocus from running when clicking on column-header menus.\n event.stopPropagation();\n }}>\n {headerGroup.headers.map(props => (\n <Header key={props.id} header={props} scrollToIndex={table.renderer.scrollToIndex} />\n ))}\n </tr>\n ))}\n </thead>\n {emptyStateReason ? (\n <EmptyStateBody\n emptyState={props.table.props.emptyState}\n isReady={table.meta.server.isEnabled ? table.meta.server.isReady : true}\n reason={emptyStateReason}\n />\n ) : (\n <>\n <Body\n enableHorizontalArrowKeyNavigation={enableHorizontalArrowKeyNavigation}\n table={table.instance}\n tableElement={table.ref.current}\n scrollToIndex={table.renderer.scrollToIndex}\n style={\n props.children\n ? {\n ...table.renderer.style,\n height:\n (table.renderer.style.height as number) +\n ROW_HEIGHT_ESTIMATES[table.meta.rowHeight.height],\n }\n : table.renderer.style\n }>\n {table.renderer.rows}\n {props.children}\n </Body>\n {table.meta.footer.isEnabled ? <Foot table={table.instance}>{footerRows}</Foot> : null}\n </>\n )}\n </table>\n </FocusScope>\n </>\n );\n}\n"],"names":["Table","props","React","children","Toolbar","TableToolbar","Grid","TableGrid","getEmptyStateReason","table","instance","getFilteredRowModel","rows","length","getCoreRowModel","state","getState","meta","search","enableGlobalFilter","globalFilter","enableHorizontalArrowKeyNavigation","footerRows","attributes","handleFocus","rowActive","rowActiveIndex","undefined","event","renderer","scrollToIndex","emptyStateReason","stylesheet","FocusScope","id","fontSize","size","_table$state$grouping","grouping","columnFreezing","isHorizontallyScrolled","server","isEnabled","isReady","isHoverStatePaused","columnSizingInfo","isResizingColumn","rowHeight","height","onFocus","onScroll","handleScroll","ref","style","tabIndex","getHeaderGroups","map","headerGroup","key","stopPropagation","headers","Header","header","EmptyStateBody","emptyState","reason","Body","tableElement","current","ROW_HEIGHT_ESTIMATES","footer","Foot"],"mappings":"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"}

package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/EmptyStateBody.js CHANGED Viewed

@@ -1,16 +1,29 @@
 import React__default from 'react';
 function EmptyStateBody(props) {
+  var _ref$current, _ref$current$parentNo;
   const {
     emptyState: Placeholder,
+    isReady,
     reason,
     ...attributes
   } = props;
+  const ref = React__default.useRef(null);
+  if (!isReady) {
+    return /*#__PURE__*/React__default.createElement("tbody", Object.assign({}, attributes, {
+      className: "!auto-rows-fr"
+    }));
+  }
   return /*#__PURE__*/React__default.createElement("tbody", Object.assign({}, attributes, {
-    className: "!auto-rows-fr"
+    ref: ref,
+    className: "!auto-rows-fr",
+    "data-taco": "empty-state"
   }), /*#__PURE__*/React__default.createElement("tr", {
-    className: "!auto-rows-fr"
+    className: "!auto-rows-fr "
   }, /*#__PURE__*/React__default.createElement("td", {
+    style: {
+      maxWidth: ref === null || ref === void 0 ? void 0 : (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : (_ref$current$parentNo = _ref$current.parentNode) === null || _ref$current$parentNo === void 0 ? void 0 : _ref$current$parentNo.clientWidth
+    },
     className: "col-span-full !border-0 !p-0 hover:!bg-white"
   }, Placeholder ? /*#__PURE__*/React__default.createElement(Placeholder, {
     reason: reason

package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/EmptyStateBody.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyStateBody.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Body/EmptyStateBody.tsx"],"sourcesContent":["import React from 'react';\nimport { TableEmptyStateReason, TableEmptyStateRenderer } from '../../../types';\n\ntype EmptyStateProps = React.HTMLAttributes<HTMLTableSectionElement> & {\n emptyState?: TableEmptyStateRenderer;\n reason: TableEmptyStateReason;\n};\n\nexport function EmptyStateBody(props: EmptyStateProps) {\n const { emptyState: Placeholder, reason, ...attributes } = props;\n\n return (\n <tbody {...attributes} className=\"!auto-rows-fr\">\n <tr className=\"!auto-rows-fr\">\n <td className=\"col-span-full !border-0 !p-0 hover:!bg-white\">\n {Placeholder ? <Placeholder reason={reason} /> : undefined}\n </td>\n </tr>\n </tbody>\n );\n}\n"],"names":["EmptyStateBody","props","emptyState","Placeholder","reason","attributes","React","className","undefined"],"mappings":";;~~SAQgBA~~,cAAcA,CAACC,KAAsB;EACjD,MAAM;IAAEC,UAAU,EAAEC,WAAW;IAAEC,MAAM;IAAE,GAAGC;GAAY,~~GAAGJ~~,KAAK;~~EAEhE~~,~~oBACIK~~,~~wDAAWD~~,UAAU;~~IAAEE~~,SAAS,EAAC;~~mBAC7BD~~;~~IAAIC~~,SAAS,EAAC;~~kBACVD~~;~~IAAIC~~,SAAS,EAAC;~~KACTJ~~,WAAW,~~gBAAGG~~,~~6BAACH~~,WAAW;~~IAACC~~,MAAM,EAAEA;IAAU,~~GAAGI~~,SAAS,CACzD,CACJ,CACD;AAEhB;;;;"}
1	+ {"version":3,"file":"EmptyStateBody.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Body/EmptyStateBody.tsx"],"sourcesContent":["import React from 'react';\nimport { TableEmptyStateReason, TableEmptyStateRenderer } from '../../../types';\n\ntype EmptyStateProps = React.HTMLAttributes<HTMLTableSectionElement> & {\n emptyState?: TableEmptyStateRenderer;\n isReady: boolean;\n reason: TableEmptyStateReason;\n};\n\nexport function EmptyStateBody(props: EmptyStateProps) {\n const { emptyState: Placeholder, isReady, reason, ...attributes } = props;\n const ref = React.useRef<HTMLTableSectionElement>(null);\n\n if (!isReady) {\n return <tbody {...attributes} className=\"!auto-rows-fr\" />;\n }\n\n return (\n <tbody {...attributes} ref={ref} className=\"!auto-rows-fr\" data-taco=\"empty-state\">\n <tr className=\"!auto-rows-fr \">\n <td\n style={{ maxWidth: (ref?.current?.parentNode as Element)?.clientWidth }}\n className=\"col-span-full !border-0 !p-0 hover:!bg-white\">\n {Placeholder ? <Placeholder reason={reason} /> : undefined}\n </td>\n </tr>\n </tbody>\n );\n}\n"],"names":["EmptyStateBody","props","emptyState","Placeholder","isReady","reason","attributes","ref","React","useRef","className","style","maxWidth","_ref$current","current","_ref$current$parentNo","parentNode","clientWidth","undefined"],"mappings":";;SASgBA,cAAcA,CAACC,KAAsB;;EACjD,MAAM;IAAEC,UAAU,EAAEC,WAAW;IAAEC,OAAO;IAAEC,MAAM;IAAE,GAAGC;GAAY,GAAGL,KAAK;EACzE,MAAMM,GAAG,GAAGC,cAAK,CAACC,MAAM,CAA0B,IAAI,CAAC;EAEvD,IAAI,CAACL,OAAO,EAAE;IACV,oBAAOI,wDAAWF,UAAU;MAAEI,SAAS,EAAC;OAAkB;;EAG9D,oBACIF,wDAAWF,UAAU;IAAEC,GAAG,EAAEA,GAAG;IAAEG,SAAS,EAAC,eAAe;iBAAW;mBACjEF;IAAIE,SAAS,EAAC;kBACVF;IACIG,KAAK,EAAE;MAAEC,QAAQ,EAAGL,GAAG,aAAHA,GAAG,wBAAAM,YAAA,GAAHN,GAAG,CAAEO,OAAO,cAAAD,YAAA,wBAAAE,qBAAA,GAAZF,YAAA,CAAcG,UAAsB,cAAAD,qBAAA,uBAApCA,qBAAA,CAAsCE;KAAa;IACvEP,SAAS,EAAC;KACTP,WAAW,gBAAGK,6BAACL,WAAW;IAACE,MAAM,EAAEA;IAAU,GAAGa,SAAS,CACzD,CACJ,CACD;AAEhB;;;;"}

package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.js CHANGED Viewed

@@ -12,7 +12,10 @@ function GroupedCell(props) {
     index,
     isHighlighted
   } = props;
-  const tableMeta = cell.getContext().table.options.meta;
+  const {
+    table
+  } = cell.getContext();
+  const tableMeta = table.options.meta;
   const columnMeta = cell.column.columnDef.meta;
   const attributes = getCellAttributes(cell, index, isHighlighted);
   const {
@@ -21,7 +24,9 @@ function GroupedCell(props) {
   } = React__default.useContext(RowContext);
   const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;
   const canShowActions = isActiveRow || isHovered && !tableMeta.rowActive.isHoverStatePaused;
-  const colSpan = cell.row.getVisibleCells().filter(c => !isInternalColumn(c.column.id)).length - 1;
+  // Set colSpan based on the count of visible cells, including '__actions' and non-internal columns, so that
+  // rowGroupActions aligns with rowActions.
+  const colSpan = cell.row.getVisibleCells().filter(c => c.column.id === '__actions' || !isInternalColumn(c.column.id)).length - 1;
   const content = (_ref = (_columnMeta$renderer = (_columnMeta$renderer2 = columnMeta.renderer) === null || _columnMeta$renderer2 === void 0 ? void 0 : _columnMeta$renderer2.call(columnMeta, cell.getValue(), cell.row.original)) !== null && _columnMeta$renderer !== void 0 ? _columnMeta$renderer : cell.getValue()) !== null && _ref !== void 0 ? _ref : null;
   const subRows = cell.getContext().row.subRows.map(row => row.original);
   return /*#__PURE__*/React__default.createElement(MemoedGroupedCell, Object.assign({}, attributes, {
@@ -30,7 +35,8 @@ function GroupedCell(props) {
     colSpan: colSpan,
     rowActions: tableMeta.rowGroups.rowActionsForGroup,
     rowId: cell.row.id,
-    subRows: subRows
+    subRows: subRows,
+    table: table
   }), content);
 }
 const MemoedGroupedCell = /*#__PURE__*/React__default.memo(function MemoedGroupedCell(props) {
@@ -42,22 +48,29 @@ const MemoedGroupedCell = /*#__PURE__*/React__default.memo(function MemoedGroupe
     rowActions,
     rowId,
     subRows,
+    table,
     ...attributes
   } = props;
-  return /*#__PURE__*/React__default.createElement("td", Object.assign({}, attributes, {
-    ref: cellRef,
-    style: {
-      gridColumn: `span ${colSpan} / span ${colSpan}`
-    }
-  }), /*#__PURE__*/React__default.createElement("span", {
-    className: "grow"
-  }, children), rowActions !== null && rowActions !== void 0 && rowActions.length && canShowActions ? (/*#__PURE__*/React__default.createElement(Actions, {
-    actions: rowActions,
-    actionsLength: 4,
-    data: subRows,
-    isActiveRow: true,
-    rowId: rowId
-  })) : null);
+  return (
+    /*#__PURE__*/
+    // pr-1 is needed to align group row actions with row actions in sibling rows, if present
+    React__default.createElement("td", Object.assign({}, attributes, {
+      className: "!pr-1",
+      ref: cellRef,
+      style: {
+        gridColumn: `span ${colSpan} / span ${colSpan}`
+      }
+    }), /*#__PURE__*/React__default.createElement("span", {
+      className: "grow"
+    }, children), rowActions !== null && rowActions !== void 0 && rowActions.length && canShowActions ? (/*#__PURE__*/React__default.createElement(Actions, {
+      actions: rowActions,
+      actionsLength: 4,
+      data: subRows,
+      isActiveRow: true,
+      rowId: rowId,
+      table: table
+    })) : null)
+  );
 });
 export { GroupedCell };

package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GroupedCell.js","sources":["../../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { getCellAttributes } from '../util';\nimport { Actions as RowGroupActions } from '../../Internal/Actions';\nimport { isInternalColumn } from '../../../../../useTableManager/util/columns';\nimport { RowContext } from '../../../Row/RowContext';\nimport { TableRowActionGroupRenderer } from '../../../../../types';\nimport { TableCellRendererProps } from '../../../../types';\n\nexport function GroupedCell<TType = unknown>(props: TableCellRendererProps<TType>) {\n const { cell, cellRef, index, isHighlighted } = props;\n const ~~tableMeta~~ = cell.getContext().table.options.meta as ReactTableMeta<TType>;\n const columnMeta = cell.column.columnDef.meta as ReactTableColumnMeta<TType, unknown>;\n const attributes = getCellAttributes(cell, index, isHighlighted);\n\n const { isHovered, rowIndex } = React.useContext(RowContext);\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n const canShowActions = isActiveRow \|\| (isHovered && !tableMeta.rowActive.isHoverStatePaused);\n\n const colSpan = cell.row.getVisibleCells().filter(c => !isInternalColumn(c.column.id)).length - 1;\n const content = columnMeta.renderer?.(cell.getValue<TType>(), cell.row.original) ?? cell.getValue() ?? null;\n const subRows = cell.getContext().row.subRows.map(row => row.original);\n\n return (\n <MemoedGroupedCell<TType>\n {...attributes}\n canShowActions={canShowActions}\n cellRef={cellRef}\n colSpan={colSpan}\n rowActions={tableMeta.rowGroups.rowActionsForGroup}\n rowId={cell.row.id}\n subRows={subRows}>\n {content}\n </MemoedGroupedCell>\n );\n}\n\ntype MemoedGroupedCellProps<TType = unknown> = React.TdHTMLAttributes<HTMLTableCellElement> & {\n canShowActions: boolean;\n cellRef: React.RefObject<HTMLTableCellElement>;\n colSpan: number;\n rowActions?: TableRowActionGroupRenderer<TType>[];\n rowId: string;\n subRows: TType[];\n};\n\nconst MemoedGroupedCell = React.memo(function MemoedGroupedCell<TType = unknown>(props: MemoedGroupedCellProps<TType>) {\n const { canShowActions, cellRef, children, colSpan, rowActions, rowId, subRows, ...attributes } = props;\n\n return (\n <td {...attributes} ref={cellRef} style={{ gridColumn: `span ${colSpan} / span ${colSpan}` }}>\n <span className=\"grow\">{children}</span>\n {rowActions?.length && canShowActions ? (\n <RowGroupActions actions={rowActions} actionsLength={4} data={subRows} isActiveRow rowId={rowId} />\n ) : null}\n </td>\n );\n}) as <TType = unknown>(props: MemoedGroupedCellProps<TType>) => JSX.Element;\n"],"names":["GroupedCell","props","cell","cellRef","index","isHighlighted","~~tableMeta~~","getContext","~~table~~","options","meta","columnMeta","column","columnDef","attributes","getCellAttributes","isHovered","rowIndex","React","useContext","RowContext","isActiveRow","rowActive","rowActiveIndex","canShowActions","isHoverStatePaused","colSpan","row","getVisibleCells","filter","c","~~isInternalColumn~~","id","length","content","_ref","_columnMeta$renderer","_columnMeta$renderer2","renderer","call","getValue","original","subRows","map","MemoedGroupedCell","rowActions","rowGroups","rowActionsForGroup","rowId","memo","children","ref","style","gridColumn","~~className","~~RowGroupActions","actions","actionsLength","data"],"mappings":";;;;;;SASgBA,WAAWA,CAAkBC,KAAoC;;EAC7E,MAAM;IAAEC,IAAI;IAAEC,OAAO;IAAEC,KAAK;IAAEC;GAAe,GAAGJ,KAAK;EACrD,~~MAAMK~~,~~SAAS,~~GAAGJ,IAAI,CAACK,UAAU,EAAE,~~CAACC~~,KAAK,~~CAACC~~,OAAO,CAACC,IAA6B;~~EAC/E~~,MAAMC,UAAU,GAAGT,IAAI,CAACU,MAAM,CAACC,SAAS,CAACH,IAA4C;EACrF,MAAMI,UAAU,GAAGC,iBAAiB,CAACb,IAAI,EAAEE,KAAK,EAAEC,aAAa,CAAC;EAEhE,MAAM;IAAEW,SAAS;IAAEC;GAAU,GAAGC,cAAK,CAACC,UAAU,CAACC,UAAU,CAAC;EAC5D,MAAMC,WAAW,~~GAAGf~~,SAAS,~~CAACgB~~,SAAS,CAACC,cAAc,KAAKN,QAAQ;EACnE,MAAMO,cAAc,GAAGH,WAAW,IAAKL,SAAS,IAAI,~~CAACV~~,SAAS,~~CAACgB~~,SAAS,CAACG,kBAAmB~~;EAE5F~~,MAAMC,OAAO,~~GAAGxB~~,IAAI,CAACyB,GAAG,CAACC,eAAe,EAAE,CAACC,MAAM,CAACC,CAAC,IAAI,CAACC,gBAAgB,~~CAACD~~,CAAC,CAAClB,MAAM,~~CAACoB~~,EAAE,CAAC,CAAC,~~CAACC~~,MAAM,GAAG,CAAC;~~EACjG~~,MAAMC,OAAO,IAAAC,IAAA,IAAAC,oBAAA,IAAAC,qBAAA,GAAG1B,UAAU,CAAC2B,QAAQ,cAAAD,qBAAA,uBAAnBA,qBAAA,CAAAE,IAAA,CAAA5B,UAAU,EAAYT,IAAI,CAACsC,QAAQ,EAAS,EAAEtC,IAAI,CAACyB,GAAG,CAACc,QAAQ,CAAC,cAAAL,oBAAA,cAAAA,oBAAA,GAAIlC,IAAI,CAACsC,QAAQ,EAAE,cAAAL,IAAA,cAAAA,IAAA,GAAI,IAAI;EAC3G,MAAMO,OAAO,GAAGxC,IAAI,CAACK,UAAU,EAAE,CAACoB,GAAG,CAACe,OAAO,CAACC,GAAG,CAAChB,GAAG,IAAIA,GAAG,CAACc,QAAQ,CAAC;EAEtE,oBACIvB,6BAAC0B,iBAAiB,oBACV9B,UAAU;IACdU,cAAc,EAAEA,cAAc;IAC9BrB,OAAO,EAAEA,OAAO;IAChBuB,OAAO,EAAEA,OAAO;IAChBmB,UAAU,~~EAAEvC~~,SAAS,~~CAACwC~~,SAAS,CAACC,kBAAkB;IAClDC,KAAK,EAAE9C,IAAI,CAACyB,GAAG,~~CAACK~~,EAAE;~~IAClBU~~,OAAO,EAAEA;~~MACRR~~,OAAO,CACQ;AAE5B;~~AAWA~~,MAAMU,iBAAiB,gBAAG1B,cAAK,CAAC+B,IAAI,CAAC,SAASL,iBAAiBA,CAAkB3C,KAAoC;EACjH,MAAM;IAAEuB,cAAc;IAAErB,OAAO;IAAE+C,QAAQ;IAAExB,OAAO;IAAEmB,UAAU;IAAEG,KAAK;IAAEN,OAAO;IAAE,~~GAAG5B~~;GAAY,GAAGb,KAAK;~~EAEvG~~,~~oBACIiB,~~qDAAQJ,UAAU;~~IAAEqC~~,GAAG,~~EAAEhD~~,OAAO;~~IAAEiD~~,KAAK,EAAE;~~MAAEC~~,UAAU,EAAE,~~QAAQ3B~~,OAAO,WAAWA,OAAO;;~~mBACpFR~~;~~IAAMoC~~,SAAS,EAAC;~~KAAQJ~~,QAAQ,CAAQ,EACvCL,UAAU,aAAVA,UAAU,eAAVA,UAAU,CAAEZ,MAAM,IAAIT,cAAc,iBACjCN,6BAACqC,OAAe;~~IAACC~~,OAAO,EAAEX,~~UAAU~~;~~IAAEY~~,aAAa,EAAE,CAAC;~~IAAEC~~,IAAI,EAAEhB,OAAO;~~IAAErB~~,WAAW;~~IAAC2B~~,KAAK,EAAEA;~~IAAS~~,~~IACnG~~,IAAI,~~CACP;AAEb,~~CAAC,CAA2E;;;;"}
1	+ {"version":3,"file":"GroupedCell.js","sources":["../../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Cell/BuiltIns/GroupedCell.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { getCellAttributes } from '../util';\nimport { Actions as RowGroupActions } from '../../Internal/Actions';\nimport { isInternalColumn } from '../../../../../useTableManager/util/columns';\nimport { RowContext } from '../../../Row/RowContext';\nimport { TableRowActionGroupRenderer } from '../../../../../types';\nimport { TableCellRendererProps } from '../../../../types';\n\nexport function GroupedCell<TType = unknown>(props: TableCellRendererProps<TType>) {\n const { cell, cellRef, index, isHighlighted } = props;\n const { table } = cell.getContext();\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const columnMeta = cell.column.columnDef.meta as ReactTableColumnMeta<TType, unknown>;\n const attributes = getCellAttributes(cell, index, isHighlighted);\n\n const { isHovered, rowIndex } = React.useContext(RowContext);\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n const canShowActions = isActiveRow \|\| (isHovered && !tableMeta.rowActive.isHoverStatePaused);\n\n // Set colSpan based on the count of visible cells, including '__actions' and non-internal columns, so that\n // rowGroupActions aligns with rowActions.\n const colSpan =\n cell.row.getVisibleCells().filter(c => c.column.id === '__actions' \|\| !isInternalColumn(c.column.id)).length - 1;\n const content = columnMeta.renderer?.(cell.getValue<TType>(), cell.row.original) ?? cell.getValue() ?? null;\n const subRows = cell.getContext().row.subRows.map(row => row.original);\n\n return (\n <MemoedGroupedCell<TType>\n {...attributes}\n canShowActions={canShowActions}\n cellRef={cellRef}\n colSpan={colSpan}\n rowActions={tableMeta.rowGroups.rowActionsForGroup}\n rowId={cell.row.id}\n subRows={subRows}\n table={table}>\n {content}\n </MemoedGroupedCell>\n );\n}\n\ntype MemoedGroupedCellProps<TType = unknown> = React.TdHTMLAttributes<HTMLTableCellElement> & {\n canShowActions: boolean;\n cellRef: React.RefObject<HTMLTableCellElement>;\n colSpan: number;\n rowActions?: TableRowActionGroupRenderer<TType>[];\n rowId: string;\n subRows: TType[];\n table: ReactTable<TType>;\n};\n\nconst MemoedGroupedCell = React.memo(function MemoedGroupedCell<TType = unknown>(props: MemoedGroupedCellProps<TType>) {\n const { canShowActions, cellRef, children, colSpan, rowActions, rowId, subRows, table, ...attributes } = props;\n\n return (\n // pr-1 is needed to align group row actions with row actions in sibling rows, if present\n <td {...attributes} className=\"!pr-1\" ref={cellRef} style={{ gridColumn: `span ${colSpan} / span ${colSpan}` }}>\n <span className=\"grow\">{children}</span>\n {rowActions?.length && canShowActions ? (\n <RowGroupActions<TType>\n actions={rowActions as any}\n actionsLength={4}\n data={subRows}\n isActiveRow\n rowId={rowId}\n table={table}\n />\n ) : null}\n </td>\n );\n}) as <TType = unknown>(props: MemoedGroupedCellProps<TType>) => JSX.Element;\n"],"names":["GroupedCell","props","cell","cellRef","index","isHighlighted","table","getContext","tableMeta","options","meta","columnMeta","column","columnDef","attributes","getCellAttributes","isHovered","rowIndex","React","useContext","RowContext","isActiveRow","rowActive","rowActiveIndex","canShowActions","isHoverStatePaused","colSpan","row","getVisibleCells","filter","c","id","isInternalColumn","length","content","_ref","_columnMeta$renderer","_columnMeta$renderer2","renderer","call","getValue","original","subRows","map","MemoedGroupedCell","rowActions","rowGroups","rowActionsForGroup","rowId","memo","children","className","ref","style","gridColumn","RowGroupActions","actions","actionsLength","data"],"mappings":"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"}

package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js CHANGED Viewed

@@ -12,12 +12,14 @@ function Actions(props) {
     actionsLength,
     data,
     isActiveRow,
-    rowId
+    rowId,
+    table
   } = props;
   const {
     texts
   } = useLocalization();
-  const visibleActions = actions.map(action => action(data, rowId)).filter(action => !!action);
+  // we don't want to document passing table, so it isn't on the type
+  const visibleActions = actions.map(action => action(data, rowId, table)).filter(action => !!action);
   const actionsOnRow = visibleActions.length === actionsLength ? visibleActions : visibleActions.slice(0, actionsLength - 1);
   const actionsInMenu = visibleActions.slice(visibleActions.length === actionsLength ? actionsLength : actionsLength - 1);
   const className = cn('flex justify-end text-right bg-[inherit] shadow-[-6px_0px_6px_var(--table-row-actions-shadow)] print:hidden');
@@ -56,6 +58,7 @@ const Cell = /*#__PURE__*/React__default.memo(function MemoedCell(context) {
     table
   } = context;
   const {
+    hideRowActions,
     isHovered,
     rowIndex
   } = React__default.useContext(RowContext);
@@ -65,15 +68,15 @@ const Cell = /*#__PURE__*/React__default.memo(function MemoedCell(context) {
   const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;
   const isResizingColumn = !!table.getState().columnSizingInfo.isResizingColumn;
   const isHoverStatePaused = tableMeta.rowActive.isHoverStatePaused;
-  // We don't want to show actions in edit mode, since we have editing actions,
-  // which is shown in edit mode instead.
-  if (actions !== null && actions !== void 0 && actions.length && (isActiveRow || isHovered && !isHoverStatePaused && !isResizingColumn)) {
+  const isRowGrouped = row.getIsGrouped();
+  if (!hideRowActions && !isRowGrouped && actions !== null && actions !== void 0 && actions.length && (isActiveRow || isHovered && !isHoverStatePaused && !isResizingColumn)) {
     return /*#__PURE__*/React__default.createElement(Actions, {
       actions: actions,
       actionsLength: actionsLength,
       data: row.original,
       isActiveRow: isActiveRow,
-      rowId: row.id
+      rowId: row.id,
+      table: table
     });
   }
   return null;

package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Actions.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Actions.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Actions.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext as ReactTableCellContext, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { IconButton } from '../../../../../../components/IconButton/IconButton';\nimport { Menu } from '../../../../../../components/Menu/Menu';\nimport { Shortcut } from '../../../../../../components/Shortcut/Shortcut';\nimport { ~~TableRowActionRenderer~~ } from '~~../../../../types~~';\nimport { ~~RowContext~~ } from '~~../../Row~~/~~RowContext~~';\nimport { ~~useTableManagerInternalColumn~~ } from '../../../../~~useTableManager/~~types';\n\nexport type ActionsProps<TType = unknown> = {\n actions: TableRowActionRenderer<TType>[];\n actionsLength: number;\n data: any;\n isActiveRow: boolean;\n rowId: string;\n};\nexport function Actions<TType = unknown>(props: ActionsProps<TType>) {\n const { actions, actionsLength, data, isActiveRow, rowId } = props;\n const { texts } = useLocalization();\n const visibleActions = actions.map(action => action(data, rowId)).filter(action => !!action) as JSX.Element[];\n\n const actionsOnRow = visibleActions.length === actionsLength ? visibleActions : visibleActions.slice(0, actionsLength - 1);\n const actionsInMenu = visibleActions.slice(visibleActions.length === actionsLength ? actionsLength : actionsLength - 1);\n\n const className = cn(\n 'flex justify-end text-right bg-[inherit] shadow-[-6px_0px_6px_var(--table-row-actions-shadow)] print:hidden'\n );\n\n return (\n <span className={className}>\n {actionsOnRow.map((button, index) => {\n const tooltip = String(button.props.tooltip ?? button.props['aria-label'] ?? '');\n\n return React.cloneElement(button, {\n appearance: 'transparent',\n key: index,\n tabIndex: isActiveRow ? 0 : -1,\n tooltip: button.props.shortcut ? (\n <>\n {tooltip}\n <Shortcut className=\"ml-2\" keys={button.props.shortcut} />\n </>\n ) : (\n tooltip\n ),\n });\n })}\n {actionsInMenu.length ? (\n <IconButton\n appearance=\"transparent\"\n aria-label={texts.table.columns.actions.tooltip}\n icon=\"more\"\n tabIndex={isActiveRow ? 0 : -1}\n menu={menuProps => (\n <Menu {...menuProps}>\n <Menu.Content>\n {actionsInMenu.map((action, i) => (\n <Menu.Item key={i} {...action.props} shortcut={action.props.shortcut}>\n {action.props['aria-label']}\n </Menu.Item>\n ))}\n </Menu.Content>\n </Menu>\n )}\n />\n ) : null}\n </span>\n );\n}\n\nfunction Header() {\n return null;\n}\n\nconst Cell = React.memo(function MemoedCell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { row, table } = context;\n const { isHovered, rowIndex } = React.useContext(RowContext);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n const actions = tableMeta.rowActions.rowActions;\n const actionsLength = tableMeta.rowActions.rowActionsLength;\n\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n const isResizingColumn = !!table.getState().columnSizingInfo.isResizingColumn;\n const isHoverStatePaused = tableMeta.rowActive.isHoverStatePaused;\n\n // We ~~don't~~ ~~want to show actions in edit mode, since we have editing actions,\~~n // ~~which~~ is ~~shown in edit mode instead.\~~n ~~if (~~actions?.length && (isActiveRow \|\| (isHovered && !isHoverStatePaused && !isResizingColumn))) {\n return (\n <Actions\n actions={actions}\n actionsLength={actionsLength}\n data={row.original}\n isActiveRow={isActiveRow}\n rowId={row.id}\n />\n );\n }\n\n return null;\n}) as <TType = unknown>(context: ReactTableCellContext<TType, unknown>) => JSX.Element;\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n meta: {\n align: 'right',\n className: cn(\n 'print:opacity-0 !px-0 !pr-1 overflow-hidden [table_&]:group-[[data-row-active=\"true\"]]/row:sticky right-0',\n 'group-[[data-row-active=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n 'group-[[data-row-selected=\"true\"]]/row:text-blue-100',\n 'group-[[data-row-selected=\"false\"]:hover]/row:text-grey-100'\n ),\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n },\n};\n"],"names":["Actions","props","actions","actionsLength","data","isActiveRow","rowId","texts","useLocalization","visibleActions","map","action","filter","actionsOnRow","length","slice","actionsInMenu","className","cn","React","button","index","tooltip","String","_ref","_button$props$tooltip","cloneElement","appearance","key","tabIndex","shortcut","Shortcut","keys","IconButton","~~table","~~columns","icon","menu","menuProps","Menu","Content","i","Item","Header","Cell","memo","MemoedCell","context","row","isHovered","rowIndex","useContext","RowContext","tableMeta","options","meta","rowActions","rowActionsLength","rowActive","rowActiveIndex","isResizingColumn","getState","columnSizingInfo","isHoverStatePaused","original","id","renderer","header","align","enableSearch"],"mappings":";;;;;;;;~~SAkBgBA~~,OAAOA,CAAkBC,KAA0B;EAC/D,MAAM;IAAEC,OAAO;IAAEC,aAAa;IAAEC,IAAI;IAAEC,WAAW;IAAEC;GAAO,~~GAAGL~~,KAAK;~~EAClE~~,MAAM;~~IAAEM~~;GAAO,GAAGC,eAAe,EAAE~~;EACnC~~,MAAMC,cAAc,~~GAAGP~~,~~OAAO~~,~~CAACQ~~,GAAG,CAACC,MAAM,IAAIA,MAAM,~~CAACP~~,IAAI,EAAEE,KAAK,CAAC,CAAC,~~CAACM~~,MAAM,CAACD,MAAM,IAAI,CAAC,CAACA,MAAM,CAAkB;~~EAE7G~~,MAAME,YAAY,GAAGJ,cAAc,CAACK,MAAM,~~KAAKX~~,aAAa,~~GAAGM~~,cAAc,GAAGA,cAAc,CAACM,KAAK,CAAC,CAAC,~~EAAEZ~~,aAAa,GAAG,CAAC,CAAC;EAC1H,~~MAAMa~~,aAAa,GAAGP,cAAc,CAACM,KAAK,CAACN,cAAc,CAACK,MAAM,~~KAAKX~~,aAAa,GAAGA,aAAa,GAAGA,aAAa,GAAG,CAAC,CAAC;EAEvH,~~MAAMc~~,SAAS,GAAGC,EAAE,CAChB,6GAA6G,CAChH;EAED,oBACIC;IAAMF,SAAS,EAAEA;KACZJ,YAAY,CAACH,GAAG,CAAC,CAACU,MAAM,EAAEC,KAAK;;IAC5B,MAAMC,OAAO,GAAGC,MAAM,EAAAC,IAAA,IAAAC,qBAAA,GAACL,MAAM,~~CAACnB~~,KAAK,~~CAACqB~~,OAAO,cAAAG,qBAAA,cAAAA,qBAAA,GAAIL,MAAM,~~CAACnB~~,KAAK,CAAC,YAAY,CAAC,~~cAAAuB~~,IAAA,cAAAA,IAAA,GAAI,EAAE,CAAC;IAEhF,oBAAOL,cAAK,CAACO,YAAY,CAACN,MAAM,EAAE;MAC9BO,UAAU,EAAE,aAAa;MACzBC,GAAG,EAAEP,KAAK;MACVQ,QAAQ,~~EAAExB~~,WAAW,GAAG,CAAC,GAAG,CAAC,CAAC;~~MAC9BiB~~,OAAO,EAAEF,MAAM,~~CAACnB~~,KAAK,~~CAAC6B~~,QAAQ,iBAC1BX,4DACKG,OAAO,eACRH,6BAACY,QAAQ;QAACd,SAAS,EAAC,MAAM;QAACe,IAAI,EAAEZ,MAAM,~~CAACnB~~,KAAK,~~CAAC6B~~;QAAY,CAC3D,IAEHR;KAEP,CAAC;GACL,CAAC,EACDN,aAAa,CAACF,MAAM,iBACjBK,6BAACc,UAAU;IACPN,UAAU,EAAC,aAAa;kBACZpB,KAAK,~~CAAC2B~~,KAAK,~~CAACC~~,OAAO,CAACjC,OAAO,~~CAACoB~~,OAAO;IAC/Cc,IAAI,EAAC,MAAM;~~IACXP~~,QAAQ,~~EAAExB~~,WAAW,GAAG,CAAC,GAAG,CAAC,CAAC;IAC9BgC,IAAI,EAAEC,SAAS,~~kBACXnB~~,~~6BAACoB~~,IAAI,oBAAKD,SAAS,~~gBACfnB~~,~~6BAACoB~~,IAAI,CAACC,OAAO,~~QACRxB~~,aAAa,CAACN,GAAG,CAAC,CAACC,MAAM,~~EAAE8B~~,CAAC,~~mBACzBtB~~,~~6BAACoB~~,IAAI,CAACG,IAAI;~~MAACd~~,GAAG,~~EAAEa~~;~~OAAO9B~~,MAAM,~~CAACV~~,KAAK;~~MAAE6B~~,QAAQ,EAAEnB,MAAM,~~CAACV~~,KAAK,~~CAAC6B~~;QACvDnB,MAAM,~~CAACV~~,KAAK,CAAC,YAAY,CAAC,CACnB,CACf,CAAC,CACS,CACZ;IAEb,IACF,IAAI,CACL;AAEf;AAEA,SAAS0C,MAAMA;EACX,OAAO,IAAI;AACf;AAEA,MAAMC,IAAI,~~gBAAGzB~~,cAAK,~~CAAC0B~~,IAAI,CAAC,SAASC,UAAUA,CAAkBC,OAA8C;EACvG,MAAM;IAAEC,GAAG;~~IAAEd~~;GAAO,~~GAAGa~~,OAAO;EAC9B,MAAM;IAAEE,SAAS;IAAEC;GAAU,GAAG/B,cAAK,CAACgC,UAAU,CAACC,UAAU,CAAC;~~EAC5D~~,MAAMC,SAAS,~~GAAGnB~~,KAAK,~~CAACoB~~,OAAO,CAACC,IAA6B;EAE7D,~~MAAMrD~~,OAAO,~~GAAGmD~~,SAAS,CAACG,UAAU,CAACA,UAAU;EAC/C,~~MAAMrD~~,aAAa,~~GAAGkD~~,SAAS,CAACG,UAAU,CAACC,gBAAgB;EAE3D,~~MAAMpD~~,WAAW,~~GAAGgD~~,SAAS,CAACK,SAAS,CAACC,cAAc,KAAKT,QAAQ;EACnE,MAAMU,gBAAgB,GAAG,CAAC,~~CAAC1B~~,KAAK,~~CAAC2B~~,QAAQ,EAAE,CAACC,gBAAgB,CAACF,gBAAgB;EAC7E,MAAMG,kBAAkB,GAAGV,SAAS,CAACK,SAAS,CAACK,kBAAkB~~;;;EAIjE~~,~~IAAI7D~~,OAAO,aAAPA,OAAO,eAAPA,OAAO,~~CAAEY~~,MAAM,~~KAAKT~~,WAAW,~~IAAK4C~~,SAAS,IAAI,CAACc,kBAAkB,IAAI,CAACH,gBAAiB,CAAC,~~EAAE~~;~~IAC7F~~,oBACIzC,~~6BAACnB~~,OAAO;MACJE,OAAO,EAAEA,OAAO;MAChBC,aAAa,EAAEA,aAAa;MAC5BC,IAAI,EAAE4C,GAAG,~~CAACgB~~,QAAQ;~~MAClB3D~~,WAAW,EAAEA,WAAW;MACxBC,KAAK,EAAE0C,GAAG,~~CAACiB~~;~~MACb~~;;EAIV,OAAO,IAAI;AACf,CAAC,CAAqF;~~MAEzEC~~,QAAQ,GAAkC;EACnDC,MAAM,~~EAAExB~~,MAAM;~~EACduB~~,QAAQ,~~EAAEtB~~,IAAI;~~EACdW~~,IAAI,EAAE;~~IACFa~~,KAAK,EAAE,OAAO;~~IACdnD~~,SAAS,eAAEC,EAAE,CACT,2GAA2G,EAC3G,2EAA2E,EAC3E,sDAAsD,EACtD,6DAA6D,CAChE;;~~IAEDmD~~,YAAY,EAAE,KAAK;IACnBF,MAAM,EAAE;;;;;;"}
1	+ {"version":3,"file":"Actions.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Actions.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, CellContext as ReactTableCellContext, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { IconButton } from '../../../../../../components/IconButton/IconButton';\nimport { Menu } from '../../../../../../components/Menu/Menu';\nimport { Shortcut } from '../../../../../../components/Shortcut/Shortcut';\nimport { RowContext } from '../../Row/RowContext';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\nimport { TableRowActionRenderer } from '../../../../types';\n\nexport type ActionsProps<TType = unknown> = {\n actions: TableRowActionRenderer<TType>[];\n actionsLength: number;\n data: any;\n isActiveRow: boolean;\n rowId: string;\n table: ReactTable<TType>;\n};\nexport function Actions<TType = unknown>(props: ActionsProps<TType>) {\n const { actions, actionsLength, data, isActiveRow, rowId, table } = props;\n const { texts } = useLocalization();\n // we don't want to document passing table, so it isn't on the type\n const visibleActions = (actions as ((row: TType, internalRowId: string, table: ReactTable<TType>) => JSX.Element \| null)[])\n .map(action => action(data, rowId, table))\n .filter(action => !!action) as JSX.Element[];\n\n const actionsOnRow = visibleActions.length === actionsLength ? visibleActions : visibleActions.slice(0, actionsLength - 1);\n const actionsInMenu = visibleActions.slice(visibleActions.length === actionsLength ? actionsLength : actionsLength - 1);\n\n const className = cn(\n 'flex justify-end text-right bg-[inherit] shadow-[-6px_0px_6px_var(--table-row-actions-shadow)] print:hidden'\n );\n\n return (\n <span className={className}>\n {actionsOnRow.map((button, index) => {\n const tooltip = String(button.props.tooltip ?? button.props['aria-label'] ?? '');\n\n return React.cloneElement(button, {\n appearance: 'transparent',\n key: index,\n tabIndex: isActiveRow ? 0 : -1,\n tooltip: button.props.shortcut ? (\n <>\n {tooltip}\n <Shortcut className=\"ml-2\" keys={button.props.shortcut} />\n </>\n ) : (\n tooltip\n ),\n });\n })}\n {actionsInMenu.length ? (\n <IconButton\n appearance=\"transparent\"\n aria-label={texts.table.columns.actions.tooltip}\n icon=\"more\"\n tabIndex={isActiveRow ? 0 : -1}\n menu={menuProps => (\n <Menu {...menuProps}>\n <Menu.Content>\n {actionsInMenu.map((action, i) => (\n <Menu.Item key={i} {...action.props} shortcut={action.props.shortcut}>\n {action.props['aria-label']}\n </Menu.Item>\n ))}\n </Menu.Content>\n </Menu>\n )}\n />\n ) : null}\n </span>\n );\n}\n\nfunction Header() {\n return null;\n}\n\nconst Cell = React.memo(function MemoedCell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { row, table } = context;\n const { hideRowActions, isHovered, rowIndex } = React.useContext(RowContext);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n const actions = tableMeta.rowActions.rowActions;\n const actionsLength = tableMeta.rowActions.rowActionsLength;\n\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n const isResizingColumn = !!table.getState().columnSizingInfo.isResizingColumn;\n const isHoverStatePaused = tableMeta.rowActive.isHoverStatePaused;\n const isRowGrouped = row.getIsGrouped();\n\n if (\n !hideRowActions &&\n !isRowGrouped &&\n actions?.length &&\n (isActiveRow \|\| (isHovered && !isHoverStatePaused && !isResizingColumn))\n ) {\n return (\n <Actions<TType>\n actions={actions}\n actionsLength={actionsLength}\n data={row.original}\n isActiveRow={isActiveRow}\n rowId={row.id}\n table={table}\n />\n );\n }\n\n return null;\n}) as <TType = unknown>(context: ReactTableCellContext<TType, unknown>) => JSX.Element;\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n meta: {\n align: 'right',\n className: cn(\n 'print:opacity-0 !px-0 !pr-1 overflow-hidden [table_&]:group-[[data-row-active=\"true\"]]/row:sticky right-0',\n 'group-[[data-row-active=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n 'group-[[data-row-selected=\"true\"]]/row:text-blue-100',\n 'group-[[data-row-selected=\"false\"]:hover]/row:text-grey-100'\n ),\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n },\n};\n"],"names":["Actions","props","actions","actionsLength","data","isActiveRow","rowId","table","texts","useLocalization","visibleActions","map","action","filter","actionsOnRow","length","slice","actionsInMenu","className","cn","React","button","index","tooltip","String","_ref","_button$props$tooltip","cloneElement","appearance","key","tabIndex","shortcut","Shortcut","keys","IconButton","columns","icon","menu","menuProps","Menu","Content","i","Item","Header","Cell","memo","MemoedCell","context","row","hideRowActions","isHovered","rowIndex","useContext","RowContext","tableMeta","options","meta","rowActions","rowActionsLength","rowActive","rowActiveIndex","isResizingColumn","getState","columnSizingInfo","isHoverStatePaused","isRowGrouped","getIsGrouped","original","id","renderer","header","align","enableSearch"],"mappings":"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"}

package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Drag.js CHANGED Viewed

@@ -2,6 +2,7 @@ import React__default from 'react';
 import cn from 'clsx';
 import { Icon } from '../../../../../../components/Icon/Icon.js';
 import { useLocalization } from '../../../../../../components/Provider/Localization.js';
+import { RowContext } from '../../Row/RowContext.js';
 function Header() {
   return null;
@@ -10,6 +11,12 @@ function Cell() {
   const {
     texts
   } = useLocalization();
+  const {
+    hideInternalColumns
+  } = React__default.useContext(RowContext);
+  if (hideInternalColumns) {
+    return null;
+  }
   return /*#__PURE__*/React__default.createElement(Icon, {
     "aria-label": texts.table.columns.drag.tooltip,
     name: "drag",