version-pill-react 1.2.5 → 1.2.7

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 CHANGED
@@ -306,311 +306,288 @@ function VersionPill({
306
306
  }, {});
307
307
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
308
308
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_clsx.default)(positionStyles[position], className), style: { display: "inline-flex" }, children: renderBadge() }),
309
- isOpen && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: {
309
+ isOpen && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: {
310
310
  position: "fixed",
311
- inset: 0,
312
- zIndex: 99999,
311
+ top: 0,
312
+ left: 0,
313
+ right: 0,
314
+ bottom: 0,
315
+ width: "100vw",
316
+ height: "100vh",
317
+ zIndex: 2147483647,
313
318
  display: "flex",
314
- alignItems: "center",
315
- justifyContent: "center",
316
- padding: 20
317
- }, children: [
318
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
319
- "div",
320
- {
321
- onClick: () => setIsOpen(false),
322
- style: {
323
- position: "absolute",
324
- inset: 0,
325
- background: isLight ? "rgba(0,0,0,0.4)" : "rgba(0,0,0,0.6)",
326
- backdropFilter: "blur(4px)",
327
- WebkitBackdropFilter: "blur(4px)"
328
- }
329
- }
330
- ),
331
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
332
- "div",
333
- {
334
- style: {
335
- position: "relative",
336
- display: "flex",
337
- flexDirection: "column",
338
- width: "100%",
339
- maxWidth: 420,
340
- maxHeight: "min(500px, 80vh)",
341
- borderRadius: 12,
342
- boxShadow: isLight ? "0 20px 40px -10px rgba(0,0,0,0.15), 0 0 0 1px rgba(0,0,0,0.05)" : "0 20px 40px -10px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.1)",
343
- background: isLight ? "#fff" : "#1a1a1a",
344
- overflow: "hidden"
345
- },
346
- children: [
347
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
348
- "div",
349
- {
350
- style: {
351
- flexShrink: 0,
352
- padding: "14px 16px",
353
- borderBottom: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
354
- display: "flex",
355
- alignItems: "center",
356
- justifyContent: "space-between"
357
- },
358
- children: [
359
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 10 }, children: [
360
- project?.icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 18 }, children: project.icon }),
361
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
362
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { style: { fontWeight: 600, fontSize: 15, color: isLight ? "#18181b" : "#fff", margin: 0 }, children: project?.name || "What's New" }),
363
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { style: { fontSize: 11, color: isLight ? "#71717a" : "#a1a1aa", margin: 0 }, children: [
364
- "v",
365
- currentVersion
366
- ] })
319
+ flexDirection: "column",
320
+ boxSizing: "border-box",
321
+ background: isLight ? "#fff" : "#0a0a0a"
322
+ }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
323
+ "div",
324
+ {
325
+ style: {
326
+ display: "flex",
327
+ flexDirection: "column",
328
+ width: "100%",
329
+ height: "100%",
330
+ borderRadius: 12,
331
+ overflow: "hidden"
332
+ },
333
+ children: [
334
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
335
+ "div",
336
+ {
337
+ style: {
338
+ flexShrink: 0,
339
+ padding: "16px 20px",
340
+ borderBottom: `1px solid ${isLight ? "#e5e5e5" : "#1f1f1f"}`,
341
+ display: "flex",
342
+ alignItems: "center",
343
+ justifyContent: "space-between"
344
+ },
345
+ children: [
346
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
347
+ project?.icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 24 }, children: project.icon }),
348
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
349
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { style: { fontWeight: 600, fontSize: 18, color: isLight ? "#18181b" : "#fff", margin: 0 }, children: project?.name || "What's New" }),
350
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { style: { fontSize: 13, color: isLight ? "#71717a" : "#a1a1aa", margin: 0 }, children: [
351
+ "v",
352
+ currentVersion
367
353
  ] })
