How to use the d3-interpolate.interpolateLab function in d3-interpolate

iString = d3Interpolate.interpolateRgbBasis(['seagreen', d3Hsv.hsv('steelblue'), 'rgb(100, 100, 100)']);
iString = d3Interpolate.interpolateRgbBasisClosed(['seagreen', d3Hsv.hsv('steelblue'), 'rgb(100, 100, 100)']);

// test interpolateHsl(a, b) and interpolateHslLong(a, b)----------------------------------------------------------------

iString = d3Interpolate.interpolateHsl('seagreen', 'steelblue');
iString = d3Interpolate.interpolateHsl(d3Color.rgb('seagreen'), d3Color.hcl('steelblue'));
iString = d3Interpolate.interpolateHsl(d3Color.rgb('seagreen'), d3Hsv.hsv('steelblue'));

iString = d3Interpolate.interpolateHslLong('seagreen', 'steelblue');
iString = d3Interpolate.interpolateHslLong(d3Color.rgb('seagreen'), d3Color.hcl('steelblue'));
iString = d3Interpolate.interpolateHslLong(d3Color.rgb('seagreen'), d3Hsv.hsv('steelblue'));

// test interpolateLab(a, b) --------------------------------------------------------------------------------------------

iString = d3Interpolate.interpolateLab('seagreen', 'steelblue');
iString = d3Interpolate.interpolateLab(d3Color.rgb('seagreen'), d3Color.hcl('steelblue'));
iString = d3Interpolate.interpolateLab(d3Color.rgb('seagreen'), d3Hsv.hsv('steelblue'));

// test interpolateHcl(a, b) and interpolateHclLong(a, b) ----------------------------------------------------------------

iString = d3Interpolate.interpolateHcl('seagreen', 'steelblue');
iString = d3Interpolate.interpolateHcl(d3Color.rgb('seagreen'), d3Color.hcl('steelblue'));
iString = d3Interpolate.interpolateHcl(d3Color.rgb('seagreen'), d3Hsv.hsv('steelblue'));

iString = d3Interpolate.interpolateHclLong('seagreen', 'steelblue');
iString = d3Interpolate.interpolateHclLong(d3Color.rgb('seagreen'), d3Color.hcl('steelblue'));
iString = d3Interpolate.interpolateHclLong(d3Color.rgb('seagreen'), d3Hsv.hsv('steelblue'));

// test interpolateCubehelix(a, b) and interpolateCubehelixLong(a, b) ---------------------------------------------------

// without gamma correction

box-sizing: border-box;
  font-size: 1em;
  padding: 0px 0 0 2.5em;
  border: none;
  border-radius: 0;
  background-color: transparent;
  margin: 0;
  
  ${props => props.disabled ? 'cursor: pointer;' : ''}

  transition: width 0.3s ease-out, height 0.3s ease-out;

  &:focus, &.focus-ring {
    outline: none;
    box-shadow: none;
    /* background-color: ${interpolateLab('#eee', colors.linkColor)(0.1)}; */
  }

  &::-webkit-input-placeholder,
  &::-moz-placeholder,
  &:-moz-placeholder,
  &::-ms-input-placeholder,
  &:-ms-input-placeholder {
    color: #333;
    opacity: 1;
  }

  &:disabled {
    opacity: 1;
  }
