T
TanStack•4mo ago
extended-salmon

Is anyone using the alpha version with svelte?

Is anyone here using the alpha version of tabel with svelte 5? I switched to alpha because I am using svelte 5 but all the discussions on github are old, is it stable enough to use? has there been any updates lately? The latest issue I am running into is that I am rendering my headers like this 
{#each table.getHeaderGroups() as headerGroup}
  <tr class="tr">
    {#each headerGroup.headers as cell (cell.id)}
      {#if !cell.isPlaceholder}
        <th class="th {cell.id}">
          <FlexRender 
            context={cell.getContext()} 
            content={cell.column.columnDef.cell} 
          />
        </th>
      {/if}
    {/each}
  </tr>
{/each}
{#each table.getHeaderGroups() as headerGroup}
  <tr class="tr">
    {#each headerGroup.headers as cell (cell.id)}
      {#if !cell.isPlaceholder}
        <th class="th {cell.id}">
          <FlexRender 
            context={cell.getContext()} 
            content={cell.column.columnDef.cell} 
          />
        </th>
      {/if}
    {/each}
  </tr>
{/each}
Which is obviously wrong but I can't find the docs on how to do it properly, I know it's wrong because it's calling the logic in the cell function and not the header
2 Replies
extended-salmon
extended-salmonOP•4mo ago
Reactivity also has some buggy behavior (again not sure if it's simply the way I am using it) for example I have this logic for my selection column 
{
  id: 'checkbox',
  cell: (props) => {
    return renderComponent(Checkbox, {
      checked: props.row.getIsSelected(),                 
      toggle: props.row.getToggleSelectedHandler()
    });
  },
  header: ({ table }) => {
    return renderComponent(Checkbox, { 
      checked: table.getIsAllRowsSelected(), 
      toggle: table.getToggleAllRowsSelectedHandler() 
    });
  }
}
{
  id: 'checkbox',
  cell: (props) => {
    return renderComponent(Checkbox, {
      checked: props.row.getIsSelected(),                 
      toggle: props.row.getToggleSelectedHandler()
    });
  },
  header: ({ table }) => {
    return renderComponent(Checkbox, { 
      checked: table.getIsAllRowsSelected(), 
      toggle: table.getToggleAllRowsSelectedHandler() 
    });
  }
}
And when I select all it doesn't update the individual checkboxes in the cells
stormy-gold
stormy-gold•3mo ago
this project is pretty much dead unfortunately, I've been awaiting for over half a year for an update 🤷‍♂️ I even offered to help but got no response

Did you find this page helpful?