Esri / calcite-design-system

A monorepo containing the packages for Esri's Calcite Design System
https://developers.arcgis.com/calcite-design-system/
Other
290 stars 75 forks source link

Block: remove redundant indicator behavior #7492

Open SkyeSeitz opened 1 year ago

SkyeSeitz commented 1 year ago

Check existing issues

Description

Current behavior Loader populates both in the header and in the content area when expanded, which feels redundant and may imply two separate elements are loading.

image

Acceptance Criteria

Expected behavior Loader populates only in header when collapsed and only in content area when expanded.

image

Relevant Info

Building off of #6485

Which Component

Calcite Block

Example Use Case

No response

Priority impact

p4 - not time sensitive

Calcite package

Esri team

Calcite (design)

github-actions[bot] commented 1 year ago

cc @geospatialem, @brittneytewks

SkyeSeitz commented 1 year ago

cc @ashetland

ashetland commented 1 year ago

@macandcheese @asangma Is there a reason use case for having a loading indicator in the header while it's expanded that we're missing?

macandcheese commented 1 year ago

Not from my side. I do think it's strange the loader replaces the icon at all...

I wonder if a calcite-progress on the top of the block would make sense? It would eliminate the need to replace a user-placed element, and could subtly persist even while the block was expanded + calcite-loader present to prevent hiding / showing elements when expanding / collapsing. You do kind of lose the immediacy of the spinner being centered within the item when blocks are all collapsed, but this kind of loading often seen in "listy places" as well across Apps...

https://github.com/Esri/calcite-design-system/assets/4733155/3a2b3342-eb10-42c0-bdd8-8724df215265

macandcheese commented 1 year ago

I do like that the loader within the Block content area is smaller in the above screenshots - depending on height of Block content, it can feel too large currently.

ashetland commented 1 year ago

From #7147 and #7420, the loader size should be changing based on the height of the container. Those breakpoints can definitely be revised if we want to.

I like using Progress too, but I do see one drawback: when all the Blocks are collapsed it's hard to tell which one is actually loading.

SkyeSeitz commented 1 year ago

Yea, it would be a somewhat learned behavior that the Progress bar represents the Block below it. Other than that, I am digging the Progress bar as perhaps a more elegant solution. The dimmed treatment is also nice, however, I think I would ultimately say it probably does not need to persist when Block is expanded to simplify the amount of Loading indicators.

brittneytewks commented 11 months ago

Removed Figma changes label as this will be tracked in monday.com

ashetland commented 5 months ago

How do we feel about moving forward with this? Based on @SkyeSeitz's comment, would it work to use Progress to indicate loading only while Block is collapsed? image

SkyeSeitz commented 3 weeks ago

After research and exploration, there is not currently a great solution to move towards. Since this is a Calcite logged issue and low priority, we don't want to change anything until we have sufficient info on issues this causes the user.

@geospatialem can we move this to the freezer and bring it back in play if this issue comes up again in a more user-lead use case? TY