react-fill-calendar 0.1.7 → 0.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.css +1 -0
- package/dist/index.js +66 -51
- package/dist/index.umd.cjs +3 -3
- package/package.json +8 -4
package/dist/index.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.today-cell-btn:hover{border-color:var(--border-fill-color)}.hover-border-var:hover{border-color:var(--hover-border-color)}.hover-border-var{border-color:var(--border-color, transparent)}.today-cell-btn{border-color:transparent}@keyframes rainbow-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.rainbow-spin{animation:rainbow-spin 4s linear infinite}
|
package/dist/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import re, { useMemo as B } from "react";
|
|
2
|
-
var I = { exports: {} },
|
|
2
|
+
var I = { exports: {} }, C = {};
|
|
3
3
|
var H;
|
|
4
4
|
function te() {
|
|
5
|
-
if (H) return
|
|
5
|
+
if (H) return C;
|
|
6
6
|
H = 1;
|
|
7
7
|
var c = /* @__PURE__ */ Symbol.for("react.transitional.element"), m = /* @__PURE__ */ Symbol.for("react.fragment");
|
|
8
8
|
function b(v, l, i) {
|
|
@@ -20,7 +20,7 @@ function te() {
|
|
|
20
20
|
props: i
|
|
21
21
|
};
|
|
22
22
|
}
|
|
23
|
-
return
|
|
23
|
+
return C.Fragment = m, C.jsx = b, C.jsxs = b, C;
|
|
24
24
|
}
|
|
25
25
|
var D = {};
|
|
26
26
|
var Z;
|
|
@@ -36,11 +36,11 @@ function ne() {
|
|
|
36
36
|
return "Fragment";
|
|
37
37
|
case P:
|
|
38
38
|
return "Profiler";
|
|
39
|
-
case
|
|
39
|
+
case p:
|
|
40
40
|
return "StrictMode";
|
|
41
|
-
case
|
|
41
|
+
case j:
|
|
42
42
|
return "Suspense";
|
|
43
|
-
case
|
|
43
|
+
case g:
|
|
44
44
|
return "SuspenseList";
|
|
45
45
|
case x:
|
|
46
46
|
return "Activity";
|
|
@@ -135,7 +135,7 @@ function ne() {
|
|
|
135
135
|
function R(e, r, n, o, M, q) {
|
|
136
136
|
var s = n.ref;
|
|
137
137
|
return e = {
|
|
138
|
-
$$typeof:
|
|
138
|
+
$$typeof: E,
|
|
139
139
|
type: e,
|
|
140
140
|
key: r,
|
|
141
141
|
props: n,
|
|
@@ -180,10 +180,10 @@ function ne() {
|
|
|
180
180
|
else h(s);
|
|
181
181
|
if (F.call(r, "key")) {
|
|
182
182
|
s = c(e);
|
|
183
|
-
var
|
|
183
|
+
var $ = Object.keys(r).filter(function(ee) {
|
|
184
184
|
return ee !== "key";
|
|
185
185
|
});
|
|
186
|
-
o = 0 <
|
|
186
|
+
o = 0 < $.length ? "{key: someKey, " + $.join(": ..., ") + ": ...}" : "{key: someKey}", X[s + o] || ($ = 0 < $.length ? "{" + $.join(": ..., ") + ": ...}" : "{}", console.error(
|
|
187
187
|
`A props object containing a "key" prop is being spread into JSX:
|
|
188
188
|
let props = %s;
|
|
189
189
|
<%s {...props} />
|
|
@@ -192,7 +192,7 @@ React keys must be passed directly to JSX without using spread:
|
|
|
192
192
|
<%s key={someKey} {...props} />`,
|
|
193
193
|
o,
|
|
194
194
|
s,
|
|
195
|
-
|
|
195
|
+
$,
|
|
196
196
|
s
|
|
197
197
|
), X[s + o] = !0);
|
|
198
198
|
}
|
|
@@ -217,18 +217,18 @@ React keys must be passed directly to JSX without using spread:
|
|
|
217
217
|
N(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === u && (e._payload.status === "fulfilled" ? N(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
|
|
218
218
|
}
|
|
219
219
|
function N(e) {
|
|
220
|
-
return typeof e == "object" && e !== null && e.$$typeof ===
|
|
220
|
+
return typeof e == "object" && e !== null && e.$$typeof === E;
|
|
221
221
|
}
|
|
222
|
-
var
|
|
222
|
+
var _ = re, E = /* @__PURE__ */ Symbol.for("react.transitional.element"), O = /* @__PURE__ */ Symbol.for("react.portal"), A = /* @__PURE__ */ Symbol.for("react.fragment"), p = /* @__PURE__ */ Symbol.for("react.strict_mode"), P = /* @__PURE__ */ Symbol.for("react.profiler"), Y = /* @__PURE__ */ Symbol.for("react.consumer"), L = /* @__PURE__ */ Symbol.for("react.context"), f = /* @__PURE__ */ Symbol.for("react.forward_ref"), j = /* @__PURE__ */ Symbol.for("react.suspense"), g = /* @__PURE__ */ Symbol.for("react.suspense_list"), t = /* @__PURE__ */ Symbol.for("react.memo"), u = /* @__PURE__ */ Symbol.for("react.lazy"), x = /* @__PURE__ */ Symbol.for("react.activity"), T = /* @__PURE__ */ Symbol.for("react.client.reference"), k = _.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, F = Object.prototype.hasOwnProperty, K = Array.isArray, U = console.createTask ? console.createTask : function() {
|
|
223
223
|
return null;
|
|
224
224
|
};
|
|
225
|
-
|
|
225
|
+
_ = {
|
|
226
226
|
react_stack_bottom_frame: function(e) {
|
|
227
227
|
return e();
|
|
228
228
|
}
|
|
229
229
|
};
|
|
230
|
-
var z, J = {}, V =
|
|
231
|
-
|
|
230
|
+
var z, J = {}, V = _.react_stack_bottom_frame.bind(
|
|
231
|
+
_,
|
|
232
232
|
i
|
|
233
233
|
)(), G = U(v(i)), X = {};
|
|
234
234
|
D.Fragment = A, D.jsx = function(e, r, n) {
|
|
@@ -278,16 +278,16 @@ const oe = ({
|
|
|
278
278
|
flex items-center justify-center
|
|
279
279
|
${w} border-2 transition-colors duration-150 hover:scale-150
|
|
280
280
|
${!h && !d && b ? "hover-border-var" : ""}
|
|
281
|
-
`,
|
|
281
|
+
`, _ = !!(S && d), E = (p = "", P) => /* @__PURE__ */ a.jsx(
|
|
282
282
|
"button",
|
|
283
283
|
{
|
|
284
284
|
type: "button",
|
|
285
|
-
className: `${N} ${
|
|
285
|
+
className: `${N} ${p} ${_ ? "cursor-pointer" : ""}`,
|
|
286
286
|
style: P
|
|
287
287
|
}
|
|
288
|
-
), O = (
|
|
288
|
+
), O = (p) => _ ? /* @__PURE__ */ a.jsx("a", { href: S, className: "contents", children: p }) : p;
|
|
289
289
|
if (h) {
|
|
290
|
-
const
|
|
290
|
+
const p = /* @__PURE__ */ a.jsxs("div", { className: "relative flex items-center justify-center w-4 h-4", children: [
|
|
291
291
|
/* @__PURE__ */ a.jsx(
|
|
292
292
|
"div",
|
|
293
293
|
{
|
|
@@ -300,14 +300,23 @@ const oe = ({
|
|
|
300
300
|
}
|
|
301
301
|
}
|
|
302
302
|
),
|
|
303
|
-
/* @__PURE__ */ a.jsx(
|
|
304
|
-
"
|
|
305
|
-
|
|
306
|
-
|
|
303
|
+
/* @__PURE__ */ a.jsx(
|
|
304
|
+
"div",
|
|
305
|
+
{
|
|
306
|
+
className: `relative flex items-center justify-center w-4 h-4 ${w} p-[2px]`,
|
|
307
|
+
children: E(
|
|
308
|
+
"today-cell-btn w-full h-full rounded-md border-transparent",
|
|
309
|
+
{
|
|
310
|
+
"--border-fill-color": d ? m : v,
|
|
311
|
+
backgroundColor: d ? c : l
|
|
312
|
+
}
|
|
313
|
+
)
|
|
314
|
+
}
|
|
315
|
+
)
|
|
307
316
|
] });
|
|
308
|
-
return O(
|
|
317
|
+
return O(p);
|
|
309
318
|
}
|
|
310
|
-
return O(
|
|
319
|
+
return O(E("w-4 h-4", d && !h ? {
|
|
311
320
|
backgroundColor: c,
|
|
312
321
|
borderColor: m,
|
|
313
322
|
"--hover-border-color": b
|
|
@@ -330,9 +339,9 @@ const oe = ({
|
|
|
330
339
|
title: w = "Calendar",
|
|
331
340
|
cellShape: h = "square",
|
|
332
341
|
column: N = 15,
|
|
333
|
-
legendColumn:
|
|
342
|
+
legendColumn: _ = !1
|
|
334
343
|
}) => {
|
|
335
|
-
const
|
|
344
|
+
const E = /* @__PURE__ */ new Date(), { selectedSet: O, hrefMap: A } = B(() => {
|
|
336
345
|
const f = (t) => {
|
|
337
346
|
if (!t) return "";
|
|
338
347
|
if (typeof t == "string") {
|
|
@@ -344,14 +353,14 @@ const oe = ({
|
|
|
344
353
|
return t;
|
|
345
354
|
}
|
|
346
355
|
return typeof t == "object" && t.day ? f(t.day) : "";
|
|
347
|
-
},
|
|
356
|
+
}, j = /* @__PURE__ */ new Set(), g = /* @__PURE__ */ new Map();
|
|
348
357
|
for (const t of R || []) {
|
|
349
358
|
const u = t && typeof t == "object" && t.day ? f(t.day) : f(t);
|
|
350
|
-
u && (
|
|
359
|
+
u && (j.add(u), t && typeof t == "object" && t.href && g.set(u, t.href));
|
|
351
360
|
}
|
|
352
|
-
return { selectedSet:
|
|
353
|
-
}, [R]),
|
|
354
|
-
const f =
|
|
361
|
+
return { selectedSet: j, hrefMap: g };
|
|
362
|
+
}, [R]), p = B(() => {
|
|
363
|
+
const f = E.getFullYear(), j = E.getMonth(), g = new Date(f, j - 1, 1), t = new Date(f, j + 2, 0), u = [], x = new Date(g);
|
|
355
364
|
for (; x <= t; ) {
|
|
356
365
|
const T = `${x.getFullYear()}-${String(x.getMonth() + 1).padStart(2, "0")}-${String(
|
|
357
366
|
x.getDate()
|
|
@@ -365,9 +374,9 @@ const oe = ({
|
|
|
365
374
|
}), x.setDate(x.getDate() + 1);
|
|
366
375
|
}
|
|
367
376
|
return u;
|
|
368
|
-
}, [R,
|
|
369
|
-
for (let f = 0; f <
|
|
370
|
-
P.push(
|
|
377
|
+
}, [R, E]), P = [], Y = N;
|
|
378
|
+
for (let f = 0; f < p.length; f += Y)
|
|
379
|
+
P.push(p.slice(f, f + Y));
|
|
371
380
|
const L = h === "square" ? "rounded-md" : "rounded-full";
|
|
372
381
|
return /* @__PURE__ */ a.jsxs(
|
|
373
382
|
"div",
|
|
@@ -380,7 +389,7 @@ const oe = ({
|
|
|
380
389
|
i && /* @__PURE__ */ a.jsxs(
|
|
381
390
|
"div",
|
|
382
391
|
{
|
|
383
|
-
className: `flex ${
|
|
392
|
+
className: `flex ${_ ? "flex-col items-start" : "justify-between"} text-sm`,
|
|
384
393
|
style: { color: S },
|
|
385
394
|
children: [
|
|
386
395
|
/* @__PURE__ */ a.jsx("strong", { children: w }),
|
|
@@ -398,17 +407,23 @@ const oe = ({
|
|
|
398
407
|
}
|
|
399
408
|
}
|
|
400
409
|
),
|
|
401
|
-
/* @__PURE__ */ a.jsx(
|
|
402
|
-
"
|
|
410
|
+
/* @__PURE__ */ a.jsx(
|
|
411
|
+
"div",
|
|
403
412
|
{
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
413
|
+
className: "relative flex items-center justify-center w-4 h-4 rounded-md p-[2px]",
|
|
414
|
+
children: /* @__PURE__ */ a.jsx(
|
|
415
|
+
"button",
|
|
416
|
+
{
|
|
417
|
+
type: "button",
|
|
418
|
+
className: "flex items-center justify-center w-full h-full rounded-md border-2 border-transparent transition-colors duration-150",
|
|
419
|
+
style: {
|
|
420
|
+
"--border-fill-color": m,
|
|
421
|
+
backgroundColor: l
|
|
422
|
+
}
|
|
423
|
+
}
|
|
424
|
+
)
|
|
410
425
|
}
|
|
411
|
-
)
|
|
426
|
+
)
|
|
412
427
|
] }),
|
|
413
428
|
/* @__PURE__ */ a.jsx("span", { children: "Today" })
|
|
414
429
|
] }),
|
|
@@ -429,8 +444,8 @@ const oe = ({
|
|
|
429
444
|
]
|
|
430
445
|
}
|
|
431
446
|
),
|
|
432
|
-
/* @__PURE__ */ a.jsx("div", { className: "flex flex-col gap-1", children: P.map((f,
|
|
433
|
-
const t =
|
|
447
|
+
/* @__PURE__ */ a.jsx("div", { className: "flex flex-col gap-1", children: P.map((f, j) => /* @__PURE__ */ a.jsx("div", { className: "flex gap-1", children: f.map((g) => {
|
|
448
|
+
const t = g.dateObj.toLocaleDateString("en-US", {
|
|
434
449
|
month: "long",
|
|
435
450
|
day: "numeric",
|
|
436
451
|
year: "numeric"
|
|
@@ -448,16 +463,16 @@ const oe = ({
|
|
|
448
463
|
hoverborderColor: b,
|
|
449
464
|
cellBorderColor: v,
|
|
450
465
|
cellColor: l,
|
|
451
|
-
isSelected:
|
|
466
|
+
isSelected: g.isSelected,
|
|
452
467
|
day: t,
|
|
453
|
-
href:
|
|
468
|
+
href: g.href,
|
|
454
469
|
cellShape: h
|
|
455
470
|
}
|
|
456
471
|
)
|
|
457
472
|
},
|
|
458
|
-
|
|
473
|
+
g.key
|
|
459
474
|
);
|
|
460
|
-
}) },
|
|
475
|
+
}) }, j)) })
|
|
461
476
|
]
|
|
462
477
|
}
|
|
463
478
|
);
|
package/dist/index.umd.cjs
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(R,T){typeof exports=="object"&&typeof module<"u"?T(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],T):(R=typeof globalThis<"u"?globalThis:R||self,T(R.FillCalendar={},R.React))})(this,(function(R,T){"use strict";var M={exports:{}},Y={};var V;function re(){if(V)return Y;V=1;var f=Symbol.for("react.transitional.element"),m=Symbol.for("react.fragment");function b(h,l,i){var d=null;if(i!==void 0&&(d=""+i),l.key!==void 0&&(d=""+l.key),"key"in l){i={};for(var y in l)y!=="key"&&(i[y]=l[y])}else i=l;return l=i.ref,{$$typeof:f,type:h,key:d,ref:l!==void 0?l:null,props:i}}return Y.Fragment=m,Y.jsx=b,Y.jsxs=b,Y}var F={};var G;function te(){return G||(G=1,process.env.NODE_ENV!=="production"&&(function(){function f(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===S?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case C:return"Fragment";case D:return"Profiler";case p:return"StrictMode";case j:return"Suspense";case g:return"SuspenseList";case x:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case P:return"Portal";case W:return e.displayName||"Context";case I:return(e._context.displayName||"Context")+".Consumer";case c:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case t:return r=e.displayName||null,r!==null?r:f(e.type)||"Memo";case u:r=e._payload,e=e._init;try{return f(e(r))}catch{}}return null}function m(e){return""+e}function b(e){try{m(e);var r=!1}catch{r=!0}if(r){r=console;var o=r.error,a=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return o.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",a),m(e)}}function h(e){if(e===C)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===u)return"<...>";try{var r=f(e);return r?"<"+r+">":"<...>"}catch{return"<...>"}}function l(){var e=N.A;return e===null?null:e.getOwner()}function i(){return Error("react-stack-top-frame")}function d(e){if(L.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function y(e,r){function o(){H||(H=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",r))}o.isReactWarning=!0,Object.defineProperty(e,"key",{get:o,configurable:!0})}function O(){var e=f(this.type);return Z[e]||(Z[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function w(e,r,o,a,U,q){var s=o.ref;return e={$$typeof:E,type:e,key:r,props:o,_owner:a},(s!==void 0?s:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:O}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:U}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:q}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function k(e,r,o,a,U,q){var s=r.children;if(s!==void 0)if(a)if(se(s)){for(a=0;a<s.length;a++)v(s[a]);Object.freeze&&Object.freeze(s)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else v(s);if(L.call(r,"key")){s=f(e);var $=Object.keys(r).filter(function(le){return le!=="key"});a=0<$.length?"{key: someKey, "+$.join(": ..., ")+": ...}":"{key: someKey}",ee[s+a]||($=0<$.length?"{"+$.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
2
2
|
let props = %s;
|
|
3
3
|
<%s {...props} />
|
|
4
4
|
React keys must be passed directly to JSX without using spread:
|
|
5
5
|
let props = %s;
|
|
6
|
-
<%s key={someKey} {...props} />`,
|
|
6
|
+
<%s key={someKey} {...props} />`,a,s,$,s),ee[s+a]=!0)}if(s=null,o!==void 0&&(b(o),s=""+o),d(r)&&(b(r.key),s=""+r.key),"key"in r){o={};for(var J in r)J!=="key"&&(o[J]=r[J])}else o=r;return s&&y(o,typeof e=="function"?e.displayName||e.name||"Unknown":e),w(e,s,o,l(),U,q)}function v(e){A(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===u&&(e._payload.status==="fulfilled"?A(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function A(e){return typeof e=="object"&&e!==null&&e.$$typeof===E}var _=T,E=Symbol.for("react.transitional.element"),P=Symbol.for("react.portal"),C=Symbol.for("react.fragment"),p=Symbol.for("react.strict_mode"),D=Symbol.for("react.profiler"),I=Symbol.for("react.consumer"),W=Symbol.for("react.context"),c=Symbol.for("react.forward_ref"),j=Symbol.for("react.suspense"),g=Symbol.for("react.suspense_list"),t=Symbol.for("react.memo"),u=Symbol.for("react.lazy"),x=Symbol.for("react.activity"),S=Symbol.for("react.client.reference"),N=_.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,L=Object.prototype.hasOwnProperty,se=Array.isArray,z=console.createTask?console.createTask:function(){return null};_={react_stack_bottom_frame:function(e){return e()}};var H,Z={},Q=_.react_stack_bottom_frame.bind(_,i)(),K=z(h(i)),ee={};F.Fragment=C,F.jsx=function(e,r,o){var a=1e4>N.recentlyCreatedOwnerStacks++;return k(e,r,o,!1,a?Error("react-stack-top-frame"):Q,a?z(h(e)):K)},F.jsxs=function(e,r,o){var a=1e4>N.recentlyCreatedOwnerStacks++;return k(e,r,o,!0,a?Error("react-stack-top-frame"):Q,a?z(h(e)):K)}})()),F}var X;function ne(){return X||(X=1,process.env.NODE_ENV==="production"?M.exports=re():M.exports=te()),M.exports}var n=ne();const oe=({fillingColor:f,borderfillColor:m,hoverborderColor:b,cellBorderColor:h,cellColor:l,day:i,isSelected:d=!1,cellShape:y,href:O})=>{const w=new Date().toLocaleDateString("en-US",{month:"long",day:"numeric",year:"numeric"}),k=y==="square"?"rounded-md":"rounded-full",v=i===w,A=`
|
|
7
7
|
flex items-center justify-center
|
|
8
8
|
${k} border-2 transition-colors duration-150 hover:scale-150
|
|
9
9
|
${!v&&!d&&b?"hover-border-var":""}
|
|
10
|
-
`,
|
|
10
|
+
`,_=!!(O&&d),E=(p="",D)=>n.jsx("button",{type:"button",className:`${A} ${p} ${_?"cursor-pointer":""}`,style:D}),P=p=>_?n.jsx("a",{href:O,className:"contents",children:p}):p;if(v){const p=n.jsxs("div",{className:"relative flex items-center justify-center w-4 h-4",children:[n.jsx("div",{className:"absolute inset-0 rounded-md rainbow-spin",style:{background:"conic-gradient(from 0deg, #ff0000 0deg, #ff4000 20deg, #ff8000 40deg, #ffbf00 60deg, #ffff00 80deg, #bfff00 100deg, #80ff00 120deg, #40ff00 140deg, #00ff00 160deg, #00ff40 180deg, #00ff80 200deg, #00ffbf 220deg, #00ffff 240deg, #00bfff 260deg, #0080ff 280deg, #0040ff 300deg, #0000ff 320deg, #4000ff 340deg, #8000ff 360deg)",padding:"2px",boxShadow:"0 0 8px rgba(255,0,255,0.35), 0 0 14px rgba(0,255,255,0.25)",borderRadius:"0.5rem"}}),n.jsx("div",{className:`relative flex items-center justify-center w-4 h-4 ${k} p-[2px]`,children:E("today-cell-btn w-full h-full rounded-md border-transparent",{"--border-fill-color":d?m:h,backgroundColor:d?f:l})})]});return P(p)}return P(E("w-4 h-4",d&&!v?{backgroundColor:f,borderColor:m,"--hover-border-color":b}:v?void 0:{backgroundColor:l,"--border-color":h,"--hover-border-color":b}))},B=({fillingColor:f="#50C878",borderfillColor:m="#27592D",hoverborderColor:b="#FFCCCB",cellBorderColor:h="#808080",cellColor:l="#ADADAD",legend:i=!0,mainBorder:d=!0,borderColor:y="#708090",textColor:O="#708090",selectedDates:w=[],title:k="Calendar",cellShape:v="square",column:A=15,legendColumn:_=!1})=>{const E=new Date,{selectedSet:P,hrefMap:C}=T.useMemo(()=>{const c=t=>{if(!t)return"";if(typeof t=="string"){const u=t.split("-");if(u.length===3){const x=u[0],S=String(Number(u[1])).padStart(2,"0"),N=String(Number(u[2])).padStart(2,"0");return`${x}-${S}-${N}`}return t}return typeof t=="object"&&t.day?c(t.day):""},j=new Set,g=new Map;for(const t of w||[]){const u=t&&typeof t=="object"&&t.day?c(t.day):c(t);u&&(j.add(u),t&&typeof t=="object"&&t.href&&g.set(u,t.href))}return{selectedSet:j,hrefMap:g}},[w]),p=T.useMemo(()=>{const c=E.getFullYear(),j=E.getMonth(),g=new Date(c,j-1,1),t=new Date(c,j+2,0),u=[],x=new Date(g);for(;x<=t;){const S=`${x.getFullYear()}-${String(x.getMonth()+1).padStart(2,"0")}-${String(x.getDate()).padStart(2,"0")}`,N=P.has(S),L=C.get(S);u.push({key:S,isSelected:N,href:L,dateObj:new Date(x)}),x.setDate(x.getDate()+1)}return u},[w,E]),D=[],I=A;for(let c=0;c<p.length;c+=I)D.push(p.slice(c,c+I));const W=v==="square"?"rounded-md":"rounded-full";return n.jsxs("div",{className:`inline-flex flex-col gap-2 p-3 rounded-xl ${d?"border shadow-sm":""} `,style:{borderColor:d?y:void 0},children:[i&&n.jsxs("div",{className:`flex ${_?"flex-col items-start":"justify-between"} text-sm`,style:{color:O},children:[n.jsx("strong",{children:k}),n.jsxs("div",{className:"flex items-center gap-2 font-semibold",children:[n.jsxs("div",{className:"relative flex items-center justify-center w-4 h-4",children:[n.jsx("div",{className:"absolute inset-0 rounded-md rainbow-spin",style:{background:"conic-gradient(from 0deg, #ff0000 0deg, #ff4000 20deg, #ff8000 40deg, #ffbf00 60deg, #ffff00 80deg, #bfff00 100deg, #80ff00 120deg, #40ff00 140deg, #00ff00 160deg, #00ff40 180deg, #00ff80 200deg, #00ffbf 220deg, #00ffff 240deg, #00bfff 260deg, #0080ff 280deg, #0040ff 300deg, #0000ff 320deg, #4000ff 340deg, #8000ff 360deg)",padding:"2px",boxShadow:"0 0 8px rgba(255,0,255,0.35), 0 0 14px rgba(0,255,255,0.25)",borderRadius:"0.5rem"}}),n.jsx("div",{className:"relative flex items-center justify-center w-4 h-4 rounded-md p-[2px]",children:n.jsx("button",{type:"button",className:"flex items-center justify-center w-full h-full rounded-md border-2 border-transparent transition-colors duration-150",style:{"--border-fill-color":m,backgroundColor:l}})})]}),n.jsx("span",{children:"Today"})]}),n.jsxs("div",{className:"flex items-center gap-2 font-semibold",children:[n.jsx("button",{type:"button",className:`flex items-center justify-center w-4 h-4 ${W} border-2 border-emerald-600 transition-colors duration-150`,style:{backgroundColor:f,borderColor:m}}),n.jsx("span",{children:"Completed"})]})]}),n.jsx("div",{className:"flex flex-col gap-1",children:D.map((c,j)=>n.jsx("div",{className:"flex gap-1",children:c.map(g=>{const t=g.dateObj.toLocaleDateString("en-US",{month:"long",day:"numeric",year:"numeric"});return n.jsx("div",{className:"tooltip tooltip-top","data-tip":t,children:n.jsx(oe,{fillingColor:f,borderfillColor:m,hoverborderColor:b,cellBorderColor:h,cellColor:l,isSelected:g.isSelected,day:t,href:g.href,cellShape:v})},g.key)})},j))})]})},ae=f=>n.jsx(B,{...f});R.Calendar=B,R.default=ae,Object.defineProperties(R,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-fill-calendar",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.8",
|
|
4
4
|
"description": "Fill dates on a calendar displaying boxes for dates. Customize colors and borders. Perfect for habit tracking or event marking in React applications.",
|
|
5
5
|
"main": "dist/index.umd.cjs",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -28,12 +28,16 @@
|
|
|
28
28
|
"calendar",
|
|
29
29
|
"components"
|
|
30
30
|
],
|
|
31
|
-
"author": "",
|
|
32
|
-
"license": "
|
|
31
|
+
"author": "Robert Foley",
|
|
32
|
+
"license": "MIT",
|
|
33
33
|
"peerDependencies": {
|
|
34
34
|
"react": ">=17.0.0 <20.0.0",
|
|
35
35
|
"react-dom": ">=17.0.0 <20.0.0"
|
|
36
36
|
},
|
|
37
|
+
"repository": {
|
|
38
|
+
"type": "git",
|
|
39
|
+
"url": "https://github.com/apmanager001/react-fill-calendar"
|
|
40
|
+
},
|
|
37
41
|
"devDependencies": {
|
|
38
42
|
"@tailwindcss/postcss": "^4.1.18",
|
|
39
43
|
"@vitejs/plugin-react": "^5.1.2",
|
|
@@ -45,4 +49,4 @@
|
|
|
45
49
|
"tailwindcss": "^4.1.18",
|
|
46
50
|
"vite": "^7.3.1"
|
|
47
51
|
}
|
|
48
|
-
}
|
|
52
|
+
}
|