Improve table cell rendering and pass down table slot

This commit is contained in:
Andrew Kingston 2021-04-12 15:24:33 +01:00
parent 3b2ef3a5e9
commit d7cb604151
3 changed files with 19 additions and 15 deletions

View File

@ -11,22 +11,23 @@
export let customRenderers = []
const plainTypes = ["string", "options", "number", "longform"]
const typeMap = {
boolean: BooleanRenderer,
datetime: DateTimeRenderer,
link: RelationshipRenderer,
attachment: AttachmentRenderer,
string: StringRenderer,
options: StringRenderer,
number: StringRenderer,
longform: StringRenderer,
}
$: type = schema?.type ?? "string"
$: customRenderer = customRenderers?.find(x => x.column === schema?.name)
$: renderer = customRenderer?.component ?? typeMap[type]
</script>
{#if value != null && value !== ''}
{#if customRenderer}
<svelte:component this={customRenderer.component} {schema} {value} />
{:else if plainTypes.includes(type)}
<StringRenderer {value} />
{:else if type === 'boolean'}
<BooleanRenderer {value} />
{:else if type === 'datetime'}
<DateTimeRenderer {value} />
{:else if type === 'link'}
<RelationshipRenderer {row} {schema} {value} on:clickrelationship />
{:else if type === 'attachment'}
<AttachmentRenderer {value} />
{/if}
{#if renderer && value != null && value !== ''}
<svelte:component this={renderer} {row} {schema} {value} on:clickrelationship>
<slot />
</svelte:component>
{/if}

View File

@ -3,6 +3,7 @@
</script>
<div>{value}</div>
<slot />
<style>
div {

View File

@ -232,7 +232,9 @@
{row}
schema={schema[field]}
value={row[field]}
on:clickrelationship />
on:clickrelationship>
<slot />
</CellRenderer>
</div>
</td>
{/each}