@economic/taco 2.40.2 → 2.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/OverflowGroup/OverflowGroup.d.ts +1 -0
- package/dist/components/Tabs/Tabs.d.ts +5 -0
- package/dist/esm/index.css +2 -2
- package/dist/esm/packages/taco/src/components/BadgeIcon/BadgeIcon.js +1 -1
- package/dist/esm/packages/taco/src/components/BadgeIcon/BadgeIcon.js.map +1 -1
- package/dist/esm/packages/taco/src/components/OverflowGroup/OverflowGroup.js +3 -1
- package/dist/esm/packages/taco/src/components/OverflowGroup/OverflowGroup.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Search.js +0 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Search.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Cell.js +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/Cell.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js +1 -1
- package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Tabs/Tabs.js +17 -3
- package/dist/esm/packages/taco/src/components/Tabs/Tabs.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Drag.js +5 -44
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Drag.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Selection.js +8 -5
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Selection.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Footer/Summary.js +2 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Footer/Summary.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Menu.js +3 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Menu.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Resizer.js +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Resizer.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/BuiltIns/DisplayRow.js +33 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Row/BuiltIns/DisplayRow.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableStyleGrid.js +2 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/features/useTableStyleGrid.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/types.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableRowSelection.js +4 -3
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/features/useTableRowSelection.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/listeners/useTableRowSelectionListener.js +13 -10
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/listeners/useTableRowSelectionListener.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/listeners/useTableSearchListener.js +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/listeners/useTableSearchListener.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js +8 -6
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/useTableManager.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/presets.js +2 -2
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/presets.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js +7 -2
- package/dist/esm/packages/taco/src/primitives/Table/useTableManager/util/setup.js.map +1 -1
- package/dist/index.css +2 -2
- package/dist/primitives/Table/types.d.ts +7 -4
- package/dist/primitives/Table/useTableManager/useTableManager.d.ts +1 -0
- package/dist/taco.cjs.development.js +107 -85
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -2
|
@@ -2,4 +2,5 @@ import React from 'react';
|
|
|
2
2
|
import { ButtonProps } from '../Button/Button';
|
|
3
3
|
export declare const OverflowGroup: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
|
|
4
4
|
moreButton?: ((moreButtonText: string) => React.ReactElement<ButtonProps>) | undefined;
|
|
5
|
+
wrapChild?: true | undefined;
|
|
5
6
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -44,6 +44,11 @@ export declare type TabContentProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
|
44
44
|
* A unique value that associates the content with a trigger.
|
|
45
45
|
*/
|
|
46
46
|
id: string;
|
|
47
|
+
/**
|
|
48
|
+
* Used to force mounting when more control is needed. Useful when
|
|
49
|
+
* controlling animation with React animation libraries.
|
|
50
|
+
*/
|
|
51
|
+
forceMount?: true;
|
|
47
52
|
};
|
|
48
53
|
export declare type ForwardedTabsWithStatics = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>> & {
|
|
49
54
|
/** Tab list component containing all tab triggers, rendered in a `Tabs` group component */
|
package/dist/esm/index.css
CHANGED
|
@@ -591,7 +591,7 @@ table[data-taco^='table'] thead tr:not(:last-child) th:before {
|
|
|
591
591
|
|
|
592
592
|
table[data-taco^='table'] tfoot {
|
|
593
593
|
/* z-indexes & layout */
|
|
594
|
-
@apply sticky bottom-0 isolate z-20;
|
|
594
|
+
@apply sticky bottom-0 isolate z-20 print:!static;
|
|
595
595
|
/* grid */
|
|
596
596
|
@apply col-span-full grid grid-cols-[subgrid];
|
|
597
597
|
}
|
|
@@ -665,7 +665,7 @@ table[data-taco^='table'] th {
|
|
|
665
665
|
}
|
|
666
666
|
|
|
667
667
|
table[data-taco^='table'] th:not([data-cell-placeholder='true']):hover {
|
|
668
|
-
@apply bg-grey-100;
|
|
668
|
+
@apply bg-grey-100 print:bg-white;
|
|
669
669
|
}
|
|
670
670
|
|
|
671
671
|
table[data-taco^='table'] th[aria-sort]:hover {
|
|
@@ -11,7 +11,7 @@ const BadgeIcon = /*#__PURE__*/forwardRef(function Badge(props, ref) {
|
|
|
11
11
|
small,
|
|
12
12
|
...otherProps
|
|
13
13
|
} = props;
|
|
14
|
-
const className = cn(`rounded-full border overflow-hidden whitespace-nowrap inline-flex items-center justify-center border-transparent [&>*]:max-h-full`, {
|
|
14
|
+
const className = cn(`rounded-full border overflow-hidden whitespace-nowrap inline-flex items-center justify-center border-transparent [&>*]:max-h-full shrink-0`, {
|
|
15
15
|
'w-5 h-5': !small
|
|
16
16
|
}, {
|
|
17
17
|
'w-4 h-4 text-xs': small
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BadgeIcon.js","sources":["../../../../../../../src/components/BadgeIcon/BadgeIcon.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { getSubtleColorShadeClasses, getColorShadeClasses } from '../../utils/tailwind';\nimport { Icon, IconName } from '../Icon/Icon';\nimport { Color } from '../../types';\n\nexport type BadgeIconProps = React.HTMLAttributes<HTMLSpanElement> & {\n /** Icon type **/\n icon: IconName;\n /** Background color **/\n color?: Color;\n /** Show subtle version **/\n subtle?: boolean;\n /** Show small version of badge icon **/\n small?: boolean;\n};\n\nexport const BadgeIcon = React.forwardRef(function Badge(props: BadgeIconProps, ref: React.Ref<HTMLSpanElement>) {\n const { color, icon, subtle, small, ...otherProps } = props;\n\n const className = cn(\n `rounded-full border overflow-hidden whitespace-nowrap inline-flex items-center justify-center border-transparent [&>*]:max-h-full`,\n { 'w-5 h-5': !small },\n { 'w-4 h-4 text-xs': small },\n { [getSubtleColorShadeClasses(color)]: subtle, [getColorShadeClasses(color)]: !subtle },\n props.className\n );\n\n const iconProps = {\n strokeWidth: 1,\n stroke: 'currentColor',\n };\n\n return (\n <span\n {...otherProps}\n aria-label=\"icon\"\n className={className}\n data-taco=\"badge-icon\"\n ref={ref}\n role=\"status\"\n title={props['aria-label']}>\n <Icon name={icon} {...iconProps} />\n </span>\n );\n});\n"],"names":["BadgeIcon","React","Badge","props","ref","color","icon","subtle","small","otherProps","className","cn","getSubtleColorShadeClasses","getColorShadeClasses","iconProps","strokeWidth","stroke","role","title","Icon","name"],"mappings":";;;;;MAiBaA,SAAS,gBAAGC,UAAgB,CAAC,SAASC,KAAKA,CAACC,KAAqB,EAAEC,GAA+B;EAC3G,MAAM;IAAEC,KAAK;IAAEC,IAAI;IAAEC,MAAM;IAAEC,KAAK;IAAE,GAAGC;GAAY,GAAGN,KAAK;EAE3D,MAAMO,SAAS,GAAGC,EAAE,CAChB,
|
|
1
|
+
{"version":3,"file":"BadgeIcon.js","sources":["../../../../../../../src/components/BadgeIcon/BadgeIcon.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { getSubtleColorShadeClasses, getColorShadeClasses } from '../../utils/tailwind';\nimport { Icon, IconName } from '../Icon/Icon';\nimport { Color } from '../../types';\n\nexport type BadgeIconProps = React.HTMLAttributes<HTMLSpanElement> & {\n /** Icon type **/\n icon: IconName;\n /** Background color **/\n color?: Color;\n /** Show subtle version **/\n subtle?: boolean;\n /** Show small version of badge icon **/\n small?: boolean;\n};\n\nexport const BadgeIcon = React.forwardRef(function Badge(props: BadgeIconProps, ref: React.Ref<HTMLSpanElement>) {\n const { color, icon, subtle, small, ...otherProps } = props;\n\n const className = cn(\n `rounded-full border overflow-hidden whitespace-nowrap inline-flex items-center justify-center border-transparent [&>*]:max-h-full shrink-0`,\n { 'w-5 h-5': !small },\n { 'w-4 h-4 text-xs': small },\n { [getSubtleColorShadeClasses(color)]: subtle, [getColorShadeClasses(color)]: !subtle },\n props.className\n );\n\n const iconProps = {\n strokeWidth: 1,\n stroke: 'currentColor',\n };\n\n return (\n <span\n {...otherProps}\n aria-label=\"icon\"\n className={className}\n data-taco=\"badge-icon\"\n ref={ref}\n role=\"status\"\n title={props['aria-label']}>\n <Icon name={icon} {...iconProps} />\n </span>\n );\n});\n"],"names":["BadgeIcon","React","Badge","props","ref","color","icon","subtle","small","otherProps","className","cn","getSubtleColorShadeClasses","getColorShadeClasses","iconProps","strokeWidth","stroke","role","title","Icon","name"],"mappings":";;;;;MAiBaA,SAAS,gBAAGC,UAAgB,CAAC,SAASC,KAAKA,CAACC,KAAqB,EAAEC,GAA+B;EAC3G,MAAM;IAAEC,KAAK;IAAEC,IAAI;IAAEC,MAAM;IAAEC,KAAK;IAAE,GAAGC;GAAY,GAAGN,KAAK;EAE3D,MAAMO,SAAS,GAAGC,EAAE,CAChB,4IAA4I,EAC5I;IAAE,SAAS,EAAE,CAACH;GAAO,EACrB;IAAE,iBAAiB,EAAEA;GAAO,EAC5B;IAAE,CAACI,0BAA0B,CAACP,KAAK,CAAC,GAAGE,MAAM;IAAE,CAACM,oBAAoB,CAACR,KAAK,CAAC,GAAG,CAACE;GAAQ,EACvFJ,KAAK,CAACO,SAAS,CAClB;EAED,MAAMI,SAAS,GAAG;IACdC,WAAW,EAAE,CAAC;IACdC,MAAM,EAAE;GACX;EAED,oBACIf,wCACQQ,UAAU;kBACH,MAAM;IACjBC,SAAS,EAAEA,SAAS;iBACV,YAAY;IACtBN,GAAG,EAAEA,GAAG;IACRa,IAAI,EAAC,QAAQ;IACbC,KAAK,EAAEf,KAAK,CAAC,YAAY;mBACzBF,cAACkB,IAAI;IAACC,IAAI,EAAEd;KAAUQ,SAAS,EAAI,CAChC;AAEf,CAAC;;;;"}
|
|
@@ -73,7 +73,9 @@ const OverflowGroup = /*#__PURE__*/React__default.forwardRef(function OverflowGr
|
|
|
73
73
|
})), hiddenChildren.length ? /*#__PURE__*/React__default.cloneElement(MoreButton, {
|
|
74
74
|
className: cn('sticky right-0 order-[99]', MoreButton.props.className),
|
|
75
75
|
'data-observer-ignore': true,
|
|
76
|
-
menu: menuProps => (/*#__PURE__*/React__default.createElement(Menu, Object.assign({}, menuProps), /*#__PURE__*/React__default.createElement(Menu.Content, null, hiddenChildren.map(
|
|
76
|
+
menu: menuProps => (/*#__PURE__*/React__default.createElement(Menu, Object.assign({}, menuProps), /*#__PURE__*/React__default.createElement(Menu.Content, null, hiddenChildren.map((child, index) => props.wrapChild ? (/*#__PURE__*/React__default.createElement(Menu.Item, {
|
|
77
|
+
key: index
|
|
78
|
+
}, child)) : sanitizeButtonPropsForMenuItem(child, index))))),
|
|
77
79
|
ref: buttonRefCallback
|
|
78
80
|
}) : null);
|
|
79
81
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverflowGroup.js","sources":["../../../../../../../src/components/OverflowGroup/OverflowGroup.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { ButtonProps } from '../Button/Button';\nimport { Menu } from '../Menu/Menu';\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { IconButton } from '../IconButton/IconButton';\nimport { useLocalization } from '../Provider/Localization';\n\nconst sanitizeButtonPropsForMenuItem = (button: any, index) => {\n const href: string | undefined = button.props.to || button.props.href;\n const Tag = href ? Menu.Link : Menu.Item;\n\n // Removing className prop so that custom styling cannot be applied on Menu.Link\n const {\n as,\n className: _,\n appearance: _1,\n drawer: _2,\n fluid: _3,\n hanger: _4,\n menu: _5,\n popover: _6,\n tooltip: _7,\n ...attributes\n } = button.props;\n\n const props = {\n ...attributes,\n key: index,\n target: href ? (href.startsWith('http') ? '_blank' : '_self') : undefined,\n };\n\n if (as) {\n return React.cloneElement(button, { as: Tag, ...props });\n }\n\n return <Tag {...props} />;\n};\n\ntype OverflowGroupProps = React.HTMLAttributes<HTMLElement> & {\n moreButton?: (moreButtonText: string) => React.ReactElement<ButtonProps>;\n};\n\nconst DEFAULT_OFFSET = 32 + 8;\n\nexport const OverflowGroup = React.forwardRef(function OverflowGroup(props: OverflowGroupProps, ref: React.Ref<HTMLDivElement>) {\n const { moreButton, ...attributes } = props;\n const internalRef = useMergedRef<HTMLDivElement>(ref);\n // determine width of more button, to add intersection observer margin\n const [buttonWidth, setButtonWidth] = React.useState(DEFAULT_OFFSET);\n const buttonRefCallback = React.useCallback((el: HTMLElement) => setButtonWidth(el?.getBoundingClientRect()?.width), []);\n const { texts } = useLocalization();\n\n const intersectedChildIndex = useIntersectionObserver(internalRef, buttonWidth);\n const children = React.Children.toArray(props.children) as React.ReactElement<ButtonProps>[];\n const hiddenChildren = intersectedChildIndex !== undefined ? children.slice(intersectedChildIndex) : [];\n const hiddenChildrenCount = hiddenChildren.length;\n const moreButtonText = hiddenChildrenCount ? `${hiddenChildrenCount} ${texts.header.more}` : '';\n\n const MoreButton = moreButton?.(moreButtonText) ?? <IconButton icon=\"more\" />;\n\n const className = cn('flex overflow-hidden', props.className);\n\n return (\n <div {...attributes} className={className} data-taco=\"overflow-group\" ref={internalRef}>\n {children.map((child, index) =>\n React.cloneElement(child, {\n className: cn(child.props.className, {\n visible: intersectedChildIndex === undefined || index < intersectedChildIndex,\n 'invisible order-[100] pointer-events-none':\n intersectedChildIndex !== undefined && index >= intersectedChildIndex,\n }),\n })\n )}\n {hiddenChildren.length\n ? React.cloneElement(MoreButton, {\n className: cn('sticky right-0 order-[99]', MoreButton.props.className),\n 'data-observer-ignore': true,\n menu: menuProps => (\n <Menu {...menuProps}>\n <Menu.Content
|
|
1
|
+
{"version":3,"file":"OverflowGroup.js","sources":["../../../../../../../src/components/OverflowGroup/OverflowGroup.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { ButtonProps } from '../Button/Button';\nimport { Menu } from '../Menu/Menu';\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { IconButton } from '../IconButton/IconButton';\nimport { useLocalization } from '../Provider/Localization';\n\nconst sanitizeButtonPropsForMenuItem = (button: any, index) => {\n const href: string | undefined = button.props.to || button.props.href;\n const Tag = href ? Menu.Link : Menu.Item;\n\n // Removing className prop so that custom styling cannot be applied on Menu.Link\n const {\n as,\n className: _,\n appearance: _1,\n drawer: _2,\n fluid: _3,\n hanger: _4,\n menu: _5,\n popover: _6,\n tooltip: _7,\n ...attributes\n } = button.props;\n\n const props = {\n ...attributes,\n key: index,\n target: href ? (href.startsWith('http') ? '_blank' : '_self') : undefined,\n };\n\n if (as) {\n return React.cloneElement(button, { as: Tag, ...props });\n }\n\n return <Tag {...props} />;\n};\n\ntype OverflowGroupProps = React.HTMLAttributes<HTMLElement> & {\n moreButton?: (moreButtonText: string) => React.ReactElement<ButtonProps>;\n wrapChild?: true | undefined;\n};\n\nconst DEFAULT_OFFSET = 32 + 8;\n\nexport const OverflowGroup = React.forwardRef(function OverflowGroup(props: OverflowGroupProps, ref: React.Ref<HTMLDivElement>) {\n const { moreButton, ...attributes } = props;\n const internalRef = useMergedRef<HTMLDivElement>(ref);\n // determine width of more button, to add intersection observer margin\n const [buttonWidth, setButtonWidth] = React.useState(DEFAULT_OFFSET);\n const buttonRefCallback = React.useCallback((el: HTMLElement) => setButtonWidth(el?.getBoundingClientRect()?.width), []);\n const { texts } = useLocalization();\n\n const intersectedChildIndex = useIntersectionObserver(internalRef, buttonWidth);\n const children = React.Children.toArray(props.children) as React.ReactElement<ButtonProps>[];\n const hiddenChildren = intersectedChildIndex !== undefined ? children.slice(intersectedChildIndex) : [];\n const hiddenChildrenCount = hiddenChildren.length;\n const moreButtonText = hiddenChildrenCount ? `${hiddenChildrenCount} ${texts.header.more}` : '';\n\n const MoreButton = moreButton?.(moreButtonText) ?? <IconButton icon=\"more\" />;\n\n const className = cn('flex overflow-hidden', props.className);\n\n return (\n <div {...attributes} className={className} data-taco=\"overflow-group\" ref={internalRef}>\n {children.map((child, index) =>\n React.cloneElement(child, {\n className: cn(child.props.className, {\n visible: intersectedChildIndex === undefined || index < intersectedChildIndex,\n 'invisible order-[100] pointer-events-none':\n intersectedChildIndex !== undefined && index >= intersectedChildIndex,\n }),\n })\n )}\n {hiddenChildren.length\n ? React.cloneElement(MoreButton, {\n className: cn('sticky right-0 order-[99]', MoreButton.props.className),\n 'data-observer-ignore': true,\n menu: menuProps => (\n <Menu {...menuProps}>\n <Menu.Content>\n {hiddenChildren.map((child, index) =>\n props.wrapChild ? (\n <Menu.Item key={index}>{child}</Menu.Item>\n ) : (\n sanitizeButtonPropsForMenuItem(child, index)\n )\n )}\n </Menu.Content>\n </Menu>\n ),\n ref: buttonRefCallback,\n })\n : null}\n </div>\n );\n});\n"],"names":["sanitizeButtonPropsForMenuItem","button","index","href","props","to","Tag","Menu","Link","Item","as","className","_","appearance","_1","drawer","_2","fluid","_3","hanger","_4","menu","_5","popover","_6","tooltip","_7","attributes","key","target","startsWith","undefined","React","cloneElement","DEFAULT_OFFSET","OverflowGroup","forwardRef","ref","moreButton","internalRef","useMergedRef","buttonWidth","setButtonWidth","useState","buttonRefCallback","useCallback","el","_el$getBoundingClient","getBoundingClientRect","width","texts","useLocalization","intersectedChildIndex","useIntersectionObserver","children","Children","toArray","hiddenChildren","slice","hiddenChildrenCount","length","moreButtonText","header","more","MoreButton","_moreButton","IconButton","icon","cn","map","child","visible","menuProps","Content","wrapChild"],"mappings":"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"}
|
|
@@ -50,7 +50,6 @@ const Search = /*#__PURE__*/React__default.forwardRef(function ListboxSearch(pro
|
|
|
50
50
|
invalid: !!validationError,
|
|
51
51
|
message: validationError === null || validationError === void 0 ? void 0 : validationError.message
|
|
52
52
|
}, /*#__PURE__*/React__default.createElement(Input, Object.assign({}, otherProps, {
|
|
53
|
-
"aria-hidden": true,
|
|
54
53
|
autoFocus: true,
|
|
55
54
|
invalid: !!validationError,
|
|
56
55
|
onChange: handleChange,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Search.js","sources":["../../../../../../../../src/components/Select2/components/Search.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\nimport { Input, InputProps } from '../../Input/Input';\nimport { useSelect2Context } from './Context';\nimport { Field } from '../../Field/Field';\nimport { isAriaSelectionKey } from '../../../utils/aria';\n\nexport type Select2SearchProps = InputProps & {\n onTabKeyPress: () => void;\n};\n\nexport const Search = React.forwardRef<HTMLInputElement, Select2SearchProps>(function ListboxSearch(props, ref) {\n const { onTabKeyPress, ...otherProps } = props;\n const { listboxRef, searchQuery, setSearchQuery, setValidationError, validationError, setOpen } = useSelect2Context();\n\n const handleChange = event => {\n if (validationError) {\n setValidationError(undefined);\n }\n\n setSearchQuery(event.target.value);\n };\n\n const handleKeyDown = event => {\n // space is an aria selection key, so we have to remove it to allow spaces\n if (event.key === ' ') {\n return;\n }\n\n // Select2 should close dropdown and receive focus, when user press Tab while searching (UX requirement to support better keyboard navigation)\n if (event.key === 'Tab') {\n setOpen(false);\n onTabKeyPress();\n }\n\n if (isAriaSelectionKey(event) || event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n event.preventDefault();\n // forward navigation events onto the underlying collection - we want arrow keys to work from inside the filter input\n listboxRef?.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n return;\n }\n };\n\n return (\n <Field\n className={cn('mx-1.5 mb-1.5 !min-h-fit ', { '!pb-0': !validationError })}\n invalid={!!validationError}\n message={validationError?.message}>\n <Input\n {...otherProps}\n
|
|
1
|
+
{"version":3,"file":"Search.js","sources":["../../../../../../../../src/components/Select2/components/Search.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { createCustomKeyboardEvent } from '../../../utils/input';\nimport { Input, InputProps } from '../../Input/Input';\nimport { useSelect2Context } from './Context';\nimport { Field } from '../../Field/Field';\nimport { isAriaSelectionKey } from '../../../utils/aria';\n\nexport type Select2SearchProps = InputProps & {\n onTabKeyPress: () => void;\n};\n\nexport const Search = React.forwardRef<HTMLInputElement, Select2SearchProps>(function ListboxSearch(props, ref) {\n const { onTabKeyPress, ...otherProps } = props;\n const { listboxRef, searchQuery, setSearchQuery, setValidationError, validationError, setOpen } = useSelect2Context();\n\n const handleChange = event => {\n if (validationError) {\n setValidationError(undefined);\n }\n\n setSearchQuery(event.target.value);\n };\n\n const handleKeyDown = event => {\n // space is an aria selection key, so we have to remove it to allow spaces\n if (event.key === ' ') {\n return;\n }\n\n // Select2 should close dropdown and receive focus, when user press Tab while searching (UX requirement to support better keyboard navigation)\n if (event.key === 'Tab') {\n setOpen(false);\n onTabKeyPress();\n }\n\n if (isAriaSelectionKey(event) || event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n event.preventDefault();\n // forward navigation events onto the underlying collection - we want arrow keys to work from inside the filter input\n listboxRef?.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n return;\n }\n };\n\n return (\n <Field\n className={cn('mx-1.5 mb-1.5 !min-h-fit ', { '!pb-0': !validationError })}\n invalid={!!validationError}\n message={validationError?.message}>\n <Input\n {...otherProps}\n autoFocus\n invalid={!!validationError}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n ref={ref}\n value={searchQuery}\n />\n </Field>\n );\n});\n"],"names":["Search","React","forwardRef","ListboxSearch","props","ref","onTabKeyPress","otherProps","listboxRef","searchQuery","setSearchQuery","setValidationError","validationError","setOpen","useSelect2Context","handleChange","event","undefined","target","value","handleKeyDown","key","isAriaSelectionKey","_listboxRef$current","preventDefault","current","dispatchEvent","createCustomKeyboardEvent","Field","className","cn","invalid","message","Input","autoFocus","onChange","onKeyDown"],"mappings":";;;;;;;;MAYaA,MAAM,gBAAGC,cAAK,CAACC,UAAU,CAAuC,SAASC,aAAaA,CAACC,KAAK,EAAEC,GAAG;EAC1G,MAAM;IAAEC,aAAa;IAAE,GAAGC;GAAY,GAAGH,KAAK;EAC9C,MAAM;IAAEI,UAAU;IAAEC,WAAW;IAAEC,cAAc;IAAEC,kBAAkB;IAAEC,eAAe;IAAEC;GAAS,GAAGC,iBAAiB,EAAE;EAErH,MAAMC,YAAY,GAAGC,KAAK;IACtB,IAAIJ,eAAe,EAAE;MACjBD,kBAAkB,CAACM,SAAS,CAAC;;IAGjCP,cAAc,CAACM,KAAK,CAACE,MAAM,CAACC,KAAK,CAAC;GACrC;EAED,MAAMC,aAAa,GAAGJ,KAAK;;IAEvB,IAAIA,KAAK,CAACK,GAAG,KAAK,GAAG,EAAE;MACnB;;;IAIJ,IAAIL,KAAK,CAACK,GAAG,KAAK,KAAK,EAAE;MACrBR,OAAO,CAAC,KAAK,CAAC;MACdP,aAAa,EAAE;;IAGnB,IAAIgB,kBAAkB,CAACN,KAAK,CAAC,IAAIA,KAAK,CAACK,GAAG,KAAK,WAAW,IAAIL,KAAK,CAACK,GAAG,KAAK,SAAS,EAAE;MAAA,IAAAE,mBAAA;MACnFP,KAAK,CAACQ,cAAc,EAAE;;MAEtBhB,UAAU,aAAVA,UAAU,wBAAAe,mBAAA,GAAVf,UAAU,CAAEiB,OAAO,cAAAF,mBAAA,uBAAnBA,mBAAA,CAAqBG,aAAa,CAACC,yBAAyB,CAACX,KAA8C,CAAC,CAAC;MAC7G;;GAEP;EAED,oBACIf,6BAAC2B,KAAK;IACFC,SAAS,EAAEC,EAAE,CAAC,2BAA2B,EAAE;MAAE,OAAO,EAAE,CAAClB;KAAiB,CAAC;IACzEmB,OAAO,EAAE,CAAC,CAACnB,eAAe;IAC1BoB,OAAO,EAAEpB,eAAe,aAAfA,eAAe,uBAAfA,eAAe,CAAEoB;kBAC1B/B,6BAACgC,KAAK,oBACE1B,UAAU;IACd2B,SAAS;IACTH,OAAO,EAAE,CAAC,CAACnB,eAAe;IAC1BuB,QAAQ,EAAEpB,YAAY;IACtBqB,SAAS,EAAEhB,aAAa;IACxBf,GAAG,EAAEA,GAAG;IACRc,KAAK,EAAEV;KACT,CACE;AAEhB,CAAC;;;;"}
|
|
@@ -15,7 +15,7 @@ function Cell(props) {
|
|
|
15
15
|
const tableMeta = cell.getContext().table.options.meta;
|
|
16
16
|
const columnMeta = cell.column.columnDef.meta;
|
|
17
17
|
if (tableMeta.editing.isEditing) {
|
|
18
|
-
if (columnMeta.control) {
|
|
18
|
+
if (columnMeta.control && columnMeta.enableEditing) {
|
|
19
19
|
const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;
|
|
20
20
|
const cellError = tableMeta.editing.getCellError(cell);
|
|
21
21
|
const hasErrorAndIsEditing = cellError ? tableMeta.editing.isEditing : true;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Cell.js","sources":["../../../../../../../../../../src/components/Table3/components/Columns/Cell/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { DisplayCell } from '../../../../../primitives/Table/Core/components/Columns/Cell/BuiltIns/DisplayCell';\nimport { RowContext } from '../../../../../primitives/Table/Core/components/Row/RowContext';\nimport { TableCellRendererProps } from '../../../../../primitives/Table/Core/types';\nimport { EditingControlCell } from './EditingControlCell';\nimport { EditingDisplayCell } from './EditingDisplayCell';\n\nexport function Cell<TType = unknown>(props: TableCellRendererProps<TType>) {\n const { cell } = props;\n const { isHovered, rowIndex } = React.useContext(RowContext);\n const tableMeta = cell.getContext().table.options.meta as ReactTableMeta<TType>;\n const columnMeta = cell.column.columnDef.meta as ReactTableColumnMeta<TType, unknown>;\n\n if (tableMeta.editing.isEditing) {\n if (columnMeta.control) {\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n const cellError = tableMeta.editing.getCellError(cell);\n const hasErrorAndIsEditing = cellError ? tableMeta.editing.isEditing : true;\n\n // saves may be pending when not currently editing, but we want to show the \"changed\" data\n // otherwise the unsaved value flashes in while the request completes, which looks a bit shit\n const changedValue = tableMeta.editing.getCellValue(cell);\n\n if (changedValue !== undefined && changedValue !== cell.getValue() && hasErrorAndIsEditing) {\n // a little hacky, but it seems to work without side effects\n cell.getValue = () => changedValue as any;\n }\n\n if (isActiveRow || !!cellError || (isHovered && !isActiveRow && !tableMeta.rowActive.isHoverStatePaused)) {\n return <EditingControlCell<TType> {...props} />;\n }\n }\n\n return <EditingDisplayCell<TType> {...props} />;\n }\n\n return <DisplayCell<TType> {...props} />;\n}\n"],"names":["Cell","props","cell","isHovered","rowIndex","React","useContext","RowContext","tableMeta","getContext","table","options","meta","columnMeta","column","columnDef","editing","isEditing","control","isActiveRow","rowActive","rowActiveIndex","cellError","getCellError","hasErrorAndIsEditing","changedValue","getCellValue","undefined","getValue","isHoverStatePaused","EditingControlCell","EditingDisplayCell","DisplayCell"],"mappings":";;;;;;SAQgBA,IAAIA,CAAkBC,KAAoC;EACtE,MAAM;IAAEC;GAAM,GAAGD,KAAK;EACtB,MAAM;IAAEE,SAAS;IAAEC;GAAU,GAAGC,cAAK,CAACC,UAAU,CAACC,UAAU,CAAC;EAC5D,MAAMC,SAAS,GAAGN,IAAI,CAACO,UAAU,EAAE,CAACC,KAAK,CAACC,OAAO,CAACC,IAA6B;EAC/E,MAAMC,UAAU,GAAGX,IAAI,CAACY,MAAM,CAACC,SAAS,CAACH,IAA4C;EAErF,IAAIJ,SAAS,CAACQ,OAAO,CAACC,SAAS,EAAE;IAC7B,IAAIJ,UAAU,CAACK,OAAO,EAAE;
|
|
1
|
+
{"version":3,"file":"Cell.js","sources":["../../../../../../../../../../src/components/Table3/components/Columns/Cell/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport { TableMeta as ReactTableMeta, ColumnMeta as ReactTableColumnMeta } from '@tanstack/react-table';\nimport { DisplayCell } from '../../../../../primitives/Table/Core/components/Columns/Cell/BuiltIns/DisplayCell';\nimport { RowContext } from '../../../../../primitives/Table/Core/components/Row/RowContext';\nimport { TableCellRendererProps } from '../../../../../primitives/Table/Core/types';\nimport { EditingControlCell } from './EditingControlCell';\nimport { EditingDisplayCell } from './EditingDisplayCell';\n\nexport function Cell<TType = unknown>(props: TableCellRendererProps<TType>) {\n const { cell } = props;\n const { isHovered, rowIndex } = React.useContext(RowContext);\n const tableMeta = cell.getContext().table.options.meta as ReactTableMeta<TType>;\n const columnMeta = cell.column.columnDef.meta as ReactTableColumnMeta<TType, unknown>;\n\n if (tableMeta.editing.isEditing) {\n if (columnMeta.control && columnMeta.enableEditing) {\n const isActiveRow = tableMeta.rowActive.rowActiveIndex === rowIndex;\n const cellError = tableMeta.editing.getCellError(cell);\n const hasErrorAndIsEditing = cellError ? tableMeta.editing.isEditing : true;\n\n // saves may be pending when not currently editing, but we want to show the \"changed\" data\n // otherwise the unsaved value flashes in while the request completes, which looks a bit shit\n const changedValue = tableMeta.editing.getCellValue(cell);\n\n if (changedValue !== undefined && changedValue !== cell.getValue() && hasErrorAndIsEditing) {\n // a little hacky, but it seems to work without side effects\n cell.getValue = () => changedValue as any;\n }\n\n if (isActiveRow || !!cellError || (isHovered && !isActiveRow && !tableMeta.rowActive.isHoverStatePaused)) {\n return <EditingControlCell<TType> {...props} />;\n }\n }\n\n return <EditingDisplayCell<TType> {...props} />;\n }\n\n return <DisplayCell<TType> {...props} />;\n}\n"],"names":["Cell","props","cell","isHovered","rowIndex","React","useContext","RowContext","tableMeta","getContext","table","options","meta","columnMeta","column","columnDef","editing","isEditing","control","enableEditing","isActiveRow","rowActive","rowActiveIndex","cellError","getCellError","hasErrorAndIsEditing","changedValue","getCellValue","undefined","getValue","isHoverStatePaused","EditingControlCell","EditingDisplayCell","DisplayCell"],"mappings":";;;;;;SAQgBA,IAAIA,CAAkBC,KAAoC;EACtE,MAAM;IAAEC;GAAM,GAAGD,KAAK;EACtB,MAAM;IAAEE,SAAS;IAAEC;GAAU,GAAGC,cAAK,CAACC,UAAU,CAACC,UAAU,CAAC;EAC5D,MAAMC,SAAS,GAAGN,IAAI,CAACO,UAAU,EAAE,CAACC,KAAK,CAACC,OAAO,CAACC,IAA6B;EAC/E,MAAMC,UAAU,GAAGX,IAAI,CAACY,MAAM,CAACC,SAAS,CAACH,IAA4C;EAErF,IAAIJ,SAAS,CAACQ,OAAO,CAACC,SAAS,EAAE;IAC7B,IAAIJ,UAAU,CAACK,OAAO,IAAIL,UAAU,CAACM,aAAa,EAAE;MAChD,MAAMC,WAAW,GAAGZ,SAAS,CAACa,SAAS,CAACC,cAAc,KAAKlB,QAAQ;MACnE,MAAMmB,SAAS,GAAGf,SAAS,CAACQ,OAAO,CAACQ,YAAY,CAACtB,IAAI,CAAC;MACtD,MAAMuB,oBAAoB,GAAGF,SAAS,GAAGf,SAAS,CAACQ,OAAO,CAACC,SAAS,GAAG,IAAI;;;MAI3E,MAAMS,YAAY,GAAGlB,SAAS,CAACQ,OAAO,CAACW,YAAY,CAACzB,IAAI,CAAC;MAEzD,IAAIwB,YAAY,KAAKE,SAAS,IAAIF,YAAY,KAAKxB,IAAI,CAAC2B,QAAQ,EAAE,IAAIJ,oBAAoB,EAAE;;QAExFvB,IAAI,CAAC2B,QAAQ,GAAG,MAAMH,YAAmB;;MAG7C,IAAIN,WAAW,IAAI,CAAC,CAACG,SAAS,IAAKpB,SAAS,IAAI,CAACiB,WAAW,IAAI,CAACZ,SAAS,CAACa,SAAS,CAACS,kBAAmB,EAAE;QACtG,oBAAOzB,6BAAC0B,kBAAkB,oBAAY9B,KAAK,EAAI;;;IAIvD,oBAAOI,6BAAC2B,kBAAkB,oBAAY/B,KAAK,EAAI;;EAGnD,oBAAOI,6BAAC4B,WAAW,oBAAYhC,KAAK,EAAI;AAC5C;;;;"}
|
package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js
CHANGED
|
@@ -76,7 +76,7 @@ function CreateNewRowButton(props) {
|
|
|
76
76
|
}, [rowCreated]);
|
|
77
77
|
return /*#__PURE__*/React__default.createElement("tr", {
|
|
78
78
|
onClick: handleCreate,
|
|
79
|
-
className: "border-grey-300 hover:bg-grey-100 group !sticky bottom-10 left-0 z-[21] !block cursor-pointer border-t"
|
|
79
|
+
className: "border-grey-300 hover:bg-grey-100 group !sticky bottom-10 left-0 z-[21] !block cursor-pointer border-t print:!hidden"
|
|
80
80
|
}, /*#__PURE__*/React__default.createElement("td", {
|
|
81
81
|
className: "!border-t-0 !bg-transparent"
|
|
82
82
|
}, /*#__PURE__*/React__default.createElement(Button, {
|
package/dist/esm/packages/taco/src/components/Table3/components/Row/Editing/CreateRowButton.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CreateRowButton.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/CreateRowButton.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions } from '@tanstack/react-virtual';\nimport { Button } from '../../../../Button/Button';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { animateCreateRow } from '../../../util/editing';\n\ntype Props<TType = unknown> = {\n table: ReactTable<TType>;\n tableMeta: ReactTableMeta<TType>;\n onEditingCreate: (() => (row: Partial<TType>) => boolean) | undefined;\n scrollToIndex: (index: number, options?: ScrollToOptions) => void;\n};\n\nexport default function CreateNewRowButton<TType = unknown>(props: Props<TType>) {\n const { onEditingCreate, scrollToIndex, table, tableMeta } = props;\n const { texts } = useLocalization();\n const rows = table.getCoreRowModel().rows;\n const [rowCreated, setRowCreated] = React.useState<{ rowFinder: ((row: Partial<TType>) => boolean) | undefined }>({\n rowFinder: undefined,\n });\n\n const handleKeyDown = event => {\n if (!tableMeta.editing.hasChanges() && event.key === 'Tab') {\n !tableMeta.editing.saveChanges();\n }\n };\n\n const handleCreate = async () => {\n if (!onEditingCreate) {\n return;\n }\n const createdRow = rows.find(row => rowCreated?.rowFinder?.(row.original));\n\n if (createdRow) {\n await tableMeta.editing.saveChanges();\n\n if (!tableMeta.editing.hasRowErrors(createdRow.id)) {\n const rowFinder = onEditingCreate();\n\n setRowCreated({ rowFinder });\n }\n } else {\n const rowFinder = onEditingCreate();\n setRowCreated({ rowFinder });\n }\n };\n\n React.useEffect(() => {\n if (typeof rowCreated?.rowFinder === 'function') {\n const createdRow = rows.find(row => rowCreated?.rowFinder?.(row.original));\n\n if (createdRow) {\n const rowInTable = table.getRowModel().rows.find(row => rowCreated?.rowFinder?.(row.original));\n if (rowInTable) {\n tableMeta.editing.toggleEditing(true);\n tableMeta.rowActive.setRowActiveIndex(createdRow.index);\n scrollToIndex(createdRow.index);\n requestAnimationFrame(() => animateCreateRow(createdRow.id));\n }\n requestAnimationFrame(() => tableMeta.editing.addCreatedRowChangeset(createdRow));\n }\n }\n }, [rowCreated]);\n\n return (\n <tr\n onClick={handleCreate}\n className=\"border-grey-300 hover:bg-grey-100 group !sticky bottom-10 left-0 z-[21] !block cursor-pointer border-t\">\n <td className=\"!border-t-0 !bg-transparent\">\n <Button onKeyDown={handleKeyDown} className=\"group-hover:bg-grey-200 sticky left-0\" appearance=\"transparent\">\n + {texts.table3.editing.buttons.create.label}\n </Button>\n </td>\n </tr>\n );\n}\n"],"names":["CreateNewRowButton","props","onEditingCreate","scrollToIndex","table","tableMeta","texts","useLocalization","rows","getCoreRowModel","rowCreated","setRowCreated","React","useState","rowFinder","undefined","handleKeyDown","event","editing","hasChanges","key","saveChanges","handleCreate","Promise","resolve","createdRow","find","row","_rowCreated$rowFinder","call","original","_temp","then","hasRowErrors","id","e","reject","useEffect","_rowCreated$rowFinder2","rowInTable","getRowModel","_rowCreated$rowFinder3","toggleEditing","rowActive","setRowActiveIndex","index","requestAnimationFrame","animateCreateRow","addCreatedRowChangeset","onClick","className","Button","onKeyDown","appearance","table3","buttons","create","label"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CreateRowButton.js","sources":["../../../../../../../../../../src/components/Table3/components/Row/Editing/CreateRowButton.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { ScrollToOptions } from '@tanstack/react-virtual';\nimport { Button } from '../../../../Button/Button';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { animateCreateRow } from '../../../util/editing';\n\ntype Props<TType = unknown> = {\n table: ReactTable<TType>;\n tableMeta: ReactTableMeta<TType>;\n onEditingCreate: (() => (row: Partial<TType>) => boolean) | undefined;\n scrollToIndex: (index: number, options?: ScrollToOptions) => void;\n};\n\nexport default function CreateNewRowButton<TType = unknown>(props: Props<TType>) {\n const { onEditingCreate, scrollToIndex, table, tableMeta } = props;\n const { texts } = useLocalization();\n const rows = table.getCoreRowModel().rows;\n const [rowCreated, setRowCreated] = React.useState<{ rowFinder: ((row: Partial<TType>) => boolean) | undefined }>({\n rowFinder: undefined,\n });\n\n const handleKeyDown = event => {\n if (!tableMeta.editing.hasChanges() && event.key === 'Tab') {\n !tableMeta.editing.saveChanges();\n }\n };\n\n const handleCreate = async () => {\n if (!onEditingCreate) {\n return;\n }\n const createdRow = rows.find(row => rowCreated?.rowFinder?.(row.original));\n\n if (createdRow) {\n await tableMeta.editing.saveChanges();\n\n if (!tableMeta.editing.hasRowErrors(createdRow.id)) {\n const rowFinder = onEditingCreate();\n\n setRowCreated({ rowFinder });\n }\n } else {\n const rowFinder = onEditingCreate();\n setRowCreated({ rowFinder });\n }\n };\n\n React.useEffect(() => {\n if (typeof rowCreated?.rowFinder === 'function') {\n const createdRow = rows.find(row => rowCreated?.rowFinder?.(row.original));\n\n if (createdRow) {\n const rowInTable = table.getRowModel().rows.find(row => rowCreated?.rowFinder?.(row.original));\n if (rowInTable) {\n tableMeta.editing.toggleEditing(true);\n tableMeta.rowActive.setRowActiveIndex(createdRow.index);\n scrollToIndex(createdRow.index);\n requestAnimationFrame(() => animateCreateRow(createdRow.id));\n }\n requestAnimationFrame(() => tableMeta.editing.addCreatedRowChangeset(createdRow));\n }\n }\n }, [rowCreated]);\n\n return (\n <tr\n onClick={handleCreate}\n className=\"border-grey-300 hover:bg-grey-100 group !sticky bottom-10 left-0 z-[21] !block cursor-pointer border-t print:!hidden\">\n <td className=\"!border-t-0 !bg-transparent\">\n <Button onKeyDown={handleKeyDown} className=\"group-hover:bg-grey-200 sticky left-0\" appearance=\"transparent\">\n + {texts.table3.editing.buttons.create.label}\n </Button>\n </td>\n </tr>\n );\n}\n"],"names":["CreateNewRowButton","props","onEditingCreate","scrollToIndex","table","tableMeta","texts","useLocalization","rows","getCoreRowModel","rowCreated","setRowCreated","React","useState","rowFinder","undefined","handleKeyDown","event","editing","hasChanges","key","saveChanges","handleCreate","Promise","resolve","createdRow","find","row","_rowCreated$rowFinder","call","original","_temp","then","hasRowErrors","id","e","reject","useEffect","_rowCreated$rowFinder2","rowInTable","getRowModel","_rowCreated$rowFinder3","toggleEditing","rowActive","setRowActiveIndex","index","requestAnimationFrame","animateCreateRow","addCreatedRowChangeset","onClick","className","Button","onKeyDown","appearance","table3","buttons","create","label"],"mappings":"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"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
|
-
import { forwardRef, createElement } from 'react';
|
|
1
|
+
import { forwardRef, createElement, Children, isValidElement } from 'react';
|
|
2
2
|
import cn from 'clsx';
|
|
3
3
|
import { Tooltip } from '../Tooltip/Tooltip.js';
|
|
4
4
|
import { getButtonClasses } from '../Button/util.js';
|
|
5
|
+
import { Button } from '../Button/Button.js';
|
|
6
|
+
import { OverflowGroup } from '../OverflowGroup/OverflowGroup.js';
|
|
5
7
|
import { Root, List, Trigger, Content } from '@radix-ui/react-tabs';
|
|
6
8
|
|
|
7
9
|
const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
|
|
@@ -28,11 +30,23 @@ const Tabs = /*#__PURE__*/forwardRef(function Tabs(props, ref) {
|
|
|
28
30
|
}), children);
|
|
29
31
|
});
|
|
30
32
|
const TabList = /*#__PURE__*/forwardRef(function Tab(props, ref) {
|
|
33
|
+
const {
|
|
34
|
+
children
|
|
35
|
+
} = props;
|
|
31
36
|
const className = cn('border-grey-300 flex flex-row m-0 mb-4 print:hidden', 'aria-orientation-horizontal:border-b', 'aria-orientation-vertical:border-r aria-orientation-vertical:m-0 aria-orientation-vertical:mr-4 aria-orientation-vertical:flex-col', props.className);
|
|
32
37
|
return /*#__PURE__*/createElement(List, Object.assign({}, props, {
|
|
33
38
|
className: className,
|
|
34
39
|
ref: ref
|
|
35
|
-
})
|
|
40
|
+
}), /*#__PURE__*/createElement(OverflowGroup, {
|
|
41
|
+
wrapChild: true,
|
|
42
|
+
className: 'w-full [[aria-orientation="vertical"]_&]:flex-col',
|
|
43
|
+
moreButton: text => /*#__PURE__*/createElement(Button, null, text)
|
|
44
|
+
}, Children.toArray(children).filter(child => {
|
|
45
|
+
if (/*#__PURE__*/isValidElement(child)) {
|
|
46
|
+
return !child.props.hidden;
|
|
47
|
+
}
|
|
48
|
+
return true;
|
|
49
|
+
})));
|
|
36
50
|
});
|
|
37
51
|
const TabTrigger = /*#__PURE__*/forwardRef(function Tab(props, ref) {
|
|
38
52
|
const {
|
|
@@ -42,7 +56,7 @@ const TabTrigger = /*#__PURE__*/forwardRef(function Tab(props, ref) {
|
|
|
42
56
|
tooltip,
|
|
43
57
|
...otherProps
|
|
44
58
|
} = props;
|
|
45
|
-
const triggerClassName = cn('group relative p-0.5 outline-none disabled:cursor-not-allowed disabled:text-black/50',
|
|
59
|
+
const triggerClassName = cn(props.className, 'group relative p-0.5 outline-none disabled:cursor-not-allowed disabled:text-black/50',
|
|
46
60
|
// horizontal
|
|
47
61
|
'[[aria-orientation="horizontal"]_&]:pb-1',
|
|
48
62
|
// horizontal
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.js","sources":["../../../../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport * as TabsPrimitive from '@radix-ui/react-tabs';\nimport { Orientation } from '../../types';\nimport { getButtonClasses } from '../Button/util';\nimport { Tooltip } from '../Tooltip/Tooltip';\n\nexport type TabsProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * The controlled value of the tab to activate. Should be used in conjunction with `onChange`.\n */\n id?: string;\n /**\n * Set which tab is selected on mount.\n * This has to be one of the existing ids provided for tabs\n */\n defaultId?: string;\n /**\n * Content should be one or an array of `Tabs.Trigger` components inside `Tabs.List` and then\n * followed by one or an array of `Tabs.Content`.\n * *Note* that there can also be tabs that are rendered conditionally.\n */\n children: React.ReactNode;\n /**\n * Define orientation of tabs.\n * @defaultValue horizontal\n */\n orientation?: Orientation;\n /**\n * Callback that is called when tab is changed.\n */\n onChange?: (id: string) => void;\n};\n\nexport type TabListProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type TabTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n /**\n * A unique value that associates the trigger with a content.\n */\n id: string;\n /**\n * When true, prevents the user from interacting with the tab.\n */\n disabled?: boolean;\n /** A tooltip to show when hovering over the trigger */\n tooltip?: string | JSX.Element;\n};\n\nexport type TabContentProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * A unique value that associates the content with a trigger.\n */\n id: string;\n};\n\nexport type ForwardedTabsWithStatics = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>> & {\n /** Tab list component containing all tab triggers, rendered in a `Tabs` group component */\n List: React.ForwardRefExoticComponent<TabListProps & React.RefAttributes<HTMLDivElement>>;\n /** Tab trigger component rendered in a `Tabs.List` component */\n Trigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n /** Tab content component rendered in a `Tabs` group component */\n Content: React.ForwardRefExoticComponent<TabContentProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Tabs = React.forwardRef(function Tabs(props: TabsProps, ref: React.Ref<HTMLDivElement>) {\n const { id, defaultId, children, onChange, orientation = 'horizontal', ...otherProps } = props;\n const className = cn(\n {\n 'flex w-full': orientation === 'vertical',\n },\n props.className\n );\n\n return (\n <TabsPrimitive.Root\n {...otherProps}\n className={className}\n data-taco=\"tabs\"\n defaultValue={defaultId}\n dir=\"ltr\"\n onValueChange={onChange}\n orientation={orientation}\n ref={ref}\n value={id}>\n {children}\n </TabsPrimitive.Root>\n );\n}) as ForwardedTabsWithStatics;\n\nconst TabList = React.forwardRef(function Tab(props: TabListProps, ref: React.Ref<HTMLDivElement>) {\n const className = cn(\n 'border-grey-300 flex flex-row m-0 mb-4 print:hidden',\n 'aria-orientation-horizontal:border-b',\n 'aria-orientation-vertical:border-r aria-orientation-vertical:m-0 aria-orientation-vertical:mr-4 aria-orientation-vertical:flex-col',\n props.className\n );\n\n return <TabsPrimitive.List {...props} className={className} ref={ref}
|
|
1
|
+
{"version":3,"file":"Tabs.js","sources":["../../../../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport * as TabsPrimitive from '@radix-ui/react-tabs';\nimport { Orientation } from '../../types';\nimport { getButtonClasses } from '../Button/util';\nimport { Tooltip } from '../Tooltip/Tooltip';\nimport { OverflowGroup } from '../OverflowGroup/OverflowGroup';\nimport { Button } from '../Button/Button';\n\nexport type TabsProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * The controlled value of the tab to activate. Should be used in conjunction with `onChange`.\n */\n id?: string;\n /**\n * Set which tab is selected on mount.\n * This has to be one of the existing ids provided for tabs\n */\n defaultId?: string;\n /**\n * Content should be one or an array of `Tabs.Trigger` components inside `Tabs.List` and then\n * followed by one or an array of `Tabs.Content`.\n * *Note* that there can also be tabs that are rendered conditionally.\n */\n children: React.ReactNode;\n /**\n * Define orientation of tabs.\n * @defaultValue horizontal\n */\n orientation?: Orientation;\n /**\n * Callback that is called when tab is changed.\n */\n onChange?: (id: string) => void;\n};\n\nexport type TabListProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type TabTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n /**\n * A unique value that associates the trigger with a content.\n */\n id: string;\n /**\n * When true, prevents the user from interacting with the tab.\n */\n disabled?: boolean;\n /** A tooltip to show when hovering over the trigger */\n tooltip?: string | JSX.Element;\n};\n\nexport type TabContentProps = React.HTMLAttributes<HTMLDivElement> & {\n /**\n * A unique value that associates the content with a trigger.\n */\n id: string;\n\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true;\n};\n\nexport type ForwardedTabsWithStatics = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>> & {\n /** Tab list component containing all tab triggers, rendered in a `Tabs` group component */\n List: React.ForwardRefExoticComponent<TabListProps & React.RefAttributes<HTMLDivElement>>;\n /** Tab trigger component rendered in a `Tabs.List` component */\n Trigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n /** Tab content component rendered in a `Tabs` group component */\n Content: React.ForwardRefExoticComponent<TabContentProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Tabs = React.forwardRef(function Tabs(props: TabsProps, ref: React.Ref<HTMLDivElement>) {\n const { id, defaultId, children, onChange, orientation = 'horizontal', ...otherProps } = props;\n const className = cn(\n {\n 'flex w-full': orientation === 'vertical',\n },\n props.className\n );\n\n return (\n <TabsPrimitive.Root\n {...otherProps}\n className={className}\n data-taco=\"tabs\"\n defaultValue={defaultId}\n dir=\"ltr\"\n onValueChange={onChange}\n orientation={orientation}\n ref={ref}\n value={id}>\n {children}\n </TabsPrimitive.Root>\n );\n}) as ForwardedTabsWithStatics;\n\nconst TabList = React.forwardRef(function Tab(props: TabListProps, ref: React.Ref<HTMLDivElement>) {\n const { children } = props;\n const className = cn(\n 'border-grey-300 flex flex-row m-0 mb-4 print:hidden',\n 'aria-orientation-horizontal:border-b',\n 'aria-orientation-vertical:border-r aria-orientation-vertical:m-0 aria-orientation-vertical:mr-4 aria-orientation-vertical:flex-col',\n props.className\n );\n\n return (\n <TabsPrimitive.List {...props} className={className} ref={ref}>\n <OverflowGroup\n wrapChild\n className='w-full [[aria-orientation=\"vertical\"]_&]:flex-col'\n moreButton={(text: string) => <Button>{text}</Button>}>\n {React.Children.toArray(children).filter(child => {\n if (React.isValidElement(child)) {\n return !child.props.hidden;\n }\n\n return true;\n })}\n </OverflowGroup>\n </TabsPrimitive.List>\n );\n});\n\nconst TabTrigger = React.forwardRef(function Tab(props: TabTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n const { children, id, disabled, tooltip, ...otherProps } = props;\n\n const triggerClassName = cn(\n props.className,\n 'group relative p-0.5 outline-none disabled:cursor-not-allowed disabled:text-black/50',\n // horizontal\n '[[aria-orientation=\"horizontal\"]_&]:pb-1',\n // horizontal\n '[[aria-orientation=\"vertical\"]_&]:pr-1'\n );\n const buttonClassName = cn(\n getButtonClasses(),\n 'group-focus-visible:yt-focus-inset group-enabled:group-hover:wcag-grey-200 pointer-events-none rounded px-3'\n );\n const activeClassName = cn(\n 'pointer-events-none absolute hidden bg-blue-500 group-aria-selected:flex',\n // horizontal\n '[[aria-orientation=\"horizontal\"]_&]:rounded-t-sm [[aria-orientation=\"horizontal\"]_&]:bottom-0 [[aria-orientation=\"horizontal\"]_&]:left-0 [[aria-orientation=\"horizontal\"]_&]:right-0 [[aria-orientation=\"horizontal\"]_&]:-mb-px [[aria-orientation=\"horizontal\"]_&]:h-0.5',\n // vertical\n '[[aria-orientation=\"vertical\"]_&]:rounded-l-sm [[aria-orientation=\"vertical\"]_&]:right-0 [[aria-orientation=\"vertical\"]_&]:top-0 [[aria-orientation=\"vertical\"]_&]:bottom-0 [[aria-orientation=\"vertical\"]_&]:-mr-px [[aria-orientation=\"vertical\"]_&]:w-0.5'\n );\n\n const trigger = (\n <TabsPrimitive.Trigger {...otherProps} className={triggerClassName} disabled={disabled} ref={ref} value={id}>\n <span className={buttonClassName}>{children}</span>\n <span className={activeClassName} />\n </TabsPrimitive.Trigger>\n );\n\n if (tooltip) {\n return <Tooltip title={tooltip}>{trigger}</Tooltip>;\n }\n\n return trigger;\n});\n\nconst TabContent = React.forwardRef(function Tab(props: TabContentProps, ref: React.Ref<HTMLDivElement>) {\n const { id, ...otherProps } = props;\n const className = cn('[&[data-orientation=\"vertical\"]]:grow outline-none', props.className);\n\n return <TabsPrimitive.Content {...otherProps} className={className} ref={ref} value={id} />;\n});\n\nTabs.List = TabList;\nTabs.Trigger = TabTrigger;\nTabs.Content = TabContent;\n"],"names":["Tabs","React","props","ref","id","defaultId","children","onChange","orientation","otherProps","className","cn","TabsPrimitive","defaultValue","dir","onValueChange","value","TabList","Tab","OverflowGroup","wrapChild","moreButton","text","Button","toArray","filter","child","hidden","TabTrigger","disabled","tooltip","triggerClassName","buttonClassName","getButtonClasses","activeClassName","trigger","Tooltip","title","TabContent","List","Trigger","Content"],"mappings":"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"}
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Drag.js
CHANGED
|
@@ -1,59 +1,20 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
|
+
import cn from 'clsx';
|
|
2
3
|
import { Icon } from '../../../../../../components/Icon/Icon.js';
|
|
3
4
|
import { useLocalization } from '../../../../../../components/Provider/Localization.js';
|
|
4
5
|
|
|
5
|
-
const GHOST_ELEMENT_ID = 'taco_table_dragging';
|
|
6
6
|
function Header() {
|
|
7
7
|
return null;
|
|
8
8
|
}
|
|
9
|
-
function Cell(
|
|
10
|
-
const {
|
|
11
|
-
row,
|
|
12
|
-
table
|
|
13
|
-
} = context;
|
|
9
|
+
function Cell() {
|
|
14
10
|
const {
|
|
15
11
|
texts
|
|
16
12
|
} = useLocalization();
|
|
17
|
-
|
|
18
|
-
const onDragStart = event => {
|
|
19
|
-
var _tableMeta$rowDrag$se, _tableMeta$rowDrag, _tableMeta$rowDrag$ha, _tableMeta$rowDrag2;
|
|
20
|
-
let rows = [row];
|
|
21
|
-
if (table.options.enableRowSelection) {
|
|
22
|
-
rows = row.getIsSelected() ? table.getSelectedRowModel().rows : [row, ...table.getSelectedRowModel().rows];
|
|
23
|
-
}
|
|
24
|
-
const data = rows.map(row => row.original);
|
|
25
|
-
(_tableMeta$rowDrag$se = (_tableMeta$rowDrag = tableMeta.rowDrag).setDragging) === null || _tableMeta$rowDrag$se === void 0 ? void 0 : _tableMeta$rowDrag$se.call(_tableMeta$rowDrag, rows.reduce((dragging, rowBeingDragged) => ({
|
|
26
|
-
...dragging,
|
|
27
|
-
[rowBeingDragged.id]: true
|
|
28
|
-
}), {}));
|
|
29
|
-
// set a default data value so that the consumer doesn't have to
|
|
30
|
-
event.dataTransfer.setData('text', JSON.stringify(data));
|
|
31
|
-
const showPlaceholder = text => {
|
|
32
|
-
const ghost = document.createElement('div');
|
|
33
|
-
ghost.id = GHOST_ELEMENT_ID;
|
|
34
|
-
ghost.className = 'wcag-blue rounded flex w-48 p-4 absolute -ml-[100vw]';
|
|
35
|
-
ghost.innerText = text;
|
|
36
|
-
document.body.appendChild(ghost);
|
|
37
|
-
event.dataTransfer.setDragImage(ghost, 0, 0);
|
|
38
|
-
};
|
|
39
|
-
const setDataTransfer = text => event.dataTransfer.setData('text', text);
|
|
40
|
-
(_tableMeta$rowDrag$ha = (_tableMeta$rowDrag2 = tableMeta.rowDrag).handleRowDrag) === null || _tableMeta$rowDrag$ha === void 0 ? void 0 : _tableMeta$rowDrag$ha.call(_tableMeta$rowDrag2, data, showPlaceholder, setDataTransfer);
|
|
41
|
-
};
|
|
42
|
-
const handleDragEnd = () => {
|
|
43
|
-
var _document$getElementB, _tableMeta$rowDrag$se2, _tableMeta$rowDrag3;
|
|
44
|
-
(_document$getElementB = document.getElementById(GHOST_ELEMENT_ID)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.remove();
|
|
45
|
-
(_tableMeta$rowDrag$se2 = (_tableMeta$rowDrag3 = tableMeta.rowDrag).setDragging) === null || _tableMeta$rowDrag$se2 === void 0 ? void 0 : _tableMeta$rowDrag$se2.call(_tableMeta$rowDrag3, {});
|
|
46
|
-
};
|
|
47
|
-
return /*#__PURE__*/React__default.createElement("div", {
|
|
48
|
-
draggable: true,
|
|
49
|
-
onDragStart: onDragStart,
|
|
50
|
-
onDragOver: event => event.preventDefault(),
|
|
51
|
-
onDragEnd: handleDragEnd
|
|
52
|
-
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
13
|
+
return /*#__PURE__*/React__default.createElement(Icon, {
|
|
53
14
|
"aria-label": texts.table.columns.drag.tooltip,
|
|
54
15
|
name: "drag",
|
|
55
|
-
className: "text-grey-darkest invisible -mt-1 ml-[2px] cursor-grab active:cursor-grabbing group-hover/row:visible group-[[aria-grabbed='true']]/row:text-white"
|
|
56
|
-
})
|
|
16
|
+
className: cn("text-grey-darkest invisible -mt-1 ml-[2px] cursor-grab active:cursor-grabbing group-hover/row:visible group-[[aria-grabbed='true']]/row:text-white", '[[data-table-editing-mode]_&]:!invisible')
|
|
17
|
+
});
|
|
57
18
|
}
|
|
58
19
|
const renderer = {
|
|
59
20
|
header: Header,
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Drag.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drag.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Drag.tsx"],"sourcesContent":["import React from 'react';\nimport
|
|
1
|
+
{"version":3,"file":"Drag.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Drag.tsx"],"sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\n\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\nimport { Icon } from '../../../../../../components/Icon/Icon';\n\nfunction Header() {\n return null;\n}\n\nfunction Cell() {\n const { texts } = useLocalization();\n\n return (\n <Icon\n aria-label={texts.table.columns.drag.tooltip}\n name=\"drag\"\n className={clsx(\n \"text-grey-darkest invisible -mt-1 ml-[2px] cursor-grab active:cursor-grabbing group-hover/row:visible group-[[aria-grabbed='true']]/row:text-white\",\n '[[data-table-editing-mode]_&]:!invisible'\n )}\n />\n );\n}\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n size: 20,\n meta: {\n align: 'center',\n className: '!px-0 !pb-0 justify-end',\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n headerClassName: '!p-0',\n },\n};\n"],"names":["Header","Cell","texts","useLocalization","React","Icon","table","columns","drag","tooltip","name","className","clsx","renderer","header","size","meta","align","enableSearch","headerClassName"],"mappings":";;;;;AAOA,SAASA,MAAMA;EACX,OAAO,IAAI;AACf;AAEA,SAASC,IAAIA;EACT,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EAEnC,oBACIC,6BAACC,IAAI;kBACWH,KAAK,CAACI,KAAK,CAACC,OAAO,CAACC,IAAI,CAACC,OAAO;IAC5CC,IAAI,EAAC,MAAM;IACXC,SAAS,EAAEC,EAAI,CACX,oJAAoJ,EACpJ,0CAA0C;IAEhD;AAEV;MAEaC,QAAQ,GAAkC;EACnDC,MAAM,EAAEd,MAAM;EACda,QAAQ,EAAEZ,IAAI;EACdc,IAAI,EAAE,EAAE;EACRC,IAAI,EAAE;IACFC,KAAK,EAAE,QAAQ;IACfN,SAAS,EAAE,yBAAyB;;IAEpCO,YAAY,EAAE,KAAK;IACnBJ,MAAM,EAAE,EAAE;IACVK,eAAe,EAAE;;;;;;"}
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Columns/Internal/Selection.js
CHANGED
|
@@ -42,9 +42,8 @@ function Header(context) {
|
|
|
42
42
|
}, /*#__PURE__*/React__default.createElement(Checkbox, {
|
|
43
43
|
"aria-label": title,
|
|
44
44
|
className: "hover:border-blue !-mt-px",
|
|
45
|
-
key: String(`${isAllRowsSelected}_${isSomeRowsSelected}`),
|
|
46
45
|
checked: isAllRowsSelected,
|
|
47
|
-
indeterminate: isSomeRowsSelected,
|
|
46
|
+
indeterminate: isSomeRowsSelected && !isAllRowsSelected,
|
|
48
47
|
loading: tableMeta.server.loadAllStatus === TableServerLoadAllState.Loading,
|
|
49
48
|
onChange: handleChange
|
|
50
49
|
}));
|
|
@@ -73,6 +72,7 @@ function Cell(context) {
|
|
|
73
72
|
return null;
|
|
74
73
|
}
|
|
75
74
|
const isSelected = row.getIsGrouped() ? row.getIsAllSubRowsSelected() : row.getIsSelected();
|
|
75
|
+
const canSelect = row.getCanSelect();
|
|
76
76
|
const title = isSelected ? texts.table.columns.select.deselect : texts.table.columns.select.select;
|
|
77
77
|
if (table.options.enableMultiRowSelection) {
|
|
78
78
|
const handleClick = function (event) {
|
|
@@ -91,7 +91,7 @@ function Cell(context) {
|
|
|
91
91
|
function _temp4() {
|
|
92
92
|
table.setRowSelection(currentRowSelection => ({
|
|
93
93
|
...currentRowSelection,
|
|
94
|
-
...selectedRows.reduce((state, row) => ({
|
|
94
|
+
...selectedRows.filter(row => row.getCanSelect()).reduce((state, row) => ({
|
|
95
95
|
...state,
|
|
96
96
|
[row.id]: true
|
|
97
97
|
}), {})
|
|
@@ -119,6 +119,7 @@ function Cell(context) {
|
|
|
119
119
|
}
|
|
120
120
|
};
|
|
121
121
|
return /*#__PURE__*/React__default.createElement(Tooltip, {
|
|
122
|
+
hidden: !canSelect,
|
|
122
123
|
title: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, title, /*#__PURE__*/React__default.createElement(Shortcut, {
|
|
123
124
|
className: "ml-2",
|
|
124
125
|
keys: "Space"
|
|
@@ -128,11 +129,12 @@ function Cell(context) {
|
|
|
128
129
|
className: "!mt-0",
|
|
129
130
|
checked: isSelected,
|
|
130
131
|
onClick: handleClick,
|
|
132
|
+
disabled: !canSelect,
|
|
131
133
|
// this is necessary to remove console spam from eslint
|
|
132
134
|
onChange: () => false
|
|
133
135
|
}));
|
|
134
136
|
} else {
|
|
135
|
-
const className = cn('!mt-0', getRadioClassnames());
|
|
137
|
+
const className = cn('!mt-0', getRadioClassnames(!canSelect));
|
|
136
138
|
const handleClick = event => {
|
|
137
139
|
event.stopPropagation();
|
|
138
140
|
row.toggleSelected();
|
|
@@ -140,7 +142,8 @@ function Cell(context) {
|
|
|
140
142
|
};
|
|
141
143
|
return /*#__PURE__*/React__default.createElement("button", {
|
|
142
144
|
className: className,
|
|
143
|
-
"aria-checked": isSelected,
|
|
145
|
+
"aria-checked": canSelect && isSelected,
|
|
146
|
+
disabled: !canSelect,
|
|
144
147
|
onClick: handleClick,
|
|
145
148
|
role: "radio",
|
|
146
149
|
type: "button"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Selection.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Selection.tsx"],"sourcesContent":["import React from 'react';\nimport {\n HeaderContext as ReactTableHeaderContext,\n CellContext as ReactTableCellContext,\n TableMeta as ReactTableMeta,\n RowSelectionState,\n} from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { Tooltip } from '../../../../../../components/Tooltip/Tooltip';\nimport { Checkbox } from '../../../../../../components/Checkbox/Checkbox';\nimport { Shortcut } from '../../../../../../components/Shortcut/Shortcut';\nimport { getRadioClassnames } from '../../../../../../components/RadioGroup/util';\nimport { TableServerLoadAllState } from '../../../../types';\nimport { RowContext } from '../../Row/RowContext';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\n\nfunction Header<TType = unknown>(context: ReactTableHeaderContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { table } = context;\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n if (table.options.enableMultiRowSelection) {\n const isAllRowsSelected = table.getIsAllRowsSelected();\n const isSomeRowsSelected = table.getIsSomeRowsSelected();\n const title = isAllRowsSelected ? texts.table.columns.select.deselectAll : texts.table.columns.select.selectAll;\n\n const handleChange = async (checked: boolean) => {\n // load all data if that is possible\n if (tableMeta.server.loadAllIfNeeded) {\n // don't pass the search query because we need all data - not filtered data\n await tableMeta.server.loadAllIfNeeded(table.getState().sorting, table.getState().columnFilters);\n }\n\n table.toggleAllRowsSelected(checked);\n };\n\n return (\n <Tooltip title={title}>\n <Checkbox\n aria-label={title}\n className=\"hover:border-blue !-mt-px\"\n key={String(`${isAllRowsSelected}_${isSomeRowsSelected}`)}\n checked={isAllRowsSelected}\n indeterminate={isSomeRowsSelected}\n loading={tableMeta.server.loadAllStatus === TableServerLoadAllState.Loading}\n onChange={handleChange}\n />\n </Tooltip>\n );\n }\n\n return null;\n}\n\nconst toggleBetween = (fromRowIndex: number, toRowIndex: number): [number, number] => {\n const fromIndex = toRowIndex < fromRowIndex ? toRowIndex : fromRowIndex;\n const toIndex = toRowIndex > fromRowIndex ? toRowIndex : fromRowIndex;\n\n return [fromIndex, toIndex];\n};\n\nfunction Cell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { row, table } = context;\n const { rowIndex } = React.useContext(RowContext);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n if (table.options.enableGrouping && table.getState().grouping?.length && !row.getIsGrouped()) {\n return null;\n }\n\n const isSelected = row.getIsGrouped() ? row.getIsAllSubRowsSelected() : row.getIsSelected();\n const title = isSelected ? texts.table.columns.select.deselect : texts.table.columns.select.select;\n\n if (table.options.enableMultiRowSelection) {\n const handleClick = async (event: React.MouseEvent) => {\n event.stopPropagation();\n\n if (row.getIsGrouped()) {\n row.subRows.forEach(row => row.toggleSelected());\n } else if (event.shiftKey) {\n const [fromIndex, toIndex] = toggleBetween(tableMeta.rowSelection.lastSelectedRowIndex.current ?? 0, rowIndex);\n const selectedRows = table.getRowModel().rows.slice(fromIndex, toIndex + 1);\n\n if (tableMeta.server.loadAllIfNeeded && selectedRows.some(row => row.original === undefined)) {\n // don't pass the search query because we need all data - not filtered data\n await tableMeta.server.loadAllIfNeeded(table.getState().sorting, table.getState().columnFilters);\n }\n\n table.setRowSelection((currentRowSelection: RowSelectionState) => ({\n ...currentRowSelection,\n ...selectedRows.reduce((state, row) => ({ ...state, [row.id]: true }), {}),\n }));\n } else {\n row.toggleSelected();\n }\n\n tableMeta.rowSelection.lastSelectedRowIndex.current = row.index;\n };\n\n return (\n <Tooltip\n title={\n <>\n {title}\n <Shortcut className=\"ml-2\" keys=\"Space\" />\n </>\n }>\n <Checkbox\n aria-label={title}\n className=\"!mt-0\"\n checked={isSelected}\n onClick={handleClick}\n // this is necessary to remove console spam from eslint\n onChange={() => false}\n />\n </Tooltip>\n );\n } else {\n const className = cn('!mt-0', getRadioClassnames());\n\n const handleClick = (event: React.MouseEvent): void => {\n event.stopPropagation();\n row.toggleSelected();\n tableMeta.rowSelection.lastSelectedRowIndex.current = row.index;\n };\n\n return (\n <button className={className} aria-checked={isSelected} onClick={handleClick} role=\"radio\" type=\"button\">\n {isSelected ? <span className=\"h-2 w-2 rounded-full bg-white\" /> : null}\n </button>\n );\n }\n}\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n size: 40,\n meta: {\n align: 'center',\n className: '!px-1',\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n headerClassName: '!px-1',\n },\n};\n"],"names":["Header","context","texts","useLocalization","table","tableMeta","options","meta","enableMultiRowSelection","isAllRowsSelected","getIsAllRowsSelected","isSomeRowsSelected","getIsSomeRowsSelected","title","columns","select","deselectAll","selectAll","handleChange","checked","toggleAllRowsSelected","_temp","server","loadAllIfNeeded","Promise","resolve","getState","sorting","columnFilters","then","_temp2","e","reject","React","Tooltip","Checkbox","className","key","String","indeterminate","loading","loadAllStatus","TableServerLoadAllState","Loading","onChange","toggleBetween","fromRowIndex","toRowIndex","fromIndex","toIndex","Cell","row","rowIndex","useContext","RowContext","enableGrouping","_table$getState$group","grouping","length","getIsGrouped","isSelected","getIsAllSubRowsSelected","getIsSelected","deselect","handleClick","event","rowSelection","lastSelectedRowIndex","current","index","stopPropagation","_temp6","subRows","forEach","toggleSelected","_temp5","shiftKey","_tableMeta$rowSelecti","_temp4","setRowSelection","currentRowSelection","selectedRows","reduce","state","id","getRowModel","rows","slice","_temp3","some","original","undefined","_temp7","Shortcut","keys","onClick","cn","getRadioClassnames","role","type","renderer","header","size","align","enableSearch","headerClassName"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Selection.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Columns/Internal/Selection.tsx"],"sourcesContent":["import React from 'react';\nimport {\n HeaderContext as ReactTableHeaderContext,\n CellContext as ReactTableCellContext,\n TableMeta as ReactTableMeta,\n RowSelectionState,\n} from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { Tooltip } from '../../../../../../components/Tooltip/Tooltip';\nimport { Checkbox } from '../../../../../../components/Checkbox/Checkbox';\nimport { Shortcut } from '../../../../../../components/Shortcut/Shortcut';\nimport { getRadioClassnames } from '../../../../../../components/RadioGroup/util';\nimport { TableServerLoadAllState } from '../../../../types';\nimport { RowContext } from '../../Row/RowContext';\nimport { useTableManagerInternalColumn } from '../../../../useTableManager/types';\n\nfunction Header<TType = unknown>(context: ReactTableHeaderContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { table } = context;\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n if (table.options.enableMultiRowSelection) {\n const isAllRowsSelected = table.getIsAllRowsSelected();\n const isSomeRowsSelected = table.getIsSomeRowsSelected();\n const title = isAllRowsSelected ? texts.table.columns.select.deselectAll : texts.table.columns.select.selectAll;\n\n const handleChange = async (checked: boolean) => {\n // load all data if that is possible\n if (tableMeta.server.loadAllIfNeeded) {\n // don't pass the search query because we need all data - not filtered data\n await tableMeta.server.loadAllIfNeeded(table.getState().sorting, table.getState().columnFilters);\n }\n\n table.toggleAllRowsSelected(checked);\n };\n\n return (\n <Tooltip title={title}>\n <Checkbox\n aria-label={title}\n className=\"hover:border-blue !-mt-px\"\n checked={isAllRowsSelected}\n indeterminate={isSomeRowsSelected && !isAllRowsSelected}\n loading={tableMeta.server.loadAllStatus === TableServerLoadAllState.Loading}\n onChange={handleChange}\n />\n </Tooltip>\n );\n }\n\n return null;\n}\n\nconst toggleBetween = (fromRowIndex: number, toRowIndex: number): [number, number] => {\n const fromIndex = toRowIndex < fromRowIndex ? toRowIndex : fromRowIndex;\n const toIndex = toRowIndex > fromRowIndex ? toRowIndex : fromRowIndex;\n\n return [fromIndex, toIndex];\n};\n\nfunction Cell<TType = unknown>(context: ReactTableCellContext<TType, unknown>) {\n const { texts } = useLocalization();\n const { row, table } = context;\n const { rowIndex } = React.useContext(RowContext);\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n\n if (table.options.enableGrouping && table.getState().grouping?.length && !row.getIsGrouped()) {\n return null;\n }\n\n const isSelected = row.getIsGrouped() ? row.getIsAllSubRowsSelected() : row.getIsSelected();\n const canSelect = row.getCanSelect();\n const title = isSelected ? texts.table.columns.select.deselect : texts.table.columns.select.select;\n\n if (table.options.enableMultiRowSelection) {\n const handleClick = async (event: React.MouseEvent) => {\n event.stopPropagation();\n\n if (row.getIsGrouped()) {\n row.subRows.forEach(row => row.toggleSelected());\n } else if (event.shiftKey) {\n const [fromIndex, toIndex] = toggleBetween(tableMeta.rowSelection.lastSelectedRowIndex.current ?? 0, rowIndex);\n const selectedRows = table.getRowModel().rows.slice(fromIndex, toIndex + 1);\n\n if (tableMeta.server.loadAllIfNeeded && selectedRows.some(row => row.original === undefined)) {\n // don't pass the search query because we need all data - not filtered data\n await tableMeta.server.loadAllIfNeeded(table.getState().sorting, table.getState().columnFilters);\n }\n\n table.setRowSelection((currentRowSelection: RowSelectionState) => ({\n ...currentRowSelection,\n ...selectedRows.filter(row => row.getCanSelect()).reduce((state, row) => ({ ...state, [row.id]: true }), {}),\n }));\n } else {\n row.toggleSelected();\n }\n\n tableMeta.rowSelection.lastSelectedRowIndex.current = row.index;\n };\n\n return (\n <Tooltip\n hidden={!canSelect}\n title={\n <>\n {title}\n <Shortcut className=\"ml-2\" keys=\"Space\" />\n </>\n }>\n <Checkbox\n aria-label={title}\n className=\"!mt-0\"\n checked={isSelected}\n onClick={handleClick}\n disabled={!canSelect}\n // this is necessary to remove console spam from eslint\n onChange={() => false}\n />\n </Tooltip>\n );\n } else {\n const className = cn('!mt-0', getRadioClassnames(!canSelect));\n\n const handleClick = (event: React.MouseEvent): void => {\n event.stopPropagation();\n row.toggleSelected();\n tableMeta.rowSelection.lastSelectedRowIndex.current = row.index;\n };\n\n return (\n <button\n className={className}\n aria-checked={canSelect && isSelected}\n disabled={!canSelect}\n onClick={handleClick}\n role=\"radio\"\n type=\"button\">\n {isSelected ? <span className=\"h-2 w-2 rounded-full bg-white\" /> : null}\n </button>\n );\n }\n}\n\nexport const renderer: useTableManagerInternalColumn = {\n header: Header,\n renderer: Cell,\n size: 40,\n meta: {\n align: 'center',\n className: '!px-1',\n // TODO: remove when table3 is migrated, this satisfies the legacy table3 type\n enableSearch: false,\n header: '',\n headerClassName: '!px-1',\n },\n};\n"],"names":["Header","context","texts","useLocalization","table","tableMeta","options","meta","enableMultiRowSelection","isAllRowsSelected","getIsAllRowsSelected","isSomeRowsSelected","getIsSomeRowsSelected","title","columns","select","deselectAll","selectAll","handleChange","checked","toggleAllRowsSelected","_temp","server","loadAllIfNeeded","Promise","resolve","getState","sorting","columnFilters","then","_temp2","e","reject","React","Tooltip","Checkbox","className","indeterminate","loading","loadAllStatus","TableServerLoadAllState","Loading","onChange","toggleBetween","fromRowIndex","toRowIndex","fromIndex","toIndex","Cell","row","rowIndex","useContext","RowContext","enableGrouping","_table$getState$group","grouping","length","getIsGrouped","isSelected","getIsAllSubRowsSelected","getIsSelected","canSelect","getCanSelect","deselect","handleClick","event","rowSelection","lastSelectedRowIndex","current","index","stopPropagation","_temp6","subRows","forEach","toggleSelected","_temp5","shiftKey","_tableMeta$rowSelecti","_temp4","setRowSelection","currentRowSelection","selectedRows","filter","reduce","state","id","getRowModel","rows","slice","_temp3","some","original","undefined","_temp7","hidden","Shortcut","keys","onClick","disabled","cn","getRadioClassnames","role","type","renderer","header","size","align","enableSearch","headerClassName"],"mappings":"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"}
|
|
@@ -30,7 +30,8 @@ function Summary(props) {
|
|
|
30
30
|
count = /*#__PURE__*/React__default.createElement("strong", null, new Intl.NumberFormat(locale).format(length));
|
|
31
31
|
}
|
|
32
32
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
33
|
-
|
|
33
|
+
// translate-y-1 is used to prevent the summary cell's box shadow from clipping the border
|
|
34
|
+
className: "sticky left-0 z-20 flex h-full w-fit items-center whitespace-nowrap bg-white pr-1 shadow-[12px_0px_6px_white] print:!translate-y-1",
|
|
34
35
|
"data-taco": "table-footer-summary"
|
|
35
36
|
}, label, "\u00A0", count);
|
|
36
37
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Summary.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Footer/Summary.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useLocalization } from '../../../../../components/Provider/Localization';\n\nexport type FooterSummaryProps<TType = unknown> = {\n table: ReactTable<TType>;\n};\n\nexport function Summary<TType = unknown>(props: FooterSummaryProps<TType>) {\n const { table } = props;\n const { locale, texts } = useLocalization();\n const length = (table.options.meta as ReactTableMeta<TType>).length;\n const currentLength = table.getRowModel().rows.length;\n\n let label;\n let count;\n\n // row selection\n const rowsSelectedLength = table.getSelectedRowModel().rows.length;\n\n if (rowsSelectedLength > 0) {\n label = texts.table.footer.summary.selected;\n count = (\n <>\n <strong>{new Intl.NumberFormat(locale).format(rowsSelectedLength)}</strong> \n {texts.table.footer.summary.count} \n <strong>{new Intl.NumberFormat(locale).format(length)}</strong>\n </>\n );\n } else if (\n table.getState().columnFilters?.length || // filtered data\n (!!table.getState().globalFilter && table.options.enableGlobalFilter) // search with hide enabled\n ) {\n label = texts.table.footer.summary.records;\n count = (\n <>\n <strong>{currentLength}</strong> \n {texts.table.footer.summary.count} \n <strong>{new Intl.NumberFormat(locale).format(length)}</strong>\n </>\n );\n } else {\n label = texts.table.footer.summary.records;\n count = <strong>{new Intl.NumberFormat(locale).format(length)}</strong>;\n }\n\n return (\n <div\n className=\"sticky left-0 z-20 flex h-full w-fit items-center whitespace-nowrap bg-white pr-1 shadow-[12px_0px_6px_white]\"\n data-taco=\"table-footer-summary\">\n {label} {count}\n </div>\n );\n}\n"],"names":["Summary","props","table","locale","texts","useLocalization","length","options","meta","currentLength","getRowModel","rows","label","count","rowsSelectedLength","getSelectedRowModel","footer","summary","selected","React","Intl","NumberFormat","format","_table$getState$colum","getState","columnFilters","globalFilter","enableGlobalFilter","records","className"],"mappings":";;;SAQgBA,OAAOA,CAAkBC,KAAgC;;EACrE,MAAM;IAAEC;GAAO,GAAGD,KAAK;EACvB,MAAM;IAAEE,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EAC3C,MAAMC,MAAM,GAAIJ,KAAK,CAACK,OAAO,CAACC,IAA8B,CAACF,MAAM;EACnE,MAAMG,aAAa,GAAGP,KAAK,CAACQ,WAAW,EAAE,CAACC,IAAI,CAACL,MAAM;EAErD,IAAIM,KAAK;EACT,IAAIC,KAAK;;EAGT,MAAMC,kBAAkB,GAAGZ,KAAK,CAACa,mBAAmB,EAAE,CAACJ,IAAI,CAACL,MAAM;EAElE,IAAIQ,kBAAkB,GAAG,CAAC,EAAE;IACxBF,KAAK,GAAGR,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACC,QAAQ;IAC3CL,KAAK,gBACDM,yEACIA,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAAClB,MAAM,CAAC,CAACmB,MAAM,CAACR,kBAAkB,CAAC,CAAU,YAC1EV,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACJ,KAAK,yBACjCM,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAAClB,MAAM,CAAC,CAACmB,MAAM,CAAChB,MAAM,CAAC,CAAU,CAEtE;GACJ,MAAM,IACH,CAAAiB,qBAAA,GAAArB,KAAK,CAACsB,QAAQ,EAAE,CAACC,aAAa,cAAAF,qBAAA,eAA9BA,qBAAA,CAAgCjB,MAAM;;EACrC,CAAC,CAACJ,KAAK,CAACsB,QAAQ,EAAE,CAACE,YAAY,IAAIxB,KAAK,CAACK,OAAO,CAACoB,kBAAmB;IACvE;IACEf,KAAK,GAAGR,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACW,OAAO;IAC1Cf,KAAK,gBACDM,yEACIA,6CAASV,aAAa,CAAU,YAC/BL,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACJ,KAAK,yBACjCM,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAAClB,MAAM,CAAC,CAACmB,MAAM,CAAChB,MAAM,CAAC,CAAU,CAEtE;GACJ,MAAM;IACHM,KAAK,GAAGR,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACW,OAAO;IAC1Cf,KAAK,gBAAGM,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAAClB,MAAM,CAAC,CAACmB,MAAM,CAAChB,MAAM,CAAC,CAAU;;EAG3E,oBACIa
|
|
1
|
+
{"version":3,"file":"Summary.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Footer/Summary.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as ReactTable, TableMeta as ReactTableMeta } from '@tanstack/react-table';\nimport { useLocalization } from '../../../../../components/Provider/Localization';\n\nexport type FooterSummaryProps<TType = unknown> = {\n table: ReactTable<TType>;\n};\n\nexport function Summary<TType = unknown>(props: FooterSummaryProps<TType>) {\n const { table } = props;\n const { locale, texts } = useLocalization();\n const length = (table.options.meta as ReactTableMeta<TType>).length;\n const currentLength = table.getRowModel().rows.length;\n\n let label;\n let count;\n\n // row selection\n const rowsSelectedLength = table.getSelectedRowModel().rows.length;\n\n if (rowsSelectedLength > 0) {\n label = texts.table.footer.summary.selected;\n count = (\n <>\n <strong>{new Intl.NumberFormat(locale).format(rowsSelectedLength)}</strong> \n {texts.table.footer.summary.count} \n <strong>{new Intl.NumberFormat(locale).format(length)}</strong>\n </>\n );\n } else if (\n table.getState().columnFilters?.length || // filtered data\n (!!table.getState().globalFilter && table.options.enableGlobalFilter) // search with hide enabled\n ) {\n label = texts.table.footer.summary.records;\n count = (\n <>\n <strong>{currentLength}</strong> \n {texts.table.footer.summary.count} \n <strong>{new Intl.NumberFormat(locale).format(length)}</strong>\n </>\n );\n } else {\n label = texts.table.footer.summary.records;\n count = <strong>{new Intl.NumberFormat(locale).format(length)}</strong>;\n }\n\n return (\n <div\n // translate-y-1 is used to prevent the summary cell's box shadow from clipping the border\n className=\"sticky left-0 z-20 flex h-full w-fit items-center whitespace-nowrap bg-white pr-1 shadow-[12px_0px_6px_white] print:!translate-y-1\"\n data-taco=\"table-footer-summary\">\n {label} {count}\n </div>\n );\n}\n"],"names":["Summary","props","table","locale","texts","useLocalization","length","options","meta","currentLength","getRowModel","rows","label","count","rowsSelectedLength","getSelectedRowModel","footer","summary","selected","React","Intl","NumberFormat","format","_table$getState$colum","getState","columnFilters","globalFilter","enableGlobalFilter","records","className"],"mappings":";;;SAQgBA,OAAOA,CAAkBC,KAAgC;;EACrE,MAAM;IAAEC;GAAO,GAAGD,KAAK;EACvB,MAAM;IAAEE,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EAC3C,MAAMC,MAAM,GAAIJ,KAAK,CAACK,OAAO,CAACC,IAA8B,CAACF,MAAM;EACnE,MAAMG,aAAa,GAAGP,KAAK,CAACQ,WAAW,EAAE,CAACC,IAAI,CAACL,MAAM;EAErD,IAAIM,KAAK;EACT,IAAIC,KAAK;;EAGT,MAAMC,kBAAkB,GAAGZ,KAAK,CAACa,mBAAmB,EAAE,CAACJ,IAAI,CAACL,MAAM;EAElE,IAAIQ,kBAAkB,GAAG,CAAC,EAAE;IACxBF,KAAK,GAAGR,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACC,QAAQ;IAC3CL,KAAK,gBACDM,yEACIA,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAAClB,MAAM,CAAC,CAACmB,MAAM,CAACR,kBAAkB,CAAC,CAAU,YAC1EV,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACJ,KAAK,yBACjCM,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAAClB,MAAM,CAAC,CAACmB,MAAM,CAAChB,MAAM,CAAC,CAAU,CAEtE;GACJ,MAAM,IACH,CAAAiB,qBAAA,GAAArB,KAAK,CAACsB,QAAQ,EAAE,CAACC,aAAa,cAAAF,qBAAA,eAA9BA,qBAAA,CAAgCjB,MAAM;;EACrC,CAAC,CAACJ,KAAK,CAACsB,QAAQ,EAAE,CAACE,YAAY,IAAIxB,KAAK,CAACK,OAAO,CAACoB,kBAAmB;IACvE;IACEf,KAAK,GAAGR,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACW,OAAO;IAC1Cf,KAAK,gBACDM,yEACIA,6CAASV,aAAa,CAAU,YAC/BL,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACJ,KAAK,yBACjCM,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAAClB,MAAM,CAAC,CAACmB,MAAM,CAAChB,MAAM,CAAC,CAAU,CAEtE;GACJ,MAAM;IACHM,KAAK,GAAGR,KAAK,CAACF,KAAK,CAACc,MAAM,CAACC,OAAO,CAACW,OAAO;IAC1Cf,KAAK,gBAAGM,6CAAS,IAAIC,IAAI,CAACC,YAAY,CAAClB,MAAM,CAAC,CAACmB,MAAM,CAAChB,MAAM,CAAC,CAAU;;EAG3E,oBACIa;;IAEIU,SAAS,EAAC,oIAAoI;iBACpI;KACTjB,KAAK,YAAQC,KAAK,CACjB;AAEd;;;;"}
|