add color name node

[mck]

As a user i want to create a fast headless system that should dynamically use color names, this node enables this by using html color names

[changeset-bot]

🦋 Changeset detected

Latest commit: 9acd228

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

Name	Type
@tokens-studio/graph-editor	Minor
@tokens-studio/graph-engine	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

PR Analysis

• 🎯 Main theme: Adding a new feature to the graph editor that allows users to get the name of a color.
• 📝 PR summary: This PR introduces a new node to the graph editor that allows users to get the name of a color. The color name node uses the chroma.js library to determine the name of the color. The PR includes changes to several files to integrate this new feature into the existing codebase.
• 📌 Type of PR: Enhancement
• 🧪 Relevant tests added: No
• ⏱️ Estimated effort to review [1-5]: 3, because the PR involves changes to multiple files and introduces a new feature, which requires a thorough review to ensure it integrates well with the existing codebase and doesn't introduce any bugs or issues.
• 🔒 Security concerns: No security concerns found

PR Feedback

• 💡 General suggestions: The PR looks good overall. The new feature is implemented in a clear and straightforward manner. However, it would be beneficial to add tests to ensure the new feature works as expected and doesn't introduce any bugs. Additionally, consider handling potential errors that could occur when using the chroma.js library to get the color name.

• 🤖 Code feedback:

  • relevant file: packages/graph-engine/src/nodes/color/name.ts
    suggestion: Consider adding error handling for the case where the chroma.js library fails to get the color name. This could be due to an invalid color input or other issues. You could use a try-catch block to handle potential errors and ensure the application doesn't crash in such cases. [important]
    relevant line: const names = namer(color, { pick: ["html"] })

  • relevant file: packages/graph-editor/src/components/flow/nodes/color/colorNameNode.tsx
    suggestion: Consider adding a default value for the color input in case it's not provided. This will ensure the application doesn't crash due to undefined values. [medium]
    relevant line: const { input, output, state, setState } = useNode();

How to use

To invoke the PR-Agent, add a comment using one of the following commands:
/review [-i]: Request a review of your Pull Request. For an incremental review, which only considers changes since the last review, include the '-i' option.
/describe: Modify the PR title and description based on the contents of the PR.
/improve [--extended]: Suggest improvements to the code in the PR. Extended mode employs several calls, and provides a more thorough feedback.
/ask <QUESTION>: Pose a question about the PR.
/update_changelog: Update the changelog based on the PR's contents.

To edit any configuration parameter from configuration.toml, add --config_path=new_value
For example: /review --pr_reviewer.extra_instructions="focus on the file: ..."
To list the possible configuration parameters, use the /config command.