{"size": 2312, "ext": "js", "max_stars_repo_path": "packages/component/src/Say.js", "max_stars_repo_name": "compulim/react-say", "max_stars_repo_stars_event_min_datetime": "2018-07-10T01:29:08.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-20T11:29:21.000Z", "max_issues_repo_path": "packages/component/src/Say.js", "max_issues_repo_name": "compulim/react-say", "max_issues_repo_issues_event_min_datetime": "2018-11-02T09:49:14.000Z", "max_issues_repo_issues_event_max_datetime": "2021-10-14T12:05:07.000Z", "max_forks_repo_path": "packages/component/src/Say.js", "max_forks_repo_name": "compulim/react-say", "max_forks_repo_forks_event_min_datetime": "2019-03-26T19:51:14.000Z", "max_forks_repo_forks_event_max_datetime": "2022-03-20T11:01:22.000Z"}
{"max_stars_count": 19, "max_issues_count": 13, "max_forks_count": 4, "avg_line_length": 19.7606837607, "max_line_length": 87, "alphanum_fraction": 0.6418685121}
import PropTypes from 'prop-types';
import React, { useContext, useMemo } from 'react';

import Composer from './Composer';
import Context from './Context';
import createNativeUtterance from './createNativeUtterance';
import migrateDeprecatedProps from './migrateDeprecatedProps';
import SayUtterance from './SayUtterance';

const Say = props => {
  const {
    lang,
    onBoundary,
    onEnd,
    onError,
    onStart,
    pitch,
    rate,
    speak,
    text,
    voice,
    volume
  } = migrateDeprecatedProps(props, Say);

  const { ponyfill } = useContext(Context);

  if (speak && !text) {
    console.warn('react-say: "speak" prop is being deprecated and renamed to "text".');
    text = speak;
  }

  const utterance = useMemo(() =>
    createNativeUtterance(
      ponyfill,
      {
        lang,
        onBoundary,
        pitch,
        rate,
        text,
        voice,
        volume
      }
    ),
    [
      lang,
      onBoundary,
      pitch,
      ponyfill,
      rate,
      text,
      voice,
      volume
    ]
  );

  return (
    <SayUtterance
      onEnd={ onEnd }
      onError={ onError }
      onStart={ onStart }
      ponyfill={ ponyfill }
      utterance={ utterance }
    />
  );
}

Say.defaultProps = {
  children: undefined,
  lang: undefined,
  onBoundary: undefined,
  onEnd: undefined,
  onError: undefined,
  onStart: undefined,
  pitch: undefined,
  rate: undefined,
  speak: undefined,
  voice: undefined,
  volume: undefined
};

Say.propTypes = {
  children: PropTypes.any,
  lang: PropTypes.string,
  onBoundary: PropTypes.func,
  onEnd: PropTypes.func,
  onError: PropTypes.func,
  onStart: PropTypes.func,
  pitch: PropTypes.number,
  rate: PropTypes.number,
  speak: PropTypes.string,
  text: PropTypes.string.isRequired,
  voice: PropTypes.oneOfType([PropTypes.any, PropTypes.func]),
  volume: PropTypes.number
};

const SayWithContext = ({ ponyfill, ...props }) => (
  <Composer ponyfill={ ponyfill }>
    <Say {...props} />
  </Composer>
);

SayWithContext.defaultProps = {
  ...SayUtterance.defaultProps,
  ponyfill: undefined
};

SayWithContext.propTypes = {
  ...SayUtterance.propTypes,
  ponyfill: PropTypes.shape({
    speechSynthesis: PropTypes.any.isRequired,
    SpeechSynthesisUtterance: PropTypes.any.isRequired
  })
};

export default SayWithContext
