@economic/taco 2.17.1 → 2.18.0

package/dist/components/Select2/components/Search.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
 import { InputProps } from '../../Input/Input';
-export declare type Select2SearchProps = InputProps & {};
+export declare type Select2SearchProps = InputProps & {
+    onTabKeyPress: () => void;
+};
 export declare const Search: React.ForwardRefExoticComponent<Pick<React.InputHTMLAttributes<HTMLInputElement>, "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "enterKeyHint" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "placeholder" | "readOnly" | "required" | "size" | "src" | "step" | "type" | "value" | "width" | "onChange" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & {
     highlighted?: boolean | undefined;
     invalid?: boolean | undefined;
@@ -9,4 +11,6 @@ export declare const Search: React.ForwardRefExoticComponent<Pick<React.InputHTM
 } & {
     button?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
     icon?: "list" | JSX.Element | "document" | "log" | "menu" | "note" | "search" | "warning" | "time" | "filter" | "line" | "location" | "copy" | "move" | "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "ai-chat-solid" | "ai-stars" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach-warning" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chart-area" | "chart-bar" | "chart-line" | "chart-pie" | "chart-table" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left-solid" | "chevron-left" | "chevron-right-double" | "chevron-right-solid" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "circle-close" | "circle-information" | "circle-minus" | "circle-plus" | "circle-questionmark" | "circle-tick" | "circle-warning" | "clamp-open" | "clamp" | "close" | "column-freeze" | "column-unfreeze" | "columns" | "connection-enable" | "connection-revoke" | "contacts" | "courses" | "credit" | "delete-permanently" | "delete" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-split" | "document-time" | "download" | "drag" | "e-copedia" | "e-signature" | "edit-simple" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope-solid" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "eye-off" | "eye-on" | "filter-solid" | "font-size" | "graph-solid" | "hash" | "height-extra-tall" | "height-medium" | "height-short" | "height-tall" | "home" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "list-bulleted" | "list-search" | "lock-open" | "lock" | "log-out" | "market" | "match-amount" | "match-entries" | "mileage" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "navigation-list" | "note-follow-up" | "note-read" | "numbers" | "partner-api" | "payment-paid" | "payment-unpaid" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "phone-solid" | "play" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "profile" | "project-cards" | "projects" | "question-mark-bold" | "question-mark" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-bold" | "tick" | "transfer-cancel" | "transfer-locked" | "transfer" | "undo" | "undock" | "unreconciled" | "webshop" | "website" | "workflow-template-basic" | "workflow" | "zoom" | undefined;
+} & {
+    onTabKeyPress: () => void;
 } & React.RefAttributes<HTMLInputElement>>;

package/dist/components/Table3/components/columns/cell/EditingCell.d.ts

@@ -4,6 +4,7 @@ export declare type EditingCellProps<TType = unknown> = CellContext<TType, unkno
     highlighted?: boolean;
     highlightedAsCurrent?: boolean;
     children?: string | JSX.Element;
