@pollinations/ui 0.0.1 → 0.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.
Files changed (48) hide show
  1. package/README.md +15 -10
  2. package/dist/{Button-DMJ2K6Gr.d.ts → Button-Bn8pGg6N.d.ts} +1 -1
  3. package/dist/{Button-CNzpisJf.d.cts → Button-CWUBCiIc.d.cts} +1 -1
  4. package/dist/{Chip-BS8ronOu.d.ts → Chip-C5impfYd.d.ts} +2 -2
  5. package/dist/{Chip-DyqWrq0r.d.cts → Chip-SM52sUbZ.d.cts} +2 -2
  6. package/dist/app.css +1 -1
  7. package/dist/auth/index.cjs +1 -9
  8. package/dist/auth/index.cjs.map +1 -1
  9. package/dist/auth/index.d.cts +1 -2
  10. package/dist/auth/index.d.ts +1 -2
  11. package/dist/auth/index.js +1 -9
  12. package/dist/auth/index.js.map +1 -1
  13. package/dist/auth/sdk.d.cts +2 -2
  14. package/dist/auth/sdk.d.ts +2 -2
  15. package/dist/index.cjs +354 -177
  16. package/dist/index.cjs.map +1 -1
  17. package/dist/index.d.cts +47 -9
  18. package/dist/index.d.ts +47 -9
  19. package/dist/index.js +346 -176
  20. package/dist/index.js.map +1 -1
  21. package/dist/modality/index.cjs +6 -38
  22. package/dist/modality/index.cjs.map +1 -1
  23. package/dist/modality/index.d.cts +7 -27
  24. package/dist/modality/index.d.ts +7 -27
  25. package/dist/modality/index.js +6 -37
  26. package/dist/modality/index.js.map +1 -1
  27. package/dist/styles.css +1 -1
  28. package/dist/theme-VMRlhqST.d.cts +9 -0
  29. package/dist/theme-VMRlhqST.d.ts +9 -0
  30. package/dist/wallet/index.cjs +4 -1
  31. package/dist/wallet/index.cjs.map +1 -1
  32. package/dist/wallet/index.d.cts +2 -2
  33. package/dist/wallet/index.d.ts +2 -2
  34. package/dist/wallet/index.js +4 -1
  35. package/dist/wallet/index.js.map +1 -1
  36. package/dist/wallet/sdk.cjs +4 -1
  37. package/dist/wallet/sdk.cjs.map +1 -1
  38. package/dist/wallet/sdk.js +4 -1
  39. package/dist/wallet/sdk.js.map +1 -1
  40. package/package.json +3 -8
  41. package/dist/showcase/index.cjs +0 -2851
  42. package/dist/showcase/index.cjs.map +0 -1
  43. package/dist/showcase/index.d.cts +0 -19
  44. package/dist/showcase/index.d.ts +0 -19
  45. package/dist/showcase/index.js +0 -2839
  46. package/dist/showcase/index.js.map +0 -1
  47. package/dist/theme-DfHMjWB7.d.cts +0 -16
  48. package/dist/theme-DfHMjWB7.d.ts +0 -16
