feat(colors): migrate ordinalColorScale to TypeScript

packages/colors/src/index.ts

@@ -1,5 +1,5 @@
 export * from './schemes'
-export * from './ordinalColorScale'
 export * from './inheritedColor'
-export * from './props'
 export * from './motion'
+export * from './ordinalColorScale'
+export * from './props'

packages/colors/src/inheritedColor.ts

@@ -13,35 +13,35 @@ export type ColorModifier = ColorModifierBrightness | ColorModifierDarkness | Co
 
 export type ColorModifierFunction = (color: RGBColor) => RGBColor
 
-export type InheritedColorPlain = string
+export type InheritedColorConfigStaticColor = string
 
-export type InheritedColorFunction<Datum> = (d: Datum) => string
+export type InheritedColorConfigCustomFunction<Datum> = (d: Datum) => string
 
-export interface InheritedColorFromTheme {
+export interface InheritedColorConfigFromTheme {
     theme: string
 }
 
-export interface InheritedColorFromContext {
+export interface InheritedColorConfigFromContext {
     from: string
     modifiers?: ColorModifier[]
 }
 
-export type InheritedColor<Datum> =
-    | InheritedColorPlain
-    | InheritedColorFunction<Datum>
-    | InheritedColorFromTheme
-    | InheritedColorFromContext
+export type InheritedColorConfig<Datum> =
+    | InheritedColorConfigStaticColor
+    | InheritedColorConfigCustomFunction<Datum>
+    | InheritedColorConfigFromTheme
+    | InheritedColorConfigFromContext
 
-const isInheritedColorFromTheme = <Datum>(
-    instruction: InheritedColor<Datum>
-): instruction is InheritedColorFromTheme => {
-    return (instruction as InheritedColorFromTheme).theme !== undefined
+const isInheritedColorConfigFromTheme = <Datum>(
+    config: InheritedColorConfig<Datum>
+): config is InheritedColorConfigFromTheme => {
+    return (config as InheritedColorConfigFromTheme).theme !== undefined
 }
 
-const isInheritedColorFromContext = <Datum>(
-    instruction: InheritedColor<Datum>
-): instruction is InheritedColorFromContext => {
-    return (instruction as InheritedColorFromContext).from !== undefined
+const isInheritedColorConfigFromContext = <Datum>(
+    config: InheritedColorConfig<Datum>
+): config is InheritedColorConfigFromContext => {
+    return (config as InheritedColorConfigFromContext).from !== undefined
 }
 
 /**
@@ -56,36 +56,36 @@ const isInheritedColorFromContext = <Datum>(
  * - static color
  */
 export const getInheritedColorGenerator = <Datum = any>(
-    instruction: InheritedColor<Datum>,
+    config: InheritedColorConfig<Datum>,
     theme?: Theme
 ) => {
     // user provided function
-    if (typeof instruction === 'function') {
-        return (datum: Datum) => instruction(datum)
+    if (typeof config === 'function') {
+        return (datum: Datum) => config(datum)
     }
 
-    if (isPlainObject(instruction)) {
+    if (isPlainObject(config)) {
         // use color from theme
-        if (isInheritedColorFromTheme(instruction)) {
+        if (isInheritedColorConfigFromTheme(config)) {
             if (theme === undefined) {
                 throw new Error(`Unable to use color from theme as no theme was provided`)
             }
 
-            const themeColor = get(theme, instruction.theme)
+            const themeColor = get(theme, config.theme)
             if (themeColor === undefined) {
-                throw new Error(`Color from theme is undefined at path: '${instruction.theme}'`)
+                throw new Error(`Color from theme is undefined at path: '${config.theme}'`)
             }
 
             return () => themeColor
         }
 
         // use color from parent with optional color modifiers
-        if (isInheritedColorFromContext(instruction)) {
-            const getColor = (d: Datum) => get(d, instruction.from)
+        if (isInheritedColorConfigFromContext(config)) {
+            const getColor = (d: Datum) => get(d, config.from)
 
-            if (Array.isArray(instruction.modifiers)) {
+            if (Array.isArray(config.modifiers)) {
                 const modifiers: ColorModifierFunction[] = []
-                for (const modifier of instruction.modifiers) {
+                for (const modifier of config.modifiers) {
                     const [modifierType, amount] = modifier
                     if (modifierType === 'brighter') {
                         modifiers.push(color => color.brighter(amount))
@@ -122,8 +122,10 @@ export const getInheritedColorGenerator = <Datum = any>(
     }
 
     // use provided color statically
-    return () => instruction as string
+    return () => config as string
 }
 
-export const useInheritedColor = <Datum = any>(instruction: InheritedColor<Datum>, theme?: Theme) =>
-    useMemo(() => getInheritedColorGenerator<Datum>(instruction, theme), [instruction, theme])
+export const useInheritedColor = <Datum = any>(
+    config: InheritedColorConfig<Datum>,
+    theme?: Theme
+) => useMemo(() => getInheritedColorGenerator<Datum>(config, theme), [config, theme])