example.tw

@use('layouts/base')

{{ items = [{ href: '/', }, { href: '/posts', }] }}

@insert('title', 'Book Store')
@insert("description", 'This is a book store description here')

@slot
@slot('header')
@slot('footer')

@insert('content')
    <div>Hey main</div>

    <img src="/images/{{ user.image }}.jpg" />

    <div>
        <h1>Nice one</h1>
        <p>Hey there</p>

        @dump(user, book)

        @if(defined(user.address.street.number))
            {{ user.address.street.number }}
        @end

        @if(true)
            <span>{{ [1, 3.3, true, false, nil, user] }}</span>
            <span>{{ x = 10; y = 20 }}</span>
            <span>{{ x + 2 - 234.4 }}</span>
            <span>{{ false && false || true ? 'Yes' : 'No' }}</span>
            <span>{{ true; false; nil }}</span>
            <span>{{ nice.upper() }}</span>
            <span>{{ { first, "nice": 2 } }}</span>
            <span>{{ true ? 1 : 2 }}</span>
            <span>{{ x++ }}</span>
            <span>{{ -1 + 2.23 }}</span>
            <span>{{ --x }}</span>
            <span>{{ obj.key }}</span>
            <span>{{ x < y }}</span>
            <div class="text-2xl py-4">{{ tech[0] }}</div>
            <div>This is @if(visible)is@end nice</div>
            <div>This is \@if(visible)is\@end nice</div>
            <div>{{ defined(one) && defined(two) ? "Is defined" : "Not defined" }}</div>
            <div>{{ defined(one, two) ? "Is defined" : "Not defined" }}</div>
        @elseif(false)
            <span>Nothing</span>
        @else
            <span>{{ "Nice" }}</span>
        @end

        @reserve('content', 'The fallback value %s here'.format("is"))

        @each(user in users)
            <span>{{ user.name.upper() }}</span>

            @breakif(true)
            @continueif(true)
            @break
            @continue
        @end

        <h2>Each Statement</h2>
        @each(user in users)
            <span>{{ user.name.json() }}</span>
        @else
            <span>No users</span>
        @end

        <h2>Escapes</h2>
        \{{ 1 + 2 }}
        \@insert('title', 'hello')
        {{ "She is really \"nice\"" }}
        {{ 'She is really \'nice\'' }}

        <h2>Function Calls</h2>
        <ul>
            <li>{{ "nice".upper().split('i') }}</li>
            <li>{{ defined(user) }}</li>
            <li>{{ formatDate(date, "") }}</li>
            <li>{{ hasValue(user) }}</li>
            <li>@if(defined(env))env@end</li>
        </ul>

        <h2>Comments</h2>
        <!-- HTML comment -->
        <!-- <h2>Nice</h2> -->
        {{-- Textwire comment --}}
        {{-- <h2>Nice</h2> --}}

        @for(i = 0; i < 10; i++)
            @if(true)
                <span>NICE</span>
            @end

            <span>{{ user.name.upper() }}</span>
        @else
            <span>No users</span>

            @component('name')
                <h2>Textwire</h2>
            @end

            @component("book", { book })
                <div>Nice</div>

                @pass("name")
                    <div>nice</div>
                @end

                @passif(true)THIS@end

                @passif(true, "name")
                    <div>nice</div>
                @end
            @end
        @end

        @for(i = 0; i < 10; i++)
            @break
        @else
            <span>nice</span>
        @end
    </div>
@end