import React from 'react';
import PropTypes from 'prop-types';
import cx from 'classnames';
import BaseView from '../../utils/rnw-compat/BaseView';
import { TEXT_COLORS } from '../../utils/constants';

const propTypes = {
  variant: PropTypes.oneOf(['border', 'grow']),
  color: PropTypes.oneOf(TEXT_COLORS),
  size: PropTypes.oneOf(['sm']),
};

const defaultProps = {
  variant: 'border',
  color: null,
  size: null,
};

function Spinner({ variant, color, size, ...elementProps }) {
  const classes = cx(
    // constant classes
    `spinner-${variant}`,
    // variable classes
    color && `text-${color}`,
    size === 'sm' && `spinner-${variant}-sm`,
  );

  return (
    <BaseView
      {...elementProps}
      accessiblityRole="alert"
      essentials={{ className: classes }}
    />
  );
}

Spinner.propTypes = propTypes;
Spinner.defaultProps = defaultProps;

export default Spinner;

@@ -96,20 +96,20 @@
 ort Base
-View
+Text
  from '.
@@ -134,20 +134,20 @@
 pat/Base
-View
+Text
 ';%0Aimpor
@@ -669,84 +669,35 @@
 urn 
-(%0A    %3CBaseView%0A      %7B...elementProps%7D%0A      accessiblityRole=%22alert%22%0A     
+%3CBaseText %7B...elementProps%7D
  ess
@@ -732,19 +732,11 @@
 s %7D%7D
-%0A    /%3E%0A  )
+ /%3E
 ;%0A%7D%0A

Fix Spinner component