All files / components/wrapper wrapper.tsx

100% Statements 9/9
50% Branches 1/2
100% Functions 2/2
100% Lines 9/9

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 504x     4x             12x   12x   12x   12x   12x     12x   12x                                                    
import { Component, h, Prop, Host } from "@stencil/core";
import { LoaderVariant } from "@trumpf/ux.ui/dist/types/components";
 
@Component({
    tag: "ux-w-wrapper",
    styleUrl: "wrapper.scss",
    shadow: false
})
export class Wrapper {
    /** url for the Link next to the title */
    @Prop() url: string = "";
    /** text for the title attribute of the link */
    @Prop() linkTitle: string = "";
    /** text for the title */
    @Prop() headline: string = "";
    /** does this widget have a menu */
    @Prop() hasMenu: boolean = false;
    /** indicate a loading state */
    @Prop() isLoading: boolean = false;
 
    render() {
        const baseClass = "ux-w-wrapper";
 
        return (
            <Host class={baseClass}>
                <ux-w-header
                    url={this.url}
                    linkTitle={this.linkTitle}
                    hasMenu={this.hasMenu}
                >
                    <span slot="headline">{this.headline}</span>
                    <div slot="menu">
                        <slot name="menu" />
                    </div>
                </ux-w-header>
                <div class={`${baseClass}__body`}>
                    {this.isLoading && (
                        <div class={`${baseClass}__loader`}>
                            <ux-loader
                                variant={"spinner" as LoaderVariant}
                            ></ux-loader>
                        </div>
                    )}
                    <slot name="content" />
                </div>
            </Host>
        );
    }
}