gaiety/sortable-recipes
1
0
Fork 0
Code Activity

Splattribute refactorings

Browse source
This commit is contained in:
Ava Wroten 2020-03-09 18:53:56 -05:00
parent 2730cefd86
commit 8a047250ff
3 changed files with 35 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

61
ember-ui/app/components/meal-list.hbs
View file

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

3
ember-ui/app/components/sortable-group-accessible.hbs
View file

@ -6,8 +6,7 @@
{{key-up this.handleArrowDown key='ArrowDown'}} {{key-up this.handleArrowDown key='ArrowDown'}}
{{key-down this.preventDefault key='ArrowUp'}} {{key-down this.preventDefault key='ArrowUp'}}
{{key-down this.preventDefault key='ArrowDown'}} {{key-down this.preventDefault key='ArrowDown'}}
tabindex="0" ...attributes>
class="shadow-md bg-gray-200 outline-none border border-gray-400 focus:border-teal-400 focus:shadow-lg">
{{yield {{yield
this.groupHasFocus this.groupHasFocus
this.selectedIndex this.selectedIndex

2
ember-ui/app/components/sortable-item-accessible.hbs
View file

@ -1,5 +1,5 @@
{{#let (and @groupHasFocus (eq @currentIndex @selectedIndex)) as |active|}} {{#let (and @groupHasFocus (eq @currentIndex @selectedIndex)) as |active|}}
<div class='border border-gray-400 {{if active 'relative border-orange-400'}}'> <div class='border border-gray-400 {{if active 'relative border-orange-400'}}' ...attributes>
{{#if active}} {{#if active}}
<button <button
{{on 'click' (fn @orderItemUp @currentIndex)}} {{on 'click' (fn @orderItemUp @currentIndex)}}