diff --git a/packages/table/src/core/Cell/useRenderContent.ts b/packages/table/src/core/Cell/useRenderContent.ts index 4178c3a3..204c8959 100644 --- a/packages/table/src/core/Cell/useRenderContent.ts +++ b/packages/table/src/core/Cell/useRenderContent.ts @@ -1,6 +1,5 @@ import * as React from 'react'; - -import { useOnEventOutside } from '@devoinc/genesys-ui'; +import { useClickAway } from 'ahooks'; import type { TColDef, TRow, TRowDef } from '../../declarations'; import { TableContext } from '../../context'; @@ -10,7 +9,7 @@ export const useRenderContent = ( data: unknown, rowIndex: number, row: TRow, - rowDef: TRowDef + rowDef: TRowDef, ) => { const { onCellDataChange } = React.useContext(TableContext); const cellRef = React.useRef(); @@ -44,12 +43,9 @@ export const useRenderContent = ( [colDef.editable], ); - useOnEventOutside({ - references: [cellRef, editionContent, viewContent], - handler: () => { - setIsEditMode(false); - }, - }); + useClickAway(() => { + setIsEditMode(false); + }, [cellRef]); return { cellRef, diff --git a/packages/table/src/editors/Table.stories.tsx b/packages/table/src/editors/Table.stories.tsx index 19236d87..66965cea 100644 --- a/packages/table/src/editors/Table.stories.tsx +++ b/packages/table/src/editors/Table.stories.tsx @@ -30,7 +30,7 @@ const data = Holo.of() Holo.chance.pickone(['read', 'view', 'inProgress', 'completed']), picture: 'avatar', }) - .repeat(9) + .repeat(1) .generate(); const colDefs: TColDef = [ @@ -79,9 +79,10 @@ const colDefs: TColDef = [ id={'test'} label={'custom'} placeholder={'custom'} + hideLabel menuAppendToBody onChange={(event) => { - onChange(event.value) + onChange(event.value); }} options={getSelectOptions(options)} value={String(value)}