Rw-rate NPM | npm.io

rc-rate

React Rate Component

Screenshots

Changelog

CHANGELOG

Development

npm install
npm start

Example

Local: http://localhost:9001/
Online: http://react-component.github.io/rate/

install

Usage

import React from 'react';
import ReactDOM from 'react-dom';
import Rate from 'rc-rate';
import 'rc-rate/assets/index.css';

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.

react react-component react-rate rate

@babel/runtime classnames rw-util

@infinitebrahmanuniverse/nolb-rw @everything-registry/sub-chunk-2694

0.1.7

4 years ago

0.1.5

4 years ago