react-star-picker - npm Package Compare versions

Comparing version 4.2.2 to 5.0.0

lib/esm/index.d.ts

@@ -11,4 +11,2 @@ import * as React from 'react';
     disabled: boolean;
-    /** the size of the stars in px (used for font-size, button widths). @deprecated To control the size of the stars, set the font-size property on the element with the StarPicker class via CSS instead. */
-    size: number;
 };
@@ -29,3 +27,3 @@ type StarPickerProps = Partial<SharedProps> & {
 
-declare const StarPicker: ({ value, onChange, name, className, starCount, size, disabled, halfStars, resettable, starRenderer, }: StarPickerProps) => React.JSX.Element;
+declare const StarPicker: ({ value, onChange, name, className, starCount, disabled, halfStars, resettable, starRenderer, }: StarPickerProps) => React.JSX.Element;
 
@@ -32,0 +30,0 @@ declare const defaultStarRenderer: () => React.ReactNode;

lib/esm/index.js

@@ -1,2 +0,1 @@
-"use client";import*as e from"react";const t=()=>e.createElement("div",{className:"DefaultStarComponent"},String.fromCharCode(9733)),a=(e,t)=>{let a=e;return Object.keys(t).forEach((e=>{t[e]&&(a+=` ${e}`)})),a},r=({halfStars:t,starRenderer:r,index:n,selectedIndex:s,hoverIndex:l})=>e.createElement("div",{className:a("StarPickerButtonContent",{halfStars:t})},r({index:n,selectedIndex:s,hoverIndex:l})),n=({index:t,selectedIndex:n,hoverIndex:s,onClick:l,onHoverChange:d,starRenderer:o,halfStars:c,disabled:i})=>{const u=t<=n,m=null!=s,h=m&&t<=s;return e.createElement("button",{"aria-label":`button ${t+1}`,className:a("StarPickerButton",{disabled:i,halfStars:c,selected:u,addSelection:m&&!u&&h,removeSelection:m&&u&&!h,isHovered:s===t,isClicked:t===n}),type:"button",onClick:()=>{l(t)},onMouseEnter:()=>{i||d(t)},onMouseLeave:()=>{i||d(null)},disabled:i},e.createElement(r,{halfStars:c,starRenderer:o,index:t,selectedIndex:n,hoverIndex:s}))},s=({value:a,onChange:r,name:s,className:l,starCount:d,size:o=34,disabled:c=!1,halfStars:i=!1,resettable:u=!1,starRenderer:m=t})=>{const[h,x]=e.useState(null),S=e=>{r&&r(((e,t,a,r)=>{const n=((e,t)=>t?(e+1)/2:e+1)(e,a);return r&&n===t?null:n})(e,a,i,u),s)},v=e=>{x(e)},f=d??5,C=((e,t)=>e?t?2*e-1:e-1:-1)(a,i),b=i?2*f:f;return e.createElement("div",{className:"StarPicker"+(l?` ${l}`:""),style:{fontSize:`${o}px`}},[...Array(b).keys()].map((t=>e.createElement(n,{key:`star-${t}`,index:t,selectedIndex:C,hoverIndex:h,onClick:S,onHoverChange:v,starRenderer:m,halfStars:i,disabled:c,size:o}))))};export{s as StarPicker,s as default,t as defaultStarRenderer};
-//# sourceMappingURL=index.js.map
+"use client";import*as e from"react";const t=()=>e.createElement("div",{className:"DefaultStarComponent"},String.fromCharCode(9733)),a=(e,t)=>{let a=e;return Object.keys(t).forEach((e=>{t[e]&&(a+=` ${e}`)})),a},r=({halfStars:t,starRenderer:r,index:n,selectedIndex:l,hoverIndex:s})=>e.createElement("div",{className:a("StarPickerButtonContent",{halfStars:t})},r({index:n,selectedIndex:l,hoverIndex:s})),n=({index:t,selectedIndex:n,hoverIndex:l,onClick:s,onHoverChange:d,starRenderer:o,halfStars:c,disabled:i})=>{const u=t<=n,m=null!=l,h=m&&t<=l;return e.createElement("button",{"aria-label":`button ${t+1}`,className:a("StarPickerButton",{disabled:i,halfStars:c,selected:u,addSelection:m&&!u&&h,removeSelection:m&&u&&!h,isHovered:l===t,isClicked:t===n}),type:"button",onClick:()=>{s(t)},onMouseEnter:()=>{i||d(t)},onMouseLeave:()=>{i||d(null)},disabled:i},e.createElement(r,{halfStars:c,starRenderer:o,index:t,selectedIndex:n,hoverIndex:l}))},l=({value:a,onChange:r,name:l,className:s,starCount:d,disabled:o=!1,halfStars:c=!1,resettable:i=!1,starRenderer:u=t})=>{const[m,h]=e.useState(null),x=e=>{r&&r(((e,t,a,r)=>{const n=((e,t)=>t?(e+1)/2:e+1)(e,a);return r&&n===t?null:n})(e,a,c,i),l)},S=e=>{h(e)},v=d??5,f=((e,t)=>e?t?2*e-1:e-1:-1)(a,c),C=c?2*v:v;return e.createElement("div",{className:"StarPicker"+(s?` ${s}`:"")},[...Array(C).keys()].map((t=>e.createElement(n,{key:`star-${t}`,index:t,selectedIndex:f,hoverIndex:m,onClick:x,onHoverChange:S,starRenderer:u,halfStars:c,disabled:o}))))};export{l as StarPicker,l as default,t as defaultStarRenderer};

package.json

 {
   "name": "react-star-picker",
-  "version": "4.2.2",
+  "version": "5.0.0",
   "description": "A star-rating component made with React",
@@ -71,2 +71,3 @@ "type": "module",
     "rollup-plugin-dts": "^6.1.0",
+    "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-preserve-directives": "^0.4.0",
@@ -73,0 +74,0 @@ "rollup-plugin-styles": "^4.0.0",

README.md

@@ -70,6 +70,1 @@ <h1 align="center">react-star-picker</h1>
 [Examples](https://mmkari.github.io/react-star-picker/docs/examples)
-
-## Component APIs
-
-- [`<StarPicker />`](/docs/components/StarPicker.md)
-- [`starRenderer()`](/docs/components/StarRenderer.md)

No alert changes

Worsened metrics

Total package byte prevSize

10117

-47.91%

Dev dependency count

35

2.94%

Number of package files

8

-11.11%

Lines of code

62

-44.14%

Number of lines in readme file

70

-6.67%

No dependency changes