import React from 'react';

import {
  RatingComponent
} from '@alicloud/console-components';
import {
  H3
} from '@alicloud/demo-rc-elements';

import {
  ITestingProps
} from '../../types';

const STAR_MAP: Record<number, string> = {
  1: '完全不行',
  2: '不行',
  3: '一般',
  4: '可以',
  5: '非常棒'
};

export default function Testing({
  component
}: ITestingProps<RatingComponent>): JSX.Element {
  const Rating = component;
  
  return <>
    <H3>有 <code>readAs</code> 则必须提供 id</H3>
    <Rating {...{
      id: 'rating-a11y-1',
      defaultValue: 3.5,
      readAs: (value: number) => STAR_MAP[value]
    }} />
  </>;
}