stufflog/svelte-ui/src/components/tables/ItemTable.svelte

<script>
	import { createEventDispatcher } from 'svelte';

  import Link from "../Link.svelte";
  import Table from "../Table.svelte";

  export let items = [];
  
  const dispatch = createEventDispatcher();

  function onOption(name, id) {
    const item = items.find(i => i.id === id)

    dispatch("option", {name, item})
  }
</script>

<Table headers={["Name", "Multiplier", "Options"]} percentages={[60, 5, 35]}>
  {#each items as item (item.id)}
    <tr>
      <td class="ellipsis">{item.name}</td>
      <td>{item.multiplier.toFixed(2)}</td>
      <td>
        <Link on:click={() => onOption("item.stats", item.id)}>Stats</Link>,
        <Link on:click={() => onOption("item.edit", item.id)}>Edit</Link>,
        <Link on:click={() => onOption("item.remove", item.id)}>Delete</Link>
      </td>
    </tr>
  {/each}
</Table>