feat: Expose token generating function

[tanishqmanuja]

Prerequisites

• [X] I have read the Contributing Guidelines.
• [X] I agree to follow the Code of Conduct.
• [X] I have searched for existing issues that already include this feature request, without success.

Describe the Feature Request

Currently it is very tedious to theme ionic dynamically at runtime using for example a seed color. The functions required to do so are already there and used in the docs.

Describe the Use Case

This is very common use-case as material design 3 (material you) has taken over android design system. Still ionic lacks behind for many years now, https://github.com/ionic-team/ionic-framework/issues/24282 was opened almost 3 years ago.

Describe Preferred Solution

No response

Describe Alternatives

For a while a have been using a hacky custom made lib - https://github.com/tanishqmanuja/ionic-color-injector. But an official alternative would allow for wider use cases.

Also then bridging the remaining gap using https://www.npmjs.com/package/@material/material-color-utilities would be awesome for users.

Related Code

No response

Additional Information

3 Categories of color token in ionic:

• Theme Colors (54 Tokens, 9 Colors with 6 Tokens each) https://ionicframework.com/docs/theming/colors Generator: https://ionicframework.com/docs/theming/themes#stepped-color-generator

• Application Colors (26 Tokens) https://ionicframework.com/docs/theming/themes#application-colors Generator: N/A

• Stepped Colors (38 Tokens, 19 for each background and text) Ref: https://ionicframework.com/docs/theming/themes#stepped-colors Generator: https://ionicframework.com/docs/theming/themes#stepped-color-generator

Source: https://github.com/ionic-team/ionic-docs/tree/main/src/components/page/theming Core Functionality: https://github.com/ionic-team/ionic-docs/tree/main/src/components/page/theming/_utils