{"version":3,"file":"TableHead.mjs","names":[],"sources":["../../../src/base-ui/Table/TableHead.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { ChevronDown, ChevronUp } from 'lucide-react';\nimport type { CSSProperties, ReactNode } from 'react';\n\nimport Icon from '@/Icon';\n\nimport { styles } from './style';\nimport type { TableColumn, TableProps } from './type';\n\ntype SortState = false | 'asc' | 'desc';\n\ninterface HeadColumn {\n  getIsSorted: () => SortState;\n  getToggleSortingHandler: () => undefined | ((event: unknown) => void);\n}\n\ninterface TableHeadProps<T> {\n  classNames?: TableProps<T>['classNames'];\n  columnIds: string[];\n  columns: TableColumn<T>[];\n  fixedOffsets: (CSSProperties | undefined)[];\n  getColumn: (id: string) => HeadColumn | undefined;\n  renderFilter?: (column: TableColumn<T>, id: string) => ReactNode;\n  styles?: TableProps<T>['styles'];\n}\n\nconst ariaSortOf = (sorted: SortState) =>\n  sorted === 'asc' ? 'ascending' : sorted === 'desc' ? 'descending' : 'none';\n\nconst TableHead = <T,>({\n  classNames,\n  columnIds,\n  columns,\n  fixedOffsets,\n  getColumn,\n  renderFilter,\n  styles: customStyles,\n}: TableHeadProps<T>) => (\n  <thead>\n    <tr>\n      {columns.map((column, index) => {\n        const id = columnIds[index];\n        const tableColumn = getColumn(id);\n        const sorted: SortState = column.sorter ? (tableColumn?.getIsSorted() ?? false) : false;\n\n        return (\n          <th\n            aria-sort={column.sorter ? ariaSortOf(sorted) : undefined}\n            key={id}\n            scope=\"col\"\n            className={cx(\n              styles.header,\n              column.fixed && styles.fixed,\n              column.className,\n              classNames?.header,\n            )}\n            style={{\n              textAlign: column.align,\n              width: column.width,\n              ...fixedOffsets[index],\n              ...customStyles?.header,\n              ...(column.fixed ? { zIndex: 3 } : undefined),\n            }}\n          >\n            <span className={styles.headerInner}>\n              {column.sorter ? (\n                <button\n                  className={styles.sortButton}\n                  type=\"button\"\n                  onClick={tableColumn?.getToggleSortingHandler()}\n                >\n                  {column.title}\n                  <span aria-hidden=\"true\" className={styles.sortCaret}>\n                    <Icon data-active={sorted === 'asc'} icon={ChevronUp} size={10} />\n                    <Icon data-active={sorted === 'desc'} icon={ChevronDown} size={10} />\n                  </span>\n                </button>\n              ) : (\n                column.title\n              )}\n              {column.filters?.length ? renderFilter?.(column, id) : null}\n            </span>\n          </th>\n        );\n      })}\n    </tr>\n  </thead>\n);\n\nexport default TableHead;\n"],"mappings":";;;;;;;AA4BA,MAAM,cAAc,WAClB,WAAW,QAAQ,cAAc,WAAW,SAAS,eAAe;AAEtE,MAAM,aAAiB,EACrB,YACA,WACA,SACA,cACA,WACA,cACA,QAAQ,mBAER,oBAAC,SAAD,EAAA,UACE,oBAAC,MAAD,EAAA,UACG,QAAQ,KAAK,QAAQ,UAAU;CAC9B,MAAM,KAAK,UAAU;CACrB,MAAM,cAAc,UAAU,EAAE;CAChC,MAAM,SAAoB,OAAO,SAAU,aAAa,YAAY,KAAK,QAAS;CAElF,OACE,oBAAC,MAAD;EACE,aAAW,OAAO,SAAS,WAAW,MAAM,IAAI,KAAA;EAEhD,OAAM;EACN,WAAW,GACT,OAAO,QACP,OAAO,SAAS,OAAO,OACvB,OAAO,WACP,YAAY,MACd;EACA,OAAO;GACL,WAAW,OAAO;GAClB,OAAO,OAAO;GACd,GAAG,aAAa;GAChB,GAAG,cAAc;GACjB,GAAI,OAAO,QAAQ,EAAE,QAAQ,EAAE,IAAI,KAAA;EACrC;EAEA,UAAA,qBAAC,QAAD;GAAM,WAAW,OAAO;GAAxB,UAAA,CACG,OAAO,SACN,qBAAC,UAAD;IACE,WAAW,OAAO;IAClB,MAAK;IACL,SAAS,aAAa,wBAAwB;IAHhD,UAAA,CAKG,OAAO,OACR,qBAAC,QAAD;KAAM,eAAY;KAAO,WAAW,OAAO;KAA3C,UAAA,CACE,oBAAC,MAAD;MAAM,eAAa,WAAW;MAAO,MAAM;MAAW,MAAM;KAAK,CAAA,GACjE,oBAAC,MAAD;MAAM,eAAa,WAAW;MAAQ,MAAM;MAAa,MAAM;KAAK,CAAA,CAChE;IACA,CAAA,CAAA;GAER,CAAA,IAAA,OAAO,OAER,OAAO,SAAS,SAAS,eAAe,QAAQ,EAAE,IAAI,IACnD;;CACJ,GAlCG,EAkCH;AAER,CAAC,EACC,CAAA,EACC,CAAA"}