feat(tab-title): add icon start/end custom CSS prop#10871
Conversation
github-actions
Bot
added
the
enhancement
jcfranco
force-pushed
the
jcfranco/10497-add-tab-title-icon-start-end-color-css-props
branch
from
83ef283 to
4832009
Compare
|
@alisonailea @driskull @macandcheese I couldn’t find an updated guideline in the wiki, but this ties back to our conversation last week about parent-child prop/token naming. I might need to rename the prop to use |
| * | ||
| * These properties can be overridden using the component's tag as selector. | ||
| * | ||
| * @prop --calcite-tab-end-icon-color: Specifies the component's `iconEnd` color. Fallback to `--calcite-icon-color`. |
There was a problem hiding this comment.
Would this make more sense as --calcite-tab-icon-start-color and --calcite-tab-icon-end-color instead of start/end-icon?
That would match the property names of iconStart and iconEnd (not startIcon / endIcon)?
There was a problem hiding this comment.
That's what I had originally, but changed to follow accordion-item.
There was a problem hiding this comment.
Maybe we could confirm that - that does seem like it should match the property name? If it is intended to be the opposite of prop name, feel free to ignore.
There was a problem hiding this comment.
Per the naming schema https://github.com/Esri/calcite-design-system/wiki/tokens-naming-schema is should be [system]-[component]-[element]-[type]-[appearance] which would be --calcite-tab-icon-color-start/end
There was a problem hiding this comment.
Based on ☝️, we'll need to correct accordion-item's props too. cc @geospatialem
@alisonailea Can you update the schema diagram to include start/end as examples?
There was a problem hiding this comment.
Added #10894 to next month's December milestone for the accordion-item token refactor. cc @alisonailea
There was a problem hiding this comment.
Updated the schema diagram to include start/end as examples
There was a problem hiding this comment.
@alisonailea @macandcheese Any additional feedback on the name and PR besides start/end?
jcfranco
added
the
pr ready for visual snapshots
jcfranco
added
pr ready for visual snapshots
jcfranco
force-pushed
the
jcfranco/10497-add-tab-title-icon-start-end-color-css-props
branch
from
0e0ee0a to
90b7213
Compare
jcfranco
added
pr ready for visual snapshots
|
Merging per #10871 (comment). @alisonailea LMK there's anything else that needs to be addressed. |
jcfranco
deleted the
jcfranco/10497-add-tab-title-icon-start-end-color-css-props
branch
geospatialem
modified the milestones:
2024-12-17 - Dec Milestone,
2024-11-26 - 3.0.0 Nov Breaking Change Milestone
**Related Issue:** #10497 ## Summary Adds the following component tokens (CSS props): ```scss --calcite-tab-icon-color-end – Specifies the component's `iconEnd` color. Fallback to `--calcite-icon-color`. --calcite-tab-icon-color-start – Specifies the component's `iconStart` color. Fallback to `--calcite-icon-color`. ```
4 participants
Related Issue: #10497
Summary
Adds the following component tokens (CSS props):