react-char-fill 1.0.0 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -9
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -6,15 +6,15 @@ A versatile React component library for creating flexible character-based rating
|
|
|
6
6
|
|
|
7
7
|
To install the package, use npm, yarn, or bun:
|
|
8
8
|
|
|
9
|
-
npm install react-char-fill
|
|
9
|
+
`npm install react-char-fill`
|
|
10
10
|
|
|
11
11
|
or
|
|
12
12
|
|
|
13
|
-
yarn add react-char-fill
|
|
13
|
+
`yarn add react-char-fill`
|
|
14
14
|
|
|
15
15
|
or
|
|
16
16
|
|
|
17
|
-
bun add react-char-fill
|
|
17
|
+
`bun add react-char-fill`
|
|
18
18
|
|
|
19
19
|
## Usage
|
|
20
20
|
|
|
@@ -22,11 +22,12 @@ bun add react-char-fill
|
|
|
22
22
|
|
|
23
23
|
Here is a basic example of how to use the `CharacterRating` component:
|
|
24
24
|
|
|
25
|
+
```jsx
|
|
25
26
|
import CharacterRating from 'react-char-fill';
|
|
26
27
|
|
|
27
28
|
const App = () => {
|
|
28
|
-
return (
|
|
29
|
-
<CharacterRating
|
|
29
|
+
return (
|
|
30
|
+
<CharacterRating
|
|
30
31
|
rating={3.5}
|
|
31
32
|
character="★"
|
|
32
33
|
maxRating={5}
|
|
@@ -35,20 +36,22 @@ return (
|
|
|
35
36
|
interactive={false}
|
|
36
37
|
step={0.5}
|
|
37
38
|
/>
|
|
38
|
-
);
|
|
39
|
+
);
|
|
39
40
|
};
|
|
40
41
|
|
|
41
42
|
export default App;
|
|
43
|
+
```
|
|
42
44
|
|
|
43
45
|
### Advanced Example
|
|
44
46
|
|
|
45
47
|
You can also customize the colors, font size, and other props:
|
|
46
48
|
|
|
49
|
+
```jsx
|
|
47
50
|
import CharacterRating from 'react-char-fill';
|
|
48
51
|
|
|
49
52
|
const App = () => {
|
|
50
|
-
return (
|
|
51
|
-
<CharacterRating
|
|
53
|
+
return (
|
|
54
|
+
<CharacterRating
|
|
52
55
|
rating={4.2}
|
|
53
56
|
character="☆"
|
|
54
57
|
maxRating={10}
|
|
@@ -58,10 +61,11 @@ return (
|
|
|
58
61
|
interactive={true}
|
|
59
62
|
step={0.1}
|
|
60
63
|
/>
|
|
61
|
-
);
|
|
64
|
+
);
|
|
62
65
|
};
|
|
63
66
|
|
|
64
67
|
export default App;
|
|
68
|
+
```
|
|
65
69
|
|
|
66
70
|
## API Documentation
|
|
67
71
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-char-fill",
|
|
3
3
|
"description": "A React component for creating flexible character-based ratings, perfect for star ratings and other similar use cases.",
|
|
4
|
-
"version": "1.0.
|
|
4
|
+
"version": "1.0.2",
|
|
5
5
|
"main": "dist/react-char-fill.umd.js",
|
|
6
6
|
"module": "dist/react-char-fill.es.js",
|
|
7
7
|
"types": "dist/index.d.ts",
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
},
|
|
50
50
|
"repository": {
|
|
51
51
|
"type": "git",
|
|
52
|
-
"url": "https://github.com/lexabu/react-char-fill.git"
|
|
52
|
+
"url": "git+https://github.com/lexabu/react-char-fill.git"
|
|
53
53
|
},
|
|
54
54
|
"keywords": [
|
|
55
55
|
"react",
|