Get rid of types.d.ts in favor of DynamicSvelteComponent

This commit is contained in:
Henrik Giesel 2021-04-08 18:43:15 +02:00
parent 86c57d5b75
commit f88b9d64d3
7 changed files with 16 additions and 29 deletions

View File

@ -1,5 +1,5 @@
<script lang="typescript"> <script lang="typescript">
import type { Buttons } from "./types"; import type { DynamicSvelteComponent } from "sveltelib/dynamicComponent";
import ButtonGroup from "./ButtonGroup.svelte"; import ButtonGroup from "./ButtonGroup.svelte";
export let id = ""; export let id = "";
@ -10,7 +10,7 @@
return `dropdown-menu bg-transparent border-0 ${className}`; return `dropdown-menu bg-transparent border-0 ${className}`;
} }
export let buttons: Buttons; export let buttons: DynamicSvelteComponent[];
</script> </script>
<ButtonGroup {id} className={extendClassName(className)} {props} {buttons} /> <ButtonGroup {id} className={extendClassName(className)} {props} {buttons} />

View File

@ -1,7 +1,7 @@
import type { Buttons } from "./types"; import type { DynamicSvelteComponent } from "sveltelib/dynamicComponent";
export interface ButtonGroupProps { export interface ButtonGroupProps {
id: string; id: string;
className?: string; className?: string;
buttons: Buttons; buttons: DynamicSvelteComponent[];
} }

View File

@ -1,11 +1,11 @@
<script lang="typescript"> <script lang="typescript">
import type { Buttons } from "./types"; import type { DynamicSvelteComponent } from "sveltelib/dynamicComponent";
export let id = ""; export let id;
export let className = ""; export let className = "";
export let props: Record<string, string> = {}; export let props: Record<string, string> = {};
export let buttons: Buttons; export let buttons: DynamicSvelteComponent[];
</script> </script>
<style lang="scss"> <style lang="scss">
@ -53,11 +53,7 @@
<ul {id} class={className} {...props}> <ul {id} class={className} {...props}>
{#each buttons as button} {#each buttons as button}
<li> <li>
{#if Array.isArray(button)} <svelte:component this={button.component} {...button} />
<svelte:self buttons={button} />
{:else}
<svelte:component this={button.component} {...button} />
{/if}
</li> </li>
{/each} {/each}
</ul> </ul>

View File

@ -13,16 +13,15 @@
</script> </script>
<script lang="typescript"> <script lang="typescript">
import type { SvelteComponent } from "svelte";
import type { Readable } from "svelte/store"; import type { Readable } from "svelte/store";
import type { DynamicSvelteComponent } from "sveltelib/dynamicComponent";
import { setContext } from "svelte"; import { setContext } from "svelte";
import { disabledKey, nightModeKey } from "./contextKeys"; import { disabledKey, nightModeKey } from "./contextKeys";
import ButtonGroup from "./ButtonGroup.svelte"; import ButtonGroup from "./ButtonGroup.svelte";
import type { Buttons } from "./types";
export let buttons: Readable<Buttons>; export let buttons: Readable<DynamicSvelteComponent[]>;
export let menus: Readable<SvelteComponent[]>; export let menus: Readable<DynamicSvelteComponent[]>;
$: _buttons = $buttons; $: _buttons = $buttons;
$: _menus = $menus; $: _menus = $menus;

View File

@ -1,6 +1,6 @@
import type { ButtonDefinition } from "./types"; import type { DynamicSvelteComponent } from "sveltelib/dynamicComponent";
export interface WithDropdownMenuProps { export interface WithDropdownMenuProps {
button: ButtonDefinition; button: DynamicSvelteComponent;
menuId: string; menuId: string;
} }

View File

@ -1,10 +1,10 @@
<script lang="typescript"> <script lang="typescript">
import type { ButtonDefinition } from "./types"; import type { DynamicSvelteComponent } from "sveltelib/dynamicComponent";
export let button: ButtonDefinition; export let button: DynamicSvelteComponent;
export let menuId: string; export let menuId: string;
function extend({ className, props, ...rest }: ButtonDefinition): ButtonDefinition { function extend({ className, props, ...rest }: DynamicSvelteComponent): DynamicSvelteComponent {
return { return {
className: `${className} dropdown-toggle`, className: `${className} dropdown-toggle`,
props: { props: {

View File

@ -1,8 +0,0 @@
import type { DynamicSvelteComponent } from "sveltelib/dynamicComponent";
export interface ButtonDefinition extends DynamicSvelteComponent {
id?: string;
className?: string;
}
export type Buttons = ButtonDefinition | Buttons[];