Implement initial Render component

This supports everything except the RenderStrategy/hidden/unmount type stuff, while I'll add in a later commit.
This commit is contained in:
Ryan Gossiaux
2021-12-20 15:45:22 -08:00
parent a84941285b
commit dccb6fbbd9

View File

@@ -1,6 +1,47 @@
<script lang="ts" context="module"> <script lang="ts" context="module">
import {
getElementComponent,
SupportedElement,
} from "$lib/internal/elements";
import { get_current_component, SvelteComponent } from "svelte/internal";
export enum RenderStrategy { export enum RenderStrategy {
Unmount, Unmount,
Hidden, Hidden,
} }
</script> </script>
<script lang="ts">
import type { ActionArray } from "$lib/hooks/use-actions";
import { forwardEventsBuilder } from "$lib/internal/forwardEventsBuilder";
export let name: string;
export let as: SvelteComponent | SupportedElement;
export let el: HTMLElement | null = null;
export let use: ActionArray = [];
export let slot: unknown = {};
const forwardEvents = forwardEventsBuilder(get_current_component());
if (!as) {
throw new Error(`<${name}> did not provide an \`as\` value to <Render>`);
}
let element = typeof as === "string" ? getElementComponent(as) : as;
if (!element) {
throw new Error(
`<${name}> has an invalid or unsupported \`as\` prop: ${as}`
);
}
$: classStyle = $$props.class;
</script>
<svelte:component
this={element}
bind:el
use={[...use, forwardEvents]}
{...$$restProps}
class={typeof classStyle === "function" ? classStyle(slot) : classStyle}
>
<slot />
</svelte:component>