list

// src/components/patterns/user-management/list/schema.yaml

$schema: http://json-schema.org/draft-07/schema
$id: /patterns/user-management/list
$ref: /patterns/user-management/data

// src/components/patterns/user-management/list/mocks.yaml

$variants:
  - $name: self
    $ref: /patterns/user-management/data#self
  - $name: team
    $ref: /patterns/user-management/data#team

// src/components/patterns/user-management/list/list.twig

<ul class="UserManagementList">
	{% for user in users %}
		<li class="UserManagementList-item">
			{% set trigger %}
				<button class="UserManagementList-button" type="button">
					<span class="UserManagementList-buttonImage">{{ user.avatar }}</span>
					<span class="u-typo-TextM">{{ user.name }}</span>
				</button>
			{% endset %}

			{% set content %}
				{% include "@patterns/user-management/list/_details/_details.twig" with user only %}
			{% endset %}

			{% include "@patterns/user-management/_dialog/_dialog.twig" with {
				classes: ["UserManagementList-dialog"],
				trigger: trigger,
				content: content,
				avatar: user.avatar,
				name: user.name,
				unit: user.unit,
			} only %}
		</li>
	{% endfor %}
</ul>