PromoCursed/node_modules/rc-rate
2024-08-20 23:25:37 +04:00
..
assets Первый коммит 2024-08-20 23:25:37 +04:00
es Первый коммит 2024-08-20 23:25:37 +04:00
lib Первый коммит 2024-08-20 23:25:37 +04:00
LICENSE.md Первый коммит 2024-08-20 23:25:37 +04:00
package.json Первый коммит 2024-08-20 23:25:37 +04:00
README.md Первый коммит 2024-08-20 23:25:37 +04:00

rc-rate

React Rate Component

NPM version npm download build status Codecov bundle size dumi

Screenshots

Changelog

Development

npm install
npm start

Example

install

rc-rate

Usage

import React from 'react';
import ReactDOM from 'react-dom';
import Rate from 'rc-rate';

ReactDOM.render(
  <Rate />,
  document.getElementById('root')
)

with styled-components

import React from 'react';
import ReactDOM from 'react-dom';
import Rate from 'rc-rate';
import styled from 'styled-components';

const StyledRate = styled(Rate)`
  &.rc-rate {
    font-size: ${({ size }) => size}px;
  }
`

ReactDOM.render(
  <StyledRate size="24" />,
  document.getElementById('root')
)

API

props

name type default description
count number 5 Star numbers
value number - Controlled value
defaultValue number 0 Initial value
allowHalf boolean false Support half star
allowClear boolean true Reset when click again
style object {}
onChange function (value) => {} onChange will be triggered when click
onHoverChange function (value) => {} onHoverChange will be triggered when hover on stars
character ReactNode | (props) => ReactNode The each character of rate
disabled boolean false
direction string ltr The direction of rate

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

rc-rate is released under the MIT license.