368
- ] }),
369
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
370
- "button",
371
- {
372
- onClick: () => setIsOpen(false),
373
- style: {
374
- width: 28,
375
- height: 28,
376
- display: "flex",
377
- alignItems: "center",
378
- justifyContent: "center",
379
- borderRadius: 6,
380
- background: isLight ? "#f5f5f5" : "#2a2a2a",
381
- border: "none",
382
- cursor: "pointer",
383
- color: isLight ? "#71717a" : "#a1a1aa",
384
- transition: "background 150ms"
385
- },
386
- onMouseEnter: (e) => e.currentTarget.style.background = isLight ? "#e5e5e5" : "#3a3a3a",
387
- onMouseLeave: (e) => e.currentTarget.style.background = isLight ? "#f5f5f5" : "#2a2a2a",
388
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M18 6L6 18M6 6l12 12" }) })
389
- }
390
- )
391
- ]
392
- }
393
- ),
394
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
395
- "div",
396
- {
397
- style: {
398
- flexShrink: 0,
399
- display: "flex",
400
- gap: 2,
401
- padding: "8px 12px",
402
- borderBottom: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
403
- background: isLight ? "#fafafa" : "#151515"
404
- },
405
- children: ["changelog", "roadmap", "ideas"].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
354
+ ] })
355
+ ] }),
356
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
406
357
  "button",
407
358
  {
408
- onClick: () => setActiveTab(tab),
359
+ onClick: () => setIsOpen(false),
409
360
  style: {
410
- padding: "6px 10px",
411
- borderRadius: 6,
361
+ width: 36,
362
+ height: 36,
363
+ display: "flex",
364
+ alignItems: "center",
365
+ justifyContent: "center",
366
+ borderRadius: 8,
367
+ background: isLight ? "#f5f5f5" : "#1f1f1f",
412
368
  border: "none",
413
369
  cursor: "pointer",
414
- fontSize: 12,
415
- fontWeight: 500,
416
- background: activeTab === tab ? isLight ? "#fff" : "#2a2a2a" : "transparent",
417
- color: activeTab === tab ? isLight ? "#18181b" : "#fff" : isLight ? "#71717a" : "#71717a",
418
- boxShadow: activeTab === tab ? isLight ? "0 1px 2px rgba(0,0,0,0.05)" : "0 1px 2px rgba(0,0,0,0.2)" : "none",
419
- transition: "all 150ms"
420
- },
421
- children: [
422
- tab === "changelog" && "Changelog",
423
- tab === "roadmap" && "Roadmap",
424
- tab === "ideas" && "Ideas"
425
- ]
426
- },
427
- tab
428
- ))
429
- }
430
- ),
431
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { flex: 1, overflowY: "auto", padding: 12, minHeight: 0 }, children: [
432
- activeTab === "changelog" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: versionsArray.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { textAlign: "center", padding: 30, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
433
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 24, marginBottom: 6 }, children: "\u{1F680}" }),
434
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 13 }, children: "No releases yet" })
435
- ] }) : versionsArray.slice(0, 5).map((version, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { marginBottom: 12, paddingBottom: 12, borderBottom: idx < versionsArray.length - 1 && idx < 4 ? `1px solid ${isLight ? "#f0f0f0" : "#252525"}` : "none" }, children: [
436
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 3 }, children: [
437
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 14 }, children: version.emoji || "\u{1F4E6}" }),
438
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontWeight: 600, fontSize: 13, color: isLight ? "#18181b" : "#fff" }, children: version.title }),
439
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
440
- "span",
441
- {
442
- style: {
443
- padding: "1px 5px",
444
- fontSize: 9,
445
- fontWeight: 500,
446
- borderRadius: 3,
447
- background: version.type === "major" ? "#f3e8ff" : version.type === "minor" ? "#dbeafe" : isLight ? "#f4f4f5" : "#2a2a2a",
448
- color: version.type === "major" ? "#7c3aed" : version.type === "minor" ? "#2563eb" : isLight ? "#52525b" : "#a1a1aa"
449
- },
450
- children: version.type
451
- }
452
- )
453
- ] }),
454
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { fontSize: 11, color: isLight ? "#71717a" : "#71717a", marginBottom: 6 }, children: [
455
- "v",
456
- version.version,
457
- " \xB7 ",
458
- new Date(version.date).toLocaleDateString()
459
- ] }),
460
- version.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { style: { fontSize: 12, color: isLight ? "#52525b" : "#a1a1aa", margin: "0 0 6px 0", lineHeight: 1.5 }, children: version.description }),
461
- version.features && version.features.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("ul", { style: { margin: 0, paddingLeft: 0, listStyle: "none" }, children: [
462
- version.features.slice(0, 4).map((feature, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { style: { display: "flex", alignItems: "flex-start", gap: 6, fontSize: 12, color: isLight ? "#52525b" : "#a1a1aa", marginBottom: 2, lineHeight: 1.4 }, children: [
463
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { color: "#22c55e", fontSize: 11 }, children: "\u2713" }),
464
- feature
465
- ] }, i)),
466
- version.features.length > 4 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { style: { fontSize: 11, color: isLight ? "#a1a1aa" : "#525252", marginTop: 2 }, children: [
467
- "+",
468
- version.features.length - 4,
469
- " more..."
470
- ] })
471
- ] })
472
- ] }, idx)) }),
473
- activeTab === "roadmap" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: Object.keys(groupedTasks).length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { textAlign: "center", padding: 30, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
474
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 24, marginBottom: 6 }, children: "\u{1F5FA}\uFE0F" }),
475
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 13 }, children: "No public roadmap items" })
476
- ] }) : ["in-progress", "todo", "backlog"].map((col) => {
477
- const tasks = groupedTasks[col];
478
- if (!tasks || tasks.length === 0) return null;
479
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { marginBottom: 12 }, children: [
480
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h3", { style: { fontSize: 10, fontWeight: 600, color: isLight ? "#a1a1aa" : "#71717a", marginBottom: 6, textTransform: "uppercase", letterSpacing: "0.5px" }, children: [
481
- COLUMN_LABELS[col] || col,
482
- " (",
483
- tasks.length,
484
- ")"
485
- ] }),
486
- tasks.slice(0, 4).map((task) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
487
- "div",
488
- {
489
- style: {
490
- padding: "8px 10px",
491
- marginBottom: 4,
492
- borderRadius: 5,
493
- background: isLight ? "#f5f5f5" : "#252525"
494
- },
495
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
496
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
497
- "span",
498
- {
499
- style: {
500
- width: 6,
501
- height: 6,
502
- borderRadius: "50%",
503
- background: TYPE_COLORS[task.type] || "#71717a",
504
- flexShrink: 0
505
- }
506
- }
507
- ),
508
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 12, color: isLight ? "#18181b" : "#fff", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: task.title })
509
- ] })
370
+ color: isLight ? "#71717a" : "#a1a1aa",
371
+ transition: "background 150ms"
510
372
  },
