{{! -------------------------------------------- }}
{{!   World Details View                         }}
{{! -------------------------------------------- }}

{{#*inline "worlds"}}
<li class="package world" data-package-id="{{package.id}}">
    <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>
    <div class="package-thumbnail">
        <img class="thumbnail" data-src="{{package.thumb}}">
        <h3 class="package-title">{{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>
    <div class="package-content flexcol">
        <div class="package-description scrollable">{{{package.description}}}</div>
        <footer class="package-footer">
            <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>
        </footer>
    </div>
</li>
{{/inline}}

{{! -------------------------------------------- }}
{{!   System Details View                        }}
{{! -------------------------------------------- }}

{{#*inline "systems"}}
<li class="package system" data-package-id="{{package.id}}">
    <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>
    <div class="package-thumbnail">
        <img class="thumbnail" data-src="{{package.thumb}}">
        <h3 class="package-title">{{package.title}}</h3>
    </div>
    <div class="package-content flexcol">
        <div class="package-description scrollable">{{{package.description}}}</div>
        <footer class="package-footer">
            <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>
        </footer>
    </div>
</li>
{{/inline}}

{{! -------------------------------------------- }}
{{!   Module Details View                        }}
{{! -------------------------------------------- }}

{{#*inline "modules"}}
<li class="package module" data-package-id="{{package.id}}">
    <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>
    <div class="package-thumbnail">
        <img class="thumbnail" data-src="{{package.thumb}}">
        <h3 class="package-title">{{package.title}}</h3>
    </div>
    <div class="package-content flexcol">
        <div class="package-description scrollable">{{{package.description}}}</div>
        <footer class="package-footer">
            <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>
        </footer>
    </div>
</li>
{{/inline}}

{{! -------------------------------------------- }}
{{!   Details View                               }}
{{! -------------------------------------------- }}

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