chore: remove enums from project (#266)

src/lib/axes/axis_utils.test.ts

@@ -565,14 +565,13 @@ describe('Axis computational utils', () => {
     const tickSize = 10;
     const tickPadding = 5;
     const tickPosition = 0;
-    let axisPosition = Position.Left;
 
     const unrotatedLabelProps = getTickLabelProps(
       tickLabelRotation,
       tickSize,
       tickPadding,
       tickPosition,
-      axisPosition,
+      Position.Left,
       axis1Dims,
     );
 
@@ -589,7 +588,7 @@ describe('Axis computational utils', () => {
       tickSize,
       tickPadding,
       tickPosition,
-      axisPosition,
+      Position.Left,
       axis1Dims,
     );
 
@@ -600,13 +599,12 @@ describe('Axis computational utils', () => {
       verticalAlign: 'middle',
     });
 
-    axisPosition = Position.Right;
     const rightRotatedLabelProps = getTickLabelProps(
       tickLabelRotation,
       tickSize,
       tickPadding,
       tickPosition,
-      axisPosition,
+      Position.Right,
       axis1Dims,
     );
 
@@ -623,7 +621,7 @@ describe('Axis computational utils', () => {
       tickSize,
       tickPadding,
       tickPosition,
-      axisPosition,
+      Position.Right,
       axis1Dims,
     );
 
@@ -640,14 +638,13 @@ describe('Axis computational utils', () => {
     const tickSize = 10;
     const tickPadding = 5;
     const tickPosition = 0;
-    let axisPosition = Position.Top;
 
     const unrotatedLabelProps = getTickLabelProps(
       tickLabelRotation,
       tickSize,
       tickPadding,
       tickPosition,
-      axisPosition,
+      Position.Top,
       axis1Dims,
     );
 
@@ -664,7 +661,7 @@ describe('Axis computational utils', () => {
       tickSize,
       tickPadding,
       tickPosition,
-      axisPosition,
+      Position.Top,
       axis1Dims,
     );
 
@@ -675,13 +672,12 @@ describe('Axis computational utils', () => {
       verticalAlign: 'middle',
     });
 
-    axisPosition = Position.Bottom;
     const bottomRotatedLabelProps = getTickLabelProps(
       tickLabelRotation,
       tickSize,
       tickPadding,
       tickPosition,
-      axisPosition,
+      Position.Bottom,
       axis1Dims,
     );
 
@@ -698,7 +694,7 @@ describe('Axis computational utils', () => {
       tickSize,
       tickPadding,
       tickPosition,
-      axisPosition,
+      Position.Bottom,
       axis1Dims,
     );
 

src/lib/series/curves.ts

@@ -11,18 +11,30 @@ import {
   curveStepBefore,
 } from 'd3-shape';
 
-export const enum CurveType {
-  CURVE_CARDINAL,
-  CURVE_NATURAL,
-  CURVE_MONOTONE_X,
-  CURVE_MONOTONE_Y,
-  CURVE_BASIS,
-  CURVE_CATMULL_ROM,
-  CURVE_STEP,
-  CURVE_STEP_AFTER,
-  CURVE_STEP_BEFORE,
-  LINEAR,
-}
+export const CurveType = Object.freeze({
+  CURVE_CARDINAL: 0 as 0,
+  CURVE_NATURAL: 1 as 1,
+  CURVE_MONOTONE_X: 2 as 2,
+  CURVE_MONOTONE_Y: 3 as 3,
+  CURVE_BASIS: 4 as 4,
+  CURVE_CATMULL_ROM: 5 as 5,
+  CURVE_STEP: 6 as 6,
+  CURVE_STEP_AFTER: 7 as 7,
+  CURVE_STEP_BEFORE: 8 as 8,
+  LINEAR: 9 as 9,
+});
+
+export type CurveType =
+  | typeof CurveType.CURVE_CARDINAL
+  | typeof CurveType.CURVE_NATURAL
+  | typeof CurveType.CURVE_MONOTONE_X
+  | typeof CurveType.CURVE_MONOTONE_Y
+  | typeof CurveType.CURVE_BASIS
+  | typeof CurveType.CURVE_CATMULL_ROM
+  | typeof CurveType.CURVE_STEP
+  | typeof CurveType.CURVE_STEP_AFTER
+  | typeof CurveType.CURVE_STEP_BEFORE
+  | typeof CurveType.LINEAR;
 
 export function getCurveFactory(curveType: CurveType = CurveType.LINEAR) {
   switch (curveType) {

src/lib/series/specs.ts

@@ -105,7 +105,7 @@ export interface SeriesScales {
    * The x axis scale type
    * @default ScaleType.Ordinal
    */
-  xScaleType: ScaleType.Ordinal | ScaleType.Linear | ScaleType.Time;
+  xScaleType: typeof ScaleType.Ordinal | typeof ScaleType.Linear | typeof ScaleType.Time;
   /**
    * If using a ScaleType.Time this timezone identifier is required to
    * compute a nice set of xScale ticks. Can be any IANA zone supported by
@@ -242,27 +242,33 @@ export interface AxisStyle {
  * A left or right positioned axis is a vertical axis.
  * A top or bottom positioned axis is an horizontal axis.
  */
-export enum Position {
-  Top = 'top',
-  Bottom = 'bottom',
-  Left = 'left',
-  Right = 'right',
-}
+export const Position = Object.freeze({
+  Top: 'top' as 'top',
+  Bottom: 'bottom' as 'bottom',
+  Left: 'left' as 'left',
+  Right: 'right' as 'right',
+});
+
+export type Position = typeof Position.Top | typeof Position.Bottom | typeof Position.Left | typeof Position.Right;
 
 export const AnnotationTypes = Object.freeze({
-  Line: 'line' as AnnotationType,
-  Rectangle: 'rectangle' as AnnotationType,
-  Text: 'text' as AnnotationType,
+  Line: 'line' as 'line',
+  Rectangle: 'rectangle' as 'rectangle',
+  Text: 'text' as 'text',
 });
 
-export type AnnotationType = 'line' | 'rectangle' | 'text';
+export type AnnotationType =
+  | typeof AnnotationTypes.Line
+  | typeof AnnotationTypes.Rectangle
+  | typeof AnnotationTypes.Text;
 
 export const AnnotationDomainTypes = Object.freeze({
-  XDomain: 'xDomain' as AnnotationDomainType,
-  YDomain: 'yDomain' as AnnotationDomainType,
+  XDomain: 'xDomain' as 'xDomain',
+  YDomain: 'yDomain' as 'yDomain',
 });
 
-export type AnnotationDomainType = 'xDomain' | 'yDomain';
+export type AnnotationDomainType = typeof AnnotationDomainTypes.XDomain | typeof AnnotationDomainTypes.YDomain;
+
 export interface LineAnnotationDatum {
   dataValue: any;
   details?: string;

src/lib/themes/theme.ts

@@ -100,12 +100,13 @@ export interface Theme {
 
 export type PartialTheme = RecursivePartial<Theme>;
 
-export type BaseThemeType = 'light' | 'dark';
-export const BaseThemeTypes: Readonly<{ [key: string]: BaseThemeType }> = Object.freeze({
-  Light: 'light',
-  Dark: 'dark',
+export const BaseThemeTypes = Object.freeze({
+  Light: 'light' as 'light',
+  Dark: 'dark' as 'dark',
 });
 
+export type BaseThemeType = typeof BaseThemeTypes.Dark | typeof BaseThemeTypes.Light;
+
 export type DisplayValueStyle = TextStyle & {
   offsetX: number;
   offsetY: number;

src/lib/utils/interactions.ts

@@ -3,16 +3,23 @@ import { Datum, Rotation } from '../series/specs';
 import { Dimensions } from './dimensions';
 
 /** The type of tooltip to use */
-export enum TooltipType {
+export const TooltipType = Object.freeze({
   /** Vertical cursor parallel to x axis */
-  VerticalCursor = 'vertical',
+  VerticalCursor: 'vertical' as 'vertical',
   /** Vertical and horizontal cursors */
-  Crosshairs = 'cross',
+  Crosshairs: 'cross' as 'cross',
   /** Follor the mouse coordinates */
-  Follow = 'follow',
+  Follow: 'follow' as 'follow',
   /** Hide every tooltip */
-  None = 'none',
-}
+  None: 'none' as 'none',
+});
+
+export type TooltipType =
+  | typeof TooltipType.VerticalCursor
+  | typeof TooltipType.Crosshairs
+  | typeof TooltipType.Follow
+  | typeof TooltipType.None;
+
 export interface TooltipValue {
   name: string;
   value: any;

src/lib/utils/scales/scales.ts

@@ -17,13 +17,20 @@ export type ScaleFunction = (value: any) => number;
 /**
  * The scale type
  */
-export const enum ScaleType {
-  Linear = 'linear',
-  Ordinal = 'ordinal',
-  Log = 'log',
-  Sqrt = 'sqrt',
-  Time = 'time',
-}
+export const ScaleType = Object.freeze({
+  Linear: 'linear' as 'linear',
+  Ordinal: 'ordinal' as 'ordinal',
+  Log: 'log' as 'log',
+  Sqrt: 'sqrt' as 'sqrt',
+  Time: 'time' as 'time',
+});
+
+export type ScaleType =
+  | typeof ScaleType.Linear
+  | typeof ScaleType.Sqrt
+  | typeof ScaleType.Log
+  | typeof ScaleType.Time
+  | typeof ScaleType.Ordinal;
 
 export interface ScaleConfig {
   accessor: (value: any) => any;
@@ -32,6 +39,10 @@ export interface ScaleConfig {
   clamp?: boolean;
 }
 
-export type ScaleContinuousType = ScaleType.Linear | ScaleType.Sqrt | ScaleType.Log | ScaleType.Time;
-export type ScaleOrdinalType = ScaleType.Ordinal;
+export type ScaleContinuousType =
+  | typeof ScaleType.Linear
+  | typeof ScaleType.Sqrt
+  | typeof ScaleType.Log
+  | typeof ScaleType.Time;
+export type ScaleOrdinalType = typeof ScaleType.Ordinal;
 export type ScaleTypes = ScaleContinuousType | ScaleOrdinalType;

src/state/chart_state.ts

@@ -162,8 +162,8 @@ export class ChartStore {
   totalBarsInCluster?: number;
 
   tooltipData = observable.array<TooltipValue>([], { deep: false });
-  tooltipType = observable.box(DEFAULT_TOOLTIP_TYPE);
-  tooltipSnap = observable.box(DEFAULT_TOOLTIP_SNAP);
+  tooltipType = observable.box<TooltipType>(DEFAULT_TOOLTIP_TYPE);
+  tooltipSnap = observable.box<boolean>(DEFAULT_TOOLTIP_SNAP);
   tooltipPosition = observable.object<{ transform: string }>({ transform: '' });
   tooltipHeaderFormatter?: TooltipValueFormatter;
 

stories/interactions.tsx

@@ -185,7 +185,7 @@ storiesOf('Interactions', module)
       max: number('yDomain max', 10, {}, notSpecChange),
     };
 
-    const yScaleTypeOptions: { [key: string]: ScaleType.Linear | ScaleType.Log } = {
+    const yScaleTypeOptions: { [key: string]: typeof ScaleType.Linear | typeof ScaleType.Log } = {
       linear: ScaleType.Linear,
       log: ScaleType.Log,
     };