@@ -1,2839 +0,0 @@
1
- // src/showcase/DesignShowcase.tsx
2
- import {
3
- useEffect as useEffect4,
4
- useState as useState5
5
- } from "react";
6
-
7
- // src/lib/period.ts
8
- var MS_PER_DAY = 864e5;
9
- function startOfUtcDay(date = /* @__PURE__ */ new Date()) {
10
- return new Date(
11
- Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate())
12
- );
13
- }
14
- function addUtcDays(date, days) {
15
- const next = new Date(date);
16
- next.setUTCDate(next.getUTCDate() + days);
17
- return next;
18
- }
19
- function startOfUtcMonth(date) {
20
- return new Date(Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), 1));
21
- }
22
- function addUtcMonths(date, months) {
23
- return new Date(
24
- Date.UTC(date.getUTCFullYear(), date.getUTCMonth() + months, 1)
25
- );
26
- }
27
- function startOfUtcIsoWeek(date) {
28
- const day = date.getUTCDay() || 7;
29
- return addUtcDays(startOfUtcDay(date), 1 - day);
30
- }
31
- function getUtcIsoWeekPeriod(date) {
32
- const day = date.getUTCDay() || 7;
33
- const thursday = addUtcDays(startOfUtcDay(date), 4 - day);
34
- const isoYear = thursday.getUTCFullYear();
35
- const yearStart = new Date(Date.UTC(isoYear, 0, 1));
36
- const isoWeek = Math.ceil(
37
- ((thursday.getTime() - yearStart.getTime()) / MS_PER_DAY + 1) / 7
38
- );
39
- return `${isoYear}-W${String(isoWeek).padStart(2, "0")}`;
40
- }
41
- function formatUtcDatePeriod(date) {
42
- return date.toISOString().slice(0, 10);
43
- }
44
- function formatUtcMonthPeriod(date) {
45
- return date.toISOString().slice(0, 7);
46
- }
47
- function periodFromDate(granularity, date = /* @__PURE__ */ new Date()) {
48
- if (granularity === "day") {
49
- return {
50
- granularity,
51
- period: formatUtcDatePeriod(startOfUtcDay(date))
52
- };
53
- }
54
- if (granularity === "week") {
55
- return { granularity, period: getUtcIsoWeekPeriod(date) };
56
- }
57
- return { granularity, period: formatUtcMonthPeriod(startOfUtcMonth(date)) };
58
- }
59
- function currentPeriod() {
60
- return periodFromDate("day");
61
- }
62
- function periodToWindow(selection) {
63
- if (selection.granularity === "day") {
64
- const start2 = /* @__PURE__ */ new Date(`${selection.period}T00:00:00.000Z`);
65
- return { start: start2, end: addUtcDays(start2, 1) };
66
- }
67
- if (selection.granularity === "week") {
68
- const [yearText2, weekText] = selection.period.split("-W");
69
- const isoYear = Number(yearText2);
70
- const isoWeek = Number(weekText);
71
- const jan4 = new Date(Date.UTC(isoYear, 0, 4));
72
- const start2 = addUtcDays(startOfUtcIsoWeek(jan4), (isoWeek - 1) * 7);
73
- return { start: start2, end: addUtcDays(start2, 7) };
74
- }
75
- const [yearText, monthText] = selection.period.split("-");
76
- const start = new Date(
77
- Date.UTC(Number(yearText), Number(monthText) - 1, 1)
78
- );
79
- return { start, end: addUtcMonths(start, 1) };
80
- }
81
- function formatPeriodLabel(selection) {
82
- const { start, end } = periodToWindow(selection);
83
- if (selection.granularity === "day") {
84
- const today = startOfUtcDay();
85
- const yesterday = addUtcDays(today, -1);
86
- if (start.getTime() === today.getTime()) return "Today";
87
- if (start.getTime() === yesterday.getTime()) return "Yesterday";
88
- return start.toLocaleDateString("en-US", {
89
- timeZone: "UTC",
90
- month: "short",
91
- day: "numeric",
92
- year: "numeric"
93
- });
94
- }
95
- if (selection.granularity === "week") {
96
- const weekEnd = addUtcDays(end, -1);
97
- return `${start.toLocaleDateString("en-US", {
98
- timeZone: "UTC",
99
- month: "short",
100
- day: "numeric"
101
- })} - ${weekEnd.toLocaleDateString("en-US", {
102
- timeZone: "UTC",
103
- month: "short",
104
- day: "numeric",
105
- year: "numeric"
106
- })}`;
107
- }
108
- return start.toLocaleDateString("en-US", {
109
- timeZone: "UTC",
110
- month: "long",
111
- year: "numeric"
112
- });
113
- }
114
- function isPeriodSelectable(selection, minDate = /* @__PURE__ */ new Date(0), maxDate = startOfUtcDay()) {
115
- const { start, end } = periodToWindow(selection);
116
- return end > minDate && start <= maxDate;
117
- }
118
-
119
- // src/assets/logo.svg
120
- var logo_default = 'data:image/svg+xml,<?xml version="1.0" encoding="utf-8"?>%0A<svg xmlns="http://www.w3.org/2000/svg" viewBox="15 17.6409 119.9998 114.7498" width="160px" height="153px">%0A <path style="stroke:none;fill-rule:evenodd;fill:currentColor;fill-opacity:1" d="M73.832 19.293a1893.685 1893.685 0 0 0-7.742 9.047c-1.93 2.273-3.274 3.898-4.266 5.156-.988 1.258-1.62 2.149-2.117 2.957-.5.805-.86 1.531-1.309 2.453-.14.285-.277.563-.402.813-.121.254-.238.48-.332.676a20.107 20.107 0 0 1-.34.652c-.008.008-.062 0-.156-.02s-.227-.047-.383-.09c-.16-.039-.351-.09-.558-.148-.207-.059-.43-.121-.668-.191-1.079-.32-1.895-.559-2.684-.743-.79-.18-1.55-.3-2.516-.382-.96-.082-2.129-.121-3.734-.145-1.602-.02-3.64-.023-6.348-.023H35.31l-2.485-.004H30.34v20.574l-.527.059-.524.058-1.055.117c-.59.067-1.203.157-1.84.274-.636.113-1.292.25-1.968.414-.676.16-1.371.348-2.086.555-.715.21-1.445.441-2.195.695-.47.16-1.024.36-1.594.574a64.38 64.38 0 0 0-1.684.649c-.523.207-.992.398-1.328.546-.336.149-.539.246-.539.274 0 .039.07.234.191.535.118.297.29.7.485 1.156.195.453.418.961.644 1.473.227.508.461 1.02.676 1.484a52.041 52.041 0 0 0 9.54 13.926 47.507 47.507 0 0 0 6.14 5.41c2.164 1.59 4.426 2.953 6.75 4.047a51.197 51.197 0 0 0 3.414 1.461c1.129.43 2.242.805 3.36 1.125 1.112.324 2.226.59 3.343.809a39.04 39.04 0 0 0 3.375.504c.84.085 1.781.136 2.777.156a51.632 51.632 0 0 0 6.203-.266 34.786 34.786 0 0 0 2.836-.394 59.177 59.177 0 0 1 2.633-.442c.149-.02.235-.023.246-.015.043.043-.02.195-.152.414a9.01 9.01 0 0 1-.582.812c-.242.313-.527.645-.813.965-.289.316-.582.617-.851.86-.57.519-1.168.968-1.809 1.355-.64.383-1.324.703-2.07.969-.746.261-1.555.464-2.441.617-.891.156-1.856.258-2.926.316-1.36.07-2.582.207-3.703.422-1.118.211-2.13.496-3.07.871-.938.375-1.801.84-2.618 1.403a15.82 15.82 0 0 0-2.351 2 14.205 14.205 0 0 0-1.489 1.765 13.256 13.256 0 0 0-1.148 1.945 15.518 15.518 0 0 0-.856 2.207 20.834 20.834 0 0 0-.59 2.543c-.058.348-.105.61-.156.817-.05.207-.105.36-.183.484a1.184 1.184 0 0 1-.325.332c-.144.106-.332.211-.578.356a9.157 9.157 0 0 0-2.543 2.183 8.797 8.797 0 0 0-1.52 2.813 8.33 8.33 0 0 0-.382 3.113 7.995 7.995 0 0 0 .852 3.098 7.95 7.95 0 0 0 1.574 2.117 9.294 9.294 0 0 0 2.168 1.566c.789.418 1.629.715 2.469.868.84.152 1.68.167 2.472.007a7.941 7.941 0 0 0 1.188-.336c.406-.144.82-.32 1.222-.515.399-.2.79-.418 1.149-.653.36-.234.691-.476.976-.73a6.93 6.93 0 0 0 1.473-1.86c.39-.71.68-1.492.855-2.308.176-.82.243-1.676.188-2.527a8.74 8.74 0 0 0-.531-2.516 5.919 5.919 0 0 0-.68-1.281c-.289-.43-.64-.856-1.031-1.258a10.34 10.34 0 0 0-1.262-1.11 8.299 8.299 0 0 0-1.379-.847c-.414-.2-.722-.352-.95-.492-.226-.137-.366-.27-.44-.43-.075-.16-.083-.352-.043-.613.039-.266.125-.598.242-1.043.226-.871.566-1.695 1.004-2.465a10.426 10.426 0 0 1 3.672-3.754c.77-.46 1.605-.836 2.492-1.102.152-.046.386-.093.675-.144a30.829 30.829 0 0 1 2.246-.273c.43-.043.876-.075 1.317-.102a41.754 41.754 0 0 0 2.773-.25 19.813 19.813 0 0 0 2.243-.406 13.283 13.283 0 0 0 1.918-.621c.609-.246 1.199-.536 1.804-.88a20.824 20.824 0 0 0 1.774-1.116c.539-.383 1.031-.786 1.511-1.227.48-.445.942-.934 1.415-1.488.468-.559.953-1.18 1.468-1.899l.309-.426.308-.43.313-.429.309-.426v19.633l-.399.262-.402.265-.797.532a11.66 11.66 0 0 0-1.567 1.21c-.44.41-.808.837-1.113 1.305-.305.465-.55.97-.746 1.535-.2.567-.351 1.192-.473 1.903a7.401 7.401 0 0 0 .024 2.574 8.502 8.502 0 0 0 2.441 4.543 7.787 7.787 0 0 0 2.157 1.496c.804.367 1.632.61 2.46.715.829.105 1.66.082 2.47-.07a7.963 7.963 0 0 0 2.343-.828 8.831 8.831 0 0 0 2.094-1.567c.406-.402.738-.789 1.011-1.18.27-.394.48-.796.641-1.234.156-.441.266-.918.336-1.473.07-.55.102-1.171.105-1.894 0-.524 0-.93-.011-1.266a6.504 6.504 0 0 0-.074-.836 3.967 3.967 0 0 0-.192-.683c-.09-.23-.207-.485-.355-.805a7.845 7.845 0 0 0-1.594-2.262 8.117 8.117 0 0 0-1.07-.879 9.342 9.342 0 0 0-1.254-.718l-.348-.164-.348-.16-.343-.165-.348-.164v-4.957l-.004-2.476v-2.48c0-1.36.004-2.657.012-3.833.008-1.176.02-2.23.035-3.11.016-.882.035-1.589.055-2.07.02-.48.043-.734.066-.707.02.028.074.102.156.208l.301.421c.121.168.258.364.406.575.145.207.305.433.461.664.38.543.735 1.027 1.09 1.468.352.438.703.832 1.063 1.2.363.367.742.707 1.148 1.039.406.328.844.652 1.332.98.777.528 1.5.965 2.223 1.328.718.364 1.437.657 2.203.89.765.235 1.582.411 2.496.544.914.137 1.93.23 3.094.3.433.024.867.055 1.289.087a40.742 40.742 0 0 1 2.148.215c.27.035.477.07.602.101.965.234 1.898.64 2.761 1.168a11.119 11.119 0 0 1 2.34 1.93 10.355 10.355 0 0 1 1.688 2.437c.43.867.707 1.781.805 2.695l.03.313.032.309.035.316.031.309-.27.14-.538.274-.274.136c-.828.426-1.558.922-2.183 1.493a7.954 7.954 0 0 0-1.54 1.91 7.731 7.731 0 0 0-.87 2.273 9.264 9.264 0 0 0-.172 2.594c.066.96.285 1.871.64 2.703a7.903 7.903 0 0 0 1.446 2.258 8.316 8.316 0 0 0 2.14 1.683c.817.45 1.727.782 2.715.98 1.309.255 2.617.126 3.836-.3a8.813 8.813 0 0 0 3.266-2.05 8.893 8.893 0 0 0 2.117-3.239c.453-1.21.613-2.527.387-3.848a9.06 9.06 0 0 0-1.504-3.644 9.344 9.344 0 0 0-1.301-1.477 8.97 8.97 0 0 0-1.61-1.16c-.18-.097-.347-.2-.507-.293-.16-.097-.305-.183-.434-.265-.125-.082-.23-.153-.312-.211a.573.573 0 0 1-.137-.121.813.813 0 0 1-.063-.184c-.027-.094-.058-.223-.097-.375a11.147 11.147 0 0 1-.11-.512c-.039-.187-.082-.39-.12-.594-.098-.5-.227-1.023-.383-1.554a19.7 19.7 0 0 0-.551-1.594c-.207-.527-.43-1.039-.668-1.512a12.868 12.868 0 0 0-.735-1.3 12.93 12.93 0 0 0-1.582-1.954 15.064 15.064 0 0 0-1.98-1.691 15.833 15.833 0 0 0-2.27-1.355 14.35 14.35 0 0 0-2.449-.934 9.33 9.33 0 0 0-.836-.188 25.72 25.72 0 0 0-1.094-.18 40.224 40.224 0 0 0-2.605-.269 51.614 51.614 0 0 1-1.281-.11 47.27 47.27 0 0 1-1.242-.128 37.65 37.65 0 0 1-1.067-.14 12.643 12.643 0 0 1-.746-.133 11.48 11.48 0 0 1-1.508-.458c-.5-.187-.996-.414-1.472-.668a12.371 12.371 0 0 1-2.606-1.847 16.117 16.117 0 0 1-1.676-1.836 5.604 5.604 0 0 1-.465-.707c-.097-.192-.125-.324-.074-.375.016-.016.117-.012.285.004.168.015.407.047.696.09.293.039.633.093 1.008.156.37.062.78.137 1.207.215a60.65 60.65 0 0 0 1.789.304c.527.079 1.011.133 1.535.172.523.04 1.09.063 1.777.078.692.016 1.504.02 2.527.024 1.22 0 2.204-.008 3.06-.031a27.474 27.474 0 0 0 2.257-.153 20.662 20.662 0 0 0 2.047-.336 48.885 48.885 0 0 0 2.426-.59 44.634 44.634 0 0 0 5.347-1.761 42.256 42.256 0 0 0 4.98-2.387 43.059 43.059 0 0 0 4.633-3.031 46.976 46.976 0 0 0 4.329-3.692 55.822 55.822 0 0 0 3.312-3.468 49.244 49.244 0 0 0 2.879-3.63 50.142 50.142 0 0 0 2.516-3.886 57.29 57.29 0 0 0 2.23-4.258c.375-.793.691-1.48.95-2.066.257-.59.46-1.078.613-1.473.144-.398.242-.7.285-.918.047-.219.039-.351-.016-.402-.078-.07-.41-.23-.902-.442a57.272 57.272 0 0 0-1.828-.73c-.692-.262-1.434-.535-2.121-.777a36.517 36.517 0 0 0-1.778-.586 54.289 54.289 0 0 0-3.531-.879 48.341 48.341 0 0 0-1.715-.332 23.874 23.874 0 0 0-1.465-.215l-.633-.07-.312-.04-.316-.035V39.301l-2.461.004h-2.461l-2.457.004h-2.461c-2.645.004-4.664.007-6.266.03-1.605.024-2.797.067-3.789.141-.992.079-1.789.192-2.598.356-.812.164-1.64.383-2.703.668a23.531 23.531 0 0 1-1.203.3c-.16.036-.289.06-.383.075-.093.016-.148.02-.156.008a29.962 29.962 0 0 1-.355-.672c-.102-.2-.22-.434-.348-.692a79.19 79.19 0 0 1-.418-.828c-.45-.902-.785-1.578-1.168-2.234-.379-.66-.805-1.297-1.422-2.117-.617-.817-1.433-1.82-2.594-3.203-1.16-1.387-2.671-3.153-4.68-5.508-1.398-1.64-2.53-2.961-3.44-4.02a272.265 272.265 0 0 0-2.122-2.441c-.523-.59-.875-.973-1.11-1.211-.237-.234-.355-.324-.402-.32-.015 0-.07.047-.156.132-.086.086-.199.207-.34.356-.136.148-.296.328-.472.523-.172.2-.364.414-.555.641m7.059 11.504a151.52 151.52 0 0 1 3.582 4.336 58.05 58.05 0 0 1 2.488 3.336c.66.965 1.16 1.793 1.516 2.515.355.72.57 1.332.66 1.868.023.14.039.25.031.347a.526.526 0 0 1-.09.262 1.205 1.205 0 0 1-.266.262c-.12.093-.285.199-.492.332-.332.21-.773.554-1.265.976-.493.426-1.043.934-1.594 1.473a43.455 43.455 0 0 0-1.625 1.672 25.487 25.487 0 0 0-1.348 1.574c-.398.512-.812 1.09-1.222 1.703a39.76 39.76 0 0 0-1.204 1.91 39.73 39.73 0 0 0-1.085 1.946c-.329.636-.622 1.25-.86 1.812-.34.809-.672 1.727-.976 2.688-.305.96-.582 1.964-.817 2.945-.234.984-.43 1.945-.562 2.816-.137.871-.215 1.653-.215 2.282-.004.609-.024 1.054-.055 1.332-.035.277-.086.386-.152.328-.067-.055-.149-.278-.246-.664a26.572 26.572 0 0 1-.336-1.66 76.29 76.29 0 0 0-.54-2.758 81.86 81.86 0 0 0-.624-2.66c-.211-.844-.43-1.637-.645-2.34a22.878 22.878 0 0 0-.617-1.801 24.472 24.472 0 0 0-.742-1.66 48.94 48.94 0 0 0-2.047-3.746c-.36-.59-.707-1.13-1.027-1.582a21.393 21.393 0 0 0-1.153-1.446 44.776 44.776 0 0 0-1.558-1.71 47.283 47.283 0 0 0-1.657-1.657c-.539-.512-1.043-.96-1.468-1.3-.172-.141-.34-.278-.489-.41a8.144 8.144 0 0 1-.402-.376 3.846 3.846 0 0 1-.27-.293c-.066-.082-.101-.144-.101-.176 0-.105.098-.378.262-.753.16-.372.386-.848.644-1.356.258-.508.547-1.05.828-1.562a24.735 24.735 0 0 1 1.582-2.508c.262-.371.543-.746.871-1.16.329-.418.7-.871 1.149-1.407.45-.535.973-1.144 1.601-1.87.235-.27.536-.614.875-1.005.336-.394.715-.832 1.114-1.293.394-.46.808-.937 1.215-1.41.402-.472.8-.933 1.168-1.363l.668-.777.668-.774.667-.777.665-.778.117.118.113.12.117.118.113.117a110.75 110.75 0 0 1 1.668 1.914l1.555 1.809c.57.664 1.184 1.383 1.813 2.12M51.227 44.149c.425.09.867.2 1.304.317.434.117.864.242 1.254.37.395.13.754.259 1.055.38.297.12.535.234.687.332.051.035.09.094.11.191.02.098.023.239.011.442-.015.199-.046.457-.097.793-.055.336-.125.75-.215 1.257-.094.524-.172.989-.23 1.446-.06.457-.106.91-.137 1.41a32.68 32.68 0 0 0-.067 1.7c-.011.648-.015 1.401-.015 2.312 0 .98.004 1.761.015 2.414.012.648.035 1.172.07 1.644.04.473.09.89.165 1.336.07.446.164.918.285 1.488.074.348.156.72.242 1.094.082.375.168.754.254 1.11.086.359.168.695.242.992.074.3.14.554.195.75.055.195.102.383.149.554.043.172.082.329.113.461.031.13.059.239.07.317.016.078.02.125.012.133a.942.942 0 0 1-.183-.079 35.955 35.955 0 0 1-1.148-.629c-.255-.144-.532-.304-.821-.472a95.651 95.651 0 0 0-2.031-1.152 44.616 44.616 0 0 0-1.723-.899 34 34 0 0 0-1.633-.75 44.224 44.224 0 0 0-1.762-.715 50.86 50.86 0 0 0-2.855-1.004 45.68 45.68 0 0 0-2.8-.793 39.106 39.106 0 0 0-2.653-.562 26.924 26.924 0 0 0-2.406-.309l-.426-.03-.426-.036-.426-.031-.426-.035V43.758h7.215c1.578.004 2.832.008 3.852.015 1.02.012 1.8.028 2.437.055a20.37 20.37 0 0 1 1.547.117c.43.051.797.117 1.196.203m64.886 7.493c0 1.23-.008 2.34-.015 3.312-.008.977-.02 1.817-.04 2.504-.015.691-.038 1.23-.062 1.602-.023.367-.05.57-.082.59a1.259 1.259 0 0 1-.281.07c-.153.031-.367.062-.617.101-.254.035-.547.078-.868.117-.32.043-.664.083-1.02.122-.765.086-1.538.199-2.323.343-.79.141-1.59.313-2.407.516-.816.203-1.652.434-2.503.7-.856.26-1.73.558-2.625.882-.735.266-1.305.477-1.801.672-.496.195-.918.375-1.348.578-.43.203-.867.43-1.398.723-.528.289-1.149.644-1.946 1.101a34.54 34.54 0 0 1-1.644.895 9.035 9.035 0 0 1-.528.242c-.128.055-.21.074-.226.059-.016-.016-.02-.082-.012-.184a5.49 5.49 0 0 1 .055-.422c.031-.172.066-.371.113-.59.043-.219.098-.457.156-.699.258-1.082.454-1.906.602-2.613.152-.703.258-1.282.332-1.867.078-.583.125-1.172.156-1.895.035-.723.059-1.578.086-2.695.024-.98.04-1.77.043-2.434.004-.66-.004-1.2-.027-1.684a17.76 17.76 0 0 0-.113-1.355 29.95 29.95 0 0 0-.223-1.445c-.152-.887-.27-1.543-.336-2.035-.066-.493-.086-.825-.04-1.059a.664.664 0 0 1 .333-.492c.18-.117.437-.207.781-.336.692-.266 1.29-.469 1.926-.63.637-.16 1.309-.276 2.152-.358.84-.082 1.852-.133 3.164-.16 1.309-.032 2.922-.044 4.965-.047l3.813-.008h1.902l1.906-.004v7.883m-25.05-2.368c.195 1.02.343 1.977.437 2.91.098.934.14 1.837.133 2.75a25.621 25.621 0 0 1-.18 2.797c-.11.961-.273 1.961-.488 3.036a39.395 39.395 0 0 1-.746 3.12 31.161 31.161 0 0 1-.946 2.829c-.355.906-.75 1.781-1.187 2.64a30.9 30.9 0 0 1-1.473 2.555c-.215.34-.597.86-1.074 1.469a76.18 76.18 0 0 1-1.625 2.012 79.82 79.82 0 0 1-1.73 2.011 30.987 30.987 0 0 1-1.387 1.489l-.258.25-.262.254-.257.253-.262.254.02-1.62.023-1.622.02-1.617.019-1.621c.02-1.414.035-2.543.058-3.465.02-.922.047-1.637.082-2.227.036-.59.082-1.054.141-1.472.059-.422.133-.797.227-1.211a38.117 38.117 0 0 1 1.086-3.91c.418-1.235.89-2.403 1.433-3.524a28.68 28.68 0 0 1 1.82-3.222 31.184 31.184 0 0 1 2.258-3.012 18.08 18.08 0 0 1 1.012-1.086c.367-.363.746-.715 1.106-1.023.355-.31.69-.575.964-.762.27-.188.48-.297.59-.297.035 0 .07.031.11.086.039.05.078.129.12.226a4.214 4.214 0 0 1 .216.75m-28.895.91c.914.915 1.738 1.86 2.488 2.86a25.52 25.52 0 0 1 2.028 3.187 30.027 30.027 0 0 1 1.636 3.645 42.64 42.64 0 0 1 1.32 4.23c.122.485.22.872.294 1.274.074.406.125.832.164 1.387.043.554.07 1.242.09 2.171.023.934.039 2.11.058 3.645.02 1.441.035 2.566.04 3.438.003.87 0 1.488-.016 1.921-.016.434-.043.68-.086.813-.04.129-.094.14-.16.101-.106-.058-.376-.324-.743-.722-.367-.399-.84-.926-1.34-1.512a82.643 82.643 0 0 1-1.539-1.832 48.185 48.185 0 0 1-1.34-1.695c-.34-.45-.722-1.031-1.117-1.688a40.534 40.534 0 0 1-1.183-2.125 43.623 43.623 0 0 1-1.075-2.207 21.82 21.82 0 0 1-.773-1.933c-.07-.215-.152-.477-.238-.762-.082-.29-.172-.602-.258-.922a49.961 49.961 0 0 1-.461-1.844c-.187-.86-.316-2.113-.395-3.508a62.606 62.606 0 0 1-.066-4.378c.027-1.434.106-2.762.227-3.735.12-.969.285-1.578.492-1.578.023 0 .097.05.21.14.11.09.259.22.438.38a44.358 44.358 0 0 1 1.305 1.25m53.23 15.39a24.897 24.897 0 0 1-.965 4.492 26.72 26.72 0 0 1-.824 2.25 33.11 33.11 0 0 1-1.058 2.305c-.344.676-.66 1.262-.98 1.805-.321.543-.641 1.035-.997 1.523-.351.485-.734.961-1.18 1.473-.445.508-.953 1.05-1.542 1.66a35.204 35.204 0 0 1-1.579 1.54c-.496.448-.976.847-1.468 1.21-.493.367-1 .703-1.551 1.031-.55.328-1.145.649-1.817.989-.84.421-1.624.761-2.445 1.03a15.58 15.58 0 0 1-2.683.626c-1.004.152-2.145.25-3.532.308-1.382.063-3.011.082-4.98.082H82.18l.03-.113.036-.113.031-.113.035-.114c.055-.199.243-.582.516-1.074.274-.496.633-1.101 1.027-1.746.399-.645.836-1.324 1.266-1.969.43-.644.852-1.25 1.219-1.746a44.604 44.604 0 0 1 5.883-6.445 41.569 41.569 0 0 1 6.812-4.977 38.048 38.048 0 0 1 7.477-3.36 34.711 34.711 0 0 1 7.886-1.585c.11-.008.22-.02.325-.027.105-.008.203-.02.293-.028.09-.008.164-.02.226-.023.063-.008.106-.016.13-.02.023-.004.038.024.05.078a.934.934 0 0 1 .023.239c.004.101 0 .226-.007.363-.008.137-.02.29-.04.45M30.934 66.89c.242 1.234.562 2.488.945 3.738a41.182 41.182 0 0 0 1.32 3.68 37.438 37.438 0 0 0 1.61 3.425 27.185 27.185 0 0 0 1.816 2.961c.45.633.992 1.313 1.594 2.004a38.232 38.232 0 0 0 1.949 2.074c.687.68 1.395 1.34 2.098 1.942.699.597 1.39 1.144 2.03 1.597.298.208.575.407.825.59.25.184.469.352.649.496.18.141.32.258.41.344.09.082.129.133.105.14-.066.028-.328-.038-.71-.167-.384-.13-.891-.324-1.458-.555a48.612 48.612 0 0 1-1.812-.777 38.066 38.066 0 0 1-7.352-4.297 42.01 42.01 0 0 1-5.043-4.422 44.733 44.733 0 0 1-4.37-5.254 45.026 45.026 0 0 1-3.575-5.941c-.125-.258-.25-.504-.356-.735-.109-.226-.207-.433-.285-.609-.078-.176-.14-.32-.18-.422-.042-.101-.058-.164-.05-.172.008-.008.062-.031.148-.066.09-.035.211-.082.36-.137.144-.05.32-.113.507-.18l.614-.21c.433-.145.988-.297 1.593-.446a39.578 39.578 0 0 1 3.805-.73c.574-.078 1.07-.125 1.434-.133l.23-.004.235-.004.23-.004.234-.004.114.57.109.57.113.567.114.57m8.199-1.87c1.383.238 2.8.59 4.226 1.039 1.426.449 2.856 1 4.27 1.636a42.064 42.064 0 0 1 4.16 2.164c1.348.801 2.648 1.68 3.879 2.621.41.317.95.778 1.547 1.32a69.069 69.069 0 0 1 1.914 1.805c.652.641 1.3 1.293 1.871 1.899a31.34 31.34 0 0 1 1.422 1.586 46.416 46.416 0 0 1 1.726 2.27c.57.796 1.125 1.613 1.622 2.39.5.781.94 1.52 1.285 2.152.343.637.593 1.172.71 1.543l.032.114.035.113.04.113.03.113h-5.511c-1.918 0-3.48-.02-4.801-.078-1.324-.058-2.41-.156-3.371-.312a15.68 15.68 0 0 1-2.63-.653c-.831-.289-1.651-.652-2.581-1.109a20.527 20.527 0 0 1-3.137-1.926 24.776 24.776 0 0 1-2.902-2.523 26.07 26.07 0 0 1-2.528-2.988 24.005 24.005 0 0 1-2.011-3.305 35.404 35.404 0 0 1-1.192-2.649 38.321 38.321 0 0 1-.968-2.66 25.394 25.394 0 0 1-.645-2.39c-.156-.72-.238-1.348-.238-1.832 0-.211 0-.371.011-.489.012-.12.032-.203.079-.257.043-.055.105-.082.203-.098.093-.016.222-.016.39-.016.094 0 .25.012.453.032.204.023.454.05.73.09.278.035.583.078.903.128.32.047.653.102.977.157m84.953.085c.336.06.809.168 1.336.297.523.13 1.101.282 1.64.434.543.152 1.051.305 1.43.43.387.125.649.222.7.273.027.023-.028.184-.149.45-.121.265-.3.632-.527 1.062-.223.433-.493.93-.79 1.457a56.9 56.9 0 0 1-.937 1.633 44.31 44.31 0 0 1-3.473 5.027 46.345 46.345 0 0 1-4.12 4.531 43.203 43.203 0 0 1-4.571 3.848 34.726 34.726 0 0 1-4.82 2.969 42.898 42.898 0 0 1-3.02 1.367c-.469.191-.89.351-1.207.457-.32.105-.535.156-.598.137-.027-.012.004-.055.079-.133.074-.074.195-.18.351-.309.153-.129.348-.281.563-.445.218-.164.465-.344.722-.531a31.987 31.987 0 0 0 3.067-2.473 30.025 30.025 0 0 0 4.992-5.887 32.018 32.018 0 0 0 1.953-3.441c.398-.809.75-1.57 1.059-2.309a30.121 30.121 0 0 0 1.48-4.39c.188-.758.363-1.547.52-2.391l.109-.59.113-.586.11-.59.109-.586h1.133c.156 0 .347.008.566.024.215.012.457.035.703.062a20.21 20.21 0 0 1 1.477.203m-79.191 55.711c.363.23.671.555.917.934.247.379.426.816.536 1.273.109.457.148.938.105 1.407a3.61 3.61 0 0 1-.371 1.336c-.156.304-.332.57-.539.808a3.303 3.303 0 0 1-1.512.996 4.104 4.104 0 0 1-.965.184 4.468 4.468 0 0 1-1.03-.043 3.427 3.427 0 0 1-1.719-.805 4.434 4.434 0 0 1-.696-.77 3.378 3.378 0 0 1-.555-1.284 4.203 4.203 0 0 1-.046-1.434c.066-.48.21-.945.43-1.36.214-.413.507-.78.87-1.058a3.654 3.654 0 0 1 1.059-.555c.383-.132.789-.207 1.2-.222.41-.02.82.023 1.214.12.39.102.766.259 1.102.473m64.375-.195c.175.086.37.23.574.406.199.176.402.38.586.598.187.215.36.438.492.652.133.211.226.407.266.567.019.07.035.168.042.285.012.113.02.25.024.398.004.145 0 .301-.004.457a8.875 8.875 0 0 1-.023.461 3.545 3.545 0 0 1-.774 1.953 3.866 3.866 0 0 1-3.625 1.368 3.584 3.584 0 0 1-1.883-.95 4.289 4.289 0 0 1-.55-.609 2.827 2.827 0 0 1-.352-.637 3.475 3.475 0 0 1-.188-.746 6.793 6.793 0 0 1-.054-.941c0-.352.027-.672.082-.961.05-.293.137-.555.25-.797.117-.242.265-.465.449-.676.188-.21.406-.41.668-.601.25-.188.547-.328.879-.434a4.168 4.168 0 0 1 1.05-.187c.364-.024.735 0 1.09.066.36.062.7.176 1 .328m-31.93.473c.177.125.368.328.556.57.183.242.367.531.527.824.16.293.297.598.394.88a2.5 2.5 0 0 1 .16.737c0 .258-.074.567-.206.895a5.551 5.551 0 0 1-.54.996 6 6 0 0 1-.742.906c-.265.27-.547.489-.816.63a2.93 2.93 0 0 1-1.024.3 3.709 3.709 0 0 1-1.117-.047 3.928 3.928 0 0 1-1.066-.37 3.194 3.194 0 0 1-.871-.669 4.034 4.034 0 0 1-.68-1.012 4.028 4.028 0 0 1-.355-1.12 3.802 3.802 0 0 1-.012-1.153 3.5 3.5 0 0 1 .344-1.094c.187-.363.375-.664.586-.91.21-.242.441-.43.71-.57.266-.14.57-.23.922-.282a6.496 6.496 0 0 1 1.239-.046c.254.011.472.027.664.046.195.024.363.055.515.098a2.284 2.284 0 0 1 .813.39" id="path6"/>%0A</svg>';
121
-
122
- // src/primitives/Dialog.tsx
123
- import { Dialog as ArkDialog } from "@ark-ui/react/dialog";
124
- import { Portal } from "@ark-ui/react/portal";
125
-
126
- // src/lib/cn.ts
127
- import { clsx } from "clsx";
128
- import { extendTailwindMerge } from "tailwind-merge";
129
- var twMerge = extendTailwindMerge({ prefix: "polli" });
130
- function cn(...inputs) {
131
- return twMerge(clsx(...inputs));
132
- }
133
-
134
- // src/primitives/Dialog.tsx
135
- import { jsx, jsxs } from "react/jsx-runtime";
136
- var sizeClasses = {
137
- sm: "polli:max-w-md",
138
- md: "polli:max-w-xl",
139
- lg: "polli:max-w-2xl"
140
- };
141
- var Dialog = ({
142
- open,
143
- onOpenChange,
144
- trigger,
145
- triggerAsChild = false,
146
- triggerClassName,
147
- title,
148
- titleClassName,
149
- ariaLabel,
150
- labelledBy,
151
- theme = "blue",
152
- size = "md",
153
- showBackdrop = true,
154
- backdropClassName,
155
- positionerClassName,
156
- contentClassName,
157
- children
158
- }) => /* @__PURE__ */ jsxs(
159
- ArkDialog.Root,
160
- {
161
- open,
162
- onOpenChange: (details) => onOpenChange?.(details.open),
163
- children: [
164
- trigger && /* @__PURE__ */ jsx(
165
- ArkDialog.Trigger,
166
- {
167
- asChild: triggerAsChild,
168
- className: triggerClassName,
169
- children: trigger
170
- }
171
- ),
172
- /* @__PURE__ */ jsxs(Portal, { children: [
173
- showBackdrop && /* @__PURE__ */ jsx(
174
- ArkDialog.Backdrop,
175
- {
176
- className: cn(
177
- "polli:fixed polli:inset-0 polli:z-[100] polli:bg-gray-950/50",
178
- backdropClassName
179
- )
180
- }
181
- ),
182
- /* @__PURE__ */ jsx(
183
- ArkDialog.Positioner,
184
- {
185
- className: cn(
186
- "polli:fixed polli:inset-0 polli:z-[110] polli:flex polli:h-dvh polli:items-start polli:justify-center polli:overflow-hidden polli:p-4",
187
- positionerClassName
188
- ),
189
- children: /* @__PURE__ */ jsxs(
190
- ArkDialog.Content,
191
- {
192
- "data-theme": theme,
193
- "aria-label": ariaLabel,
194
- "aria-labelledby": labelledBy,
195
- className: cn(
196
- "polli:my-auto polli:w-full polli:overflow-hidden polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-white polli:shadow-lg",
197
- sizeClasses[size],
198
- contentClassName
199
- ),
200
- children: [
201
- title && /* @__PURE__ */ jsx(
202
- DialogTitle,
203
- {
204
- className: cn(
205
- "polli:px-6 polli:pt-6 polli:font-subheading polli:text-xl polli:text-theme-text-strong",
206
- titleClassName
207
- ),
208
- children: title
209
- }
210
- ),
211
- children
212
- ]
213
- }
214
- )
215
- }
216
- )
217
- ] })
218
- ]
219
- }
220
- );
221
- var DialogTitle = ArkDialog.Title;
222
-
223
- // src/modules/auth/AuthModal.tsx
224
- import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
225
- var authLogoMask = {
226
- WebkitMask: `url(${logo_default}) center / contain no-repeat`,
227
- mask: `url(${logo_default}) center / contain no-repeat`
228
- };
229
- function ErrorBanner({ children }) {
230
- return /* @__PURE__ */ jsx2("div", { className: "polli:rounded-lg polli:border-2 polli:border-intent-danger-border polli:bg-intent-danger-bg-light polli:p-4", children: /* @__PURE__ */ jsx2("p", { className: "polli:text-sm polli:text-intent-danger-text", children }) });
231
- }
232
- function AuthInfoCard({
233
- title = "Authorize",
234
- titleId,
235
- children
236
- }) {
237
- return /* @__PURE__ */ jsxs2("div", { className: "polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-theme-bg-pale polli:p-4", children: [
238
- /* @__PURE__ */ jsx2(
239
- "p",
240
- {
241
- id: titleId,
242
- className: "polli:mb-2 polli:font-body polli:text-xs polli:font-semibold polli:tracking-wide polli:text-theme-text-soft",
243
- children: title
244
- }
245
- ),
246
- children
247
- ] });
248
- }
249
-
250
- // src/modules/modality/colors.ts
251
- var MODALITY_COLORS = {
252
- text: {
253
- filled: "polli:bg-blue-200 polli:text-blue-900",
254
- hover: "polli:hover:bg-blue-100 polli:hover:text-blue-900",
255
- text: "polli:text-blue-800"
256
- },
257
- image: {
258
- filled: "polli:bg-pink-200 polli:text-pink-900",
259
- hover: "polli:hover:bg-pink-100 polli:hover:text-pink-900",
260
- text: "polli:text-pink-800"
261
- },
262
- video: {
263
- filled: "polli:bg-teal-200 polli:text-teal-900",
264
- hover: "polli:hover:bg-teal-100 polli:hover:text-teal-900",
265
- text: "polli:text-teal-800"
266
- },
267
- audio: {
268
- filled: "polli:bg-violet-200 polli:text-violet-900",
269
- hover: "polli:hover:bg-violet-100 polli:hover:text-violet-900",
270
- text: "polli:text-violet-800"
271
- },
272
- realtime: {
273
- filled: "polli:bg-green-200 polli:text-green-900",
274
- hover: "polli:hover:bg-green-100 polli:hover:text-green-900",
275
- text: "polli:text-green-800"
276
- },
277
- embedding: {
278
- filled: "polli:bg-amber-200 polli:text-amber-900",
279
- hover: "polli:hover:bg-amber-100 polli:hover:text-amber-900",
280
- text: "polli:text-amber-800"
281
- }
282
- };
283
- function normalize(category) {
284
- const lower = category.toLowerCase();
285
- if (lower === "images") return "image";
286
- if (lower === "embeddings") return "embedding";
287
- if (lower === "text" || lower === "image" || lower === "video" || lower === "audio" || lower === "realtime" || lower === "embedding") {
288
- return lower;
289
- }
290
- return null;
291
- }
292
- function getModalityColors(category) {
293
- const key = normalize(category);
294
- return key ? MODALITY_COLORS[key] : null;
295
- }
296
-
297
- // src/modules/modality/ModalityButton.tsx
298
- import { jsx as jsx3 } from "react/jsx-runtime";
299
- var ModalityButton = ({
300
- category,
301
- selected = true,
302
- onClick,
303
- disabled,
304
- children
305
- }) => {
306
- const colors = getModalityColors(category ?? "");
307
- return /* @__PURE__ */ jsx3(
308
- "button",
309
- {
310
- type: "button",
311
- onClick,
312
- disabled,
313
- "aria-pressed": selected,
314
- className: cn(
315
- "polli:inline-flex polli:shrink-0 polli:items-center polli:gap-1 polli:rounded-full polli:px-3 polli:py-1 polli:text-left polli:text-sm polli:font-medium polli:leading-normal polli:transition-colors",
316
- selected ? colors?.filled ?? "polli:bg-gray-200 polli:text-gray-900" : "polli:bg-gray-100 polli:text-gray-600",
317
- !disabled && !selected && colors?.hover,
318
- disabled ? "polli:cursor-not-allowed polli:opacity-50" : "polli:cursor-pointer"
319
- ),
320
- children
321
- }
322
- );
323
- };
324
-
325
- // src/primitives/Chip.tsx
326
- import { jsx as jsx4 } from "react/jsx-runtime";
327
- var chipSizes = {
328
- sm: "polli:px-2 polli:py-0.5 polli:text-xs",
329
- md: "polli:px-2.5 polli:py-0.5 polli:text-sm",
330
- lg: "polli:px-3 polli:py-1 polli:text-sm"
331
- };
332
- var intentClasses = {
333
- news: "polli:bg-[oklch(0.935_0.06_158)] polli:text-[oklch(0.46_0.13_158)]",
334
- alpha: "polli:bg-[oklch(0.93_0.06_300)] polli:text-[oklch(0.42_0.18_300)]",
335
- neutral: "polli:border polli:border-gray-400/70 polli:bg-gray-100/80 polli:text-gray-900"
336
- };
337
- var Chip = ({
338
- theme,
339
- intent,
340
- size = "md",
341
- className,
342
- children,
343
- ...rest
344
- }) => {
345
- const intentClass = intent ? intentClasses[intent] : "polli:bg-theme-bg-active polli:text-theme-text-strong";
346
- return /* @__PURE__ */ jsx4(
347
- "span",
348
- {
349
- ...rest,
350
- "data-theme": theme,
351
- className: cn(
352
- "polli:inline-flex polli:shrink-0 polli:items-center polli:gap-1 polli:rounded-lg polli:font-medium polli:leading-normal",
353
- chipSizes[size],
354
- intentClass,
355
- className
356
- ),
357
- children
358
- }
359
- );
360
- };
361
-
362
- // src/modules/wallet/chips.tsx
363
- import { jsx as jsx5 } from "react/jsx-runtime";
364
- var PaidChip = ({
365
- className,
366
- children,
367
- ...props
368
- }) => /* @__PURE__ */ jsx5(Chip, { ...props, className: cn("polli-wallet-chip-paid", className), children });
369
- var TierChip = ({
370
- className,
371
- children,
372
- ...props
373
- }) => /* @__PURE__ */ jsx5(Chip, { ...props, className: cn("polli-wallet-chip-tier", className), children });
374
-
375
- // src/modules/wallet/format-pollen.ts
376
- var BUDGET = 5;
377
- var MAX_DECIMALS = 4;
378
- var COMPACT_THRESHOLD = 1e5;
379
- function floorTo(value, decimals) {
380
- const factor = 10 ** decimals;
381
- return Math.floor(value * factor) / factor;
382
- }
383
- function formatCompact(value) {
384
- const abs = Math.abs(value);
385
- const sign = value < 0 ? "-" : "";
386
- const [unit, scale] = abs >= 1e9 ? ["B", 1e9] : abs >= 1e6 ? ["M", 1e6] : ["K", 1e3];
387
- const ratio = abs / scale;
388
- const intDigits = Math.max(1, Math.floor(Math.log10(ratio)) + 1);
389
- const decimals = Math.max(0, 3 - intDigits);
390
- const floored = floorTo(ratio, decimals);
391
- return `${sign}${Number(floored.toFixed(decimals)).toString()}${unit}`;
392
- }
393
- function formatPollen(value) {
394
- if (!Number.isFinite(value) || value === 0) return "0";
395
- const abs = Math.abs(value);
396
- if (abs >= COMPACT_THRESHOLD) return formatCompact(value);
397
- const intDigits = abs >= 1 ? Math.floor(Math.log10(abs)) + 1 : 1;
398
- const decimals = Math.min(MAX_DECIMALS, Math.max(0, BUDGET - intDigits));
399
- const floored = floorTo(value, decimals);
400
- if (floored === 0) return "0";
401
- return Number(floored.toFixed(decimals)).toString();
402
- }
403
-
404
- // src/modules/wallet/wallet-display.tsx
405
- import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
406
- var walletPanelClasses = {
407
- paid: "polli-wallet-panel-paid",
408
- tier: "polli-wallet-panel-tier"
409
- };
410
- var walletTextClasses = {
411
- paid: "polli-wallet-text-paid",
412
- tier: "polli-wallet-text-tier"
413
- };
414
- var WalletDot = ({ kind, className }) => /* @__PURE__ */ jsx6(
415
- "span",
416
- {
417
- className: cn(
418
- "polli:h-2 polli:w-2 polli:rounded-full",
419
- kind === "paid" ? "polli-wallet-dot-paid" : "polli-wallet-dot-tier",
420
- className
421
- ),
422
- "aria-hidden": "true"
423
- }
424
- );
425
- var WalletBalanceCard = ({
426
- kind,
427
- label,
428
- value,
429
- info,
430
- footer,
431
- className
432
- }) => /* @__PURE__ */ jsxs3(
433
- "div",
434
- {
435
- className: cn(
436
- "polli:rounded-xl polli:p-4",
437
- walletPanelClasses[kind],
438
- className
439
- ),
440
- children: [
441
- /* @__PURE__ */ jsxs3("span", { className: "polli:flex polli:items-center polli:gap-2", children: [
442
- /* @__PURE__ */ jsx6(WalletDot, { kind }),
443
- /* @__PURE__ */ jsx6("span", { className: "polli:text-sm polli:font-bold polli:uppercase polli:tracking-wide polli:text-amber-900", children: label }),
444
- info
445
- ] }),
446
- /* @__PURE__ */ jsx6(
447
- "div",
448
- {
449
- className: cn(
450
- "polli-wallet-balance-value polli:mt-1 polli:font-bold polli:leading-none polli:tracking-tight polli:tabular-nums",
451
- walletTextClasses[kind]
452
- ),
453
- children: value
454
- }
455
- ),
456
- footer && /* @__PURE__ */ jsx6("div", { className: "polli:mt-1.5 polli:text-sm polli:font-bold polli:tabular-nums polli:text-green-700", children: footer })
457
- ]
458
- }
459
- );
460
-
461
- // src/primitives/Button.tsx
462
- import { jsx as jsx7 } from "react/jsx-runtime";
463
- var sizes = {
464
- small: "polli:px-2 polli:pt-0.5 polli:pb-1",
465
- medium: "polli:px-4 polli:pt-1.5 polli:pb-2",
466
- large: "polli:px-6 polli:py-3"
467
- };
468
- var themeClasses = "polli:bg-theme-bg-active polli:text-theme-text-base polli:hover:bg-theme-bg-hover polli:transition-colors";
469
- var intentClasses2 = {
470
- danger: "polli:bg-intent-danger-bg-light polli:text-intent-danger-text polli:hover:bg-[oklch(0.88_0.075_25)] polli:transition-colors"
471
- };
472
- var buttonClasses = ({
473
- theme: _theme,
474
- intent,
475
- size,
476
- className,
477
- disabled
478
- }) => {
479
- const colorClasses = intent ? intentClasses2[intent] : themeClasses;
480
- return cn(
481
- "polli:inline-flex polli:items-center polli:justify-center polli:rounded-full polli:self-center polli:placeholder-green-950 polli:font-medium polli:leading-normal polli:box-border",
482
- disabled ? "polli:opacity-50 polli:cursor-not-allowed" : "polli:hover:filter polli:hover:brightness-105 polli:cursor-pointer",
483
- colorClasses,
484
- sizes[size || "medium"],
485
- className
486
- );
487
- };
488
- function Button({
489
- as,
490
- children,
491
- theme,
492
- intent,
493
- size,
494
- className,
495
- disabled,
496
- ...buttonProps
497
- }) {
498
- const Component = as || "button";
499
- return /* @__PURE__ */ jsx7(
500
- Component,
501
- {
502
- "data-theme": intent ? void 0 : theme,
503
- className: buttonClasses({
504
- theme,
505
- intent,
506
- size,
507
- className,
508
- disabled
509
- }),
510
- disabled,
511
- ...buttonProps,
512
- children
513
- }
514
- );
515
- }
516
-
517
- // src/primitives/ChevronIcon.tsx
518
- import { jsx as jsx8 } from "react/jsx-runtime";
519
- var ChevronIcon = ({ expanded, className }) => /* @__PURE__ */ jsx8(
520
- "svg",
521
- {
522
- "aria-hidden": "true",
523
- width: "12",
524
- height: "12",
525
- viewBox: "0 0 12 12",
526
- className: cn(
527
- "polli:shrink-0 polli:transition-transform polli:duration-200 polli:ease-out",
528
- expanded && "polli:rotate-180",
529
- className
530
- ),
531
- children: /* @__PURE__ */ jsx8(
532
- "path",
533
- {
534
- d: "M3 4.5 6 7.5l3-3",
535
- fill: "none",
536
- stroke: "currentColor",
537
- strokeLinecap: "round",
538
- strokeLinejoin: "round",
539
- strokeWidth: "1.5"
540
- }
541
- )
542
- }
543
- );
544
-
545
- // src/primitives/Collapsible.tsx
546
- import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
547
- var Collapsible = ({
548
- label,
549
- expanded,
550
- onToggle,
551
- children,
552
- disabled = false,
553
- wrapperClassName,
554
- hoverClassName = "polli:hover:bg-theme-bg-active",
555
- focusClassName,
556
- panelClassName = "polli:border-t polli:border-theme-border polli:px-3 polli:pt-3 polli:pb-3",
557
- ariaLabel
558
- }) => /* @__PURE__ */ jsxs4(
559
- "div",
560
- {
561
- className: cn(
562
- "polli:rounded-lg polli:border polli:transition-all",
563
- wrapperClassName,
564
- disabled && "polli:opacity-50"
565
- ),
566
- children: [
567
- /* @__PURE__ */ jsxs4(
568
- "button",
569
- {
570
- type: "button",
571
- "aria-expanded": expanded,
572
- "aria-label": ariaLabel,
573
- disabled,
574
- onClick: onToggle,
575
- className: cn(
576
- "polli:w-full polli:flex polli:items-center polli:gap-3 polli:px-3 polli:py-2 polli:text-left polli:transition-colors",
577
- expanded ? "polli:rounded-t-lg" : "polli:rounded-lg",
578
- !disabled && hoverClassName,
579
- focusClassName,
580
- disabled ? "polli:cursor-not-allowed" : "polli:cursor-pointer"
581
- ),
582
- children: [
583
- /* @__PURE__ */ jsx9("div", { className: "polli:flex-1 polli:min-w-0", children: label }),
584
- /* @__PURE__ */ jsx9(
585
- ChevronIcon,
586
- {
587
- expanded,
588
- className: "polli:text-theme-text-soft"
589
- }
590
- )
591
- ]
592
- }
593
- ),
594
- expanded && /* @__PURE__ */ jsx9("div", { className: panelClassName, children })
595
- ]
596
- }
597
- );
598
-
599
- // src/primitives/CopyButton.tsx
600
- import {
601
- useEffect,
602
- useRef as useRef2,
603
- useState as useState2
604
- } from "react";
605
-
606
- // src/primitives/Tooltip.tsx
607
- import {
608
- useRef,
609
- useState
610
- } from "react";
611
- import { Fragment, jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
612
- var TOOLTIP_MAX_WIDTH = 288;
613
- var TOOLTIP_VIEWPORT_MARGIN = 12;
614
- var Tooltip = ({
615
- children,
616
- content,
617
- ariaLabel,
618
- className,
619
- onClick,
620
- style,
621
- triggerAs = "button",
622
- displayContents = false
623
- }) => {
624
- const [showTooltip, setShowTooltip] = useState(false);
625
- const [tooltipPosition, setTooltipPosition] = useState({
626
- top: 0,
627
- left: 0,
628
- maxWidth: TOOLTIP_MAX_WIDTH
629
- });
630
- const triggerRef = useRef(null);
631
- const updateTooltipPosition = () => {
632
- if (triggerRef.current) {
633
- const rect = triggerRef.current.getBoundingClientRect();
634
- const maxWidth = Math.min(
635
- TOOLTIP_MAX_WIDTH,
636
- window.innerWidth - TOOLTIP_VIEWPORT_MARGIN * 2
637
- );
638
- const left = Math.min(
639
- Math.max(rect.left, TOOLTIP_VIEWPORT_MARGIN),
640
- Math.max(
641
- TOOLTIP_VIEWPORT_MARGIN,
642
- window.innerWidth - maxWidth - TOOLTIP_VIEWPORT_MARGIN
643
- )
644
- );
645
- setTooltipPosition({
646
- top: rect.bottom + 4,
647
- left,
648
- maxWidth
649
- });
650
- }
651
- };
652
- const triggerClassName = cn(
653
- "polli:relative polli:cursor-help polli:text-left polli:inline-flex polli:items-center",
654
- className
655
- );
656
- const cursorClass = displayContents ? "polli:contents" : "polli:cursor-help";
657
- const popupClasses = "polli:fixed polli:w-max polli:px-2 polli:py-1 polli:bg-theme-bg-pale polli:text-theme-text-strong polli:border polli:border-theme-border polli:text-xs polli:rounded-md polli:shadow-sm polli:z-50 polli:pointer-events-none polli:transition-opacity polli:whitespace-pre-line polli:break-words";
658
- const contentNode = /* @__PURE__ */ jsxs5(Fragment, { children: [
659
- /* @__PURE__ */ jsx10("span", { className: cursorClass, children }),
660
- /* @__PURE__ */ jsx10(
661
- "span",
662
- {
663
- style: {
664
- top: tooltipPosition.top,
665
- left: tooltipPosition.left,
666
- maxWidth: tooltipPosition.maxWidth
667
- },
668
- className: `${showTooltip ? "polli:visible polli:opacity-100" : "polli:invisible polli:opacity-0"} ${popupClasses}`,
669
- children: content
670
- }
671
- )
672
- ] });
673
- const sharedProps = {
674
- "aria-label": ariaLabel,
675
- className: triggerClassName,
676
- onMouseEnter: () => {
677
- updateTooltipPosition();
678
- setShowTooltip(true);
679
- },
680
- onMouseLeave: () => setShowTooltip(false),
681
- onClick: (e) => {
682
- e.stopPropagation();
683
- if (onClick) {
684
- onClick();
685
- }
686
- if (triggerAs === "span") {
687
- return;
688
- }
689
- updateTooltipPosition();
690
- setShowTooltip((prev) => !prev);
691
- },
692
- style
693
- };
694
- if (triggerAs === "span") {
695
- return /* @__PURE__ */ jsx10(
696
- "span",
697
- {
698
- ref: (node) => {
699
- triggerRef.current = node;
700
- },
701
- ...sharedProps,
702
- children: contentNode
703
- }
704
- );
705
- }
706
- return /* @__PURE__ */ jsx10(
707
- "button",
708
- {
709
- ref: (node) => {
710
- triggerRef.current = node;
711
- },
712
- type: "button",
713
- "aria-label": ariaLabel,
714
- className: triggerClassName,
715
- onMouseEnter: sharedProps.onMouseEnter,
716
- onMouseLeave: sharedProps.onMouseLeave,
717
- onClick: sharedProps.onClick,
718
- style,
719
- children: contentNode
720
- }
721
- );
722
- };
723
-
724
- // src/primitives/CopyButton.tsx
725
- import { jsx as jsx11 } from "react/jsx-runtime";
726
- function CopyButton({
727
- value,
728
- children,
729
- copiedTimeoutMs = 2e3,
730
- tooltip = "Click to copy",
731
- copiedTooltip = "Copied!",
732
- tooltipClassName,
733
- className,
734
- onCopied,
735
- onCopyError,
736
- ...buttonProps
737
- }) {
738
- const [copied, setCopied] = useState2(false);
739
- const timeoutRef = useRef2(null);
740
- useEffect(
741
- () => () => {
742
- if (timeoutRef.current) clearTimeout(timeoutRef.current);
743
- },
744
- []
745
- );
746
- async function handleCopy(event) {
747
- event.stopPropagation();
748
- try {
749
- const text = typeof value === "function" ? await value() : value;
750
- await navigator.clipboard.writeText(text);
751
- setCopied(true);
752
- onCopied?.();
753
- if (timeoutRef.current) clearTimeout(timeoutRef.current);
754
- timeoutRef.current = setTimeout(
755
- () => setCopied(false),
756
- copiedTimeoutMs
757
- );
758
- } catch (error) {
759
- onCopyError?.(error);
760
- }
761
- }
762
- const button = /* @__PURE__ */ jsx11(
763
- "button",
764
- {
765
- ...buttonProps,
766
- type: "button",
767
- onClick: handleCopy,
768
- className: cn(
769
- typeof className === "function" ? className(copied) : className
770
- ),
771
- children: typeof children === "function" ? children(copied) : children
772
- }
773
- );
774
- return /* @__PURE__ */ jsx11(
775
- Tooltip,
776
- {
777
- triggerAs: "span",
778
- content: copied ? copiedTooltip : tooltip,
779
- className: tooltipClassName,
780
- children: button
781
- }
782
- );
783
- }
784
-
785
- // src/primitives/Dropdown.tsx
786
- import { Popover } from "@ark-ui/react/popover";
787
- import { Portal as Portal2 } from "@ark-ui/react/portal";
788
- import { useState as useState3 } from "react";
789
- import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
790
- var DEFAULT_PANEL = "polli:rounded-lg polli:border polli:border-theme-border polli:bg-surface-white polli:shadow-lg";
791
- var Dropdown = ({
792
- theme,
793
- trigger,
794
- children,
795
- align = "start",
796
- open: openProp,
797
- onOpenChange,
798
- panelClassName,
799
- className
800
- }) => {
801
- const [internalOpen, setInternalOpen] = useState3(false);
802
- const isControlled = openProp !== void 0;
803
- const open = isControlled ? openProp : internalOpen;
804
- const setOpen = (next) => {
805
- if (!isControlled) setInternalOpen(next);
806
- onOpenChange?.(next);
807
- };
808
- return /* @__PURE__ */ jsxs6(
809
- Popover.Root,
810
- {
811
- open,
812
- onOpenChange: (details) => setOpen(details.open),
813
- positioning: {
814
- placement: align === "end" ? "bottom-end" : "bottom-start"
815
- },
816
- children: [
817
- /* @__PURE__ */ jsx12(Popover.Trigger, { asChild: true, children: trigger(open) }),
818
- /* @__PURE__ */ jsx12(Portal2, { children: /* @__PURE__ */ jsx12(Popover.Positioner, { children: /* @__PURE__ */ jsx12(
819
- Popover.Content,
820
- {
821
- "data-theme": theme,
822
- className: cn(
823
- "polli:z-50 polli:overflow-hidden polli:focus:outline-none",
824
- panelClassName ?? DEFAULT_PANEL,
825
- className
826
- ),
827
- children: typeof children === "function" ? children(() => setOpen(false)) : children
828
- }
829
- ) }) })
830
- ]
831
- }
832
- );
833
- };
834
-
835
- // src/primitives/icons/index.tsx
836
- import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
837
- var strokeProps = {
838
- fill: "none",
839
- stroke: "currentColor",
840
- strokeWidth: 2,
841
- strokeLinecap: "round",
842
- strokeLinejoin: "round"
843
- };
844
- function AppIcon(props) {
845
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
846
- /* @__PURE__ */ jsx13("rect", { x: "2", y: "4", width: "20", height: "14", rx: "2" }),
847
- /* @__PURE__ */ jsx13("path", { d: "M2 20h20" })
848
- ] });
849
- }
850
- function BeakerIcon(props) {
851
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
852
- /* @__PURE__ */ jsx13("path", { d: "M9 3h6" }),
853
- /* @__PURE__ */ jsx13("path", { d: "M10 3v6.5L4.5 18a2 2 0 0 0 1.7 3h11.6a2 2 0 0 0 1.7-3L14 9.5V3" }),
854
- /* @__PURE__ */ jsx13("path", { d: "M7 14h10" })
855
- ] });
856
- }
857
- function BookIcon(props) {
858
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
859
- /* @__PURE__ */ jsx13("path", { d: "M4 4h5a3 3 0 0 1 3 3v13a2 2 0 0 0-2-2H4z" }),
860
- /* @__PURE__ */ jsx13("path", { d: "M20 4h-5a3 3 0 0 0-3 3v13a2 2 0 0 1 2-2h6z" })
861
- ] });
862
- }
863
- function CheckIcon(props) {
864
- return /* @__PURE__ */ jsx13(
865
- "svg",
866
- {
867
- "aria-hidden": "true",
868
- viewBox: "0 0 24 24",
869
- ...strokeProps,
870
- strokeWidth: 2.5,
871
- ...props,
872
- children: /* @__PURE__ */ jsx13("polyline", { points: "20 6 9 17 4 12" })
873
- }
874
- );
875
- }
876
- function ClipboardIcon(props) {
877
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
878
- /* @__PURE__ */ jsx13("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2" }),
879
- /* @__PURE__ */ jsx13("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
880
- ] });
881
- }
882
- function ClockIcon(props) {
883
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
884
- /* @__PURE__ */ jsx13("circle", { cx: "12", cy: "12", r: "9" }),
885
- /* @__PURE__ */ jsx13("path", { d: "M12 7v5l3 2" })
886
- ] });
887
- }
888
- function DiscordIcon(props) {
889
- return /* @__PURE__ */ jsx13("svg", { viewBox: "0 0 24 24", "aria-hidden": "true", ...props, children: /* @__PURE__ */ jsx13(
890
- "path",
891
- {
892
- fill: "currentColor",
893
- d: "M20.32 4.37A19.8 19.8 0 0 0 15.36 2.83a.07.07 0 0 0-.08.04c-.21.38-.45.88-.62 1.27a18.27 18.27 0 0 0-5.52 0 12.84 12.84 0 0 0-.63-1.27.08.08 0 0 0-.08-.04A19.74 19.74 0 0 0 3.47 4.37a.07.07 0 0 0-.03.03C.31 9.07-.55 13.61-.13 18.1a.08.08 0 0 0 .03.06 19.9 19.9 0 0 0 6.08 3.07.08.08 0 0 0 .09-.03c.47-.64.88-1.31 1.24-2.02a.08.08 0 0 0-.04-.1 13.08 13.08 0 0 1-1.9-.91.08.08 0 0 1-.01-.13c.13-.1.25-.2.37-.29a.07.07 0 0 1 .08-.01 14.24 14.24 0 0 0 12.38 0 .07.07 0 0 1 .08.01c.12.1.25.2.38.3a.08.08 0 0 1-.01.12 12.22 12.22 0 0 1-1.9.9.08.08 0 0 0-.04.11c.36.7.77 1.38 1.23 2.02a.08.08 0 0 0 .1.03 19.84 19.84 0 0 0 6.08-3.07.08.08 0 0 0 .03-.05c.5-5.2-.84-9.7-3.77-13.71a.06.06 0 0 0-.03-.03ZM8.02 15.37c-1.18 0-2.16-1.08-2.16-2.4 0-1.32.96-2.4 2.16-2.4 1.2 0 2.18 1.09 2.16 2.4 0 1.32-.96 2.4-2.16 2.4Zm7.96 0c-1.18 0-2.16-1.08-2.16-2.4 0-1.32.96-2.4 2.16-2.4 1.2 0 2.18 1.09 2.16 2.4 0 1.32-.95 2.4-2.16 2.4Z"
894
- }
895
- ) });
896
- }
897
- function DownloadIcon(props) {
898
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
899
- /* @__PURE__ */ jsx13("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
900
- /* @__PURE__ */ jsx13("polyline", { points: "7 10 12 15 17 10" }),
901
- /* @__PURE__ */ jsx13("line", { x1: "12", y1: "15", x2: "12", y2: "3" })
902
- ] });
903
- }
904
- function ExternalLinkIcon(props) {
905
- return /* @__PURE__ */ jsx13("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: /* @__PURE__ */ jsx13("path", { d: "M7 17 17 7M9 7h8v8" }) });
906
- }
907
- function GenApiIcon(props) {
908
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
909
- /* @__PURE__ */ jsx13("path", { d: "m8 3 4 1.5L16 3v18l-4-1.5L8 21z" }),
910
- /* @__PURE__ */ jsx13("path", { d: "M8 3v18M16 3v18" })
911
- ] });
912
- }
913
- function GitHubIcon(props) {
914
- return /* @__PURE__ */ jsx13("svg", { viewBox: "0 0 24 24", "aria-hidden": "true", ...props, children: /* @__PURE__ */ jsx13(
915
- "path",
916
- {
917
- fill: "currentColor",
918
- d: "M12 .5A11.5 11.5 0 0 0 8.36 22.9c.58.11.79-.25.79-.56v-2.16c-3.21.7-3.89-1.38-3.89-1.38-.53-1.34-1.29-1.7-1.29-1.7-1.05-.72.08-.7.08-.7 1.16.08 1.77 1.19 1.77 1.19 1.04 1.76 2.71 1.25 3.37.96.11-.75.4-1.25.74-1.54-2.56-.29-5.26-1.28-5.26-5.7 0-1.26.45-2.29 1.19-3.1-.12-.29-.52-1.46.11-3.06 0 0 .97-.31 3.16 1.18a10.88 10.88 0 0 1 5.76 0c2.19-1.49 3.15-1.18 3.15-1.18.63 1.6.23 2.77.11 3.06.74.81 1.19 1.84 1.19 3.1 0 4.43-2.7 5.4-5.27 5.69.41.36.78 1.06.78 2.14v3.19c0 .31.21.68.8.56A11.5 11.5 0 0 0 12 .5Z"
919
- }
920
- ) });
921
- }
922
- function ImageIcon(props) {
923
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
924
- /* @__PURE__ */ jsx13("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
925
- /* @__PURE__ */ jsx13("circle", { cx: "9", cy: "9", r: "2" }),
926
- /* @__PURE__ */ jsx13("path", { d: "m21 15-5-5L5 21" })
927
- ] });
928
- }
929
- function LockIcon(props) {
930
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
931
- /* @__PURE__ */ jsx13("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2", ry: "2" }),
932
- /* @__PURE__ */ jsx13("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })
933
- ] });
934
- }
935
- function MailIcon(props) {
936
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
937
- /* @__PURE__ */ jsx13("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2" }),
938
- /* @__PURE__ */ jsx13("path", { d: "m3 7 9 7 9-7" })
939
- ] });
940
- }
941
- function McpIcon(props) {
942
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
943
- /* @__PURE__ */ jsx13("rect", { x: "2", y: "7", width: "8", height: "10", rx: "1.5" }),
944
- /* @__PURE__ */ jsx13("rect", { x: "14", y: "7", width: "8", height: "10", rx: "1.5" }),
945
- /* @__PURE__ */ jsx13("path", { d: "M10 12h4" })
946
- ] });
947
- }
948
- function MenuIcon(props) {
949
- return /* @__PURE__ */ jsx13("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: /* @__PURE__ */ jsx13("path", { d: "M4 7h16M4 12h16M4 17h16" }) });
950
- }
951
- function TerminalIcon(props) {
952
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
953
- /* @__PURE__ */ jsx13("polyline", { points: "4 8 8 12 4 16" }),
954
- /* @__PURE__ */ jsx13("line", { x1: "12", y1: "20", x2: "20", y2: "20" })
955
- ] });
956
- }
957
- function TokensIcon(props) {
958
- return /* @__PURE__ */ jsx13("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: /* @__PURE__ */ jsx13("path", { d: "M4 9h16M4 15h16M10 3 8 21M16 3l-2 18" }) });
959
- }
960
- function TrendUpIcon(props) {
961
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
962
- /* @__PURE__ */ jsx13("polyline", { points: "3 17 9 11 13 15 21 7" }),
963
- /* @__PURE__ */ jsx13("polyline", { points: "15 7 21 7 21 13" })
964
- ] });
965
- }
966
- function WalletIcon(props) {
967
- return /* @__PURE__ */ jsxs7("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: [
968
- /* @__PURE__ */ jsx13("path", { d: "M3 7a2 2 0 0 1 2-2h13a2 2 0 0 1 2 2v2H5a2 2 0 0 0-2 2V7Z" }),
969
- /* @__PURE__ */ jsx13("path", { d: "M3 11a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-6Z" }),
970
- /* @__PURE__ */ jsx13("circle", { cx: "17", cy: "14", r: "1.25", fill: "currentColor" })
971
- ] });
972
- }
973
- function XIcon(props) {
974
- return /* @__PURE__ */ jsx13("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", ...strokeProps, ...props, children: /* @__PURE__ */ jsx13("path", { d: "M18 6 6 18M6 6l12 12" }) });
975
- }
976
-
977
- // src/primitives/ExternalLinkButton.tsx
978
- import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
979
- var ExternalLinkButton = ({
980
- theme,
981
- href,
982
- size = "medium",
983
- className,
984
- children
985
- }) => /* @__PURE__ */ jsxs8(
986
- Button,
987
- {
988
- as: "a",
989
- href,
990
- target: "_blank",
991
- rel: "noopener noreferrer",
992
- theme,
993
- size,
994
- className: cn("polli:gap-2", className),
995
- children: [
996
- /* @__PURE__ */ jsx14("span", { children }),
997
- /* @__PURE__ */ jsx14(
998
- ExternalLinkIcon,
999
- {
1000
- className: "polli:h-4 polli:w-4 polli:shrink-0 polli:opacity-60",
1001
- "aria-hidden": "true"
1002
- }
1003
- )
1004
- ]
1005
- }
1006
- );
1007
-
1008
- // src/primitives/Field.tsx
1009
- import { Field } from "@ark-ui/react/field";
1010
-
1011
- // src/primitives/IconButton.tsx
1012
- import { jsx as jsx15 } from "react/jsx-runtime";
1013
- var intentClasses3 = {
1014
- danger: "polli:bg-intent-danger-bg-light polli:hover:bg-[oklch(0.88_0.075_25)] polli:text-intent-danger-text"
1015
- };
1016
- var defaultClasses = "polli:bg-theme-bg-active polli:hover:bg-theme-bg-hover polli:text-theme-text-soft polli:hover:text-theme-text-strong";
1017
- var IconButton = ({
1018
- intent,
1019
- title,
1020
- onClick,
1021
- children,
1022
- className
1023
- }) => /* @__PURE__ */ jsx15(
1024
- "button",
1025
- {
1026
- type: "button",
1027
- onClick,
1028
- title,
1029
- "aria-label": title,
1030
- className: cn(
1031
- "polli:inline-flex polli:h-6 polli:w-6 polli:cursor-pointer polli:items-center polli:justify-center polli:rounded polli:transition-colors",
1032
- intent ? intentClasses3[intent] : defaultClasses,
1033
- className
1034
- ),
1035
- children
1036
- }
1037
- );
1038
-
1039
- // src/primitives/InfoTip.tsx
1040
- import { jsx as jsx16 } from "react/jsx-runtime";
1041
- var InfoTip = ({
1042
- text,
1043
- content,
1044
- label = "More info"
1045
- }) => /* @__PURE__ */ jsx16(Tooltip, { content: content ?? text, ariaLabel: label, className: "polli:ml-1", children: /* @__PURE__ */ jsx16("span", { className: "polli:inline-flex polli:h-3.5 polli:w-3.5 polli:items-center polli:justify-center polli:rounded-full polli:border polli:border-theme-border polli:bg-theme-bg-active polli:font-bold polli:text-micro polli:text-theme-text-strong polli:transition-colors", children: "i" }) });
1046
-
1047
- // src/primitives/Input.tsx
1048
- import { forwardRef } from "react";
1049
- import { jsx as jsx17 } from "react/jsx-runtime";
1050
- var Input = forwardRef(
1051
- ({ className, error, hideNumberSteppers, ...props }, ref) => /* @__PURE__ */ jsx17(
1052
- "input",
1053
- {
1054
- ref,
1055
- className: cn(
1056
- "polli:px-3 polli:py-2 polli:border polli:rounded-lg",
1057
- "polli:disabled:opacity-50 polli:disabled:cursor-not-allowed",
1058
- error ? "polli:border-red-400" : "polli:border-gray-300",
1059
- hideNumberSteppers && "polli-input-number-clean",
1060
- className
1061
- ),
1062
- ...props
1063
- }
1064
- )
1065
- );
1066
-
1067
- // src/primitives/ScrollArea.tsx
1068
- import {
1069
- forwardRef as forwardRef2,
1070
- useCallback,
1071
- useEffect as useEffect2,
1072
- useRef as useRef3
1073
- } from "react";
1074
- import { jsx as jsx18 } from "react/jsx-runtime";
1075
- var axisClasses = {
1076
- y: "polli:overflow-y-auto polli:overflow-x-hidden",
1077
- x: "polli:overflow-x-auto polli:overflow-y-hidden",
1078
- both: "polli:overflow-auto"
1079
- };
1080
- function assignRef(ref, value) {
1081
- if (typeof ref === "function") ref(value);
1082
- else if (ref) ref.current = value;
1083
- }
1084
- var ScrollArea = forwardRef2(
1085
- ({ theme, axis = "y", hideDelayMs = 2e3, className, children, ...rest }, externalRef) => {
1086
- const innerRef = useRef3(null);
1087
- const setRef = useCallback(
1088
- (node) => {
1089
- innerRef.current = node;
1090
- assignRef(externalRef, node);
1091
- },
1092
- [externalRef]
1093
- );
1094
- useEffect2(() => {
1095
- const element = innerRef.current;
1096
- if (!element) return;
1097
- let hideTimer = null;
1098
- const clearHideTimer = () => {
1099
- if (hideTimer !== null) {
1100
- window.clearTimeout(hideTimer);
1101
- hideTimer = null;
1102
- }
1103
- };
1104
- const show = () => {
1105
- element.dataset.scrollbarActive = "true";
1106
- clearHideTimer();
1107
- };
1108
- const hide = () => {
1109
- element.dataset.scrollbarActive = "false";
1110
- clearHideTimer();
1111
- };
1112
- const scheduleHide = () => {
1113
- clearHideTimer();
1114
- hideTimer = window.setTimeout(hide, hideDelayMs);
1115
- };
1116
- const handleInteraction = () => {
1117
- show();
1118
- scheduleHide();
1119
- };
1120
- hide();
1121
- element.addEventListener("scroll", handleInteraction, {
1122
- passive: true
1123
- });
1124
- element.addEventListener("wheel", handleInteraction, {
1125
- passive: true
1126
- });
1127
- element.addEventListener("touchstart", handleInteraction, {
1128
- passive: true
1129
- });
1130
- element.addEventListener("pointerdown", handleInteraction);
1131
- element.addEventListener("keydown", handleInteraction);
1132
- element.addEventListener("focusin", handleInteraction);
1133
- element.addEventListener("focusout", scheduleHide);
1134
- return () => {
1135
- clearHideTimer();
1136
- element.removeEventListener("scroll", handleInteraction);
1137
- element.removeEventListener("wheel", handleInteraction);
1138
- element.removeEventListener("touchstart", handleInteraction);
1139
- element.removeEventListener("pointerdown", handleInteraction);
1140
- element.removeEventListener("keydown", handleInteraction);
1141
- element.removeEventListener("focusin", handleInteraction);
1142
- element.removeEventListener("focusout", scheduleHide);
1143
- };
1144
- }, [hideDelayMs]);
1145
- return /* @__PURE__ */ jsx18(
1146
- "div",
1147
- {
1148
- ...rest,
1149
- ref: setRef,
1150
- "data-theme": theme,
1151
- className: cn(
1152
- "polli-scrollbar-subtle",
1153
- axisClasses[axis],
1154
- className
1155
- ),
1156
- children
1157
- }
1158
- );
1159
- }
1160
- );
1161
- ScrollArea.displayName = "ScrollArea";
1162
-
1163
- // src/primitives/MultiSelect.tsx
1164
- import { jsx as jsx19, jsxs as jsxs9 } from "react/jsx-runtime";
1165
- var TRIGGER_BASE = "polli:inline-flex polli:min-h-8 polli:min-w-[140px] polli:items-center polli:gap-2 polli:rounded-full polli:border polli:px-3 polli:py-1.5 polli:text-xs polli:font-medium polli:transition-all polli:duration-200";
1166
- var ROW_BASE = "polli:flex polli:w-full polli:items-center polli:gap-3 polli:px-3 polli:py-2 polli:text-left polli:text-xs polli:transition-colors";
1167
- var CHECK_BASE = "polli:flex polli:h-4 polli:w-4 polli:flex-shrink-0 polli:items-center polli:justify-center polli:rounded polli:border polli:border-theme-border polli:text-xs";
1168
- var MultiSelect = ({
1169
- options,
1170
- selected,
1171
- onChange,
1172
- placeholder,
1173
- disabled,
1174
- disabledText,
1175
- align = "start",
1176
- label,
1177
- theme
1178
- }) => {
1179
- const isAllSelected = selected.length === 0;
1180
- const toggleItem = (itemId) => {
1181
- if (selected.includes(itemId)) {
1182
- onChange(selected.filter((m) => m !== itemId));
1183
- } else {
1184
- onChange([...selected, itemId]);
1185
- }
1186
- };
1187
- const selectAll = () => onChange([]);
1188
- const displayText = disabled ? disabledText : isAllSelected ? "All" : `${selected.length} selected`;
1189
- const labelNode = label ? /* @__PURE__ */ jsx19("span", { className: "polli:text-xs polli:font-medium polli:text-theme-text-soft", children: label }) : null;
1190
- if (disabled) {
1191
- return /* @__PURE__ */ jsxs9(
1192
- "div",
1193
- {
1194
- "data-theme": theme,
1195
- className: "polli:group polli:relative polli:flex polli:items-center polli:gap-2",
1196
- children: [
1197
- labelNode,
1198
- /* @__PURE__ */ jsxs9(
1199
- "button",
1200
- {
1201
- type: "button",
1202
- disabled: true,
1203
- className: cn(
1204
- TRIGGER_BASE,
1205
- "polli:cursor-not-allowed polli:border-theme-border polli:bg-theme-bg-subtle polli:opacity-60"
1206
- ),
1207
- children: [
1208
- /* @__PURE__ */ jsx19("span", { className: "polli:flex-1 polli:truncate polli:text-left polli:text-theme-text-soft/60", children: displayText }),
1209
- /* @__PURE__ */ jsx19(
1210
- ChevronIcon,
1211
- {
1212
- expanded: false,
1213
- className: "polli:h-3 polli:w-3 polli:text-theme-text-soft"
1214
- }
1215
- )
1216
- ]
1217
- }
1218
- ),
1219
- /* @__PURE__ */ jsx19("span", { className: "polli:pointer-events-none polli:absolute polli:-top-8 polli:left-1/2 polli:z-[100] polli:-translate-x-1/2 polli:whitespace-nowrap polli:rounded-md polli:border polli:border-theme-border polli:bg-theme-bg-pale polli:px-2 polli:py-1 polli:text-xs polli:text-theme-text-strong polli:opacity-0 polli:shadow-sm polli:transition-opacity polli:group-hover:opacity-100", children: "No items available" })
1220
- ]
1221
- }
1222
- );
1223
- }
1224
- return /* @__PURE__ */ jsxs9(
1225
- "div",
1226
- {
1227
- "data-theme": theme,
1228
- className: "polli:flex polli:items-center polli:gap-2",
1229
- children: [
1230
- labelNode,
1231
- /* @__PURE__ */ jsx19(
1232
- Dropdown,
1233
- {
1234
- theme,
1235
- align,
1236
- className: "polli:min-w-[320px]",
1237
- trigger: (open) => /* @__PURE__ */ jsxs9(
1238
- "button",
1239
- {
1240
- type: "button",
1241
- className: cn(
1242
- TRIGGER_BASE,
1243
- open ? "polli:border-theme-border polli:bg-theme-bg-active" : "polli:border-theme-border polli:bg-theme-bg-subtle polli:hover:bg-theme-bg-pale"
1244
- ),
1245
- children: [
1246
- /* @__PURE__ */ jsx19(
1247
- "span",
1248
- {
1249
- className: cn(
1250
- "polli:flex-1 polli:truncate polli:text-left",
1251
- open ? "polli:text-theme-text-strong" : "polli:text-theme-text-base"
1252
- ),
1253
- children: displayText
1254
- }
1255
- ),
1256
- /* @__PURE__ */ jsx19(
1257
- ChevronIcon,
1258
- {
1259
- expanded: open,
1260
- className: cn(
1261
- "polli:h-3 polli:w-3 polli:transition-transform",
1262
- open ? "polli:text-theme-text-strong" : "polli:text-theme-text-soft"
1263
- )
1264
- }
1265
- )
1266
- ]
1267
- }
1268
- ),
1269
- children: /* @__PURE__ */ jsxs9(ScrollArea, { theme, className: "polli:max-h-64", children: [
1270
- /* @__PURE__ */ jsxs9(
1271
- "button",
1272
- {
1273
- type: "button",
1274
- onClick: selectAll,
1275
- className: cn(
1276
- ROW_BASE,
1277
- isAllSelected ? "polli:bg-theme-bg-active polli:font-medium polli:text-theme-text-strong" : "polli:text-theme-text-base polli:hover:bg-theme-bg-subtle"
1278
- ),
1279
- children: [
1280
- /* @__PURE__ */ jsx19(
1281
- "span",
1282
- {
1283
- className: cn(
1284
- CHECK_BASE,
1285
- isAllSelected && "polli:bg-theme-bg-active polli:text-theme-text-strong"
1286
- ),
1287
- children: isAllSelected && "\u2713"
1288
- }
1289
- ),
1290
- placeholder
1291
- ]
1292
- }
1293
- ),
1294
- options.map((opt) => {
1295
- const isChecked = selected.includes(opt.value);
1296
- return /* @__PURE__ */ jsxs9(
1297
- "button",
1298
- {
1299
- type: "button",
1300
- onClick: () => toggleItem(opt.value),
1301
- className: cn(
1302
- ROW_BASE,
1303
- isChecked ? "polli:bg-theme-bg-active polli:text-theme-text-strong" : "polli:text-theme-text-base polli:hover:bg-theme-bg-subtle"
1304
- ),
1305
- children: [
1306
- /* @__PURE__ */ jsx19(
1307
- "span",
1308
- {
1309
- className: cn(
1310
- CHECK_BASE,
1311
- isChecked && "polli:bg-theme-bg-active polli:text-theme-text-strong"
1312
- ),
1313
- children: isChecked && "\u2713"
1314
- }
1315
- ),
1316
- /* @__PURE__ */ jsx19("span", { className: "polli:whitespace-nowrap", children: opt.label })
1317
- ]
1318
- },
1319
- opt.value
1320
- );
1321
- })
1322
- ] })
1323
- }
1324
- )
1325
- ]
1326
- }
1327
- );
1328
- };
1329
-
1330
- // src/primitives/PeriodPicker.tsx
1331
- import { useEffect as useEffect3, useMemo, useState as useState4 } from "react";
1332
-
1333
- // src/primitives/TabButton.tsx
1334
- import { jsx as jsx20 } from "react/jsx-runtime";
1335
- var sizeClasses2 = {
1336
- medium: "polli:px-4 polli:py-1.5 polli:text-base",
1337
- small: "polli:px-3 polli:py-1.5 polli:text-sm"
1338
- };
1339
- var TabButton = ({
1340
- theme,
1341
- active,
1342
- onClick,
1343
- children,
1344
- size = "medium",
1345
- ariaLabel,
1346
- disabled = false,
1347
- className
1348
- }) => {
1349
- return /* @__PURE__ */ jsx20(
1350
- "button",
1351
- {
1352
- type: "button",
1353
- "data-theme": theme,
1354
- onClick,
1355
- "aria-label": ariaLabel,
1356
- "aria-pressed": active,
1357
- disabled,
1358
- className: cn(
1359
- "polli:inline-flex polli:items-center polli:justify-center polli:rounded-full polli:border polli:font-medium polli:leading-normal polli:transition-all polli:duration-200",
1360
- active ? "polli:bg-theme-bg-active polli:text-theme-text-strong polli:border-theme-border" : "polli:bg-theme-bg-subtle polli:text-theme-text-base polli:border-theme-border polli:hover:bg-theme-bg-active",
1361
- disabled && "polli:cursor-not-allowed polli:opacity-50",
1362
- sizeClasses2[size],
1363
- className
1364
- ),
1365
- children
1366
- }
1367
- );
1368
- };
1369
-
1370
- // src/primitives/PeriodPicker.tsx
1371
- import { Fragment as Fragment2, jsx as jsx21, jsxs as jsxs10 } from "react/jsx-runtime";
1372
- var WEEKDAY_LABELS = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
1373
- var MONTH_LABELS = [
1374
- "Jan",
1375
- "Feb",
1376
- "Mar",
1377
- "Apr",
1378
- "May",
1379
- "Jun",
1380
- "Jul",
1381
- "Aug",
1382
- "Sep",
1383
- "Oct",
1384
- "Nov",
1385
- "Dec"
1386
- ];
1387
- var NAV_BUTTON = "polli:rounded-full polli:px-2 polli:py-1 polli:text-xs polli:font-semibold polli:text-theme-text-base polli:transition-colors polli:hover:bg-theme-bg-subtle";
1388
- function addUtcMonths2(date, months) {
1389
- return new Date(
1390
- Date.UTC(date.getUTCFullYear(), date.getUTCMonth() + months, 1)
1391
- );
1392
- }
1393
- function monthGridDates(viewMonth) {
1394
- const firstDay = new Date(
1395
- Date.UTC(viewMonth.getUTCFullYear(), viewMonth.getUTCMonth(), 1)
1396
- );
1397
- const firstWeekday = firstDay.getUTCDay() || 7;
1398
- const cursor = addUtcDays(firstDay, 1 - firstWeekday);
1399
- return Array.from({ length: 42 }, (_, index) => addUtcDays(cursor, index));
1400
- }
1401
- function sameUtcDay(left, right) {
1402
- return left.getTime() === right.getTime();
1403
- }
1404
- function periodDate(value) {
1405
- return periodToWindow(value).start;
1406
- }
1407
- function viewBounds(viewDate, granularity) {
1408
- if (granularity === "month") {
1409
- const start2 = new Date(Date.UTC(viewDate.getUTCFullYear(), 0, 1));
1410
- return { start: start2, end: addUtcMonths2(start2, 12) };
1411
- }
1412
- const start = new Date(
1413
- Date.UTC(viewDate.getUTCFullYear(), viewDate.getUTCMonth(), 1)
1414
- );
1415
- return { start, end: addUtcMonths2(start, 1) };
1416
- }
1417
- var PeriodPicker = ({
1418
- value,
1419
- onChange,
1420
- theme,
1421
- minDate = /* @__PURE__ */ new Date(0),
1422
- maxDate
1423
- }) => {
1424
- const [open, setOpen] = useState4(false);
1425
- const [viewDate, setViewDate] = useState4(() => periodDate(value));
1426
- const { granularity, period } = value;
1427
- useEffect3(() => {
1428
- setViewDate(periodDate({ granularity, period }));
1429
- }, [granularity, period]);
1430
- const dates = useMemo(() => monthGridDates(viewDate), [viewDate]);
1431
- const selectedWindow = periodToWindow(value);
1432
- const today = startOfUtcDay(maxDate);
1433
- const previousViewDate = value.granularity === "month" ? addUtcMonths2(viewDate, -12) : addUtcMonths2(viewDate, -1);
1434
- const nextViewDate = value.granularity === "month" ? addUtcMonths2(viewDate, 12) : addUtcMonths2(viewDate, 1);
1435
- const previousBounds = viewBounds(previousViewDate, value.granularity);
1436
- const nextBounds = viewBounds(nextViewDate, value.granularity);
1437
- const previousDisabled = previousBounds.end <= minDate;
1438
- const nextDisabled = nextBounds.start > today;
1439
- const setGranularity = (granularity2) => {
1440
- onChange(periodFromDate(granularity2, periodDate(value)));
1441
- };
1442
- const selectDate = (date) => {
1443
- onChange(periodFromDate(value.granularity, date));
1444
- setOpen(false);
1445
- };
1446
- const viewLabel = value.granularity === "month" ? String(viewDate.getUTCFullYear()) : viewDate.toLocaleDateString("en-US", {
1447
- timeZone: "UTC",
1448
- month: "long",
1449
- year: "numeric"
1450
- });
1451
- return /* @__PURE__ */ jsxs10(
1452
- "div",
1453
- {
1454
- "data-theme": theme,
1455
- className: "polli:flex polli:flex-wrap polli:items-center polli:gap-2",
1456
- children: [
1457
- /* @__PURE__ */ jsx21("div", { className: "polli:flex polli:flex-wrap polli:gap-1.5", children: ["day", "week", "month"].map(
1458
- (granularity2) => /* @__PURE__ */ jsx21(
1459
- TabButton,
1460
- {
1461
- active: value.granularity === granularity2,
1462
- onClick: () => setGranularity(granularity2),
1463
- children: granularity2[0].toUpperCase() + granularity2.slice(1)
1464
- },
1465
- granularity2
1466
- )
1467
- ) }),
1468
- /* @__PURE__ */ jsxs10(
1469
- Dropdown,
1470
- {
1471
- theme,
1472
- open,
1473
- onOpenChange: setOpen,
1474
- className: "polli:w-[304px] polli:rounded-xl polli:p-3",
1475
- trigger: (isOpen) => /* @__PURE__ */ jsxs10(
1476
- "button",
1477
- {
1478
- type: "button",
1479
- "aria-label": `Select period, current ${formatPeriodLabel(value)}`,
1480
- className: cn(
1481
- "polli:inline-flex polli:min-w-[150px] polli:items-center polli:justify-between polli:gap-2 polli:rounded-full polli:border polli:px-4 polli:pt-1.5 polli:pb-2 polli:text-left polli:text-base polli:font-medium polli:leading-normal",
1482
- "polli:border-theme-border polli:bg-theme-bg-subtle polli:text-theme-text-base",
1483
- "polli:transition-all polli:duration-200 polli:ease-out polli:hover:bg-theme-bg-pale",
1484
- isOpen && "polli:bg-theme-bg-active polli:text-theme-text-strong polli:shadow-sm"
1485
- ),
1486
- children: [
1487
- /* @__PURE__ */ jsx21("span", { children: formatPeriodLabel(value) }),
1488
- /* @__PURE__ */ jsx21(ChevronIcon, { expanded: isOpen })
1489
- ]
1490
- }
1491
- ),
1492
- children: [
1493
- /* @__PURE__ */ jsxs10("div", { className: "polli:mb-3 polli:flex polli:items-center polli:justify-between", children: [
1494
- /* @__PURE__ */ jsx21(
1495
- "button",
1496
- {
1497
- type: "button",
1498
- "aria-label": value.granularity === "month" ? "Previous year" : "Previous month",
1499
- disabled: previousDisabled,
1500
- onClick: () => setViewDate(previousViewDate),
1501
- className: cn(
1502
- NAV_BUTTON,
1503
- previousDisabled && "polli:cursor-not-allowed polli:opacity-30 polli:hover:bg-transparent"
1504
- ),
1505
- children: "<"
1506
- }
1507
- ),
1508
- /* @__PURE__ */ jsx21("div", { className: "polli:text-sm polli:font-bold polli:text-theme-text-base", children: viewLabel }),
1509
- /* @__PURE__ */ jsx21(
1510
- "button",
1511
- {
1512
- type: "button",
1513
- "aria-label": value.granularity === "month" ? "Next year" : "Next month",
1514
- disabled: nextDisabled,
1515
- onClick: () => setViewDate(nextViewDate),
1516
- className: cn(
1517
- NAV_BUTTON,
1518
- nextDisabled && "polli:cursor-not-allowed polli:opacity-30 polli:hover:bg-transparent"
1519
- ),
1520
- children: ">"
1521
- }
1522
- )
1523
- ] }),
1524
- value.granularity === "month" ? /* @__PURE__ */ jsx21("div", { className: "polli:grid polli:grid-cols-3 polli:gap-1.5", children: MONTH_LABELS.map((label, monthIndex) => {
1525
- const date = new Date(
1526
- Date.UTC(
1527
- viewDate.getUTCFullYear(),
1528
- monthIndex,
1529
- 1
1530
- )
1531
- );
1532
- const selectable = isPeriodSelectable(
1533
- periodFromDate("month", date),
1534
- minDate,
1535
- today
1536
- );
1537
- const ariaLabel = date.toLocaleDateString("en-US", {
1538
- timeZone: "UTC",
1539
- month: "long",
1540
- year: "numeric"
1541
- });
1542
- const selected = date.getUTCFullYear() === selectedWindow.start.getUTCFullYear() && date.getUTCMonth() === selectedWindow.start.getUTCMonth();
1543
- return /* @__PURE__ */ jsx21(
1544
- "button",
1545
- {
1546
- type: "button",
1547
- "aria-label": ariaLabel,
1548
- disabled: !selectable,
1549
- onClick: () => selectDate(date),
1550
- className: cn(
1551
- "polli:rounded-lg polli:px-3 polli:py-2 polli:text-xs polli:font-medium polli:transition-colors polli:duration-150",
1552
- selected ? "polli:bg-theme-bg-active polli:text-theme-text-strong" : "polli:text-gray-700 polli:hover:bg-theme-bg-subtle",
1553
- !selectable && "polli:cursor-not-allowed polli:text-gray-300 polli:hover:bg-transparent"
1554
- ),
1555
- children: label
1556
- },
1557
- label
1558
- );
1559
- }) }) : /* @__PURE__ */ jsxs10(Fragment2, { children: [
1560
- /* @__PURE__ */ jsx21("div", { className: "polli:mb-1 polli:grid polli:grid-cols-7 polli:gap-1 polli:text-center polli:text-micro polli:font-bold polli:uppercase polli:text-gray-400", children: WEEKDAY_LABELS.map((label) => /* @__PURE__ */ jsx21("div", { children: label }, label)) }),
1561
- /* @__PURE__ */ jsx21("div", { className: "polli:grid polli:grid-cols-7 polli:gap-1", children: dates.map((date) => {
1562
- const inCurrentMonth = date.getUTCMonth() === viewDate.getUTCMonth();
1563
- const selectable = isPeriodSelectable(
1564
- periodFromDate(value.granularity, date),
1565
- minDate,
1566
- today
1567
- );
1568
- const ariaLabel = value.granularity === "week" ? `Select week ${formatPeriodLabel(periodFromDate("week", date))}` : `Select ${date.toLocaleDateString(
1569
- "en-US",
1570
- {
1571
- timeZone: "UTC",
1572
- weekday: "long",
1573
- month: "long",
1574
- day: "numeric",
1575
- year: "numeric"
1576
- }
1577
- )}`;
1578
- const selected = value.granularity === "day" ? sameUtcDay(date, selectedWindow.start) : date >= selectedWindow.start && date < selectedWindow.end;
1579
- return /* @__PURE__ */ jsx21(
1580
- "button",
1581
- {
1582
- type: "button",
1583
- "aria-label": ariaLabel,
1584
- disabled: !selectable,
1585
- onClick: () => selectDate(date),
1586
- className: cn(
1587
- "polli:aspect-square polli:rounded-lg polli:text-xs polli:font-medium polli:transition-colors polli:duration-150",
1588
- !inCurrentMonth && "polli:text-gray-300",
1589
- sameUtcDay(date, today) && "polli:ring-1 polli:ring-theme-border",
1590
- selected ? "polli:bg-theme-bg-active polli:text-theme-text-strong" : "polli:text-gray-700 polli:hover:bg-theme-bg-subtle",
1591
- !selectable && "polli:cursor-not-allowed polli:text-gray-300 polli:hover:bg-transparent"
1592
- ),
1593
- children: date.getUTCDate()
1594
- },
1595
- date.toISOString()
1596
- );
1597
- }) })
1598
- ] })
1599
- ]
1600
- }
1601
- )
1602
- ]
1603
- }
1604
- );
1605
- };
1606
-
1607
- // src/primitives/Surface.tsx
1608
- import { jsx as jsx22 } from "react/jsx-runtime";
1609
- var variantClasses = {
1610
- panel: "polli:rounded-2xl polli:border polli:border-theme-border polli:bg-theme-bg-subtle polli:p-6",
1611
- card: "polli:rounded-xl polli:bg-surface-white polli:p-4",
1612
- "card-themed": "polli:rounded-xl polli:bg-theme-bg-pale polli:p-4"
1613
- };
1614
- var Surface = ({
1615
- theme,
1616
- variant = "card",
1617
- className,
1618
- children,
1619
- ...rest
1620
- }) => /* @__PURE__ */ jsx22(
1621
- "div",
1622
- {
1623
- ...rest,
1624
- "data-theme": theme,
1625
- className: cn("polli:min-w-0", variantClasses[variant], className),
1626
- children
1627
- }
1628
- );
1629
-
1630
- // src/primitives/Section.tsx
1631
- import { jsx as jsx23, jsxs as jsxs11 } from "react/jsx-runtime";
1632
- var Section = ({
1633
- title,
1634
- theme,
1635
- id,
1636
- framed = false,
1637
- action,
1638
- actionClassName,
1639
- children,
1640
- className
1641
- }) => /* @__PURE__ */ jsxs11("section", { id, className: cn("scroll-mt-10 space-y-2", className), children: [
1642
- /* @__PURE__ */ jsxs11("div", { className: "flex flex-wrap items-center justify-between gap-3 px-1", children: [
1643
- /* @__PURE__ */ jsx23(
1644
- "h2",
1645
- {
1646
- "data-theme": theme,
1647
- className: "text-left text-lg font-semibold sm:text-xl text-theme-text-strong",
1648
- children: title
1649
- }
1650
- ),
1651
- action && /* @__PURE__ */ jsx23("div", { className: cn("shrink-0", actionClassName), children: action })
1652
- ] }),
1653
- framed ? /* @__PURE__ */ jsx23(Surface, { variant: "panel", theme, children }) : children
1654
- ] });
1655
-
1656
- // src/primitives/Slider.tsx
1657
- import { forwardRef as forwardRef3 } from "react";
1658
- import { jsx as jsx24 } from "react/jsx-runtime";
1659
- var toNumber = (value) => {
1660
- if (typeof value === "number") return value;
1661
- if (typeof value !== "string" || value.trim() === "") return void 0;
1662
- const numericValue = Number(value);
1663
- return Number.isFinite(numericValue) ? numericValue : void 0;
1664
- };
1665
- var clampPercent = (value) => Math.min(100, Math.max(0, value));
1666
- var getProgressPercent = ({
1667
- progress,
1668
- value,
1669
- defaultValue,
1670
- min,
1671
- max
1672
- }) => {
1673
- if (typeof progress === "number" && Number.isFinite(progress)) {
1674
- return clampPercent(progress);
1675
- }
1676
- const numericValue = toNumber(value ?? defaultValue);
1677
- if (numericValue === void 0) return void 0;
1678
- const numericMin = toNumber(min) ?? 0;
1679
- const numericMax = toNumber(max) ?? 100;
1680
- if (numericMax <= numericMin) return 100;
1681
- return clampPercent(
1682
- (numericValue - numericMin) / (numericMax - numericMin) * 100
1683
- );
1684
- };
1685
- var Slider = forwardRef3(
1686
- ({ className, defaultValue, max, min, progress, style, value, ...props }, ref) => {
1687
- const progressPercent = getProgressPercent({
1688
- progress,
1689
- value,
1690
- defaultValue,
1691
- min,
1692
- max
1693
- });
1694
- const sliderStyle = {
1695
- ...style,
1696
- ...progressPercent === void 0 ? null : { "--polli-slider-progress": `${progressPercent}%` }
1697
- };
1698
- return /* @__PURE__ */ jsx24(
1699
- "input",
1700
- {
1701
- ref,
1702
- type: "range",
1703
- min,
1704
- max,
1705
- value,
1706
- defaultValue,
1707
- style: sliderStyle,
1708
- className: cn("polli-slider", className),
1709
- ...props
1710
- }
1711
- );
1712
- }
1713
- );
1714
-
1715
- // src/primitives/StatCard.tsx
1716
- import { jsx as jsx25, jsxs as jsxs12 } from "react/jsx-runtime";
1717
- var StatCard = ({
1718
- label,
1719
- value,
1720
- detail,
1721
- theme,
1722
- className,
1723
- labelClassName,
1724
- valueClassName,
1725
- detailClassName
1726
- }) => /* @__PURE__ */ jsxs12("div", { "data-theme": theme, className: cn("polli:text-sm", className), children: [
1727
- /* @__PURE__ */ jsx25(
1728
- "div",
1729
- {
1730
- className: cn(
1731
- "polli:text-micro polli:font-bold polli:uppercase polli:tracking-wide polli:text-theme-text-strong",
1732
- labelClassName
1733
- ),
1734
- children: label
1735
- }
1736
- ),
1737
- /* @__PURE__ */ jsx25(
1738
- "div",
1739
- {
1740
- className: cn(
1741
- "polli:mt-1 polli:min-h-8 polli:break-words polli:text-2xl polli:font-bold polli:leading-tight polli:tabular-nums polli:text-theme-text-strong",
1742
- valueClassName
1743
- ),
1744
- children: value
1745
- }
1746
- ),
1747
- detail && /* @__PURE__ */ jsx25(
1748
- "div",
1749
- {
1750
- className: cn(
1751
- "polli:mt-2 polli:text-xs polli:text-theme-text-soft",
1752
- detailClassName
1753
- ),
1754
- children: detail
1755
- }
1756
- )
1757
- ] });
1758
-
1759
- // src/primitives/Switch.tsx
1760
- import { jsx as jsx26 } from "react/jsx-runtime";
1761
- var trackClasses = {
1762
- off: "polli:bg-gray-200",
1763
- on: "polli:bg-[oklch(0.88_0.12_158)]",
1764
- invalid: "polli:bg-[oklch(0.88_0.12_25)]"
1765
- };
1766
- var Switch = ({
1767
- checked,
1768
- onChange,
1769
- status,
1770
- ariaLabel,
1771
- disabled = false,
1772
- className
1773
- }) => {
1774
- const effectiveStatus = status ?? (checked ? "on" : "off");
1775
- const resolvedAriaLabel = ariaLabel ?? (checked ? "Turn off toggle" : "Turn on toggle");
1776
- return /* @__PURE__ */ jsx26(
1777
- "button",
1778
- {
1779
- type: "button",
1780
- role: "switch",
1781
- "aria-checked": checked,
1782
- "aria-label": resolvedAriaLabel,
1783
- onClick: () => onChange(!checked),
1784
- disabled,
1785
- className: cn(
1786
- "polli:relative polli:inline-flex polli:h-7 polli:w-12 polli:shrink-0 polli:items-center polli:rounded-full polli:transition polli:disabled:cursor-not-allowed polli:disabled:opacity-60",
1787
- trackClasses[effectiveStatus],
1788
- className
1789
- ),
1790
- children: /* @__PURE__ */ jsx26(
1791
- "span",
1792
- {
1793
- className: cn(
1794
- "polli:inline-block polli:h-5 polli:w-5 polli:rounded-full polli:bg-white polli:shadow-sm polli:transition-transform",
1795
- checked ? "polli:translate-x-6" : "polli:translate-x-1"
1796
- )
1797
- }
1798
- )
1799
- }
1800
- );
1801
- };
1802
-
1803
- // src/theme.ts
1804
- var themes = [
1805
- "amber",
1806
- "blue",
1807
- "pink",
1808
- "teal",
1809
- "violet",
1810
- "green"
1811
- ];
1812
-
1813
- // src/showcase/DesignShowcase.tsx
1814
- import { Fragment as Fragment3, jsx as jsx27, jsxs as jsxs13 } from "react/jsx-runtime";
1815
- var DesignShowcase = ({
1816
- headerSlot,
1817
- hideHeader = false,
1818
- hideThemeTabs = false,
1819
- theme: controlledTheme,
1820
- onThemeChange
1821
- }) => {
1822
- const [internalTheme, setInternalTheme] = useState5("amber");
1823
- const theme = controlledTheme ?? internalTheme;
1824
- const setTheme = onThemeChange ?? setInternalTheme;
1825
- useEffect4(() => {
1826
- document.documentElement.classList.add("polli-ui-root");
1827
- document.documentElement.classList.add("polli-ui-shell");
1828
- document.body.classList.add("polli-ui-shell");
1829
- return () => {
1830
- document.documentElement.classList.remove("polli-ui-root");
1831
- document.documentElement.classList.remove("polli-ui-shell");
1832
- document.body.classList.remove("polli-ui-shell");
1833
- };
1834
- }, []);
1835
- return /* @__PURE__ */ jsxs13(
1836
- ScrollArea,
1837
- {
1838
- theme,
1839
- "data-theme": theme,
1840
- className: `polli:w-full polli:overflow-x-hidden polli:bg-emerald-100 polli:text-theme-text-base ${hideHeader ? "polli:min-h-0 polli:flex-1" : "polli:h-dvh"}`,
1841
- children: [
1842
- hideHeader && (headerSlot || !hideThemeTabs) ? /* @__PURE__ */ jsxs13("div", { className: "polli:mx-auto polli:flex polli:w-full polli:max-w-[1220px] polli:flex-col polli:gap-4 polli:px-5 polli:pt-8", children: [
1843
- headerSlot ? headerSlot : null,
1844
- !hideThemeTabs ? /* @__PURE__ */ jsx27(
1845
- ThemeTabs,
1846
- {
1847
- value: theme,
1848
- options: themes,
1849
- onChange: setTheme
1850
- }
1851
- ) : null
1852
- ] }) : !hideHeader ? /* @__PURE__ */ jsx27(
1853
- Header,
1854
- {
1855
- theme,
1856
- onThemeChange: setTheme,
1857
- headerSlot
1858
- }
1859
- ) : null,
1860
- /* @__PURE__ */ jsx27("div", { className: "polli:mx-auto polli:flex polli:w-full polli:max-w-[1220px] polli:flex-col polli:gap-8 polli:px-5 polli:pt-8 polli:pb-10", children: /* @__PURE__ */ jsxs13("main", { className: "polli:flex polli:min-w-0 polli:flex-col polli:gap-10", children: [
1861
- /* @__PURE__ */ jsx27(CoverageDemo, {}),
1862
- /* @__PURE__ */ jsx27(TypographyDemo, {}),
1863
- /* @__PURE__ */ jsx27(ThemeDemo, { theme, onThemeChange: setTheme }),
1864
- /* @__PURE__ */ jsx27(TokensDemo, {}),
1865
- /* @__PURE__ */ jsx27(IconsDemo, {}),
1866
- /* @__PURE__ */ jsx27(ButtonsDemo, { theme }),
1867
- /* @__PURE__ */ jsx27(InputsDemo, {}),
1868
- /* @__PURE__ */ jsx27(SelectionDemo, { theme }),
1869
- /* @__PURE__ */ jsx27(OverlaysDemo, { theme }),
1870
- /* @__PURE__ */ jsx27(LayoutDemo, { theme }),
1871
- /* @__PURE__ */ jsx27(FeedbackDemo, {}),
1872
- /* @__PURE__ */ jsx27(ModuleRecipesDemo, {})
1873
- ] }) })
1874
- ]
1875
- }
1876
- );
1877
- };
1878
- var Header = ({ theme, onThemeChange, headerSlot }) => /* @__PURE__ */ jsx27("header", { className: "polli:sticky polli:top-0 polli:z-20 polli:border-b polli:border-green-950/10 polli:bg-emerald-100 polli:px-5 polli:py-4 polli:backdrop-blur", children: /* @__PURE__ */ jsxs13("div", { className: "polli:mx-auto polli:flex polli:w-full polli:max-w-[1220px] polli:min-w-0 polli:flex-col polli:items-start polli:gap-4", children: [
1879
- /* @__PURE__ */ jsxs13("div", { className: "polli:flex polli:w-full polli:min-w-0 polli:flex-col polli:gap-3 polli:md:flex-row polli:md:items-start polli:md:justify-between", children: [
1880
- /* @__PURE__ */ jsxs13("div", { className: "polli:min-w-0", children: [
1881
- /* @__PURE__ */ jsx27("h1", { className: "polli:font-serif polli:text-2xl polli:font-black polli:text-theme-text-strong", children: "Design Showcase" }),
1882
- /* @__PURE__ */ jsx27("p", { className: "polli:max-w-3xl polli:text-sm polli:leading-6 polli:text-theme-text-soft", children: "Package primitives, icons, tokens, and SDK-free recipes." })
1883
- ] }),
1884
- headerSlot ? /* @__PURE__ */ jsx27("div", { className: "polli:w-full polli:md:w-auto", children: headerSlot }) : null
1885
- ] }),
1886
- /* @__PURE__ */ jsx27(
1887
- ThemeTabs,
1888
- {
1889
- value: theme,
1890
- options: themes,
1891
- onChange: onThemeChange
1892
- }
1893
- )
1894
- ] }) });
1895
- var ThemeTabs = ({ value, options, onChange }) => /* @__PURE__ */ jsxs13("div", { className: "polli:flex polli:min-w-0 polli:max-w-full polli:flex-col polli:items-start polli:gap-2", children: [
1896
- /* @__PURE__ */ jsx27("span", { className: "polli:text-xs polli:font-semibold polli:uppercase polli:tracking-wide polli:text-theme-text-strong", children: "Theme" }),
1897
- /* @__PURE__ */ jsx27("div", { className: "polli:flex polli:w-full polli:max-w-full polli:flex-wrap polli:gap-1.5", children: options.map((option) => /* @__PURE__ */ jsx27(
1898
- TabButton,
1899
- {
1900
- active: value === option,
1901
- onClick: () => onChange(option),
1902
- theme: option,
1903
- size: "small",
1904
- children: /* @__PURE__ */ jsx27("span", { className: "polli:capitalize", children: option })
1905
- },
1906
- option
1907
- )) })
1908
- ] });
1909
- var ShowcaseSection = ({
1910
- id,
1911
- title,
1912
- caption,
1913
- children
1914
- }) => /* @__PURE__ */ jsxs13(
1915
- "section",
1916
- {
1917
- id,
1918
- className: "polli:flex polli:w-full polli:min-w-0 polli:scroll-mt-24 polli:flex-col polli:gap-3",
1919
- children: [
1920
- /* @__PURE__ */ jsxs13("div", { className: "polli:flex polli:flex-col polli:gap-1", children: [
1921
- /* @__PURE__ */ jsx27("h2", { className: "polli:font-serif polli:text-2xl polli:font-black polli:text-theme-text-strong", children: title }),
1922
- /* @__PURE__ */ jsx27("p", { className: "polli:max-w-3xl polli:break-words polli:text-sm polli:leading-6 polli:text-theme-text-soft polli:[overflow-wrap:anywhere]", children: caption })
1923
- ] }),
1924
- children
1925
- ]
1926
- }
1927
- );
1928
- var Row = ({
1929
- label,
1930
- children
1931
- }) => /* @__PURE__ */ jsxs13(
1932
- Surface,
1933
- {
1934
- variant: "card-themed",
1935
- className: "polli:flex polli:flex-wrap polli:items-center polli:gap-3",
1936
- children: [
1937
- /* @__PURE__ */ jsx27("span", { className: "polli:w-44 polli:shrink-0 polli:text-xs polli:font-semibold polli:uppercase polli:tracking-wide polli:text-theme-text-strong", children: label }),
1938
- /* @__PURE__ */ jsx27("div", { className: "polli:flex polli:min-w-0 polli:flex-1 polli:flex-wrap polli:items-center polli:gap-2", children })
1939
- ]
1940
- }
1941
- );
1942
- var ControlGroup = ({
1943
- label,
1944
- children
1945
- }) => /* @__PURE__ */ jsxs13("div", { className: "polli:flex polli:min-w-0 polli:flex-col polli:gap-1", children: [
1946
- /* @__PURE__ */ jsx27("span", { className: "polli:text-xs polli:font-semibold polli:uppercase polli:tracking-wide polli:text-theme-text-strong", children: label }),
1947
- children
1948
- ] });
1949
- var primitiveNames = [
1950
- "Button",
1951
- "ChevronIcon",
1952
- "Chip",
1953
- "Collapsible",
1954
- "CopyButton",
1955
- "Dialog",
1956
- "DialogTitle",
1957
- "Dropdown",
1958
- "ExternalLinkButton",
1959
- "Field",
1960
- "IconButton",
1961
- "InfoTip",
1962
- "Input",
1963
- "MultiSelect",
1964
- "PeriodPicker",
1965
- "ScrollArea",
1966
- "Section",
1967
- "Slider",
1968
- "StatCard",
1969
- "Surface",
1970
- "Switch",
1971
- "TabButton",
1972
- "Tooltip"
1973
- ];
1974
- var moduleNames = [
1975
- "AuthInfoCard",
1976
- "ErrorBanner",
1977
- "ModalityButton",
1978
- "PaidChip",
1979
- "TierChip",
1980
- "WalletBalanceCard",
1981
- "WalletDot",
1982
- "formatPollen"
1983
- ];
1984
- var CoverageDemo = () => /* @__PURE__ */ jsx27(
1985
- ShowcaseSection,
1986
- {
1987
- id: "coverage",
1988
- title: "Coverage",
1989
- caption: "Every SDK-free primitive exported from the package appears below, plus the icon set and reusable module recipes.",
1990
- children: /* @__PURE__ */ jsxs13(
1991
- Surface,
1992
- {
1993
- variant: "panel",
1994
- className: "polli:grid polli:grid-cols-[repeat(auto-fit,minmax(220px,1fr))] polli:gap-3",
1995
- children: [
1996
- /* @__PURE__ */ jsx27(
1997
- StatCard,
1998
- {
1999
- label: "Primitives",
2000
- value: primitiveNames.length,
2001
- detail: "Buttons, inputs, overlays, layout, and feedback.",
2002
- className: "polli:rounded-xl polli:bg-surface-white polli:p-4"
2003
- }
2004
- ),
2005
- /* @__PURE__ */ jsx27(
2006
- StatCard,
2007
- {
2008
- label: "Icons",
2009
- value: iconItems.length + 1,
2010
- detail: "All exported icons plus the canonical chevron.",
2011
- className: "polli:rounded-xl polli:bg-surface-white polli:p-4"
2012
- }
2013
- ),
2014
- /* @__PURE__ */ jsx27(
2015
- StatCard,
2016
- {
2017
- label: "Recipes",
2018
- value: moduleNames.length,
2019
- detail: "Auth, wallet, and modality pieces without SDK state.",
2020
- className: "polli:rounded-xl polli:bg-surface-white polli:p-4"
2021
- }
2022
- ),
2023
- /* @__PURE__ */ jsx27(Surface, { className: "polli:col-span-full polli:flex polli:flex-wrap polli:gap-2", children: primitiveNames.map((name) => /* @__PURE__ */ jsx27(Chip, { size: "sm", children: name }, name)) })
2024
- ]
2025
- }
2026
- )
2027
- }
2028
- );
2029
- var typographyRows = [
2030
- {
2031
- label: "Heading",
2032
- className: "polli:font-heading polli:text-4xl",
2033
- sample: "Pollinations"
2034
- },
2035
- {
2036
- label: "Subheading",
2037
- className: "polli:font-subheading polli:text-3xl",
2038
- sample: "Reusable UI"
2039
- },
2040
- {
2041
- label: "Body",
2042
- className: "polli:font-body polli:text-base",
2043
- sample: "Clear defaults for product surfaces."
2044
- },
2045
- {
2046
- label: "Pixel",
2047
- className: "polli:font-pixel polli:text-base",
2048
- sample: "API 200 OK"
2049
- },
2050
- {
2051
- label: "Micro",
2052
- className: "polli:font-body polli:text-micro polli:uppercase",
2053
- sample: "Status label"
2054
- }
2055
- ];
2056
- var textRows = [
2057
- ["strong", "polli:text-theme-text-strong"],
2058
- ["base", "polli:text-theme-text-base"],
2059
- ["soft", "polli:text-theme-text-soft"],
2060
- ["muted", "polli:text-theme-text-muted"]
2061
- ];
2062
- var TypographyDemo = () => /* @__PURE__ */ jsx27(
2063
- ShowcaseSection,
2064
- {
2065
- id: "type",
2066
- title: "Typography",
2067
- caption: "Font, size, and semantic text color utilities backed by package tokens.",
2068
- children: /* @__PURE__ */ jsxs13(
2069
- Surface,
2070
- {
2071
- variant: "panel",
2072
- className: "polli:flex polli:flex-col polli:gap-3",
2073
- children: [
2074
- typographyRows.map((row) => /* @__PURE__ */ jsxs13(
2075
- "div",
2076
- {
2077
- className: "polli:flex polli:flex-wrap polli:items-baseline polli:gap-x-4 polli:gap-y-1 polli:border-b polli:border-theme-border polli:pb-3 polli:last:border-b-0 polli:last:pb-0",
2078
- children: [
2079
- /* @__PURE__ */ jsx27(
2080
- "span",
2081
- {
2082
- className: `polli:w-80 polli:shrink-0 polli:text-theme-text-strong ${row.className}`,
2083
- children: row.sample
2084
- }
2085
- ),
2086
- /* @__PURE__ */ jsx27("code", { className: "polli:w-36 polli:shrink-0 polli:font-mono polli:text-xs polli:text-theme-text-strong", children: row.label }),
2087
- /* @__PURE__ */ jsx27("span", { className: "polli:min-w-0 polli:flex-1 polli:text-xs polli:text-theme-text-soft", children: row.className.replaceAll("polli:", "") })
2088
- ]
2089
- },
2090
- row.label
2091
- )),
2092
- /* @__PURE__ */ jsx27("div", { className: "polli:flex polli:flex-wrap polli:gap-2 polli:pt-1", children: textRows.map(([label, className]) => /* @__PURE__ */ jsxs13(
2093
- "span",
2094
- {
2095
- className: `polli:rounded-lg polli:bg-theme-bg-pale polli:px-3 polli:py-1 polli:text-sm ${className}`,
2096
- children: [
2097
- "text-",
2098
- label
2099
- ]
2100
- },
2101
- label
2102
- )) })
2103
- ]
2104
- }
2105
- )
2106
- }
2107
- );
2108
- var ThemeDemo = ({ theme, onThemeChange }) => /* @__PURE__ */ jsx27(
2109
- ShowcaseSection,
2110
- {
2111
- id: "themes",
2112
- title: "Themes",
2113
- caption: "The theme cascade is driven by data-theme on any ancestor or by component theme props.",
2114
- children: /* @__PURE__ */ jsx27(
2115
- Surface,
2116
- {
2117
- variant: "panel",
2118
- className: "polli:grid polli:grid-cols-[repeat(auto-fit,minmax(150px,1fr))] polli:gap-3",
2119
- children: themes.map((item) => /* @__PURE__ */ jsxs13(
2120
- "button",
2121
- {
2122
- type: "button",
2123
- "data-theme": item,
2124
- "aria-pressed": theme === item,
2125
- onClick: () => onThemeChange(item),
2126
- className: "polli:flex polli:min-w-0 polli:flex-col polli:gap-2 polli:rounded-xl polli:border polli:border-theme-border polli:bg-theme-bg-subtle polli:p-3 polli:text-left polli:transition-colors polli:hover:bg-theme-bg-pale",
2127
- children: [
2128
- /* @__PURE__ */ jsx27("span", { className: "polli:text-sm polli:font-bold polli:capitalize polli:text-theme-text-strong", children: item }),
2129
- /* @__PURE__ */ jsxs13("span", { className: "polli:flex polli:h-8 polli:overflow-hidden polli:rounded-lg", children: [
2130
- /* @__PURE__ */ jsx27("span", { className: "polli:flex-1 polli:bg-theme-bg-subtle" }),
2131
- /* @__PURE__ */ jsx27("span", { className: "polli:flex-1 polli:bg-theme-bg-active" }),
2132
- /* @__PURE__ */ jsx27("span", { className: "polli:flex-1 polli:bg-theme-bg-hover" }),
2133
- /* @__PURE__ */ jsx27("span", { className: "polli:flex-1 polli:bg-theme-bg-pale" })
2134
- ] }),
2135
- /* @__PURE__ */ jsx27("span", { className: "polli:text-xs polli:text-theme-text-soft", children: theme === item ? "Selected" : "Preview" })
2136
- ]
2137
- },
2138
- item
2139
- ))
2140
- }
2141
- )
2142
- }
2143
- );
2144
- var tokenRows = [
2145
- ["text-base", "var(--polli-color-text-base)", "polli:bg-theme-text-base"],
2146
- [
2147
- "text-strong",
2148
- "var(--polli-color-text-strong)",
2149
- "polli:bg-theme-text-strong"
2150
- ],
2151
- ["text-soft", "var(--polli-color-text-soft)", "polli:bg-theme-text-soft"],
2152
- [
2153
- "text-muted",
2154
- "var(--polli-color-text-muted)",
2155
- "polli:bg-theme-text-muted"
2156
- ],
2157
- ["border", "var(--polli-color-border)", "polli:bg-theme-border"],
2158
- ["bg-subtle", "var(--polli-color-bg-subtle)", "polli:bg-theme-bg-subtle"],
2159
- ["bg-active", "var(--polli-color-bg-active)", "polli:bg-theme-bg-active"],
2160
- ["bg-hover", "var(--polli-color-bg-hover)", "polli:bg-theme-bg-hover"],
2161
- ["bg-pale", "var(--polli-color-bg-pale)", "polli:bg-theme-bg-pale"]
2162
- ];
2163
- var TokensDemo = () => /* @__PURE__ */ jsx27(
2164
- ShowcaseSection,
2165
- {
2166
- id: "tokens",
2167
- title: "Tokens",
2168
- caption: "Public CSS variables and utility bridges used by the primitives.",
2169
- children: /* @__PURE__ */ jsx27(
2170
- Surface,
2171
- {
2172
- variant: "panel",
2173
- className: "polli:grid polli:grid-cols-[repeat(auto-fit,minmax(230px,1fr))] polli:gap-3",
2174
- children: tokenRows.map(([name, variable, swatchClass]) => /* @__PURE__ */ jsxs13(
2175
- Surface,
2176
- {
2177
- className: "polli:flex polli:items-center polli:gap-3",
2178
- children: [
2179
- /* @__PURE__ */ jsx27(
2180
- "span",
2181
- {
2182
- className: `polli:h-10 polli:w-10 polli:shrink-0 polli:rounded-lg polli:border polli:border-theme-border ${swatchClass}`
2183
- }
2184
- ),
2185
- /* @__PURE__ */ jsxs13("span", { className: "polli:min-w-0", children: [
2186
- /* @__PURE__ */ jsx27("span", { className: "polli:block polli:text-sm polli:font-bold polli:text-theme-text-strong", children: name }),
2187
- /* @__PURE__ */ jsx27("code", { className: "polli:block polli:truncate polli:text-xs polli:text-theme-text-soft", children: variable })
2188
- ] })
2189
- ]
2190
- },
2191
- name
2192
- ))
2193
- }
2194
- )
2195
- }
2196
- );
2197
- var iconItems = [
2198
- { name: "AppIcon", Icon: AppIcon },
2199
- { name: "BeakerIcon", Icon: BeakerIcon },
2200
- { name: "BookIcon", Icon: BookIcon },
2201
- { name: "CheckIcon", Icon: CheckIcon },
2202
- { name: "ClipboardIcon", Icon: ClipboardIcon },
2203
- { name: "ClockIcon", Icon: ClockIcon },
2204
- { name: "DiscordIcon", Icon: DiscordIcon },
2205
- { name: "DownloadIcon", Icon: DownloadIcon },
2206
- { name: "ExternalLinkIcon", Icon: ExternalLinkIcon },
2207
- { name: "GenApiIcon", Icon: GenApiIcon },
2208
- { name: "GitHubIcon", Icon: GitHubIcon },
2209
- { name: "ImageIcon", Icon: ImageIcon },
2210
- { name: "LockIcon", Icon: LockIcon },
2211
- { name: "MailIcon", Icon: MailIcon },
2212
- { name: "McpIcon", Icon: McpIcon },
2213
- { name: "MenuIcon", Icon: MenuIcon },
2214
- { name: "TerminalIcon", Icon: TerminalIcon },
2215
- { name: "TokensIcon", Icon: TokensIcon },
2216
- { name: "TrendUpIcon", Icon: TrendUpIcon },
2217
- { name: "WalletIcon", Icon: WalletIcon },
2218
- { name: "XIcon", Icon: XIcon }
2219
- ];
2220
- var IconsDemo = () => /* @__PURE__ */ jsx27(
2221
- ShowcaseSection,
2222
- {
2223
- id: "icons",
2224
- title: "Icons",
2225
- caption: "Every exported SVG icon appears here with the same currentColor contract used by buttons and links.",
2226
- children: /* @__PURE__ */ jsxs13(
2227
- Surface,
2228
- {
2229
- variant: "panel",
2230
- className: "polli:grid polli:gap-3",
2231
- style: {
2232
- gridTemplateColumns: "repeat(auto-fit, minmax(250px, 1fr))"
2233
- },
2234
- children: [
2235
- iconItems.map(({ name, Icon }) => /* @__PURE__ */ jsxs13(
2236
- Surface,
2237
- {
2238
- className: "polli:flex polli:items-center polli:gap-3",
2239
- children: [
2240
- /* @__PURE__ */ jsx27("span", { className: "polli:flex polli:h-10 polli:w-10 polli:shrink-0 polli:items-center polli:justify-center polli:rounded-lg polli:bg-theme-bg-pale polli:text-theme-text-strong", children: /* @__PURE__ */ jsx27(Icon, { className: "polli:h-5 polli:w-5" }) }),
2241
- /* @__PURE__ */ jsx27("code", { className: "polli:min-w-0 polli:whitespace-nowrap polli:text-xs polli:text-theme-text-strong", children: name })
2242
- ]
2243
- },
2244
- name
2245
- )),
2246
- /* @__PURE__ */ jsxs13(Surface, { className: "polli:flex polli:items-center polli:gap-3", children: [
2247
- /* @__PURE__ */ jsx27("span", { className: "polli:flex polli:h-10 polli:w-10 polli:shrink-0 polli:items-center polli:justify-center polli:rounded-lg polli:bg-theme-bg-pale polli:text-theme-text-strong", children: /* @__PURE__ */ jsx27(ChevronIcon, { className: "polli:h-4 polli:w-4" }) }),
2248
- /* @__PURE__ */ jsxs13("span", { className: "polli:min-w-0", children: [
2249
- /* @__PURE__ */ jsx27("code", { className: "polli:block polli:whitespace-nowrap polli:text-xs polli:text-theme-text-strong", children: "ChevronIcon" }),
2250
- /* @__PURE__ */ jsxs13("span", { className: "polli:mt-1 polli:flex polli:gap-2 polli:text-theme-text-soft", children: [
2251
- /* @__PURE__ */ jsx27(ChevronIcon, {}),
2252
- /* @__PURE__ */ jsx27(ChevronIcon, { expanded: true })
2253
- ] })
2254
- ] })
2255
- ] })
2256
- ]
2257
- }
2258
- )
2259
- }
2260
- );
2261
- var ButtonsDemo = ({ theme }) => /* @__PURE__ */ jsx27(
2262
- ShowcaseSection,
2263
- {
2264
- id: "buttons",
2265
- title: "Buttons",
2266
- caption: "Button, link, icon, copy, chip, and tab affordances in their supported states.",
2267
- children: /* @__PURE__ */ jsxs13("div", { className: "polli:flex polli:flex-col polli:gap-3", children: [
2268
- /* @__PURE__ */ jsxs13(Row, { label: "Button", children: [
2269
- /* @__PURE__ */ jsx27(Button, { children: "Default" }),
2270
- /* @__PURE__ */ jsx27(Button, { size: "small", children: "Small" }),
2271
- /* @__PURE__ */ jsx27(Button, { size: "large", children: "Large" }),
2272
- /* @__PURE__ */ jsx27(Button, { theme: "blue", children: "Theme prop" }),
2273
- /* @__PURE__ */ jsx27(Button, { disabled: true, children: "Disabled" }),
2274
- /* @__PURE__ */ jsx27(Button, { intent: "danger", children: "Delete" })
2275
- ] }),
2276
- /* @__PURE__ */ jsxs13(Row, { label: "External link", children: [
2277
- /* @__PURE__ */ jsx27(
2278
- ExternalLinkButton,
2279
- {
2280
- theme,
2281
- href: "https://pollinations.ai",
2282
- children: "Pollinations"
2283
- }
2284
- ),
2285
- /* @__PURE__ */ jsx27(
2286
- ExternalLinkButton,
2287
- {
2288
- theme,
2289
- href: "https://pollinations.ai",
2290
- size: "small",
2291
- children: "Small link"
2292
- }
2293
- )
2294
- ] }),
2295
- /* @__PURE__ */ jsxs13(Row, { label: "Icon button", children: [
2296
- /* @__PURE__ */ jsx27(IconButton, { title: "Copy", onClick: noop, children: /* @__PURE__ */ jsx27(ClipboardIcon, { className: "polli:h-3.5 polli:w-3.5" }) }),
2297
- /* @__PURE__ */ jsx27(IconButton, { title: "Open", onClick: noop, children: /* @__PURE__ */ jsx27(ExternalLinkIcon, { className: "polli:h-3.5 polli:w-3.5" }) }),
2298
- /* @__PURE__ */ jsx27(IconButton, { title: "Delete", intent: "danger", onClick: noop, children: /* @__PURE__ */ jsx27(XIcon, { className: "polli:h-3.5 polli:w-3.5" }) })
2299
- ] }),
2300
- /* @__PURE__ */ jsx27(Row, { label: "Copy button", children: /* @__PURE__ */ jsx27(
2301
- CopyButton,
2302
- {
2303
- value: "pk_showcase_123",
2304
- className: (copied) => `polli:inline-flex polli:h-8 polli:items-center polli:gap-2 polli:rounded-full polli:px-3 polli:text-sm polli:font-medium polli:transition-colors ${copied ? "polli:bg-green-100 polli:text-green-800" : "polli:bg-theme-bg-active polli:text-theme-text-strong"}`,
2305
- children: (copied) => /* @__PURE__ */ jsxs13(Fragment3, { children: [
2306
- copied ? /* @__PURE__ */ jsx27(CheckIcon, { className: "polli:h-4 polli:w-4" }) : /* @__PURE__ */ jsx27(ClipboardIcon, { className: "polli:h-4 polli:w-4" }),
2307
- copied ? "Copied" : "Copy key"
2308
- ] })
2309
- }
2310
- ) }),
2311
- /* @__PURE__ */ jsxs13(Row, { label: "Tab button", children: [
2312
- /* @__PURE__ */ jsx27(TabButton, { active: true, onClick: noop, children: "Active" }),
2313
- /* @__PURE__ */ jsx27(TabButton, { active: false, onClick: noop, children: "Inactive" }),
2314
- /* @__PURE__ */ jsx27(TabButton, { active: false, disabled: true, onClick: noop, children: "Disabled" })
2315
- ] }),
2316
- /* @__PURE__ */ jsxs13(Row, { label: "Chip", children: [
2317
- /* @__PURE__ */ jsx27(Chip, { children: "Default" }),
2318
- /* @__PURE__ */ jsx27(Chip, { size: "sm", children: "Small" }),
2319
- /* @__PURE__ */ jsx27(Chip, { size: "lg", children: "Large" }),
2320
- /* @__PURE__ */ jsx27(Chip, { intent: "news", children: "NEW" }),
2321
- /* @__PURE__ */ jsx27(Chip, { intent: "alpha", children: "ALPHA" }),
2322
- /* @__PURE__ */ jsx27(Chip, { intent: "neutral", children: "Neutral" }),
2323
- themes.map((theme2) => /* @__PURE__ */ jsx27(Chip, { theme: theme2, children: theme2 }, theme2))
2324
- ] })
2325
- ] })
2326
- }
2327
- );
2328
- var InputsDemo = () => {
2329
- const [sliderValue, setSliderValue] = useState5(35);
2330
- const [switches, setSwitches] = useState5({
2331
- off: false,
2332
- on: true,
2333
- invalid: true
2334
- });
2335
- return /* @__PURE__ */ jsx27(
2336
- ShowcaseSection,
2337
- {
2338
- id: "inputs",
2339
- title: "Inputs",
2340
- caption: "Text, number, field composition, range, and binary toggle primitives.",
2341
- children: /* @__PURE__ */ jsxs13(
2342
- Surface,
2343
- {
2344
- variant: "panel",
2345
- className: "polli:grid polli:grid-cols-[repeat(auto-fit,minmax(220px,1fr))] polli:gap-4",
2346
- children: [
2347
- /* @__PURE__ */ jsx27(ControlGroup, { label: "Input", children: /* @__PURE__ */ jsx27(Input, { placeholder: "Name" }) }),
2348
- /* @__PURE__ */ jsx27(ControlGroup, { label: "Number", children: /* @__PURE__ */ jsx27(Input, { type: "number", placeholder: "100", hideNumberSteppers: true }) }),
2349
- /* @__PURE__ */ jsx27(ControlGroup, { label: "Error", children: /* @__PURE__ */ jsx27(Input, { placeholder: "Invalid", error: true }) }),
2350
- /* @__PURE__ */ jsx27(ControlGroup, { label: "Disabled", children: /* @__PURE__ */ jsx27(Input, { placeholder: "Disabled", disabled: true }) }),
2351
- /* @__PURE__ */ jsx27("div", { className: "polli:col-span-full", children: /* @__PURE__ */ jsxs13(
2352
- Field.Root,
2353
- {
2354
- invalid: true,
2355
- className: "polli:flex polli:max-w-xl polli:flex-col polli:gap-1",
2356
- children: [
2357
- /* @__PURE__ */ jsxs13(Field.Label, { className: "polli:text-xs polli:font-semibold polli:uppercase polli:tracking-wide polli:text-theme-text-strong", children: [
2358
- "Field",
2359
- /* @__PURE__ */ jsx27(Field.RequiredIndicator, { className: "polli:ml-1 polli:text-intent-danger-text" })
2360
- ] }),
2361
- /* @__PURE__ */ jsx27(
2362
- Field.Input,
2363
- {
2364
- placeholder: "email@example.com",
2365
- className: "polli:rounded-lg polli:border polli:border-intent-danger-border polli:bg-white polli:px-3 polli:py-2 polli:text-sm"
2366
- }
2367
- ),
2368
- /* @__PURE__ */ jsx27(Field.HelperText, { className: "polli:text-xs polli:text-theme-text-soft", children: "Exported Ark field namespace with package styling." }),
2369
- /* @__PURE__ */ jsx27(Field.ErrorText, { className: "polli:text-xs polli:font-medium polli:text-intent-danger-text", children: "Enter a valid email address." })
2370
- ]
2371
- }
2372
- ) }),
2373
- /* @__PURE__ */ jsx27("div", { className: "polli:col-span-full", children: /* @__PURE__ */ jsx27(ControlGroup, { label: `Slider ${sliderValue}`, children: /* @__PURE__ */ jsx27(
2374
- Slider,
2375
- {
2376
- min: 0,
2377
- max: 100,
2378
- value: sliderValue,
2379
- "aria-label": "Slider",
2380
- onChange: (event) => setSliderValue(
2381
- Number(event.currentTarget.value)
2382
- )
2383
- }
2384
- ) }) }),
2385
- /* @__PURE__ */ jsxs13("div", { className: "polli:col-span-full polli:flex polli:flex-wrap polli:gap-5", children: [
2386
- switchStatuses.map((status) => /* @__PURE__ */ jsxs13(
2387
- "div",
2388
- {
2389
- className: "polli:flex polli:flex-col polli:gap-1",
2390
- children: [
2391
- /* @__PURE__ */ jsx27("span", { className: "polli:text-xs polli:font-semibold polli:uppercase polli:tracking-wide polli:text-theme-text-strong", children: status }),
2392
- /* @__PURE__ */ jsx27(
2393
- Switch,
2394
- {
2395
- checked: switches[status],
2396
- status,
2397
- ariaLabel: `${status} switch`,
2398
- onChange: (checked) => setSwitches((current) => ({
2399
- ...current,
2400
- [status]: checked
2401
- }))
2402
- }
2403
- )
2404
- ]
2405
- },
2406
- status
2407
- )),
2408
- /* @__PURE__ */ jsxs13("div", { className: "polli:flex polli:flex-col polli:gap-1", children: [
2409
- /* @__PURE__ */ jsx27("span", { className: "polli:text-xs polli:font-semibold polli:uppercase polli:tracking-wide polli:text-theme-text-strong", children: "disabled" }),
2410
- /* @__PURE__ */ jsx27(
2411
- Switch,
2412
- {
2413
- checked: true,
2414
- disabled: true,
2415
- status: "on",
2416
- ariaLabel: "Disabled switch",
2417
- onChange: noopSwitch
2418
- }
2419
- )
2420
- ] })
2421
- ] })
2422
- ]
2423
- }
2424
- )
2425
- }
2426
- );
2427
- };
2428
- var switchStatuses = ["off", "on", "invalid"];
2429
- var selectionOptions = [
2430
- { value: "images", label: "Images" },
2431
- { value: "text", label: "Text" },
2432
- { value: "audio", label: "Audio" },
2433
- { value: "video", label: "Video" },
2434
- { value: "embeddings", label: "Embeddings" },
2435
- { value: "tools", label: "Tools" },
2436
- { value: "agents", label: "Agents" },
2437
- { value: "apps", label: "Apps" }
2438
- ];
2439
- var tabOptions = ["Request", "Pollen", "Usage"];
2440
- var SelectionDemo = ({ theme }) => {
2441
- const [activeTab, setActiveTab] = useState5("Request");
2442
- const [selected, setSelected] = useState5(["images", "text"]);
2443
- const [period, setPeriod] = useState5(
2444
- () => currentPeriod()
2445
- );
2446
- return /* @__PURE__ */ jsx27(
2447
- ShowcaseSection,
2448
- {
2449
- id: "selection",
2450
- title: "Selection",
2451
- caption: "Mutually exclusive tabs, multiple selection, dropdowns, and period selection.",
2452
- children: /* @__PURE__ */ jsxs13(
2453
- Surface,
2454
- {
2455
- variant: "panel",
2456
- className: "polli:flex polli:flex-col polli:gap-4",
2457
- children: [
2458
- /* @__PURE__ */ jsx27(ControlGroup, { label: "TabButton", children: /* @__PURE__ */ jsx27("div", { className: "polli:flex polli:flex-wrap polli:gap-1.5", children: tabOptions.map((option) => /* @__PURE__ */ jsx27(
2459
- TabButton,
2460
- {
2461
- active: activeTab === option,
2462
- onClick: () => setActiveTab(option),
2463
- children: option
2464
- },
2465
- option
2466
- )) }) }),
2467
- /* @__PURE__ */ jsx27(ControlGroup, { label: "Dropdown", children: /* @__PURE__ */ jsx27(
2468
- Dropdown,
2469
- {
2470
- theme,
2471
- align: "start",
2472
- className: "polli:w-56 polli:p-2",
2473
- trigger: (open) => /* @__PURE__ */ jsxs13(
2474
- "button",
2475
- {
2476
- type: "button",
2477
- className: "polli:inline-flex polli:min-h-8 polli:items-center polli:gap-2 polli:rounded-full polli:border polli:border-theme-border polli:bg-theme-bg-subtle polli:px-3 polli:text-sm polli:font-medium polli:text-theme-text-base polli:hover:bg-theme-bg-pale",
2478
- children: [
2479
- "Menu",
2480
- /* @__PURE__ */ jsx27(ChevronIcon, { expanded: open })
2481
- ]
2482
- }
2483
- ),
2484
- children: (close) => /* @__PURE__ */ jsx27("div", { className: "polli:flex polli:flex-col", children: ["Account", "Usage", "Settings"].map(
2485
- (item) => /* @__PURE__ */ jsx27(
2486
- "button",
2487
- {
2488
- type: "button",
2489
- onClick: close,
2490
- className: "polli:rounded-md polli:px-3 polli:py-2 polli:text-left polli:text-sm polli:text-theme-text-base polli:hover:bg-theme-bg-subtle",
2491
- children: item
2492
- },
2493
- item
2494
- )
2495
- ) })
2496
- }
2497
- ) }),
2498
- /* @__PURE__ */ jsx27(ControlGroup, { label: "MultiSelect", children: /* @__PURE__ */ jsxs13("div", { className: "polli:flex polli:flex-wrap polli:gap-3", children: [
2499
- /* @__PURE__ */ jsx27(
2500
- MultiSelect,
2501
- {
2502
- options: [...selectionOptions],
2503
- selected,
2504
- onChange: setSelected,
2505
- placeholder: "All",
2506
- align: "start",
2507
- label: "Types",
2508
- theme
2509
- }
2510
- ),
2511
- /* @__PURE__ */ jsx27(
2512
- MultiSelect,
2513
- {
2514
- options: [],
2515
- selected: [],
2516
- onChange: noopSelected,
2517
- placeholder: "All",
2518
- disabled: true,
2519
- disabledText: "Unavailable",
2520
- label: "Disabled",
2521
- theme
2522
- }
2523
- )
2524
- ] }) }),
2525
- /* @__PURE__ */ jsx27(ControlGroup, { label: "PeriodPicker", children: /* @__PURE__ */ jsx27(
2526
- PeriodPicker,
2527
- {
2528
- value: period,
2529
- onChange: setPeriod,
2530
- theme
2531
- }
2532
- ) })
2533
- ]
2534
- }
2535
- )
2536
- }
2537
- );
2538
- };
2539
- var OverlaysDemo = ({ theme }) => {
2540
- const [dialogOpen, setDialogOpen] = useState5(false);
2541
- const [firstOpen, setFirstOpen] = useState5(false);
2542
- const [secondOpen, setSecondOpen] = useState5(true);
2543
- return /* @__PURE__ */ jsx27(
2544
- ShowcaseSection,
2545
- {
2546
- id: "overlays",
2547
- title: "Overlays and Disclosure",
2548
- caption: "Dialog, DialogTitle, Dropdown, Collapsible, and ScrollArea share the package interaction language.",
2549
- children: /* @__PURE__ */ jsxs13(
2550
- Surface,
2551
- {
2552
- variant: "panel",
2553
- className: "polli:flex polli:flex-col polli:gap-4",
2554
- children: [
2555
- /* @__PURE__ */ jsxs13(Row, { label: "Dialog", children: [
2556
- /* @__PURE__ */ jsx27(Button, { onClick: () => setDialogOpen(true), children: "Open dialog" }),
2557
- /* @__PURE__ */ jsx27(
2558
- Dialog,
2559
- {
2560
- open: dialogOpen,
2561
- onOpenChange: setDialogOpen,
2562
- labelledBy: "showcase-dialog-title",
2563
- theme,
2564
- size: "sm",
2565
- children: /* @__PURE__ */ jsxs13("div", { className: "polli:p-6", children: [
2566
- /* @__PURE__ */ jsx27(
2567
- DialogTitle,
2568
- {
2569
- id: "showcase-dialog-title",
2570
- className: "polli:font-subheading polli:text-xl polli:text-theme-text-strong",
2571
- children: "DialogTitle export"
2572
- }
2573
- ),
2574
- /* @__PURE__ */ jsx27("p", { className: "polli:mt-2 polli:text-sm polli:text-theme-text-base", children: "The dialog is controlled by the host and uses the same themed surface tokens." }),
2575
- /* @__PURE__ */ jsx27("div", { className: "polli:mt-5 polli:flex polli:justify-end polli:gap-2", children: /* @__PURE__ */ jsx27(
2576
- Button,
2577
- {
2578
- size: "small",
2579
- onClick: () => setDialogOpen(false),
2580
- children: "Close"
2581
- }
2582
- ) })
2583
- ] })
2584
- }
2585
- )
2586
- ] }),
2587
- /* @__PURE__ */ jsxs13(Surface, { className: "polli:grid polli:grid-cols-[repeat(auto-fit,minmax(260px,1fr))] polli:gap-3", children: [
2588
- /* @__PURE__ */ jsx27(
2589
- Collapsible,
2590
- {
2591
- expanded: firstOpen,
2592
- onToggle: () => setFirstOpen((open) => !open),
2593
- wrapperClassName: "polli:border-theme-border polli:bg-theme-bg-pale",
2594
- label: /* @__PURE__ */ jsx27("span", { className: "polli:text-sm polli:font-medium polli:text-theme-text-strong", children: "Advanced settings" }),
2595
- children: /* @__PURE__ */ jsx27("p", { className: "polli:text-sm polli:text-theme-text-base", children: "Body content is fully controlled by the caller." })
2596
- }
2597
- ),
2598
- /* @__PURE__ */ jsx27(
2599
- Collapsible,
2600
- {
2601
- expanded: secondOpen,
2602
- onToggle: () => setSecondOpen((open) => !open),
2603
- wrapperClassName: "polli:border-theme-border polli:bg-theme-bg-pale",
2604
- label: /* @__PURE__ */ jsx27("span", { className: "polli:text-sm polli:font-medium polli:text-theme-text-strong", children: "Nested details" }),
2605
- children: /* @__PURE__ */ jsxs13("div", { className: "polli:flex polli:flex-col polli:gap-2", children: [
2606
- /* @__PURE__ */ jsx27("p", { className: "polli:text-sm polli:text-theme-text-base", children: "The same primitive works inside compact panels." }),
2607
- /* @__PURE__ */ jsx27(Button, { size: "small", children: "Nested action" })
2608
- ] })
2609
- }
2610
- ),
2611
- /* @__PURE__ */ jsx27(
2612
- Collapsible,
2613
- {
2614
- expanded: false,
2615
- onToggle: noop,
2616
- disabled: true,
2617
- wrapperClassName: "polli:border-theme-border polli:bg-theme-bg-pale",
2618
- label: /* @__PURE__ */ jsx27("span", { className: "polli:text-sm polli:font-medium polli:text-theme-text-strong", children: "Disabled row" }),
2619
- children: "Disabled content"
2620
- }
2621
- )
2622
- ] })
2623
- ]
2624
- }
2625
- )
2626
- }
2627
- );
2628
- };
2629
- var LayoutDemo = ({ theme }) => /* @__PURE__ */ jsx27(
2630
- ShowcaseSection,
2631
- {
2632
- id: "layout",
2633
- title: "Layout",
2634
- caption: "Surface, Section, StatCard, and ScrollArea primitives for dense product screens.",
2635
- children: /* @__PURE__ */ jsxs13(
2636
- Surface,
2637
- {
2638
- variant: "panel",
2639
- className: "polli:flex polli:flex-col polli:gap-4",
2640
- children: [
2641
- /* @__PURE__ */ jsxs13("div", { className: "polli:grid polli:grid-cols-[repeat(auto-fit,minmax(210px,1fr))] polli:gap-3", children: [
2642
- /* @__PURE__ */ jsxs13(Surface, { children: [
2643
- /* @__PURE__ */ jsx27("h3", { className: "polli:font-subheading polli:text-xl polli:text-theme-text-strong", children: "Surface card" }),
2644
- /* @__PURE__ */ jsx27("p", { className: "polli:mt-1 polli:text-sm polli:text-theme-text-soft", children: "Neutral inner surface for dense content." })
2645
- ] }),
2646
- /* @__PURE__ */ jsxs13(Surface, { variant: "card-themed", children: [
2647
- /* @__PURE__ */ jsx27("h3", { className: "polli:font-subheading polli:text-xl polli:text-theme-text-strong", children: "Surface themed" }),
2648
- /* @__PURE__ */ jsx27("p", { className: "polli:mt-1 polli:text-sm polli:text-theme-text-soft", children: "Themed wash for highlights and grouped state." })
2649
- ] }),
2650
- /* @__PURE__ */ jsx27(
2651
- StatCard,
2652
- {
2653
- label: "StatCard",
2654
- value: formatPollen(1234.5678),
2655
- detail: "Tabular value with optional detail.",
2656
- className: "polli:rounded-xl polli:bg-surface-white polli:p-4"
2657
- }
2658
- )
2659
- ] }),
2660
- /* @__PURE__ */ jsx27(
2661
- Section,
2662
- {
2663
- title: "Primitive section",
2664
- theme,
2665
- framed: true,
2666
- action: /* @__PURE__ */ jsx27(Button, { size: "small", children: "Action" }),
2667
- children: /* @__PURE__ */ jsx27("p", { className: "polli:text-sm polli:text-theme-text-soft", children: "Section owns heading layout and optional framing. The app owns the content inside it." })
2668
- }
2669
- ),
2670
- /* @__PURE__ */ jsxs13("div", { className: "polli:grid polli:grid-cols-[repeat(auto-fit,minmax(260px,1fr))] polli:gap-4", children: [
2671
- /* @__PURE__ */ jsxs13(Surface, { children: [
2672
- /* @__PURE__ */ jsx27("p", { className: "polli:mb-2 polli:font-mono polli:text-xs polli:uppercase polli:tracking-wide polli:text-theme-text-soft", children: "ScrollArea vertical" }),
2673
- /* @__PURE__ */ jsx27(ScrollArea, { className: "polli:h-44 polli:rounded-lg polli:bg-theme-bg-subtle polli:p-3", children: scrollRows.map((row) => /* @__PURE__ */ jsxs13(
2674
- "p",
2675
- {
2676
- className: "polli:py-1 polli:text-sm polli:text-theme-text-base",
2677
- children: [
2678
- "Row ",
2679
- row
2680
- ]
2681
- },
2682
- row
2683
- )) })
2684
- ] }),
2685
- /* @__PURE__ */ jsxs13(Surface, { children: [
2686
- /* @__PURE__ */ jsx27("p", { className: "polli:mb-2 polli:font-mono polli:text-xs polli:uppercase polli:tracking-wide polli:text-theme-text-soft", children: "ScrollArea horizontal" }),
2687
- /* @__PURE__ */ jsx27(
2688
- ScrollArea,
2689
- {
2690
- axis: "x",
2691
- theme: "violet",
2692
- className: "polli:rounded-lg polli:bg-theme-bg-subtle polli:p-3",
2693
- children: /* @__PURE__ */ jsx27("div", { className: "polli:flex polli:w-max polli:gap-2", children: scrollRows.slice(0, 16).map((row) => /* @__PURE__ */ jsxs13(Chip, { theme: "violet", children: [
2694
- "item ",
2695
- row
2696
- ] }, row)) })
2697
- }
2698
- )
2699
- ] })
2700
- ] })
2701
- ]
2702
- }
2703
- )
2704
- }
2705
- );
2706
- var scrollRows = Array.from(
2707
- { length: 28 },
2708
- (_, index) => String(index + 1).padStart(2, "0")
2709
- );
2710
- var FeedbackDemo = () => /* @__PURE__ */ jsx27(
2711
- ShowcaseSection,
2712
- {
2713
- id: "feedback",
2714
- title: "Feedback",
2715
- caption: "Tooltip, InfoTip, and formatted value examples for compact product UI.",
2716
- children: /* @__PURE__ */ jsxs13(
2717
- Surface,
2718
- {
2719
- variant: "panel",
2720
- className: "polli:flex polli:flex-col polli:gap-3",
2721
- children: [
2722
- /* @__PURE__ */ jsx27(Row, { label: "InfoTip", children: /* @__PURE__ */ jsxs13("span", { className: "polli:inline-flex polli:items-center polli:text-sm polli:text-theme-text-strong", children: [
2723
- "Pollen balance",
2724
- /* @__PURE__ */ jsx27(InfoTip, { content: "A compact inline information trigger." })
2725
- ] }) }),
2726
- /* @__PURE__ */ jsxs13(Row, { label: "Tooltip", children: [
2727
- /* @__PURE__ */ jsx27(
2728
- Tooltip,
2729
- {
2730
- content: "Formatted with formatPollen()",
2731
- displayContents: true,
2732
- children: /* @__PURE__ */ jsxs13(PaidChip, { size: "lg", children: [
2733
- formatPollen(1234.5678),
2734
- " Pollen"
2735
- ] })
2736
- }
2737
- ),
2738
- /* @__PURE__ */ jsx27(
2739
- Tooltip,
2740
- {
2741
- content: "Use triggerAs='span' around inline text.",
2742
- triggerAs: "span",
2743
- children: /* @__PURE__ */ jsx27("span", { className: "polli:cursor-help polli:text-sm polli:text-theme-text-strong polli:underline polli:decoration-dotted", children: "inline help" })
2744
- }
2745
- )
2746
- ] })
2747
- ]
2748
- }
2749
- )
2750
- }
2751
- );
2752
- var modalities = [
2753
- "text",
2754
- "image",
2755
- "video",
2756
- "audio",
2757
- "realtime",
2758
- "embedding"
2759
- ];
2760
- var ModuleRecipesDemo = () => {
2761
- return /* @__PURE__ */ jsx27(
2762
- ShowcaseSection,
2763
- {
2764
- id: "modules",
2765
- title: "Shared Modules",
2766
- caption: "Package-owned pieces used by product screens; host apps provide the data and flows.",
2767
- children: /* @__PURE__ */ jsxs13(
2768
- Surface,
2769
- {
2770
- variant: "panel",
2771
- className: "polli:flex polli:flex-col polli:gap-4",
2772
- children: [
2773
- /* @__PURE__ */ jsxs13(Row, { label: "Wallet markers", children: [
2774
- /* @__PURE__ */ jsx27(PaidChip, { children: "Paid" }),
2775
- /* @__PURE__ */ jsx27(TierChip, { children: "Tier" }),
2776
- /* @__PURE__ */ jsxs13("span", { className: "polli:inline-flex polli:items-center polli:gap-2 polli:text-sm polli:text-theme-text-strong", children: [
2777
- /* @__PURE__ */ jsx27(WalletDot, { kind: "paid" }),
2778
- "paid balance"
2779
- ] }),
2780
- /* @__PURE__ */ jsxs13("span", { className: "polli:inline-flex polli:items-center polli:gap-2 polli:text-sm polli:text-theme-text-strong", children: [
2781
- /* @__PURE__ */ jsx27(WalletDot, { kind: "tier" }),
2782
- "tier balance"
2783
- ] })
2784
- ] }),
2785
- /* @__PURE__ */ jsxs13("div", { className: "polli:grid polli:grid-cols-[repeat(auto-fit,minmax(220px,1fr))] polli:gap-3", children: [
2786
- /* @__PURE__ */ jsx27(
2787
- WalletBalanceCard,
2788
- {
2789
- kind: "paid",
2790
- label: "Paid",
2791
- value: formatPollen(24.812),
2792
- footer: /* @__PURE__ */ jsxs13(Fragment3, { children: [
2793
- "+",
2794
- formatPollen(2.1),
2795
- " ",
2796
- /* @__PURE__ */ jsx27("span", { className: "polli:font-medium polli:text-amber-800/70", children: "/ 7d" })
2797
- ] }),
2798
- info: /* @__PURE__ */ jsx27(InfoTip, { content: "Paid wallet balance." })
2799
- }
2800
- ),
2801
- /* @__PURE__ */ jsx27(
2802
- WalletBalanceCard,
2803
- {
2804
- kind: "tier",
2805
- label: "Tier",
2806
- value: formatPollen(183.4),
2807
- footer: /* @__PURE__ */ jsxs13(Fragment3, { children: [
2808
- "+",
2809
- formatPollen(8),
2810
- " ",
2811
- /* @__PURE__ */ jsx27("span", { className: "polli:font-medium polli:text-amber-800/70", children: "/ 7d" })
2812
- ] }),
2813
- info: /* @__PURE__ */ jsx27(InfoTip, { content: "Tier allowance balance." })
2814
- }
2815
- )
2816
- ] }),
2817
- /* @__PURE__ */ jsxs13(Row, { label: "ModalityButton", children: [
2818
- modalities.map((modality) => /* @__PURE__ */ jsx27(ModalityButton, { category: modality, children: modality }, modality)),
2819
- /* @__PURE__ */ jsx27(ModalityButton, { category: "unknown", selected: false, children: "unknown" }),
2820
- /* @__PURE__ */ jsx27(ModalityButton, { category: "text", disabled: true, children: "disabled" })
2821
- ] }),
2822
- /* @__PURE__ */ jsxs13(Surface, { className: "polli:flex polli:flex-col polli:gap-3", children: [
2823
- /* @__PURE__ */ jsx27("h3", { className: "polli:font-subheading polli:text-xl polli:text-theme-text-strong", children: "Auth feedback" }),
2824
- /* @__PURE__ */ jsx27(AuthInfoCard, { title: "Authorize", children: /* @__PURE__ */ jsx27("p", { className: "polli:text-sm polli:text-theme-text-base", children: "Sign in to approve this request and return to the app." }) }),
2825
- /* @__PURE__ */ jsx27(ErrorBanner, { children: "Authorization failed. Try again." })
2826
- ] })
2827
- ]
2828
- }
2829
- )
2830
- }
2831
- );
2832
- };
2833
- var noop = () => void 0;
2834
- var noopSwitch = (_checked) => void 0;
2835
- var noopSelected = (_selected) => void 0;
2836
- export {
2837
- DesignShowcase
2838
- };
2839
- //# sourceMappingURL=index.js.map