version-pill-react 1.5.1 → 1.6.1

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.mjs CHANGED
@@ -217,7 +217,7 @@ function VersionPill({
217
217
  }
218
218
  }, [projectId, baseUrl]);
219
219
  const submitIdea = useCallback(async () => {
220
- if (!ideaTitle.trim()) return;
220
+ if (!ideaTitle.trim() || !ideaAuthorEmail.trim()) return;
221
221
  setSubmittingIdea(true);
222
222
  setIdeaSubmitMessage(null);
223
223
  try {
@@ -228,7 +228,7 @@ function VersionPill({
228
228
  title: ideaTitle.trim(),
229
229
  description: ideaDescription.trim() || void 0,
230
230
  authorName: ideaAuthorName.trim() || void 0,
231
- authorEmail: ideaAuthorEmail.trim() || void 0
231
+ authorEmail: ideaAuthorEmail.trim()
232
232
  })
233
233
  });
234
234
  if (!response.ok) {
@@ -238,6 +238,8 @@ function VersionPill({
238
238
  setIdeaSubmitMessage({ type: "success", text: "Thanks! Your idea has been submitted." });
239
239
  setIdeaTitle("");
240
240
  setIdeaDescription("");
241
+ setIdeaAuthorName("");
242
+ setIdeaAuthorEmail("");
241
243
  setShowIdeaForm(false);
242
244
  fetchIdeas();
243
245
  } catch (err) {
@@ -251,10 +253,9 @@ function VersionPill({
251
253
  setIdeas((prev) => prev.map((i) => i.id === ideaId ? { ...i, votes: i.votes + 1 } : i));
252
254
  setVotedIdeas((prev) => new Set(prev).add(ideaId));
253
255
  try {
254
- await fetch(`${baseUrl}/api/ideas/${projectId}/vote`, {
256
+ await fetch(`${baseUrl}/api/vote/${ideaId}`, {
255
257
  method: "POST",
256
- headers: { "Content-Type": "application/json" },
257
- body: JSON.stringify({ ideaId })
258
+ headers: { "Content-Type": "application/json" }
258
259
  });
259
260
  } catch {
260
261
  setIdeas((prev) => prev.map((i) => i.id === ideaId ? { ...i, votes: i.votes - 1 } : i));
@@ -902,24 +903,22 @@ function VersionPill({
902
903
  padding: "12px 16px",
903
904
  marginBottom: 20,
904
905
  borderRadius: 999,
905
- border: `1px dashed ${isLight ? "#d4d4d8" : "#3f3f46"}`,
906
- background: "transparent",
907
- color: isLight ? "#71717a" : "#a1a1aa",
906
+ border: `1px solid ${isLight ? "#22c55e" : "rgba(34,197,94,0.4)"}`,
907
+ background: isLight ? "rgba(34,197,94,0.05)" : "rgba(34,197,94,0.08)",
908
+ color: "#22c55e",
908
909
  fontSize: 14,
909
910
  fontWeight: 500,
910
911
  cursor: "pointer",
911
912
  transition: "all 150ms"
912
913
  },
913
914
  onMouseEnter: (e) => {
914
- e.currentTarget.style.borderColor = isLight ? "#a1a1aa" : "#71717a";
915
- e.currentTarget.style.color = isLight ? "#52525b" : "#d4d4d8";
915
+ e.currentTarget.style.background = isLight ? "rgba(34,197,94,0.1)" : "rgba(34,197,94,0.15)";
916
916
  },
917
917
  onMouseLeave: (e) => {
918
- e.currentTarget.style.borderColor = isLight ? "#d4d4d8" : "#3f3f46";
919
- e.currentTarget.style.color = isLight ? "#71717a" : "#a1a1aa";
918
+ e.currentTarget.style.background = isLight ? "rgba(34,197,94,0.05)" : "rgba(34,197,94,0.08)";
920
919
  },
921
920
  children: [
922
- /* @__PURE__ */ jsx("span", { style: { fontSize: 18 }, children: "\u{1F4A1}" }),
921
+ /* @__PURE__ */ jsx("span", { style: { fontSize: 16 }, children: "\u{1F4A1}" }),
923
922
  "Suggest a feature"
924
923
  ]
925
924
  }
@@ -930,12 +929,12 @@ function VersionPill({
930
929
  padding: 16,
931
930
  marginBottom: 20,
932
931
  borderRadius: 12,
933
- background: isLight ? "#f5f5f5" : "#151515",
932
+ background: isLight ? "#f9fafb" : "#151515",
934
933
  border: `1px solid ${isLight ? "#e5e5e5" : "#1f1f1f"}`
935
934
  },
936
935
  children: [
937
936
  /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: 12 }, children: [
938
- /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: isLight ? "#18181b" : "#fff" }, children: "Suggest a Feature" }),
937
+ /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, fontSize: 15, color: isLight ? "#18181b" : "#fff" }, children: "Suggest a Feature" }),
939
938
  /* @__PURE__ */ jsx(
940
939
  "button",
941
940
  {
@@ -943,13 +942,7 @@ function VersionPill({
943
942
  setShowIdeaForm(false);
944
943
  setIdeaSubmitMessage(null);
945
944
  },
946
- style: {
947
- background: "transparent",
948
- border: "none",
949
- color: isLight ? "#71717a" : "#a1a1aa",
950
- cursor: "pointer",
951
- fontSize: 18
952
- },
945
+ style: { background: "transparent", border: "none", color: isLight ? "#71717a" : "#a1a1aa", cursor: "pointer", fontSize: 18 },
953
946
  children: "\xD7"
954
947
  }
955
948
  )
@@ -965,7 +958,7 @@ function VersionPill({
965
958
  width: "100%",
966
959
  padding: "10px 12px",
967
960
  marginBottom: 8,
968
- borderRadius: 6,
961
+ borderRadius: 8,
969
962
  border: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
970
963
  background: isLight ? "#fff" : "#0a0a0a",
971
964
  color: isLight ? "#18181b" : "#fff",
@@ -986,7 +979,7 @@ function VersionPill({
986
979
  width: "100%",
987
980
  padding: "10px 12px",
988
981
  marginBottom: 8,
989
- borderRadius: 6,
982
+ borderRadius: 8,
990
983
  border: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
991
984
  background: isLight ? "#fff" : "#0a0a0a",
992
985
  color: isLight ? "#18181b" : "#fff",
@@ -1004,11 +997,11 @@ function VersionPill({
1004
997
  type: "text",
1005
998
  value: ideaAuthorName,
1006
999
  onChange: (e) => setIdeaAuthorName(e.target.value),
1007
- placeholder: "Name (optional)",
1000
+ placeholder: "Your name",
1008
1001
  style: {
1009
1002
  width: "100%",
1010
1003
  padding: "8px 12px",
1011
- borderRadius: 6,
1004
+ borderRadius: 8,
1012
1005
  border: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
1013
1006
  background: isLight ? "#fff" : "#0a0a0a",
1014
1007
  color: isLight ? "#18181b" : "#fff",
@@ -1028,7 +1021,7 @@ function VersionPill({
1028
1021
  style: {
1029
1022
  width: "100%",
1030
1023
  padding: "8px 12px",
1031
- borderRadius: 6,
1024
+ borderRadius: 8,
1032
1025
  border: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
1033
1026
  background: isLight ? "#fff" : "#0a0a0a",
1034
1027
  color: isLight ? "#18181b" : "#fff",
@@ -1042,7 +1035,7 @@ function VersionPill({
1042
1035
  ideaSubmitMessage && /* @__PURE__ */ jsx("div", { style: {
1043
1036
  padding: "8px 12px",
1044
1037
  marginBottom: 12,
1045
- borderRadius: 6,
1038
+ borderRadius: 8,
1046
1039
  background: ideaSubmitMessage.type === "success" ? isLight ? "#dcfce7" : "#14532d" : isLight ? "#fee2e2" : "#450a0a",
1047
1040
  color: ideaSubmitMessage.type === "success" ? isLight ? "#166534" : "#86efac" : isLight ? "#dc2626" : "#fca5a5",
1048
1041
  fontSize: 13
@@ -1071,26 +1064,10 @@ function VersionPill({
1071
1064
  ]
1072
1065
  }
1073
1066
  ),
1074
- ideasArray.length === 0 && !showIdeaForm ? /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", padding: 60, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
1067
+ ideasArray.length === 0 && !showIdeaForm ? /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", padding: 60, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
1075
1068
  /* @__PURE__ */ jsx("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", style: { marginBottom: 12, opacity: 0.5 }, children: /* @__PURE__ */ jsx("path", { d: "M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z" }) }),
1076
1069
  /* @__PURE__ */ jsx("div", { style: { fontSize: 16, fontWeight: 500, marginBottom: 8 }, children: "No feature requests yet" }),
1077
- /* @__PURE__ */ jsx(
1078
- "button",
1079
- {
1080
- onClick: () => setShowIdeaForm(true),
1081
- style: {
1082
- padding: "8px 20px",
1083
- borderRadius: 999,
1084
- border: "none",
1085
- background: "#22c55e",
1086
- color: "#fff",
1087
- fontSize: 14,
1088
- fontWeight: 500,
1089
- cursor: "pointer"
1090
- },
1091
- children: "Suggest a feature"
1092
- }
1093
- )
1070
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 13, color: isLight ? "#a1a1aa" : "#525252" }, children: "Be the first to suggest one!" })
1094
1071
  ] }) : (() => {
1095
1072
  const statusOrder = ["under review", "planned", "in progress", "new", "shipped"];
1096
1073
  const grouped = {};