koval-ui/dist/src/lib/DataTable/cells/ColumnHeaderCell.cjs.map

React components collection with minimalistic design. Supports theming, layout, and input validation.

{"version":3,"file":"ColumnHeaderCell.cjs","sources":["../../../../../src/lib/DataTable/cells/ColumnHeaderCell.tsx"],"sourcesContent":["import type {ComponentProps, FC, ReactNode} from 'react';\nimport {useCallback, useState, useMemo} from 'react';\n\nimport {\n    IconEllipsisVertical,\n    IconPinRight,\n    IconPinLeft,\n    IconUnPin,\n    IconFilter,\n    IconSortAsc,\n    IconSortDesc,\n    IconSortOff,\n} from '@/internal/Icons';\nimport {MenuActions} from '@/lib/Menu';\nimport {useDialogState} from '@/lib/Dialog';\n\nimport type {HeaderCell} from './../types.ts';\nimport classes from './Cells.module.css';\n\nexport type Props = ComponentProps<HeaderCell> & {\n    children?: ReactNode;\n};\n\nexport const ColumnHeaderCell: FC<Props> = ({title, headerContext}) => {\n    const [isOpen, setOpen] = useState(false);\n    const handleClick = useCallback(() => {\n        setOpen(!isOpen);\n    }, [isOpen]);\n    const handleToggle = useCallback(\n        (openState: boolean) => {\n            setOpen(openState);\n        },\n        [setOpen]\n    );\n    const isPinned = headerContext.column.getIsPinned();\n\n    const isSorted = headerContext.column.getIsSorted();\n\n    const hasFilter = headerContext.column.getIsFiltered();\n\n    const {openDialog} = useDialogState(headerContext.table.options.meta?.filterModalId as string);\n\n    const actions = useMemo(\n        () => [\n            {\n                title: hasFilter ? 'Edit filter' : 'Filter column',\n                icon: IconFilter,\n                onClick: () => {\n                    openDialog({columnId: headerContext.column.id});\n                    setOpen(false);\n                },\n            },\n            {\n                title: isSorted !== 'asc' ? 'Sort ascending' : 'Clear ascending',\n                icon: isSorted !== 'asc' ? IconSortAsc : IconSortOff,\n                onClick: () => {\n                    isSorted !== 'asc' &&\n                        headerContext.table.setSorting([\n                            {desc: false, id: headerContext.column.id},\n                        ]);\n                    isSorted === 'asc' && headerContext.column.clearSorting();\n                    setOpen(false);\n                },\n            },\n            {\n                title: isSorted !== 'desc' ? 'Sort descending' : 'Clear descending',\n                icon: isSorted !== 'desc' ? IconSortDesc : IconSortOff,\n                onClick: () => {\n                    isSorted !== 'desc' &&\n                        headerContext.table.setSorting([{desc: true, id: headerContext.column.id}]);\n                    isSorted === 'desc' && headerContext.column.clearSorting();\n                    setOpen(false);\n                },\n            },\n            {\n                title: isPinned !== 'left' ? 'Pin left' : 'Unpin left',\n                icon: isPinned !== 'left' ? IconPinLeft : IconUnPin,\n                onClick: () => {\n                    setOpen(false);\n                    if (isPinned !== 'left') {\n                        headerContext.column.pin('left');\n                    } else {\n                        headerContext.column.pin(false);\n                    }\n                },\n            },\n            {\n                title: isPinned !== 'right' ? 'Pin right' : 'Unpin right',\n                icon: isPinned !== 'right' ? IconPinRight : IconUnPin,\n                onClick: () => {\n                    setOpen(false);\n                    if (isPinned !== 'right') {\n                        headerContext.column.pin('right');\n                    } else {\n                        headerContext.column.pin(false);\n                    }\n                },\n            },\n        ],\n        [hasFilter, headerContext.column, headerContext.table, isPinned, isSorted, openDialog]\n    );\n    return (\n        <div className={classes.headerCell}>\n            <div className={classes.columnTitle}>{title}</div>\n\n            <div className={classes.columnActions}>\n                <MenuActions\n                    allowedPlacements={['bottom', 'bottom-end', 'bottom-start']}\n                    variant=\"plain\"\n                    actions={actions}\n                    isOpen={isOpen}\n                    onToggle={handleToggle}>\n                    <button className={classes.actionsButton} onClick={handleClick}>\n                        <IconEllipsisVertical className={classes.actionsIcon} />\n                    </button>\n                </MenuActions>\n            </div>\n        </div>\n    );\n};\n"],"names":["ColumnHeaderCell","title","headerContext","isOpen","setOpen","useState","handleClick","useCallback","handleToggle","openState","isPinned","isSorted","hasFilter","openDialog","useDialogState","_a","actions","useMemo","IconFilter","IconSortAsc","IconSortOff","IconSortDesc","IconPinLeft","IconUnPin","IconPinRight","jsxs","classes","jsx","MenuActions","IconEllipsisVertical"],"mappings":"8rBAuBaA,EAA8B,CAAC,CAAC,MAAAC,EAAO,cAAAC,KAAmB,OACnE,KAAM,CAACC,EAAQC,CAAO,EAAIC,EAAAA,SAAS,EAAK,EAClCC,EAAcC,EAAAA,YAAY,IAAM,CAClCH,EAAQ,CAACD,CAAM,CAAA,EAChB,CAACA,CAAM,CAAC,EACLK,EAAeD,EAAA,YAChBE,GAAuB,CACpBL,EAAQK,CAAS,CACrB,EACA,CAACL,CAAO,CACZ,EACMM,EAAWR,EAAc,OAAO,YAAY,EAE5CS,EAAWT,EAAc,OAAO,YAAY,EAE5CU,EAAYV,EAAc,OAAO,cAAc,EAE/C,CAAC,WAAAW,CAAc,EAAAC,kBAAeC,EAAAb,EAAc,MAAM,QAAQ,OAA5B,YAAAa,EAAkC,aAAuB,EAEvFC,EAAUC,EAAA,QACZ,IAAM,CACF,CACI,MAAOL,EAAY,cAAgB,gBACnC,KAAMM,EAAA,WACN,QAAS,IAAM,CACXL,EAAW,CAAC,SAAUX,EAAc,OAAO,GAAG,EAC9CE,EAAQ,EAAK,CAAA,CAErB,EACA,CACI,MAAOO,IAAa,MAAQ,iBAAmB,kBAC/C,KAAMA,IAAa,MAAQQ,EAAAA,YAAcC,EAAA,YACzC,QAAS,IAAM,CACET,IAAA,OACTT,EAAc,MAAM,WAAW,CAC3B,CAAC,KAAM,GAAO,GAAIA,EAAc,OAAO,EAAE,CAAA,CAC5C,EACQS,IAAA,OAAST,EAAc,OAAO,aAAa,EACxDE,EAAQ,EAAK,CAAA,CAErB,EACA,CACI,MAAOO,IAAa,OAAS,kBAAoB,mBACjD,KAAMA,IAAa,OAASU,EAAAA,aAAeD,EAAA,YAC3C,QAAS,IAAM,CACXT,IAAa,QACTT,EAAc,MAAM,WAAW,CAAC,CAAC,KAAM,GAAM,GAAIA,EAAc,OAAO,EAAG,CAAA,CAAC,EACjES,IAAA,QAAUT,EAAc,OAAO,aAAa,EACzDE,EAAQ,EAAK,CAAA,CAErB,EACA,CACI,MAAOM,IAAa,OAAS,WAAa,aAC1C,KAAMA,IAAa,OAASY,EAAAA,YAAcC,EAAA,UAC1C,QAAS,IAAM,CACXnB,EAAQ,EAAK,EACTM,IAAa,OACCR,EAAA,OAAO,IAAI,MAAM,EAEjBA,EAAA,OAAO,IAAI,EAAK,CAClC,CAER,EACA,CACI,MAAOQ,IAAa,QAAU,YAAc,cAC5C,KAAMA,IAAa,QAAUc,EAAAA,aAAeD,EAAA,UAC5C,QAAS,IAAM,CACXnB,EAAQ,EAAK,EACTM,IAAa,QACCR,EAAA,OAAO,IAAI,OAAO,EAElBA,EAAA,OAAO,IAAI,EAAK,CAClC,CACJ,CAER,EACA,CAACU,EAAWV,EAAc,OAAQA,EAAc,MAAOQ,EAAUC,EAAUE,CAAU,CACzF,EACA,OACKY,EAAAA,KAAA,MAAA,CAAI,UAAWC,EAAA,QAAQ,WACpB,SAAA,CAAAC,EAAA,IAAC,MAAI,CAAA,UAAWD,EAAQ,QAAA,YAAc,SAAMzB,EAAA,EAE3C0B,EAAA,IAAA,MAAA,CAAI,UAAWD,EAAAA,QAAQ,cACpB,SAAAC,EAAA,IAACC,EAAA,YAAA,CACG,kBAAmB,CAAC,SAAU,aAAc,cAAc,EAC1D,QAAQ,QACR,QAAAZ,EACA,OAAAb,EACA,SAAUK,EACV,SAACmB,EAAA,IAAA,SAAA,CAAO,UAAWD,EAAAA,QAAQ,cAAe,QAASpB,EAC/C,SAAAqB,EAAA,IAACE,uBAAqB,CAAA,UAAWH,EAAQ,QAAA,WAAA,CAAa,CAC1D,CAAA,CAAA,CAAA,CAER,CAAA,CAAA,EACJ,CAER"}