github-contributions-ui 1.0.16 → 1.0.17

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 (9) hide show
  1. package/dist/index.cjs +202 -171
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +1 -1
  4. package/dist/index.d.ts +1 -1
  5. package/dist/index.js +196 -165
  6. package/dist/index.js.map +1 -1
  7. package/dist/styles.css +1 -1
  8. package/package.json +2 -2
  9. package/readme.md +1 -1
package/dist/index.cjs CHANGED
@@ -27,86 +27,120 @@ __export(index_exports, {
27
27
  module.exports = __toCommonJS(index_exports);
28
28
 
29
29
  // src/GithubActivity.tsx
30
- var import_react = require("react");
31
- var import_jsx_runtime = require("react/jsx-runtime");
32
- var MONTHS = [
33
- "Jan",
34
- "Feb",
35
- "Mar",
36
- "Apr",
37
- "May",
38
- "Jun",
39
- "Jul",
40
- "Aug",
41
- "Sep",
42
- "Oct",
43
- "Nov",
44
- "Dec"
45
- ];
46
- var DAY_LABELS = { 1: "Mon", 3: "Wed", 5: "Fri" };
47
- var CELL = 13;
48
- var GAP = 3;
49
- var STEP = CELL + GAP;
50
- var DAY_COL_W = 30;
30
+ var import_react2 = require("react");
31
+
32
+ // src/components/Styles.ts
33
+ var STYLES = `
34
+ .gcu .relative{position:relative}
35
+ .gcu .absolute{position:absolute}
36
+ .gcu .fixed{position:fixed}
37
+ .gcu .z-50{z-index:50}
38
+ .gcu .pointer-events-none{pointer-events:none}
39
+ .gcu .flex{display:flex}
40
+ .gcu .flex-col{flex-direction:column}
41
+ .gcu .flex-wrap{flex-wrap:wrap}
42
+ .gcu .items-center{align-items:center}
43
+ .gcu .justify-start{justify-content:flex-start}
44
+ .gcu .inline-block{display:inline-block}
45
+ .gcu .w-full{width:100%}
46
+ .gcu .w-\\[10px\\]{width:10px}
47
+ .gcu .w-\\[13px\\]{width:13px}
48
+ .gcu .h-\\[10px\\]{height:10px}
49
+ .gcu .h-\\[13px\\]{height:13px}
50
+ .gcu .h-\\[18px\\]{height:18px}
51
+ .gcu .-translate-x-1\\/2{transform:translateX(-50%)}
52
+ .gcu .-translate-y-full{transform:translateY(-100%)}
53
+ .gcu .gap-\\[3px\\]{gap:3px}
54
+ .gcu .gap-1{gap:0.25rem}
55
+ .gcu .gap-1\\.5{gap:0.375rem}
56
+ .gcu .gap-x-6{column-gap:1.5rem}
57
+ .gcu .gap-y-1{row-gap:0.25rem}
58
+ .gcu .mb-4{margin-bottom:1rem}
59
+ .gcu .mt-3{margin-top:0.75rem}
60
+ .gcu .mt-4{margin-top:1rem}
61
+ .gcu .mr-1{margin-right:0.25rem}
62
+ .gcu .ml-1{margin-left:0.25rem}
63
+ .gcu .p-4{padding:1rem}
64
+ .gcu .pt-3{padding-top:0.75rem}
65
+ .gcu .pt-px{padding-top:1px}
66
+ .gcu .pb-1{padding-bottom:0.25rem}
67
+ .gcu .pr-1\\.5{padding-right:0.375rem}
68
+ .gcu .px-2\\.5{padding-left:0.625rem;padding-right:0.625rem}
69
+ .gcu .py-1\\.5{padding-top:0.375rem;padding-bottom:0.375rem}
70
+ .gcu .rounded-\\[2px\\]{border-radius:2px}
71
+ .gcu .rounded-\\[3px\\]{border-radius:3px}
72
+ .gcu .rounded-md{border-radius:0.375rem}
73
+ .gcu .rounded-xl{border-radius:0.75rem}
74
+ .gcu .text-right{text-align:right}
75
+ .gcu .text-\\[10px\\]{font-size:10px}
76
+ .gcu .text-\\[11px\\]{font-size:11px}
77
+ .gcu .text-xs{font-size:0.75rem}
78
+ .gcu .text-sm{font-size:0.875rem}
79
+ .gcu .font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
80
+ .gcu .font-medium{font-weight:500}
81
+ .gcu .font-semibold{font-weight:600}
82
+ .gcu .select-none{-webkit-user-select:none;-ms-user-select:none;user-select:none}
83
+ .gcu .whitespace-nowrap{white-space:nowrap}
84
+ .gcu .overflow-x-auto{overflow-x:auto}
85
+ .gcu .border{border-width:1px;border-style:solid;border-color:#262626}
86
+ .gcu .border-neutral-800{border-color:#262626}
87
+ .gcu .border-t{border-top-width:1px;border-top-style:solid;border-top-color:#262626}
88
+ .gcu .transition-transform{transition-property:transform;transition-duration:0.1s;transition-timing-function:ease}
89
+ @keyframes gcu-pulse{50%{opacity:.5}}
90
+ .gcu .animate-pulse{animation:gcu-pulse 2s cubic-bezier(0.4,0,0.6,1) infinite}
91
+ .gcu .hover\\:scale-125:hover{transform:scale(1.25)}
92
+ .gcu .text-neutral-400{color:#9ca3af}
93
+ .gcu .text-neutral-200{color:#e5e7eb}
94
+ .gcu .bg-neutral-700{background-color:#3f3f46}
95
+ .gcu .bg-neutral-900{background-color:#171717}
96
+ .gcu .bg-neutral-950{background-color:#0a0a0a}
97
+ .gcu .text-white{color:#fff}
98
+ .gcu .shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,0.1),0 10px 10px -5px rgba(0,0,0,0.04)}
99
+ `;
100
+
101
+ // src/components/Colors.ts
51
102
  var LIGHT = ["#ebedf0", "#9be9a8", "#40c463", "#30a14e", "#216e39"];
52
103
  var DARK = ["#21262d", "#0e4429", "#006d32", "#26a641", "#39d353"];
53
104
  var BLUE = ["#21262d", "#a3c9ff", "#5fa3ff", "#2f7bff", "#0b5cff"];
54
105
  var PURPLE = ["#21262d", "#d8b4ff", "#c084fc", "#a855f7", "#7e22ce"];
55
- var COLOR_MAP = {
56
- light: LIGHT,
57
- dark: DARK,
58
- blue: BLUE,
59
- purple: PURPLE
60
- };
61
- function toLevel(count) {
62
- if (count === 0) return 0;
63
- if (count <= 3) return 1;
64
- if (count <= 6) return 2;
65
- if (count <= 9) return 3;
66
- return 4;
67
- }
106
+ var GRAY = ["#21262d", "#6a737d", "#8b949e", "#c0c0c8", "#e0e0e0"];
107
+
108
+ // src/components/BuildGrid.ts
68
109
  function buildGrid(dayMap, year) {
69
110
  var _a;
70
- let start;
111
+ let rangeStart;
71
112
  let end;
72
113
  if (year === "last") {
73
114
  end = /* @__PURE__ */ new Date();
74
- start = new Date(end);
75
- start.setFullYear(start.getFullYear() - 1);
76
- start.setDate(start.getDate() + 1);
115
+ rangeStart = new Date(end);
116
+ rangeStart.setFullYear(rangeStart.getFullYear() - 1);
117
+ rangeStart.setDate(rangeStart.getDate() + 1);
77
118
  } else {
78
- start = new Date(year, 0, 1);
119
+ rangeStart = new Date(year, 0, 1);
79
120
  end = year === (/* @__PURE__ */ new Date()).getFullYear() ? /* @__PURE__ */ new Date() : new Date(year, 11, 31);
80
121
  }
81
- start.setDate(start.getDate() - start.getDay());
122
+ const gridStart = new Date(rangeStart);
123
+ gridStart.setDate(gridStart.getDate() - gridStart.getDay());
82
124
  const weeks = [];
83
- const cur = new Date(start);
125
+ const cur = new Date(gridStart);
84
126
  while (cur <= end) {
85
127
  const week = [];
86
128
  for (let d = 0; d < 7; d++) {
87
- const iso = cur.toISOString().slice(0, 10);
88
- if (cur > end) week.push(null);
89
- else week.push((_a = dayMap.get(iso)) != null ? _a : { date: iso, count: 0, level: 0 });
129
+ if (cur < rangeStart || cur > end) {
130
+ week.push(null);
131
+ } else {
132
+ const iso = cur.toISOString().slice(0, 10);
133
+ week.push((_a = dayMap.get(iso)) != null ? _a : { date: iso, count: 0, level: 0 });
134
+ }
90
135
  cur.setDate(cur.getDate() + 1);
91
136
  }
92
137
  weeks.push(week);
93
138
  }
94
139
  return weeks;
95
140
  }
96
- function monthLabels(grid) {
97
- const out = [];
98
- let last = -1;
99
- grid.forEach((week, i) => {
100
- const first = week.find(Boolean);
101
- if (!first) return;
102
- const m = new Date(first.date).getMonth();
103
- if (m !== last) {
104
- out.push({ label: MONTHS[m], col: i });
105
- last = m;
106
- }
107
- });
108
- return out;
109
- }
141
+
142
+ // src/components/Tooltip.tsx
143
+ var import_jsx_runtime = require("react/jsx-runtime");
110
144
  function Tooltip({ day, x, y }) {
111
145
  const label = new Date(day.date).toLocaleDateString("en-US", {
112
146
  weekday: "long",
@@ -132,15 +166,10 @@ function Tooltip({ day, x, y }) {
132
166
  }
133
167
  );
134
168
  }
135
- function Skeleton() {
136
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex gap-[3px] animate-pulse opacity-40", children: Array.from({ length: 45 }).map((_, w) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-[3px]", children: Array.from({ length: 7 }).map((_2, d) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
137
- "div",
138
- {
139
- className: "w-[13px] h-[13px] rounded-[3px] bg-neutral-700"
140
- },
141
- d
142
- )) }, w)) });
143
- }
169
+
170
+ // src/components/YearPillProps.tsx
171
+ var import_react = require("react");
172
+ var import_jsx_runtime2 = require("react/jsx-runtime");
144
173
  function YearPill({ label, active, onClick }) {
145
174
  const [hovered, setHovered] = (0, import_react.useState)(false);
146
175
  const baseStyle = {
@@ -153,12 +182,10 @@ function YearPill({ label, active, onClick }) {
153
182
  transition: "background-color 0.15s ease, color 0.15s ease",
154
183
  userSelect: "none",
155
184
  outline: "none",
156
- // Active = white pill with dark text
157
- // Inactive = dark pill with muted text, slightly lighter on hover
158
185
  backgroundColor: active ? "#ffffff" : hovered ? "#3f3f46" : "#262626",
159
186
  color: active ? "#000000" : "#ffffff"
160
187
  };
161
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
188
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
162
189
  "button",
163
190
  {
164
191
  type: "button",
@@ -170,76 +197,76 @@ function YearPill({ label, active, onClick }) {
170
197
  }
171
198
  );
172
199
  }
200
+
201
+ // src/components/MonthLabels.ts
202
+ var MONTHS = [
203
+ "Jan",
204
+ "Feb",
205
+ "Mar",
206
+ "Apr",
207
+ "May",
208
+ "Jun",
209
+ "Jul",
210
+ "Aug",
211
+ "Sep",
212
+ "Oct",
213
+ "Nov",
214
+ "Dec"
215
+ ];
216
+ function monthLabels(grid, year) {
217
+ const out = [];
218
+ let lastMonth = -1;
219
+ grid.forEach((week, i) => {
220
+ const first = week.find(Boolean);
221
+ if (!first) return;
222
+ const m = new Date(first.date).getMonth();
223
+ if (m !== lastMonth) {
224
+ const isOrphanedSliver = i === 0 && week.findIndex(Boolean) > 0 && (year !== "last" ? m !== 0 : true);
225
+ if (!isOrphanedSliver) {
226
+ out.push({ label: MONTHS[m], col: i });
227
+ }
228
+ lastMonth = m;
229
+ }
230
+ });
231
+ return out;
232
+ }
233
+
234
+ // src/components/Skeleton.tsx
235
+ var import_jsx_runtime3 = require("react/jsx-runtime");
236
+ function Skeleton() {
237
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "flex gap-[3px] mx-auto animate-pulse opacity-40", children: Array.from({ length: 40 }).map((_, w) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "flex flex-col gap-[3px]", children: Array.from({ length: 7 }).map((_2, d) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
238
+ "div",
239
+ {
240
+ className: "w-[13px] h-[13px] rounded-[3px] bg-neutral-700"
241
+ },
242
+ d
243
+ )) }, w)) });
244
+ }
245
+
246
+ // src/GithubActivity.tsx
247
+ var import_jsx_runtime4 = require("react/jsx-runtime");
248
+ var DAY_LABELS = { 1: "Mon", 3: "Wed", 5: "Fri" };
249
+ var CELL = 13;
250
+ var GAP = 3;
251
+ var STEP = CELL + GAP;
252
+ var DAY_COL_W = 30;
253
+ var COLOR_MAP = {
254
+ light: LIGHT,
255
+ dark: DARK,
256
+ blue: BLUE,
257
+ purple: PURPLE,
258
+ gray: GRAY
259
+ };
260
+ function toLevel(count) {
261
+ if (count === 0) return 0;
262
+ if (count <= 3) return 1;
263
+ if (count <= 6) return 2;
264
+ if (count <= 9) return 3;
265
+ return 4;
266
+ }
173
267
  function GithubActivity({ username, theme = "dark", className }) {
174
268
  var _a;
175
- const STYLES = `
176
- .gcu .relative{position:relative}
177
- .gcu .absolute{position:absolute}
178
- .gcu .fixed{position:fixed}
179
- .gcu .z-50{z-index:50}
180
- .gcu .pointer-events-none{pointer-events:none}
181
- .gcu .flex{display:flex}
182
- .gcu .flex-col{flex-direction:column}
183
- .gcu .flex-wrap{flex-wrap:wrap}
184
- .gcu .items-center{align-items:center}
185
- .gcu .justify-start{justify-content:flex-start}
186
- .gcu .inline-block{display:inline-block}
187
- .gcu .w-full{width:100%}
188
- .gcu .w-\\[10px\\]{width:10px}
189
- .gcu .w-\\[13px\\]{width:13px}
190
- .gcu .h-\\[10px\\]{height:10px}
191
- .gcu .h-\\[13px\\]{height:13px}
192
- .gcu .h-\\[18px\\]{height:18px}
193
- .gcu .-translate-x-1\\/2{transform:translateX(-50%)}
194
- .gcu .-translate-y-full{transform:translateY(-100%)}
195
- .gcu .gap-\\[3px\\]{gap:3px}
196
- .gcu .gap-1{gap:0.25rem}
197
- .gcu .gap-1\\.5{gap:0.375rem}
198
- .gcu .gap-x-6{column-gap:1.5rem}
199
- .gcu .gap-y-1{row-gap:0.25rem}
200
- .gcu .mb-4{margin-bottom:1rem}
201
- .gcu .mt-3{margin-top:0.75rem}
202
- .gcu .mt-4{margin-top:1rem}
203
- .gcu .mr-1{margin-right:0.25rem}
204
- .gcu .ml-1{margin-left:0.25rem}
205
- .gcu .p-4{padding:1rem}
206
- .gcu .pt-3{padding-top:0.75rem}
207
- .gcu .pt-px{padding-top:1px}
208
- .gcu .pb-1{padding-bottom:0.25rem}
209
- .gcu .pr-1\\.5{padding-right:0.375rem}
210
- .gcu .px-2\\.5{padding-left:0.625rem;padding-right:0.625rem}
211
- .gcu .py-1\\.5{padding-top:0.375rem;padding-bottom:0.375rem}
212
- .gcu .rounded-\\[2px\\]{border-radius:2px}
213
- .gcu .rounded-\\[3px\\]{border-radius:3px}
214
- .gcu .rounded-md{border-radius:0.375rem}
215
- .gcu .rounded-xl{border-radius:0.75rem}
216
- .gcu .text-right{text-align:right}
217
- .gcu .text-\\[10px\\]{font-size:10px}
218
- .gcu .text-\\[11px\\]{font-size:11px}
219
- .gcu .text-xs{font-size:0.75rem}
220
- .gcu .text-sm{font-size:0.875rem}
221
- .gcu .font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
222
- .gcu .font-medium{font-weight:500}
223
- .gcu .font-semibold{font-weight:600}
224
- .gcu .select-none{-webkit-user-select:none;-ms-user-select:none;user-select:none}
225
- .gcu .whitespace-nowrap{white-space:nowrap}
226
- .gcu .overflow-x-auto{overflow-x:auto}
227
- .gcu .border{border-width:1px;border-style:solid;border-color:#262626}
228
- .gcu .border-neutral-800{border-color:#262626}
229
- .gcu .border-t{border-top-width:1px;border-top-style:solid;border-top-color:#262626}
230
- .gcu .transition-transform{transition-property:transform;transition-duration:0.1s;transition-timing-function:ease}
231
- @keyframes gcu-pulse{50%{opacity:.5}}
232
- .gcu .animate-pulse{animation:gcu-pulse 2s cubic-bezier(0.4,0,0.6,1) infinite}
233
- .gcu .hover\\:scale-125:hover{transform:scale(1.25)}
234
- .gcu .text-neutral-400{color:#9ca3af}
235
- .gcu .text-neutral-200{color:#e5e7eb}
236
- .gcu .bg-neutral-700{background-color:#3f3f46}
237
- .gcu .bg-neutral-900{background-color:#171717}
238
- .gcu .bg-neutral-950{background-color:#0a0a0a}
239
- .gcu .text-white{color:#fff}
240
- .gcu .shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,0.1),0 10px 10px -5px rgba(0,0,0,0.04)}
241
- `;
242
- (0, import_react.useEffect)(() => {
269
+ (0, import_react2.useEffect)(() => {
243
270
  if (typeof document === "undefined") return;
244
271
  const id = "github-contributions-ui-inline";
245
272
  if (document.getElementById(id)) return;
@@ -248,18 +275,18 @@ function GithubActivity({ username, theme = "dark", className }) {
248
275
  style.textContent = STYLES;
249
276
  document.head.appendChild(style);
250
277
  }, []);
251
- const [allDays, setAllDays] = (0, import_react.useState)(/* @__PURE__ */ new Map());
252
- const [years, setYears] = (0, import_react.useState)([]);
253
- const [selectedYear, setSelectedYear] = (0, import_react.useState)("last");
254
- const [total, setTotal] = (0, import_react.useState)(null);
255
- const [bestDay, setBestDay] = (0, import_react.useState)(null);
256
- const [loading, setLoading] = (0, import_react.useState)(true);
257
- const [error, setError] = (0, import_react.useState)(false);
258
- const [tip, setTip] = (0, import_react.useState)(
278
+ const [allDays, setAllDays] = (0, import_react2.useState)(/* @__PURE__ */ new Map());
279
+ const [years, setYears] = (0, import_react2.useState)([]);
280
+ const [selectedYear, setSelectedYear] = (0, import_react2.useState)("last");
281
+ const [total, setTotal] = (0, import_react2.useState)(null);
282
+ const [bestDay, setBestDay] = (0, import_react2.useState)(null);
283
+ const [loading, setLoading] = (0, import_react2.useState)(true);
284
+ const [error, setError] = (0, import_react2.useState)(false);
285
+ const [tip, setTip] = (0, import_react2.useState)(
259
286
  null
260
287
  );
261
288
  const colors = (_a = COLOR_MAP[theme]) != null ? _a : COLOR_MAP.dark;
262
- (0, import_react.useEffect)(() => {
289
+ (0, import_react2.useEffect)(() => {
263
290
  if (!username) return;
264
291
  let mounted = true;
265
292
  (async () => {
@@ -294,7 +321,7 @@ function GithubActivity({ username, theme = "dark", className }) {
294
321
  mounted = false;
295
322
  };
296
323
  }, [username]);
297
- (0, import_react.useEffect)(() => {
324
+ (0, import_react2.useEffect)(() => {
298
325
  if (!allDays.size) return;
299
326
  const entries = Array.from(allDays.values()).filter((d) => {
300
327
  if (selectedYear === "last") {
@@ -311,21 +338,25 @@ function GithubActivity({ username, theme = "dark", className }) {
311
338
  );
312
339
  setBestDay(best && best.count > 0 ? best : null);
313
340
  }, [allDays, selectedYear]);
314
- const grid = (0, import_react.useMemo)(
341
+ const grid = (0, import_react2.useMemo)(
315
342
  () => allDays.size ? buildGrid(allDays, selectedYear) : [],
316
343
  [allDays, selectedYear]
317
344
  );
318
- const labels = (0, import_react.useMemo)(() => monthLabels(grid), [grid]);
345
+ const labels = (0, import_react2.useMemo)(
346
+ () => monthLabels(grid, selectedYear),
347
+ [grid, selectedYear]
348
+ );
319
349
  const outlineColor = theme === "light" ? "#333" : "#f0f0f0";
320
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
350
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
321
351
  "section",
322
352
  {
323
353
  className: ["gcu w-full font-mono", className].filter(Boolean).join(" "),
354
+ style: {},
324
355
  children: [
325
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center gap-x-6 gap-y-1 mb-4 text-xs text-neutral-400", children: [
356
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-wrap items-center gap-x-6 gap-y-1 mb-4 text-xs text-neutral-400", children: [
326
357
  loading ? "Loading\u2026" : error ? "Unavailable" : `${total == null ? void 0 : total.toLocaleString()} contributions ${selectedYear === "last" ? "in the last year" : `in ${selectedYear}`}`,
327
- bestDay && !loading && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "flex items-center gap-1.5", children: [
328
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
358
+ bestDay && !loading && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "flex items-center gap-1.5", children: [
359
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
329
360
  "span",
330
361
  {
331
362
  className: "inline-block w-[10px] h-[10px] rounded-[2px]",
@@ -333,26 +364,26 @@ function GithubActivity({ username, theme = "dark", className }) {
333
364
  }
334
365
  ),
335
366
  "Best day:",
336
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-neutral-200 font-semibold", children: [
367
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("span", { className: "text-neutral-200 font-semibold", children: [
337
368
  bestDay.count,
338
369
  " contributions on ",
339
370
  bestDay.date
340
371
  ] })
341
372
  ] })
342
373
  ] }),
343
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "border border-neutral-800 rounded-xl p-4 bg-neutral-950", children: error ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm text-neutral-400 italic", children: "GitHub activity unavailable." }) : loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Skeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
344
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "overflow-x-auto pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
374
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "border border-neutral-800 rounded-xl p-4 bg-neutral-950", children: error ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "text-sm text-neutral-400 italic", children: "GitHub activity unavailable." }) : loading ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skeleton, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
375
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "overflow-x-auto pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
345
376
  "div",
346
377
  {
347
378
  className: "relative",
348
379
  style: { minWidth: grid.length * STEP + DAY_COL_W + 8 },
349
380
  children: [
350
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
381
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
351
382
  "div",
352
383
  {
353
384
  className: "relative h-[18px] mb-1",
354
385
  style: { marginLeft: DAY_COL_W },
355
- children: labels.map(({ label, col }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
386
+ children: labels.map(({ label, col }) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
356
387
  "span",
357
388
  {
358
389
  className: "absolute text-[11px] text-neutral-400",
@@ -363,15 +394,15 @@ function GithubActivity({ username, theme = "dark", className }) {
363
394
  ))
364
395
  }
365
396
  ),
366
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex gap-[3px]", children: [
367
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
397
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex gap-[3px]", children: [
398
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
368
399
  "div",
369
400
  {
370
401
  className: "flex flex-col gap-[3px]",
371
402
  style: { width: DAY_COL_W - GAP },
372
403
  children: Array.from({ length: 7 }).map((_, i) => {
373
404
  var _a2;
374
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
405
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
375
406
  "div",
376
407
  {
377
408
  className: "h-[13px] text-[10px] text-right pr-1.5 text-neutral-400",
@@ -382,7 +413,7 @@ function GithubActivity({ username, theme = "dark", className }) {
382
413
  })
383
414
  }
384
415
  ),
385
- grid.map((week, wi) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-[3px]", children: week.map((day, di) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
416
+ grid.map((week, wi) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex flex-col gap-[3px]", children: week.map((day, di) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
386
417
  "div",
387
418
  {
388
419
  className: "w-[13px] h-[13px] rounded-[3px] transition-transform hover:scale-125",
@@ -404,9 +435,9 @@ function GithubActivity({ username, theme = "dark", className }) {
404
435
  ]
405
436
  }
406
437
  ) }),
407
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1 mt-3 text-[11px] text-neutral-400", children: [
438
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-center gap-1 mt-3 text-[11px] text-neutral-400", children: [
408
439
  "Less",
409
- colors.map((c, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
440
+ colors.map((c, i) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
410
441
  "div",
411
442
  {
412
443
  className: "w-[13px] h-[13px] rounded-[3px]",
@@ -416,9 +447,9 @@ function GithubActivity({ username, theme = "dark", className }) {
416
447
  )),
417
448
  "More"
418
449
  ] }),
419
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center gap-1.5 mt-4 pt-3 border-t border-neutral-800", children: [
420
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-[11px] text-neutral-400 mr-1", children: "Year:" }),
421
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
450
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-wrap items-center gap-1.5 mt-4 pt-3 border-t border-neutral-800", children: [
451
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-[11px] text-neutral-400 mr-1", children: "Year:" }),
452
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
422
453
  YearPill,
423
454
  {
424
455
  label: "Last year",
@@ -426,7 +457,7 @@ function GithubActivity({ username, theme = "dark", className }) {
426
457
  onClick: () => setSelectedYear("last")
427
458
  }
428
459
  ),
429
- years.map((y) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
460
+ years.map((y) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
430
461
  YearPill,
431
462
  {
432
463
  label: String(y),
@@ -437,12 +468,12 @@ function GithubActivity({ username, theme = "dark", className }) {
437
468
  ))
438
469
  ] })
439
470
  ] }) }),
440
- tip && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Tooltip, { day: tip.day, x: tip.x, y: tip.y })
471
+ tip && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Tooltip, { day: tip.day, x: tip.x, y: tip.y })
441
472
  ]
442
473
  }
443
474
  );
444
475
  }
445
- var GithubActivity_default = (0, import_react.memo)(GithubActivity);
476
+ var GithubActivity_default = (0, import_react2.memo)(GithubActivity);
446
477
  // Annotate the CommonJS export names for ESM import in node:
447
478
  0 && (module.exports = {
448
479
  GithubActivity