[ATable] Add loading skeleton and slot

[agritheory]

At the table config layer we want to be able to provide a loading message and a slot for a customized loading element.

There are two cases we're running into currently: 1) table loading data from server and 2) table loading from state management. It's possible that the state management API is quite slow, it would be good to do some testing and eliminate the need for this.

[agritheory]

@crabinak Let's do a mock up for this, I've got some ideas.

[crabinak]

@agritheory Here are some different possibilities for this. Elements from these can be mixed and matched (e.g. some use modals, some use spinner icons etc.)

Option 1: Spinner

Option 2: Gray Boxes

Since we do not necessarily know the amount of data coming in, this might not work as well (or could just popular 20 - 30 fields assuming there would be more than that).

Option 3: Loading Rows

Like the one above, we do not know the amount of rows that will appear, but this could just be a single row.

Option 4: Progress Bar

This one is my favorite. The time it takes to load does not matter as this would be an indeterminate loading bar like seen here (scroll down to the indeterminate bar animation) instead of showing actual loading progress.

Option 5: Infinite Progress Bar in Modal

Like the option above, but using a looping stripe animation. This bar is also in a modal to kind of tell the user "hey, the data behind me is not ready yet".

Option 6: Spinner in Modal

Combines Option 1 and 5.

I stuck with the lighter grays on these, but we could use darker colors as well. For some reason, I like the elements that have both an icon and "loading" message (Option 6 vs. Option 1).

[agritheory]

@crabinak Can you mock up a gray animated gradient similar to the changed row style?