Column addition not rendering in v0.10.x (regression from v0.9.5)

[ChanMeng666]

Bug Description

When dynamically adding columns to a spreadsheet in react-spreadsheet v0.10.x, the new columns are added to the data
structure but do not render visually in the UI. This appears to be a regression from v0.9.5 where the same code works
correctly.

Steps to Reproduce

1. Create a spreadsheet with initial data
2. Implement an "add column" function that adds a new cell to each row
3. Click the add column button
4. Observe that the column count increases but the new column doesn't appear visually

Current Behavior

• The data structure is updated correctly (verified via console.log)
• The column count shows the correct number
• The new column cells are NOT visible in the rendered spreadsheet
• No console errors are thrown

Expected Behavior

• New columns should be immediately visible when added to the data
• The spreadsheet should re-render to show the new columns (as it does in v0.9.5)

Code Example

const [spreadsheet, setSpreadsheet] = useState({
  rows: [
    [{ value: "A1" }, { value: "B1" }, { value: "C1" }],
    [{ value: "A2" }, { value: "B2" }, { value: "C2" }],
    [{ value: "A3" }, { value: "B3" }, { value: "C3" }],
  ]
});

const addColumn = () => {
  const updatedRows = spreadsheet.rows.map(row => [...row, { value: "" }]);
  setSpreadsheet({
    ...spreadsheet,
    rows: updatedRows
  });
  // In v0.10.x: Data updates but column doesn't render
  // In v0.9.5: Works perfectly
};

return (
  <div>
    <Spreadsheet
      data={spreadsheet.rows}
      onChange={(data) => setSpreadsheet({ ...spreadsheet, rows: data })}
    />
    <button onClick={addColumn}>Add Column</button>
  </div>
);

Workarounds Attempted

1. Adding unique key prop with column count - didn't work
2. Force re-rendering with state counter - didn't work
3. Using different state update patterns - didn't work
4. Deep cloning data with JSON.parse/stringify - didn't work

Solution

Downgrading to v0.9.5 resolves the issue completely.

Environment

• react-spreadsheet: 0.10.1 (broken) / 0.9.5 (working)
• react: 18.x
• next.js: 14.2.5
• Browser: Chrome/Firefox/Safari (all affected)

Additional Context

This issue was discovered while building a hospital roster management system where users need to dynamically add columns for
new time slots. Row addition works perfectly in both versions, only column addition is affected.

The issue seems to be related to how the spreadsheet component handles re-rendering when the column count changes. In
v0.9.5, the component properly detects and renders new columns, but in v0.10.x, it appears to cache or memoize the column
structure in a way that prevents new columns from appearing.

Possible Related Issues

This might be related to any performance optimizations or memoization changes introduced in v0.10.x.

Thank you for maintaining this great library! Happy to provide more details or test any fixes.