@economic/taco 2.37.2 → 2.38.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/Select2/Select2.d.ts +6 -1
- package/dist/components/Select2/components/Context.d.ts +3 -1
- package/dist/components/Select2/types.d.ts +3 -1
- package/dist/esm/packages/taco/src/components/Select2/Select2.js +9 -4
- package/dist/esm/packages/taco/src/components/Select2/Select2.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Context.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/components/Create.js +35 -12
- package/dist/esm/packages/taco/src/components/Select2/components/Create.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Select2/utilities.js +1 -1
- package/dist/esm/packages/taco/src/components/Select2/utilities.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/Header.js +3 -0
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/Header.js.map +1 -1
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Resizer.js +15 -9
- package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Resizer.js.map +1 -1
- package/dist/primitives/Table/Core/components/Header/Header.d.ts +1 -0
- package/dist/primitives/Table/Core/components/Header/components/Resizer.d.ts +1 -0
- package/dist/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterColumn.d.ts +1 -1
- package/dist/taco.cjs.development.js +61 -26
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -2
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { Select2Children, Select2CreateHandler, Select2DeleteHandler, Select2EditHandler, Select2OptionValue, Select2Value } from './types';
|
|
2
|
+
import { Select2Children, Select2CreateHandler, Select2CreateDialogRenderer, Select2DeleteHandler, Select2EditHandler, Select2OptionValue, Select2Value } from './types';
|
|
3
3
|
import { Select2OptionProps } from './components/Option';
|
|
4
4
|
import { Select2GroupProps } from './components/Group';
|
|
5
5
|
import { Select2TitleProps } from './components/Title';
|
|
@@ -59,6 +59,11 @@ declare type Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'child
|
|
|
59
59
|
tags?: boolean;
|
|
60
60
|
/** Value of the input in select2 */
|
|
61
61
|
value?: Select2Value;
|
|
62
|
+
/** Create dialog component, if specified, then create button will become always visible in the bottom of options dropdown,
|
|
63
|
+
* when clicked, it will open create dialog and wait for 'onCreate' handler to be triggered from the dialog */
|
|
64
|
+
createDialog?: Select2CreateDialogRenderer;
|
|
65
|
+
/** Create button text */
|
|
66
|
+
createTriggerText?: string;
|
|
62
67
|
};
|
|
63
68
|
declare type Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {
|
|
64
69
|
Option: React.ForwardRefExoticComponent<Select2OptionProps>;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { CollectionRef } from '../../../primitives/Collection/Collection';
|
|
3
|
-
import { Select2CreateHandler, Select2DeleteHandler, Select2EditHandler, Select2OptionValue, Select2Value } from '../types';
|
|
3
|
+
import { Select2CreateHandler, Select2DeleteHandler, Select2EditHandler, Select2OptionValue, Select2Value, Select2CreateDialogRenderer } from '../types';
|
|
4
4
|
import { FontSize } from '../../../types';
|
|
5
5
|
export declare type Select2ContextProps = {
|
|
6
|
+
createDialog?: Select2CreateDialogRenderer;
|
|
7
|
+
createTriggerText?: string;
|
|
6
8
|
disabled: boolean;
|
|
7
9
|
highlighted: boolean;
|
|
8
10
|
invalid: boolean;
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { Listbox2OptionValue } from '../../primitives/Listbox2/types';
|
|
3
3
|
import { Color } from '../../types';
|
|
4
|
+
import { DialogProps } from '../Dialog/Dialog';
|
|
4
5
|
import { Select2GroupProps, Select2OptionProps } from './Select2';
|
|
5
6
|
export declare type Select2OptionValue = Listbox2OptionValue;
|
|
6
7
|
export declare type Select2Value = Select2OptionValue | Select2OptionValue[];
|
|
7
8
|
export declare type Select2Children = Array<React.ReactElement<Select2OptionProps> | React.ReactElement<Select2GroupProps>>;
|
|
8
|
-
export declare type Select2CreateHandler = (
|
|
9
|
+
export declare type Select2CreateHandler = (item: any, color: Color | undefined) => Promise<Select2OptionProps> | Select2OptionProps;
|
|
10
|
+
export declare type Select2CreateDialogRenderer = (props: Partial<DialogProps>, value: string, onCreate: (optionToCreate: unknown) => Promise<void>) => JSX.Element;
|
|
9
11
|
export declare type Select2DeleteHandler = (value: Select2OptionValue) => Promise<void> | void;
|
|
10
12
|
export declare type Select2EditHandler = (value: Select2OptionValue, text: string, color: Color | undefined) => Promise<void> | void;
|
|
@@ -49,6 +49,8 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
|
|
|
49
49
|
readOnly = false,
|
|
50
50
|
tags = false,
|
|
51
51
|
value: prop,
|
|
52
|
+
createDialog,
|
|
53
|
+
createTriggerText,
|
|
52
54
|
...otherProps
|
|
53
55
|
} = props;
|
|
54
56
|
const emptyOption = React__default.useMemo(() => {
|
|
@@ -128,7 +130,9 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
|
|
|
128
130
|
tags,
|
|
129
131
|
fontSize,
|
|
130
132
|
validationError,
|
|
131
|
-
value
|
|
133
|
+
value,
|
|
134
|
+
createDialog,
|
|
135
|
+
createTriggerText
|
|
132
136
|
};
|
|
133
137
|
const handleKeyDown = event => {
|
|
134
138
|
var _listboxRef$current;
|
|
@@ -213,7 +217,8 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
|
|
|
213
217
|
setValue(nextValue);
|
|
214
218
|
}
|
|
215
219
|
};
|
|
216
|
-
const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none
|
|
220
|
+
const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none', createCollectionClassName());
|
|
221
|
+
const isInlineCreation = onCreate && !createDialog;
|
|
217
222
|
return /*#__PURE__*/React__default.createElement(Select2Context.Provider, {
|
|
218
223
|
value: context
|
|
219
224
|
}, /*#__PURE__*/React__default.createElement(Root, {
|
|
@@ -244,8 +249,8 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
|
|
|
244
249
|
style: {
|
|
245
250
|
minWidth: dimensions !== null && dimensions !== void 0 && dimensions.width ? `${dimensions.width}px` : undefined
|
|
246
251
|
}
|
|
247
|
-
}, flattenedChildren.length > 0 ||
|
|
248
|
-
placeholder:
|
|
252
|
+
}, flattenedChildren.length > 0 || isInlineCreation ? ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Search, {
|
|
253
|
+
placeholder: isInlineCreation ? texts.select2.searchOrCreate : texts.select2.search,
|
|
249
254
|
ref: searchRef,
|
|
250
255
|
onTabKeyPress: () => setTabTriggeredClose(true)
|
|
251
256
|
}), multiple && selectOptions.length > 1 && ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Button, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport {\n Select2Children,\n Select2CreateHandler,\n Select2DeleteHandler,\n Select2EditHandler,\n Select2OptionValue,\n Select2Value,\n} from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName, getFontSize } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { isGroup, useChildren } from './hooks/useChildren';\n\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Localization';\nimport { useIsHoverStatePaused } from '../../hooks/useIsHoverStatePaused';\nimport { isAriaDirectionKey } from '../../utils/aria';\nimport { getNextFocussableElement, isElementInsideTable3OrReport } from '../../utils/dom';\nimport { FontSize, FontSizes } from '../../types';\nimport { Button } from '../Button/Button';\nimport { Spinner } from '../Spinner/Spinner';\n\ntype Select2Texts = {\n allSelect: string;\n allDeselect: string;\n cancel: string;\n chooseColor: string;\n create: string;\n delete: string;\n save: string;\n search: string;\n searchOrCreate: string;\n selectAll: string;\n selectAllResults: string;\n deselectAll: string;\n deselectAllResults: string;\n};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n /** Autofocus Select2 when loaded **/\n autoFocus?: boolean;\n /** Array of options in Select2 */\n children: Select2Children;\n /** Initial value of the input in Select2 */\n defaultValue?: Select2Value;\n /** Set what value should have an empty option in Select2 */\n emptyValue?: Select2OptionValue;\n /** Whether the Select2 is in a disabled state **/\n disabled?: boolean;\n /** Font size of text in Select2 **/\n fontSize?: FontSize;\n /** Draws attention to the Select2 by changing its style and making it visually prominent */\n highlighted?: boolean;\n /** Whether the Select2 is in an invalid state **/\n invalid?: boolean;\n /** Whether the Select2 is loading the data **/\n loading?: boolean;\n /** Whether the Select2 allows selecting multiple values **/\n multiple?: boolean;\n /** Whether the Select2 is in an invalid state **/\n name?: string;\n /** Handler called when user chooses an option from the provided options **/\n onChange?: (value: Select2Value) => void;\n /** Handler called when user creates a new option **/\n onCreate?: Select2CreateHandler;\n /** Handler called when user deletes an option **/\n onDelete?: Select2DeleteHandler;\n /** Handler called when user edits an option **/\n onEdit?: Select2EditHandler;\n /** Placeholder showed when nothing is selected **/\n placeholder?: string;\n /** Whether the Select2 is in a readonly state **/\n readOnly?: boolean;\n required?: boolean;\n /** Renders select options as tags **/\n tags?: boolean;\n /** Value of the input in select2 */\n value?: Select2Value;\n};\ntype Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nconst Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n const {\n children: initChildren,\n defaultValue: defaultProp,\n disabled = false,\n emptyValue = undefined,\n fontSize,\n highlighted = false,\n invalid = false,\n loading,\n multiple = false,\n name,\n onChange,\n onCreate,\n onDelete,\n onEdit,\n placeholder,\n readOnly = false,\n tags = false,\n value: prop,\n ...otherProps\n } = props;\n\n const emptyOption: React.ReactElement<Select2OptionProps> | undefined = React.useMemo(() => {\n if (emptyValue !== undefined && !multiple) {\n // Empty option has 0px height, because it's empty, so need to apply height manually\n return <Option key=\"__empty\" children=\"\" value={emptyValue} className=\"h-8\" />;\n }\n return;\n }, [emptyValue, multiple]);\n\n const initialChildren = React.useMemo(() => {\n if (emptyOption) {\n return [emptyOption, ...initChildren] as Select2Children;\n }\n return initChildren;\n }, [emptyOption, initChildren]);\n\n // refs\n const internalRef = useMergedRef<HTMLButtonElement>(ref);\n const listboxRef = React.useRef<CollectionRef>(null);\n const searchRef = React.useRef<HTMLInputElement>(null);\n const { texts } = useLocalization();\n // align the listbox min width with the width of the input - it should never be smaller\n const dimensions = useBoundingClientRectListener(internalRef);\n\n // state\n const [tabTriggeredClose, setTabTriggeredClose] = React.useState(false);\n const [open, setOpen] = React.useState(false);\n const [value, _setValue] = useControllableState<Select2Value>({\n // uncontrolled\n defaultProp,\n // controlled\n onChange,\n prop,\n });\n const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n const [validationError, setValidationError] = React.useState<Error | undefined>();\n const [shouldPauseHoverState, setShouldPauseHoverState] = useIsHoverStatePaused();\n\n const { flattenedChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n children: initialChildren,\n emptyValue,\n multiple,\n open,\n setValue,\n value,\n });\n\n // context\n const context = {\n disabled,\n highlighted,\n invalid,\n listboxRef,\n multiple,\n onCreate,\n onDelete,\n onEdit,\n open,\n readOnly,\n ref: internalRef,\n searchQuery,\n searchRef,\n setOpen,\n setSearchQuery,\n setValidationError,\n setValue,\n shouldPauseHoverState,\n setShouldPauseHoverState,\n tags,\n fontSize,\n validationError,\n value,\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (open) {\n event.preventDefault();\n } else if (isElementInsideTable3OrReport(event.currentTarget)) {\n return;\n } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {\n setOpen(true);\n }\n\n // the focus should always remain on the input, so we forward events on to the listbox\n listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n };\n\n let handleBlur;\n\n if (otherProps.onBlur) {\n // we might be focusing on an input or something inside the dropdown that was triggered by the select\n // so see if the element gaining focus is inside a portal and look up its controller\n // if we don't do this, things like validate on blur occur while simply opening the select\n handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n const elementGainingFocus = event.relatedTarget;\n\n if (elementGainingFocus === undefined) {\n return;\n }\n\n const portalId = elementGainingFocus?.closest('[data-radix-popper-content-wrapper] > :first-child')?.id;\n\n if (!portalId || event.currentTarget.getAttribute(`aria-controls`) !== portalId) {\n otherProps.onBlur?.(event);\n }\n };\n }\n\n const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (isAriaDirectionKey(event)) {\n setShouldPauseHoverState(true);\n }\n };\n\n const handleCloseAutoFocus = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n\n if (tabTriggeredClose) {\n const nextFocussableElement = getNextFocussableElement(internalRef.current);\n\n if (nextFocussableElement) {\n // UX requirement: move focus to the next focussable element when tab key is pressed to select the value\n nextFocussableElement.focus();\n // Reset the tabTriggeredClose state\n setTabTriggeredClose(false);\n }\n } else {\n internalRef.current?.focus();\n }\n };\n\n const selectOptions =\n searchQuery === ''\n ? flattenedChildren.map(child => child.props.value)\n : filteredChildren\n .map(child =>\n isGroup(child)\n ? Array.isArray(child.props.children) && child.props.children.map(subChild => subChild.props.value)\n : child.props.value\n )\n .flatMap(c => c) || [];\n\n const areAllSelected = Array.isArray(value) && selectOptions.every(option => value.includes(option as string));\n\n const selectAllText = React.useMemo(() => {\n if (searchQuery === '') {\n if (areAllSelected) {\n return texts.select2.deselectAll;\n } else {\n return texts.select2.selectAll;\n }\n } else if (areAllSelected) {\n return texts.select2.deselectAllResults;\n } else {\n return texts.select2.selectAllResults;\n }\n }, [areAllSelected, searchQuery]);\n\n const selectAll = () => {\n if (!Array.isArray(value) || value.length === 0) {\n setValue(selectOptions);\n } else {\n // array of all available options which are not selected\n const preselectedValues = selectOptions.filter(option => !value.includes(option));\n setValue([...value, ...preselectedValues]);\n }\n };\n\n const deselectAll = () => {\n if (searchQuery === '') {\n setValue([]);\n } else {\n const nextValue = Array.isArray(value) && value.filter(subValue => !selectOptions.includes(subValue as string));\n setValue(nextValue);\n }\n };\n\n const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none\"', createCollectionClassName());\n\n return (\n <Select2Context.Provider value={context}>\n <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n <PopoverPrimitive.Trigger asChild data-taco=\"Select2\">\n <Trigger\n {...otherProps}\n aria-haspopup=\"listbox\"\n emptyValue={emptyValue}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n ref={internalRef}>\n {flattenedChildren}\n </Trigger>\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n asChild\n align=\"start\"\n onOpenAutoFocus={() => {\n internalRef.current?.focus();\n }}\n onCloseAutoFocus={handleCloseAutoFocus}\n sideOffset={4}\n tabIndex={-1}>\n <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n {flattenedChildren.length > 0 || onCreate ? (\n <>\n <Search\n placeholder={onCreate ? texts.select2.searchOrCreate : texts.select2.search}\n ref={searchRef}\n onTabKeyPress={() => setTabTriggeredClose(true)}\n />\n {multiple && selectOptions.length > 1 && (\n <>\n <Button\n className=\"!justify-start\"\n appearance=\"discrete\"\n onClick={areAllSelected ? deselectAll : selectAll}>\n {selectAllText}\n </Button>\n <div className=\"border-grey-300 mx-3 rounded border-t\" />\n </>\n )}\n </>\n ) : null}\n {loading ? (\n <span className={cn('text-grey-700 flex items-center italic', fontSize && getFontSize(fontSize))}>\n <span>\n <Spinner\n delay={0}\n className={cn('ml-3 mr-2 mt-1.5 h-5 w-5', {\n '!mt-1 !h-3.5 !w-3.5': fontSize === FontSizes.small,\n '!h-4 !w-4': fontSize === FontSizes.medium,\n '!h-5 !w-5': fontSize === FontSizes.large,\n })}\n />\n </span>\n <span>{texts.listbox.loading}</span>\n </span>\n ) : flattenedChildren.length <= 0 ? (\n <div className=\"text-grey-700 -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n No results found...\n </div>\n ) : (\n <ListboxPrimitive.Root\n className=\"flex flex-col gap-0.5\"\n customSelector=\":scope > button\"\n disabled={disabled}\n multiple={multiple}\n onKeyDown={handleListboxKeyDown}\n readOnly={readOnly}\n ref={listboxRef}\n setValue={setValue}\n tabIndex={-1}\n value={value}>\n {searchQuery === '' ? (\n <Collection>{initialChildren}</Collection>\n ) : (\n <Collection>{filteredChildren}</Collection>\n )}\n {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n </ListboxPrimitive.Root>\n )}\n </div>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n <ControlledHiddenField\n emptyValue={emptyValue}\n multiple={multiple || tags}\n name={name}\n options={flattenedChildren.map(child => child.props.value)}\n parentRef={internalRef}\n setValue={setValue}\n value={value}\n />\n </PopoverPrimitive.Root>\n </Select2Context.Provider>\n );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n let bubbleValue;\n\n if (isFormControl) {\n if (value !== undefined) {\n if (multiple) {\n bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n } else {\n bubbleValue = value === null ? '' : String(value);\n }\n }\n\n return (\n <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} value={bubbleValue}>\n {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n {options.map(option => (\n <option key={String(option)} value={String(option)} />\n ))}\n </BubbleSelect>\n );\n }\n\n return null;\n};\nSelect2.displayName = 'Select2';\n\nexport { Select2 };\n\nexport type {\n Select2Texts,\n Select2GroupProps,\n Select2OptionProps,\n Select2OptionValue,\n Select2Value,\n Select2Props,\n Select2TitleProps,\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initChildren","defaultValue","defaultProp","disabled","emptyValue","undefined","fontSize","highlighted","invalid","loading","multiple","name","onChange","onCreate","onDelete","onEdit","placeholder","readOnly","tags","value","prop","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","tabTriggeredClose","setTabTriggeredClose","useState","open","setOpen","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","isElementInsideTable3OrReport","currentTarget","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","stopPropagation","nextFocussableElement","getNextFocussableElement","focus","_internalRef$current","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","length","preselectedValues","filter","nextValue","subValue","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current2","onCloseAutoFocus","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","onTabKeyPress","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","customSelector","Collection","Create","options","ControlledHiddenField","parentRef","Group","Title","isFormControl","useIsFormControl","bubbleValue","String","BubbleSelect","displayName"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport {\n Select2Children,\n Select2CreateHandler,\n Select2CreateDialogRenderer,\n Select2DeleteHandler,\n Select2EditHandler,\n Select2OptionValue,\n Select2Value,\n} from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName, getFontSize } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { isGroup, useChildren } from './hooks/useChildren';\n\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Localization';\nimport { useIsHoverStatePaused } from '../../hooks/useIsHoverStatePaused';\nimport { isAriaDirectionKey } from '../../utils/aria';\nimport { getNextFocussableElement, isElementInsideTable3OrReport } from '../../utils/dom';\nimport { FontSize, FontSizes } from '../../types';\nimport { Button } from '../Button/Button';\nimport { Spinner } from '../Spinner/Spinner';\n\ntype Select2Texts = {\n allSelect: string;\n allDeselect: string;\n cancel: string;\n chooseColor: string;\n create: string;\n delete: string;\n save: string;\n search: string;\n searchOrCreate: string;\n selectAll: string;\n selectAllResults: string;\n deselectAll: string;\n deselectAllResults: string;\n};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n /** Autofocus Select2 when loaded **/\n autoFocus?: boolean;\n /** Array of options in Select2 */\n children: Select2Children;\n /** Initial value of the input in Select2 */\n defaultValue?: Select2Value;\n /** Set what value should have an empty option in Select2 */\n emptyValue?: Select2OptionValue;\n /** Whether the Select2 is in a disabled state **/\n disabled?: boolean;\n /** Font size of text in Select2 **/\n fontSize?: FontSize;\n /** Draws attention to the Select2 by changing its style and making it visually prominent */\n highlighted?: boolean;\n /** Whether the Select2 is in an invalid state **/\n invalid?: boolean;\n /** Whether the Select2 is loading the data **/\n loading?: boolean;\n /** Whether the Select2 allows selecting multiple values **/\n multiple?: boolean;\n /** Whether the Select2 is in an invalid state **/\n name?: string;\n /** Handler called when user chooses an option from the provided options **/\n onChange?: (value: Select2Value) => void;\n /** Handler called when user creates a new option **/\n onCreate?: Select2CreateHandler;\n /** Handler called when user deletes an option **/\n onDelete?: Select2DeleteHandler;\n /** Handler called when user edits an option **/\n onEdit?: Select2EditHandler;\n /** Placeholder showed when nothing is selected **/\n placeholder?: string;\n /** Whether the Select2 is in a readonly state **/\n readOnly?: boolean;\n required?: boolean;\n /** Renders select options as tags **/\n tags?: boolean;\n /** Value of the input in select2 */\n value?: Select2Value;\n /** Create dialog component, if specified, then create button will become always visible in the bottom of options dropdown,\n * when clicked, it will open create dialog and wait for 'onCreate' handler to be triggered from the dialog */\n createDialog?: Select2CreateDialogRenderer;\n /** Create button text */\n createTriggerText?: string;\n};\ntype Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nconst Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n const {\n children: initChildren,\n defaultValue: defaultProp,\n disabled = false,\n emptyValue = undefined,\n fontSize,\n highlighted = false,\n invalid = false,\n loading,\n multiple = false,\n name,\n onChange,\n onCreate,\n onDelete,\n onEdit,\n placeholder,\n readOnly = false,\n tags = false,\n value: prop,\n createDialog,\n createTriggerText,\n ...otherProps\n } = props;\n\n const emptyOption: React.ReactElement<Select2OptionProps> | undefined = React.useMemo(() => {\n if (emptyValue !== undefined && !multiple) {\n // Empty option has 0px height, because it's empty, so need to apply height manually\n return <Option key=\"__empty\" children=\"\" value={emptyValue} className=\"h-8\" />;\n }\n return;\n }, [emptyValue, multiple]);\n\n const initialChildren = React.useMemo(() => {\n if (emptyOption) {\n return [emptyOption, ...initChildren] as Select2Children;\n }\n return initChildren;\n }, [emptyOption, initChildren]);\n\n // refs\n const internalRef = useMergedRef<HTMLButtonElement>(ref);\n const listboxRef = React.useRef<CollectionRef>(null);\n const searchRef = React.useRef<HTMLInputElement>(null);\n const { texts } = useLocalization();\n // align the listbox min width with the width of the input - it should never be smaller\n const dimensions = useBoundingClientRectListener(internalRef);\n\n // state\n const [tabTriggeredClose, setTabTriggeredClose] = React.useState(false);\n const [open, setOpen] = React.useState(false);\n const [value, _setValue] = useControllableState<Select2Value>({\n // uncontrolled\n defaultProp,\n // controlled\n onChange,\n prop,\n });\n const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n const [validationError, setValidationError] = React.useState<Error | undefined>();\n const [shouldPauseHoverState, setShouldPauseHoverState] = useIsHoverStatePaused();\n\n const { flattenedChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n children: initialChildren,\n emptyValue,\n multiple,\n open,\n setValue,\n value,\n });\n\n // context\n const context = {\n disabled,\n highlighted,\n invalid,\n listboxRef,\n multiple,\n onCreate,\n onDelete,\n onEdit,\n open,\n readOnly,\n ref: internalRef,\n searchQuery,\n searchRef,\n setOpen,\n setSearchQuery,\n setValidationError,\n setValue,\n shouldPauseHoverState,\n setShouldPauseHoverState,\n tags,\n fontSize,\n validationError,\n value,\n createDialog,\n createTriggerText,\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (open) {\n event.preventDefault();\n } else if (isElementInsideTable3OrReport(event.currentTarget)) {\n return;\n } else if (!event.ctrlKey && !event.metaKey && (event.key === 'ArrowDown' || /^[a-z0-9]$/i.test(event.key))) {\n setOpen(true);\n }\n\n // the focus should always remain on the input, so we forward events on to the listbox\n listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n };\n\n let handleBlur;\n\n if (otherProps.onBlur) {\n // we might be focusing on an input or something inside the dropdown that was triggered by the select\n // so see if the element gaining focus is inside a portal and look up its controller\n // if we don't do this, things like validate on blur occur while simply opening the select\n handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n const elementGainingFocus = event.relatedTarget;\n\n if (elementGainingFocus === undefined) {\n return;\n }\n\n const portalId = elementGainingFocus?.closest('[data-radix-popper-content-wrapper] > :first-child')?.id;\n\n if (!portalId || event.currentTarget.getAttribute(`aria-controls`) !== portalId) {\n otherProps.onBlur?.(event);\n }\n };\n }\n\n const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n if (isAriaDirectionKey(event)) {\n setShouldPauseHoverState(true);\n }\n };\n\n const handleCloseAutoFocus = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n\n if (tabTriggeredClose) {\n const nextFocussableElement = getNextFocussableElement(internalRef.current);\n\n if (nextFocussableElement) {\n // UX requirement: move focus to the next focussable element when tab key is pressed to select the value\n nextFocussableElement.focus();\n // Reset the tabTriggeredClose state\n setTabTriggeredClose(false);\n }\n } else {\n internalRef.current?.focus();\n }\n };\n\n const selectOptions =\n searchQuery === ''\n ? flattenedChildren.map(child => child.props.value)\n : filteredChildren\n .map(child =>\n isGroup(child)\n ? Array.isArray(child.props.children) && child.props.children.map(subChild => subChild.props.value)\n : child.props.value\n )\n .flatMap(c => c) || [];\n\n const areAllSelected = Array.isArray(value) && selectOptions.every(option => value.includes(option as string));\n\n const selectAllText = React.useMemo(() => {\n if (searchQuery === '') {\n if (areAllSelected) {\n return texts.select2.deselectAll;\n } else {\n return texts.select2.selectAll;\n }\n } else if (areAllSelected) {\n return texts.select2.deselectAllResults;\n } else {\n return texts.select2.selectAllResults;\n }\n }, [areAllSelected, searchQuery]);\n\n const selectAll = () => {\n if (!Array.isArray(value) || value.length === 0) {\n setValue(selectOptions);\n } else {\n // array of all available options which are not selected\n const preselectedValues = selectOptions.filter(option => !value.includes(option));\n setValue([...value, ...preselectedValues]);\n }\n };\n\n const deselectAll = () => {\n if (searchQuery === '') {\n setValue([]);\n } else {\n const nextValue = Array.isArray(value) && value.filter(subValue => !selectOptions.includes(subValue as string));\n setValue(nextValue);\n }\n };\n\n const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none', createCollectionClassName());\n const isInlineCreation = onCreate && !createDialog;\n\n return (\n <Select2Context.Provider value={context}>\n <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n <PopoverPrimitive.Trigger asChild data-taco=\"Select2\">\n <Trigger\n {...otherProps}\n aria-haspopup=\"listbox\"\n emptyValue={emptyValue}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n ref={internalRef}>\n {flattenedChildren}\n </Trigger>\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n asChild\n align=\"start\"\n onOpenAutoFocus={() => {\n internalRef.current?.focus();\n }}\n onCloseAutoFocus={handleCloseAutoFocus}\n sideOffset={4}\n tabIndex={-1}>\n <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n {flattenedChildren.length > 0 || isInlineCreation ? (\n <>\n <Search\n placeholder={isInlineCreation ? texts.select2.searchOrCreate : texts.select2.search}\n ref={searchRef}\n onTabKeyPress={() => setTabTriggeredClose(true)}\n />\n {multiple && selectOptions.length > 1 && (\n <>\n <Button\n className=\"!justify-start\"\n appearance=\"discrete\"\n onClick={areAllSelected ? deselectAll : selectAll}>\n {selectAllText}\n </Button>\n <div className=\"border-grey-300 mx-3 rounded border-t\" />\n </>\n )}\n </>\n ) : null}\n {loading ? (\n <span className={cn('text-grey-700 flex items-center italic', fontSize && getFontSize(fontSize))}>\n <span>\n <Spinner\n delay={0}\n className={cn('ml-3 mr-2 mt-1.5 h-5 w-5', {\n '!mt-1 !h-3.5 !w-3.5': fontSize === FontSizes.small,\n '!h-4 !w-4': fontSize === FontSizes.medium,\n '!h-5 !w-5': fontSize === FontSizes.large,\n })}\n />\n </span>\n <span>{texts.listbox.loading}</span>\n </span>\n ) : flattenedChildren.length <= 0 ? (\n <div className=\"text-grey-700 -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n No results found...\n </div>\n ) : (\n <ListboxPrimitive.Root\n className=\"flex flex-col gap-0.5\"\n customSelector=\":scope > button\"\n disabled={disabled}\n multiple={multiple}\n onKeyDown={handleListboxKeyDown}\n readOnly={readOnly}\n ref={listboxRef}\n setValue={setValue}\n tabIndex={-1}\n value={value}>\n {searchQuery === '' ? (\n <Collection>{initialChildren}</Collection>\n ) : (\n <Collection>{filteredChildren}</Collection>\n )}\n {onCreate ? <Create onCreate={onCreate} options={flattenedChildren} /> : null}\n </ListboxPrimitive.Root>\n )}\n </div>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n <ControlledHiddenField\n emptyValue={emptyValue}\n multiple={multiple || tags}\n name={name}\n options={flattenedChildren.map(child => child.props.value)}\n parentRef={internalRef}\n setValue={setValue}\n value={value}\n />\n </PopoverPrimitive.Root>\n </Select2Context.Provider>\n );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n let bubbleValue;\n\n if (isFormControl) {\n if (value !== undefined) {\n if (multiple) {\n bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n } else {\n bubbleValue = value === null ? '' : String(value);\n }\n }\n\n return (\n <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} value={bubbleValue}>\n {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n {options.map(option => (\n <option key={String(option)} value={String(option)} />\n ))}\n </BubbleSelect>\n );\n }\n\n return null;\n};\nSelect2.displayName = 'Select2';\n\nexport { Select2 };\n\nexport type {\n Select2Texts,\n Select2GroupProps,\n Select2OptionProps,\n Select2OptionValue,\n Select2Value,\n Select2Props,\n Select2TitleProps,\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initChildren","defaultValue","defaultProp","disabled","emptyValue","undefined","fontSize","highlighted","invalid","loading","multiple","name","onChange","onCreate","onDelete","onEdit","placeholder","readOnly","tags","value","prop","createDialog","createTriggerText","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","tabTriggeredClose","setTabTriggeredClose","useState","open","setOpen","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","isElementInsideTable3OrReport","currentTarget","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","stopPropagation","nextFocussableElement","getNextFocussableElement","focus","_internalRef$current","selectOptions","map","child","isGroup","Array","isArray","subChild","flatMap","c","areAllSelected","every","option","includes","selectAllText","select2","deselectAll","selectAll","deselectAllResults","selectAllResults","length","preselectedValues","filter","nextValue","subValue","cn","createCollectionClassName","isInlineCreation","Select2Context","Provider","PopoverPrimitive","onOpenChange","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current2","onCloseAutoFocus","sideOffset","tabIndex","style","minWidth","width","Search","searchOrCreate","search","onTabKeyPress","Button","appearance","onClick","getFontSize","Spinner","delay","FontSizes","small","medium","large","listbox","role","customSelector","Collection","Create","options","ControlledHiddenField","parentRef","Group","Title","isFormControl","useIsFormControl","bubbleValue","String","BubbleSelect","displayName"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Context.js","sources":["../../../../../../../../src/components/Select2/components/Context.tsx"],"sourcesContent":["import React from 'react';\nimport { CollectionRef } from '../../../primitives/Collection/Collection';\nimport {
|
|
1
|
+
{"version":3,"file":"Context.js","sources":["../../../../../../../../src/components/Select2/components/Context.tsx"],"sourcesContent":["import React from 'react';\nimport { CollectionRef } from '../../../primitives/Collection/Collection';\nimport {\n Select2CreateHandler,\n Select2DeleteHandler,\n Select2EditHandler,\n Select2OptionValue,\n Select2Value,\n Select2CreateDialogRenderer,\n} from '../types';\nimport { FontSize } from '../../../types';\n\nexport type Select2ContextProps = {\n createDialog?: Select2CreateDialogRenderer;\n createTriggerText?: string;\n disabled: boolean;\n highlighted: boolean;\n invalid: boolean;\n listboxRef: React.RefObject<CollectionRef>;\n multiple: boolean;\n onCreate?: Select2CreateHandler;\n onDelete?: Select2DeleteHandler;\n onEdit?: Select2EditHandler;\n open: boolean;\n readOnly: boolean;\n ref: React.RefObject<HTMLButtonElement>;\n searchQuery: string;\n searchRef?: React.RefObject<HTMLInputElement>;\n setOpen: (open: boolean) => void;\n setSearchQuery: (value: string) => void;\n setValidationError: (error: Error | undefined) => void;\n setValue: (value: Select2OptionValue) => void;\n shouldPauseHoverState: boolean;\n setShouldPauseHoverState: (pause: boolean) => void;\n tags?: boolean;\n validationError?: Error;\n value?: Select2Value;\n fontSize?: FontSize;\n};\n\nexport const Select2Context = React.createContext({} as Select2ContextProps);\nexport const useSelect2Context = () => React.useContext(Select2Context);\n"],"names":["Select2Context","React","createContext","useSelect2Context","useContext"],"mappings":";;MAwCaA,cAAc,gBAAGC,cAAK,CAACC,aAAa,CAAC,EAAyB;MAC9DC,iBAAiB,GAAGA,MAAMF,cAAK,CAACG,UAAU,CAACJ,cAAc;;;;"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
2
|
import cn from 'clsx';
|
|
3
3
|
import { AVAILABLE_COLORS } from '../../../utils/tailwind.js';
|
|
4
|
+
import { Icon } from '../../Icon/Icon.js';
|
|
4
5
|
import { useLocalization } from '../../Provider/Localization.js';
|
|
6
|
+
import { Button } from '../../Button/Button.js';
|
|
5
7
|
import { _catch } from '../../../../../../node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js';
|
|
6
8
|
import { isAriaSelectionKey } from '../../../utils/aria.js';
|
|
7
9
|
import { Tag } from '../../Tag/Tag.js';
|
|
@@ -39,20 +41,25 @@ const Create = props => {
|
|
|
39
41
|
setOpen,
|
|
40
42
|
setSearchQuery,
|
|
41
43
|
setValidationError,
|
|
42
|
-
setValue
|
|
44
|
+
setValue,
|
|
45
|
+
createDialog,
|
|
46
|
+
createTriggerText
|
|
43
47
|
} = useSelect2Context();
|
|
44
48
|
const {
|
|
45
49
|
texts
|
|
46
50
|
} = useLocalization();
|
|
47
51
|
// determine what the next color tag should be based on color occurences
|
|
48
52
|
const nextColor = React__default.useMemo(() => getNextColor(options), [options]);
|
|
49
|
-
|
|
53
|
+
const onCreateDialogClose = React__default.useCallback(() => {
|
|
54
|
+
setOpen(false);
|
|
55
|
+
}, [setOpen]);
|
|
56
|
+
if (!createDialog && !searchQuery) {
|
|
50
57
|
return null;
|
|
51
58
|
}
|
|
52
|
-
const
|
|
59
|
+
const create = function (value) {
|
|
53
60
|
try {
|
|
54
61
|
const _temp = _catch(function () {
|
|
55
|
-
return Promise.resolve(handleCreate(
|
|
62
|
+
return Promise.resolve(handleCreate(value, nextColor)).then(function (item) {
|
|
56
63
|
setValue(item.value);
|
|
57
64
|
if (multiple) {
|
|
58
65
|
setSearchQuery('');
|
|
@@ -73,17 +80,33 @@ const Create = props => {
|
|
|
73
80
|
event.currentTarget.click();
|
|
74
81
|
}
|
|
75
82
|
};
|
|
76
|
-
const className = cn(
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
83
|
+
const className = cn(createOptionClassName(), {
|
|
84
|
+
'!w-[calc(100%_-_theme(spacing.3))] ml-1.5': !createDialog,
|
|
85
|
+
'leading-normal border-grey-300 h-9 border-t py-2.5 px-4 !-mb-1.5': !!createDialog
|
|
86
|
+
});
|
|
87
|
+
const creationOptions = createDialog ? {
|
|
88
|
+
dialog: props => createDialog({
|
|
89
|
+
...props,
|
|
90
|
+
onClose: onCreateDialogClose
|
|
91
|
+
}, searchQuery, create)
|
|
92
|
+
} : {
|
|
93
|
+
onClick: () => create(searchQuery)
|
|
94
|
+
};
|
|
95
|
+
const createText = createTriggerText || texts.select2.create;
|
|
96
|
+
return /*#__PURE__*/React__default.createElement(Button, Object.assign({
|
|
97
|
+
className: className
|
|
98
|
+
}, creationOptions, {
|
|
99
|
+
onKeyDown: handleKeyDown,
|
|
100
|
+
appearance: createDialog ? 'discrete' : 'default'
|
|
101
|
+
}), /*#__PURE__*/React__default.createElement("span", {
|
|
82
102
|
className: "flex items-center gap-1.5"
|
|
83
|
-
},
|
|
103
|
+
}, createDialog ? ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Icon, {
|
|
104
|
+
className: "text-xs",
|
|
105
|
+
name: "circle-plus"
|
|
106
|
+
}), " ", createText)) : ( /*#__PURE__*/React__default.createElement(React__default.Fragment, null, createText, /*#__PURE__*/React__default.createElement(Tag, {
|
|
84
107
|
color: nextColor,
|
|
85
108
|
className: "cursor-pointer"
|
|
86
|
-
}, searchQuery)));
|
|
109
|
+
}, searchQuery)))));
|
|
87
110
|
};
|
|
88
111
|
|
|
89
112
|
export { Create, getNextColor };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Create.js","sources":["../../../../../../../../src/components/Select2/components/Create.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { Tag } from '../../Tag/Tag';\nimport { createOptionClassName } from '../utilities';\nimport { useSelect2Context } from './Context';\nimport { Select2OptionProps } from './Option';\nimport { useLocalization } from '../../Provider/Localization';\nimport { Color } from '../../../types';\nimport { AVAILABLE_COLORS } from '../../../utils/tailwind';\nimport { Select2CreateHandler } from '../types';\n\nexport type CreateProps = {\n onCreate: Select2CreateHandler;\n options: React.ReactElement<Select2OptionProps>[];\n};\n\nexport const getNextColor = (options: React.ReactElement<Select2OptionProps>[]): Color | undefined => {\n let occurrences = {};\n AVAILABLE_COLORS.filter(color => color !== 'transparent').forEach((color: Color) => {\n occurrences = { ...occurrences, [color]: 0 };\n });\n\n options.reduce((occurrences, option) => {\n if (option.props.color) {\n occurrences[option.props.color] = occurrences[option.props.color] ? occurrences[option.props.color] + 1 : 1;\n }\n return occurrences;\n }, occurrences);\n\n const colors = Object.keys(occurrences);\n\n if (colors.length) {\n return colors.sort((a, b) => occurrences[a] - occurrences[b])[0] as Color;\n }\n\n return undefined;\n};\n\nexport const Create = (props: CreateProps) => {\n const { onCreate: handleCreate, options } = props;\n const { multiple, searchQuery, setOpen, setSearchQuery, setValidationError, setValue }
|
|
1
|
+
{"version":3,"file":"Create.js","sources":["../../../../../../../../src/components/Select2/components/Create.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { Tag } from '../../Tag/Tag';\nimport { createOptionClassName } from '../utilities';\nimport { useSelect2Context } from './Context';\nimport { Select2OptionProps } from './Option';\nimport { useLocalization } from '../../Provider/Localization';\nimport { Color } from '../../../types';\nimport { AVAILABLE_COLORS } from '../../../utils/tailwind';\nimport { Select2CreateHandler } from '../types';\nimport { Icon } from '../../Icon/Icon';\nimport { Button } from '../../Button/Button';\n\nexport type CreateProps = {\n onCreate: Select2CreateHandler;\n options: React.ReactElement<Select2OptionProps>[];\n};\n\nexport const getNextColor = (options: React.ReactElement<Select2OptionProps>[]): Color | undefined => {\n let occurrences = {};\n AVAILABLE_COLORS.filter(color => color !== 'transparent').forEach((color: Color) => {\n occurrences = { ...occurrences, [color]: 0 };\n });\n\n options.reduce((occurrences, option) => {\n if (option.props.color) {\n occurrences[option.props.color] = occurrences[option.props.color] ? occurrences[option.props.color] + 1 : 1;\n }\n return occurrences;\n }, occurrences);\n\n const colors = Object.keys(occurrences);\n\n if (colors.length) {\n return colors.sort((a, b) => occurrences[a] - occurrences[b])[0] as Color;\n }\n\n return undefined;\n};\n\nexport const Create = (props: CreateProps) => {\n const { onCreate: handleCreate, options } = props;\n const { multiple, searchQuery, setOpen, setSearchQuery, setValidationError, setValue, createDialog, createTriggerText } =\n useSelect2Context();\n const { texts } = useLocalization();\n\n // determine what the next color tag should be based on color occurences\n const nextColor = React.useMemo(() => getNextColor(options), [options]);\n\n const onCreateDialogClose = React.useCallback(() => {\n setOpen(false);\n }, [setOpen]);\n\n if (!createDialog && !searchQuery) {\n return null;\n }\n\n const create = async (value?: string | unknown) => {\n try {\n const item = await handleCreate(value, nextColor);\n setValue(item.value);\n\n if (multiple) {\n setSearchQuery('');\n } else {\n setOpen(false);\n }\n } catch (error) {\n setValidationError(error as Error);\n }\n };\n\n const handleKeyDown = event => {\n if (isAriaSelectionKey(event)) {\n event.currentTarget.click();\n }\n };\n\n const className = cn(createOptionClassName(), {\n '!w-[calc(100%_-_theme(spacing.3))] ml-1.5': !createDialog,\n 'leading-normal border-grey-300 h-9 border-t py-2.5 px-4 !-mb-1.5': !!createDialog,\n });\n\n const creationOptions = createDialog\n ? {\n dialog: props => createDialog({ ...props, onClose: onCreateDialogClose }, searchQuery, create),\n }\n : {\n onClick: () => create(searchQuery),\n };\n\n const createText = createTriggerText || texts.select2.create;\n\n return (\n <Button\n className={className}\n {...creationOptions}\n onKeyDown={handleKeyDown}\n appearance={createDialog ? 'discrete' : 'default'}>\n <span className=\"flex items-center gap-1.5\">\n {createDialog ? (\n <>\n <Icon className=\"text-xs\" name=\"circle-plus\" /> {createText}\n </>\n ) : (\n <>\n {createText}\n <Tag color={nextColor} className=\"cursor-pointer\">\n {searchQuery}\n </Tag>\n </>\n )}\n </span>\n </Button>\n );\n};\n"],"names":["getNextColor","options","occurrences","AVAILABLE_COLORS","filter","color","forEach","reduce","option","props","colors","Object","keys","length","sort","a","b","undefined","Create","onCreate","handleCreate","multiple","searchQuery","setOpen","setSearchQuery","setValidationError","setValue","createDialog","createTriggerText","useSelect2Context","texts","useLocalization","nextColor","React","useMemo","onCreateDialogClose","useCallback","create","value","Promise","resolve","then","item","error","_temp","e","reject","handleKeyDown","event","isAriaSelectionKey","currentTarget","click","className","cn","createOptionClassName","creationOptions","dialog","onClose","onClick","createText","select2","Button","onKeyDown","appearance","Icon","name","Tag"],"mappings":";;;;;;;;;;;;MAmBaA,YAAY,GAAIC,OAAiD;EAC1E,IAAIC,WAAW,GAAG,EAAE;EACpBC,gBAAgB,CAACC,MAAM,CAACC,KAAK,IAAIA,KAAK,KAAK,aAAa,CAAC,CAACC,OAAO,CAAED,KAAY;IAC3EH,WAAW,GAAG;MAAE,GAAGA,WAAW;MAAE,CAACG,KAAK,GAAG;KAAG;GAC/C,CAAC;EAEFJ,OAAO,CAACM,MAAM,CAAC,CAACL,WAAW,EAAEM,MAAM;IAC/B,IAAIA,MAAM,CAACC,KAAK,CAACJ,KAAK,EAAE;MACpBH,WAAW,CAACM,MAAM,CAACC,KAAK,CAACJ,KAAK,CAAC,GAAGH,WAAW,CAACM,MAAM,CAACC,KAAK,CAACJ,KAAK,CAAC,GAAGH,WAAW,CAACM,MAAM,CAACC,KAAK,CAACJ,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC;;IAE/G,OAAOH,WAAW;GACrB,EAAEA,WAAW,CAAC;EAEf,MAAMQ,MAAM,GAAGC,MAAM,CAACC,IAAI,CAACV,WAAW,CAAC;EAEvC,IAAIQ,MAAM,CAACG,MAAM,EAAE;IACf,OAAOH,MAAM,CAACI,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAKd,WAAW,CAACa,CAAC,CAAC,GAAGb,WAAW,CAACc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAU;;EAG7E,OAAOC,SAAS;AACpB;MAEaC,MAAM,GAAIT,KAAkB;EACrC,MAAM;IAAEU,QAAQ,EAAEC,YAAY;IAAEnB;GAAS,GAAGQ,KAAK;EACjD,MAAM;IAAEY,QAAQ;IAAEC,WAAW;IAAEC,OAAO;IAAEC,cAAc;IAAEC,kBAAkB;IAAEC,QAAQ;IAAEC,YAAY;IAAEC;GAAmB,GACnHC,iBAAiB,EAAE;EACvB,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;;EAGnC,MAAMC,SAAS,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAMlC,YAAY,CAACC,OAAO,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEvE,MAAMkC,mBAAmB,GAAGF,cAAK,CAACG,WAAW,CAAC;IAC1Cb,OAAO,CAAC,KAAK,CAAC;GACjB,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,IAAI,CAACI,YAAY,IAAI,CAACL,WAAW,EAAE;IAC/B,OAAO,IAAI;;EAGf,MAAMe,MAAM,aAAUC,KAAwB;IAAA;uCACtC;QAAA,OAAAC,OAAA,CAAAC,OAAA,CACmBpB,YAAY,CAACkB,KAAK,EAAEN,SAAS,CAAC,EAAAS,IAAA,WAA3CC,IAAI;UACVhB,QAAQ,CAACgB,IAAI,CAACJ,KAAK,CAAC;UAAC,IAEjBjB,QAAQ;YACRG,cAAc,CAAC,EAAE,CAAC;;YAElBD,OAAO,CAAC,KAAK,CAAC;;;OAErB,YAAQoB,KAAK,EAAE;QACZlB,kBAAkB,CAACkB,KAAc,CAAC;OACrC;MAAA,OAAAJ,OAAA,CAAAC,OAAA,CAAAI,KAAA,IAAAA,KAAA,CAAAH,IAAA,GAAAG,KAAA,CAAAH,IAAA;KACJ,QAAAI,CAAA;MAAA,OAAAN,OAAA,CAAAO,MAAA,CAAAD,CAAA;;;EAED,MAAME,aAAa,GAAGC,KAAK;IACvB,IAAIC,kBAAkB,CAACD,KAAK,CAAC,EAAE;MAC3BA,KAAK,CAACE,aAAa,CAACC,KAAK,EAAE;;GAElC;EAED,MAAMC,SAAS,GAAGC,EAAE,CAACC,qBAAqB,EAAE,EAAE;IAC1C,2CAA2C,EAAE,CAAC3B,YAAY;IAC1D,kEAAkE,EAAE,CAAC,CAACA;GACzE,CAAC;EAEF,MAAM4B,eAAe,GAAG5B,YAAY,GAC9B;IACI6B,MAAM,EAAE/C,KAAK,IAAIkB,YAAY,CAAC;MAAE,GAAGlB,KAAK;MAAEgD,OAAO,EAAEtB;KAAqB,EAAEb,WAAW,EAAEe,MAAM;GAChG,GACD;IACIqB,OAAO,EAAEA,MAAMrB,MAAM,CAACf,WAAW;GACpC;EAEP,MAAMqC,UAAU,GAAG/B,iBAAiB,IAAIE,KAAK,CAAC8B,OAAO,CAACvB,MAAM;EAE5D,oBACIJ,6BAAC4B,MAAM;IACHT,SAAS,EAAEA;KACPG,eAAe;IACnBO,SAAS,EAAEf,aAAa;IACxBgB,UAAU,EAAEpC,YAAY,GAAG,UAAU,GAAG;mBACxCM;IAAMmB,SAAS,EAAC;KACXzB,YAAY,kBACTM,yEACIA,6BAAC+B,IAAI;IAACZ,SAAS,EAAC,SAAS;IAACa,IAAI,EAAC;IAAgB,OAAEN,UAAU,CAC5D,mBAEH1B,4DACK0B,UAAU,eACX1B,6BAACiC,GAAG;IAAC7D,KAAK,EAAE2B,SAAS;IAAEoB,SAAS,EAAC;KAC5B9B,WAAW,CACV,CACP,CACN,CACE,CACF;AAEjB;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import cn from 'clsx';
|
|
2
2
|
import { FontSizes } from '../../types.js';
|
|
3
3
|
|
|
4
|
-
const createOptionClassName = (shouldPauseHoverState = false) => cn('group mb-px flex w-full text-sm flex-shrink-0 font-normal cursor-pointer items-center rounded bg-white px-2 leading-8 text-black aria-hidden:hidden gap-1.5 bg-white aria-current:wcag-grey-200 aria-disabled:text-black/25 aria-disabled:pointer-events-none', {
|
|
4
|
+
const createOptionClassName = (shouldPauseHoverState = false) => cn('group mb-px flex w-full text-sm flex-shrink-0 font-normal cursor-pointer items-center rounded bg-white px-2 leading-8 text-black aria-hidden:hidden gap-1.5 bg-white aria-current:wcag-grey-200 aria-disabled:text-black/25 aria-disabled:pointer-events-none !justify-normal', {
|
|
5
5
|
'hover:wcag-grey-200': !shouldPauseHoverState
|
|
6
6
|
});
|
|
7
7
|
const createCollectionClassName = () => 'flex flex-col gap-px';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utilities.js","sources":["../../../../../../../src/components/Select2/utilities.ts"],"sourcesContent":["import cn from 'clsx';\nimport { FontSize, FontSizes } from '../../types';\n\nexport const createOptionClassName = (shouldPauseHoverState = false) =>\n cn(\n 'group mb-px flex w-full text-sm flex-shrink-0 font-normal cursor-pointer items-center rounded bg-white px-2 leading-8 text-black aria-hidden:hidden gap-1.5 bg-white aria-current:wcag-grey-200 aria-disabled:text-black/25 aria-disabled:pointer-events-none',\n\n {\n 'hover:wcag-grey-200': !shouldPauseHoverState,\n }\n );\n\nexport const createCollectionClassName = () => 'flex flex-col gap-px';\n\nexport const getFontSize = (fontSize?: FontSize) => {\n switch (fontSize) {\n case FontSizes.small:\n return 'text-xs';\n\n case FontSizes.large:\n return 'text-base';\n\n case FontSizes.medium:\n default:\n return 'text-sm';\n }\n};\n"],"names":["createOptionClassName","shouldPauseHoverState","cn","createCollectionClassName","getFontSize","fontSize","FontSizes","small","large","medium"],"mappings":";;;MAGaA,qBAAqB,GAAGA,CAACC,qBAAqB,GAAG,KAAK,KAC/DC,EAAE,CACE,+
|
|
1
|
+
{"version":3,"file":"utilities.js","sources":["../../../../../../../src/components/Select2/utilities.ts"],"sourcesContent":["import cn from 'clsx';\nimport { FontSize, FontSizes } from '../../types';\n\nexport const createOptionClassName = (shouldPauseHoverState = false) =>\n cn(\n 'group mb-px flex w-full text-sm flex-shrink-0 font-normal cursor-pointer items-center rounded bg-white px-2 leading-8 text-black aria-hidden:hidden gap-1.5 bg-white aria-current:wcag-grey-200 aria-disabled:text-black/25 aria-disabled:pointer-events-none !justify-normal',\n\n {\n 'hover:wcag-grey-200': !shouldPauseHoverState,\n }\n );\n\nexport const createCollectionClassName = () => 'flex flex-col gap-px';\n\nexport const getFontSize = (fontSize?: FontSize) => {\n switch (fontSize) {\n case FontSizes.small:\n return 'text-xs';\n\n case FontSizes.large:\n return 'text-base';\n\n case FontSizes.medium:\n default:\n return 'text-sm';\n }\n};\n"],"names":["createOptionClassName","shouldPauseHoverState","cn","createCollectionClassName","getFontSize","fontSize","FontSizes","small","large","medium"],"mappings":";;;MAGaA,qBAAqB,GAAGA,CAACC,qBAAqB,GAAG,KAAK,KAC/DC,EAAE,CACE,+QAA+Q,EAE/Q;EACI,qBAAqB,EAAE,CAACD;CAC3B;MAGIE,yBAAyB,GAAGA,MAAM;MAElCC,WAAW,GAAIC,QAAmB;EAC3C,QAAQA,QAAQ;IACZ,KAAKC,SAAS,CAACC,KAAK;MAChB,OAAO,SAAS;IAEpB,KAAKD,SAAS,CAACE,KAAK;MAChB,OAAO,WAAW;IAEtB,KAAKF,SAAS,CAACG,MAAM;IACrB;MACI,OAAO,SAAS;;AAE5B;;;;"}
|
|
@@ -101,6 +101,7 @@ function Header(props) {
|
|
|
101
101
|
if (canResize) {
|
|
102
102
|
memoedProps.isResizing = header.column.getIsResizing();
|
|
103
103
|
memoedProps.onResize = header.getResizeHandler();
|
|
104
|
+
memoedProps.resetSize = header.column.resetSize;
|
|
104
105
|
}
|
|
105
106
|
if (canSort) {
|
|
106
107
|
const handleSortToggle = sortDirection => {
|
|
@@ -149,6 +150,7 @@ const MemoedHeader = /*#__PURE__*/React__default.memo(function MemoedHeader(prop
|
|
|
149
150
|
onResize: handleResize,
|
|
150
151
|
onSort: handleSort,
|
|
151
152
|
onSortToggle: handleSortToggle,
|
|
153
|
+
resetSize: handleResetSize,
|
|
152
154
|
scrollToIndex,
|
|
153
155
|
setRowActiveIndex,
|
|
154
156
|
setColumnSizing,
|
|
@@ -210,6 +212,7 @@ const MemoedHeader = /*#__PURE__*/React__default.memo(function MemoedHeader(prop
|
|
|
210
212
|
id: id,
|
|
211
213
|
isResizing: isResizing,
|
|
212
214
|
onResize: handleResize,
|
|
215
|
+
onResetSize: handleResetSize,
|
|
213
216
|
setColumnSizing: setColumnSizing,
|
|
214
217
|
width: width
|
|
215
218
|
})) : null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Header/Header.tsx"],"sourcesContent":["import React from 'react';\nimport {\n TableMeta as ReactTableMeta,\n ColumnMeta as ReactTableColumnMeta,\n Header as ReactTableHeader,\n ColumnPinningPosition as ReactTableColumnPinningPosition,\n flexRender,\n} from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { freezeUptoExternalColumn, isInternalColumn, unfreezeAllExternalColumns } from '../../../useTableManager/util/columns';\nimport { Tooltip } from '../../../../../components/Tooltip/Tooltip';\nimport { SortIndicator, getSortAttributes } from './components/SortIndicator';\nimport {\n TableColumnAlignment,\n TableColumnMenu,\n TableColumnSortDirection,\n TableColumnWidth,\n TableFilterComparator,\n} from '../../../types';\nimport { Resizer } from './components/Resizer';\nimport { HeaderMenu } from './components/Menu';\nimport { getIsPinned, useSetInitialColumnSizing } from './util';\n\nexport type HeaderProps<TType = unknown> = {\n header: ReactTableHeader<TType, unknown>;\n scrollToIndex: (index: number) => void;\n};\n\nexport function Header<TType = unknown>(props: HeaderProps<TType>) {\n const { header, scrollToIndex } = props;\n\n if (header.column.getIsGrouped()) {\n return null;\n }\n\n const { table } = header.getContext();\n\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const columnMeta = (header.column.columnDef.meta ?? {}) as ReactTableColumnMeta<TType, unknown>;\n\n const isGroup = !!header.subHeaders.length;\n const isPinned = getIsPinned(header);\n\n const canFilter = !header.isPlaceholder && header.column.getCanFilter() && !!table.options.enableColumnFilters;\n const canHide = !header.isPlaceholder && !isGroup && header.column.getCanHide();\n const canMeasureSize = !!table.getRowModel().rows.length;\n const canPin = !header.isPlaceholder && !isGroup && header.column.getCanPin();\n const canResize = !header.isPlaceholder && !isGroup && header.column.getCanResize();\n const canSort = !header.isPlaceholder && !isGroup && header.column.getCanSort();\n const canGoto = canSort && !header.isPlaceholder && !isGroup && tableMeta.rowGoto.isEnabled && !!header.column.getIsSorted();\n\n const hasMenu = !isInternalColumn(header.id) && (canHide || canGoto || canPin || canSort || !!columnMeta.menu);\n\n const sorting = table.getState().sorting;\n const filters = table.getState().columnFilters;\n const search = table.getState().globalFilter;\n\n // passing header or column results in re-renders on scroll, so anything from those objects as memoed props\n const memoedProps: MemoedHeaderProps = {\n align: columnMeta.align,\n canFilter,\n canHide,\n canGoto,\n canMeasureSize,\n canPin,\n canResize,\n canSort,\n className: cn('group/header', columnMeta.headerClassName),\n children: flexRender(header.column.columnDef.header, header.getContext()),\n colSpan: header.colSpan,\n customMenu: columnMeta.menu,\n defaultWidth: columnMeta.defaultWidth,\n hasMenu,\n id: header.id,\n isFiltered: header.column.getIsFiltered(),\n index: header.index,\n isGroup,\n isPinned,\n isPlaceholder: header.isPlaceholder,\n offset: header.column.getStart(isPinned),\n scrollToIndex,\n setRowActiveIndex: tableMeta.rowActive.setRowActiveIndex,\n setColumnSizing: table.setColumnSizing,\n tooltip: columnMeta.tooltip,\n width: table.getState().columnSizing[header.id],\n };\n\n if (header.isPlaceholder) {\n const nextHeader = header.headerGroup.headers[header.index + 1];\n memoedProps.className = cn('!bg-white before:!content-none', memoedProps.className, {\n 'after:!content-none': nextHeader?.isPlaceholder,\n });\n }\n\n if (canFilter) {\n memoedProps.onFilter = () => {\n header.column.setFilterValue({ comparator: TableFilterComparator.Contains });\n };\n }\n\n if (canGoto) {\n memoedProps.onGoto = ((query: string) => tableMeta.rowGoto.handleGoto?.(header.id, query, sorting, filters, search)) as (\n query: string\n ) => Promise<number>;\n }\n\n if (canHide) {\n memoedProps.onHide = header.column.getToggleVisibilityHandler();\n }\n\n if (canPin) {\n memoedProps.onPin = (index: number | undefined) => {\n // TODO: this can probably be moved to a feature hook\n table.setColumnPinning(pinningState => {\n return {\n ...pinningState,\n left:\n index === undefined\n ? unfreezeAllExternalColumns(pinningState.left)\n : freezeUptoExternalColumn(\n index,\n table.getAllLeafColumns().map(column => column.id)\n ),\n };\n });\n };\n }\n\n if (canResize) {\n memoedProps.isResizing = header.column.getIsResizing();\n memoedProps.onResize = header.getResizeHandler();\n }\n\n if (canSort) {\n const handleSortToggle = (sortDirection: TableColumnSortDirection | false) => {\n if (sortDirection === false) {\n header.column.clearSorting();\n } else {\n header.column.toggleSorting(sortDirection === 'desc');\n }\n };\n\n memoedProps.onSort = header.column.getToggleSortingHandler();\n memoedProps.onSortToggle = handleSortToggle;\n memoedProps.sortDirection = header.column.getIsSorted();\n }\n\n return <MemoedHeader key={header.id} {...memoedProps} />;\n}\n\nexport type MemoedHeaderProps = {\n align?: TableColumnAlignment;\n canFilter: boolean;\n canHide: boolean;\n canGoto: boolean;\n canMeasureSize: boolean;\n canPin: boolean;\n canResize: boolean;\n canSort: boolean;\n children: JSX.Element | React.ReactNode;\n className?: string;\n colSpan: number;\n customMenu?: TableColumnMenu;\n defaultWidth?: TableColumnWidth;\n hasMenu: boolean;\n id: string;\n index: number;\n isFiltered: boolean;\n isGroup: boolean;\n isPinned?: ReactTableColumnPinningPosition;\n isPlaceholder: boolean;\n isResizing?: boolean;\n offset?: number;\n onFilter?: () => void;\n onGoto?: (query: string) => Promise<number>;\n onHide?: (event: unknown) => void;\n onPin?: (index: number | undefined) => void;\n onResize?: (event: unknown) => void;\n onSort?: (event: unknown) => void;\n onSortToggle?: (sortDirection: TableColumnSortDirection | false) => void;\n scrollToIndex: (index: number) => void;\n setRowActiveIndex: (index: number) => void;\n setColumnSizing: any;\n sortDirection?: TableColumnSortDirection | false;\n tooltip?: string;\n width?: TableColumnWidth;\n};\n\nconst MemoedHeader = React.memo(function MemoedHeader(props: MemoedHeaderProps) {\n const {\n align,\n canFilter,\n canGoto,\n canHide,\n canMeasureSize,\n canPin,\n canResize,\n canSort,\n children,\n className,\n colSpan,\n customMenu,\n defaultWidth,\n hasMenu,\n id,\n index,\n isFiltered,\n isGroup,\n isPinned,\n isPlaceholder,\n isResizing,\n offset,\n onFilter: handleFilter,\n onGoto: handleGoto,\n onHide: handleHide,\n onPin: handlePin,\n onResize: handleResize,\n onSort: handleSort,\n onSortToggle: handleSortToggle,\n scrollToIndex,\n setRowActiveIndex,\n setColumnSizing,\n sortDirection,\n tooltip,\n width,\n } = props;\n const [ref, setRef] = React.useState<HTMLTableCellElement | null>(null);\n\n // save column width if none is set\n useSetInitialColumnSizing(id, defaultWidth, width, ref, canMeasureSize, setColumnSizing);\n\n // feature specific styles\n const style: React.CSSProperties = {};\n\n // column groups often span multiple columns\n if (colSpan > 1) {\n style.gridColumn = `span ${colSpan}`;\n }\n\n // pinned columns should be offset from either the left or right\n if (isPinned) {\n style[isPinned] = `${offset}px`;\n }\n\n return (\n <th\n {...getSortAttributes(canSort, handleSort, sortDirection)}\n className={className}\n data-cell-align={isGroup ? 'center' : align}\n data-cell-id={id}\n data-cell-pinned={isPinned ? isPinned : undefined}\n style={style}\n ref={setRef}>\n {isPlaceholder ? null : isInternalColumn(id) ? (\n children\n ) : (\n <Tooltip title={String(tooltip ?? children)} placement=\"top\">\n <span className=\"truncate\">{children}</span>\n </Tooltip>\n )}\n {sortDirection ? <SortIndicator direction={sortDirection} /> : null}\n {hasMenu ? (\n <HeaderMenu\n canFilter={canFilter}\n canGoto={canGoto}\n canHide={canHide}\n canPin={canPin}\n canSort={canSort}\n className={cn({\n 'ml-auto': align !== 'right',\n 'ml-0': align === 'right',\n })}\n customMenu={customMenu}\n index={index}\n isFiltered={isFiltered}\n onFilter={handleFilter}\n onGoto={handleGoto}\n onHide={handleHide}\n onPin={handlePin}\n onSortToggle={handleSortToggle}\n scrollToIndex={scrollToIndex}\n setRowActiveIndex={setRowActiveIndex}\n sortDirection={sortDirection}\n columnId={id}\n />\n ) : null}\n {canResize ? (\n <Resizer\n headerRef={ref}\n id={id}\n isResizing={isResizing as boolean}\n onResize={handleResize as (event: unknown) => void}\n setColumnSizing={setColumnSizing}\n width={width}\n />\n ) : null}\n </th>\n );\n});\n"],"names":["Header","props","header","scrollToIndex","column","getIsGrouped","table","getContext","tableMeta","options","meta","columnMeta","_header$column$column","columnDef","isGroup","subHeaders","length","isPinned","getIsPinned","canFilter","isPlaceholder","getCanFilter","enableColumnFilters","canHide","getCanHide","canMeasureSize","getRowModel","rows","canPin","getCanPin","canResize","getCanResize","canSort","getCanSort","canGoto","rowGoto","isEnabled","getIsSorted","hasMenu","isInternalColumn","id","menu","sorting","getState","filters","columnFilters","search","globalFilter","memoedProps","align","className","cn","headerClassName","children","flexRender","colSpan","customMenu","defaultWidth","isFiltered","getIsFiltered","index","offset","getStart","setRowActiveIndex","rowActive","setColumnSizing","tooltip","width","columnSizing","nextHeader","headerGroup","headers","onFilter","setFilterValue","comparator","TableFilterComparator","Contains","onGoto","query","_tableMeta$rowGoto$ha","_tableMeta$rowGoto","handleGoto","call","onHide","getToggleVisibilityHandler","onPin","setColumnPinning","pinningState","left","undefined","unfreezeAllExternalColumns","freezeUptoExternalColumn","getAllLeafColumns","map","isResizing","getIsResizing","onResize","getResizeHandler","handleSortToggle","sortDirection","clearSorting","toggleSorting","onSort","getToggleSortingHandler","onSortToggle","React","MemoedHeader","key","memo","handleFilter","handleHide","handlePin","handleResize","handleSort","ref","setRef","useState","useSetInitialColumnSizing","style","gridColumn","getSortAttributes","Tooltip","title","String","placement","SortIndicator","direction","HeaderMenu","columnId","Resizer","headerRef"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Header.js","sources":["../../../../../../../../../../src/primitives/Table/Core/components/Header/Header.tsx"],"sourcesContent":["import React from 'react';\nimport {\n TableMeta as ReactTableMeta,\n ColumnMeta as ReactTableColumnMeta,\n Header as ReactTableHeader,\n ColumnPinningPosition as ReactTableColumnPinningPosition,\n flexRender,\n} from '@tanstack/react-table';\nimport cn from 'clsx';\nimport { freezeUptoExternalColumn, isInternalColumn, unfreezeAllExternalColumns } from '../../../useTableManager/util/columns';\nimport { Tooltip } from '../../../../../components/Tooltip/Tooltip';\nimport { SortIndicator, getSortAttributes } from './components/SortIndicator';\nimport {\n TableColumnAlignment,\n TableColumnMenu,\n TableColumnSortDirection,\n TableColumnWidth,\n TableFilterComparator,\n} from '../../../types';\nimport { Resizer } from './components/Resizer';\nimport { HeaderMenu } from './components/Menu';\nimport { getIsPinned, useSetInitialColumnSizing } from './util';\n\nexport type HeaderProps<TType = unknown> = {\n header: ReactTableHeader<TType, unknown>;\n scrollToIndex: (index: number) => void;\n};\n\nexport function Header<TType = unknown>(props: HeaderProps<TType>) {\n const { header, scrollToIndex } = props;\n\n if (header.column.getIsGrouped()) {\n return null;\n }\n\n const { table } = header.getContext();\n\n const tableMeta = table.options.meta as ReactTableMeta<TType>;\n const columnMeta = (header.column.columnDef.meta ?? {}) as ReactTableColumnMeta<TType, unknown>;\n\n const isGroup = !!header.subHeaders.length;\n const isPinned = getIsPinned(header);\n\n const canFilter = !header.isPlaceholder && header.column.getCanFilter() && !!table.options.enableColumnFilters;\n const canHide = !header.isPlaceholder && !isGroup && header.column.getCanHide();\n const canMeasureSize = !!table.getRowModel().rows.length;\n const canPin = !header.isPlaceholder && !isGroup && header.column.getCanPin();\n const canResize = !header.isPlaceholder && !isGroup && header.column.getCanResize();\n const canSort = !header.isPlaceholder && !isGroup && header.column.getCanSort();\n const canGoto = canSort && !header.isPlaceholder && !isGroup && tableMeta.rowGoto.isEnabled && !!header.column.getIsSorted();\n\n const hasMenu = !isInternalColumn(header.id) && (canHide || canGoto || canPin || canSort || !!columnMeta.menu);\n\n const sorting = table.getState().sorting;\n const filters = table.getState().columnFilters;\n const search = table.getState().globalFilter;\n\n // passing header or column results in re-renders on scroll, so anything from those objects as memoed props\n const memoedProps: MemoedHeaderProps = {\n align: columnMeta.align,\n canFilter,\n canHide,\n canGoto,\n canMeasureSize,\n canPin,\n canResize,\n canSort,\n className: cn('group/header', columnMeta.headerClassName),\n children: flexRender(header.column.columnDef.header, header.getContext()),\n colSpan: header.colSpan,\n customMenu: columnMeta.menu,\n defaultWidth: columnMeta.defaultWidth,\n hasMenu,\n id: header.id,\n isFiltered: header.column.getIsFiltered(),\n index: header.index,\n isGroup,\n isPinned,\n isPlaceholder: header.isPlaceholder,\n offset: header.column.getStart(isPinned),\n scrollToIndex,\n setRowActiveIndex: tableMeta.rowActive.setRowActiveIndex,\n setColumnSizing: table.setColumnSizing,\n tooltip: columnMeta.tooltip,\n width: table.getState().columnSizing[header.id],\n };\n\n if (header.isPlaceholder) {\n const nextHeader = header.headerGroup.headers[header.index + 1];\n memoedProps.className = cn('!bg-white before:!content-none', memoedProps.className, {\n 'after:!content-none': nextHeader?.isPlaceholder,\n });\n }\n\n if (canFilter) {\n memoedProps.onFilter = () => {\n header.column.setFilterValue({ comparator: TableFilterComparator.Contains });\n };\n }\n\n if (canGoto) {\n memoedProps.onGoto = ((query: string) => tableMeta.rowGoto.handleGoto?.(header.id, query, sorting, filters, search)) as (\n query: string\n ) => Promise<number>;\n }\n\n if (canHide) {\n memoedProps.onHide = header.column.getToggleVisibilityHandler();\n }\n\n if (canPin) {\n memoedProps.onPin = (index: number | undefined) => {\n // TODO: this can probably be moved to a feature hook\n table.setColumnPinning(pinningState => {\n return {\n ...pinningState,\n left:\n index === undefined\n ? unfreezeAllExternalColumns(pinningState.left)\n : freezeUptoExternalColumn(\n index,\n table.getAllLeafColumns().map(column => column.id)\n ),\n };\n });\n };\n }\n\n if (canResize) {\n memoedProps.isResizing = header.column.getIsResizing();\n memoedProps.onResize = header.getResizeHandler();\n memoedProps.resetSize = header.column.resetSize;\n }\n\n if (canSort) {\n const handleSortToggle = (sortDirection: TableColumnSortDirection | false) => {\n if (sortDirection === false) {\n header.column.clearSorting();\n } else {\n header.column.toggleSorting(sortDirection === 'desc');\n }\n };\n\n memoedProps.onSort = header.column.getToggleSortingHandler();\n memoedProps.onSortToggle = handleSortToggle;\n memoedProps.sortDirection = header.column.getIsSorted();\n }\n\n return <MemoedHeader key={header.id} {...memoedProps} />;\n}\n\nexport type MemoedHeaderProps = {\n align?: TableColumnAlignment;\n canFilter: boolean;\n canHide: boolean;\n canGoto: boolean;\n canMeasureSize: boolean;\n canPin: boolean;\n canResize: boolean;\n canSort: boolean;\n children: JSX.Element | React.ReactNode;\n className?: string;\n colSpan: number;\n customMenu?: TableColumnMenu;\n defaultWidth?: TableColumnWidth;\n hasMenu: boolean;\n id: string;\n index: number;\n isFiltered: boolean;\n isGroup: boolean;\n isPinned?: ReactTableColumnPinningPosition;\n isPlaceholder: boolean;\n isResizing?: boolean;\n offset?: number;\n onFilter?: () => void;\n onGoto?: (query: string) => Promise<number>;\n onHide?: (event: unknown) => void;\n onPin?: (index: number | undefined) => void;\n onResize?: (event: unknown) => void;\n onSort?: (event: unknown) => void;\n onSortToggle?: (sortDirection: TableColumnSortDirection | false) => void;\n resetSize?: () => void;\n scrollToIndex: (index: number) => void;\n setRowActiveIndex: (index: number) => void;\n setColumnSizing: any;\n sortDirection?: TableColumnSortDirection | false;\n tooltip?: string;\n width?: TableColumnWidth;\n};\n\nconst MemoedHeader = React.memo(function MemoedHeader(props: MemoedHeaderProps) {\n const {\n align,\n canFilter,\n canGoto,\n canHide,\n canMeasureSize,\n canPin,\n canResize,\n canSort,\n children,\n className,\n colSpan,\n customMenu,\n defaultWidth,\n hasMenu,\n id,\n index,\n isFiltered,\n isGroup,\n isPinned,\n isPlaceholder,\n isResizing,\n offset,\n onFilter: handleFilter,\n onGoto: handleGoto,\n onHide: handleHide,\n onPin: handlePin,\n onResize: handleResize,\n onSort: handleSort,\n onSortToggle: handleSortToggle,\n resetSize: handleResetSize,\n scrollToIndex,\n setRowActiveIndex,\n setColumnSizing,\n sortDirection,\n tooltip,\n width,\n } = props;\n const [ref, setRef] = React.useState<HTMLTableCellElement | null>(null);\n\n // save column width if none is set\n useSetInitialColumnSizing(id, defaultWidth, width, ref, canMeasureSize, setColumnSizing);\n\n // feature specific styles\n const style: React.CSSProperties = {};\n\n // column groups often span multiple columns\n if (colSpan > 1) {\n style.gridColumn = `span ${colSpan}`;\n }\n\n // pinned columns should be offset from either the left or right\n if (isPinned) {\n style[isPinned] = `${offset}px`;\n }\n\n return (\n <th\n {...getSortAttributes(canSort, handleSort, sortDirection)}\n className={className}\n data-cell-align={isGroup ? 'center' : align}\n data-cell-id={id}\n data-cell-pinned={isPinned ? isPinned : undefined}\n style={style}\n ref={setRef}>\n {isPlaceholder ? null : isInternalColumn(id) ? (\n children\n ) : (\n <Tooltip title={String(tooltip ?? children)} placement=\"top\">\n <span className=\"truncate\">{children}</span>\n </Tooltip>\n )}\n {sortDirection ? <SortIndicator direction={sortDirection} /> : null}\n {hasMenu ? (\n <HeaderMenu\n canFilter={canFilter}\n canGoto={canGoto}\n canHide={canHide}\n canPin={canPin}\n canSort={canSort}\n className={cn({\n 'ml-auto': align !== 'right',\n 'ml-0': align === 'right',\n })}\n customMenu={customMenu}\n index={index}\n isFiltered={isFiltered}\n onFilter={handleFilter}\n onGoto={handleGoto}\n onHide={handleHide}\n onPin={handlePin}\n onSortToggle={handleSortToggle}\n scrollToIndex={scrollToIndex}\n setRowActiveIndex={setRowActiveIndex}\n sortDirection={sortDirection}\n columnId={id}\n />\n ) : null}\n {canResize ? (\n <Resizer\n headerRef={ref}\n id={id}\n isResizing={isResizing as boolean}\n onResize={handleResize as (event: unknown) => void}\n onResetSize={handleResetSize as () => void}\n setColumnSizing={setColumnSizing}\n width={width}\n />\n ) : null}\n </th>\n );\n});\n"],"names":["Header","props","header","scrollToIndex","column","getIsGrouped","table","getContext","tableMeta","options","meta","columnMeta","_header$column$column","columnDef","isGroup","subHeaders","length","isPinned","getIsPinned","canFilter","isPlaceholder","getCanFilter","enableColumnFilters","canHide","getCanHide","canMeasureSize","getRowModel","rows","canPin","getCanPin","canResize","getCanResize","canSort","getCanSort","canGoto","rowGoto","isEnabled","getIsSorted","hasMenu","isInternalColumn","id","menu","sorting","getState","filters","columnFilters","search","globalFilter","memoedProps","align","className","cn","headerClassName","children","flexRender","colSpan","customMenu","defaultWidth","isFiltered","getIsFiltered","index","offset","getStart","setRowActiveIndex","rowActive","setColumnSizing","tooltip","width","columnSizing","nextHeader","headerGroup","headers","onFilter","setFilterValue","comparator","TableFilterComparator","Contains","onGoto","query","_tableMeta$rowGoto$ha","_tableMeta$rowGoto","handleGoto","call","onHide","getToggleVisibilityHandler","onPin","setColumnPinning","pinningState","left","undefined","unfreezeAllExternalColumns","freezeUptoExternalColumn","getAllLeafColumns","map","isResizing","getIsResizing","onResize","getResizeHandler","resetSize","handleSortToggle","sortDirection","clearSorting","toggleSorting","onSort","getToggleSortingHandler","onSortToggle","React","MemoedHeader","key","memo","handleFilter","handleHide","handlePin","handleResize","handleSort","handleResetSize","ref","setRef","useState","useSetInitialColumnSizing","style","gridColumn","getSortAttributes","Tooltip","title","String","placement","SortIndicator","direction","HeaderMenu","columnId","Resizer","headerRef","onResetSize"],"mappings":"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"}
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Resizer.js
CHANGED
|
@@ -8,6 +8,7 @@ function Resizer(props) {
|
|
|
8
8
|
headerRef,
|
|
9
9
|
id,
|
|
10
10
|
isResizing,
|
|
11
|
+
onResetSize,
|
|
11
12
|
onResize,
|
|
12
13
|
setColumnSizing,
|
|
13
14
|
width
|
|
@@ -22,16 +23,21 @@ function Resizer(props) {
|
|
|
22
23
|
};
|
|
23
24
|
// columns set to "grow" don't set a width, so if resize is being triggered on a grow column make sure to set a size first
|
|
24
25
|
const handleResize = event => {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
[id]: headerRef.getBoundingClientRect().width
|
|
29
|
-
}));
|
|
30
|
-
setTimeout(() => {
|
|
31
|
-
onResize === null || onResize === void 0 ? void 0 : onResize(event);
|
|
32
|
-
}, 1);
|
|
26
|
+
// event.detail >= 2 means a user has clicked more than once quickly.
|
|
27
|
+
if (event.detail >= 2) {
|
|
28
|
+
onResetSize();
|
|
33
29
|
} else {
|
|
34
|
-
|
|
30
|
+
if (!Number.isInteger(width) && headerRef) {
|
|
31
|
+
setColumnSizing(sizes => ({
|
|
32
|
+
...sizes,
|
|
33
|
+
[id]: headerRef.getBoundingClientRect().width
|
|
34
|
+
}));
|
|
35
|
+
setTimeout(() => {
|
|
36
|
+
onResize === null || onResize === void 0 ? void 0 : onResize(event);
|
|
37
|
+
}, 1);
|
|
38
|
+
} else {
|
|
39
|
+
onResize === null || onResize === void 0 ? void 0 : onResize(event);
|
|
40
|
+
}
|
|
35
41
|
}
|
|
36
42
|
};
|
|
37
43
|
const handle = /*#__PURE__*/React__default.createElement("div", {
|
package/dist/esm/packages/taco/src/primitives/Table/Core/components/Header/components/Resizer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Resizer.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Header/components/Resizer.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Tooltip } from '../../../../../../components/Tooltip/Tooltip';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { TableColumnWidth } from '../../../../types';\n\ntype ResizerProps = {\n headerRef: HTMLTableCellElement | null;\n id: string;\n isResizing: boolean;\n onResize: (event: unknown) => void;\n setColumnSizing: any;\n width?: TableColumnWidth;\n};\n\nexport function Resizer(props: ResizerProps) {\n const { headerRef, id, isResizing, onResize, setColumnSizing, width } = props;\n const { texts } = useLocalization();\n\n // this prevents sort handlers being activated\n const handleClick = event => {\n event.stopPropagation();\n event.preventDefault();\n };\n\n // columns set to \"grow\" don't set a width, so if resize is being triggered on a grow column make sure to set a size first\n const handleResize = event => {\n if (!Number.isInteger(width) && headerRef) {\n
|
|
1
|
+
{"version":3,"file":"Resizer.js","sources":["../../../../../../../../../../../src/primitives/Table/Core/components/Header/components/Resizer.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Tooltip } from '../../../../../../components/Tooltip/Tooltip';\nimport { useLocalization } from '../../../../../../components/Provider/Localization';\nimport { TableColumnWidth } from '../../../../types';\n\ntype ResizerProps = {\n headerRef: HTMLTableCellElement | null;\n id: string;\n isResizing: boolean;\n onResize: (event: unknown) => void;\n onResetSize: () => void;\n setColumnSizing: any;\n width?: TableColumnWidth;\n};\n\nexport function Resizer(props: ResizerProps) {\n const { headerRef, id, isResizing, onResetSize, onResize, setColumnSizing, width } = props;\n const { texts } = useLocalization();\n\n // this prevents sort handlers being activated\n const handleClick = event => {\n event.stopPropagation();\n event.preventDefault();\n };\n\n // columns set to \"grow\" don't set a width, so if resize is being triggered on a grow column make sure to set a size first\n const handleResize = event => {\n // event.detail >= 2 means a user has clicked more than once quickly.\n if (event.detail >= 2) {\n onResetSize();\n } else {\n if (!Number.isInteger(width) && headerRef) {\n setColumnSizing(sizes => ({\n ...sizes,\n [id]: headerRef.getBoundingClientRect().width,\n }));\n setTimeout(() => {\n onResize?.(event);\n }, 1);\n } else {\n onResize?.(event);\n }\n }\n };\n\n const handle = (\n <div\n className={cn(\n 'invisible absolute right-0 top-0 z-10 -mr-2 flex h-full w-4 cursor-col-resize touch-none select-none justify-center rounded py-0.5',\n 'group-hover/header:visible',\n '[th:last-child>&]:!mr-0 [th:last-child>&]:w-2',\n {\n '!visible': isResizing,\n }\n )}\n onClick={handleClick}\n onMouseDown={handleResize}\n onTouchStart={handleResize}>\n <div\n className={cn('h-full w-1 rounded', {\n '!bg-blue-500': isResizing,\n 'bg-grey-500 hover:bg-grey-700': !isResizing,\n })}\n />\n </div>\n );\n\n if (isResizing) {\n return handle;\n }\n\n return (\n <Tooltip placement=\"top\" title={texts.table.columns.resize.tooltip}>\n {handle}\n </Tooltip>\n );\n}\n"],"names":["Resizer","props","headerRef","id","isResizing","onResetSize","onResize","setColumnSizing","width","texts","useLocalization","handleClick","event","stopPropagation","preventDefault","handleResize","detail","Number","isInteger","sizes","getBoundingClientRect","setTimeout","handle","React","className","cn","onClick","onMouseDown","onTouchStart","Tooltip","placement","title","table","columns","resize","tooltip"],"mappings":";;;;;SAgBgBA,OAAOA,CAACC,KAAmB;EACvC,MAAM;IAAEC,SAAS;IAAEC,EAAE;IAAEC,UAAU;IAAEC,WAAW;IAAEC,QAAQ;IAAEC,eAAe;IAAEC;GAAO,GAAGP,KAAK;EAC1F,MAAM;IAAEQ;GAAO,GAAGC,eAAe,EAAE;;EAGnC,MAAMC,WAAW,GAAGC,KAAK;IACrBA,KAAK,CAACC,eAAe,EAAE;IACvBD,KAAK,CAACE,cAAc,EAAE;GACzB;;EAGD,MAAMC,YAAY,GAAGH,KAAK;;IAEtB,IAAIA,KAAK,CAACI,MAAM,IAAI,CAAC,EAAE;MACnBX,WAAW,EAAE;KAChB,MAAM;MACH,IAAI,CAACY,MAAM,CAACC,SAAS,CAACV,KAAK,CAAC,IAAIN,SAAS,EAAE;QACvCK,eAAe,CAACY,KAAK,KAAK;UACtB,GAAGA,KAAK;UACR,CAAChB,EAAE,GAAGD,SAAS,CAACkB,qBAAqB,EAAE,CAACZ;SAC3C,CAAC,CAAC;QACHa,UAAU,CAAC;UACPf,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGM,KAAK,CAAC;SACpB,EAAE,CAAC,CAAC;OACR,MAAM;QACHN,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGM,KAAK,CAAC;;;GAG5B;EAED,MAAMU,MAAM,gBACRC;IACIC,SAAS,EAAEC,EAAE,CACT,oIAAoI,EACpI,4BAA4B,EAC5B,+CAA+C,EAC/C;MACI,UAAU,EAAErB;KACf,CACJ;IACDsB,OAAO,EAAEf,WAAW;IACpBgB,WAAW,EAAEZ,YAAY;IACzBa,YAAY,EAAEb;kBACdQ;IACIC,SAAS,EAAEC,EAAE,CAAC,oBAAoB,EAAE;MAChC,cAAc,EAAErB,UAAU;MAC1B,+BAA+B,EAAE,CAACA;KACrC;IACH,CAET;EAED,IAAIA,UAAU,EAAE;IACZ,OAAOkB,MAAM;;EAGjB,oBACIC,6BAACM,OAAO;IAACC,SAAS,EAAC,KAAK;IAACC,KAAK,EAAEtB,KAAK,CAACuB,KAAK,CAACC,OAAO,CAACC,MAAM,CAACC;KACtDb,MAAM,CACD;AAElB;;;;"}
|
|
@@ -36,6 +36,7 @@ export declare type MemoedHeaderProps = {
|
|
|
36
36
|
onResize?: (event: unknown) => void;
|
|
37
37
|
onSort?: (event: unknown) => void;
|
|
38
38
|
onSortToggle?: (sortDirection: TableColumnSortDirection | false) => void;
|
|
39
|
+
resetSize?: () => void;
|
|
39
40
|
scrollToIndex: (index: number) => void;
|
|
40
41
|
setRowActiveIndex: (index: number) => void;
|
|
41
42
|
setColumnSizing: any;
|