StarRating.ts 721 B

1234567891011121314151617181920212223242526272829
  1. import React from 'react';
  2. export interface StarRatingProps {
  3. value: number;
  4. readonly?: boolean;
  5. onChange?: (value: number) => void;
  6. }
  7. export function StarRating({ value, readonly = false, onChange }: StarRatingProps) {
  8. return React.createElement(
  9. 'div',
  10. { className: 'react-star-rating', role: 'radiogroup', 'aria-label': 'star rating' },
  11. [1, 2, 3, 4, 5].map((score) =>
  12. React.createElement(
  13. 'button',
  14. {
  15. key: score,
  16. type: 'button',
  17. disabled: readonly,
  18. 'aria-label': `${score} stars`,
  19. className: score <= value ? 'star is-active' : 'star',
  20. onClick: () => onChange?.(score)
  21. },
  22. '*'
  23. )
  24. )
  25. );
  26. }