34 lines
1.3 KiB
Handlebars
34 lines
1.3 KiB
Handlebars
{{#if this.sortedItems}}
|
|
<SortableGroupAccessible
|
|
@models={{this.sortedItems}}
|
|
tabindex="0"
|
|
class="shadow-md bg-gray-200 outline-none border border-gray-400 focus:border-teal-400 focus:shadow-lg"
|
|
data-test-id='meal-list-wrapper'
|
|
as |groupHasFocus selectedIndex groupActions|>
|
|
<SortableGroup
|
|
@onChange={{action this.reorderMeals}}
|
|
as |group|>
|
|
{{#each this.sortedItems as |meal index|}}
|
|
<SortableItemAccessible
|
|
@groupHasFocus={{groupHasFocus}}
|
|
@currentIndex={{index}}
|
|
@selectedIndex={{selectedIndex}}
|
|
@orderItemDown={{groupActions.orderItemDown}}
|
|
@orderItemUp={{groupActions.orderItemUp}}
|
|
@handleBlur={{groupActions.handleBlur}}
|
|
class="shadow-md bg-gray-200 outline-none border border-gray-400 focus:border-teal-400 focus:shadow-lg">
|
|
<SortableItem
|
|
@model={{meal}}
|
|
@group={{group}}
|
|
data-test-id="meal-item">
|
|
<MealItem
|
|
@meal={{meal}}
|
|
@handleFocus={{groupActions.handleFocus}}
|
|
@handleBlur={{groupActions.handleBlur}}
|
|
/>
|
|
</SortableItem>
|
|
</SortableItemAccessible>
|
|
{{/each}}
|
|
</SortableGroup>
|
|
</SortableGroupAccessible>
|
|
{{/if}}
|