@economic/taco 2.15.0 → 2.16.0

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/EditingActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditingActions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/EditingActions.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { CellContext, TableMeta, DisplayColumnDef } from '@tanstack/react-table';\nimport { Spinner } from '../../../../Spinner/Spinner';\nimport { SavingStateValue } from '../../../hooks/features/useEditing';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu } from '../../../../Menu/Menu';\nimport { RowContext } from '../../rows/RowContext';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { Footer } from '../footer/Footer';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport useTimer from '../../../../../utils/hooks/useTimer';\nimport { Icon } from '../../../../Icon/Icon';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\n\nexport type EditingActionsProps<TType = unknown> = CellContext<TType, unknown> & {\n    className?: string;\n    isHovered: boolean;\n};\n\nconst savingIndicatorHideDelay = 3000;\n\nexport const COLUMN_ID = '__editing_actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    hasChanges: boolean;\n    isCurrentRow: boolean;\n    isEditing: boolean;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { hasChanges, isCurrentRow, isEditing, row, table } = props;\n\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const savingState = tableMeta.editing.savingStates && tableMeta.editing.savingStates[row.id];\n    const [isSavedIndicatorVisible, setIsSavingIndicatorVisible] = React.useState(false);\n    const { texts } = useLocalization();\n\n    const handleSaved = () => {\n        setIsSavingIndicatorVisible(false);\n        tableMeta.editing.removeSavingState(row.id);\n    };\n    const timer = useTimer(savingIndicatorHideDelay, handleSaved);\n\n    React.useEffect(() => {\n        if (savingState && savingState.state === SavingStateValue.Saved && !isSavedIndicatorVisible) {\n            setIsSavingIndicatorVisible(true);\n            timer.start();\n        }\n    }, [savingState]);\n\n    let content;\n\n    if (savingState) {\n        if (savingState.state === SavingStateValue.Saving) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.progress}>\n                    <Spinner delay={0} className=\"!text-grey-700 mr-1 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        } else if (isSavedIndicatorVisible) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.complete}>\n                    <Icon name=\"tick\" className=\"!text-grey-700 mr-1 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        }\n    }\n\n    if (isEditing && isCurrentRow) {\n        content = (\n            <>\n                {content}\n                <IconButton\n                    appearance=\"transparent\"\n                    aria-label={texts.table3.editing.actions.tooltip}\n                    icon=\"more\"\n                    menu={menuProps => (\n                        <Menu {...menuProps}>\n                            <Menu.Content>\n                                <Menu.Item\n                                    icon=\"tick\"\n                                    disabled={!hasChanges}\n                                    onClick={() => tableMeta.editing.saveChangesIfNeeded()}>\n                                    {texts.table3.editing.actions.save}\n                                </Menu.Item>\n                                <Menu.Item\n                                    icon=\"close\"\n                                    disabled={!hasChanges}\n                                    onClick={() => tableMeta.editing.resetChange(row.id)}>\n                                    {texts.table3.editing.actions.clear}\n                                </Menu.Item>\n                                <Menu.Item icon=\"undo\" onClick={() => tableMeta.editing.toggleEditing(false)}>\n                                    {texts.table3.editing.actions.exit}\n                                </Menu.Item>\n                            </Menu.Content>\n                        </Menu>\n                    )}\n                    tabIndex={isCurrentRow ? 0 : -1}\n                />\n            </>\n        );\n    }\n\n    const contentClassName = cn('flex items-center justify-end text-right', { '-mb-2 -mt-2': isCurrentRow });\n    return (\n        <DisplayCell {...props} className={cn({ '!sticky': !!content })}>\n            {content ? <span className={contentClassName}>{content}</span> : undefined}\n        </DisplayCell>\n    );\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {};\n\nfunction Cell<TType = unknown>(props: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n    const changeset = tableMeta.editing.changes ? Object.keys(tableMeta.editing.changes) : [];\n\n    return (\n        <MemoedCell\n            {...props}\n            hasChanges={changeset.indexOf(props.row.id) >= 0}\n            isCurrentRow={tableMeta.currentRow.currentRowIndex === rowIndex}\n            isEditing={tableMeta.editing.isEditing}\n        />\n    );\n}\n\nexport const EDITING_ACTIONS_WIDTH = 60;\n\nexport function createRowEditingActionsColumn<TType = unknown>(): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: Cell,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                'items-center print:opacity-0 [[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:sticky right-0 !pl-0 !pr-1',\n                '[[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: EDITING_ACTIONS_WIDTH,\n        minSize: EDITING_ACTIONS_WIDTH,\n    };\n}\n"],"names":["savingIndicatorHideDelay","COLUMN_ID","MemoedCell","React","memo","props","hasChanges","isCurrentRow","isEditing","row","table","tableMeta","options","meta","savingState","editing","savingStates","id","isSavedIndicatorVisible","setIsSavingIndicatorVisible","useState","texts","useLocalization","handleSaved","removeSavingState","timer","useTimer","useEffect","state","SavingStateValue","Saved","start","content","Saving","Tooltip","title","table3","saving","progress","Spinner","delay","className","complete","Icon","name","IconButton","appearance","actions","tooltip","icon","menu","menuProps","Menu","Content","Item","disabled","onClick","saveChangesIfNeeded","save","resetChange","clear","toggleEditing","exit","tabIndex","contentClassName","cn","DisplayCell","undefined","Cell","rowIndex","useContext","RowContext","changeset","changes","Object","keys","indexOf","currentRow","currentRowIndex","EDITING_ACTIONS_WIDTH","createRowEditingActionsColumn","header","ColumnHeader","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","size","minSize"],"mappings":"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"}
+{"version":3,"file":"EditingActions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/EditingActions.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { CellContext, TableMeta, DisplayColumnDef } from '@tanstack/react-table';\nimport { Spinner } from '../../../../Spinner/Spinner';\nimport { SavingStatusValue, useEditing } from '../../../hooks/features/useEditing';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu } from '../../../../Menu/Menu';\nimport { RowContext } from '../../rows/RowContext';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { Footer } from '../footer/Footer';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport useTimer from '../../../../../utils/hooks/useTimer';\nimport { Icon } from '../../../../Icon/Icon';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { Dialog } from '../../../../Dialog/Dialog';\nimport { Group } from '../../../../Group/Group';\nimport { Button } from '../../../../Button/Button';\nimport { lastCellIndex } from '../../rows/Row';\nimport { getColumnIndex } from '../../../util/editing';\n\nexport type EditingActionsProps<TType = unknown> = CellContext<TType, unknown> & {\n    className?: string;\n    isHovered: boolean;\n};\n\nconst savingIndicatorHideDelay = 3000;\n\nexport const COLUMN_ID = '__editing_actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    hasChanges: boolean;\n    isCurrentRow: boolean;\n    editing: ReturnType<typeof useEditing>;\n    rowIdentifier?: string;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { hasChanges, isCurrentRow, row, editing, rowIdentifier, table } = props;\n\n    const savingStatus = editing.getSavingStatus(row.id);\n    const [isSavedIndicatorVisible, setIsSavingIndicatorVisible] = React.useState(false);\n    const { texts } = useLocalization();\n    const [clearConfirmationOpen, setClearConfirmationOpen] = 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    const edititngActionsRef = React.useRef<HTMLButtonElement | HTMLAnchorElement>(null);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    const handleSaved = () => {\n        setIsSavingIndicatorVisible(false);\n        editing.resetSavingStatus(row.id);\n    };\n    const timer = useTimer(savingIndicatorHideDelay, handleSaved);\n\n    React.useEffect(() => {\n        if (savingStatus && savingStatus === SavingStatusValue.Saved && !isSavedIndicatorVisible) {\n            setIsSavingIndicatorVisible(true);\n            timer.start();\n        }\n    }, [savingStatus]);\n\n    React.useEffect(() => {\n        tableMeta.shortcutsState.pause(clearConfirmationOpen);\n    }, [clearConfirmationOpen]);\n\n    let content;\n\n    if (savingStatus) {\n        if (savingStatus === SavingStatusValue.Saving) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.progress}>\n                    <Spinner delay={0} className=\"!text-grey-700 mr-1 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        } else if (isSavedIndicatorVisible) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.complete}>\n                    <Icon name=\"tick\" className=\"!text-grey-700 mr-1 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        }\n    }\n\n    if (editing.isEditing && isCurrentRow) {\n        content = (\n            <>\n                {content}\n                <IconButton\n                    ref={edititngActionsRef}\n                    appearance=\"transparent\"\n                    aria-label={texts.table3.editing.actions.tooltip}\n                    icon=\"more\"\n                    menu={menuProps => (\n                        <Menu {...menuProps}>\n                            <Menu.Content>\n                                <Menu.Item\n                                    icon=\"tick\"\n                                    disabled={!hasChanges}\n                                    onClick={() => editing.saveChangesIfNeeded()}>\n                                    {texts.table3.editing.actions.save}\n                                </Menu.Item>\n                                <Menu.Item\n                                    icon=\"close\"\n                                    disabled={!hasChanges}\n                                    onClick={() => setClearConfirmationOpen(true)}>\n                                    {texts.table3.editing.actions.clear}\n                                </Menu.Item>\n                                <Menu.Item icon=\"undo\" onClick={() => editing.toggleEditing(false)}>\n                                    {texts.table3.editing.actions.exit}\n                                </Menu.Item>\n                            </Menu.Content>\n                        </Menu>\n                    )}\n                    tabIndex={isCurrentRow ? 0 : -1}\n                />\n                <Dialog\n                    size=\"xs\"\n                    open={clearConfirmationOpen}\n                    onClose={() => {\n                        setClearConfirmationOpen(false);\n                        requestAnimationFrame(() => {\n                            if (edititngActionsRef.current) {\n                                edititngActionsRef.current.focus();\n                                // When table looses focus, we need to re-set the last column index\n                                lastCellIndex.value = getColumnIndex(edititngActionsRef.current);\n                            }\n                        });\n                    }}>\n                    <Dialog.Content aria-label={texts.table3.editing.clearChangesConfirmationDialog.title}>\n                        <Dialog.Title>{texts.table3.editing.clearChangesConfirmationDialog.title}</Dialog.Title>\n\n                        <p>\n                            {texts.table3.editing.clearChangesConfirmationDialog.description\n                                .replace(\n                                    '[ROW_IDENTIFIER]',\n                                    rowIdentifier && rowIdentifierHeader ? rowIdentifierHeader : texts.table3.validation.index\n                                )\n                                .replace(\n                                    '[ROW_IDENTIFIER_VALUE]',\n                                    rowIdentifier && rowIdentifierHeader ? row.original[rowIdentifier] : row.index\n                                )}\n                        </p>\n\n                        <Dialog.Footer>\n                            <Group>\n                                <Dialog.Close>\n                                    <Button tabIndex={0}>{texts.table3.editing.clearChangesConfirmationDialog.cancel}</Button>\n                                </Dialog.Close>\n                                <Dialog.Close>\n                                    <Button tabIndex={0} appearance=\"primary\" autoFocus onClick={() => editing.resetChange(row.id)}>\n                                        {texts.table3.editing.clearChangesConfirmationDialog.confirm}\n                                    </Button>\n                                </Dialog.Close>\n                            </Group>\n                        </Dialog.Footer>\n                    </Dialog.Content>\n                </Dialog>\n            </>\n        );\n    }\n\n    const contentClassName = cn('flex items-center justify-end text-right', { '-mb-2 -mt-2': isCurrentRow });\n    return (\n        <DisplayCell {...props} className={cn({ '!sticky': !!content })}>\n            {content ? <span className={contentClassName}>{content}</span> : undefined}\n        </DisplayCell>\n    );\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    rowIdentifier?: string;\n};\n\nfunction Cell<TType = unknown>(props: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n    const changeset = tableMeta.editing.changes ? Object.keys(tableMeta.editing.changes) : [];\n\n    return (\n        <MemoedCell\n            {...props}\n            hasChanges={changeset.indexOf(props.row.id) >= 0}\n            isCurrentRow={tableMeta.currentRow.currentRowIndex === rowIndex}\n            editing={tableMeta.editing}\n        />\n    );\n}\n\nexport const EDITING_ACTIONS_WIDTH = 60;\n\nexport function createRowEditingActionsColumn<TType = unknown>(rowIdentifier?: string): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: (context: CellContext<TType, unknown>) => <Cell {...context} rowIdentifier={rowIdentifier} />,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                'items-center print:opacity-0 [[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:sticky right-0 !pl-0 !pr-1',\n                '[[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: EDITING_ACTIONS_WIDTH,\n        minSize: EDITING_ACTIONS_WIDTH,\n    };\n}\n"],"names":["savingIndicatorHideDelay","COLUMN_ID","MemoedCell","React","memo","props","hasChanges","isCurrentRow","row","editing","rowIdentifier","table","savingStatus","getSavingStatus","id","isSavedIndicatorVisible","setIsSavingIndicatorVisible","useState","texts","useLocalization","clearConfirmationOpen","setClearConfirmationOpen","columns","getAllFlatColumns","column","find","rowIdentifierHeader","_column$columnDef$met","columnDef","meta","header","edititngActionsRef","useRef","tableMeta","options","handleSaved","resetSavingStatus","timer","useTimer","useEffect","SavingStatusValue","Saved","start","shortcutsState","pause","content","Saving","Tooltip","title","table3","saving","progress","Spinner","delay","className","complete","Icon","name","isEditing","IconButton","ref","appearance","actions","tooltip","icon","menu","menuProps","Menu","Content","Item","disabled","onClick","saveChangesIfNeeded","save","clear","toggleEditing","exit","tabIndex","Dialog","size","open","onClose","requestAnimationFrame","current","focus","lastCellIndex","value","getColumnIndex","clearChangesConfirmationDialog","Title","description","replace","validation","index","original","Footer","Group","Close","Button","cancel","autoFocus","resetChange","confirm","contentClassName","cn","DisplayCell","undefined","Cell","rowIndex","useContext","RowContext","changeset","changes","Object","keys","indexOf","currentRow","currentRowIndex","EDITING_ACTIONS_WIDTH","createRowEditingActionsColumn","ColumnHeader","cell","context","footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","minSize"],"mappings":";;;;;;;;;;;;;;;;;;;;AA0BA,MAAMA,wBAAwB,GAAG,IAAI;MAExBC,SAAS,GAAG;AASzB,MAAMC,UAAU,gBAAGC,cAAK,CAACC,IAAI,CAAC,SAASF,UAAUA,CAAkBG,KAA6B;;EAC5F,MAAM;IAAEC,UAAU;IAAEC,YAAY;IAAEC,GAAG;IAAEC,OAAO;IAAEC,aAAa;IAAEC;GAAO,GAAGN,KAAK;EAE9E,MAAMO,YAAY,GAAGH,OAAO,CAACI,eAAe,CAACL,GAAG,CAACM,EAAE,CAAC;EACpD,MAAM,CAACC,uBAAuB,EAAEC,2BAA2B,CAAC,GAAGb,cAAK,CAACc,QAAQ,CAAC,KAAK,CAAC;EACpF,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM,CAACC,qBAAqB,EAAEC,wBAAwB,CAAC,GAAGlB,cAAK,CAACc,QAAQ,CAAC,KAAK,CAAC;EAC/E,MAAMK,OAAO,GAAGX,KAAK,CAACY,iBAAiB,EAAE;EACzC,MAAMC,MAAM,GAAGF,OAAO,CAACG,IAAI,CAACD,MAAM,IAAIA,MAAM,CAACV,EAAE,KAAKJ,aAAa,CAAC;EAClE,MAAMgB,mBAAmB,GAAGF,MAAM,aAANA,MAAM,wBAAAG,qBAAA,GAANH,MAAM,CAAEI,SAAS,CAACC,IAAI,cAAAF,qBAAA,uBAAtBA,qBAAA,CAAwBG,MAAM;EAC1D,MAAMC,kBAAkB,GAAG5B,cAAK,CAAC6B,MAAM,CAAwC,IAAI,CAAC;EACpF,MAAMC,SAAS,GAAGtB,KAAK,CAACuB,OAAO,CAACL,IAAwB;EAExD,MAAMM,WAAW,GAAGA;IAChBnB,2BAA2B,CAAC,KAAK,CAAC;IAClCP,OAAO,CAAC2B,iBAAiB,CAAC5B,GAAG,CAACM,EAAE,CAAC;GACpC;EACD,MAAMuB,KAAK,GAAGC,QAAQ,CAACtC,wBAAwB,EAAEmC,WAAW,CAAC;EAE7DhC,cAAK,CAACoC,SAAS,CAAC;IACZ,IAAI3B,YAAY,IAAIA,YAAY,KAAK4B,iBAAiB,CAACC,KAAK,IAAI,CAAC1B,uBAAuB,EAAE;MACtFC,2BAA2B,CAAC,IAAI,CAAC;MACjCqB,KAAK,CAACK,KAAK,EAAE;;GAEpB,EAAE,CAAC9B,YAAY,CAAC,CAAC;EAElBT,cAAK,CAACoC,SAAS,CAAC;IACZN,SAAS,CAACU,cAAc,CAACC,KAAK,CAACxB,qBAAqB,CAAC;GACxD,EAAE,CAACA,qBAAqB,CAAC,CAAC;EAE3B,IAAIyB,OAAO;EAEX,IAAIjC,YAAY,EAAE;IACd,IAAIA,YAAY,KAAK4B,iBAAiB,CAACM,MAAM,EAAE;MAC3CD,OAAO,gBACH1C,6BAAC4C,OAAO;QAACC,KAAK,EAAE9B,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAACyC,MAAM,CAACC;sBACxChD,6BAACiD,OAAO;QAACC,KAAK,EAAE,CAAC;QAAEC,SAAS,EAAC;QAAkC,CAEtE;KACJ,MAAM,IAAIvC,uBAAuB,EAAE;MAChC8B,OAAO,gBACH1C,6BAAC4C,OAAO;QAACC,KAAK,EAAE9B,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAACyC,MAAM,CAACK;sBACxCpD,6BAACqD,IAAI;QAACC,IAAI,EAAC,MAAM;QAACH,SAAS,EAAC;QAAkC,CAErE;;;EAIT,IAAI7C,OAAO,CAACiD,SAAS,IAAInD,YAAY,EAAE;IACnCsC,OAAO,gBACH1C,4DACK0C,OAAO,eACR1C,6BAACwD,UAAU;MACPC,GAAG,EAAE7B,kBAAkB;MACvB8B,UAAU,EAAC,aAAa;oBACZ3C,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAACqD,OAAO,CAACC,OAAO;MAChDC,IAAI,EAAC,MAAM;MACXC,IAAI,EAAEC,SAAS,iBACX/D,6BAACgE,IAAI,oBAAKD,SAAS,gBACf/D,6BAACgE,IAAI,CAACC,OAAO,qBACTjE,6BAACgE,IAAI,CAACE,IAAI;QACNL,IAAI,EAAC,MAAM;QACXM,QAAQ,EAAE,CAAChE,UAAU;QACrBiE,OAAO,EAAEA,MAAM9D,OAAO,CAAC+D,mBAAmB;SACzCtD,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAACqD,OAAO,CAACW,IAAI,CAC1B,eACZtE,6BAACgE,IAAI,CAACE,IAAI;QACNL,IAAI,EAAC,OAAO;QACZM,QAAQ,EAAE,CAAChE,UAAU;QACrBiE,OAAO,EAAEA,MAAMlD,wBAAwB,CAAC,IAAI;SAC3CH,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAACqD,OAAO,CAACY,KAAK,CAC3B,eACZvE,6BAACgE,IAAI,CAACE,IAAI;QAACL,IAAI,EAAC,MAAM;QAACO,OAAO,EAAEA,MAAM9D,OAAO,CAACkE,aAAa,CAAC,KAAK;SAC5DzD,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAACqD,OAAO,CAACc,IAAI,CAC1B,CACD,CAEtB;MACDC,QAAQ,EAAEtE,YAAY,GAAG,CAAC,GAAG,CAAC;MAChC,eACFJ,6BAAC2E,MAAM;MACHC,IAAI,EAAC,IAAI;MACTC,IAAI,EAAE5D,qBAAqB;MAC3B6D,OAAO,EAAEA;QACL5D,wBAAwB,CAAC,KAAK,CAAC;QAC/B6D,qBAAqB,CAAC;UAClB,IAAInD,kBAAkB,CAACoD,OAAO,EAAE;YAC5BpD,kBAAkB,CAACoD,OAAO,CAACC,KAAK,EAAE;;YAElCC,aAAa,CAACC,KAAK,GAAGC,cAAc,CAACxD,kBAAkB,CAACoD,OAAO,CAAC;;SAEvE,CAAC;;oBAENhF,6BAAC2E,MAAM,CAACV,OAAO;oBAAalD,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAAC+E,8BAA8B,CAACxC;oBAC5E7C,6BAAC2E,MAAM,CAACW,KAAK,QAAEvE,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAAC+E,8BAA8B,CAACxC,KAAK,CAAgB,eAExF7C,wCACKe,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAAC+E,8BAA8B,CAACE,WAAW,CAC3DC,OAAO,CACJ,kBAAkB,EAClBjF,aAAa,IAAIgB,mBAAmB,GAAGA,mBAAmB,GAAGR,KAAK,CAAC+B,MAAM,CAAC2C,UAAU,CAACC,KAAK,CAC7F,CACAF,OAAO,CACJ,wBAAwB,EACxBjF,aAAa,IAAIgB,mBAAmB,GAAGlB,GAAG,CAACsF,QAAQ,CAACpF,aAAa,CAAC,GAAGF,GAAG,CAACqF,KAAK,CACjF,CACL,eAEJ1F,6BAAC2E,MAAM,CAACiB,MAAM,qBACV5F,6BAAC6F,KAAK,qBACF7F,6BAAC2E,MAAM,CAACmB,KAAK,qBACT9F,6BAAC+F,MAAM;MAACrB,QAAQ,EAAE;OAAI3D,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAAC+E,8BAA8B,CAACW,MAAM,CAAU,CAC/E,eACfhG,6BAAC2E,MAAM,CAACmB,KAAK,qBACT9F,6BAAC+F,MAAM;MAACrB,QAAQ,EAAE,CAAC;MAAEhB,UAAU,EAAC,SAAS;MAACuC,SAAS;MAAC7B,OAAO,EAAEA,MAAM9D,OAAO,CAAC4F,WAAW,CAAC7F,GAAG,CAACM,EAAE;OACxFI,KAAK,CAAC+B,MAAM,CAACxC,OAAO,CAAC+E,8BAA8B,CAACc,OAAO,CACvD,CACE,CACX,CACI,CACH,CACZ,CAEhB;;EAGL,MAAMC,gBAAgB,GAAGC,EAAE,CAAC,0CAA0C,EAAE;IAAE,aAAa,EAAEjG;GAAc,CAAC;EACxG,oBACIJ,6BAACsG,WAAW,oBAAKpG,KAAK;IAAEiD,SAAS,EAAEkD,EAAE,CAAC;MAAE,SAAS,EAAE,CAAC,CAAC3D;KAAS;MACzDA,OAAO,gBAAG1C;IAAMmD,SAAS,EAAEiD;KAAmB1D,OAAO,CAAQ,GAAG6D,SAAS,CAChE;AAEtB,CAAC,CAAoE;AAMrE,SAASC,IAAIA,CAAkBtG,KAAuB;EAClD,MAAM;IAAEuG;GAAU,GAAGzG,cAAK,CAAC0G,UAAU,CAACC,UAAU,CAAC;EACjD,MAAM7E,SAAS,GAAG5B,KAAK,CAACM,KAAK,CAACuB,OAAO,CAACL,IAAwB;EAC9D,MAAMkF,SAAS,GAAG9E,SAAS,CAACxB,OAAO,CAACuG,OAAO,GAAGC,MAAM,CAACC,IAAI,CAACjF,SAAS,CAACxB,OAAO,CAACuG,OAAO,CAAC,GAAG,EAAE;EAEzF,oBACI7G,6BAACD,UAAU,oBACHG,KAAK;IACTC,UAAU,EAAEyG,SAAS,CAACI,OAAO,CAAC9G,KAAK,CAACG,GAAG,CAACM,EAAE,CAAC,IAAI,CAAC;IAChDP,YAAY,EAAE0B,SAAS,CAACmF,UAAU,CAACC,eAAe,KAAKT,QAAQ;IAC/DnG,OAAO,EAAEwB,SAAS,CAACxB;KACrB;AAEV;MAEa6G,qBAAqB,GAAG;SAErBC,6BAA6BA,CAAkB7G,aAAsB;EACjF,OAAO;IACHI,EAAE,EAAEb,SAAS;IACb6B,MAAM,EAAE0F,MAAY;IACpBC,IAAI,EAAGC,OAAoC,iBAAKvH,6BAACwG,IAAI,oBAAKe,OAAO;MAAEhH,aAAa,EAAEA;OAAiB;IACnGiH,MAAM,EAAE5B,MAAM;IACdlE,IAAI,EAAE;MACF+F,KAAK,EAAE,OAAO;MACdtE,SAAS,EAAEkD,EAAE,CACT,mIAAmI,EACnI,kIAAkI,EAClI,wEAAwE,EACxE,kDAAkD,EAClD,yDAAyD,CAC5D;MACDqB,cAAc,EAAE,KAAK;MACrBC,YAAY,EAAE,KAAK;MACnBC,cAAc,EAAE,KAAK;MACrBjG,MAAM,EAAE,EAAE;MACVkG,eAAe,EAAE;KACpB;;IAEDC,cAAc,EAAE,KAAK;IACrBlD,IAAI,EAAEuC,qBAAqB;IAC3BY,OAAO,EAAEZ;GACZ;AACL;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/rows/Row.js

@@ -3,7 +3,7 @@ import cn from 'classnames';
 import { useFocusManager } from '@react-aria/focus';
 import { useDropTarget } from '../../../../utils/hooks/useDropTarget.js';
 import { RowContext, useRowContext } from './RowContext.js';
-import { focusableSelector } from '../../util/editing.js';
+import { focusableSelector, getColumnIndex, LastCellIndex } from '../../util/editing.js';
 
 const FOCUS_MANAGER_OPTIONS = {
   tabbable: true,
@@ -11,6 +11,7 @@ const FOCUS_MANAGER_OPTIONS = {
   accept: element => !!element.closest('[role="row"][data-current="true"]')
 };
 function Row(props) {
+  var _tableMeta$validation, _tableMeta$validation2;
   const focusManager = useFocusManager();
   const tableMeta = props.table.options.meta;
   const isCurrentRow = tableMeta.currentRow.currentRowIndex === props.index;
@@ -57,6 +58,7 @@ function Row(props) {
       }
     }
   };
+  const hasError = !!Object.keys((_tableMeta$validation = (_tableMeta$validation2 = tableMeta.validation.errors) === null || _tableMeta$validation2 === void 0 ? void 0 : _tableMeta$validation2[props.row.id]) !== null && _tableMeta$validation !== void 0 ? _tableMeta$validation : {}).length;
   // rows are heavily memoized because performance in our table is critical
   // be careful and selective about props that you pass to the row
   const memoedProps = {
@@ -64,6 +66,7 @@ function Row(props) {
     'aria-grabbed': isDraggingRow ? true : tableMeta.rowDrag.isEnabled ? false : undefined,
     'data-current': isCurrentRow,
     'data-selected': props.row.getIsSelected(),
+    'data-invalid': hasError,
     draggable: tableMeta.rowDrag.isEnabled,
     index: props.index,
     onClick: tableMeta.rowClick.handleClick,
@@ -82,21 +85,15 @@ function Row(props) {
   const contextValue = React__default.useMemo(() => ({
     isHovered,
     setIsHovered,
-    rowIndex: props.index
-  }), [isHovered, props.index]);
+    rowIndex: props.index,
+    hasError
+  }), [isHovered, hasError, props.index]);
   return /*#__PURE__*/React__default.createElement(RowContext.Provider, {
     value: contextValue
   }, output);
 }
 // turns out we might need some kind of "state" for the focused column, but it doesn't need to be react state that re-renders
-let lastIndex;
-function getColumnIndex(focusedElement) {
-  if (focusedElement) {
-    var _focusedElement$close;
-    return (_focusedElement$close = focusedElement.closest('[role=cell]')) === null || _focusedElement$close === void 0 ? void 0 : _focusedElement$close.getAttribute('data-column-index');
-  }
-  return null;
-}
+const lastCellIndex = /*#__PURE__*/new LastCellIndex();
 // This code is needed to avoid multiple rows being hovered at the same time (it happens since we use non-css hovering)
 let previouslyHoveredIndex;
 const unhoverPreviousRow = tableRef => {
@@ -123,7 +120,7 @@ function EditingRow(props) {
   const focusManager = useFocusManager();
   const tableMeta = props.table.options.meta;
   const handleClickCapture = event => {
-    lastIndex = getColumnIndex(event.target);
+    lastCellIndex.value = getColumnIndex(event.target);
   };
   const handleArrowLeftKey = event => {
     let focusedElement;
@@ -132,26 +129,27 @@ function EditingRow(props) {
       // so we don't need default browser behaviour.
       event.stopPropagation();
       event.preventDefault();
+      tableMeta.hoverState.pause(true);
       // "CTRL + ArrowLeft" or "META + ArrowLeft" should focus first focusable element of the row
       if (event.ctrlKey || event.metaKey) {
         event.target.blur();
         focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
-        lastIndex = getColumnIndex(focusedElement);
+        lastCellIndex.value = getColumnIndex(focusedElement);
       } else {
         // looping backwards
         focusedElement = focusManager.focusPrevious(FOCUS_MANAGER_OPTIONS);
         if (focusedElement) {
-          lastIndex = getColumnIndex(focusedElement);
+          lastCellIndex.value = getColumnIndex(focusedElement);
         } else {
           // there are no previous elements to focus, go up a row (if there are rows above)
-          if (!isFirstRow) {
+          if (!isFirstRow || !event.currentTarget.contains(focusedElement)) {
             event.preventDefault();
             tableMeta.hoverState.pause(true);
             tableMeta.currentRow.setCurrentRowIndex(props.index - 1);
             setTimeout(() => {
-              focusManager.focusLast(FOCUS_MANAGER_OPTIONS);
+              focusedElement = focusManager.focusLast(FOCUS_MANAGER_OPTIONS);
               // Need to update lastIndex when row got changed and last element got selected.
-              lastIndex = getColumnIndex(focusedElement);
+              lastCellIndex.value = getColumnIndex(focusedElement);
             }, 1);
           }
         }
@@ -165,26 +163,27 @@ function EditingRow(props) {
       // so we don't need default browser behaviour.
       event.stopPropagation();
       event.preventDefault();
+      tableMeta.hoverState.pause(true);
       // "CTRL + ArrowRight" or "META + ArrowRight" should focus last focusable element of the row
       if (event.ctrlKey || event.metaKey) {
         event.target.blur();
         focusedElement = focusManager.focusLast(FOCUS_MANAGER_OPTIONS);
-        lastIndex = getColumnIndex(focusedElement);
+        lastCellIndex.value = getColumnIndex(focusedElement);
       } else {
         // looping forwards
         focusedElement = focusManager.focusNext(FOCUS_MANAGER_OPTIONS);
         if (focusedElement) {
-          lastIndex = getColumnIndex(focusedElement);
+          lastCellIndex.value = getColumnIndex(focusedElement);
         } else {
           // there are no next elements to focus, go down a row or go outside the table
-          if (!props.isLastRow) {
+          if (!props.isLastRow && !event.currentTarget.contains(focusedElement)) {
             event.preventDefault();
             tableMeta.hoverState.pause(true);
             tableMeta.currentRow.setCurrentRowIndex(props.index + 1);
             setTimeout(() => {
-              focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
+              focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
               // Need to update lastIndex when row got changed and last element got selected.
-              lastIndex = getColumnIndex(focusedElement);
+              lastCellIndex.value = getColumnIndex(focusedElement);
             }, 1);
           }
         }
@@ -198,7 +197,7 @@ function EditingRow(props) {
     }
   }, [tableMeta.hoverState.isPaused]);
   const handleKeyDown = event => {
-    if (event.isDefaultPrevented() || event.isPropagationStopped() || tableMeta.editing.detailModeEditing) {
+    if (event.isDefaultPrevented() || event.isPropagationStopped() || tableMeta.editing.detailModeEditing || tableMeta.shortcutsState.isPaused) {
       return;
     }
     onKeyDown(event); // handles tab behaviour
@@ -207,19 +206,28 @@ function EditingRow(props) {
   };
   // this ensures we focus either on a field or on the same column when keyboard navigating up/down
   React__default.useEffect(() => {
-    if (tableMeta.currentRow.currentRowIndex === props.index) {
-      if (lastIndex !== undefined) {
-        var _props$tableRef$curre, _lastIndexCell$queryS;
-        const lastIndexCell = (_props$tableRef$curre = props.tableRef.current) === null || _props$tableRef$curre === void 0 ? void 0 : _props$tableRef$curre.querySelector(`[role="row"][data-current="true"] [data-column-index="${lastIndex}"]`);
-        lastIndexCell === null || lastIndexCell === void 0 ? void 0 : (_lastIndexCell$queryS = lastIndexCell.querySelector(focusableSelector)) === null || _lastIndexCell$queryS === void 0 ? void 0 : _lastIndexCell$queryS.focus();
+    // When table in searching state, whe should prevent editing control to be focused, because it will cause search field to loose focus.
+    if (tableMeta.currentRow.currentRowIndex === props.index && !tableMeta.search.isSearching) {
+      if (lastCellIndex.value !== null) {
+        var _props$tableRef$curre;
+        const lastCellElement = (_props$tableRef$curre = props.tableRef.current) === null || _props$tableRef$curre === void 0 ? void 0 : _props$tableRef$curre.querySelector(`[role="row"][data-current="true"] [data-column-index="${lastCellIndex.value}"]`);
+        const focusableElement = lastCellElement === null || lastCellElement === void 0 ? void 0 : lastCellElement.querySelector(focusableSelector);
+        if (focusableElement) {
+          focusableElement.focus();
+          // if we found a cell but it doesn't contain focusable element, then we'll focus the first one in a row.
+        } else if (lastCellElement) {
+          const focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
+          lastCellIndex.value = getColumnIndex(focusedElement);
+        }
       } else {
-        focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
+        const focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);
+        lastCellIndex.value = getColumnIndex(focusedElement);
       }
     }
     // Need to subscribe to current row index and check is it a current row,
     // for a situation where hovered row is the next row after current row...
     // In this case row will not be re-rendered if user switch to next row, because hovered row also renders EditingRow.
-  }, [tableMeta.currentRow.currentRowIndex]);
+  }, [tableMeta.currentRow.currentRowIndex, tableMeta.search.isSearching]);
   return /*#__PURE__*/React__default.createElement(MemoedRow, Object.assign({}, attributes, {
     onClickCapture: handleClickCapture,
     onKeyDown: handleKeyDown
@@ -311,5 +319,5 @@ const MemoedRow = /*#__PURE__*/React__default.memo(function MemoedRow(props) {
   }));
 });
 
-export { Row };
+export { Row, lastCellIndex };
 //# sourceMappingURL=Row.js.map

package/dist/esm/packages/taco/src/components/Table3/components/rows/Row.js.map

@@ -1 +1 @@
-{"version":3,"file":"Row.js","sources":["../../../../../../../../../src/components/Table3/components/rows/Row.tsx"],"sourcesContent":["import React from 'react';\nimport { Row as RTRow, Table as RTable, TableMeta } from '@tanstack/react-table';\nimport cn from 'classnames';\nimport { RowContext, useRowContext } from './RowContext';\nimport { useDropTarget } from '../../../../utils/hooks/useDropTarget';\nimport { Table3RowClickHandler, Table3RowDropHandler } from '../../types';\nimport { useFocusManager } from '@react-aria/focus';\nimport { focusableSelector } from '../../util/editing';\n\nconst FOCUS_MANAGER_OPTIONS = {\n    tabbable: true,\n    // Filter out all focusable elelemnts which are not in current row\n    accept: (element: Element) => !!element.closest('[role=\"row\"][data-current=\"true\"]'),\n};\n\ntype RowProps<TType = unknown> = Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick' | 'onDrop'> & {\n    index: number;\n    isLastRow: boolean;\n    measureRef: (el: HTMLElement | null) => void;\n    onClick?: Table3RowClickHandler<TType>;\n    onDrop?: Table3RowDropHandler<TType>;\n    row: RTRow<TType>;\n    table: RTable<TType>;\n    tableRef: React.RefObject<HTMLDivElement>;\n};\n\nexport function Row<TType = unknown>(props: RowProps<TType>) {\n    const focusManager = useFocusManager();\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n    const isCurrentRow = tableMeta.currentRow.currentRowIndex === props.index;\n    const isDraggingRow = tableMeta.rowDrag.dragging[props.row.id];\n    const isFirstRow = props.index === 0;\n    // we use non-css hovered state to determine whether to render actions or not, for performance\n    const [isHovered, setIsHovered] = React.useState(false);\n\n    // tab behaviour is consistent across normal mode and edit mode, handle it here\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        if (event.isDefaultPrevented() || event.isPropagationStopped()) {\n            return;\n        }\n\n        if (event.key === 'Tab') {\n            tableMeta.hoverState.pause(true);\n            let focusedElement: Element;\n\n            if (event.shiftKey) {\n                // looping backwards\n                focusedElement = focusManager.focusPrevious(FOCUS_MANAGER_OPTIONS);\n\n                if (focusedElement) {\n                    // override default behaviour, since we're handling focus internally now\n                    event.preventDefault();\n                } else {\n                    // there are no previous elements to focus, go up a row or go outside the table\n                    if (!isFirstRow) {\n                        event.preventDefault();\n                        tableMeta.currentRow.setCurrentRowIndex(props.index - 1);\n                        setTimeout(() => focusManager.focusLast(FOCUS_MANAGER_OPTIONS), 1);\n                    }\n                }\n            } else {\n                // looping forwards\n                focusedElement = focusManager.focusNext(FOCUS_MANAGER_OPTIONS);\n\n                if (focusedElement) {\n                    // override default behaviour, since we're handling focus internally now\n                    event.preventDefault();\n                } else {\n                    // there are no next elements to focus, go down a row or go outside the table\n                    if (!props.isLastRow) {\n                        event.preventDefault();\n                        tableMeta.currentRow.setCurrentRowIndex(props.index + 1);\n                        setTimeout(() => focusManager.focusFirst(FOCUS_MANAGER_OPTIONS), 1);\n                    }\n                }\n            }\n        }\n    };\n\n    // rows are heavily memoized because performance in our table is critical\n    // be careful and selective about props that you pass to the row\n    const memoedProps = {\n        // aria-grabbed is being deprecated but there is no current alternative api, we use it until there is\n        'aria-grabbed': isDraggingRow ? true : tableMeta.rowDrag.isEnabled ? false : undefined,\n        'data-current': isCurrentRow,\n        'data-selected': props.row.getIsSelected(),\n        draggable: tableMeta.rowDrag.isEnabled,\n        index: props.index,\n        onClick: tableMeta.rowClick.handleClick,\n        onDrop: tableMeta.rowDrop.isEnabled ? tableMeta.rowDrop.handleDrop : undefined,\n        onKeyDown: handleKeyDown,\n    };\n\n    let output = <MemoedRow<TType> {...props} {...memoedProps} />;\n\n    if (tableMeta.editing.isEditing && (isCurrentRow || (isHovered && !tableMeta.hoverState.isPaused))) {\n        output = (\n            <EditingRow\n                {...props}\n                {...memoedProps}\n                isFirstRow={isFirstRow}\n                setCurrentRowIndex={tableMeta.currentRow.setCurrentRowIndex}\n            />\n        );\n    }\n\n    // we store the row index in context because in a virtualised table the row index and the\n    // react table row index do not match when, for example, sorting is applied\n    const contextValue = React.useMemo(() => ({ isHovered, setIsHovered, rowIndex: props.index }), [isHovered, props.index]);\n\n    return <RowContext.Provider value={contextValue}>{output}</RowContext.Provider>;\n}\n\n// turns out we might need some kind of \"state\" for the focused column, but it doesn't need to be react state that re-renders\nlet lastIndex;\n\nfunction getColumnIndex(focusedElement: Element) {\n    if (focusedElement) {\n        return focusedElement.closest('[role=cell]')?.getAttribute('data-column-index');\n    }\n\n    return null;\n}\n\n// This code is needed to avoid multiple rows being hovered at the same time (it happens since we use non-css hovering)\nlet previouslyHoveredIndex: number | undefined;\nconst unhoverPreviousRow = (tableRef: React.RefObject<HTMLDivElement>) => {\n    if (previouslyHoveredIndex !== undefined) {\n        const mouseoutEvent = new MouseEvent('mouseout', { view: window, bubbles: true, cancelable: true });\n        const previouslyHovered = tableRef?.current?.querySelector(`[data-row-index=\"${previouslyHoveredIndex}\"]`);\n        previouslyHovered?.dispatchEvent(mouseoutEvent);\n    }\n};\n\nfunction EditingRow(props) {\n    const { isFirstRow, isLastRow, onKeyDown, setCurrentRowIndex, virtualiser, ...attributes } = props;\n    const focusManager = useFocusManager();\n    const tableMeta = props.table.options.meta as TableMeta<unknown>;\n\n    const handleClickCapture = (event: React.FocusEvent) => {\n        lastIndex = getColumnIndex(event.target);\n    };\n\n    const handleArrowLeftKey = event => {\n        let focusedElement: Element;\n\n        if (event.key === 'ArrowLeft') {\n            // We need to perform special behaviour when focus reaches the end of the row,\n            // so we don't need default browser behaviour.\n            event.stopPropagation();\n            event.preventDefault();\n\n            // \"CTRL + ArrowLeft\" or \"META + ArrowLeft\" should focus first focusable element of the row\n            if (event.ctrlKey || event.metaKey) {\n                event.target.blur();\n                focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);\n                lastIndex = getColumnIndex(focusedElement);\n            } else {\n                // looping backwards\n                focusedElement = focusManager.focusPrevious(FOCUS_MANAGER_OPTIONS);\n\n                if (focusedElement) {\n                    lastIndex = getColumnIndex(focusedElement);\n                } else {\n                    // there are no previous elements to focus, go up a row (if there are rows above)\n                    if (!isFirstRow) {\n                        event.preventDefault();\n                        tableMeta.hoverState.pause(true);\n                        tableMeta.currentRow.setCurrentRowIndex(props.index - 1);\n                        setTimeout(() => {\n                            focusManager.focusLast(FOCUS_MANAGER_OPTIONS);\n                            // Need to update lastIndex when row got changed and last element got selected.\n                            lastIndex = getColumnIndex(focusedElement);\n                        }, 1);\n                    }\n                }\n            }\n        }\n    };\n\n    const handleArrowRightKey = event => {\n        let focusedElement: Element;\n\n        if (event.key === 'ArrowRight') {\n            // We need to perform special behaviour when focus reaches the end of the row,\n            // so we don't need default browser behaviour.\n            event.stopPropagation();\n            event.preventDefault();\n\n            // \"CTRL + ArrowRight\" or \"META + ArrowRight\" should focus last focusable element of the row\n            if (event.ctrlKey || event.metaKey) {\n                event.target.blur();\n                focusedElement = focusManager.focusLast(FOCUS_MANAGER_OPTIONS);\n                lastIndex = getColumnIndex(focusedElement);\n            } else {\n                // looping forwards\n                focusedElement = focusManager.focusNext(FOCUS_MANAGER_OPTIONS);\n\n                if (focusedElement) {\n                    lastIndex = getColumnIndex(focusedElement);\n                } else {\n                    // there are no next elements to focus, go down a row or go outside the table\n                    if (!props.isLastRow) {\n                        event.preventDefault();\n                        tableMeta.hoverState.pause(true);\n                        tableMeta.currentRow.setCurrentRowIndex(props.index + 1);\n                        setTimeout(() => {\n                            focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);\n                            // Need to update lastIndex when row got changed and last element got selected.\n                            lastIndex = getColumnIndex(focusedElement);\n                        }, 1);\n                    }\n                }\n            }\n        }\n    };\n\n    React.useEffect(() => {\n        // if some row stuck in hovered state, we heed to unhover it when hover state is paused\n        if (tableMeta.hoverState.isPaused) {\n            unhoverPreviousRow(props.tableRef);\n        }\n    }, [tableMeta.hoverState.isPaused]);\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        if (event.isDefaultPrevented() || event.isPropagationStopped() || tableMeta.editing.detailModeEditing) {\n            return;\n        }\n\n        onKeyDown(event); // handles tab behaviour\n        handleArrowLeftKey(event);\n        handleArrowRightKey(event);\n    };\n\n    // this ensures we focus either on a field or on the same column when keyboard navigating up/down\n    React.useEffect(() => {\n        if (tableMeta.currentRow.currentRowIndex === props.index) {\n            if (lastIndex !== undefined) {\n                const lastIndexCell = props.tableRef.current?.querySelector(\n                    `[role=\"row\"][data-current=\"true\"] [data-column-index=\"${lastIndex}\"]`\n                );\n                lastIndexCell?.querySelector(focusableSelector)?.focus();\n            } else {\n                focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);\n            }\n        }\n        // Need to subscribe to current row index and check is it a current row,\n        // for a situation where hovered row is the next row after current row...\n        // In this case row will not be re-rendered if user switch to next row, because hovered row also renders EditingRow.\n    }, [tableMeta.currentRow.currentRowIndex]);\n\n    return <MemoedRow {...attributes} onClickCapture={handleClickCapture} onKeyDown={handleKeyDown} />;\n}\n\n// Memoization\n\nexport type MemoedRowProps<TType = unknown> = RowProps<TType> & {\n    'aria-grabbed'?: boolean;\n    'data-current': boolean;\n    'data-selected': boolean;\n    draggable: boolean;\n    index: number;\n};\n\nconst clickableElements = ['input', 'button', 'a', 'select', 'option', 'label', 'textarea'];\n\nconst MemoedRow = React.memo(function MemoedRow<TType = unknown>(props: MemoedRowProps<TType>) {\n    const { index, isLastRow: _1, measureRef, onClick, onClickCapture, onDrop, row, table, tableRef, ...attributes } = props;\n    const ref = React.useRef<HTMLDivElement | null>(null);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const { setIsHovered } = useRowContext();\n\n    // we measure the first cell (since the row has display: contents) so that the virtualiser height is correct\n    React.useEffect(() => {\n        const firstCell = ref.current?.querySelector('[role=cell]:first-child');\n\n        if (firstCell) {\n            measureRef(firstCell as HTMLElement);\n        }\n    }, [ref.current]);\n\n    // we use capture because it also picks up clicks on e.g. select checkboxes\n    const handleClickCapture = (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n        if (typeof onClickCapture === 'function') {\n            onClickCapture(event);\n        }\n\n        // do this in the next frame, otherwise it remounts the row and prevents row actions on hover from being clickable\n        requestAnimationFrame(() => tableMeta.currentRow.setCurrentRowIndex(index));\n    };\n\n    const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        if (typeof onClick === 'function') {\n            const clickedElement = event.target as HTMLElement;\n\n            if (\n                !ref.current?.contains(event.target as HTMLElement) ||\n                clickableElements.includes(clickedElement.tagName.toLowerCase()) ||\n                clickedElement.closest(clickableElements.map(tag => `[role=row] ${tag}`).join(','))\n            ) {\n                return;\n            }\n\n            onClick(row.original);\n        }\n    };\n\n    const handleMouseEnter = () => {\n        // When user moving mouse to fast, then some of the rows are getting stuck in hover state,\n        // because mouseleave event never got triggered, to avoid this to happen we're saving the index of last hovered row,\n        // so that we can unhover it when new row got hovered, and saving it in a variable outside of react to save in performance,\n        // since it would be very performance heavy to use state which is bound to mouse events.\n        if (previouslyHoveredIndex !== undefined) {\n            if (previouslyHoveredIndex !== index) {\n                unhoverPreviousRow(tableRef);\n                previouslyHoveredIndex = index;\n            }\n        } else {\n            previouslyHoveredIndex = index;\n        }\n        setIsHovered(true);\n    };\n    const handleMouseLeave = () => {\n        if (previouslyHoveredIndex === index) {\n            previouslyHoveredIndex = undefined;\n        }\n        setIsHovered(false);\n    };\n\n    const [isDraggedOver, dropTargetProps] = useDropTarget(event => onDrop?.(event, row.original));\n\n    const className = cn(\n        'group/row contents',\n        // resizing column requires dragging, which means the mouse might (on rare occasions) move over rows and trigger hover state\n        // that in turn triggers rendering of e.g. row actions, which could cause janky ui - so don't allow mouse interaction when resizing\n        '[[role=\"table\"][data-resizing=\"true\"]_&]:pointer-events-none',\n        {\n            'hover:cursor-pointer': typeof onClick === 'function',\n        }\n    );\n\n    return (\n        <div\n            {...attributes}\n            {...(onDrop ? dropTargetProps : undefined)}\n            className={className}\n            data-row-index={index}\n            data-dragged-over={isDraggedOver}\n            onClick={handleClick}\n            onClickCapture={handleClickCapture}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n            role=\"row\"\n            ref={ref}\n        />\n    );\n}) as <TType = unknown>(props: MemoedRowProps<TType>) => JSX.Element;\n"],"names":["FOCUS_MANAGER_OPTIONS","tabbable","accept","element","closest","Row","props","focusManager","useFocusManager","tableMeta","table","options","meta","isCurrentRow","currentRow","currentRowIndex","index","isDraggingRow","rowDrag","dragging","row","id","isFirstRow","isHovered","setIsHovered","React","useState","handleKeyDown","event","isDefaultPrevented","isPropagationStopped","key","hoverState","pause","focusedElement","shiftKey","focusPrevious","preventDefault","setCurrentRowIndex","setTimeout","focusLast","focusNext","isLastRow","focusFirst","memoedProps","isEnabled","undefined","getIsSelected","draggable","onClick","rowClick","handleClick","onDrop","rowDrop","handleDrop","onKeyDown","output","MemoedRow","editing","isEditing","isPaused","EditingRow","contextValue","useMemo","rowIndex","RowContext","Provider","value","lastIndex","getColumnIndex","_focusedElement$close","getAttribute","previouslyHoveredIndex","unhoverPreviousRow","tableRef","_tableRef$current","mouseoutEvent","MouseEvent","view","window","bubbles","cancelable","previouslyHovered","current","querySelector","dispatchEvent","virtualiser","attributes","handleClickCapture","target","handleArrowLeftKey","stopPropagation","ctrlKey","metaKey","blur","handleArrowRightKey","useEffect","detailModeEditing","_props$tableRef$curre","_lastIndexCell$queryS","lastIndexCell","focusableSelector","focus","onClickCapture","clickableElements","memo","_1","measureRef","ref","useRef","useRowContext","firstCell","_ref$current","requestAnimationFrame","_ref$current2","clickedElement","contains","includes","tagName","toLowerCase","map","tag","join","original","handleMouseEnter","handleMouseLeave","isDraggedOver","dropTargetProps","useDropTarget","className","cn","onMouseEnter","onMouseLeave","role"],"mappings":"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"}
+{"version":3,"file":"Row.js","sources":["../../../../../../../../../src/components/Table3/components/rows/Row.tsx"],"sourcesContent":["import React from 'react';\nimport { Row as RTRow, Table as RTable, TableMeta } from '@tanstack/react-table';\nimport cn from 'classnames';\nimport { RowContext, useRowContext } from './RowContext';\nimport { useDropTarget } from '../../../../utils/hooks/useDropTarget';\nimport { Table3RowClickHandler, Table3RowDropHandler } from '../../types';\nimport { useFocusManager } from '@react-aria/focus';\nimport { LastCellIndex, focusableSelector, getColumnIndex } from '../../util/editing';\n\nconst FOCUS_MANAGER_OPTIONS = {\n    tabbable: true,\n    // Filter out all focusable elelemnts which are not in current row\n    accept: (element: Element) => !!element.closest('[role=\"row\"][data-current=\"true\"]'),\n};\n\ntype RowProps<TType = unknown> = Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick' | 'onDrop'> & {\n    index: number;\n    isLastRow: boolean;\n    measureRef: (el: HTMLElement | null) => void;\n    onClick?: Table3RowClickHandler<TType>;\n    onDrop?: Table3RowDropHandler<TType>;\n    row: RTRow<TType>;\n    table: RTable<TType>;\n    tableRef: React.RefObject<HTMLDivElement>;\n};\n\nexport function Row<TType = unknown>(props: RowProps<TType>) {\n    const focusManager = useFocusManager();\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n    const isCurrentRow = tableMeta.currentRow.currentRowIndex === props.index;\n    const isDraggingRow = tableMeta.rowDrag.dragging[props.row.id];\n    const isFirstRow = props.index === 0;\n    // we use non-css hovered state to determine whether to render actions or not, for performance\n    const [isHovered, setIsHovered] = React.useState(false);\n\n    // tab behaviour is consistent across normal mode and edit mode, handle it here\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        if (event.isDefaultPrevented() || event.isPropagationStopped()) {\n            return;\n        }\n\n        if (event.key === 'Tab') {\n            tableMeta.hoverState.pause(true);\n            let focusedElement: Element;\n\n            if (event.shiftKey) {\n                // looping backwards\n                focusedElement = focusManager.focusPrevious(FOCUS_MANAGER_OPTIONS);\n\n                if (focusedElement) {\n                    // override default behaviour, since we're handling focus internally now\n                    event.preventDefault();\n                } else {\n                    // there are no previous elements to focus, go up a row or go outside the table\n                    if (!isFirstRow) {\n                        event.preventDefault();\n                        tableMeta.currentRow.setCurrentRowIndex(props.index - 1);\n                        setTimeout(() => focusManager.focusLast(FOCUS_MANAGER_OPTIONS), 1);\n                    }\n                }\n            } else {\n                // looping forwards\n                focusedElement = focusManager.focusNext(FOCUS_MANAGER_OPTIONS);\n\n                if (focusedElement) {\n                    // override default behaviour, since we're handling focus internally now\n                    event.preventDefault();\n                } else {\n                    // there are no next elements to focus, go down a row or go outside the table\n                    if (!props.isLastRow) {\n                        event.preventDefault();\n                        tableMeta.currentRow.setCurrentRowIndex(props.index + 1);\n                        setTimeout(() => focusManager.focusFirst(FOCUS_MANAGER_OPTIONS), 1);\n                    }\n                }\n            }\n        }\n    };\n    const hasError = !!Object.keys(tableMeta.validation.errors?.[props.row.id] ?? {}).length;\n\n    // rows are heavily memoized because performance in our table is critical\n    // be careful and selective about props that you pass to the row\n    const memoedProps = {\n        // aria-grabbed is being deprecated but there is no current alternative api, we use it until there is\n        'aria-grabbed': isDraggingRow ? true : tableMeta.rowDrag.isEnabled ? false : undefined,\n        'data-current': isCurrentRow,\n        'data-selected': props.row.getIsSelected(),\n        'data-invalid': hasError,\n        draggable: tableMeta.rowDrag.isEnabled,\n        index: props.index,\n        onClick: tableMeta.rowClick.handleClick,\n        onDrop: tableMeta.rowDrop.isEnabled ? tableMeta.rowDrop.handleDrop : undefined,\n        onKeyDown: handleKeyDown,\n    };\n\n    let output = <MemoedRow<TType> {...props} {...memoedProps} />;\n\n    if (tableMeta.editing.isEditing && (isCurrentRow || (isHovered && !tableMeta.hoverState.isPaused))) {\n        output = (\n            <EditingRow\n                {...props}\n                {...memoedProps}\n                isFirstRow={isFirstRow}\n                setCurrentRowIndex={tableMeta.currentRow.setCurrentRowIndex}\n            />\n        );\n    }\n\n    // we store the row index in context because in a virtualised table the row index and the\n    // react table row index do not match when, for example, sorting is applied\n    const contextValue = React.useMemo(\n        () => ({ isHovered, setIsHovered, rowIndex: props.index, hasError }),\n        [isHovered, hasError, props.index]\n    );\n\n    return <RowContext.Provider value={contextValue}>{output}</RowContext.Provider>;\n}\n\n// turns out we might need some kind of \"state\" for the focused column, but it doesn't need to be react state that re-renders\nexport const lastCellIndex = new LastCellIndex();\n\n// This code is needed to avoid multiple rows being hovered at the same time (it happens since we use non-css hovering)\nlet previouslyHoveredIndex: number | undefined;\nconst unhoverPreviousRow = (tableRef: React.RefObject<HTMLDivElement>) => {\n    if (previouslyHoveredIndex !== undefined) {\n        const mouseoutEvent = new MouseEvent('mouseout', { view: window, bubbles: true, cancelable: true });\n        const previouslyHovered = tableRef?.current?.querySelector(`[data-row-index=\"${previouslyHoveredIndex}\"]`);\n        previouslyHovered?.dispatchEvent(mouseoutEvent);\n    }\n};\n\nfunction EditingRow(props) {\n    const { isFirstRow, isLastRow, onKeyDown, setCurrentRowIndex, virtualiser, ...attributes } = props;\n    const focusManager = useFocusManager();\n    const tableMeta = props.table.options.meta as TableMeta<unknown>;\n\n    const handleClickCapture = (event: React.FocusEvent) => {\n        lastCellIndex.value = getColumnIndex(event.target);\n    };\n\n    const handleArrowLeftKey = event => {\n        let focusedElement: Element;\n\n        if (event.key === 'ArrowLeft') {\n            // We need to perform special behaviour when focus reaches the end of the row,\n            // so we don't need default browser behaviour.\n            event.stopPropagation();\n            event.preventDefault();\n            tableMeta.hoverState.pause(true);\n\n            // \"CTRL + ArrowLeft\" or \"META + ArrowLeft\" should focus first focusable element of the row\n            if (event.ctrlKey || event.metaKey) {\n                event.target.blur();\n                focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);\n                lastCellIndex.value = getColumnIndex(focusedElement);\n            } else {\n                // looping backwards\n                focusedElement = focusManager.focusPrevious(FOCUS_MANAGER_OPTIONS);\n\n                if (focusedElement) {\n                    lastCellIndex.value = getColumnIndex(focusedElement);\n                } else {\n                    // there are no previous elements to focus, go up a row (if there are rows above)\n                    if (!isFirstRow || !event.currentTarget.contains(focusedElement)) {\n                        event.preventDefault();\n                        tableMeta.hoverState.pause(true);\n                        tableMeta.currentRow.setCurrentRowIndex(props.index - 1);\n                        setTimeout(() => {\n                            focusedElement = focusManager.focusLast(FOCUS_MANAGER_OPTIONS);\n                            // Need to update lastIndex when row got changed and last element got selected.\n                            lastCellIndex.value = getColumnIndex(focusedElement);\n                        }, 1);\n                    }\n                }\n            }\n        }\n    };\n\n    const handleArrowRightKey = event => {\n        let focusedElement: Element;\n\n        if (event.key === 'ArrowRight') {\n            // We need to perform special behaviour when focus reaches the end of the row,\n            // so we don't need default browser behaviour.\n            event.stopPropagation();\n            event.preventDefault();\n            tableMeta.hoverState.pause(true);\n\n            // \"CTRL + ArrowRight\" or \"META + ArrowRight\" should focus last focusable element of the row\n            if (event.ctrlKey || event.metaKey) {\n                event.target.blur();\n                focusedElement = focusManager.focusLast(FOCUS_MANAGER_OPTIONS);\n                lastCellIndex.value = getColumnIndex(focusedElement);\n            } else {\n                // looping forwards\n                focusedElement = focusManager.focusNext(FOCUS_MANAGER_OPTIONS);\n\n                if (focusedElement) {\n                    lastCellIndex.value = getColumnIndex(focusedElement);\n                } else {\n                    // there are no next elements to focus, go down a row or go outside the table\n                    if (!props.isLastRow && !event.currentTarget.contains(focusedElement)) {\n                        event.preventDefault();\n                        tableMeta.hoverState.pause(true);\n                        tableMeta.currentRow.setCurrentRowIndex(props.index + 1);\n                        setTimeout(() => {\n                            focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);\n                            // Need to update lastIndex when row got changed and last element got selected.\n                            lastCellIndex.value = getColumnIndex(focusedElement);\n                        }, 1);\n                    }\n                }\n            }\n        }\n    };\n\n    React.useEffect(() => {\n        // if some row stuck in hovered state, we heed to unhover it when hover state is paused\n        if (tableMeta.hoverState.isPaused) {\n            unhoverPreviousRow(props.tableRef);\n        }\n    }, [tableMeta.hoverState.isPaused]);\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        if (\n            event.isDefaultPrevented() ||\n            event.isPropagationStopped() ||\n            tableMeta.editing.detailModeEditing ||\n            tableMeta.shortcutsState.isPaused\n        ) {\n            return;\n        }\n\n        onKeyDown(event); // handles tab behaviour\n        handleArrowLeftKey(event);\n        handleArrowRightKey(event);\n    };\n\n    // this ensures we focus either on a field or on the same column when keyboard navigating up/down\n    React.useEffect(() => {\n        // When table in searching state, whe should prevent editing control to be focused, because it will cause search field to loose focus.\n        if (tableMeta.currentRow.currentRowIndex === props.index && !tableMeta.search.isSearching) {\n            if (lastCellIndex.value !== null) {\n                const lastCellElement = props.tableRef.current?.querySelector(\n                    `[role=\"row\"][data-current=\"true\"] [data-column-index=\"${lastCellIndex.value}\"]`\n                );\n                const focusableElement = lastCellElement?.querySelector(focusableSelector);\n                if (focusableElement) {\n                    focusableElement.focus();\n                    // if we found a cell but it doesn't contain focusable element, then we'll focus the first one in a row.\n                } else if (lastCellElement) {\n                    const focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);\n                    lastCellIndex.value = getColumnIndex(focusedElement);\n                }\n            } else {\n                const focusedElement = focusManager.focusFirst(FOCUS_MANAGER_OPTIONS);\n                lastCellIndex.value = getColumnIndex(focusedElement);\n            }\n        }\n        // Need to subscribe to current row index and check is it a current row,\n        // for a situation where hovered row is the next row after current row...\n        // In this case row will not be re-rendered if user switch to next row, because hovered row also renders EditingRow.\n    }, [tableMeta.currentRow.currentRowIndex, tableMeta.search.isSearching]);\n\n    return <MemoedRow {...attributes} onClickCapture={handleClickCapture} onKeyDown={handleKeyDown} />;\n}\n\n// Memoization\n\nexport type MemoedRowProps<TType = unknown> = RowProps<TType> & {\n    'aria-grabbed'?: boolean;\n    'data-current': boolean;\n    'data-selected': boolean;\n    draggable: boolean;\n    index: number;\n};\n\nconst clickableElements = ['input', 'button', 'a', 'select', 'option', 'label', 'textarea'];\n\nconst MemoedRow = React.memo(function MemoedRow<TType = unknown>(props: MemoedRowProps<TType>) {\n    const { index, isLastRow: _1, measureRef, onClick, onClickCapture, onDrop, row, table, tableRef, ...attributes } = props;\n    const ref = React.useRef<HTMLDivElement | null>(null);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const { setIsHovered } = useRowContext();\n\n    // we measure the first cell (since the row has display: contents) so that the virtualiser height is correct\n    React.useEffect(() => {\n        const firstCell = ref.current?.querySelector('[role=cell]:first-child');\n\n        if (firstCell) {\n            measureRef(firstCell as HTMLElement);\n        }\n    }, [ref.current]);\n\n    // we use capture because it also picks up clicks on e.g. select checkboxes\n    const handleClickCapture = (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n        if (typeof onClickCapture === 'function') {\n            onClickCapture(event);\n        }\n\n        // do this in the next frame, otherwise it remounts the row and prevents row actions on hover from being clickable\n        requestAnimationFrame(() => tableMeta.currentRow.setCurrentRowIndex(index));\n    };\n\n    const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        if (typeof onClick === 'function') {\n            const clickedElement = event.target as HTMLElement;\n\n            if (\n                !ref.current?.contains(event.target as HTMLElement) ||\n                clickableElements.includes(clickedElement.tagName.toLowerCase()) ||\n                clickedElement.closest(clickableElements.map(tag => `[role=row] ${tag}`).join(','))\n            ) {\n                return;\n            }\n\n            onClick(row.original);\n        }\n    };\n\n    const handleMouseEnter = () => {\n        // When user moving mouse to fast, then some of the rows are getting stuck in hover state,\n        // because mouseleave event never got triggered, to avoid this to happen we're saving the index of last hovered row,\n        // so that we can unhover it when new row got hovered, and saving it in a variable outside of react to save in performance,\n        // since it would be very performance heavy to use state which is bound to mouse events.\n        if (previouslyHoveredIndex !== undefined) {\n            if (previouslyHoveredIndex !== index) {\n                unhoverPreviousRow(tableRef);\n                previouslyHoveredIndex = index;\n            }\n        } else {\n            previouslyHoveredIndex = index;\n        }\n        setIsHovered(true);\n    };\n    const handleMouseLeave = () => {\n        if (previouslyHoveredIndex === index) {\n            previouslyHoveredIndex = undefined;\n        }\n        setIsHovered(false);\n    };\n\n    const [isDraggedOver, dropTargetProps] = useDropTarget(event => onDrop?.(event, row.original));\n\n    const className = cn(\n        'group/row contents',\n        // resizing column requires dragging, which means the mouse might (on rare occasions) move over rows and trigger hover state\n        // that in turn triggers rendering of e.g. row actions, which could cause janky ui - so don't allow mouse interaction when resizing\n        '[[role=\"table\"][data-resizing=\"true\"]_&]:pointer-events-none',\n        {\n            'hover:cursor-pointer': typeof onClick === 'function',\n        }\n    );\n\n    return (\n        <div\n            {...attributes}\n            {...(onDrop ? dropTargetProps : undefined)}\n            className={className}\n            data-row-index={index}\n            data-dragged-over={isDraggedOver}\n            onClick={handleClick}\n            onClickCapture={handleClickCapture}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n            role=\"row\"\n            ref={ref}\n        />\n    );\n}) as <TType = unknown>(props: MemoedRowProps<TType>) => JSX.Element;\n"],"names":["FOCUS_MANAGER_OPTIONS","tabbable","accept","element","closest","Row","props","focusManager","useFocusManager","tableMeta","table","options","meta","isCurrentRow","currentRow","currentRowIndex","index","isDraggingRow","rowDrag","dragging","row","id","isFirstRow","isHovered","setIsHovered","React","useState","handleKeyDown","event","isDefaultPrevented","isPropagationStopped","key","hoverState","pause","focusedElement","shiftKey","focusPrevious","preventDefault","setCurrentRowIndex","setTimeout","focusLast","focusNext","isLastRow","focusFirst","hasError","Object","keys","_tableMeta$validation","_tableMeta$validation2","validation","errors","length","memoedProps","isEnabled","undefined","getIsSelected","draggable","onClick","rowClick","handleClick","onDrop","rowDrop","handleDrop","onKeyDown","output","MemoedRow","editing","isEditing","isPaused","EditingRow","contextValue","useMemo","rowIndex","RowContext","Provider","value","lastCellIndex","LastCellIndex","previouslyHoveredIndex","unhoverPreviousRow","tableRef","_tableRef$current","mouseoutEvent","MouseEvent","view","window","bubbles","cancelable","previouslyHovered","current","querySelector","dispatchEvent","virtualiser","attributes","handleClickCapture","getColumnIndex","target","handleArrowLeftKey","stopPropagation","ctrlKey","metaKey","blur","currentTarget","contains","handleArrowRightKey","useEffect","detailModeEditing","shortcutsState","search","isSearching","_props$tableRef$curre","lastCellElement","focusableElement","focusableSelector","focus","onClickCapture","clickableElements","memo","_1","measureRef","ref","useRef","useRowContext","firstCell","_ref$current","requestAnimationFrame","_ref$current2","clickedElement","includes","tagName","toLowerCase","map","tag","join","original","handleMouseEnter","handleMouseLeave","isDraggedOver","dropTargetProps","useDropTarget","className","cn","onMouseEnter","onMouseLeave","role"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/rows/RowContext.js

@@ -5,7 +5,8 @@ const RowContext = /*#__PURE__*/React__default.createContext({
   setIsHovered: () => {
     /* empty */
   },
-  rowIndex: 0
+  rowIndex: 0,
+  hasError: false
 });
 const useRowContext = () => React__default.useContext(RowContext);
 

package/dist/esm/packages/taco/src/components/Table3/components/rows/RowContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"RowContext.js","sources":["../../../../../../../../../src/components/Table3/components/rows/RowContext.tsx"],"sourcesContent":["import React from 'react';\n\ntype RowContextValue = {\n    isHovered: boolean;\n    setIsHovered: (value: boolean) => void;\n    rowIndex: number;\n};\n\nexport const RowContext = React.createContext<RowContextValue>({\n    isHovered: false,\n    setIsHovered: () => {\n        /* empty */\n    },\n    rowIndex: 0,\n});\n\nexport const useRowContext = () => React.useContext(RowContext);\n"],"names":["RowContext","React","createContext","isHovered","setIsHovered","rowIndex","useRowContext","useContext"],"mappings":";;MAQaA,UAAU,gBAAGC,cAAK,CAACC,aAAa,CAAkB;EAC3DC,SAAS,EAAE,KAAK;EAChBC,YAAY,EAAEA;;GAEb;EACDC,QAAQ,EAAE;CACb;MAEYC,aAAa,GAAGA,MAAML,cAAK,CAACM,UAAU,CAACP,UAAU;;;;"}
+{"version":3,"file":"RowContext.js","sources":["../../../../../../../../../src/components/Table3/components/rows/RowContext.tsx"],"sourcesContent":["import React from 'react';\n\ntype RowContextValue = {\n    isHovered: boolean;\n    setIsHovered: (value: boolean) => void;\n    rowIndex: number;\n    hasError: boolean;\n};\n\nexport const RowContext = React.createContext<RowContextValue>({\n    isHovered: false,\n    setIsHovered: () => {\n        /* empty */\n    },\n    rowIndex: 0,\n    hasError: false,\n});\n\nexport const useRowContext = () => React.useContext(RowContext);\n"],"names":["RowContext","React","createContext","isHovered","setIsHovered","rowIndex","hasError","useRowContext","useContext"],"mappings":";;MASaA,UAAU,gBAAGC,cAAK,CAACC,aAAa,CAAkB;EAC3DC,SAAS,EAAE,KAAK;EAChBC,YAAY,EAAEA;;GAEb;EACDC,QAAQ,EAAE,CAAC;EACXC,QAAQ,EAAE;CACb;MAEYC,aAAa,GAAGA,MAAMN,cAAK,CAACO,UAAU,CAACR,UAAU;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/Filters.js

@@ -41,7 +41,7 @@ function FiltersButton(props) {
     (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.click();
   });
   // state, since we "apply" filters
-  const [filters, setFilters] = React__default.useState(table.getState().columnFilters);
+  const [filters, setFilters] = React__default.useState(appliedFilters);
   const [placeholderCount, setPlaceholderCount] = React__default.useState(1);
   // filters
   const handleChangeFilter = (currentId, filter) => {
@@ -98,6 +98,13 @@ function FiltersButton(props) {
     setFilters([]);
     setPlaceholderCount(1);
   };
+  // Because filters can be reset from outside
+  React__default.useEffect(() => {
+    if (appliedFilters.length === 0) {
+      setFilters([]);
+      setPlaceholderCount(1);
+    }
+  }, [appliedFilters]);
   const buttonProps = {
     'aria-label': texts.table3.filters.tooltip,
     className: cn({

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/Filter/filters/Filters.js.map

@@ -1 +1 @@
-{"version":3,"file":"Filters.js","sources":["../../../../../../../../../../../src/components/Table3/components/toolbar/Filter/filters/Filters.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Table as RTable, Column as RTColumn } from '@tanstack/react-table';\nimport { Button } from '../../../../../Button/Button';\nimport { Icon } from '../../../../../Icon/Icon';\nimport { Popover } from '../../../../../Popover/Popover';\nimport { Table3FilterValue, Table3FilterComparator, Table3Filter, ColumnFilter } from '../../../../types';\nimport { Shortcut } from '../../../../../Shortcut/Shortcut';\nimport { useGlobalKeyDown } from '../../../../../../hooks/useGlobalKeyDown';\nimport { useLocalization } from '../../../../../Provider/Localization';\nimport { isInternalColumn } from '../../../../util/columns';\nimport { Placeholder } from './components/Placeholder';\nimport { Filter } from './components/Filter';\nimport { Group } from '../../../../../Group/Group';\nimport { useIsLargeScreen } from '../../../../../../hooks/useIsLargeScreen';\nimport { IconButton } from '../../../../../IconButton/IconButton';\n\nfunction sortByHeader<TType = unknown>(a: RTColumn<TType>, b: RTColumn<TType>) {\n    return (a.columnDef.meta?.header as string)?.localeCompare?.(b.columnDef.meta?.header as string);\n}\n\nexport type FiltersProps<TType = unknown> = {\n    total: number;\n    table: RTable<TType>;\n};\n\nexport function FiltersButton<TType = unknown>(props: FiltersProps<TType>) {\n    const { total, table } = props;\n    const { locale, texts } = useLocalization();\n    const ref = React.useRef<HTMLButtonElement>(null);\n    const isLargeScreen = useIsLargeScreen();\n    const allColumns = table\n        .getAllLeafColumns()\n        .filter(column => !isInternalColumn(column.id))\n        .sort(sortByHeader);\n    const appliedFilters = table.getState().columnFilters;\n\n    useGlobalKeyDown({ key: 'f', meta: true, shift: true }, (event: KeyboardEvent) => {\n        event.preventDefault();\n        ref.current?.click();\n    });\n\n    // state, since we \"apply\" filters\n    const [filters, setFilters] = React.useState<Table3Filter[]>(table.getState().columnFilters as Table3Filter[]);\n    const [placeholderCount, setPlaceholderCount] = React.useState(1);\n\n    // filters\n    const handleChangeFilter = (currentId: string | null, filter: { id: string | null; value: Table3FilterValue }) => {\n        setFilters(currentFilters => {\n            const nextFilters = [...currentFilters];\n            const index = nextFilters.findIndex(f => f.id === currentId);\n            nextFilters[index] = filter;\n            return nextFilters;\n        });\n    };\n\n    const handleRemoveFilter = (columnId: string | null) => {\n        if (filters.length === 1 && placeholderCount === 0) {\n            setPlaceholderCount(count => count + 1);\n        }\n\n        setFilters(currentFilters => currentFilters.filter(f => f.id !== columnId));\n    };\n\n    // placeholders\n    const handleCreateFilterFromPlaceholder = (columnId: string) => {\n        setFilters(currentFilters => [\n            ...currentFilters,\n            {\n                id: columnId,\n                value: {\n                    comparator: Table3FilterComparator.Contains,\n                    value: undefined,\n                },\n            },\n        ]);\n        handleRemovePlaceholder();\n    };\n\n    const handleCreatePlaceholder = () => {\n        setPlaceholderCount(count => count + 1);\n    };\n\n    const handleRemovePlaceholder = () => {\n        setPlaceholderCount(count => count - 1);\n    };\n\n    //\n    const handleApply = () => {\n        table.setColumnFilters(() => {\n            const newFilters = filters.filter(f => {\n                if (f.id === null) {\n                    return false;\n                }\n\n                const controlRenderer = (allColumns.find(c => c.id === f.id) as RTColumn<TType, unknown>)?.columnDef.meta\n                    ?.control;\n                if (\n                    f.value.comparator === Table3FilterComparator.IsEmpty ||\n                    f.value.comparator === Table3FilterComparator.IsNotEmpty ||\n                    controlRenderer === 'switch'\n                ) {\n                    return true;\n                }\n                return !!f.value.value;\n            });\n            // Compiler didn't get that we stripped out filters with null ids, so we still need to cast a ColumnFilter type here\n            return newFilters as ColumnFilter[];\n        });\n    };\n\n    const handleClear = () => {\n        table.resetColumnFilters();\n        setFilters([]);\n        setPlaceholderCount(1);\n    };\n\n    const buttonProps = {\n        'aria-label': texts.table3.filters.tooltip,\n        className: cn({ '!wcag-blue-100': appliedFilters.length }),\n        popover: popoverProps => (\n            <Popover {...popoverProps}>\n                <Popover.Content>\n                    <div className=\"flex w-[40rem] flex-col gap-4\">\n                        <div className=\"flex h-8\">\n                            <div className=\"flex w-full items-center gap-2\">\n                                <h4 className=\"mb-0 inline-flex\">{texts.table3.filters.button}</h4>\n                                <p className=\"text-grey-700 mb-0 mr-auto mt-px inline-flex\">\n                                    {texts.table3.filters.total\n                                        .replace(\n                                            '[CURRENT]',\n                                            new Intl.NumberFormat(locale).format(table.getFilteredRowModel().rows.length)\n                                        )\n                                        .replace('[TOTAL]', new Intl.NumberFormat(locale).format(total))}\n                                </p>\n                            </div>\n                        </div>\n                        <div className=\"flex flex-col gap-2\">\n                            {filters.map((filter, index) => (\n                                <Filter\n                                    key={`filter_${index}`}\n                                    allColumns={allColumns as RTColumn<unknown, unknown>[]}\n                                    filter={filter}\n                                    filters={filters}\n                                    position={index}\n                                    onChange={handleChangeFilter}\n                                    onRemove={handleRemoveFilter}\n                                />\n                            ))}\n                            {[...Array(placeholderCount)].map((_, index) => (\n                                <Placeholder\n                                    key={`placeholder_${index}`}\n                                    allColumns={allColumns as RTColumn<unknown, unknown>[]}\n                                    filters={filters}\n                                    position={filters.length + index}\n                                    onCreate={handleCreateFilterFromPlaceholder as any}\n                                    onRemove={placeholderCount > 1 || filters.length > 0 ? handleRemovePlaceholder : undefined}\n                                />\n                            ))}\n                            <div className=\"justify-start\">\n                                <Button appearance=\"discrete\" onClick={handleCreatePlaceholder}>\n                                    + {texts.table3.filters.buttons.addFilter}\n                                </Button>\n                            </div>\n                        </div>\n                        <Group className=\"ml-auto\">\n                            <Popover.Close>\n                                <Button>Cancel</Button>\n                            </Popover.Close>\n                            <Button onClick={handleClear}>Clear</Button>\n                            <Button appearance=\"primary\" onClick={handleApply}>\n                                Apply\n                            </Button>\n                        </Group>\n                    </div>\n                </Popover.Content>\n            </Popover>\n        ),\n        ref,\n        tooltip: (\n            <>\n                {texts.table3.filters.tooltip}\n                <Shortcut className=\"ml-2\" keys={{ key: 'f', meta: true, shift: true }} />\n            </>\n        ),\n    };\n\n    if (!isLargeScreen && !appliedFilters.length) {\n        return <IconButton {...buttonProps} icon=\"filter\" />;\n    }\n    return (\n        <Button {...buttonProps}>\n            <Icon className={cn({ '-mr-1.5': !isLargeScreen })} name={appliedFilters.length ? 'filter-solid' : 'filter'} />\n            {isLargeScreen ? texts.table3.filters.button : ''}\n            {appliedFilters.length ? `(${appliedFilters.length})` : ''}\n        </Button>\n    );\n}\n"],"names":["sortByHeader","a","b","_a$columnDef$meta","columnDef","meta","_a$columnDef$meta$hea","header","_a$columnDef$meta$hea2","localeCompare","call","_b$columnDef$meta","FiltersButton","props","total","table","locale","texts","useLocalization","ref","React","useRef","isLargeScreen","useIsLargeScreen","allColumns","getAllLeafColumns","filter","column","isInternalColumn","id","sort","appliedFilters","getState","columnFilters","useGlobalKeyDown","key","shift","event","preventDefault","_ref$current","current","click","filters","setFilters","useState","placeholderCount","setPlaceholderCount","handleChangeFilter","currentId","currentFilters","nextFilters","index","findIndex","f","handleRemoveFilter","columnId","length","count","handleCreateFilterFromPlaceholder","value","comparator","Table3FilterComparator","Contains","undefined","handleRemovePlaceholder","handleCreatePlaceholder","handleApply","setColumnFilters","newFilters","controlRenderer","_allColumns$find","find","c","_allColumns$find$colu","control","IsEmpty","IsNotEmpty","handleClear","resetColumnFilters","buttonProps","table3","tooltip","className","cn","popover","popoverProps","Popover","Content","button","replace","Intl","NumberFormat","format","getFilteredRowModel","rows","map","Filter","position","onChange","onRemove","Array","_","Placeholder","onCreate","Button","appearance","onClick","buttons","addFilter","Group","Close","Shortcut","keys","IconButton","icon","Icon","name"],"mappings":"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"}
+{"version":3,"file":"Filters.js","sources":["../../../../../../../../../../../src/components/Table3/components/toolbar/Filter/filters/Filters.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Table as RTable, Column as RTColumn } from '@tanstack/react-table';\nimport { Button } from '../../../../../Button/Button';\nimport { Icon } from '../../../../../Icon/Icon';\nimport { Popover } from '../../../../../Popover/Popover';\nimport { Table3FilterValue, Table3FilterComparator, Table3Filter, ColumnFilter } from '../../../../types';\nimport { Shortcut } from '../../../../../Shortcut/Shortcut';\nimport { useGlobalKeyDown } from '../../../../../../hooks/useGlobalKeyDown';\nimport { useLocalization } from '../../../../../Provider/Localization';\nimport { isInternalColumn } from '../../../../util/columns';\nimport { Placeholder } from './components/Placeholder';\nimport { Filter } from './components/Filter';\nimport { Group } from '../../../../../Group/Group';\nimport { useIsLargeScreen } from '../../../../../../hooks/useIsLargeScreen';\nimport { IconButton } from '../../../../../IconButton/IconButton';\n\nfunction sortByHeader<TType = unknown>(a: RTColumn<TType>, b: RTColumn<TType>) {\n    return (a.columnDef.meta?.header as string)?.localeCompare?.(b.columnDef.meta?.header as string);\n}\n\nexport type FiltersProps<TType = unknown> = {\n    total: number;\n    table: RTable<TType>;\n};\n\nexport function FiltersButton<TType = unknown>(props: FiltersProps<TType>) {\n    const { total, table } = props;\n    const { locale, texts } = useLocalization();\n    const ref = React.useRef<HTMLButtonElement>(null);\n    const isLargeScreen = useIsLargeScreen();\n    const allColumns = table\n        .getAllLeafColumns()\n        .filter(column => !isInternalColumn(column.id))\n        .sort(sortByHeader);\n    const appliedFilters = table.getState().columnFilters as Table3Filter[];\n\n    useGlobalKeyDown({ key: 'f', meta: true, shift: true }, (event: KeyboardEvent) => {\n        event.preventDefault();\n        ref.current?.click();\n    });\n\n    // state, since we \"apply\" filters\n    const [filters, setFilters] = React.useState<Table3Filter[]>(appliedFilters);\n    const [placeholderCount, setPlaceholderCount] = React.useState(1);\n\n    // filters\n    const handleChangeFilter = (currentId: string | null, filter: { id: string | null; value: Table3FilterValue }) => {\n        setFilters(currentFilters => {\n            const nextFilters = [...currentFilters];\n            const index = nextFilters.findIndex(f => f.id === currentId);\n            nextFilters[index] = filter;\n            return nextFilters;\n        });\n    };\n\n    const handleRemoveFilter = (columnId: string | null) => {\n        if (filters.length === 1 && placeholderCount === 0) {\n            setPlaceholderCount(count => count + 1);\n        }\n\n        setFilters(currentFilters => currentFilters.filter(f => f.id !== columnId));\n    };\n\n    // placeholders\n    const handleCreateFilterFromPlaceholder = (columnId: string) => {\n        setFilters(currentFilters => [\n            ...currentFilters,\n            {\n                id: columnId,\n                value: {\n                    comparator: Table3FilterComparator.Contains,\n                    value: undefined,\n                },\n            },\n        ]);\n        handleRemovePlaceholder();\n    };\n\n    const handleCreatePlaceholder = () => {\n        setPlaceholderCount(count => count + 1);\n    };\n\n    const handleRemovePlaceholder = () => {\n        setPlaceholderCount(count => count - 1);\n    };\n\n    //\n    const handleApply = () => {\n        table.setColumnFilters(() => {\n            const newFilters = filters.filter(f => {\n                if (f.id === null) {\n                    return false;\n                }\n\n                const controlRenderer = (allColumns.find(c => c.id === f.id) as RTColumn<TType, unknown>)?.columnDef.meta\n                    ?.control;\n                if (\n                    f.value.comparator === Table3FilterComparator.IsEmpty ||\n                    f.value.comparator === Table3FilterComparator.IsNotEmpty ||\n                    controlRenderer === 'switch'\n                ) {\n                    return true;\n                }\n                return !!f.value.value;\n            });\n            // Compiler didn't get that we stripped out filters with null ids, so we still need to cast a ColumnFilter type here\n            return newFilters as ColumnFilter[];\n        });\n    };\n\n    const handleClear = () => {\n        table.resetColumnFilters();\n        setFilters([]);\n        setPlaceholderCount(1);\n    };\n\n    // Because filters can be reset from outside\n    React.useEffect(() => {\n        if (appliedFilters.length === 0) {\n            setFilters([]);\n            setPlaceholderCount(1);\n        }\n    }, [appliedFilters]);\n\n    const buttonProps = {\n        'aria-label': texts.table3.filters.tooltip,\n        className: cn({ '!wcag-blue-100': appliedFilters.length }),\n        popover: popoverProps => (\n            <Popover {...popoverProps}>\n                <Popover.Content>\n                    <div className=\"flex w-[40rem] flex-col gap-4\">\n                        <div className=\"flex h-8\">\n                            <div className=\"flex w-full items-center gap-2\">\n                                <h4 className=\"mb-0 inline-flex\">{texts.table3.filters.button}</h4>\n                                <p className=\"text-grey-700 mb-0 mr-auto mt-px inline-flex\">\n                                    {texts.table3.filters.total\n                                        .replace(\n                                            '[CURRENT]',\n                                            new Intl.NumberFormat(locale).format(table.getFilteredRowModel().rows.length)\n                                        )\n                                        .replace('[TOTAL]', new Intl.NumberFormat(locale).format(total))}\n                                </p>\n                            </div>\n                        </div>\n                        <div className=\"flex flex-col gap-2\">\n                            {filters.map((filter, index) => (\n                                <Filter\n                                    key={`filter_${index}`}\n                                    allColumns={allColumns as RTColumn<unknown, unknown>[]}\n                                    filter={filter}\n                                    filters={filters}\n                                    position={index}\n                                    onChange={handleChangeFilter}\n                                    onRemove={handleRemoveFilter}\n                                />\n                            ))}\n                            {[...Array(placeholderCount)].map((_, index) => (\n                                <Placeholder\n                                    key={`placeholder_${index}`}\n                                    allColumns={allColumns as RTColumn<unknown, unknown>[]}\n                                    filters={filters}\n                                    position={filters.length + index}\n                                    onCreate={handleCreateFilterFromPlaceholder as any}\n                                    onRemove={placeholderCount > 1 || filters.length > 0 ? handleRemovePlaceholder : undefined}\n                                />\n                            ))}\n                            <div className=\"justify-start\">\n                                <Button appearance=\"discrete\" onClick={handleCreatePlaceholder}>\n                                    + {texts.table3.filters.buttons.addFilter}\n                                </Button>\n                            </div>\n                        </div>\n                        <Group className=\"ml-auto\">\n                            <Popover.Close>\n                                <Button>Cancel</Button>\n                            </Popover.Close>\n                            <Button onClick={handleClear}>Clear</Button>\n                            <Button appearance=\"primary\" onClick={handleApply}>\n                                Apply\n                            </Button>\n                        </Group>\n                    </div>\n                </Popover.Content>\n            </Popover>\n        ),\n        ref,\n        tooltip: (\n            <>\n                {texts.table3.filters.tooltip}\n                <Shortcut className=\"ml-2\" keys={{ key: 'f', meta: true, shift: true }} />\n            </>\n        ),\n    };\n\n    if (!isLargeScreen && !appliedFilters.length) {\n        return <IconButton {...buttonProps} icon=\"filter\" />;\n    }\n    return (\n        <Button {...buttonProps}>\n            <Icon className={cn({ '-mr-1.5': !isLargeScreen })} name={appliedFilters.length ? 'filter-solid' : 'filter'} />\n            {isLargeScreen ? texts.table3.filters.button : ''}\n            {appliedFilters.length ? `(${appliedFilters.length})` : ''}\n        </Button>\n    );\n}\n"],"names":["sortByHeader","a","b","_a$columnDef$meta","columnDef","meta","_a$columnDef$meta$hea","header","_a$columnDef$meta$hea2","localeCompare","call","_b$columnDef$meta","FiltersButton","props","total","table","locale","texts","useLocalization","ref","React","useRef","isLargeScreen","useIsLargeScreen","allColumns","getAllLeafColumns","filter","column","isInternalColumn","id","sort","appliedFilters","getState","columnFilters","useGlobalKeyDown","key","shift","event","preventDefault","_ref$current","current","click","filters","setFilters","useState","placeholderCount","setPlaceholderCount","handleChangeFilter","currentId","currentFilters","nextFilters","index","findIndex","f","handleRemoveFilter","columnId","length","count","handleCreateFilterFromPlaceholder","value","comparator","Table3FilterComparator","Contains","undefined","handleRemovePlaceholder","handleCreatePlaceholder","handleApply","setColumnFilters","newFilters","controlRenderer","_allColumns$find","find","c","_allColumns$find$colu","control","IsEmpty","IsNotEmpty","handleClear","resetColumnFilters","useEffect","buttonProps","table3","tooltip","className","cn","popover","popoverProps","Popover","Content","button","replace","Intl","NumberFormat","format","getFilteredRowModel","rows","map","Filter","position","onChange","onRemove","Array","_","Placeholder","onCreate","Button","appearance","onClick","buttons","addFilter","Group","Close","Shortcut","keys","IconButton","icon","Icon","name"],"mappings":"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"}