511
- task.id
512
- )),
513
- tasks.length > 4 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { fontSize: 10, color: isLight ? "#a1a1aa" : "#525252", marginTop: 4 }, children: [
514
- "+",
515
- tasks.length - 4,
516
- " more..."
517
- ] })
518
- ] }, col);
519
- }) }),
520
- activeTab === "ideas" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: ideasArray.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { textAlign: "center", padding: 30, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
521
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 24, marginBottom: 6 }, children: "\u{1F4A1}" }),
522
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 13 }, children: "No feature requests yet" })
523
- ] }) : ideasArray.slice(0, 5).map((idea) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
524
- "div",
373
+ onMouseEnter: (e) => e.currentTarget.style.background = isLight ? "#e5e5e5" : "#2a2a2a",
374
+ onMouseLeave: (e) => e.currentTarget.style.background = isLight ? "#f5f5f5" : "#1f1f1f",
375
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M18 6L6 18M6 6l12 12" }) })
376
+ }
377
+ )
378
+ ]
379
+ }
380
+ ),
381
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
382
+ "div",
383
+ {
384
+ style: {
385
+ flexShrink: 0,
386
+ display: "flex",
387
+ gap: 4,
388
+ padding: "12px 20px",
389
+ borderBottom: `1px solid ${isLight ? "#e5e5e5" : "#1f1f1f"}`
390
+ },
391
+ children: ["changelog", "roadmap", "ideas"].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
392
+ "button",
525
393
  {
394
+ onClick: () => setActiveTab(tab),
526
395
  style: {
527
- padding: 10,
528
- marginBottom: 6,
529
- borderRadius: 6,
530
- background: isLight ? "#f5f5f5" : "#252525",
531
- display: "flex",
532
- alignItems: "flex-start",
533
- gap: 10
396
+ padding: "10px 16px",
397
+ borderRadius: 8,
398
+ border: "none",
399
+ cursor: "pointer",
400
+ fontSize: 14,
401
+ fontWeight: 500,
402
+ background: activeTab === tab ? isLight ? "#18181b" : "#fff" : "transparent",
403
+ color: activeTab === tab ? isLight ? "#fff" : "#18181b" : isLight ? "#71717a" : "#71717a",
404
+ transition: "all 150ms"
534
405
  },
535
406
  children: [
536
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
537
- "div",
538
- {
539
- style: {
540
- display: "flex",
541
- flexDirection: "column",
542
- alignItems: "center",
543
- padding: "3px 6px",
544
- borderRadius: 4,
545
- background: isLight ? "#fff" : "#1a1a1a",
546
- minWidth: 32
547
- },
548
- children: [
549
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 12, fontWeight: 600, color: isLight ? "#18181b" : "#fff" }, children: idea.votes }),
550
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 9, color: isLight ? "#71717a" : "#71717a" }, children: "votes" })
551
- ]
552
- }
553
- ),
554
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
555
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 12, fontWeight: 500, color: isLight ? "#18181b" : "#fff", marginBottom: 2 }, children: idea.title }),
556
- idea.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 11, color: isLight ? "#71717a" : "#71717a", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: idea.description.slice(0, 80) })
557
- ] })
407
+ tab === "changelog" && "\u{1F680} Changelog",
408
+ tab === "roadmap" && "\u{1F5FA}\uFE0F Roadmap",
409
+ tab === "ideas" && "\u{1F4A1} Ideas"
558
410
  ]
559
411
  },
560
- idea.id
561
- )) })
562
- ] }),
563
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
412
+ tab
413
+ ))
414
+ }
415
+ ),
416
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { flex: 1, overflowY: "auto", padding: "20px 24px", minHeight: 0 }, children: [
417
+ activeTab === "changelog" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { maxWidth: 640 }, children: versionsArray.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { textAlign: "center", padding: 60, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
418
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 48, marginBottom: 12 }, children: "\u{1F680}" }),
419
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 16 }, children: "No releases yet" })
420
+ ] }) : versionsArray.slice(0, 10).map((version, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { marginBottom: 24, paddingBottom: 24, borderBottom: idx < versionsArray.length - 1 && idx < 9 ? `1px solid ${isLight ? "#f0f0f0" : "#1f1f1f"}` : "none" }, children: [
421
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 8, marginBottom: 6 }, children: [
422
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 20 }, children: version.emoji || "\u{1F4E6}" }),
423
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontWeight: 600, fontSize: 18, color: isLight ? "#18181b" : "#fff" }, children: version.title }),
424
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
425
+ "span",
426
+ {
427
+ style: {
428
+ padding: "3px 8px",
429
+ fontSize: 11,
430
+ fontWeight: 500,
431
+ borderRadius: 4,
432
+ background: version.type === "major" ? "#f3e8ff" : version.type === "minor" ? "#dbeafe" : isLight ? "#f4f4f5" : "#1f1f1f",
433
+ color: version.type === "major" ? "#7c3aed" : version.type === "minor" ? "#2563eb" : isLight ? "#52525b" : "#a1a1aa"
434
+ },
435
+ children: version.type
436
+ }
437
+ )
438
+ ] }),
439
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { fontSize: 13, color: isLight ? "#71717a" : "#71717a", marginBottom: 10 }, children: [
440
+ "v",
441
+ version.version,
442
+ " \xB7 ",
443
+ new Date(version.date).toLocaleDateString()
444
+ ] }),
445
+ version.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { style: { fontSize: 15, color: isLight ? "#52525b" : "#a1a1aa", margin: "0 0 12px 0", lineHeight: 1.6 }, children: version.description }),
446
+ version.features && version.features.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { style: { margin: 0, paddingLeft: 0, listStyle: "none" }, children: version.features.map((feature, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { style: { display: "flex", alignItems: "flex-start", gap: 10, fontSize: 14, color: isLight ? "#52525b" : "#a1a1aa", marginBottom: 6, lineHeight: 1.5 }, children: [
447
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { color: "#22c55e", fontSize: 14, marginTop: 2 }, children: "\u2713" }),
448
+ feature
449
+ ] }, i)) })
450
+ ] }, idx)) }),
451
+ activeTab === "roadmap" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { maxWidth: 640 }, children: Object.keys(groupedTasks).length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { textAlign: "center", padding: 60, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
452
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 48, marginBottom: 12 }, children: "\u{1F5FA}\uFE0F" }),
453
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 16 }, children: "No public roadmap items" })
454
+ ] }) : ["in-progress", "todo", "backlog"].map((col) => {
455
+ const tasks = groupedTasks[col];
456
+ if (!tasks || tasks.length === 0) return null;
457
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { marginBottom: 24 }, children: [
458
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h3", { style: { fontSize: 12, fontWeight: 600, color: isLight ? "#a1a1aa" : "#71717a", marginBottom: 12, textTransform: "uppercase", letterSpacing: "0.5px" }, children: [
459
+ COLUMN_LABELS[col] || col,
460
+ " (",
461
+ tasks.length,
462
+ ")"
463
+ ] }),
464
+ tasks.map((task) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
465
+ "div",
466
+ {
467
+ style: {
468
+ padding: "12px 16px",
469
+ marginBottom: 8,
470
+ borderRadius: 8,
471
+ background: isLight ? "#f5f5f5" : "#151515",
472
+ border: `1px solid ${isLight ? "#e5e5e5" : "#1f1f1f"}`
473
+ },
474
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 10 }, children: [
475
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
476
+ "span",
477
+ {
478
+ style: {
479
+ width: 8,
480
+ height: 8,
481
+ borderRadius: "50%",
482
+ background: TYPE_COLORS[task.type] || "#71717a",
483
+ flexShrink: 0
484
+ }
485
+ }
486
+ ),
487
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 14, color: isLight ? "#18181b" : "#fff" }, children: task.title })
488
+ ] })
489
+ },
490
+ task.id
491
+ ))
492
+ ] }, col);
493
+ }) }),
494
+ activeTab === "ideas" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { maxWidth: 640 }, children: ideasArray.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { textAlign: "center", padding: 60, color: isLight ? "#71717a" : "#a1a1aa" }, children: [
495
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 48, marginBottom: 12 }, children: "\u{1F4A1}" }),
496
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 16 }, children: "No feature requests yet" })
497
+ ] }) : ideasArray.map((idea) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
564
498
  "div",
565
499
  {
566
500
  style: {
567
- flexShrink: 0,
568
- padding: "10px 12px",
569
- borderTop: `1px solid ${isLight ? "#e5e5e5" : "#2a2a2a"}`,
570
- background: isLight ? "#fafafa" : "#151515",
501
+ padding: 16,
502
+ marginBottom: 12,
503
+ borderRadius: 8,
504
+ background: isLight ? "#f5f5f5" : "#151515",
505
+ border: `1px solid ${isLight ? "#e5e5e5" : "#1f1f1f"}`,
571
506
  display: "flex",
572
- alignItems: "center",
573
- justifyContent: "space-between"
507
+ alignItems: "flex-start",
508
+ gap: 16
574
509
  },
575
510
  children: [
576
- showBranding && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
577
- "a",
578
- {
579
- href: "https://versionpill.com",
580
- target: "_blank",
581
- rel: "noopener noreferrer",
582
- style: { fontSize: 10, color: isLight ? "#a1a1aa" : "#525252", textDecoration: "none" },
583
- children: "Powered by Version Pill"
584
- }
585
- ),
586
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
587
- "a",
511
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
512
+ "div",
588
513
  {
589
- href: `${baseUrl}/${projectId}/${activeTab === "ideas" ? "feature-requests" : activeTab}`,
590
- target: "_blank",
591
- rel: "noopener noreferrer",
592
514
  style: {
593
- padding: "5px 10px",
594
- fontSize: 11,
595
- fontWeight: 500,
596
- borderRadius: 5,
597
- background: "#22c55e",
598
- color: "#fff",
599
- textDecoration: "none",
600
- transition: "background 150ms"
515
+ display: "flex",
516
+ flexDirection: "column",
517
+ alignItems: "center",
518
+ padding: "8px 12px",
519
+ borderRadius: 6,
520
+ background: isLight ? "#fff" : "#0a0a0a",
521
+ minWidth: 50
601
522
  },
602
- onMouseEnter: (e) => e.currentTarget.style.background = "#16a34a",
603
- onMouseLeave: (e) => e.currentTarget.style.background = "#22c55e",
604
- children: "View All \u2192"
523
+ children: [
524
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 18, fontWeight: 600, color: isLight ? "#18181b" : "#fff" }, children: idea.votes }),
525
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { fontSize: 11, color: isLight ? "#71717a" : "#71717a" }, children: "votes" })
526
+ ]
605
527
  }
