Files
Graphite/frontend/src/components/widgets/WidgetTable.svelte
Adam Gerhant a6052c5819 Replace node definition string-based lookups with DefinitionIdentifier instances (#3451)
* create definition identifier and integrate it

* Bug fixes and code review

* formatting

* Fix migrations

* Fix remove handles migration

* formatting

* Fix test

* Fix tests 2

* fix deserialization

* Code review

* Small fixes

* Consolidate 'Morph' node migrations

* Add old SamplePointsNode name to migrations list

* Fix tests

* Unrelated small fix

* Fix migration crashes

* Fix tests

* Final code review

* fmt

* Add metadata

---------

Co-authored-by: Keavon Chambers <keavon@keavon.com>
2026-01-12 23:09:43 -08:00

47 lines
1.1 KiB
Svelte

<script lang="ts">
import { type LayoutTarget, type WidgetTable as WidgetTableFromJsMessages } from "@graphite/messages";
import WidgetSpan from "@graphite/components/widgets/WidgetSpan.svelte";
export let widgetData: WidgetTableFromJsMessages;
export let layoutTarget: LayoutTarget;
export let unstyled = false;
$: columns = widgetData.tableWidgets.length > 0 ? widgetData.tableWidgets[0].length : 0;
</script>
<table class:unstyled>
<tbody>
{#each widgetData.tableWidgets as row}
<tr>
{#each row as cell}
<td colspan={row.length < columns ? columns - row.length + 1 : undefined}>
<WidgetSpan widgetData={{ rowWidgets: [cell] }} {layoutTarget} narrow={true} />
</td>
{/each}
</tr>
{/each}
</tbody>
</table>
<style lang="scss" global>
table:not(.unstyled) {
background: var(--color-3-darkgray);
border: none;
border-spacing: 4px;
border-radius: 2px;
td {
background: var(--color-2-mildblack);
vertical-align: top;
border: none;
border-radius: 2px;
padding: 4px 8px;
}
tr:first-child td {
background-image: var(--inheritance-dots-background-4-dimgray);
}
}
</style>