From df74698a9d0d9f0e63fe12f4409510f1ad8eb801 Mon Sep 17 00:00:00 2001
From: Marco Christian Krenn <marco.krenn@gmail.com>
Date: Tue, 17 Dec 2024 09:50:13 +0100
Subject: [PATCH 1/3] add hex to color space

---
 .changeset/slow-lobsters-hug.md                        | 5 +++++
 packages/graph-engine/src/nodes/color/colorToString.ts | 4 ++--
 2 files changed, 7 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/slow-lobsters-hug.md

diff --git a/.changeset/slow-lobsters-hug.md b/.changeset/slow-lobsters-hug.md
new file mode 100644
index 000000000..0f61ac592
--- /dev/null
+++ b/.changeset/slow-lobsters-hug.md
@@ -0,0 +1,5 @@
+---
+"@tokens-studio/graph-engine": patch
+---
+
+Add hex to color space selector
diff --git a/packages/graph-engine/src/nodes/color/colorToString.ts b/packages/graph-engine/src/nodes/color/colorToString.ts
index b03579a73..b9da799eb 100644
--- a/packages/graph-engine/src/nodes/color/colorToString.ts
+++ b/packages/graph-engine/src/nodes/color/colorToString.ts
@@ -12,7 +12,7 @@ export default class NodeDefinition extends Node {
 
 	declare inputs: ToInput<{
 		color: ColorType;
-		space: 'srgb' | 'hsl' | 'hex';
+		space: string;
 	}>;
 	declare outputs: ToOutput<{
 		value: string;
@@ -29,7 +29,7 @@ export default class NodeDefinition extends Node {
 		this.addInput('space', {
 			type: {
 				...StringSchema,
-				enum: ColorSpaces,
+				enum: ['hex', ...ColorSpaces].toSorted(),
 				default: 'hex'
 			},
 			visible: false

From bea052c6bbce2d7c1808f20238364a9bc8873011 Mon Sep 17 00:00:00 2001
From: Marco Christian Krenn <marco.krenn@gmail.com>
Date: Tue, 17 Dec 2024 09:57:26 +0100
Subject: [PATCH 2/3] fix input

---
 packages/graph-engine/src/nodes/color/colorToString.ts | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/packages/graph-engine/src/nodes/color/colorToString.ts b/packages/graph-engine/src/nodes/color/colorToString.ts
index b9da799eb..b59de9287 100644
--- a/packages/graph-engine/src/nodes/color/colorToString.ts
+++ b/packages/graph-engine/src/nodes/color/colorToString.ts
@@ -12,7 +12,7 @@ export default class NodeDefinition extends Node {
 
 	declare inputs: ToInput<{
 		color: ColorType;
-		space: string;
+		space: ['hex', ...typeof ColorSpaces];
 	}>;
 	declare outputs: ToOutput<{
 		value: string;
@@ -29,10 +29,9 @@ export default class NodeDefinition extends Node {
 		this.addInput('space', {
 			type: {
 				...StringSchema,
-				enum: ['hex', ...ColorSpaces].toSorted(),
+				enum: ['hex', ...ColorSpaces],
 				default: 'hex'
-			},
-			visible: false
+			}
 		});
 		this.addOutput('value', {
 			type: StringSchema
@@ -43,7 +42,7 @@ export default class NodeDefinition extends Node {
 		// eslint-disable-next-line prefer-const
 		const { color, space } = this.getAllInputs();
 
-		let adjustedSpace: string = space;
+		let adjustedSpace: string = space as string;
 		let format: { format: string } | undefined = undefined;
 
 		if (space == 'hex') {

From 24b4d2718b827d1e461c3624de2cc155a5e01564 Mon Sep 17 00:00:00 2001
From: Marco Christian Krenn <marco.krenn@gmail.com>
Date: Tue, 17 Dec 2024 10:41:52 +0100
Subject: [PATCH 3/3] address comments

---
 packages/graph-engine/src/nodes/color/colorToString.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/graph-engine/src/nodes/color/colorToString.ts b/packages/graph-engine/src/nodes/color/colorToString.ts
index b59de9287..2ccebeca5 100644
--- a/packages/graph-engine/src/nodes/color/colorToString.ts
+++ b/packages/graph-engine/src/nodes/color/colorToString.ts
@@ -1,6 +1,6 @@
 import { Black, toColor } from './lib/utils.js';
 import { ColorSchema, StringSchema } from '../../schemas/index.js';
-import { ColorSpaces } from './lib/spaces.js';
+import { type ColorSpace, ColorSpaces } from './lib/spaces.js';
 import { Color as ColorType } from '../../types.js';
 import { INodeDefinition, ToInput, ToOutput } from '../../index.js';
 import { Node } from '../../programmatic/node.js';
@@ -12,7 +12,7 @@ export default class NodeDefinition extends Node {
 
 	declare inputs: ToInput<{
 		color: ColorType;
-		space: ['hex', ...typeof ColorSpaces];
+		space: ColorSpace | 'hex';
 	}>;
 	declare outputs: ToOutput<{
 		value: string;