606
- )
528
+ ),
529
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
530
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 16, fontWeight: 500, color: isLight ? "#18181b" : "#fff", marginBottom: 4 }, children: idea.title }),
531
+ idea.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { fontSize: 14, color: isLight ? "#71717a" : "#71717a", lineHeight: 1.5 }, children: idea.description })
532
+ ] })
607
533
  ]
608
- }
609
- )
610
- ]
611
- }
612
- )
613
- ] })
534
+ },
535
+ idea.id
536
+ )) })
537
+ ] }),
538
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
539
+ "div",
540
+ {
541
+ style: {
542
+ flexShrink: 0,
543
+ padding: "16px 24px",
544
+ borderTop: `1px solid ${isLight ? "#e5e5e5" : "#1f1f1f"}`,
545
+ display: "flex",
546
+ alignItems: "center",
547
+ justifyContent: "space-between"
548
+ },
549
+ children: [
550
+ showBranding && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
551
+ "a",
552
+ {
553
+ href: "https://versionpill.com",
554
+ target: "_blank",
555
+ rel: "noopener noreferrer",
556
+ style: { fontSize: 12, color: isLight ? "#a1a1aa" : "#525252", textDecoration: "none" },
557
+ children: "Powered by Version Pill"
558
+ }
559
+ ),
560
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
561
+ "a",
562
+ {
563
+ href: `${baseUrl}/${projectId}/${activeTab === "ideas" ? "feature-requests" : activeTab}`,
564
+ target: "_blank",
565
+ rel: "noopener noreferrer",
566
+ style: {
567
+ padding: "10px 20px",
568
+ fontSize: 14,
569
+ fontWeight: 500,
570
+ borderRadius: 8,
571
+ background: "#22c55e",
572
+ color: "#fff",
573
+ textDecoration: "none",
574
+ transition: "background 150ms"
575
+ },
576
+ onMouseEnter: (e) => e.currentTarget.style.background = "#16a34a",
577
+ onMouseLeave: (e) => e.currentTarget.style.background = "#22c55e",
578
+ children: [
579
+ "View Full ",
580
+ activeTab === "changelog" ? "Changelog" : activeTab === "roadmap" ? "Roadmap" : "Ideas",
581
+ " \u2192"
582
+ ]
583
+ }
584
+ )
585
+ ]
586
+ }
587
+ )
588
+ ]
589
+ }
590
+ ) })
614
591
  ] });
615
592
  }
616
593
  function VersionBadge({