✨ / 🎨 Add Component Icons + Node Appearance

[MFA-X-AI]

Description

This PR adds icons to certain component types.

You can set the type via decorator.

@xai_component(type='function')

The following types are supported:

• Start - automatically set for the Start and Finish nodes.
• workflow / xircuits_workflow - automatically set for workflow components
• branch
• function
• library_component / debug - the default icon for library components.
• context_get, context_set, variable

The icons are also displayed on the tray widget.

This PR also updates the node color scheme so that the component header will be colored, while the body will be gray.

Pull Request Type

• Xircuits Core (Jupyterlab Related changes)
• Xircuits Canvas (Custom RD Related changes)
• Xircuits Component Library
• Xircuits Project Template
• Testing Automation
• Documentation
• Others (Please Specify)

Type of Change

• New feature (non-breaking change which adds functionality)
• Bug fix (non-breaking change which fixes an issue)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

Tests

Tested on?

• Windows
• Linux Ubuntu
• Centos
• Mac
• Others (State here -> xxx )

Notes

Library components have been typed as debug before v1.12. This PR sets the type to be library_component.

[github-actions]

👈 Launch a binder notebook on branch XpressAI/xircuits/fahreza/custom-node-icons