Esri / calcite-design-system

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

[Panel & Flow Item]: Refactor `"footer"` slot to account for `modal` #8981

Closed geospatialem closed 3 months ago

geospatialem commented 6 months ago

Description

Currently the panel and flow-item have a "footer" slot, however to accommodate the Dialog + Modal component effort in https://github.com/Esri/calcite-design-system/issues/7886, we may need to account of additional footer slots, such as "footer-start" and "footer-end" to match the "back / secondary / start" currently offered in the modal component.

Acceptance Criteria

Refactor panel and flow-item footer to include footer-end & footer-start slots with no built in spacing between or within slots

Which Component

Relevant Info

A dependency needed for the Dialog + Modal component effort in https://github.com/Esri/calcite-design-system/issues/7886

See Figma file for specs

image

Calcite package

macandcheese commented 6 months ago

Not sure if this applies to Card cc @ashetland @SkyeSeitz - I think it may have just been mentioned as a component that has footer-start/end slots.

SkyeSeitz commented 6 months ago

Agreed. I believe the idea was to confirm if we wanted more consistency between footers across components or if Card should be unique.

github-actions[bot] commented 5 months ago

cc @geospatialem, @brittneytewks

Elijbet commented 4 months ago

Can we determine the best approach for the footer slots? In most use cases do we want the footer as is without the need for start/end slots or is it the other way around? I'm wondering if the footer needs to be deprecated.

@ashetland @SkyeSeitz @macandcheese

Elijbet commented 4 months ago

From what I gather so far after speaking with @macandcheese and @geospatialem , footer-start/end will live alongside footer:

The question there is what happens when the footer and one or both of the new footer-start/end are populated? Do the new slots take precedence?


In the case of the panel, there is a header-content in addition to header-actions-start/end and they display next to each other. Would it make sense for the footer-start/end to just appear "around" the footer slot?

ashetland commented 4 months ago

Added visual changes due to default padding changes in the footer.

github-actions[bot] commented 3 months ago

Installed and assigned for verification.

geospatialem commented 3 months ago

The panel is good to go in 2.10.0-next.10 via https://codepen.io/geospatialem/pen/PovBzKM 👍🏻 , but it looks like the flow-item's slots are reversed as depicted in https://codepen.io/geospatialem/pen/pomZbwE.

image

Sending back to development for follow-up prior to release.

github-actions[bot] commented 3 months ago

Installed and assigned for verification.

DitwanP commented 3 months ago

🍡 Verified locally on dev.

flow-item slots are ordered correctly now 👌image

driskull commented 2 months ago

@DitwanP @geospatialem this introduced a regression. The following CSS prop isn't being honored anymore: https://github.com/Esri/calcite-design-system/commit/3def3ea51bc69dfd1ebefc6a1ef2bcfe0bdc943c#r144045487

--calcite-panel-footer-padding