Repository navigation
docs(sassdoc): add project-specific parameters and review unused ones - #659
Conversation
simeonoff
changed the title
|
@adrianptrv Properties that are present in the schemas and not present in the themes for their respective components should be added, unless the token in the schema is used in just a single theme and for a specific edge case. Schema tokens and theme tokens should be in sync - that's the general rule. Tokens that are not used, or have been declared with the correct values from the design handoffs should be utilized in the target framework, even if it's just one of the component frameworks that uses them. About the tile manager, there's a real gap - we need to create a theme and also drop the custom overrides we currently do in the MCP server to cover for that omission. |
|
With my last commit i made the following changes: Color Picker:
|
There was a problem hiding this comment.
🟡 Changes recommended
Adding $filled-secondary-color in the middle of the public signature shifts existing positional arguments, silently changing generated tokens and breaking backward compatibility.
1 open issue
What changed in this PR
This PR clarifies platform-specific theming parameters in SassDoc and updates shared theme APIs and schemas, addressing part of #617’s parameter cleanup.
Changes:
- Mark Angular-only parameters and fill gaps in parameter documentation.
- Expose input filled-label and combo case-icon colors, with corresponding schema updates.
- Remove the unused color-picker preview border-radius key.
| File | Description |
|---|---|
packages/theming/sass/themes/schemas/components/light/_input-group.scss |
Update filled-label defaults across light variants. |
packages/theming/sass/themes/schemas/components/light/_combo.scss |
Rename the active case-icon color key. |
packages/theming/sass/themes/schemas/components/light/_color-picker.scss |
Remove the unused preview border-radius key. |
packages/theming/sass/themes/schemas/components/dark/_input-group.scss |
Add filled-label overrides for dark variants. |
packages/theming/sass/themes/components/tree/_tree-theme.scss |
Document the drop-area color as Angular-only. |
packages/theming/sass/themes/components/tabs/_tabs-theme.scss |
Document ripple colors as Angular-only. |
packages/theming/sass/themes/components/rating/_rating-theme.scss |
Document existing value-label parameters. |
packages/theming/sass/themes/components/input/_input-theme.scss |
Expose filled-label color and expand parameter documentation. |
packages/theming/sass/themes/components/expansion-panel/_expansion-panel-theme.scss |
Document expanded margin as Angular-only. |
packages/theming/sass/themes/components/combo/_combo-theme.scss |
Expose case-icon colors and update the documentation example. |
packages/theming/sass/themes/components/chip/_chip-theme.scss |
Document ghost styling parameters as Angular-only. |
Review effort: Balanced
There was a problem hiding this comment.
🟡 Changes recommended
The updated Sass example passes the background color as the positional $schema argument, causing map.has-key to fail instead of customizing the empty-list background.
1 open issue
1 resolved since last review
Review effort: Balanced
Update example in combo-theme documentation to specify white background. Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Closing: #617
To clarify the parameters that are used only on one platform, I made some changes to their SassDoc entries in their themes. For the parameters that aren't used on any platform, we need to make some decisions.
Properties used in only one project
Chip:
ghost-background,ghost-elevationExpansion Panel:
expanded-marginInput Group:
success-secondary-color,success-shadow-color,warning-secondary-colorTabs:
button-ripple-color,tab-ripple-colorTree:
drop-area-colorAll of the above are included in both schemas and their respective component themes, but are only used in the Angular project. I've added an additional note to their SassDoc descriptions in the themes stating that they should only be passed in Angular projects.
I think we should keep all of them as they are.
Properties that are only present in the schemas
Color Picker:
swatch-preview-border-radiusCombo:
case-icon-color,case-icon-color--activeInput Group:
filled-secondary-colorRating:
disabled-value-labelAll of the above are only present in the schemas. They aren't included in the themes or used anywhere in either Angular or Web Components.
Regarding the Combo case icons, I noticed that we have a component part called case-icon and CSS selectors using
case-iconandcase-icon--activein both projects. However, they don't use thecase-icon-colororcase-icon-color--active variables.Apart from the Combo parameters, I think we should remove the other parameters from the schemas as well.
Othes
Chip:
ghost-text-coloris included in both the schemas and the theme, but we don't use it anywhere in the Angular project. Perhaps we should start using it. I see that we used it at some point before introducing scoped styles.Tile Manager:
overlay-backgroundis only present in the schemas. The component doesn't have a theme, and I also checked the Web Components implementation but couldn't find anywhere this parameter is used with the current Tile Manager. Personally, I don't see a use case for including this parameter, so I think we should lean towards removing it.@simeonoff Could you please share your thoughts on the parameters, especially those that aren't used anywhere?