<script lang="ts">
    import Block from "./Block.svelte";
    import AutoDisplay from "./AutoDisplay.svelte";

    export let object: Object;

    const titleCase = (s: string) => s.replace(/^_*(.)|_+(.)/g, (_s, c, d) => c ? c.toUpperCase() : ' ' + d.toUpperCase())

    const name = (key: string) => {
        switch (key) {
            default: return titleCase(key);
        }
    };
</script>

<Block>
    {#each Object.entries(object) as [key, value]}
        {#if value}
            <p>{name(key)}</p> 
            {#if typeof value === 'object'} 
                <AutoDisplay object={value} />
            {:else}
                {value} 
            {/if}
        {/if}
    {/each}
</Block>
