element-plus/es/components/table-v2/src/renderers/header-cell.mjs.map

A Component Library for Vue 3

{"version":3,"file":"header-cell.mjs","names":["renderSlot","createVNode","_createVNode","mergeProps","_mergeProps","HeaderCell","SortIcon","Alignment","SortOrder","oppositeOrderMap","placeholderSign","componentToSlot","enforceUnit","tryCall","HeaderCellRenderer","props","slots","column","ns","t","style","onColumnSorted","cellStyle","em","headerCellRenderer","headerClass","sortable","cellProps","class","e","columnCellRenderer","Cell","sortBy","sortState","headerCellProps","sorting","sortOrder","ariaSort","order","key","Boolean","ASC","DESC","undefined","cellKls","align","CENTER","is","RIGHT","cellWrapperProps","onClick","title"],"sources":["../../../../../../../packages/components/table-v2/src/renderers/header-cell.tsx"],"sourcesContent":["import { renderSlot } from 'vue'\nimport { HeaderCell, SortIcon } from '../components'\n// import ColumnResizer from '../table-column-resizer'\nimport { Alignment, SortOrder, oppositeOrderMap } from '../constants'\nimport { placeholderSign } from '../private'\nimport { componentToSlot, enforceUnit, tryCall } from '../utils'\n\nimport type { FunctionalComponent, UnwrapNestedRefs } from 'vue'\nimport type { Translator, UseNamespaceReturn } from '@element-plus/hooks'\nimport type { TableV2HeaderRowCellRendererParams } from '../components'\nimport type { UseTableReturn } from '../use-table'\nimport type { TableV2Props } from '../table'\n\nexport type HeaderCellRendererProps = TableV2HeaderRowCellRendererParams &\n  UnwrapNestedRefs<Pick<UseTableReturn, 'onColumnSorted'>> &\n  Pick<TableV2Props, 'sortBy' | 'sortState' | 'headerCellProps'> & {\n    ns: UseNamespaceReturn\n    t: Translator\n  }\n\nconst HeaderCellRenderer: FunctionalComponent<HeaderCellRendererProps> = (\n  props,\n  { slots }\n) => {\n  const { column, ns, t, style, onColumnSorted } = props\n\n  const cellStyle = enforceUnit(style)\n\n  if (column.placeholderSign === placeholderSign) {\n    return (\n      <div class={ns.em('header-row-cell', 'placeholder')} style={cellStyle} />\n    )\n  }\n\n  const { headerCellRenderer, headerClass, sortable } = column\n\n  /**\n   * render Cell children\n   */\n\n  const cellProps = {\n    ...props,\n    class: ns.e('header-cell-text'),\n  }\n\n  const columnCellRenderer =\n    componentToSlot<typeof cellProps>(headerCellRenderer)\n\n  const Cell = columnCellRenderer\n    ? columnCellRenderer(cellProps)\n    : renderSlot(slots, 'default', cellProps, () => [\n        <HeaderCell {...cellProps} />,\n      ])\n\n  /**\n   * Render cell container and sort indicator\n   */\n  const { sortBy, sortState, headerCellProps } = props\n\n  let sorting: boolean, sortOrder: SortOrder, ariaSort: string | undefined\n  if (sortState) {\n    const order = sortState[column.key!]\n    sorting = Boolean(oppositeOrderMap[order])\n    sortOrder = sorting ? order : SortOrder.ASC\n  } else {\n    sorting = column.key === sortBy.key\n    sortOrder = sorting ? sortBy.order : SortOrder.ASC\n  }\n  if (sortOrder === SortOrder.ASC) {\n    ariaSort = 'ascending'\n  } else if (sortOrder === SortOrder.DESC) {\n    ariaSort = 'descending'\n  } else {\n    ariaSort = undefined\n  }\n\n  const cellKls = [\n    ns.e('header-cell'),\n    tryCall(headerClass, props, ''),\n    column.align === Alignment.CENTER && ns.is('align-center'),\n    column.align === Alignment.RIGHT && ns.is('align-right'),\n    sortable && ns.is('sortable'),\n  ]\n\n  const cellWrapperProps = {\n    ...tryCall(headerCellProps, props),\n    onClick: column.sortable ? onColumnSorted : undefined,\n    ariaSort: sortable ? ariaSort : undefined,\n    class: cellKls,\n    style: cellStyle,\n    ['data-key']: column.key,\n  }\n\n  // For now we don't deliver resizable column feature since it has some UX issue.\n  return (\n    <div {...cellWrapperProps} role=\"columnheader\">\n      {Cell}\n\n      {sortable && (\n        <SortIcon\n          class={[ns.e('sort-icon'), sorting && ns.is('sorting')]}\n          sortOrder={sortOrder}\n          ariaLabel={t('el.table.sortLabel', { column: column.title || '' })}\n        />\n      )}\n    </div>\n  )\n}\n\nexport default HeaderCellRenderer\nexport type HeaderCellSlotProps = HeaderCellRendererProps & { class: string }\n"],"mappings":";;;;;;;;AAoBA,MAAMc,sBACJC,OACA,EAAEC,YACC;CACH,MAAM,EAAEC,QAAQC,IAAIC,GAAGC,OAAOC,mBAAmBN;CAEjD,MAAMO,YAAYV,YAAYQ,MAAM;AAEpC,KAAIH,OAAOP,oBAAoBA,gBAC7B,QAAAR,YAAA,OAAA;EAAA,SACcgB,GAAGK,GAAG,mBAAmB,cAAc;EAAA,SAASD;EAAS,EAAA,KAAA;CAIzE,MAAM,EAAEE,oBAAoBC,aAAaC,aAAaT;;;;CAMtD,MAAMU,YAAY;EAChB,GAAGZ;EACHa,OAAOV,GAAGW,EAAE,mBAAkB;EAC/B;CAED,MAAMC,qBACJnB,gBAAkCa,mBAAmB;CAEvD,MAAMO,OAAOD,qBACTA,mBAAmBH,UAAU,GAC7B3B,WAAWgB,OAAO,WAAWW,iBAAiB,CAAAzB,YAAAG,YAC5BsB,WAAS,KAAA,CAC1B,CAAC;;;;CAKN,MAAM,EAAEK,QAAQC,WAAWC,oBAAoBnB;CAE/C,IAAIoB,SAAkBC,WAAsBC;AAC5C,KAAIJ,WAAW;EACb,MAAMK,QAAQL,UAAUhB,OAAOsB;AAC/BJ,YAAUK,QAAQ/B,iBAAiB6B,OAAO;AAC1CF,cAAYD,UAAUG,QAAQ9B,UAAUiC;QACnC;AACLN,YAAUlB,OAAOsB,QAAQP,OAAOO;AAChCH,cAAYD,UAAUH,OAAOM,QAAQ9B,UAAUiC;;AAEjD,KAAIL,cAAc5B,UAAUiC,IAC1BJ,YAAW;UACFD,cAAc5B,UAAUkC,KACjCL,YAAW;KAEXA,YAAWM;CAGb,MAAMC,UAAU;EACd1B,GAAGW,EAAE,cAAc;EACnBhB,QAAQY,aAAaV,OAAO,GAAG;EAC/BE,OAAO4B,UAAUtC,UAAUuC,UAAU5B,GAAG6B,GAAG,eAAe;EAC1D9B,OAAO4B,UAAUtC,UAAUyC,SAAS9B,GAAG6B,GAAG,cAAc;EACxDrB,YAAYR,GAAG6B,GAAG,WAAW;EAC9B;AAYD,QAAA7C,YAAA,OAAAE,WAVyB;EACvB,GAAGS,QAAQqB,iBAAiBnB,MAAM;EAClCmC,SAASjC,OAAOS,WAAWL,iBAAiBsB;EAC5CN,UAAUX,WAAWW,WAAWM;EAChCf,OAAOgB;EACPxB,OAAOE;GACN,aAAaL,OAAOsB;EACtB,EAI0B,EAAA,QAAA,gBAAA,CAAA,EAAA,CACtBR,MAEAL,YAAQxB,YAAAI,UAAA;EAAA,SAEE,CAACY,GAAGW,EAAE,YAAY,EAAEM,WAAWjB,GAAG6B,GAAG,UAAU,CAAC;EAAA,aAC5CX;EAAS,aACTjB,EAAE,sBAAsB,EAAEF,QAAQA,OAAOkC,SAAS,IAAI,CAAA;EAAC,EAAA,KAErE,CAAA,CAAA"}