Add toggle.ts and interactive.ts

styles/src/styleTree/interactive.ts

@@ -0,0 +1,26 @@
+interface Interactive<T> {
+  default: T,
+  hover?: T,
+  clicked?: T,
+  disabled?: T,
+}
+
+export function interactive<T>(base: T, modifications: Partial<Interactive<T>>): Interactive<T> {
+  const interactiveObj: Interactive<T> = {
+    default: base,
+  };
+
+  if (modifications.hover !== undefined) {
+    interactiveObj.hover = { ...base, ...modifications.hover };
+  }
+
+  if (modifications.clicked !== undefined) {
+    interactiveObj.clicked = { ...base, ...modifications.clicked };
+  }
+
+  if (modifications.disabled !== undefined) {
+    interactiveObj.disabled = { ...base, ...modifications.disabled };
+  }
+
+  return interactiveObj;
+}

styles/src/styleTree/toggle.ts

@@ -0,0 +1,17 @@
+interface Toggleable<T> {
+  inactive: T
+  active: T,
+}
+
+export function toggleable<T>(inactive: T, modifications: Partial<Toggleable<T>>): Toggleable<T> {
+  let active: T = inactive;
+  if (modifications.active !== undefined) {
+    active = { ...inactive, ...modifications.active };
+  }
+  return {
+    inactive: inactive,
+    active: active
+  };
+
+  d
+}