Column selector with special name not working

[iamtekson]

Issue Check list

• [x] Agree to the Code of Conduct
• [x] Read the README
• [x] You are using React 16.8.0+
• [x] You installed styled-components
• [ ] Include relevant code or preferably a code sandbox

Describe the bug

I am trying to create the data table for following data,

[
    {
        "1.1 - 2.1 cm": 348.75,
        "2.1 - 3.1 cm": 285.75,
        "3.1 - 4.1 cm": 145.5,
        "> 4.1 cm": 1465.875,
        "Ear Class": "MA_1"
    }
]

I have written my column names below,

const columns = [
{
      name: "1.1 - 2.1 cm",
      selector: "1.1 - 2.1 cm",
      sortable: true,
    }
]

And in my datatable component, I write like below,

<DataTable
    columns={columns}
    data={data}
    pagination={true}
    paginationPerPage={10}
  />

But it is not working. It throw me following error message,

Uncaught TypeError: Cannot read properties of undefined (reading '1 - 2')
    at index.cjs.js:1:1
    at Array.reduce (<anonymous>)
    at getProperty (index.cjs.js:1:1)
    at index.cjs.js:1:1
    at renderWithHooks (react-dom.development.js:14803:1)
    at updateFunctionComponent (react-dom.development.js:17034:1)
    at updateSimpleMemoComponent (react-dom.development.js:16972:1)
    at updateMemoComponent (react-dom.development.js:16861:1)
    at beginWork (react-dom.development.js:18682:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:188:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:237:1)
    at invokeGuardedCallback (react-dom.development.js:292:1)
    at beginWork$1 (react-dom.development.js:23203:1)
    at performUnitOfWork (react-dom.development.js:22154:1)
    at workLoopSync (react-dom.development.js:22130:1)
    at performSyncWorkOnRoot (react-dom.development.js:21756:1)
    at react-dom.development.js:11089:1
    at unstable_runWithPriority (scheduler.development.js:653:1)
    at runWithPriority$1 (react-dom.development.js:11039:1)
    at flushSyncCallbackQueueImpl (react-dom.development.js:11084:1)
    at flushSyncCallbackQueue (react-dom.development.js:11072:1)
    at batchedUpdates$1 (react-dom.development.js:21862:1)
    at Object.notify (Subscription.js:19:1)
    at Subscription.notifyNestedSubs (Subscription.js:92:1)
    at Subscription.handleChangeWrapper (Subscription.js:97:1)
    at Object.dispatch (redux.js:222:1)
    at e (<anonymous>:2494:20)
    at index.js:11:1
    at dispatch (redux.js:638:1)

Expected behavior

It should not throw an error message.

Otherwise, add screenshots and/or complete sample code to help explain your problem.

Versions (please complete the following information)

• React (RDT requires 16.8.0+)
• Styled Components
• OS: Windows
• Browse: Chrome

[iamtekson]

Here is the error message from latest version,

util.ts:81 Uncaught TypeError: Cannot read properties of undefined (reading '1')
    at util.ts:81:1
    at Array.reduce (<anonymous>)
    at d (util.ts:71:1)
    at util.ts:102:1
    at TableCell.tsx:88:1
    at renderWithHooks (react-dom.development.js:14803:1)
    at updateFunctionComponent (react-dom.development.js:17034:1)
    at updateSimpleMemoComponent (react-dom.development.js:16972:1)
    at updateMemoComponent (react-dom.development.js:16861:1)
    at beginWork (react-dom.development.js:18682:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:188:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:237:1)
    at invokeGuardedCallback (react-dom.development.js:292:1)
    at beginWork$1 (react-dom.development.js:23203:1)
    at performUnitOfWork (react-dom.development.js:22154:1)
    at workLoopSync (react-dom.development.js:22130:1)
    at performSyncWorkOnRoot (react-dom.development.js:21756:1)
    at react-dom.development.js:11089:1
    at unstable_runWithPriority (scheduler.development.js:653:1)
    at runWithPriority$1 (react-dom.development.js:11039:1)
    at flushSyncCallbackQueueImpl (react-dom.development.js:11084:1)
    at flushSyncCallbackQueue (react-dom.development.js:11072:1)
    at batchedUpdates$1 (react-dom.development.js:21862:1)
    at Object.notify (Subscription.js:19:1)
    at Subscription.notifyNestedSubs (Subscription.js:92:1)
    at Subscription.handleChangeWrapper (Subscription.js:97:1)
    at Object.dispatch (redux.js:222:1)
    at e (<anonymous>:2494:20)
    at index.js:11:1
    at dispatch (redux.js:638:1)

[MrAzuka]

Have you been able to solve this? Because I'm encountering something similar and no solution found on the web so far