@zohodesk/a11y/es/ReadingMask/components/ReadingMask.js

In this Package, We Provide Some Basic Components For Accessibility.

import React from 'react';
import style from "./ReadingMask.module.css";
import useReadingMaskController from "../hooks/useReadingMaskController";
import { defaultProps } from "./props/defaultProps";
import { propTypes } from "./props/propTypes";

function ReadingMask(_ref) {
  let {
    uiConfig
  } = _ref;
  const {
    canvasState,
    getCanvasRef
  } = useReadingMaskController({
    uiConfig
  });
  const {
    width,
    height
  } = canvasState;

  if (!width || !height) {
    return null;
  }

  return /*#__PURE__*/React.createElement("canvas", {
    ref: getCanvasRef,
    width: width,
    height: height,
    className: style.canvasStyle
  });
}

ReadingMask.defaultProps = defaultProps;
ReadingMask.propTypes = propTypes;
export default ReadingMask;