{{! -------------------------------------------- }}
{{!   World Thumbnail View                       }}
{{! -------------------------------------------- }}

{{#*inline "worlds"}}
<li class="package world" data-package-id="{{package.id}}">
    <img class="thumbnail" data-src="{{package.thumb}}">
    <div class="status-icons">
        {{#if package.favorite}}
            <i class="favorite fa-solid fa-star" data-tooltip="{{localize "SETUP.FavoritePackage"}}"></i>
        {{/if}}
        <i class="lock fas fa-lock {{#unless package.locked}}hidden{{/unless}}"
           data-tooltip="{{localize "SETUP.LockHint"}}"></i>
    </div>
    <h3 class="package-title" data-tooltip="{{package.shortDesc}}" data-tooltip-direction="UP">{{package.title}}</h3>
    {{#if package.canPlay}}
        <a class="control play" data-action="worldLaunch" data-tooltip="SETUP.WorldLaunch">
            <i class="fal fa-play-circle"></i>
        </a>
    {{/if}}
    <div class="tags left">
    {{#if package.lastPlayedLabel}}
        <span class="tag">{{package.lastPlayedLabel}}</span>
    {{/if}}
    </div>
    <div class="tags right">
        <span class="tag {{package.systemBadge.type}}" data-tooltip="{{package.systemBadge.tooltip}}">
            {{#if package.systemBadge.icon}}<i class="{{package.systemBadge.icon}}"></i>{{/if}}
            {{package.systemBadge.label}}
        </span>
        {{> templates/setup/parts/package-tags.hbs package=this}}
    </div>
</li>
{{/inline}}

{{! -------------------------------------------- }}
{{!   System Thumbnail View                      }}
{{! -------------------------------------------- }}

{{#*inline "systems"}}
<li class="package system" data-package-id="{{package.id}}">
    <img class="thumbnail" data-src="{{package.thumb}}">
    <div class="status-icons">
        {{#if package.favorite}}
            <i class="favorite fa-solid fa-star" data-tooltip="{{localize "SETUP.FavoritePackage"}}"></i>
        {{/if}}
        <i class="lock fas fa-lock {{#unless package.locked}}hidden{{/unless}}"
           data-tooltip="{{localize "SETUP.LockHint"}}"></i>
    </div>
    <h3 class="package-title" data-tooltip="{{package.shortDesc}}" data-tooltip-direction="UP">{{package.title}}</h3>
    <div class="tags left">
        {{#unless package.locked}}
        <a class="control package-update" data-action="updatePackage" data-tooltip="{{localize "SETUP.UpdatePerformIfAvailable"}}">
            <i class="fas fa-sync-alt"></i>
        </a>
        <span class="tag update-status hidden">Updated</span>
        {{/unless}}
    </div>
    <div class="tags right">
        {{> templates/setup/parts/package-tags.hbs package=this}}
    </div>
</li>
{{/inline}}

{{! -------------------------------------------- }}
{{!   Module Thumbnail View                      }}
{{! -------------------------------------------- }}

{{#*inline "modules"}}
<li class="package module" data-package-id="{{package.id}}">
    <img class="thumbnail" data-src="{{package.thumb}}">
    <div class="status-icons">
        {{#if package.favorite}}
            <i class="favorite fa-solid fa-star" data-tooltip="{{localize "SETUP.FavoritePackage"}}"></i>
        {{/if}}
        <i class="lock fas fa-lock {{#unless package.locked}}hidden{{/unless}}"
           data-tooltip="{{localize "SETUP.LockHint"}}"></i>
    </div>
    <h3 class="package-title" data-tooltip="{{package.shortDesc}}" data-tooltip-direction="UP">{{package.title}}</h3>
    <div class="tags left">
        {{#unless package.locked}}
        <a class="control package-update" data-action="updatePackage" data-tooltip="{{localize "SETUP.UpdatePerformIfAvailable"}}">
            <i class="fas fa-sync-alt"></i>
        </a>
        <span class="tag update-status hidden">Updated</span>
        {{/unless}}
    </div>
    <div class="tags right">
        {{> templates/setup/parts/package-tags.hbs package=this}}
    </div>
</li>
{{/inline}}

{{! -------------------------------------------- }}
{{!   Thumbnail List                             }}
{{! -------------------------------------------- }}

<ol id="{{type}}-list" class="package-list gallery scrollable">
{{#each packages as |package|}}
    {{> (lookup .. "type") package=package}}
{{/each}}
</ol>