+    className?: string;
 };
 export declare function EditingCell<TType = unknown>(props: EditingCellProps<TType>): JSX.Element;
 export declare type MemoedEditingCellProps<TType = unknown> = EditingCellProps<TType> & {

package/dist/components/Table3/components/columns/cell/Indicator.d.ts

@@ -15,3 +15,8 @@ export declare type IndicatorProps = {
     validationErrors: any;
 };
 export declare const Indicator: ({ reason, columnName, mountNode, validationErrors }: IndicatorProps) => React.ReactPortal;
+/**
+ * Generates class names needed to highlight row cells, used when row has a move indicator
+ */
+export declare function getIndicatorCellClassName(columnIndex: number, lastColumnIndex: number): string;
+export declare function isIndicatorVisible(rowIndex: any, rowActiveIndex: any, rowMoveReason: any): any;

package/dist/components/Table3/components/toolbar/Filter/filters/components/FilterValue.d.ts

@@ -3,7 +3,7 @@ import { Column as RTColumn } from '@tanstack/react-table';
 import { Table3FilterComparator } from '../../../../../types';
 export declare type FilterValueProps<TType = unknown> = {
     column?: RTColumn<TType, unknown>;
-    comparator: Table3FilterComparator;
+    comparator: Table3FilterComparator | null;
     onChange: (value: any) => void;
     value: any;
 };

package/dist/components/Table3/types.d.ts

@@ -99,7 +99,7 @@ export declare enum Table3FilterComparator {
     HasNoneOf = 13
 }
 export declare type Table3FilterValue = {
-    comparator: Table3FilterComparator;
+    comparator: Table3FilterComparator | null;
     value: any;
 };
 export declare type Table3Filter = {

package/dist/esm/packages/taco/src/components/Select2/Select2.js

@@ -16,6 +16,7 @@ import { Select2Context } from './components/Context.js';
 import { Option } from './components/Option.js';
 import { Group } from './components/Group.js';
 import { Title } from './components/Title.js';
+import { getNextFocussableElement } from '../../utils/dom.js';
 import { Trigger as Trigger$1 } from './components/Trigger.js';
 import { useIsFormControl } from '../../hooks/useIsFormControl.js';
 import { BubbleSelect } from '../../primitives/BubbleSelect.js';
@@ -73,6 +74,7 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
   // align the listbox min width with the width of the input - it should never be smaller
   const dimensions = useBoundingClientRectListener(internalRef);
   // state
+  const [tabTriggeredClose, setTabTriggeredClose] = React__default.useState(false);
   const [open, setOpen] = React__default.useState(false);
   const [value, _setValue] = useControllableState({
     // uncontrolled
@@ -155,6 +157,22 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
       setShouldPauseHoverState(true);
     }
   };
+  const handleCloseAutoFocus = event => {
+    event.preventDefault();
+    event.stopPropagation();
+    if (tabTriggeredClose) {
+      const nextFocussableElement = getNextFocussableElement(internalRef.current);
+      if (nextFocussableElement) {
+        // UX requirement: move focus to the next focussable element when tab key is pressed to select the value
+        nextFocussableElement.focus();
+        // Reset the tabTriggeredClose state
+        setTabTriggeredClose(false);
+      }
+    } else {
+      var _internalRef$current;
+      (_internalRef$current = internalRef.current) === null || _internalRef$current === void 0 ? void 0 : _internalRef$current.focus();
+    }
+  };
   const className = cn('border-grey-300 rounded border bg-white py-1.5 shadow-md outline-none', createCollectionClassName());
   return /*#__PURE__*/React__default.createElement(Select2Context.Provider, {
     value: context
@@ -183,15 +201,10 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
     asChild: true,
     align: "start",
     onOpenAutoFocus: () => {
-      var _internalRef$current;
-      (_internalRef$current = internalRef.current) === null || _internalRef$current === void 0 ? void 0 : _internalRef$current.focus();
-    },
-    onCloseAutoFocus: event => {
       var _internalRef$current2;
-      event.preventDefault();
-      event.stopPropagation();
       (_internalRef$current2 = internalRef.current) === null || _internalRef$current2 === void 0 ? void 0 : _internalRef$current2.focus();
     },
+    onCloseAutoFocus: handleCloseAutoFocus,
     sideOffset: 4,
     tabIndex: -1
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -201,7 +214,8 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
     }
   }, flattenedChildren.length > 0 || onCreate ? ( /*#__PURE__*/React__default.createElement(Search, {
     placeholder: onCreate ? texts.select2.searchOrCreate : texts.select2.search,
-    ref: searchRef
+    ref: searchRef,
+    onTabKeyPress: () => setTabTriggeredClose(true)
   })) : null, flattenedChildren.length <= 0 ? ( /*#__PURE__*/React__default.createElement("div", {
     className: "text-grey-700 -mt-0.5 flex h-8 items-center px-2",
     role: "presentation"

package/dist/esm/packages/taco/src/components/Select2/Select2.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\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 } 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 { 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';\n//import { All } from './components/All';\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};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    autoFocus?: boolean;\n    children: Select2Children;\n    defaultValue?: Select2Value;\n    emptyValue?: Select2OptionValue;\n    disabled?: boolean;\n    highlighted?: boolean;\n    invalid?: boolean;\n    multiple?: boolean;\n    name?: string;\n    onChange?: (value: Select2Value) => void;\n    onCreate?: Select2CreateHandler;\n    onDelete?: Select2DeleteHandler;\n    onEdit?: Select2EditHandler;\n    readOnly?: boolean;\n    required?: boolean;\n    tags?: boolean;\n    value?: Select2Value;\n    placeholder?: 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        placeholder,\n        highlighted = false,\n        invalid = false,\n        multiple = false,\n        name,\n        onChange,\n        onCreate,\n        onDelete,\n        onEdit,\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 [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        validationError,\n        value,\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (open) {\n            event.preventDefault();\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 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                <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.Trigger asChild data-taco=\"Select2\">\n                    <Trigger\n                        {...otherProps}\n                        aria-haspopup=\"listbox\"\n                        emptyValue={emptyValue}\n                        onBlur={handleBlur}\n                        onKeyDown={handleKeyDown}\n                        ref={internalRef}\n                        placeholder={placeholder}>\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={event => {\n                            event.preventDefault();\n                            event.stopPropagation();\n                            internalRef.current?.focus();\n                        }}\n                        sideOffset={4}\n                        tabIndex={-1}>\n                        <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n                            {flattenedChildren.length > 0 || onCreate ? (\n                                <Search\n                                    placeholder={onCreate ? texts.select2.searchOrCreate : texts.select2.search}\n                                    ref={searchRef}\n                                />\n                            ) : null}\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                                    {/*multiple && !searchQuery && Array.isArray(value) ? (\n                                    <All\n                                        children={flattenedChildren}\n                                        onToggle={_setValue}\n                                        selected={value.length === flattenedChildren.length}\n                                    />\n                                ) : null*/}\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            </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","placeholder","highlighted","invalid","multiple","name","onChange","onCreate","onDelete","onEdit","readOnly","tags","value","prop","otherProps","emptyOption","useMemo","Option","key","className","initialChildren","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","open","setOpen","useState","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","shouldPauseHoverState","setShouldPauseHoverState","useIsHoverStatePaused","flattenedChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","currentTarget","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","ControlledHiddenField","options","map","child","parentRef","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current","focus","onCloseAutoFocus","stopPropagation","_internalRef$current2","sideOffset","tabIndex","style","minWidth","width","length","Search","select2","searchOrCreate","search","role","customSelector","Collection","Create","Group","Title","isFormControl","useIsFormControl","bubbleValue","Array","isArray","String","BubbleSelect","option","displayName"],"mappings":"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"}
+{"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\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 } 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 { 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 } from '../../utils/dom';\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};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    autoFocus?: boolean;\n    children: Select2Children;\n    defaultValue?: Select2Value;\n    emptyValue?: Select2OptionValue;\n    disabled?: boolean;\n    highlighted?: boolean;\n    invalid?: boolean;\n    multiple?: boolean;\n    name?: string;\n    onChange?: (value: Select2Value) => void;\n    onCreate?: Select2CreateHandler;\n    onDelete?: Select2DeleteHandler;\n    onEdit?: Select2EditHandler;\n    readOnly?: boolean;\n    required?: boolean;\n    tags?: boolean;\n    value?: Select2Value;\n    placeholder?: 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        placeholder,\n        highlighted = false,\n        invalid = false,\n        multiple = false,\n        name,\n        onChange,\n        onCreate,\n        onDelete,\n        onEdit,\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        validationError,\n        value,\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (open) {\n            event.preventDefault();\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 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                <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.Trigger asChild data-taco=\"Select2\">\n                    <Trigger\n                        {...otherProps}\n                        aria-haspopup=\"listbox\"\n                        emptyValue={emptyValue}\n                        onBlur={handleBlur}\n                        onKeyDown={handleKeyDown}\n                        ref={internalRef}\n                        placeholder={placeholder}>\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                                <Search\n                                    placeholder={onCreate ? texts.select2.searchOrCreate : texts.select2.search}\n                                    ref={searchRef}\n                                    onTabKeyPress={() => setTabTriggeredClose(true)}\n                                />\n                            ) : null}\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            </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","placeholder","highlighted","invalid","multiple","name","onChange","onCreate","onDelete","onEdit","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","ctrlKey","metaKey","test","_listboxRef$current","current","dispatchEvent","createCustomKeyboardEvent","handleBlur","onBlur","elementGainingFocus","relatedTarget","portalId","_elementGainingFocus$","closest","id","currentTarget","getAttribute","_otherProps$onBlur","call","handleListboxKeyDown","isAriaDirectionKey","handleCloseAutoFocus","stopPropagation","nextFocussableElement","getNextFocussableElement","focus","_internalRef$current","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","ControlledHiddenField","options","map","child","parentRef","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","_internalRef$current2","onCloseAutoFocus","sideOffset","tabIndex","style","minWidth","width","length","Search","select2","searchOrCreate","search","onTabKeyPress","role","customSelector","Collection","Create","Group","Title","isFormControl","useIsFormControl","bubbleValue","Array","isArray","String","BubbleSelect","option","displayName"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Select2/components/Search.js

@@ -8,6 +8,7 @@ import { useSelect2Context } from './Context.js';
 
 const Search = /*#__PURE__*/React__default.forwardRef(function ListboxSearch(props, ref) {
   const {
+    onTabKeyPress,
     ...otherProps
   } = props;
   const {
@@ -32,7 +33,7 @@ const Search = /*#__PURE__*/React__default.forwardRef(function ListboxSearch(pro
     // Select2 should close dropdown and receive focus, when user press Tab while searching (UX requirement to support better keyboard navigation)
     if (event.key === 'Tab') {
       setOpen(false);
-      return;
+      onTabKeyPress();
     }
     if (isAriaSelectionKey(event) || event.key === 'ArrowDown' || event.key === 'ArrowUp') {
       var _listboxRef$current;

package/dist/esm/packages/taco/src/components/Select2/components/Search.js.map

@@ -1 +1 @@
-{"version":3,"file":"Search.js","sources":["../../../../../../../../src/components/Select2/components/Search.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\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\nexport const Search = React.forwardRef<HTMLInputElement, Select2SearchProps>(function ListboxSearch(props, ref) {\n    const { ...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            return;\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                aria-hidden\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","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":";;;;;;;;MAUaA,MAAM,gBAAGC,cAAK,CAACC,UAAU,CAAuC,SAASC,aAAaA,CAACC,KAAK,EAAEC,GAAG;EAC1G,MAAM;IAAE,GAAGC;GAAY,GAAGF,KAAK;EAC/B,MAAM;IAAEG,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;MACd;;IAGJ,IAAIS,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,oBACId,6BAAC0B,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;kBAC1B9B,6BAAC+B,KAAK,oBACE1B,UAAU;;IAEd2B,SAAS;IACTH,OAAO,EAAE,CAAC,CAACnB,eAAe;IAC1BuB,QAAQ,EAAEpB,YAAY;IACtBqB,SAAS,EAAEhB,aAAa;IACxBd,GAAG,EAAEA,GAAG;IACRa,KAAK,EAAEV;KACT,CACE;AAEhB,CAAC;;;;"}
+{"version":3,"file":"Search.js","sources":["../../../../../../../../src/components/Select2/components/Search.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\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                aria-hidden\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;;IAEd2B,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;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/alert/ErrorAlert.js

@@ -92,7 +92,7 @@ function ErrorAlert(props) {
   // Getting the row from core rows (ignoring search and filtering)
   const getCoreRow = React__default.useCallback(rowId => coreRows.find(coreRow => coreRow.id === rowId), [coreRows]);
   return /*#__PURE__*/React__default.createElement("div", {
-    className: "mb-4"
+    className: "mb-4 empty:hidden"
   }, errorsRowIds.length ? ( /*#__PURE__*/React__default.createElement(Alert, {
     state: "error",
     className: "mb-1"

package/dist/esm/packages/taco/src/components/Table3/components/alert/ErrorAlert.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorAlert.js","sources":["../../../../../../../../../src/components/Table3/components/alert/ErrorAlert.tsx"],"sourcesContent":["import { Table as RTable, TableMeta } from '@tanstack/react-table';\nimport { TableStrategy } from '../../types';\nimport React from 'react';\nimport { Alert } from '../../../Alert/Alert';\nimport { Button } from '../../../Button/Button';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { focusableSelector } from '../../util/editing';\nimport { lastCellIndex } from '../rows/Row';\nimport { Dialog } from '../../../Dialog/Dialog';\nimport { Group } from '../../../Group/Group';\n\nexport type ErrorAlertProps<TType = unknown> = {\n    table: RTable<TType>;\n    tableRef: React.RefObject<HTMLDivElement>;\n    scrollToIndex: TableStrategy['scrollToIndex'];\n    rowIdentifier?: string;\n};\n\nexport function ErrorAlert<TType = unknown>(props: ErrorAlertProps<TType>) {\n    const { table, tableRef, scrollToIndex, rowIdentifier } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const errors = tableMeta.validation.errors;\n    const errorsRowIds = errors ? Object.keys(errors) : [];\n    const rows = table.getRowModel().rows;\n    const coreRows = table.getCoreRowModel().rows;\n    const { texts } = useLocalization();\n    const [resetFiltersConfirmationOpen, setResetFiltersConfirmationOpen] = React.useState(false);\n    const [internalRowId, setInternalRowId] = React.useState<string | null>(null);\n    const [internalRowIndex, setInternalRowIndex] = React.useState<number | null>(null);\n    const [isFiltersReset, setIsFiltersReset] = React.useState(false);\n    const columns = table.getAllFlatColumns();\n    const column = columns.find(column => column.id === rowIdentifier);\n    const rowIdentifierHeader = column?.columnDef.meta?.header;\n\n    // Find and focus first invalid cell\n    const navigateToFirstInvalidCell = () => {\n        const firstInvalidCell = tableRef.current?.querySelector(\n            '[role=\"row\"][data-current=\"true\"] [role=\"cell\"][data-invalid=\"true\"]'\n        );\n        const firstInvalidElement = firstInvalidCell?.querySelector(focusableSelector);\n\n        if (firstInvalidElement) {\n            (firstInvalidElement as HTMLElement)?.focus();\n            lastCellIndex.value = firstInvalidCell?.getAttribute('data-column-index');\n        }\n    };\n\n    // Navigate to row and focus first invalid cell\n    const navigateToRow = rowIndex => {\n        tableMeta.rowActive.setRowActiveIndex(rowIndex);\n        scrollToIndex(rowIndex, { align: 'center' });\n        lastCellIndex.value = undefined;\n\n        // Need to request animation frame here, because newly selected row is not rendered yet.\n        requestAnimationFrame(() => {\n            navigateToFirstInvalidCell();\n        });\n    };\n\n    // When internal row index is changed after click on row link, we should navigate to the row.\n    React.useEffect(() => {\n        if (internalRowIndex !== null && internalRowIndex >= 0) {\n            navigateToRow(internalRowIndex);\n        }\n    }, [internalRowIndex]);\n\n    // When filters are reset, we're able to get the real row index by rowId\n    React.useEffect(() => {\n        if (isFiltersReset) {\n            const rowIndex = rows.findIndex(row => row.id === internalRowId);\n            if (rowIndex === -1) {\n                return;\n            }\n            setInternalRowIndex(rowIndex);\n        }\n    }, [isFiltersReset]);\n\n    const onRowNumberClick = React.useCallback(\n        (rowId: string) => {\n            // When row is hidden due filtering it will not be present in rows (but it still will be present in coreRows)\n            const foundIndex = rows.findIndex(row => row.id === rowId);\n            if (foundIndex === -1) {\n                setIsFiltersReset(false);\n                setResetFiltersConfirmationOpen(true);\n\n                // Since row indexes changed due filtering, we need to save row id, so that we can find it when filters will be reset\n                setInternalRowId(rowId);\n                return;\n            }\n\n            // In cases when user clicked on a row link multiple times we still need to navigate to the row, and focus the cell,\n            // because row/cell will loose focus on next click, but row index will not change.\n            if (foundIndex === internalRowIndex) {\n                navigateToRow(foundIndex);\n            } else {\n                setInternalRowIndex(foundIndex);\n            }\n        },\n        [rows, internalRowIndex]\n    );\n\n    const onResetFiltersConfirm = () => {\n        setIsFiltersReset(true);\n    };\n\n    // Getting the row from core rows (ignoring search and filtering)\n    const getCoreRow = React.useCallback((rowId: string) => coreRows.find(coreRow => coreRow.id === rowId), [coreRows]);\n\n    return (\n        <div className=\"mb-4\">\n            {errorsRowIds.length ? (\n                <Alert state=\"error\" className=\"mb-1\">\n                    <>\n                        <b>\n                            {errorsRowIds.length} {texts.table3.validation.alert.unsavedEntries(errorsRowIds.length)}\n                        </b>{' '}\n                    </>\n                    {rowIdentifierHeader || texts.table3.validation.index}{' '}\n                    {errorsRowIds.map((rowId: string, index) => {\n                        const coreRow = getCoreRow(rowId);\n                        return (\n                            <>\n                                <Button\n                                    key={rowId}\n                                    className=\"!min-h-[theme(spacing.2)] !min-w-[theme(spacing.2)] !px-1\"\n                                    appearance=\"discrete\"\n                                    onClick={() => {\n                                        onRowNumberClick(rowId);\n                                    }}>\n                                    {/* Getting row from core rows, because 'table.getRow' will fail if row is hidden due filtering */}\n                                    {rowIdentifier ? coreRow?.original[rowIdentifier] : coreRow?.index}\n                                </Button>\n                                <span key={`${rowId}_comma`}>{index < errorsRowIds.length - 1 ? ',' : ''}</span>\n                            </>\n                        );\n                    })}\n                    {texts.table3.validation.alert.incompleteAndHavntBeenSaved(errorsRowIds.length)}\n                </Alert>\n            ) : null}\n            <FilterResetDialog\n                open={resetFiltersConfirmationOpen}\n                onClose={() => {\n                    setResetFiltersConfirmationOpen(false);\n                }}\n                onConfirm={onResetFiltersConfirm}\n                table={table}\n            />\n        </div>\n    );\n}\n\ntype FilterResetDialogProps<TType = unknown> = {\n    open: boolean;\n    onClose: () => void;\n    onConfirm: () => void;\n    table: RTable<TType>;\n};\nfunction FilterResetDialog<TType = unknown>(props: FilterResetDialogProps<TType>) {\n    const { open, onClose, onConfirm, table } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const { texts } = useLocalization();\n\n    const resetFilters = React.useCallback(() => {\n        tableMeta.search.setQuery('');\n        table.resetGlobalFilter();\n        table.resetColumnFilters();\n    }, [table, tableMeta.search]);\n\n    const handleConfirmClick = () => {\n        resetFilters();\n        onConfirm();\n        onClose();\n    };\n\n    return (\n        <Dialog open={open} onClose={onClose} size=\"xs\">\n            <Dialog.Content aria-label=\"Create a new account\">\n                <Dialog.Title>{texts.table3.validation.resetFiltersDialog.title}</Dialog.Title>\n\n                <p>{texts.table3.validation.resetFiltersDialog.description}</p>\n\n                <Dialog.Footer>\n                    <Group>\n                        <Dialog.Close>\n                            <Button>{texts.table3.validation.resetFiltersDialog.cancel}</Button>\n                        </Dialog.Close>\n                        <Button appearance=\"primary\" onClick={handleConfirmClick}>\n                            {texts.table3.validation.resetFiltersDialog.confirm}\n                        </Button>\n                    </Group>\n                </Dialog.Footer>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["ErrorAlert","props","table","tableRef","scrollToIndex","rowIdentifier","tableMeta","options","meta","errors","validation","errorsRowIds","Object","keys","rows","getRowModel","coreRows","getCoreRowModel","texts","useLocalization","resetFiltersConfirmationOpen","setResetFiltersConfirmationOpen","React","useState","internalRowId","setInternalRowId","internalRowIndex","setInternalRowIndex","isFiltersReset","setIsFiltersReset","columns","getAllFlatColumns","column","find","id","rowIdentifierHeader","_column$columnDef$met","columnDef","header","navigateToFirstInvalidCell","firstInvalidCell","_tableRef$current","current","querySelector","firstInvalidElement","focusableSelector","focus","lastCellIndex","value","getAttribute","navigateToRow","rowIndex","rowActive","setRowActiveIndex","align","undefined","requestAnimationFrame","useEffect","findIndex","row","onRowNumberClick","useCallback","rowId","foundIndex","onResetFiltersConfirm","getCoreRow","coreRow","className","length","Alert","state","table3","alert","unsavedEntries","index","map","Button","key","appearance","onClick","original","incompleteAndHavntBeenSaved","FilterResetDialog","open","onClose","onConfirm","resetFilters","search","setQuery","resetGlobalFilter","resetColumnFilters","handleConfirmClick","Dialog","size","Content","Title","resetFiltersDialog","title","description","Footer","Group","Close","cancel","confirm"],"mappings":";;;;;;;;;SAkBgBA,UAAUA,CAAkBC,KAA6B;;EACrE,MAAM;IAAEC,KAAK;IAAEC,QAAQ;IAAEC,aAAa;IAAEC;GAAe,GAAGJ,KAAK;EAC/D,MAAMK,SAAS,GAAGJ,KAAK,CAACK,OAAO,CAACC,IAAwB;EACxD,MAAMC,MAAM,GAAGH,SAAS,CAACI,UAAU,CAACD,MAAM;EAC1C,MAAME,YAAY,GAAGF,MAAM,GAAGG,MAAM,CAACC,IAAI,CAACJ,MAAM,CAAC,GAAG,EAAE;EACtD,MAAMK,IAAI,GAAGZ,KAAK,CAACa,WAAW,EAAE,CAACD,IAAI;EACrC,MAAME,QAAQ,GAAGd,KAAK,CAACe,eAAe,EAAE,CAACH,IAAI;EAC7C,MAAM;IAAEI;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM,CAACC,4BAA4B,EAAEC,+BAA+B,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAC,KAAK,CAAC;EAC7F,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGH,cAAK,CAACC,QAAQ,CAAgB,IAAI,CAAC;EAC7E,MAAM,CAACG,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGL,cAAK,CAACC,QAAQ,CAAgB,IAAI,CAAC;EACnF,MAAM,CAACK,cAAc,EAAEC,iBAAiB,CAAC,GAAGP,cAAK,CAACC,QAAQ,CAAC,KAAK,CAAC;EACjE,MAAMO,OAAO,GAAG5B,KAAK,CAAC6B,iBAAiB,EAAE;EACzC,MAAMC,MAAM,GAAGF,OAAO,CAACG,IAAI,CAACD,MAAM,IAAIA,MAAM,CAACE,EAAE,KAAK7B,aAAa,CAAC;EAClE,MAAM8B,mBAAmB,GAAGH,MAAM,aAANA,MAAM,wBAAAI,qBAAA,GAANJ,MAAM,CAAEK,SAAS,CAAC7B,IAAI,cAAA4B,qBAAA,uBAAtBA,qBAAA,CAAwBE,MAAM;;EAG1D,MAAMC,0BAA0B,GAAGA;;IAC/B,MAAMC,gBAAgB,IAAAC,iBAAA,GAAGtC,QAAQ,CAACuC,OAAO,cAAAD,iBAAA,uBAAhBA,iBAAA,CAAkBE,aAAa,CACpD,sEAAsE,CACzE;IACD,MAAMC,mBAAmB,GAAGJ,gBAAgB,aAAhBA,gBAAgB,uBAAhBA,gBAAgB,CAAEG,aAAa,CAACE,iBAAiB,CAAC;IAE9E,IAAID,mBAAmB,EAAE;MACpBA,mBAAmC,aAAnCA,mBAAmC,uBAAnCA,mBAAmC,CAAEE,KAAK,EAAE;MAC7CC,aAAa,CAACC,KAAK,GAAGR,gBAAgB,aAAhBA,gBAAgB,uBAAhBA,gBAAgB,CAAES,YAAY,CAAC,mBAAmB,CAAC;;GAEhF;;EAGD,MAAMC,aAAa,GAAGC,QAAQ;IAC1B7C,SAAS,CAAC8C,SAAS,CAACC,iBAAiB,CAACF,QAAQ,CAAC;IAC/C/C,aAAa,CAAC+C,QAAQ,EAAE;MAAEG,KAAK,EAAE;KAAU,CAAC;IAC5CP,aAAa,CAACC,KAAK,GAAGO,SAAS;;IAG/BC,qBAAqB,CAAC;MAClBjB,0BAA0B,EAAE;KAC/B,CAAC;GACL;;EAGDjB,cAAK,CAACmC,SAAS,CAAC;IACZ,IAAI/B,gBAAgB,KAAK,IAAI,IAAIA,gBAAgB,IAAI,CAAC,EAAE;MACpDwB,aAAa,CAACxB,gBAAgB,CAAC;;GAEtC,EAAE,CAACA,gBAAgB,CAAC,CAAC;;EAGtBJ,cAAK,CAACmC,SAAS,CAAC;IACZ,IAAI7B,cAAc,EAAE;MAChB,MAAMuB,QAAQ,GAAGrC,IAAI,CAAC4C,SAAS,CAACC,GAAG,IAAIA,GAAG,CAACzB,EAAE,KAAKV,aAAa,CAAC;MAChE,IAAI2B,QAAQ,KAAK,CAAC,CAAC,EAAE;QACjB;;MAEJxB,mBAAmB,CAACwB,QAAQ,CAAC;;GAEpC,EAAE,CAACvB,cAAc,CAAC,CAAC;EAEpB,MAAMgC,gBAAgB,GAAGtC,cAAK,CAACuC,WAAW,CACrCC,KAAa;;IAEV,MAAMC,UAAU,GAAGjD,IAAI,CAAC4C,SAAS,CAACC,GAAG,IAAIA,GAAG,CAACzB,EAAE,KAAK4B,KAAK,CAAC;IAC1D,IAAIC,UAAU,KAAK,CAAC,CAAC,EAAE;MACnBlC,iBAAiB,CAAC,KAAK,CAAC;MACxBR,+BAA+B,CAAC,IAAI,CAAC;;MAGrCI,gBAAgB,CAACqC,KAAK,CAAC;MACvB;;;;IAKJ,IAAIC,UAAU,KAAKrC,gBAAgB,EAAE;MACjCwB,aAAa,CAACa,UAAU,CAAC;KAC5B,MAAM;MACHpC,mBAAmB,CAACoC,UAAU,CAAC;;GAEtC,EACD,CAACjD,IAAI,EAAEY,gBAAgB,CAAC,CAC3B;EAED,MAAMsC,qBAAqB,GAAGA;IAC1BnC,iBAAiB,CAAC,IAAI,CAAC;GAC1B;;EAGD,MAAMoC,UAAU,GAAG3C,cAAK,CAACuC,WAAW,CAAEC,KAAa,IAAK9C,QAAQ,CAACiB,IAAI,CAACiC,OAAO,IAAIA,OAAO,CAAChC,EAAE,KAAK4B,KAAK,CAAC,EAAE,CAAC9C,QAAQ,CAAC,CAAC;EAEnH,oBACIM;IAAK6C,SAAS,EAAC;KACVxD,YAAY,CAACyD,MAAM,kBAChB9C,6BAAC+C,KAAK;IAACC,KAAK,EAAC,OAAO;IAACH,SAAS,EAAC;kBAC3B7C,yEACIA,wCACKX,YAAY,CAACyD,MAAM,OAAGlD,KAAK,CAACqD,MAAM,CAAC7D,UAAU,CAAC8D,KAAK,CAACC,cAAc,CAAC9D,YAAY,CAACyD,MAAM,CAAC,CACxF,EAAC,GAAG,CACT,EACFjC,mBAAmB,IAAIjB,KAAK,CAACqD,MAAM,CAAC7D,UAAU,CAACgE,KAAK,EAAE,GAAG,EACzD/D,YAAY,CAACgE,GAAG,CAAC,CAACb,KAAa,EAAEY,KAAK;IACnC,MAAMR,OAAO,GAAGD,UAAU,CAACH,KAAK,CAAC;IACjC,oBACIxC,yEACIA,6BAACsD,MAAM;MACHC,GAAG,EAAEf,KAAK;MACVK,SAAS,EAAC,2DAA2D;MACrEW,UAAU,EAAC,UAAU;MACrBC,OAAO,EAAEA;QACLnB,gBAAgB,CAACE,KAAK,CAAC;;OAG1BzD,aAAa,GAAG6D,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEc,QAAQ,CAAC3E,aAAa,CAAC,GAAG6D,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEQ,KAAK,CAC7D,eACTpD;MAAMuD,GAAG,KAAKf;OAAgBY,KAAK,GAAG/D,YAAY,CAACyD,MAAM,GAAG,CAAC,GAAG,GAAG,GAAG,EAAE,CAAQ,CACjF;GAEV,CAAC,EACDlD,KAAK,CAACqD,MAAM,CAAC7D,UAAU,CAAC8D,KAAK,CAACS,2BAA2B,CAACtE,YAAY,CAACyD,MAAM,CAAC,CAC3E,IACR,IAAI,eACR9C,6BAAC4D,iBAAiB;IACdC,IAAI,EAAE/D,4BAA4B;IAClCgE,OAAO,EAAEA;MACL/D,+BAA+B,CAAC,KAAK,CAAC;KACzC;IACDgE,SAAS,EAAErB,qBAAqB;IAChC9D,KAAK,EAAEA;IACT,CACA;AAEd;AAQA,SAASgF,iBAAiBA,CAAkBjF,KAAoC;EAC5E,MAAM;IAAEkF,IAAI;IAAEC,OAAO;IAAEC,SAAS;IAAEnF;GAAO,GAAGD,KAAK;EACjD,MAAMK,SAAS,GAAGJ,KAAK,CAACK,OAAO,CAACC,IAAwB;EACxD,MAAM;IAAEU;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMmE,YAAY,GAAGhE,cAAK,CAACuC,WAAW,CAAC;IACnCvD,SAAS,CAACiF,MAAM,CAACC,QAAQ,CAAC,EAAE,CAAC;IAC7BtF,KAAK,CAACuF,iBAAiB,EAAE;IACzBvF,KAAK,CAACwF,kBAAkB,EAAE;GAC7B,EAAE,CAACxF,KAAK,EAAEI,SAAS,CAACiF,MAAM,CAAC,CAAC;EAE7B,MAAMI,kBAAkB,GAAGA;IACvBL,YAAY,EAAE;IACdD,SAAS,EAAE;IACXD,OAAO,EAAE;GACZ;EAED,oBACI9D,6BAACsE,MAAM;IAACT,IAAI,EAAEA,IAAI;IAAEC,OAAO,EAAEA,OAAO;IAAES,IAAI,EAAC;kBACvCvE,6BAACsE,MAAM,CAACE,OAAO;kBAAY;kBACvBxE,6BAACsE,MAAM,CAACG,KAAK,QAAE7E,KAAK,CAACqD,MAAM,CAAC7D,UAAU,CAACsF,kBAAkB,CAACC,KAAK,CAAgB,eAE/E3E,wCAAIJ,KAAK,CAACqD,MAAM,CAAC7D,UAAU,CAACsF,kBAAkB,CAACE,WAAW,CAAK,eAE/D5E,6BAACsE,MAAM,CAACO,MAAM,qBACV7E,6BAAC8E,KAAK,qBACF9E,6BAACsE,MAAM,CAACS,KAAK,qBACT/E,6BAACsD,MAAM,QAAE1D,KAAK,CAACqD,MAAM,CAAC7D,UAAU,CAACsF,kBAAkB,CAACM,MAAM,CAAU,CACzD,eACfhF,6BAACsD,MAAM;IAACE,UAAU,EAAC,SAAS;IAACC,OAAO,EAAEY;KACjCzE,KAAK,CAACqD,MAAM,CAAC7D,UAAU,CAACsF,kBAAkB,CAACO,OAAO,CAC9C,CACL,CACI,CACH,CACZ;AAEjB;;;;"}
+{"version":3,"file":"ErrorAlert.js","sources":["../../../../../../../../../src/components/Table3/components/alert/ErrorAlert.tsx"],"sourcesContent":["import { Table as RTable, TableMeta } from '@tanstack/react-table';\nimport { TableStrategy } from '../../types';\nimport React from 'react';\nimport { Alert } from '../../../Alert/Alert';\nimport { Button } from '../../../Button/Button';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { focusableSelector } from '../../util/editing';\nimport { lastCellIndex } from '../rows/Row';\nimport { Dialog } from '../../../Dialog/Dialog';\nimport { Group } from '../../../Group/Group';\n\nexport type ErrorAlertProps<TType = unknown> = {\n    table: RTable<TType>;\n    tableRef: React.RefObject<HTMLDivElement>;\n    scrollToIndex: TableStrategy['scrollToIndex'];\n    rowIdentifier?: string;\n};\n\nexport function ErrorAlert<TType = unknown>(props: ErrorAlertProps<TType>) {\n    const { table, tableRef, scrollToIndex, rowIdentifier } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const errors = tableMeta.validation.errors;\n    const errorsRowIds = errors ? Object.keys(errors) : [];\n    const rows = table.getRowModel().rows;\n    const coreRows = table.getCoreRowModel().rows;\n    const { texts } = useLocalization();\n    const [resetFiltersConfirmationOpen, setResetFiltersConfirmationOpen] = React.useState(false);\n    const [internalRowId, setInternalRowId] = React.useState<string | null>(null);\n    const [internalRowIndex, setInternalRowIndex] = React.useState<number | null>(null);\n    const [isFiltersReset, setIsFiltersReset] = React.useState(false);\n    const columns = table.getAllFlatColumns();\n    const column = columns.find(column => column.id === rowIdentifier);\n    const rowIdentifierHeader = column?.columnDef.meta?.header;\n\n    // Find and focus first invalid cell\n    const navigateToFirstInvalidCell = () => {\n        const firstInvalidCell = tableRef.current?.querySelector(\n            '[role=\"row\"][data-current=\"true\"] [role=\"cell\"][data-invalid=\"true\"]'\n        );\n        const firstInvalidElement = firstInvalidCell?.querySelector(focusableSelector);\n\n        if (firstInvalidElement) {\n            (firstInvalidElement as HTMLElement)?.focus();\n            lastCellIndex.value = firstInvalidCell?.getAttribute('data-column-index');\n        }\n    };\n\n    // Navigate to row and focus first invalid cell\n    const navigateToRow = rowIndex => {\n        tableMeta.rowActive.setRowActiveIndex(rowIndex);\n        scrollToIndex(rowIndex, { align: 'center' });\n        lastCellIndex.value = undefined;\n\n        // Need to request animation frame here, because newly selected row is not rendered yet.\n        requestAnimationFrame(() => {\n            navigateToFirstInvalidCell();\n        });\n    };\n\n    // When internal row index is changed after click on row link, we should navigate to the row.\n    React.useEffect(() => {\n        if (internalRowIndex !== null && internalRowIndex >= 0) {\n            navigateToRow(internalRowIndex);\n        }\n    }, [internalRowIndex]);\n\n    // When filters are reset, we're able to get the real row index by rowId\n    React.useEffect(() => {\n        if (isFiltersReset) {\n            const rowIndex = rows.findIndex(row => row.id === internalRowId);\n            if (rowIndex === -1) {\n                return;\n            }\n            setInternalRowIndex(rowIndex);\n        }\n    }, [isFiltersReset]);\n\n    const onRowNumberClick = React.useCallback(\n        (rowId: string) => {\n            // When row is hidden due filtering it will not be present in rows (but it still will be present in coreRows)\n            const foundIndex = rows.findIndex(row => row.id === rowId);\n            if (foundIndex === -1) {\n                setIsFiltersReset(false);\n                setResetFiltersConfirmationOpen(true);\n\n                // Since row indexes changed due filtering, we need to save row id, so that we can find it when filters will be reset\n                setInternalRowId(rowId);\n                return;\n            }\n\n            // In cases when user clicked on a row link multiple times we still need to navigate to the row, and focus the cell,\n            // because row/cell will loose focus on next click, but row index will not change.\n            if (foundIndex === internalRowIndex) {\n                navigateToRow(foundIndex);\n            } else {\n                setInternalRowIndex(foundIndex);\n            }\n        },\n        [rows, internalRowIndex]\n    );\n\n    const onResetFiltersConfirm = () => {\n        setIsFiltersReset(true);\n    };\n\n    // Getting the row from core rows (ignoring search and filtering)\n    const getCoreRow = React.useCallback((rowId: string) => coreRows.find(coreRow => coreRow.id === rowId), [coreRows]);\n\n    return (\n        <div className=\"mb-4 empty:hidden\">\n            {errorsRowIds.length ? (\n                <Alert state=\"error\" className=\"mb-1\">\n                    <>\n                        <b>\n                            {errorsRowIds.length} {texts.table3.validation.alert.unsavedEntries(errorsRowIds.length)}\n                        </b>{' '}\n                    </>\n                    {rowIdentifierHeader || texts.table3.validation.index}{' '}\n                    {errorsRowIds.map((rowId: string, index) => {\n                        const coreRow = getCoreRow(rowId);\n                        return (\n                            <>\n                                <Button\n                                    key={rowId}\n                                    className=\"!min-h-[theme(spacing.2)] !min-w-[theme(spacing.2)] !px-1\"\n                                    appearance=\"discrete\"\n                                    onClick={() => {\n                                        onRowNumberClick(rowId);\n                                    }}>\n                                    {/* Getting row from core rows, because 'table.getRow' will fail if row is hidden due filtering */}\n                                    {rowIdentifier ? coreRow?.original[rowIdentifier] : coreRow?.index}\n                                </Button>\n                                <span key={`${rowId}_comma`}>{index < errorsRowIds.length - 1 ? ',' : ''}</span>\n                            </>\n                        );\n                    })}\n                    {texts.table3.validation.alert.incompleteAndHavntBeenSaved(errorsRowIds.length)}\n                </Alert>\n            ) : null}\n            <FilterResetDialog\n                open={resetFiltersConfirmationOpen}\n                onClose={() => {\n                    setResetFiltersConfirmationOpen(false);\n                }}\n                onConfirm={onResetFiltersConfirm}\n                table={table}\n            />\n        </div>\n    );\n}\n\ntype FilterResetDialogProps<TType = unknown> = {\n    open: boolean;\n    onClose: () => void;\n    onConfirm: () => void;\n    table: RTable<TType>;\n};\nfunction FilterResetDialog<TType = unknown>(props: FilterResetDialogProps<TType>) {\n    const { open, onClose, onConfirm, table } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const { texts } = useLocalization();\n\n    const resetFilters = React.useCallback(() => {\n        tableMeta.search.setQuery('');\n        table.resetGlobalFilter();\n        table.resetColumnFilters();\n    }, [table, tableMeta.search]);\n\n    const handleConfirmClick = () => {\n        resetFilters();\n        onConfirm();\n        onClose();\n    };\n\n    return (\n        <Dialog open={open} onClose={onClose} size=\"xs\">\n            <Dialog.Content aria-label=\"Create a new account\">\n                <Dialog.Title>{texts.table3.validation.resetFiltersDialog.title}</Dialog.Title>\n\n                <p>{texts.table3.validation.resetFiltersDialog.description}</p>\n\n                <Dialog.Footer>\n                    <Group>\n                        <Dialog.Close>\n                            <Button>{texts.table3.validation.resetFiltersDialog.cancel}</Button>\n                        </Dialog.Close>\n                        <Button appearance=\"primary\" onClick={handleConfirmClick}>\n                            {texts.table3.validation.resetFiltersDialog.confirm}\n                        </Button>\n                    </Group>\n                </Dialog.Footer>\n            </Dialog.Content>\n        </Dialog>\n    );\n}\n"],"names":["ErrorAlert","props","table","tableRef","scrollToIndex","rowIdentifier","tableMeta","options","meta","errors","validation","errorsRowIds","Object","keys","rows","getRowModel","coreRows","getCoreRowModel","texts","useLocalization","resetFiltersConfirmationOpen","setResetFiltersConfirmationOpen","React","useState","internalRowId","setInternalRowId","internalRowIndex","setInternalRowIndex","isFiltersReset","setIsFiltersReset","columns","getAllFlatColumns","column","find","id","rowIdentifierHeader","_column$columnDef$met","columnDef","header","navigateToFirstInvalidCell","firstInvalidCell","_tableRef$current","current","querySelector","firstInvalidElement","focusableSelector","focus","lastCellIndex","value","getAttribute","navigateToRow","rowIndex","rowActive","setRowActiveIndex","align","undefined","requestAnimationFrame","useEffect","findIndex","row","onRowNumberClick","useCallback","rowId","foundIndex","onResetFiltersConfirm","getCoreRow","coreRow","className","length","Alert","state","table3","alert","unsavedEntries","index","map","Button","key","appearance","onClick","original","incompleteAndHavntBeenSaved","FilterResetDialog","open","onClose","onConfirm","resetFilters","search","setQuery","resetGlobalFilter","resetColumnFilters","handleConfirmClick","Dialog","size","Content","Title","resetFiltersDialog","title","description","Footer","Group","Close","cancel","confirm"],"mappings":"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"}

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

@@ -1,6 +1,7 @@
 import React__default from 'react';
-import { useRowContext, RowContext } from '../../rows/RowContext.js';
+import { useRowContext } from '../../rows/RowContext.js';
 import { DisplayCell } from './DisplayCell.js';
+import { isIndicatorVisible, getIndicatorCellClassName } from './Indicator.js';
 import { isCellHighlighted } from '../../../util/columns.js';
 import { EditingCell } from './EditingCell.js';
 
@@ -16,7 +17,8 @@ function Cell(props) {
   } = props;
   const {
     isHovered: isHoveredRow,
-    hasError
+    hasError,
+    rowIndex
   } = useRowContext();
   const rows = table.getRowModel().rows;
   const tableMeta = table.options.meta;
@@ -26,15 +28,15 @@ function Cell(props) {
   const rowActiveIndex = tableMeta.rowActive.rowActiveIndex;
   const isActiveRow = rowActiveIndex !== undefined && ((_rows$rowActiveIndex = rows[rowActiveIndex]) === null || _rows$rowActiveIndex === void 0 ? void 0 : _rows$rowActiveIndex.id) === row.id;
   let value = getValue();
+  const allVisibleColumns = table.getVisibleLeafColumns();
+  const lastColumnIndex = allVisibleColumns.length > 0 ? allVisibleColumns.length - 1 : 0;
+  const className = isIndicatorVisible(rowIndex, rowActiveIndex, tableMeta.editing.rowMoveReason) ? getIndicatorCellClassName(index, lastColumnIndex) : undefined;
   // When row has changes we always need to show the editing state value, end revert it to original value only when row got saved successfully.
   // Otherwise it might confuse user because it will look like display value is getting reverted everytime user leaves the row.
   if (tableMeta.editing.isEditing) {
     const editingValue = tableMeta.editing.getCellValue(cell);
     value = editingValue !== null && editingValue !== void 0 ? editingValue : value;
   }
-  const {
-    rowIndex
-  } = React__default.useContext(RowContext);
   const memoedHighlight = React__default.useMemo(() => {
     var _tableMeta$search$que;
     if (!tableMeta.search.isHighlightingEnabled || !columnMeta.enableSearch) {
@@ -62,10 +64,13 @@ function Cell(props) {
   if (tableMeta.editing.isEditing && columnMeta.control && (isActiveRow || isHoveredRow && !tableMeta.rowActive.isHoverStatePaused ||
   // When cell has error, we renderimg it in edit mode (UX reqirement)
   isColumnError)) {
-    return /*#__PURE__*/React__default.createElement(EditingCell, Object.assign({}, props, highlightProps));
+    return /*#__PURE__*/React__default.createElement(EditingCell, Object.assign({}, props, highlightProps, {
+      className: className
+    }));
   }
   return /*#__PURE__*/React__default.createElement(DisplayCell, Object.assign({}, props, highlightProps, {
-    value: value
+    value: value,
+    className: className
   }));
 }
 

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

@@ -1 +1 @@
-{"version":3,"file":"Cell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, ColumnMeta, TableMeta } from '@tanstack/react-table';\nimport { DisplayCell } from './DisplayCell';\nimport { EditingCell } from './EditingCell';\nimport { RowContext, useRowContext } from '../../rows/RowContext';\nimport { isCellHighlighted } from '../../../util/columns';\n\nexport type CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    children?: string | JSX.Element;\n};\n\nexport function Cell<TType = unknown>(props: CellProps<TType>) {\n    const { column, row, table, index, getValue, cell } = props;\n    const { isHovered: isHoveredRow, hasError } = useRowContext();\n    const rows = table.getRowModel().rows;\n    const tableMeta = table.options.meta as TableMeta<unknown>;\n    const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n    const rowErrors = tableMeta.validation.errors ? tableMeta.validation.errors[row.id] : null;\n    const isColumnError = hasError && rowErrors && !!rowErrors[column.id];\n\n    const rowActiveIndex = tableMeta.rowActive.rowActiveIndex;\n    const isActiveRow = rowActiveIndex !== undefined && rows[rowActiveIndex]?.id === row.id;\n    let value = getValue();\n\n    // When row has changes we always need to show the editing state value, end revert it to original value only when row got saved successfully.\n    // Otherwise it might confuse user because it will look like display value is getting reverted everytime user leaves the row.\n    if (tableMeta.editing.isEditing) {\n        const editingValue = tableMeta.editing.getCellValue(cell);\n        value = editingValue ?? value;\n    }\n\n    const { rowIndex } = React.useContext(RowContext);\n\n    const memoedHighlight = React.useMemo(() => {\n        if (!tableMeta.search.isHighlightingEnabled || !columnMeta.enableSearch) {\n            return false;\n        }\n\n        if (tableMeta.search.query?.length) {\n            return isCellHighlighted(tableMeta.search.query, value, columnMeta.dataType);\n        }\n\n        return false;\n    }, [value, tableMeta.search.isHighlightingEnabled, tableMeta.search.excludeUnmatchedResults, tableMeta.search.query]);\n\n    const memoedHighlightCurrent = React.useMemo(() => {\n        if (\n            !tableMeta.search.isHighlightingEnabled ||\n            !memoedHighlight ||\n            tableMeta.search.currentHighlightColumnIndex === undefined\n        ) {\n            return false;\n        }\n\n        const [rowActiveIndex, currentColumnIndex] =\n            tableMeta.search.highlightedColumnIndexes[tableMeta.search.currentHighlightColumnIndex];\n\n        if (rowActiveIndex === rowIndex && currentColumnIndex === index) {\n            return true;\n        }\n\n        return false;\n    }, [memoedHighlight, tableMeta.search.highlightedColumnIndexes.length, tableMeta.search.currentHighlightColumnIndex]);\n\n    const highlightProps = {\n        highlighted: memoedHighlight,\n        highlightedAsCurrent: memoedHighlightCurrent,\n    };\n\n    if (\n        tableMeta.editing.isEditing &&\n        columnMeta.control &&\n        (isActiveRow ||\n            (isHoveredRow && !tableMeta.rowActive.isHoverStatePaused) ||\n            // When cell has error, we renderimg it in edit mode (UX reqirement)\n            isColumnError)\n    ) {\n        return <EditingCell {...props} {...highlightProps} />;\n    }\n\n    return <DisplayCell {...props} {...highlightProps} value={value} />;\n}\n"],"names":["Cell","props","column","row","table","index","getValue","cell","isHovered","isHoveredRow","hasError","useRowContext","rows","getRowModel","tableMeta","options","meta","columnMeta","columnDef","rowErrors","validation","errors","id","isColumnError","rowActiveIndex","rowActive","isActiveRow","undefined","_rows$rowActiveIndex","value","editing","isEditing","editingValue","getCellValue","rowIndex","React","useContext","RowContext","memoedHighlight","useMemo","search","isHighlightingEnabled","enableSearch","_tableMeta$search$que","query","length","isCellHighlighted","dataType","excludeUnmatchedResults","memoedHighlightCurrent","currentHighlightColumnIndex","currentColumnIndex","highlightedColumnIndexes","highlightProps","highlighted","highlightedAsCurrent","control","isHoverStatePaused","EditingCell","DisplayCell"],"mappings":"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"}
+{"version":3,"file":"Cell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, ColumnMeta, TableMeta } from '@tanstack/react-table';\nimport { DisplayCell } from './DisplayCell';\nimport { EditingCell } from './EditingCell';\nimport { useRowContext } from '../../rows/RowContext';\nimport { isCellHighlighted } from '../../../util/columns';\nimport { getIndicatorCellClassName, isIndicatorVisible } from './Indicator';\n\nexport type CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    children?: string | JSX.Element;\n};\n\nexport function Cell<TType = unknown>(props: CellProps<TType>) {\n    const { column, row, table, index, getValue, cell } = props;\n    const { isHovered: isHoveredRow, hasError, rowIndex } = useRowContext();\n    const rows = table.getRowModel().rows;\n    const tableMeta = table.options.meta as TableMeta<unknown>;\n    const columnMeta = column.columnDef.meta as ColumnMeta<TType, unknown>;\n    const rowErrors = tableMeta.validation.errors ? tableMeta.validation.errors[row.id] : null;\n    const isColumnError = hasError && rowErrors && !!rowErrors[column.id];\n\n    const rowActiveIndex = tableMeta.rowActive.rowActiveIndex;\n    const isActiveRow = rowActiveIndex !== undefined && rows[rowActiveIndex]?.id === row.id;\n    let value = getValue();\n\n    const allVisibleColumns = table.getVisibleLeafColumns();\n    const lastColumnIndex = allVisibleColumns.length > 0 ? allVisibleColumns.length - 1 : 0;\n    const className = isIndicatorVisible(rowIndex, rowActiveIndex, tableMeta.editing.rowMoveReason)\n        ? getIndicatorCellClassName(index, lastColumnIndex)\n        : undefined;\n\n    // When row has changes we always need to show the editing state value, end revert it to original value only when row got saved successfully.\n    // Otherwise it might confuse user because it will look like display value is getting reverted everytime user leaves the row.\n    if (tableMeta.editing.isEditing) {\n        const editingValue = tableMeta.editing.getCellValue(cell);\n        value = editingValue ?? value;\n    }\n\n    const memoedHighlight = React.useMemo(() => {\n        if (!tableMeta.search.isHighlightingEnabled || !columnMeta.enableSearch) {\n            return false;\n        }\n\n        if (tableMeta.search.query?.length) {\n            return isCellHighlighted(tableMeta.search.query, value, columnMeta.dataType);\n        }\n\n        return false;\n    }, [value, tableMeta.search.isHighlightingEnabled, tableMeta.search.excludeUnmatchedResults, tableMeta.search.query]);\n\n    const memoedHighlightCurrent = React.useMemo(() => {\n        if (\n            !tableMeta.search.isHighlightingEnabled ||\n            !memoedHighlight ||\n            tableMeta.search.currentHighlightColumnIndex === undefined\n        ) {\n            return false;\n        }\n\n        const [rowActiveIndex, currentColumnIndex] =\n            tableMeta.search.highlightedColumnIndexes[tableMeta.search.currentHighlightColumnIndex];\n\n        if (rowActiveIndex === rowIndex && currentColumnIndex === index) {\n            return true;\n        }\n\n        return false;\n    }, [memoedHighlight, tableMeta.search.highlightedColumnIndexes.length, tableMeta.search.currentHighlightColumnIndex]);\n\n    const highlightProps = {\n        highlighted: memoedHighlight,\n        highlightedAsCurrent: memoedHighlightCurrent,\n    };\n\n    if (\n        tableMeta.editing.isEditing &&\n        columnMeta.control &&\n        (isActiveRow ||\n            (isHoveredRow && !tableMeta.rowActive.isHoverStatePaused) ||\n            // When cell has error, we renderimg it in edit mode (UX reqirement)\n            isColumnError)\n    ) {\n        return <EditingCell {...props} {...highlightProps} className={className} />;\n    }\n\n    return <DisplayCell {...props} {...highlightProps} value={value} className={className} />;\n}\n"],"names":["Cell","props","column","row","table","index","getValue","cell","isHovered","isHoveredRow","hasError","rowIndex","useRowContext","rows","getRowModel","tableMeta","options","meta","columnMeta","columnDef","rowErrors","validation","errors","id","isColumnError","rowActiveIndex","rowActive","isActiveRow","undefined","_rows$rowActiveIndex","value","allVisibleColumns","getVisibleLeafColumns","lastColumnIndex","length","className","isIndicatorVisible","editing","rowMoveReason","getIndicatorCellClassName","isEditing","editingValue","getCellValue","memoedHighlight","React","useMemo","search","isHighlightingEnabled","enableSearch","_tableMeta$search$que","query","isCellHighlighted","dataType","excludeUnmatchedResults","memoedHighlightCurrent","currentHighlightColumnIndex","currentColumnIndex","highlightedColumnIndexes","highlightProps","highlighted","highlightedAsCurrent","control","isHoverStatePaused","EditingCell","DisplayCell"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/DisplayCell.js

@@ -33,7 +33,7 @@ function DisplayCell(props) {
       index,
       tableRef
     };
-  }, [row.original, props.children, value, tableMeta.columnFreezing.frozenColumnIndex]);
+  }, [row.original, props.children, value, tableMeta.columnFreezing.frozenColumnIndex, className]);
   return /*#__PURE__*/React__default.createElement(MemoedDisplayCell, Object.assign({}, memoedProps, {
     highlighted: highlighted,
     highlightedAsCurrent: highlightedAsCurrent

package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/DisplayCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"DisplayCell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/DisplayCell.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { ColumnMeta, CellContext, TableMeta } from '@tanstack/react-table';\nimport { Table3ColumnAlignment } from '../../../types';\nimport { Highlight } from './Highlight';\n\nexport type DisplayCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    highlighted?: boolean;\n    highlightedAsCurrent?: boolean;\n    children?: string | JSX.Element;\n    className?: string;\n    value?: any;\n};\n\nexport function DisplayCell<TType = unknown>(props: DisplayCellProps<TType>) {\n    const { cell, className, column, value, index, row, table, tableRef, highlighted, highlightedAsCurrent } = props;\n    const columnMeta = React.useMemo(() => column.columnDef.meta as ColumnMeta<TType, unknown>, []);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    // cells are heavily memoized because performance in our table is critical\n    // be careful and selective about props that you pass to the cell\n    const memoedProps = React.useMemo(() => {\n        return {\n            align: columnMeta.align,\n            children: (props.children ?? columnMeta.renderer?.(value, row.original) ?? value ?? null) as\n                | JSX.Element\n                | string\n                | null,\n            className: cn(\n                className,\n                typeof columnMeta.className === 'function' ? columnMeta.className(row.original) : columnMeta.className\n            ),\n            data: row.original,\n            debug: table.options.debugAll,\n            enableTruncate: columnMeta.enableTruncate,\n            frozenColumnIndex: tableMeta.columnFreezing.frozenColumnIndex,\n            id: cell.id,\n            index,\n            tableRef,\n        };\n    }, [row.original, props.children, value, tableMeta.columnFreezing.frozenColumnIndex]);\n\n    return <MemoedDisplayCell<TType> {...memoedProps} highlighted={highlighted} highlightedAsCurrent={highlightedAsCurrent} />;\n}\n\n// Memoization\nexport type MemoedDisplayCellProps<TType = unknown> = {\n    align?: Table3ColumnAlignment;\n    children: JSX.Element | string | null;\n    className?: string;\n    data: TType;\n    debug?: boolean;\n    enableTruncate?: boolean;\n    frozenColumnIndex?: number;\n    highlighted?: boolean;\n    highlightedAsCurrent?: boolean;\n    id: string;\n    index: number;\n    tableRef: React.RefObject<HTMLDivElement>;\n};\n\nconst MemoedDisplayCell = React.memo(function MemoedDisplayCell<TType = unknown>(props: MemoedDisplayCellProps<TType>) {\n    const {\n        align = 'left',\n        children,\n        className: customClassName,\n        debug,\n        enableTruncate,\n        frozenColumnIndex,\n        highlighted,\n        highlightedAsCurrent = false,\n        id,\n        index,\n        tableRef,\n    } = props;\n\n    const layoutClassName = cn(\n        'py-[var(--table3-cell-padding-y)] px-[var(--table3-cell-padding-x)] focus:outline-none break-word hyphens-auto',\n        customClassName\n    );\n\n    const className = highlighted ? undefined : layoutClassName;\n    const content = enableTruncate ? <span className=\"truncate\">{children}</span> : children;\n\n    if (debug) {\n        console.log('cell render', id);\n    }\n\n    return (\n        <div\n            className={className}\n            data-align={align}\n            data-column-index={index}\n            data-highlighted={highlighted}\n            role=\"cell\"\n            // cells must be focusable (but not included in tabbing - hence -1)\n            tabIndex={-1}>\n            {highlighted ? (\n                <Highlight\n                    className={layoutClassName}\n                    current={highlightedAsCurrent}\n                    frozenColumnIndex={frozenColumnIndex}\n                    index={index}\n                    tableRef={tableRef}>\n                    {content}\n                </Highlight>\n            ) : (\n                content\n            )}\n        </div>\n    );\n}) as <TType = unknown>(props: MemoedDisplayCellProps<TType>) => JSX.Element;\n"],"names":["DisplayCell","props","cell","className","column","value","index","row","table","tableRef","highlighted","highlightedAsCurrent","columnMeta","React","useMemo","columnDef","meta","tableMeta","options","memoedProps","align","children","_ref","_ref2","_props$children","_columnMeta$renderer","renderer","call","original","cn","data","debug","debugAll","enableTruncate","frozenColumnIndex","columnFreezing","id","MemoedDisplayCell","memo","customClassName","layoutClassName","undefined","content","console","log","role","tabIndex","Highlight","current"],"mappings":"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"}
+{"version":3,"file":"DisplayCell.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/cell/DisplayCell.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { ColumnMeta, CellContext, TableMeta } from '@tanstack/react-table';\nimport { Table3ColumnAlignment } from '../../../types';\nimport { Highlight } from './Highlight';\n\nexport type DisplayCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    highlighted?: boolean;\n    highlightedAsCurrent?: boolean;\n    children?: string | JSX.Element;\n    className?: string;\n    value?: any;\n};\n\nexport function DisplayCell<TType = unknown>(props: DisplayCellProps<TType>) {\n    const { cell, className, column, value, index, row, table, tableRef, highlighted, highlightedAsCurrent } = props;\n    const columnMeta = React.useMemo(() => column.columnDef.meta as ColumnMeta<TType, unknown>, []);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    // cells are heavily memoized because performance in our table is critical\n    // be careful and selective about props that you pass to the cell\n    const memoedProps = React.useMemo(() => {\n        return {\n            align: columnMeta.align,\n            children: (props.children ?? columnMeta.renderer?.(value, row.original) ?? value ?? null) as\n                | JSX.Element\n                | string\n                | null,\n            className: cn(\n                className,\n                typeof columnMeta.className === 'function' ? columnMeta.className(row.original) : columnMeta.className\n            ),\n            data: row.original,\n            debug: table.options.debugAll,\n            enableTruncate: columnMeta.enableTruncate,\n            frozenColumnIndex: tableMeta.columnFreezing.frozenColumnIndex,\n            id: cell.id,\n            index,\n            tableRef,\n        };\n    }, [row.original, props.children, value, tableMeta.columnFreezing.frozenColumnIndex, className]);\n\n    return <MemoedDisplayCell<TType> {...memoedProps} highlighted={highlighted} highlightedAsCurrent={highlightedAsCurrent} />;\n}\n\n// Memoization\nexport type MemoedDisplayCellProps<TType = unknown> = {\n    align?: Table3ColumnAlignment;\n    children: JSX.Element | string | null;\n    className?: string;\n    data: TType;\n    debug?: boolean;\n    enableTruncate?: boolean;\n    frozenColumnIndex?: number;\n    highlighted?: boolean;\n    highlightedAsCurrent?: boolean;\n    id: string;\n    index: number;\n    tableRef: React.RefObject<HTMLDivElement>;\n};\n\nconst MemoedDisplayCell = React.memo(function MemoedDisplayCell<TType = unknown>(props: MemoedDisplayCellProps<TType>) {\n    const {\n        align = 'left',\n        children,\n        className: customClassName,\n        debug,\n        enableTruncate,\n        frozenColumnIndex,\n        highlighted,\n        highlightedAsCurrent = false,\n        id,\n        index,\n        tableRef,\n    } = props;\n\n    const layoutClassName = cn(\n        'py-[var(--table3-cell-padding-y)] px-[var(--table3-cell-padding-x)] focus:outline-none break-word hyphens-auto',\n        customClassName\n    );\n\n    const className = highlighted ? undefined : layoutClassName;\n    const content = enableTruncate ? <span className=\"truncate\">{children}</span> : children;\n\n    if (debug) {\n        console.log('cell render', id);\n    }\n\n    return (\n        <div\n            className={className}\n            data-align={align}\n            data-column-index={index}\n            data-highlighted={highlighted}\n            role=\"cell\"\n            // cells must be focusable (but not included in tabbing - hence -1)\n            tabIndex={-1}>\n            {highlighted ? (\n                <Highlight\n                    className={layoutClassName}\n                    current={highlightedAsCurrent}\n                    frozenColumnIndex={frozenColumnIndex}\n                    index={index}\n                    tableRef={tableRef}>\n                    {content}\n                </Highlight>\n            ) : (\n                content\n            )}\n        </div>\n    );\n}) as <TType = unknown>(props: MemoedDisplayCellProps<TType>) => JSX.Element;\n"],"names":["DisplayCell","props","cell","className","column","value","index","row","table","tableRef","highlighted","highlightedAsCurrent","columnMeta","React","useMemo","columnDef","meta","tableMeta","options","memoedProps","align","children","_ref","_ref2","_props$children","_columnMeta$renderer","renderer","call","original","cn","data","debug","debugAll","enableTruncate","frozenColumnIndex","columnFreezing","id","MemoedDisplayCell","memo","customClassName","layoutClassName","undefined","content","console","log","role","tabIndex","Highlight","current"],"mappings":"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"}

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

@@ -3,9 +3,9 @@ import cn from 'classnames';
 import { Field } from '../../../../Field/Field.js';
 import { useRowContext, RowContext } from '../../rows/RowContext.js';
 import { Highlight } from './Highlight.js';
+import { Indicator, IndicatorReason } from './Indicator.js';
 import { getCurrentRowCellElement } from '../../../util/columns.js';
 import { globalFilterFn, columnFilterFn } from '../../../util/filtering.js';
-import { Indicator, IndicatorReason } from './Indicator.js';
 import { hasChanged, willRowMoveAfterSorting } from '../../../util/editing.js';
 import { EDITING_ACTIONS_WIDTH } from '../internal/EditingActions.js';
 import { EditingControl } from './EditingControl.js';
@@ -103,7 +103,10 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
   React__default.useEffect(() => {
     // To avoid reseting move reason on another row hover,
     // we need to check for changes only if value got changed in the current row.
-    if (!isActiveRow || error) {
+    if (!isActiveRow) {
+      return;
+    }
+    if (error) {
       if (tableMeta.editing.rowMoveReason) {
         removeMoveReason();
       }
@@ -113,9 +116,11 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
       const moveReason = getRowMoveReason(table, rowIndex,
       // cannot use row.index, as this is not kept in sync once a column is sorted.
       row.original, cell, value, tableMeta.search.excludeUnmatchedResults);
-      tableMeta.editing.setRowMoveReason({
-        [cell.column.id]: moveReason
-      });
+      if (moveReason) {
+        tableMeta.editing.setRowMoveReason({
+          [cell.column.id]: moveReason
+        });
+      }
     } else {
       removeMoveReason();
     }
@@ -125,7 +130,7 @@ const MemoedEditingCell = /*#__PURE__*/React__default.memo(function MemoedEditin
   const className = cn('py-[calc(var(--table3-cell-padding-y)_-_0.06rem)]', {
     // Textarea control is positioned absolute, when column is in enableTruncate mode, so the cell need to be positioned relative
     relative: controlRenderer === 'textarea' && columnMeta.enableTruncate
-  }, typeof columnMeta.className === 'function' ? columnMeta.className(row.original) : columnMeta.className);
+  }, props.className, typeof columnMeta.className === 'function' ? columnMeta.className(row.original) : columnMeta.className);
   const fieldClassName = cn('!min-h-0 w-full !pb-0', {
     '!pb-3': !!error
   });