virtual-ui-lib 1.0.24 → 1.0.25
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/dist/index.js +46 -2
- package/dist/index.mjs +44 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -40,7 +40,8 @@ __export(index_exports, {
|
|
|
40
40
|
ImageUploadPreview: () => ImageUploadPreview,
|
|
41
41
|
Loader: () => Loader,
|
|
42
42
|
Navbar: () => Navbar,
|
|
43
|
-
OTPInput: () => OTPInput
|
|
43
|
+
OTPInput: () => OTPInput,
|
|
44
|
+
RatingStars: () => RatingStars
|
|
44
45
|
});
|
|
45
46
|
module.exports = __toCommonJS(index_exports);
|
|
46
47
|
|
|
@@ -721,6 +722,48 @@ var OTPInput = ({
|
|
|
721
722
|
}
|
|
722
723
|
)));
|
|
723
724
|
};
|
|
725
|
+
|
|
726
|
+
// src/components/RatingStars/RatingStars.jsx
|
|
727
|
+
var import_react13 = __toESM(require("react"));
|
|
728
|
+
var RatingStars = ({
|
|
729
|
+
totalStars = 5,
|
|
730
|
+
selectedColor = "#ffc107",
|
|
731
|
+
defaultColor = "#e4e5e9",
|
|
732
|
+
size = "24px",
|
|
733
|
+
onSelect
|
|
734
|
+
}) => {
|
|
735
|
+
const [hovered, setHovered] = (0, import_react13.useState)(0);
|
|
736
|
+
const [selected, setSelected] = (0, import_react13.useState)(0);
|
|
737
|
+
const handleMouseEnter = (index) => {
|
|
738
|
+
setHovered(index + 1);
|
|
739
|
+
};
|
|
740
|
+
const handleMouseLeave = () => {
|
|
741
|
+
setHovered(0);
|
|
742
|
+
};
|
|
743
|
+
const handleClick = (index) => {
|
|
744
|
+
setSelected(index + 1);
|
|
745
|
+
if (onSelect) onSelect(index + 1);
|
|
746
|
+
};
|
|
747
|
+
return /* @__PURE__ */ import_react13.default.createElement("div", { style: { display: "flex", gap: "4px" } }, [...Array(totalStars)].map((_, index) => /* @__PURE__ */ import_react13.default.createElement(
|
|
748
|
+
"svg",
|
|
749
|
+
{
|
|
750
|
+
key: index,
|
|
751
|
+
width: size,
|
|
752
|
+
height: size,
|
|
753
|
+
viewBox: "0 0 24 24",
|
|
754
|
+
fill: "none",
|
|
755
|
+
stroke: index < (hovered || selected) ? selectedColor : defaultColor,
|
|
756
|
+
strokeWidth: "1.5",
|
|
757
|
+
strokeLinecap: "round",
|
|
758
|
+
strokeLinejoin: "round",
|
|
759
|
+
onMouseEnter: () => handleMouseEnter(index),
|
|
760
|
+
onMouseLeave: handleMouseLeave,
|
|
761
|
+
onClick: () => handleClick(index),
|
|
762
|
+
style: { transition: "color 0.2s ease" }
|
|
763
|
+
},
|
|
764
|
+
/* @__PURE__ */ import_react13.default.createElement("polygon", { points: "12 2 15.09 8.26 22 9.27 17 14.14 18.18 21 12 17.77 5.82 21 7 14.14 2 9.27 8.91 8.26 12 2" })
|
|
765
|
+
)));
|
|
766
|
+
};
|
|
724
767
|
// Annotate the CommonJS export names for ESM import in node:
|
|
725
768
|
0 && (module.exports = {
|
|
726
769
|
AlertBanner,
|
|
@@ -734,5 +777,6 @@ var OTPInput = ({
|
|
|
734
777
|
ImageUploadPreview,
|
|
735
778
|
Loader,
|
|
736
779
|
Navbar,
|
|
737
|
-
OTPInput
|
|
780
|
+
OTPInput,
|
|
781
|
+
RatingStars
|
|
738
782
|
});
|
package/dist/index.mjs
CHANGED
|
@@ -675,6 +675,48 @@ var OTPInput = ({
|
|
|
675
675
|
}
|
|
676
676
|
)));
|
|
677
677
|
};
|
|
678
|
+
|
|
679
|
+
// src/components/RatingStars/RatingStars.jsx
|
|
680
|
+
import React13, { useState as useState10 } from "react";
|
|
681
|
+
var RatingStars = ({
|
|
682
|
+
totalStars = 5,
|
|
683
|
+
selectedColor = "#ffc107",
|
|
684
|
+
defaultColor = "#e4e5e9",
|
|
685
|
+
size = "24px",
|
|
686
|
+
onSelect
|
|
687
|
+
}) => {
|
|
688
|
+
const [hovered, setHovered] = useState10(0);
|
|
689
|
+
const [selected, setSelected] = useState10(0);
|
|
690
|
+
const handleMouseEnter = (index) => {
|
|
691
|
+
setHovered(index + 1);
|
|
692
|
+
};
|
|
693
|
+
const handleMouseLeave = () => {
|
|
694
|
+
setHovered(0);
|
|
695
|
+
};
|
|
696
|
+
const handleClick = (index) => {
|
|
697
|
+
setSelected(index + 1);
|
|
698
|
+
if (onSelect) onSelect(index + 1);
|
|
699
|
+
};
|
|
700
|
+
return /* @__PURE__ */ React13.createElement("div", { style: { display: "flex", gap: "4px" } }, [...Array(totalStars)].map((_, index) => /* @__PURE__ */ React13.createElement(
|
|
701
|
+
"svg",
|
|
702
|
+
{
|
|
703
|
+
key: index,
|
|
704
|
+
width: size,
|
|
705
|
+
height: size,
|
|
706
|
+
viewBox: "0 0 24 24",
|
|
707
|
+
fill: "none",
|
|
708
|
+
stroke: index < (hovered || selected) ? selectedColor : defaultColor,
|
|
709
|
+
strokeWidth: "1.5",
|
|
710
|
+
strokeLinecap: "round",
|
|
711
|
+
strokeLinejoin: "round",
|
|
712
|
+
onMouseEnter: () => handleMouseEnter(index),
|
|
713
|
+
onMouseLeave: handleMouseLeave,
|
|
714
|
+
onClick: () => handleClick(index),
|
|
715
|
+
style: { transition: "color 0.2s ease" }
|
|
716
|
+
},
|
|
717
|
+
/* @__PURE__ */ React13.createElement("polygon", { points: "12 2 15.09 8.26 22 9.27 17 14.14 18.18 21 12 17.77 5.82 21 7 14.14 2 9.27 8.91 8.26 12 2" })
|
|
718
|
+
)));
|
|
719
|
+
};
|
|
678
720
|
export {
|
|
679
721
|
AlertBanner,
|
|
680
722
|
Button,
|
|
@@ -687,5 +729,6 @@ export {
|
|
|
687
729
|
ImageUploadPreview,
|
|
688
730
|
Loader,
|
|
689
731
|
Navbar,
|
|
690
|
-
OTPInput
|
|
732
|
+
OTPInput,
|
|
733
|
+
RatingStars
|
|
691
734
|
};
|