feat(theme): add ionic colors#30920
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
| @@ -1,9 +1,169 @@ | |||
| import * as colorTokens from 'outsystems-design-tokens/tokens/color scheme.json'; | |||
There was a problem hiding this comment.
The OS package does not export these tokens to be consumed in a JS/TS file. The package only provides Sass files to be consumed. As a workaround, I was able to access the original JSON files. I'll be reaching out to Bernardo requesting JS/TS exports once he comes back from vacation. In the mean time, consider this as a temporary solution in order to not be blocked.
There was a problem hiding this comment.
The plan was to remove this package from ionic-framework and have them set the token file on mobile UI. Is exporting these tokens part of the plan?
| color: { | ||
| primary: { | ||
| bold: { | ||
| base: cachedResolveOsToken(colorTokens.bg.primary.base.default, tokenMap), |
There was a problem hiding this comment.
If the export request is approved, then we can simply replace this with the correct tokens.
| // Create a cache to store results | ||
| const cache = new Map<any, any>(); | ||
|
|
||
| export const cachedResolveOsToken = (tokenPath: any, tokenMap: Record<string, any>): any => { |
There was a problem hiding this comment.
As mentioned in my previous comment, we only have the JSON files to access the ionic tokens. However, those tokens are not fully mapped to their correct values. This function makes sure to retrieve the right values and saves them to a map so we're not iterating so many times. If the export request is approved, then this function can be removed.
| "@global/*": ["src/global/*"] | ||
| } | ||
| }, | ||
| "resolveJsonModule": true, |
There was a problem hiding this comment.
As mentioned in my previous comment, we only have the JSON files to access the ionic tokens. This needs to be added in order to import the JSON files to light.tokens.ts or an error will be given.
brandyscarney
left a comment
There was a problem hiding this comment.
Just the one comment about us removing these tokens from the project & also a topic I brought up offline about the colors needing to match ios and md.
| @@ -1,9 +1,169 @@ | |||
| import * as colorTokens from 'outsystems-design-tokens/tokens/color scheme.json'; | |||
There was a problem hiding this comment.
The plan was to remove this package from ionic-framework and have them set the token file on mobile UI. Is exporting these tokens part of the plan?
|
Closing this ticket as |
Issue number: internal
What is the current behavior?
The colors for
ionictheme have not been set.What is the new behavior?
ionictheme.Does this introduce a breaking change?
Other information
Preview