{{#> dotdungeon.panel class="aspect" title="dotdungeon.actor.pc.panel.aspect"}}
	{{#each items.aspect as | aspect |}}
		<div class="aspect">
			<h3 class="aspect__name">{{aspect.name}}</h3>
			{{#if (defined aspect.system.deactivateAfter)}}
				<p class="aspect__duration">
					{{localize "dotdungeon.actor.pc.aspect.duration" duration=(dd-toFriendlyDuration aspect.system.deactivateAfter)}}
				</p>
			{{/if}}
			{{#if aspect.system.info}}
				<div class="aspect__description">
					<p>
						{{aspect.system.info}}
					</p>
				</div>
			{{/if}}
			<div class="aspect__used">
				<input
					id="{{aspect.uuid}}-used"
					type="checkbox"
					class="aspect__used--input"
					{{checked aspect.system.used}}
					data-embedded-update="system.used"
					data-embedded-update-on="change"
					data-embedded-id="{{aspect.uuid}}"
				>
				<label
					class="aspect__used--label"
					for="{{aspect.uuid}}-used"
				>
					{{localize "dotdungeon.actor.pc.aspect.used"}}
				</label>
			</div>
			<div class="actions">
				<button
					type="button"
					class="confirm"
					data-embedded-edit="{{aspect.uuid}}"
				>
					{{localize "dotdungeon.actor.pc.aspect.edit"}}
				</button>
				<button
					type="button"
					class="danger equal-padding"
					aria-label="{{localize "dotdungeon.actor.pc.aspect.aria.delete"}}"
					data-embedded-delete
					data-embedded-id="{{aspect.uuid}}"
				>
					<div aria-hidden="true" class="icon icon--20">
						{{{ ../icons.garbage-bin }}}
					</div>
				</button>
			</div>
		</div>
	{{else}}
		<p>
			{{localize "dotdungeon.actor.pc.aspect.empty"}}
		</p>
	{{/each}}
	{{#if (or computed.canAddAspect (dd-empty items.aspect))}}
		<button
			type="button"
			class="confirm"
			data-embedded-create="Aspect"
		>
			<div aria-hidden="true" class="icon icon--20">
				{{{ icons.create }}}
			</div>
			<span>
				{{localize "dotdungeon.actor.pc.aspect.add"}}
			</span>
		</button>
	{{/if}}
{{/ dotdungeon.panel}}