feat(accordion-item,radio-group-item): deprecate iconPosition & icon and add support for iconStart and iconEnd

[anveshmekala]

Related Issue: #4688

• This will allow users to add icon's both at the start and end of accordion-item and radio-group-item
• iconPosition with icon is deprecated in favor of icon-end and icon-start

Example : <calcite-radio-group-item icon-start="car" icon-end="car" value="car">Car</calcite-radio-group-item>

Note :

• New props always take precedence.
• Mixing deprecated props with new ones isn't supported.
• In radio-group-item use either icon with iconPosition or iconEnd & iconStart props but do not combine them.
• In accordion-item icon is an alias for iconStart.

Example:

Supported patterns:

<calcite-radio-group-item icon-start="car" icon-end="car" > </calcite-radio-group-item> OR <calcite-radio-group-item icon="car" icon-position="end" > </calcite-radio-group-item>

[github-actions[bot]]

This PR has been automatically marked as stale because it has not had recent activity. Please close your PR if it is no longer relevant. Thank you for your contributions.

[anveshmekala]

@geospatialem @benelan please suggest what would be the best way to include the notes section of the PR in docs. Thanks.

[benelan]

@geospatialem @benelan please suggest what would be the best way to include the notes section of the PR in docs. Thanks.

The description following the @deprecated jsdoc tag shows up in the doc, so I'd add it there for these two notes:

In radio-group-item use either icon with iconPosition or iconEnd & iconStart props but do not combine them. In accordion-item icon is an alias for iconStart.

@macandcheese what do you think about adding a tooltip to the deprecated chip that says

Where relevant, using deprecated properties with their replacement is not supported. However, replacement properties take precedence over deprecated properties when both are set.

Did I interpret that correctly for the first two notes Anvesh?

[benelan]

Is the behavior from those notes true throughout CC or just for the changes in this PR? If we added a tooltip like I suggested above it would show up on deprecated properties for all components.

[anveshmekala]

Is the behavior from those notes true throughout CC or just for the changes in this PR? If we added a tooltip like I suggested above it would show up on deprecated properties for all components.

This is related to the changes in PR but not the whole CC repo.

[anveshmekala]

@geospatialem @benelan please suggest what would be the best way to include the notes section of the PR in docs. Thanks.

The description following the @deprecated jsdoc tag shows up in the doc, so I'd add it there for these two notes:

In radio-group-item use either icon with iconPosition or iconEnd & iconStart props but do not combine them. In accordion-item icon is an alias for iconStart.

@macandcheese what do you think about adding a tooltip to the deprecated chip that says

Where relevant, using deprecated properties with their replacement is not supported. However, replacement properties take precedence over deprecated properties when both are set.

Did I interpret that correctly for the first two notes Anvesh?

SPOT ON .

I will add In radio-group-item use either icon with iconPosition or iconEnd & iconStart props but do not combine them. description following @deprecated tag in radio-group-item and for accordion it will be straightforward.

[anveshmekala]

@macandcheese this PR will add iconEnd position for accordion-item, please review the design. Thanks!

cc : @ashetland

[ashetland]

@macandcheese this PR will add iconEnd position for accordion-item, please review the design. Thanks!

cc : @ashetland

@SkyeSeitz Were we already aware of this? I thought I saw this mentioned in our kit....

[anveshmekala]

@macandcheese this PR will add iconEnd position for accordion-item, please review the design. Thanks! cc : @ashetland

@SkyeSeitz Were we already aware of this? I thought I saw this mentioned in our kit....

Wanted to make sure spacing and alignment match Figma.

[anveshmekala]

Can I get a design review for this one. Thanks

[ashetland]

Can I get a design review for this one. Thanks

We are looking at this today.

[ashetland]

@SkyeSeitz will follow up. Also adding @yelenakreyndel so we can start putting our process in place for design reviews.

[benelan]

RE: https://github.com/Esri/calcite-components/issues/4996#issuecomment-1210108567 - maybe we shouldn't doc how unsupported functionality behaves? If we really want to doc it, then it should be consistent. cc @jcfranco

[anveshmekala]

RE: #4996 (comment) - maybe we shouldn't doc how unsupported functionality behaves? If we really want to doc it, then it should be consistent. cc @jcfranco

The current implementation in this PR deviates from the pattern of keeping props in sync because of the dependency of one prop with the other ( icon and iconPosition ) whereas new props are independent (icon-start , icon-end) which increases the complexity of keeping props in sync. To avoid confusion we are documenting the unsupported behavior.

Referring to #4996 - even if one prop changes the other should change keeping both in sync.

[github-actions[bot]]

This PR has been automatically marked as stale because it has not had recent activity. Please close your PR if it is no longer relevant. Thank you for your contributions.

[anveshmekala]

any update on this one @SkyeSeitz ?

[SkyeSeitz]

any update on this one @SkyeSeitz ?

@ashetland and I have taken a look and this looks good to go. 🚀