blackbaud / skyux2

SKY UX 2 is the new version of Blackbaud’s user experience framework that implements Blackbaud design patterns. It extends the framework to abstract many complexities of modern web development and takes advantage of Angular 2 to increase the tooling, testing, and performance available.
https://developer.blackbaud.com/skyux
MIT License
32 stars 65 forks source link

List Toolbar inconsistent toolbar-item ordering when setting location #2348

Closed clo-dev closed 4 years ago

clo-dev commented 5 years ago

Expected behavior

When using two or more sky-list-toolbar-item elements with the location attribute set to left within a sky-list-toolbar, all sky-list-toolbar-items should appear to the far left on the toolbar

Actual behavior

All but one sky-list-toolbar-item is to the far left on the toolbar.

Steps to reproduce

  1. Create a list using the sky-list-toolbar with default button options (filters, etc)
  2. Create two sky-list-toolbar-item elements and set their location to left
  3. Change their index attribute (doesn't have the desired affect).

StackBlitz

https://stackblitz.com/edit/angular-skyux-list-toolbar-demo-rqbvnh

Blackbaud-TrevorBurch commented 4 years ago

In the meantime, you can add a second button to the template for one toolbar item. This isn't something we would advocate for long term but should be an ok workaround for any project blocked by this issue until a fix is in place.

https://angular-skyux-list-toolbar-demo-se13ix.stackblitz.io

Blackbaud-TrevorBurch commented 4 years ago

In skyux/list-builder version 3.8.1