`;

return { threshold, color: fixedColor };
      }

      //if (thresholds.mode === 'thresholds-interpolate') {
      //j}

      const color = getColorFromHexRgbOrName(threshold.color, themeType);

      // interpolate by finding next threshold color
      const thresholdIndex = thresholds.step.findIndex(item => item === threshold);

      if (thresholds.step.length - 1 > thresholdIndex) {
        const nextThreshold = thresholds.step[thresholdIndex + 1];

        const color2 = getColorFromHexRgbOrName(nextThreshold.color, themeType);
        const interpolator = interpolateLab(color, color2);
        const delta = nextThreshold.value - threshold.value;
        const interpolationBasis = 1 - (nextThreshold.value - value) / delta;

        return { threshold, color: interpolator(interpolationBasis) };
      }

      return {
        threshold,
        color: color,
      };
    };
  }

},
  inputBorder: '#ddd',
  textMuted: 'rgba(0,0,0,0.4)',
  focusOutline: '#C3E8FD',
};

colors.coldBackgroundColor = hsl(colors.linkBackgroundColorTransparent);
colors.coldBackgroundColor.opacity *= 0.5;
colors.halfTonedDownSelectedColor = interpolateLab(
  colors.tonedDownSelectedColor,
  colors.selectedColor
)(0.5);
colors.borderColor = interpolateLab(colors.tonedDownSelectedColor, 'rgba(255, 255, 255, 0.5)')(0.6);
colors.editHintBackgroundColor = hsl(colors.linkColor).darker(0.5);
colors.editHintBackgroundColor.s -= 0.5;
colors.textColorTonedDown = interpolateLab(colors.tonedDownSelectedColor, colors.textColor)(0.5);

export function getHTMLColorForWheelchairAccessibilityValue(
  isAccessible: YesNoLimitedUnknown
): string {
  return colors.markers.background[isAccessible];
}

export function getColorForWheelchairAccessibility(properties: NodeProperties): string {
  return isWheelchairAccessible(properties);
}

const interpolateYesLimited = interpolateLab(
  colors.markers.background.limited,
  colors.markers.background.yes
);

no: '#fff',
      unknown: '#69615b',
    },
  },
  inputBorder: '#ddd',
  textMuted: 'rgba(0,0,0,0.4)',
  focusOutline: '#C3E8FD',
};

colors.coldBackgroundColor = hsl(colors.linkBackgroundColorTransparent);
colors.coldBackgroundColor.opacity *= 0.5;
colors.halfTonedDownSelectedColor = interpolateLab(
  colors.tonedDownSelectedColor,
  colors.selectedColor
)(0.5);
colors.borderColor = interpolateLab(colors.tonedDownSelectedColor, 'rgba(255, 255, 255, 0.5)')(0.6);
colors.editHintBackgroundColor = hsl(colors.linkColor).darker(0.5);
colors.editHintBackgroundColor.s -= 0.5;
colors.textColorTonedDown = interpolateLab(colors.tonedDownSelectedColor, colors.textColor)(0.5);

export function getHTMLColorForWheelchairAccessibilityValue(
  isAccessible: YesNoLimitedUnknown
): string {
  return colors.markers.background[isAccessible];
}

export function getColorForWheelchairAccessibility(properties: NodeProperties): string {
  return isWheelchairAccessible(properties);
}

const interpolateYesLimited = interpolateLab(
  colors.markers.background.limited,

return ['$', (value / 1000000).toLocaleString(), ' M'].join('');
  } else if (value > 1000) {
    return ['$', (value / 1000).toLocaleString(), ' k'].join('');
  }
  return ['$', value.toLocaleString()].join('');
};

const getDollarsForTooltips = value => (
  [value < 0 ? '-$' : '$', Math.abs(value).toLocaleString()].join('')
);

const getTopLevelOnly = data => (
  data.map(item => (Object.assign({}, item, { children: null })))
);

const positiveColor = scaleSequential(interpolateLab('#ffffff', '#0099ff')).domain([0, 100]);
const negativeColor = scaleSequential(interpolateLab('#ffffff', '#ff9933')).domain([0, -100]);
const percentToFloat = percent => parseFloat(percent.replace('%', '')) / 100.0


class Treemap extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      showingLabels: props.showingLabels,
    };
    this.toggleLabels = this.toggleLabels.bind(this);
    this.altText = props.altText;
  }

  toggleLabels(event) {
    if (event.target.id === 'toggleLabels') {

render() {
    const graph = {
      nodes: JSON.parse(JSON.stringify(this.props.nodes))
        .map((d, i) => {
          d.id = i;
          return d;
        })
        .sort((a, b) => b.value - a.value),
      links: JSON.parse(JSON.stringify(this.props.links)),
    };

    const lighterColor = '#559ecc';
    const darkerColor = '#4292c6';
    const nodeColor = scaleSequential(interpolateLab(darkerColor, lighterColor));

    return (
      <div tabindex="{0}" aria-label="{this.props.altText}" role="img">
        </div>

function getWheelchairAccessibilityColors(
  definedCount: number,
  averageRatingForDefined: number,
  clampedDefinedRatio: number
) {
  if (definedCount === 0) {
    return {
      backgroundColor: colors.markers.background.unknown,
      foregroundColor: colors.markers.foreground.unknown,
    };
  }

  const averageAccessibilityForDefinedBackground = definedAccessibilityBackgroundColorScale(
    averageRatingForDefined
  );
  const backgroundColor = interpolateLab(
    colors.markers.background.unknown,
    averageAccessibilityForDefinedBackground
  )(clampedDefinedRatio);

  const foregroundColor = 'white';

  return { backgroundColor, foregroundColor };
}

background-color: ${props =>
        props.hoverColor ||
        interpolateLab(props.activeColor || colors.selectedColor, colors.tonedDownSelectedColor)(
          0.5
        )};
    }

render() {
    const graph = {
      nodes: JSON.parse(JSON.stringify(this.props.nodes))
        .map((d, i) => { d.id = i; return d; })
        .sort((a, b) => b.value - a.value),
      links: JSON.parse(JSON.stringify(this.props.links)),
    };

    const lighterColor = '#559ecc';
    const darkerColor = '#4292c6';
    const nodeColor = scaleSequential(interpolateLab(darkerColor, lighterColor));

    return (<div style="{{" tabindex="{0}" aria-label="{this.props.altText}">
       n.name)}
        edges={graph.links}
        hoverAnnotation
        margin={{
          top: 0,
          right: 10,
          bottom: 25,
          left: 10,</div>