Skip to content

Add a getTokenValue resolver to the design-system token-loader for component consumption #310

Description

@1nonlypiece

📌 Description

design-system/src/utils/token-loader.ts exposes loadTokens/getAllTokens,
but there's no ergonomic way to resolve a single token by a dotted path
(e.g. color.primary.light) with mode awareness. Consumers that want one value
must traverse the raw DTCG tree themselves.

This issue adds a getTokenValue(path, mode?) resolver to the loader.

🎯 Requirements and Context

  • Add getTokenValue(path, mode?) to token-loader.ts resolving dotted paths
    and returning the $value (light/dark aware where applicable).
  • Return undefined for unknown paths; never throw on missing tokens.
  • Re-export from design-system/src/index.ts.
  • Keep existing loader behavior intact.

🛠️ Suggested Execution

1. Fork the repo and create a branch

git checkout -b feature/get-token-value

2. Implement changes

  • Extend design-system/src/utils/token-loader.ts; re-export from index.ts.
  • Update design-system/src/__tests__/token-loader.test.ts.
  • Document it in design-system/documentation/token-catalog.md.

3. Test and commit

  • Run npm test in design-system.
  • Cover edge cases: valid path, unknown path, light vs dark, non-color token.

Example commit message

feat: add getTokenValue resolver to design-system token-loader

✅ Guidelines

  • Minimum 95% test coverage on new/changed lines.
  • No regressions in token-loader tests.
  • Timeframe: 96 hours.

🏷️ Labels

type-feature · type-enhancement · area-frontend · MAYBE REWARDED · GRANTFOX OSS · OFFICIAL CAMPAIGN

💬 Community & Support

  • Join the Disciplr contributor Discord to coordinate, ask questions, and get unblocked fast: https://discord.gg/xvNAvMJf
  • Please introduce yourself in the channel before you start so we can avoid duplicate work, pair you with a reviewer, and get your PR merged quickly.
  • Maintainers actively triage this channel and aim for fast, clear, respectful reviews — reach out any time you're blocked.

Metadata

Metadata

Assignees

Labels

GRANTFOX OSSGrantFox open-source campaignMAYBE REWARDEDEligible for GrantFox rewardOFFICIAL CAMPAIGNOfficial GrantFox campaign issueStellar WaveIssues in the Stellar wave programarea-frontendFrontend / UI worktype-enhancementImprovement to existing functionalitytype-featureNew feature work

Fields

No fields configured for Feature.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions