Custom styling for select all checkbox in antd Table row selection

I have an table created using antd ui library and implemented a select all checkbox using the props of the Table component.

My row selection is done as follows.

const rowSelection = {
    onChange: (selectedRowKeys: any, selectedRows: any) => {
      setSelectedRows(selectedRows);
    },
    getCheckboxProps: (record: any) => ({
      disabled: record.name === "Disabled User",
      // Column configuration not to be checked
      name: record.name,
    }),
  };

All works perfectly. But when selecting all the rows, the checkbox at the header also shown as checked. This is fine but i want to use '-' sign instead of the 'checked' sign inside the select all checkbox. How can i do this?

I can render a custom checkbox using columnTitle prop as follows

const rowSelection = {
        columnTitle: selectedRowKeys.length > 0 ? <div>custom checkbox</div> : <></>,
        onChange: (selectedRowKeys: any, selectedRows: any) => {
          setSelectedRows(selectedRows);
        },
        getCheckboxProps: (record: any) => ({
          disabled: record.name === "Disabled User",
          // Column configuration not to be checked
          name: record.name,
        }),
      };

But then it loses the select all functionality. How can i solve this problem?