daily-checkin-popup 0.1.33

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 (6) hide show
  1. package/README.md +139 -0
  2. package/dist/index.cjs +342 -0
  3. package/dist/index.d.cts +116 -0
  4. package/dist/index.d.ts +121 -0
  5. package/dist/index.js +342 -0
  6. package/package.json +62 -0
package/README.md ADDED
@@ -0,0 +1,139 @@
1
+ # daily-checkin-popup
2
+
3
+ Daily check-in popup for React with streak tracking. Zero runtime dependencies, ships its own styles, SSR-safe (Next.js App Router compatible).
4
+
5
+ - Auto-shows **once per day** per browser (localStorage-gated)
6
+ - Tracks consecutive-day **streaks** (missing a day resets to 1)
7
+ - Fully themeable via `--dcp-*` CSS variables
8
+ - Controlled or uncontrolled, plus a headless `useDailyCheckin` hook
9
+
10
+ ## Install
11
+
12
+ ```bash
13
+ npm install daily-checkin-popup
14
+ ```
15
+
16
+ ## Quick start (Next.js / React)
17
+
18
+ Drop it anywhere in your layout — it opens by itself once per day:
19
+
20
+ ```tsx
21
+ 'use client';
22
+
23
+ import { DailyCheckinPopup } from 'daily-checkin-popup';
24
+
25
+ export function DailyCheckin() {
26
+ return (
27
+ <DailyCheckinPopup
28
+ title="Daily Check-in"
29
+ subtitle="Claim your daily bonus!"
30
+ rewards={['+10', '+20', '+30', '+40', '+50', '+75', '+100']}
31
+ onCheckIn={({ streak, date }) => {
32
+ // sync with your backend, credit the reward, etc.
33
+ fetch('/api/v1/checkin', { method: 'POST', body: JSON.stringify({ streak, date }) });
34
+ }}
35
+ />
36
+ );
37
+ }
38
+ ```
39
+
40
+ In Next.js App Router, mark the file `'use client'` (the popup uses state, effects, and `localStorage`).
41
+
42
+ ## Controlled mode
43
+
44
+ Manage visibility yourself (e.g. open from a button):
45
+
46
+ ```tsx
47
+ const [open, setOpen] = useState(false);
48
+
49
+ <button onClick={() => setOpen(true)}>Daily bonus</button>
50
+ <DailyCheckinPopup open={open} onOpenChange={setOpen} />
51
+ ```
52
+
53
+ ## Headless hook
54
+
55
+ Build your own UI on top of the same logic:
56
+
57
+ ```tsx
58
+ import { useDailyCheckin } from 'daily-checkin-popup';
59
+
60
+ const { open, setOpen, streak, checkedInToday, checkIn, reset } = useDailyCheckin({
61
+ storageKey: 'my-app-checkin',
62
+ onCheckIn: ({ streak }) => console.log('streak:', streak),
63
+ });
64
+ ```
65
+
66
+ ## Props
67
+
68
+ | Prop | Type | Default | Description |
69
+ | --- | --- | --- | --- |
70
+ | `open` / `onOpenChange` | `boolean` / `(open) => void` | — | Controlled mode |
71
+ | `autoShow` | `boolean` | `true` | Auto-open once per day (uncontrolled mode) |
72
+ | `autoShowDelay` | `number` | `600` | ms before auto-opening |
73
+ | `storageKey` | `string` | `"daily-checkin"` | localStorage key (use one per app) |
74
+ | `onCheckIn` | `(info: { streak, date }) => void` | — | Fires once per day on check-in |
75
+ | `title` / `subtitle` | `ReactNode` | … | Header text |
76
+ | `days` | `number` | `7` | Tiles in the streak row (streak wraps each cycle) |
77
+ | `rewards` | `ReactNode[]` | `Day N` | Label under each tile |
78
+ | `doneIcon` / `pendingIcon` | `ReactNode` | `✓` / `🎁` | Tile icons |
79
+ | `buttonLabel` / `checkedInLabel` | `ReactNode` | `Check in` / `Checked in ✓` | Button text |
80
+ | `closeDelay` | `number` | `1500` | Auto-close ms after check-in (`0` = stay open) |
81
+ | `closeOnOverlayClick` | `boolean` | `true` | Click backdrop to dismiss |
82
+ | `className` | `string` | — | Extra class on the card |
83
+
84
+ ## Theming
85
+
86
+ All visuals read CSS variables with sensible fallbacks. Define them globally or per theme:
87
+
88
+ ```css
89
+ :root {
90
+ --dcp-accent: #6366f1; /* buttons, active tiles, streak count */
91
+ --dcp-accent-text: #fff;
92
+ --dcp-bg: #ffffff; /* card background */
93
+ --dcp-text: #1a1a2e;
94
+ --dcp-muted: #6b7280;
95
+ --dcp-day-bg: #f3f4f6;
96
+ --dcp-day-done-bg: rgba(99, 102, 241, 0.12);
97
+ --dcp-success: #10b981;
98
+ --dcp-overlay-bg: rgba(0, 0, 0, 0.55);
99
+ --dcp-radius: 16px;
100
+ --dcp-max-width: 400px;
101
+ --dcp-z-index: 1000;
102
+ }
103
+
104
+ [data-theme='dark'] {
105
+ --dcp-bg: #16161f;
106
+ --dcp-text: #e5e7eb;
107
+ --dcp-day-bg: #23232f;
108
+ --dcp-hover: rgba(255, 255, 255, 0.08);
109
+ }
110
+ ```
111
+
112
+ ## Using it locally (before publishing)
113
+
114
+ From any project:
115
+
116
+ ```bash
117
+ npm install /path/to/daily-checkin-popup
118
+ # or, for live development:
119
+ cd ~/daily-checkin-popup && npm link
120
+ cd ~/your-project && npm link daily-checkin-popup
121
+ ```
122
+
123
+ ## Publishing to npm
124
+
125
+ ```bash
126
+ cd ~/daily-checkin-popup
127
+ npm login
128
+ npm publish --access public # scoped packages need --access public
129
+ ```
130
+
131
+ Rename the package in `package.json` if you want a different scope/name.
132
+
133
+ ## Development
134
+
135
+ ```bash
136
+ npm install
137
+ npm run build # outputs dist/ (ESM + CJS + .d.ts)
138
+ npm run dev # watch mode
139
+ ```
package/dist/index.cjs ADDED
@@ -0,0 +1,342 @@
1
+ "use strict";var te=Object.defineProperty,Be=Object.defineProperties,je=Object.getOwnPropertyDescriptor,Qe=Object.getOwnPropertyDescriptors,He=Object.getOwnPropertyNames,ee=Object.getOwnPropertySymbols;var de=Object.prototype.hasOwnProperty,ge=Object.prototype.propertyIsEnumerable;var be=(e,t,n)=>t in e?te(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,H=(e,t)=>{for(var n in t||(t={}))de.call(t,n)&&be(e,n,t[n]);if(ee)for(var n of ee(t))ge.call(t,n)&&be(e,n,t[n]);return e},ne=(e,t)=>Be(e,Qe(t));var he=(e,t)=>{var n={};for(var a in e)de.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(e!=null&&ee)for(var a of ee(e))t.indexOf(a)<0&&ge.call(e,a)&&(n[a]=e[a]);return n};var Oe=(e,t)=>{for(var n in t)te(e,n,{get:t[n],enumerable:!0})},Ue=(e,t,n,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let c of He(t))!de.call(e,c)&&c!==n&&te(e,c,{get:()=>t[c],enumerable:!(a=je(t,c))||a.enumerable});return e};var Fe=e=>Ue(te({},"__esModule",{value:!0}),e);var We={};Oe(We,{DailyCheckinPopup:()=>Te,locales:()=>X,useDailyCheckin:()=>oe});module.exports=Fe(We);var j=require("react"),Ie=require("react-dom");var Me=`
2
+ .dcp-overlay {
3
+ position: fixed;
4
+ inset: 0;
5
+ z-index: var(--dcp-z-index, 1000);
6
+ display: flex;
7
+ align-items: center;
8
+ justify-content: center;
9
+ padding: 72px 16px 16px;
10
+ background: var(--dcp-overlay-bg, rgba(0, 0, 0, 0.6));
11
+ backdrop-filter: blur(4px);
12
+ animation: dcp-fade-in 0.2s ease;
13
+ }
14
+ .dcp-card {
15
+ position: relative;
16
+ width: 100%;
17
+ max-width: var(--dcp-max-width, 315px);
18
+ border-radius: var(--dcp-radius, 40px);
19
+ background: var(--dcp-bg, #00a26d);
20
+ color: var(--dcp-text, var(--dcp-secondary, #ffffff));
21
+ // box-shadow: var(--dcp-shadow, 0 20px 50px rgba(0, 0, 0, 0.3));
22
+ padding: 60px 16px 36px;
23
+ text-align: center;
24
+ font-family: var(--dcp-font, 'Inter', system-ui, -apple-system, sans-serif);
25
+ animation: dcp-pop-in 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
26
+ }
27
+ /* \u2500\u2500 Top badge: outer green ring \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
28
+ .dcp-modal-img-wrap {
29
+ position: absolute;
30
+ top: -24px;
31
+ left: 50%;
32
+ transform: translateX(-50%);
33
+ display: flex;
34
+ align-items: center;
35
+ justify-content: center;
36
+ width: 88px;
37
+ height: 88px;
38
+ border-radius: 50%;
39
+ background: var(--dcp-bg, #00a26d);
40
+ // box-shadow: 0 4px 16px rgba(0,0,0,0.18);
41
+ }
42
+ /* \u2500\u2500 Inner white circle \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
43
+ .dcp-wrap-with-img {
44
+ display: flex;
45
+ align-items: center;
46
+ justify-content: center;
47
+ width: 60px;
48
+ height: 60px;
49
+ border-radius: 50%;
50
+ background: var(--dcp-secondary, #ffffff);
51
+ overflow: hidden;
52
+ }
53
+ /* \u2500\u2500 Coin image inside \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
54
+ .dcp-badge-img {
55
+ width: 40px;
56
+ height: 40px;
57
+ object-fit: contain;
58
+ }
59
+ /* \u2500\u2500 SVG coin fallback (when no badgeImageUrl) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
60
+ .dcp-wrap-with-img .dcp-coin {
61
+ width: 44px;
62
+ height: 44px;
63
+ }
64
+ .dcp-close {
65
+ display:none !important;
66
+ position: absolute;
67
+ top: 14px;
68
+ right: 14px;
69
+ width: 32px;
70
+ height: 32px;
71
+ display: flex;
72
+ align-items: center;
73
+ justify-content: center;
74
+ background: rgba(255, 255, 255, 0.15);
75
+ border: none;
76
+ border-radius: 50%;
77
+ color: #ffffff;
78
+ font-size: 20px;
79
+ line-height: 1;
80
+ cursor: pointer;
81
+ transition: background 0.2s;
82
+ z-index: 10;
83
+ padding: 0;
84
+ }
85
+ .dcp-close:hover {
86
+ background: rgba(255, 255, 255, 0.3);
87
+ }
88
+ .dcp-title {
89
+ margin: 15px 0 8px;
90
+ font-size: 30px;
91
+ font-weight: 700;
92
+ letter-spacing: -0.5px;
93
+ color: var(--dcp-text, var(--dcp-secondary, #ffffff));
94
+ }
95
+ .dcp-subtitle {
96
+ display: flex;
97
+ align-items: center;
98
+ justify-content: center;
99
+ gap: 6px;
100
+ // margin: 15px 0 5px;
101
+ font-size: 16px;
102
+ // font-weight: 600;
103
+ }
104
+ .dcp-subtitle .dcp-coin {
105
+ width: 15px;
106
+ height: 15px;
107
+ }
108
+ .dcp-note {
109
+ // margin: 0 0 24px;
110
+ font-size: 10px;
111
+ font-weight: 500;
112
+ opacity: 0.85;
113
+ // line-height: 1.4;
114
+ margin-bottom:40px;
115
+ }
116
+ .dcp-days {
117
+ // display: flex;
118
+ // flex-wrap: wrap;
119
+ // justify-content: center;
120
+ // gap: 12px;
121
+ // margin-bottom: 28px;
122
+ display: grid !important;
123
+ grid-template-columns: repeat(3, 1fr) !important;
124
+ grid-gap: 14px !important;
125
+ margin-top: -20px !important;
126
+ grid-auto-rows: auto !important;
127
+ padding: 0 15px;
128
+ }
129
+ .dcp-day {
130
+ // position: relative;
131
+ // display: flex;
132
+ // flex-direction: column;
133
+ // align-items: center;
134
+ // gap: 8px;
135
+ // padding: 18px 6px 14px;
136
+ // border-radius: 12px;
137
+ // background: var(--dcp-day-bg, rgba(0, 0, 0, 0.15));
138
+ // color: rgba(255, 255, 255, 0.6);
139
+ // flex: 0 1 calc((100% - (var(--dcp-columns, 3) - 1) * 20px) / var(--dcp-columns, 3));
140
+ // box-sizing: border-box;
141
+ // border: 1.5px solid transparent;
142
+ // overflow: hidden;
143
+ // transition: transform 0.2s ease, background-color 0.2s ease;
144
+ position: relative !important;
145
+ display: flex !important;
146
+ flex-direction: column !important;
147
+ justify-content: space-between !important;
148
+ border: 1.5px solid transparent;
149
+ border-radius: 6px !important;
150
+ padding: 12px !important;
151
+ animation: fade-anim .3s linear !important;
152
+ animation-fill-mode: both !important;
153
+ max-height: 118px !important;
154
+ max-width: 78px !important;
155
+ background: var(--dcp-day-bg, rgba(0, 0, 0, 0.15));
156
+ color:#ffffff8a;
157
+ }
158
+ .dcp-day-done {
159
+ background: var(--dcp-day-done-bg, rgba(0, 0, 0, 0.08));
160
+ border: 1.5px solid var(--dcp-secondary, #ffffff);
161
+ color: var(--dcp-text, var(--dcp-secondary, #ffffff));
162
+ }
163
+ .dcp-day-today {
164
+ background: var(--dcp-day-active-bg, var(--dcp-secondary, #ffffff));
165
+ border: 1.5px solid var(--dcp-secondary, #ffffff);
166
+ color: var(--dcp-accent, #00a26d);
167
+ box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
168
+ }
169
+ .dcp-day-check {
170
+ position: absolute;
171
+ top: 0;
172
+ right: 0;
173
+ display: flex;
174
+ align-items: center;
175
+ justify-content: center;
176
+ width: 24px;
177
+ height: 24px;
178
+ border-radius: 0 0 0 100%;
179
+ background: rgba(255, 255, 255, 0.2);
180
+ color: var(--dcp-secondary, #ffffff);
181
+ font-size: 15px;
182
+ font-weight: 900;
183
+ line-height: 1;
184
+ padding-bottom: 5px;
185
+ padding-left: 5px;
186
+ box-sizing: border-box;
187
+ }
188
+ .dcp-day-check-img {
189
+ position: absolute;
190
+ top: -1px;
191
+ right: -1px;
192
+ width: 20px;
193
+ height: 20px;
194
+ object-fit: contain;
195
+ pointer-events: none;
196
+ }
197
+ .dcp-day-name {
198
+ font-size: 10px;
199
+ font-weight: 700;
200
+ }
201
+ .dcp-day-value {
202
+ font-size: 20px;
203
+ font-weight: 700;
204
+ line-height: 1;
205
+ margin:6px 0 10px;
206
+ }
207
+ .dcp-day-unit {
208
+ display: flex;
209
+ align-items: center;
210
+ justify-content: center;
211
+ gap: 4px;
212
+ font-size: 10px;
213
+ font-weight: 700;
214
+ }
215
+ .dcp-day-unit .dcp-coin {
216
+ width: 14px;
217
+ height: 14px;
218
+ }
219
+ .dcp-button {
220
+ display: flex;
221
+ align-items: center;
222
+ justify-content: center;
223
+ width: 190px;
224
+ height: 40px;
225
+ margin: 8px auto 0;
226
+ padding: 0;
227
+ border: none;
228
+ border-radius: 999px;
229
+ background: var(--dcp-button-bg, var(--dcp-secondary, #ffffff));
230
+ color: var(--dcp-accent, #00a26d);
231
+ font-size: 18px;
232
+ font-weight: 700;
233
+ line-height: 1;
234
+ letter-spacing: 0.5px;
235
+ transition: transform 0.1s ease, box-shadow 0.1s ease;
236
+ margin-top: 30px;
237
+ }
238
+ .dcp-button:not(:disabled) {
239
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(255, 255, 255, 0);
240
+ animation: shadow-pulse 1.5s infinite;
241
+ animation-delay: 0.5s;
242
+ cursor: pointer;
243
+ }
244
+ .dcp-button:hover:not(:disabled) {
245
+ transform: translateY(-1px);
246
+ box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15), 0 8px 8px rgba(0, 0, 0, 0.08), 0 0 0 0 rgba(255, 255, 255, 0);
247
+ }
248
+ .dcp-button:active:not(:disabled) {
249
+ transform: translateY(0);
250
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(255, 255, 255, 0);
251
+ }
252
+ .dcp-button:disabled {
253
+ // opacity: 0.6;
254
+ box-shadow: none;
255
+ animation: none;
256
+ cursor: not-allowed;
257
+ }
258
+ @keyframes dcp-fade-in {
259
+ from { opacity: 0; }
260
+ to { opacity: 1; }
261
+ }
262
+ @keyframes dcp-pop-in {
263
+ from { opacity: 0; transform: scale(0.92) translateY(8px); }
264
+ to { opacity: 1; transform: scale(1) translateY(0); }
265
+ }
266
+ .dcp-btn-message {
267
+ display: flex;
268
+ align-items: center;
269
+ justify-content: center;
270
+ gap: 8px;
271
+ height: 100%;
272
+ }
273
+ .dcp-loading-message svg {
274
+ width: 32px;
275
+ height: 24px;
276
+ }
277
+ .dcp-loading-circle {
278
+ fill: var(--dcp-accent, #00a26d);
279
+ animation: dcp-dot-pulse 1.2s infinite both;
280
+ }
281
+ .dcp-loading-circle:nth-child(1) {
282
+ animation-delay: 0s;
283
+ }
284
+ .dcp-loading-circle:nth-child(2) {
285
+ animation-delay: 0.2s;
286
+ }
287
+ .dcp-loading-circle:nth-child(3) {
288
+ animation-delay: 0.4s;
289
+ }
290
+ .dcp-success-message span {
291
+ animation: dcp-fade-in 0.2s ease;
292
+ }
293
+ @keyframes dcp-dot-pulse {
294
+ 0%, 80%, 100% {
295
+ opacity: 0.2;
296
+ }
297
+ 40% {
298
+ opacity: 1;
299
+ }
300
+ }
301
+ @keyframes shadow-pulse {
302
+ 0% {
303
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(255, 255, 255, 0.4);
304
+ }
305
+ 70% {
306
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 10px rgba(255, 255, 255, 0);
307
+ }
308
+ 100% {
309
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(255, 255, 255, 0);
310
+ }
311
+ }
312
+ @media (prefers-reduced-motion: reduce) {
313
+ .dcp-overlay, .dcp-card { animation: none; }
314
+ }
315
+ .dcp-particles {
316
+ position: fixed;
317
+ inset: 0;
318
+ pointer-events: none;
319
+ z-index: 99999;
320
+ overflow: hidden;
321
+ }
322
+ .dcp-particle {
323
+ position: absolute;
324
+ pointer-events: none;
325
+ transition: top 5s linear, left 5s linear, transform 5s linear;
326
+ }
327
+ /* \u2500\u2500 Dark Mode overrides \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
328
+ .dcp-card.dcp-dark .dcp-button {
329
+ background: #1c1d22 !important;
330
+ color: #ffffff !important;
331
+ }
332
+ .dcp-card.dcp-dark .dcp-day-done {
333
+ background: #1c1d22 !important;
334
+ border: 1.5px solid transparent !important;
335
+ color: #ffffff !important;
336
+ }
337
+ .dcp-card.dcp-dark .dcp-day-today {
338
+ background: #1c1d22 !important;
339
+ border: 1.5px solid transparent !important;
340
+ color: #ffffff !important;
341
+ }
342
+ `,pe=!1;function ye(){if(pe||typeof document=="undefined")return;if(document.getElementById("dcp-styles")){pe=!0;return}let e=document.createElement("style");e.id="dcp-styles",e.textContent=Me,document.head.appendChild(e),pe=!0}var u=require("react");function T(e=new Date){let t=e.getFullYear(),n=String(e.getMonth()+1).padStart(2,"0"),a=String(e.getDate()).padStart(2,"0");return`${t}-${n}-${a}`}function ue(){let e=new Date;return e.setDate(e.getDate()-1),T(e)}function xe(e){if(!e)return null;if(e instanceof Date)return T(e);if(typeof e=="number")return T(new Date(e));if(typeof e=="string"){if(/^\d{4}-\d{2}-\d{2}$/.test(e))return e;if(/^\d+$/.test(e))return T(new Date(Number(e)));try{let t=new Date(e);if(!isNaN(t.getTime()))return T(t)}catch(t){}}return null}function Ke(e){if(typeof window=="undefined")return{lastCheckin:null,streak:0};try{let t=window.localStorage.getItem(e);if(!t)return{lastCheckin:null,streak:0};let n=JSON.parse(t);return{lastCheckin:typeof n.lastCheckin=="string"?n.lastCheckin:null,streak:typeof n.streak=="number"?n.streak:0}}catch(t){return{lastCheckin:null,streak:0}}}function ae(e,t){try{window.localStorage.setItem(e,JSON.stringify(t))}catch(n){}}function oe(e={}){let{storageKey:t="daily-checkin",autoShow:n=!0,autoShowDelay:a=600,onCheckIn:c,baseUrl:s,sessionKey:d,locale:b="en",apiHeaders:S,lastShownDate:I,onStreakDataFetch:O,onApiResponse:J}=e,D=(0,u.useRef)(c),U=(0,u.useRef)(O),g=(0,u.useRef)(J);(0,u.useEffect)(()=>{D.current=c,U.current=O,g.current=J});let[G,W]=(0,u.useState)(!1),[E,Q]=(0,u.useState)({lastCheckin:null,streak:0}),[f,F]=(0,u.useState)(null),[Z,z]=(0,u.useState)(!1);(0,u.useEffect)(()=>{let w=Ke(t);Q(w)},[t]),(0,u.useEffect)(()=>{z(!1),F(null)},[d,s]),(0,u.useEffect)(()=>{if(!n||Z)return;let w=T();if(s){if(!f)return;let h=f.allowClaim===0,r=!h;if(r&&I!==void 0&&I!==null){let i=xe(I)!==w;r=!h}if(r){let l=window.setTimeout(()=>{W(!0),z(!0)},a);return()=>window.clearTimeout(l)}else z(!0)}else{let h=E.lastCheckin===w,r=!h;if(r&&I!==void 0&&I!==null){let i=xe(I)!==w;r=!h}if(r){let l=window.setTimeout(()=>{W(!0),z(!0)},a);return()=>window.clearTimeout(l)}else z(!0)}},[n,a,I,s,f,E.lastCheckin,Z]),(0,u.useEffect)(()=>{if(!s)return;(async()=>{var h,r,l;try{let i=H({"Content-Type":"application/json","Accept-Language":b},S);d&&(i.Sessionkey=d);let p=await fetch(`${s}/user/coins/get_daily_streak_coins`,{method:"POST",headers:i}),x=null;try{x=await p.json()}catch(y){x={message:p.statusText,status:p.status}}if((h=U.current)==null||h.call(U,x),(r=g.current)==null||r.call(g,"fetch",x),p.ok&&x&&typeof x=="object"){let y=x.data||x,R=y.allow_claim!==void 0?Number(y.allow_claim):null,B=y.current_day!==void 0?Number(y.current_day):null,q=Array.isArray(y.daily_streak_coins)?y.daily_streak_coins:null;if(R!==null&&B!==null&&q!==null){F({allowClaim:R,currentDay:B,dailyStreakCoins:q});let L=R===0,N=L?B:B-1,v={lastCheckin:L?T():ue(),streak:N};ae(t,v),Q(v)}else{let L=typeof y.streak=="number"?y.streak:null,N=typeof y.lastCheckin=="string"?y.lastCheckin:null;(L!==null||N!==null)&&Q(v=>{let M={lastCheckin:N!==null?N:v.lastCheckin,streak:L!==null?L:v.streak};return ae(t,M),M})}}else if(!p.ok)throw new Error(`HTTP error! status: ${p.status}`)}catch(i){console.error("Failed to fetch daily streak coins:",i),(l=g.current)==null||l.call(g,"fetch",{message:(i==null?void 0:i.message)||"Network error, please try again.",error:i})}})()},[G,s,t,d,b,S]);let C=T(),ce=f?f.allowClaim===0:E.lastCheckin===C,$=f?f.allowClaim===0?f.currentDay:f.currentDay-1:E.lastCheckin===C||E.lastCheckin===ue()?E.streak:0,se=(0,u.useCallback)(async()=>{var w,h;if(f){let r=null;if(s){let l=H({"Content-Type":"application/json","Accept-Language":b},S);d&&(l.Sessionkey=d);try{let i=await fetch(`${s}/user/coins/claim_coins`,{method:"POST",headers:l});try{r=await i.json()}catch(p){r={message:i.statusText,status:i.status}}(w=g.current)==null||w.call(g,"claim",r)}catch(i){console.error("Failed to claim coins:",i),r={message:(i==null?void 0:i.message)||"Network error, please try again.",error:i},(h=g.current)==null||h.call(g,"claim",r)}}F(l=>{var x;if(!l)return null;let i=l.currentDay,p=T();return(x=D.current)==null||x.call(D,{streak:i,date:p,apiResponse:r}),ae(t,{lastCheckin:p,streak:i}),ne(H({},l),{allowClaim:0})})}else Q(r=>{var p;let l=T();if(r.lastCheckin===l)return r;let i={lastCheckin:l,streak:r.lastCheckin===ue()?r.streak+1:1};return ae(t,i),(p=D.current)==null||p.call(D,{streak:i.streak,date:l}),i})},[f,s,t,d,b,S]),P=(0,u.useCallback)(()=>{try{window.localStorage.removeItem(t)}catch(w){}Q({lastCheckin:null,streak:0}),F(null)},[t]);return{open:G,setOpen:W,streak:$,checkedInToday:ce,checkIn:se,reset:P,dailyStreakCoins:(f==null?void 0:f.dailyStreakCoins)||void 0}}var X={en:{title:"Daily Check-in",subtitle:"Check in to get {coin} {reward}",note:"You must claim daily bonus every day to form a streak!",dayLabel:"Day {num}",buttonLabel:"CLAIM",checkedInLabel:"SUCCESS",unitLabel:"Token"},es:{title:"Registro Diario",subtitle:"\xA1Reg\xEDstrate para obtener {coin} {reward}!",note:"\xA1Debes reclamar el bono diario todos los d\xEDas para mantener tu racha!",dayLabel:"D\xEDa {num}",buttonLabel:"RECLAMAR",checkedInLabel:"\xC9XITO",unitLabel:"Fichas"},fr:{title:"Check-in Quotidien",subtitle:"Connectez-vous pour obtenir {coin} {reward}",note:"Vous devez r\xE9clamer le bonus quotidien chaque jour pour former une s\xE9rie !",dayLabel:"Jour {num}",buttonLabel:"R\xC9CLAMER",checkedInLabel:"SUCC\xC8S",unitLabel:"Jetons"},de:{title:"T\xE4glicher Check-in",subtitle:"Checken Sie ein, um {coin} {reward} zu erhalten",note:"Sie m\xFCssen jeden Tag den t\xE4glichen Bonus beanspruchen, um eine serie aufzubauen!",dayLabel:"Tag {num}",buttonLabel:"BEANSPRUCHEN",checkedInLabel:"ERFOLGREICH",unitLabel:"Token"},hi:{title:"\u0926\u0948\u0928\u093F\u0915 \u091A\u0947\u0915-\u0907\u0928",subtitle:"{coin} {reward} \u092A\u094D\u0930\u093E\u092A\u094D\u0924 \u0915\u0930\u0928\u0947 \u0915\u0947 \u0932\u093F\u090F \u091A\u0947\u0915 \u0907\u0928 \u0915\u0930\u0947\u0902",note:"\u0932\u0917\u093E\u0924\u093E\u0930 \u0938\u093F\u0932\u0938\u093F\u0932\u093E (streak) \u092C\u0928\u093E\u090F \u0930\u0916\u0928\u0947 \u0915\u0947 \u0932\u093F\u090F \u0906\u092A\u0915\u094B \u0939\u0930 \u0926\u093F\u0928 \u0926\u0948\u0928\u093F\u0915 \u092C\u094B\u0928\u0938 \u0915\u093E \u0926\u093E\u0935\u093E \u0915\u0930\u0928\u093E \u0939\u094B\u0917\u093E!",dayLabel:"\u0926\u093F\u0928 {num}",buttonLabel:"\u0926\u093E\u0935\u093E \u0915\u0930\u0947\u0902",checkedInLabel:"\u0938\u092B\u0932",unitLabel:"\u091F\u094B\u0915\u0928"},zh:{title:"\u6BCF\u65E5\u7B7E\u5230",subtitle:"\u7B7E\u5230\u4EE5\u83B7\u5F97 {coin} {reward}",note:"\u60A8\u5FC5\u987B\u6BCF\u5929\u9886\u53D6\u6BCF\u65E5\u5956\u52B1\u4EE5\u4FDD\u6301\u8FDE\u7EED\u7B7E\u5230\uFF01",dayLabel:"\u7B2C {num} \u5929",buttonLabel:"\u9886\u53D6",checkedInLabel:"\u6210\u529F",unitLabel:"\u4EE3\u5E01"},pt:{title:"Check-in Di\xE1rio",subtitle:"Fa\xE7a check-in para obter {coin} {reward}",note:"Voc\xEA deve reivindicar o b\xF4nus di\xE1rio todos os dias para manter uma sequ\xEAncia!",dayLabel:"Dia {num}",buttonLabel:"REIVINDICAR",checkedInLabel:"SUCESSO",unitLabel:"Fichas"},ja:{title:"\u30C7\u30A4\u30EA\u30FC\u30C1\u30A7\u30C3\u30AF\u30A4\u30F3",subtitle:"\u30C1\u30A7\u30C3\u30AF\u30A4\u30F3\u3057\u3066 {coin} {reward} \u3092\u7372\u5F97",note:"\u30B9\u30C8\u30EA\u30FC\u30AF\u3092\u7EF4\u6301\u3059\u308B\u306B\u306F\u3001\u6BCE\u65E5\u30C7\u30A4\u30EA\u30FC\u30DC\u30FC\u30CA\u30B9\u3092\u53D7\u3051\u53D6\u308B\u5FC5\u8981\u304C\u3042\u308A\u307E\u3059\uFF01",dayLabel:"{num} \u65E5\u76EE",buttonLabel:"\u53D7\u3051\u53D6\u308B",checkedInLabel:"\u6210\u529F",unitLabel:"\u30C8\u30FC\u30AF\u30F3"},ko:{title:"\uC77C\uC77C \uCCB4\uD06C\uC778",subtitle:"{coin} {reward}\uC744(\uB97C) \uBC1B\uC73C\uB824\uBA74 \uCCB4\uD06C\uC778\uD558\uC138\uC694",note:"\uC2A4\uD2B8\uB9AD\uC744 \uC720\uC9C0\uD558\uB824\uBA74 \uB9E4\uC77C \uC77C\uC77C \uBCF4\uB108\uC2A4\uB97C \uBC1B\uC544\uC57C \uD569\uB2C8\uB2E4!",dayLabel:"{num} \uC77C\uCC28",buttonLabel:"\uBC1B\uAE30",checkedInLabel:"\uC131\uACF5",unitLabel:"\uD1A0\uD070"},it:{title:"Check-in Giornaliero",subtitle:"Accedi per ottenere {coin} {reward}",note:"Devi riscattare il bonus giornaliero ogni giorno per mantenere la serie!",dayLabel:"Giorno {num}",buttonLabel:"RISCATTA",checkedInLabel:"SUCCESSO",unitLabel:"Gettoni"},ru:{title:"\u0415\u0436\u0435\u0434\u043D\u0435\u0432\u043D\u044B\u0439 \u0432\u0445\u043E\u0434",subtitle:"\u0412\u043E\u0439\u0434\u0438\u0442\u0435, \u0447\u0442\u043E\u0431\u044B \u043F\u043E\u043B\u0443\u0447\u0438\u0442\u044C {coin} {reward}",note:"\u0412\u044B \u0434\u043E\u043B\u0436\u043D\u044B \u0437\u0430\u0431\u0438\u0440\u0430\u0442\u044C \u0435\u0436\u0435\u0434\u043D\u0435\u0432\u043D\u044B\u0439 \u0431\u043E\u043D\u0443\u0441 \u043A\u0430\u0436\u0434\u044B\u0439 \u0434\u0435\u043D\u044C, \u0447\u0442\u043E\u0431\u044B \u0441\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C \u0441\u0435\u0440\u0438\u044E!",dayLabel:"\u0414\u0435\u043D\u044C {num}",buttonLabel:"\u0417\u0410\u0411\u0420\u0410\u0422\u042C",checkedInLabel:"\u0423\u0421\u041F\u0415\u0428\u041D\u041E",unitLabel:"\u0422\u043E\u043A\u0435\u043D"},ar:{title:"\u062A\u0633\u062C\u064A\u0644 \u0627\u0644\u0648\u0635\u0648\u0644 \u0627\u0644\u064A\u0648\u0645\u064A",subtitle:"\u0633\u062C\u0644 \u0627\u0644\u0648\u0635\u0648\u0644 \u0644\u0644\u062D\u0635\u0648\u0644 \u0639\u0644\u0649 {coin} {reward}",note:"\u064A\u062C\u0628 \u0639\u0644\u064A\u0643 \u0627\u0644\u0645\u0637\u0627\u0644\u0628\u0629 \u0628\u0627\u0644\u0645\u0643\u0627\u0641\u0623\u0629 \u0627\u0644\u064A\u0648\u0645\u064A\u0629 \u0643\u0644 \u064A\u0648\u0645 \u0644\u062A\u0634\u0643\u064A\u0644 \u0633\u0644\u0633\u0644\u0629 \u0645\u062A\u062A\u0627\u0644\u064A\u0629!",dayLabel:"\u0627\u0644\u064A\u0648\u0645 {num}",buttonLabel:"\u0645\u0637\u0627\u0644\u0628\u0629",checkedInLabel:"\u0646\u062C\u0627\u062D",unitLabel:"\u0631\u0645\u0632"}};function ke(e,t){let n=/\{([^}]+)\}/g,a=[],c=0,s;for(;(s=n.exec(e))!==null;){let b=s[1],S=e.slice(c,s.index);S&&a.push(S),b in t?a.push(t[b]):a.push(s[0]),c=n.lastIndex}let d=e.slice(c);return d&&a.push(d),a}function we(e,t){return e.replace("{num}",String(t))}var V=require("react"),K=require("react/jsx-runtime"),Ce=["#2ecc71","#3498db","#e67e22","#e67e22","#e74c3c"],ie=window.innerHeight,re=300,k=(e,t)=>e+Math.floor(Math.random()*(t-e)),Ae=()=>Ce[k(0,Ce.length)];function Se({count:e}){let t=[],n=[Ve,ve,ve],a=e;for(;a--;){let c=n[k(0,3)];t.push((0,K.jsx)(c,{},a))}return(0,K.jsx)("div",{className:"dcp-particles",children:t})}function ve(){let e=(0,V.useRef)(null),t=k(5,10),n=k(0,window.innerWidth),a=k(-ie,0),c=k(0,45),s={backgroundColor:Ae(),width:`${t}px`,height:`${t}px`,borderRadius:`${t}px`,transform:`rotateZ(${c}deg)`,left:`${n}px`,top:`${a}px`};return(0,V.useEffect)(()=>{let d=e.current;d&&(d.offsetHeight,d.style.top=`${window.innerHeight+k(0,ie)}px`,d.style.left=`${n+k(-re,re)}px`)},[n]),(0,K.jsx)("div",{ref:e,className:"dcp-particle",style:s})}function Ve(){let e=(0,V.useRef)(null),t=k(15,45),n=k(0,window.innerWidth),a=k(-ie,0),c=Ae(),s=k(-15,15),d={fill:c,width:`${t}px`,height:`${t}px`,transform:`rotateZ(${s}deg)`,left:`${n}px`,top:`${a}px`};return(0,V.useEffect)(()=>{let b=e.current;b&&(b.offsetHeight,b.style.top=`${window.innerHeight+k(0,ie)}px`,b.style.left=`${n+k(-re,re)}px`,b.style.transform=`rotateZ(${k(-15,15)}deg)`)},[n]),(0,K.jsx)("svg",{ref:e,className:"dcp-particle",style:d,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",children:(0,K.jsx)("path",{fill:c,d:"M428.127,0l-12.716,10.062l12.718-10.06c8.785,11.101,19.716,24.917,19.716,51.051 s-10.932,39.951-19.716,51.053c-7.382,9.331-12.716,16.072-12.716,30.927c0,14.854,5.334,21.594,12.716,30.925 c8.784,11.101,19.716,24.917,19.716,51.05c0,26.135-10.931,39.949-19.715,51.051c-7.383,9.331-12.717,16.072-12.717,30.927 c0,14.855,5.332,21.593,12.711,30.919l-25.435,20.124c-8.781-11.097-19.708-24.909-19.708-51.042 c0-26.135,10.931-39.949,19.715-51.051c7.383-9.331,12.717-16.072,12.717-30.927c0-14.855-5.335-21.595-12.717-30.926 c-8.784-11.101-19.715-24.916-19.715-51.049s10.931-39.95,19.715-51.051c7.383-9.331,12.717-16.072,12.717-30.928 c0-14.855-5.335-21.596-12.718-30.927L428.127,0z"})})}var o=require("react/jsx-runtime"),Ne="data:image/webp;base64,UklGRkoEAABXRUJQVlA4WAoAAAAQAAAALwAALwAAQUxQSEkBAAABkGvb2rFXO7Zt+wJSJaVqu2Rlu7KdOiOd0zk5tm3bxvf/73vw4X2fK4iICYBxt/zFGx9/MaZ8ebjd5QvZAVWHTFw3e9zrIsNj8BcXaF5yFGXf8JELVhbExN7iEt/7CEj7wKWasgxVm7hkVmqgmstnWbrSTAS4kqQj9gMn+ctHw/4WJ/pSo5FTZY0qHh/I8N8qg5zwHICAn5QUAFWcdBqwSWsbbr9pfUY+p82iponx5h1qiw+oHXtP7bpC7elXag+fULt8mdruBrW5TmplmcTM9u6/aD0A1mmNAvmkWBDg8ILSbQCoJsSS/3N4R+cMVHvIsCg1nKUyBU2HLzROQ2fKbwpvrPUg+Y2872HQH3NP1ssAGPV9LeecNYx7nGLizPMQm/tBEDsdBuEtnwSwu6mQmtR3g+lhj0d8IN83vWvp2I1H1/emS1wgEABWUDgg2gIAAFAQAJ0BKjAAMAA+bTCRRaQjIZcaBmRABsS2AE6ZQjsP3jzBKV/KPvLtCJAu0zGr6gNsx5iP2F/bHsW/5L1AP256xj0K/Lg/bH4Of3E/bf2kU+3LWqqR9opDfL/wFrW1w3oQUN1Ppz9kIubudiXuf3Yx6IpARwAfSwhi2XeuXpChwtAxGeB9kz17cAAA/vYJ09WTT3xCi1J9Jq3tXE4YiM0kubBPCG18gILYn/mcSuXKecVYx+VH8+/3Jaw71cqA3QUMorqXx+0HY5lRjzZoSpwUOrZsn5l2sq5FvGHjeiYhTMdP/vMao9xPicytNu792iLMMXYqSBrx/87XDP76mt0wJ4fNR+kRLk+0X7FWQInSVOEUye3HoEhBE79oHHIjfJzKzETvSMr8mVg0C+2cciKNc+RzbWS9bIugTZHFJH0iKfsMeIYL16bX3SgxJ48n39jLpm8dWE4pM6V4RDWJ2PnKM5s2spJRoMx0mbHKaQHSlsjaHaHvlgQzVgDI/UGKZGaiSmGMczxKaYHfxLF98uSVH2uaxsvvUz++XiK9SoUF1AYTQgTobO85hrO5yIU7xv6ydCMpVSrWr9lONlhPOIDGfU74TFvJsXjITMijzHVRZAKUDUgrjEl8e1cGC48efqTBQgyVu8TldkR07H6Tq/xe5m7whEcZTFFi4UaTB00z3sEgJxesACi0SC1I6IuFQGnpR6PN/2FEp1ztFwCZUQx6Su/LclEErk/nmxPAzKSwhieYyV0cGt6eKwoAPLg2t8QmCSNha9H553MuAVDI1IiDRTHF/n0MwSBwtHhhhHkoKic5iK/3BBv6kL2ZOig4y0Xyejy8X/Xs2yNjv2CJi88Ae5uqIEaQIAVQQekjsjPNsRr078SVLv+X8OMsB2lpLju2tyFHqezQHfeq1pp4q+jqiQWJMkskE6mCIS5oVfE5tT/PwW9N/C36v4RAZRjyf7em4Ac0bpKgAAA=",Je="data:image/webp;base64,UklGRo4DAABXRUJQVlA4WAoAAAAQAAAAOwAAOwAAQUxQSIQBAAABGbIBylRhE9H/uNMgB7Jt07bWs23btm0jtW2/96P/M9u2bTO0bdvGs2f9fO2ICWDjto0kyntVu93+4eY3Pvvhpz/EX13+6dKNCXeTQCT0J0mCpIFJYSFY9MWfvSIeOuQpMmT61JCx7aLd5nlpCN+QMe+7WSb6aPAnMKAP8u0COzFzt/Em6AY7MfN6WboB8UTt+ryGwgVWIPwEzA92niCPwfAaOYAn7ubrLCBeJ8tjQJ/peuczVbgl44tC4cxDzmGc/aCugvqEb/tKGcHV5YwIQLzfJEh7MNIND1iAXmr8r48nvKYL6Ldl2iEvC3WRBPTQQQmQl/l2QdrnDhtA/4yzCUHWAiqcD+haQdkJA10URdClgDLgAzpfmqCzIAE6Y1ASjEAnQw10XV6B7q+nGJr4B/uTEdBdchp0n+z2AUF22jb/IPfCDAcRZFdNdRZBdkyjTf6ShnxHg3Kl9BBgsmJkSqWNAJMSLFM6UwSZpSCB2JkkAkyVPw+27AgdBJk6O8KQjv4YVlA4IOQBAABwCwCdASo8ADwAPm0sk0ckIiGhLBK8AIANiWoNsAUgopAjP2bj4wL/G+Ix0uPMBjgG8co0DZmvcEO5ipr3YhGqmW3HlaMyfAEzIs97ZwIyCgc3Pwh2oLe8+FXTuTKdfAcrtraAAP7rZFw5n2K/5sD288EcLAc0t91ywxA9cDV2Tbb1HcfaqXhEFZ/kvBWQJ+RyfgEjM5lu3BDFTOl8FICR0rF/QBcNt9/pSCx/ok55r0fhdRUA/L8DKkdR+G98EK4rXy/cqOn57Qp0oEdxFz5nQtfSPeoNuFzp9f75rxQr1IprVPlgl8Zl81cP1ccptcUJluQHsVbQP1SGQpn+Dnsvge6EwelegGM0squCACbsXp1tTz45SX4BOrRRtoATJN86Ft6P9LkHBc1n4oRMVUj4YBkAynW2VjAH8nWpisnw2+VTfU8Km5IBqqG+ajqp9ONYKapcKGzV92ABhg1PJgLmclk/3bA9HOr0zpxXB9RG5K/1uI1kB3t39hQblljArCqHr45zT6AIB6ASQwE6ClPuZ+oNTpGtmnM0YOASQV4J9C50FrkuqQB23xw/6dIzm3VK6Zplam2ZYd7aUEmP2cVohSmLm//oJt54bQoUrZn08sk+wY2cFHMpKFVW1RPbp7hswAAA";function Le({dim:e}){return(0,o.jsx)("img",{className:"dcp-coin",src:Ne,alt:"",style:e?{filter:"grayscale(1) opacity(0.5)"}:void 0})}var Ge=1;function Te(e){let[t,n]=(0,j.useState)([]),[a,c]=(0,j.useState)("ready"),s=(0,j.useRef)(!1),d=m=>{n(A=>A.filter(Y=>Y!==m))},fe=e,{open:b,onOpenChange:S,title:I,subtitle:O,note:J,days:D=7,rewards:U,unitLabel:g,doneIcon:G="\u2713",columns:W=3,buttonLabel:E,checkedInLabel:Q,closeDelay:f=1500,closeOnOverlayClick:F=!1,className:Z,locale:z="en",theme:C,baseUrl:ce}=fe,$=he(fe,["open","onOpenChange","title","subtitle","note","days","rewards","unitLabel","doneIcon","columns","buttonLabel","checkedInLabel","closeDelay","closeOnOverlayClick","className","locale","theme","baseUrl"]),se=X[z]?z:"en",P=X[se],w=I!==void 0?I:P.title,h=J!==void 0?J:P.note,r=g!==void 0?g:P.unitLabel,l=E!==void 0?E:P.buttonLabel,i=Q!==void 0?Q:P.checkedInLabel,p={};C&&(C.primaryColor&&(p["--dcp-bg"]=C.primaryColor),C.secondaryColor&&(p["--dcp-secondary"]=C.secondaryColor),C.accentColor&&(p["--dcp-accent"]=C.accentColor));let x=b!==void 0,y=oe(ne(H({},$),{locale:z,baseUrl:ce,autoShow:x?!1:$.autoShow})),R=x?b:y.open,B=m=>{x||y.setOpen(m),S==null||S(m)},{streak:q,checkedInToday:L,dailyStreakCoins:N}=y;if((0,j.useEffect)(()=>{R&&!s.current&&c(L?"complete":"ready")},[R,L]),(0,j.useEffect)(()=>{ye()},[]),(0,j.useEffect)(()=>{if(!R)return;let m=A=>{A.key==="Escape"&&B(!1)};return document.addEventListener("keydown",m),()=>document.removeEventListener("keydown",m)},[R]),!R||typeof document=="undefined")return null;let v=N?N.map(m=>m.coins):U,M=N?N.length:D,_=q===0?0:(q-1)%M+1,De=L?-1:_,Ee=Math.min(L?Math.max(_-1,0):_,M-1),le=v==null?void 0:v[Ee],ze=O!=null?O:ke(P.subtitle,{coin:(0,o.jsx)(Le,{}),reward:le!=null?le:""}),Pe=()=>{a==="ready"&&(s.current=!0,c("loading"),y.checkIn(),setTimeout(()=>{c("complete"),s.current=!1;let m=Ge++;n(A=>[...A,m]),setTimeout(()=>{d(m)},6e3),f>0&&window.setTimeout(()=>B(!1),f)},1e3))};return(0,Ie.createPortal)((0,o.jsxs)("div",{className:"dcp-overlay",onClick:F?()=>B(!1):void 0,role:"presentation",children:[(0,o.jsxs)("div",{className:["dcp-card",(C==null?void 0:C.dark)&&"dcp-dark",Z].filter(Boolean).join(" "),style:H({["--dcp-columns"]:W},p),onClick:m=>m.stopPropagation(),role:"dialog","aria-modal":"true","aria-label":typeof w=="string"?w:"Daily check-in",children:[(0,o.jsx)("div",{className:"dcp-modal-img-wrap",children:(0,o.jsx)("div",{className:"dcp-wrap-with-img",children:(0,o.jsx)("img",{className:"dcp-badge-img",src:Ne,alt:"",decoding:"async",loading:"lazy"})})}),(0,o.jsx)("button",{className:"dcp-close",onClick:()=>B(!1),"aria-label":"Close",children:"\xD7"}),(0,o.jsx)("h2",{className:"dcp-title",children:w}),(0,o.jsx)("p",{className:"dcp-subtitle",children:ze}),h?(0,o.jsx)("p",{className:"dcp-note",children:h}):null,(0,o.jsx)("div",{className:"dcp-days",children:Array.from({length:M},(m,A)=>{let Y=A<_,me=A===De,Re=["dcp-day",Y&&"dcp-day-done",me&&"dcp-day-today"].filter(Boolean).join(" ");return(0,o.jsxs)("div",{className:Re,children:[Y?G==="\u2713"?(0,o.jsx)("img",{src:Je,className:"dcp-day-check-img",alt:"\u2713"}):(0,o.jsx)("span",{className:"dcp-day-check",children:G}):null,(0,o.jsx)("span",{className:"dcp-day-name",children:we(P.dayLabel,A+1)}),(v==null?void 0:v[A])!=null?(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)("span",{className:"dcp-day-value",children:v[A]}),(0,o.jsxs)("span",{className:"dcp-day-unit",children:[(0,o.jsx)(Le,{dim:!Y&&!me})," ",r]})]}):null]},A)})}),(0,o.jsxs)("button",{className:`dcp-button ${a}`,onClick:Pe,disabled:a!=="ready",children:[a==="ready"&&(0,o.jsx)("div",{className:"dcp-btn-message dcp-submit-message",children:(0,o.jsx)("span",{children:l})}),a==="loading"&&(0,o.jsx)("div",{className:"dcp-btn-message dcp-loading-message",children:(0,o.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 19 17",children:[(0,o.jsx)("circle",{className:"dcp-loading-circle",cx:"2.2",cy:"10",r:"1.6"}),(0,o.jsx)("circle",{className:"dcp-loading-circle",cx:"9.5",cy:"10",r:"1.6"}),(0,o.jsx)("circle",{className:"dcp-loading-circle",cx:"16.8",cy:"10",r:"1.6"})]})}),a==="complete"&&(0,o.jsx)("div",{className:"dcp-btn-message dcp-success-message",children:(0,o.jsx)("span",{children:i})})]})]}),t.map(m=>(0,o.jsx)(Se,{count:Math.floor(window.innerWidth/5)},m))]}),document.body)}0&&(module.exports={DailyCheckinPopup,locales,useDailyCheckin});
package/dist/index.d.cts ADDED
@@ -0,0 +1,116 @@
1
+ import * as react from 'react';
2
+ import { ReactNode } from 'react';
3
+
4
+ interface CheckinTheme {
5
+ primaryColor?: string;
6
+ secondaryColor?: string;
7
+ accentColor?: string;
8
+ }
9
+ interface CheckinState {
10
+ /** Last check-in date as YYYY-MM-DD (local time), or null if never */
11
+ lastCheckin: string | null;
12
+ /** Current consecutive-day streak */
13
+ streak: number;
14
+ }
15
+ interface CheckinInfo {
16
+ /** Streak after this check-in */
17
+ streak: number;
18
+ /** Date of this check-in, YYYY-MM-DD local */
19
+ date: string;
20
+ }
21
+ interface UseDailyCheckinOptions {
22
+ /** localStorage key. Use a different key per app/feature. Default: "daily-checkin" */
23
+ storageKey?: string;
24
+ /** Automatically open the popup on mount (currently every time, not once per day). Default: true */
25
+ autoShow?: boolean;
26
+ /** Delay in ms before auto-opening. Default: 600 */
27
+ autoShowDelay?: number;
28
+ /** Called once when the user checks in for the day */
29
+ onCheckIn?: (info: CheckinInfo) => void;
30
+ /** Base URL for API calls */
31
+ baseUrl?: string;
32
+ /** Session key for authentication (sent via 'session-key' / 'Sessionkey' header) */
33
+ sessionKey?: string;
34
+ /** Locale language code (e.g. 'en', 'hi', etc.) to be sent in Accept-Language header */
35
+ locale?: string;
36
+ /** Additional headers for API calls (e.g. Authorization token) */
37
+ apiHeaders?: Record<string, string>;
38
+ /** The date when the popup was last shown (format: YYYY-MM-DD or Date object or timestamp) */
39
+ lastShownDate?: string | number | Date | null;
40
+ }
41
+ interface UseDailyCheckinReturn {
42
+ open: boolean;
43
+ setOpen: (open: boolean) => void;
44
+ /** Streak counting today (0 if the chain is broken and not yet checked in) */
45
+ streak: number;
46
+ checkedInToday: boolean;
47
+ /** Perform today's check-in. No-op if already checked in today. */
48
+ checkIn: () => void;
49
+ /** Clear stored state (useful for testing/logout) */
50
+ reset: () => void;
51
+ /** Dynamic rewards data returned from the API */
52
+ dailyStreakCoins?: Array<{
53
+ day_number: number;
54
+ coins: string | number;
55
+ }>;
56
+ }
57
+ declare function useDailyCheckin(options?: UseDailyCheckinOptions): UseDailyCheckinReturn;
58
+
59
+ interface DailyCheckinPopupProps extends UseDailyCheckinOptions {
60
+ /** Controlled open state. Omit to let the popup manage itself (auto-show once per day). */
61
+ open?: boolean;
62
+ /** Called when the popup wants to open/close (controlled mode) */
63
+ onOpenChange?: (open: boolean) => void;
64
+ /** Heading. Default: "Daily Check-in" */
65
+ title?: ReactNode;
66
+ /** Line under the heading. Default: "Check in to get <coin> <today's reward>" */
67
+ subtitle?: ReactNode;
68
+ /** Small text under the subtitle. Default: "You must claim daily bonus every day to form a streak!" */
69
+ note?: ReactNode;
70
+ /** Number of days shown in the grid. Default: 7 */
71
+ days?: number;
72
+ /** Reward amount per day tile, e.g. [5, 20, 30, 40, 50]. */
73
+ rewards?: ReactNode[];
74
+ /** Unit label under each reward, e.g. "Token" or "Coins". Default: "Token" */
75
+ unitLabel?: ReactNode;
76
+ /** Icon in the corner badge of a completed day. Default: "✓" */
77
+ doneIcon?: ReactNode;
78
+ /** URL for the coin image shown in the top badge. Falls back to the built-in SVG coin. */
79
+ badgeImageUrl?: string;
80
+ /** Number of tile columns. Default: 3 */
81
+ columns?: number;
82
+ /** Check-in button label. Default: "CLAIM" */
83
+ buttonLabel?: ReactNode;
84
+ /** Button label after checking in. Default: "CLAIMED ✓" */
85
+ checkedInLabel?: ReactNode;
86
+ /** Close the popup automatically this many ms after check-in. 0 disables. Default: 1500 */
87
+ closeDelay?: number;
88
+ /** Close when the overlay backdrop is clicked. Default: true */
89
+ closeOnOverlayClick?: boolean;
90
+ /** Extra class on the popup card */
91
+ className?: string;
92
+ /** Locale language code (e.g. 'en', 'es', 'fr', 'de', 'hi', 'zh'). Default: 'en' */
93
+ locale?: string;
94
+ /** Theme styling configuration options */
95
+ theme?: CheckinTheme;
96
+ /** Base URL for API calls (e.g. "https://corep.vinfotech.org/user") */
97
+ baseUrl?: string;
98
+ /** Session key for authentication (sent via 'session-key' header) */
99
+ sessionKey?: string;
100
+ /** Additional headers for API calls (e.g. Authorization token) */
101
+ apiHeaders?: Record<string, string>;
102
+ }
103
+ declare function DailyCheckinPopup(props: DailyCheckinPopupProps): react.ReactPortal | null;
104
+
105
+ interface CheckinTranslations {
106
+ title: string;
107
+ subtitle: string;
108
+ note: string;
109
+ dayLabel: string;
110
+ buttonLabel: string;
111
+ checkedInLabel: string;
112
+ unitLabel: string;
113
+ }
114
+ declare const locales: Record<string, CheckinTranslations>;
115
+
116
+ export { type CheckinInfo, type CheckinState, type CheckinTranslations, DailyCheckinPopup, type DailyCheckinPopupProps, type UseDailyCheckinOptions, type UseDailyCheckinReturn, locales, useDailyCheckin };
package/dist/index.d.ts ADDED
@@ -0,0 +1,121 @@
1
+ import * as react from 'react';
2
+ import { ReactNode } from 'react';
3
+
4
+ interface CheckinTheme {
5
+ primaryColor?: string;
6
+ secondaryColor?: string;
7
+ accentColor?: string;
8
+ dark?: boolean;
9
+ }
10
+ interface CheckinState {
11
+ /** Last check-in date as YYYY-MM-DD (local time), or null if never */
12
+ lastCheckin: string | null;
13
+ /** Current consecutive-day streak */
14
+ streak: number;
15
+ }
16
+ interface CheckinInfo {
17
+ /** Streak after this check-in */
18
+ streak: number;
19
+ /** Date of this check-in, YYYY-MM-DD local */
20
+ date: string;
21
+ /** API response data from claiming coins */
22
+ apiResponse?: any;
23
+ }
24
+ interface UseDailyCheckinOptions {
25
+ /** localStorage key. Use a different key per app/feature. Default: "daily-checkin" */
26
+ storageKey?: string;
27
+ /** Automatically open the popup on mount (currently every time, not once per day). Default: true */
28
+ autoShow?: boolean;
29
+ /** Delay in ms before auto-opening. Default: 600 */
30
+ autoShowDelay?: number;
31
+ /** Called once when the user checks in for the day */
32
+ onCheckIn?: (info: CheckinInfo) => void;
33
+ /** Called when the daily streak data is successfully fetched from the API */
34
+ onStreakDataFetch?: (data: any) => void;
35
+ /** Base URL for API calls */
36
+ baseUrl?: string;
37
+ /** Session key for authentication (sent via 'session-key' / 'Sessionkey' header) */
38
+ sessionKey?: string;
39
+ /** Locale language code (e.g. 'en', 'hi', etc.) to be sent in Accept-Language header */
40
+ locale?: string;
41
+ /** Additional headers for API calls (e.g. Authorization token) */
42
+ apiHeaders?: Record<string, string>;
43
+ /** Callback to receive raw API responses from fetch and claim actions */
44
+ onApiResponse?: (type: 'fetch' | 'claim', data: any) => void;
45
+ /** The date when the popup was last shown (format: YYYY-MM-DD or Date object or timestamp) */
46
+ lastShownDate?: string | number | Date | null;
47
+ }
48
+ interface UseDailyCheckinReturn {
49
+ open: boolean;
50
+ setOpen: (open: boolean) => void;
51
+ /** Streak counting today (0 if the chain is broken and not yet checked in) */
52
+ streak: number;
53
+ checkedInToday: boolean;
54
+ /** Perform today's check-in. No-op if already checked in today. */
55
+ checkIn: () => void;
56
+ /** Clear stored state (useful for testing/logout) */
57
+ reset: () => void;
58
+ /** Dynamic rewards data returned from the API */
59
+ dailyStreakCoins?: Array<{
60
+ day_number: number;
61
+ coins: string | number;
62
+ }>;
63
+ }
64
+ declare function useDailyCheckin(options?: UseDailyCheckinOptions): UseDailyCheckinReturn;
65
+
66
+ interface DailyCheckinPopupProps extends UseDailyCheckinOptions {
67
+ /** Controlled open state. Omit to let the popup manage itself (auto-show once per day). */
68
+ open?: boolean;
69
+ /** Called when the popup wants to open/close (controlled mode) */
70
+ onOpenChange?: (open: boolean) => void;
71
+ /** Heading. Default: "Daily Check-in" */
72
+ title?: ReactNode;
73
+ /** Line under the heading. Default: "Check in to get <coin> <today's reward>" */
74
+ subtitle?: ReactNode;
75
+ /** Small text under the subtitle. Default: "You must claim daily bonus every day to form a streak!" */
76
+ note?: ReactNode;
77
+ /** Number of days shown in the grid. Default: 7 */
78
+ days?: number;
79
+ /** Reward amount per day tile, e.g. [5, 20, 30, 40, 50]. */
80
+ rewards?: ReactNode[];
81
+ /** Unit label under each reward, e.g. "Token" or "Coins". Default: "Token" */
82
+ unitLabel?: ReactNode;
83
+ /** Icon in the corner badge of a completed day. Default: "✓" */
84
+ doneIcon?: ReactNode;
85
+ /** Number of tile columns. Default: 3 */
86
+ columns?: number;
87
+ /** Check-in button label. Default: "CLAIM" */
88
+ buttonLabel?: ReactNode;
89
+ /** Button label after checking in. Default: "CLAIMED ✓" */
90
+ checkedInLabel?: ReactNode;
91
+ /** Close the popup automatically this many ms after check-in. 0 disables. Default: 1500 */
92
+ closeDelay?: number;
93
+ /** Close when the overlay backdrop is clicked. Default: false */
94
+ closeOnOverlayClick?: boolean;
95
+ /** Extra class on the popup card */
96
+ className?: string;
97
+ /** Locale language code (e.g. 'en', 'es', 'fr', 'de', 'hi', 'zh'). Default: 'en' */
98
+ locale?: string;
99
+ /** Theme styling configuration options */
100
+ theme?: CheckinTheme;
101
+ /** Base URL for API calls (e.g. "https://corep.vinfotech.org/user") */
102
+ baseUrl?: string;
103
+ /** Session key for authentication (sent via 'session-key' header) */
104
+ sessionKey?: string;
105
+ /** Additional headers for API calls (e.g. Authorization token) */
106
+ apiHeaders?: Record<string, string>;
107
+ }
108
+ declare function DailyCheckinPopup(props: DailyCheckinPopupProps): react.ReactPortal | null;
109
+
110
+ interface CheckinTranslations {
111
+ title: string;
112
+ subtitle: string;
113
+ note: string;
114
+ dayLabel: string;
115
+ buttonLabel: string;
116
+ checkedInLabel: string;
117
+ unitLabel: string;
118
+ }
119
+ declare const locales: Record<string, CheckinTranslations>;
120
+
121
+ export { CheckinInfo, CheckinState, CheckinTranslations, DailyCheckinPopup, DailyCheckinPopupProps, UseDailyCheckinOptions, UseDailyCheckinReturn, locales, useDailyCheckin };
package/dist/index.js ADDED
@@ -0,0 +1,342 @@
1
+ var He=Object.defineProperty,Oe=Object.defineProperties;var Ue=Object.getOwnPropertyDescriptors;var $=Object.getOwnPropertySymbols;var ge=Object.prototype.hasOwnProperty,he=Object.prototype.propertyIsEnumerable;var be=(e,t,n)=>t in e?He(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,j=(e,t)=>{for(var n in t||(t={}))ge.call(t,n)&&be(e,n,t[n]);if($)for(var n of $(t))he.call(t,n)&&be(e,n,t[n]);return e},_=(e,t)=>Oe(e,Ue(t));var ye=(e,t)=>{var n={};for(var a in e)ge.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(e!=null&&$)for(var a of $(e))t.indexOf(a)<0&&he.call(e,a)&&(n[a]=e[a]);return n};import{useEffect as ue,useState as De,useRef as Ve}from"react";import{createPortal as Je}from"react-dom";var Fe=`
2
+ .dcp-overlay {
3
+ position: fixed;
4
+ inset: 0;
5
+ z-index: var(--dcp-z-index, 1000);
6
+ display: flex;
7
+ align-items: center;
8
+ justify-content: center;
9
+ padding: 72px 16px 16px;
10
+ background: var(--dcp-overlay-bg, rgba(0, 0, 0, 0.6));
11
+ backdrop-filter: blur(4px);
12
+ animation: dcp-fade-in 0.2s ease;
13
+ }
14
+ .dcp-card {
15
+ position: relative;
16
+ width: 100%;
17
+ max-width: var(--dcp-max-width, 315px);
18
+ border-radius: var(--dcp-radius, 40px);
19
+ background: var(--dcp-bg, #00a26d);
20
+ color: var(--dcp-text, var(--dcp-secondary, #ffffff));
21
+ // box-shadow: var(--dcp-shadow, 0 20px 50px rgba(0, 0, 0, 0.3));
22
+ padding: 60px 16px 36px;
23
+ text-align: center;
24
+ font-family: var(--dcp-font, 'Inter', system-ui, -apple-system, sans-serif);
25
+ animation: dcp-pop-in 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
26
+ }
27
+ /* \u2500\u2500 Top badge: outer green ring \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
28
+ .dcp-modal-img-wrap {
29
+ position: absolute;
30
+ top: -24px;
31
+ left: 50%;
32
+ transform: translateX(-50%);
33
+ display: flex;
34
+ align-items: center;
35
+ justify-content: center;
36
+ width: 88px;
37
+ height: 88px;
38
+ border-radius: 50%;
39
+ background: var(--dcp-bg, #00a26d);
40
+ // box-shadow: 0 4px 16px rgba(0,0,0,0.18);
41
+ }
42
+ /* \u2500\u2500 Inner white circle \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
43
+ .dcp-wrap-with-img {
44
+ display: flex;
45
+ align-items: center;
46
+ justify-content: center;
47
+ width: 60px;
48
+ height: 60px;
49
+ border-radius: 50%;
50
+ background: var(--dcp-secondary, #ffffff);
51
+ overflow: hidden;
52
+ }
53
+ /* \u2500\u2500 Coin image inside \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
54
+ .dcp-badge-img {
55
+ width: 40px;
56
+ height: 40px;
57
+ object-fit: contain;
58
+ }
59
+ /* \u2500\u2500 SVG coin fallback (when no badgeImageUrl) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
60
+ .dcp-wrap-with-img .dcp-coin {
61
+ width: 44px;
62
+ height: 44px;
63
+ }
64
+ .dcp-close {
65
+ display:none !important;
66
+ position: absolute;
67
+ top: 14px;
68
+ right: 14px;
69
+ width: 32px;
70
+ height: 32px;
71
+ display: flex;
72
+ align-items: center;
73
+ justify-content: center;
74
+ background: rgba(255, 255, 255, 0.15);
75
+ border: none;
76
+ border-radius: 50%;
77
+ color: #ffffff;
78
+ font-size: 20px;
79
+ line-height: 1;
80
+ cursor: pointer;
81
+ transition: background 0.2s;
82
+ z-index: 10;
83
+ padding: 0;
84
+ }
85
+ .dcp-close:hover {
86
+ background: rgba(255, 255, 255, 0.3);
87
+ }
88
+ .dcp-title {
89
+ margin: 15px 0 8px;
90
+ font-size: 30px;
91
+ font-weight: 700;
92
+ letter-spacing: -0.5px;
93
+ color: var(--dcp-text, var(--dcp-secondary, #ffffff));
94
+ }
95
+ .dcp-subtitle {
96
+ display: flex;
97
+ align-items: center;
98
+ justify-content: center;
99
+ gap: 6px;
100
+ // margin: 15px 0 5px;
101
+ font-size: 16px;
102
+ // font-weight: 600;
103
+ }
104
+ .dcp-subtitle .dcp-coin {
105
+ width: 15px;
106
+ height: 15px;
107
+ }
108
+ .dcp-note {
109
+ // margin: 0 0 24px;
110
+ font-size: 10px;
111
+ font-weight: 500;
112
+ opacity: 0.85;
113
+ // line-height: 1.4;
114
+ margin-bottom:40px;
115
+ }
116
+ .dcp-days {
117
+ // display: flex;
118
+ // flex-wrap: wrap;
119
+ // justify-content: center;
120
+ // gap: 12px;
121
+ // margin-bottom: 28px;
122
+ display: grid !important;
123
+ grid-template-columns: repeat(3, 1fr) !important;
124
+ grid-gap: 14px !important;
125
+ margin-top: -20px !important;
126
+ grid-auto-rows: auto !important;
127
+ padding: 0 15px;
128
+ }
129
+ .dcp-day {
130
+ // position: relative;
131
+ // display: flex;
132
+ // flex-direction: column;
133
+ // align-items: center;
134
+ // gap: 8px;
135
+ // padding: 18px 6px 14px;
136
+ // border-radius: 12px;
137
+ // background: var(--dcp-day-bg, rgba(0, 0, 0, 0.15));
138
+ // color: rgba(255, 255, 255, 0.6);
139
+ // flex: 0 1 calc((100% - (var(--dcp-columns, 3) - 1) * 20px) / var(--dcp-columns, 3));
140
+ // box-sizing: border-box;
141
+ // border: 1.5px solid transparent;
142
+ // overflow: hidden;
143
+ // transition: transform 0.2s ease, background-color 0.2s ease;
144
+ position: relative !important;
145
+ display: flex !important;
146
+ flex-direction: column !important;
147
+ justify-content: space-between !important;
148
+ border: 1.5px solid transparent;
149
+ border-radius: 6px !important;
150
+ padding: 12px !important;
151
+ animation: fade-anim .3s linear !important;
152
+ animation-fill-mode: both !important;
153
+ max-height: 118px !important;
154
+ max-width: 78px !important;
155
+ background: var(--dcp-day-bg, rgba(0, 0, 0, 0.15));
156
+ color:#ffffff8a;
157
+ }
158
+ .dcp-day-done {
159
+ background: var(--dcp-day-done-bg, rgba(0, 0, 0, 0.08));
160
+ border: 1.5px solid var(--dcp-secondary, #ffffff);
161
+ color: var(--dcp-text, var(--dcp-secondary, #ffffff));
162
+ }
163
+ .dcp-day-today {
164
+ background: var(--dcp-day-active-bg, var(--dcp-secondary, #ffffff));
165
+ border: 1.5px solid var(--dcp-secondary, #ffffff);
166
+ color: var(--dcp-accent, #00a26d);
167
+ box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
168
+ }
169
+ .dcp-day-check {
170
+ position: absolute;
171
+ top: 0;
172
+ right: 0;
173
+ display: flex;
174
+ align-items: center;
175
+ justify-content: center;
176
+ width: 24px;
177
+ height: 24px;
178
+ border-radius: 0 0 0 100%;
179
+ background: rgba(255, 255, 255, 0.2);
180
+ color: var(--dcp-secondary, #ffffff);
181
+ font-size: 15px;
182
+ font-weight: 900;
183
+ line-height: 1;
184
+ padding-bottom: 5px;
185
+ padding-left: 5px;
186
+ box-sizing: border-box;
187
+ }
188
+ .dcp-day-check-img {
189
+ position: absolute;
190
+ top: -1px;
191
+ right: -1px;
192
+ width: 20px;
193
+ height: 20px;
194
+ object-fit: contain;
195
+ pointer-events: none;
196
+ }
197
+ .dcp-day-name {
198
+ font-size: 10px;
199
+ font-weight: 700;
200
+ }
201
+ .dcp-day-value {
202
+ font-size: 20px;
203
+ font-weight: 700;
204
+ line-height: 1;
205
+ margin:6px 0 10px;
206
+ }
207
+ .dcp-day-unit {
208
+ display: flex;
209
+ align-items: center;
210
+ justify-content: center;
211
+ gap: 4px;
212
+ font-size: 10px;
213
+ font-weight: 700;
214
+ }
215
+ .dcp-day-unit .dcp-coin {
216
+ width: 14px;
217
+ height: 14px;
218
+ }
219
+ .dcp-button {
220
+ display: flex;
221
+ align-items: center;
222
+ justify-content: center;
223
+ width: 190px;
224
+ height: 40px;
225
+ margin: 8px auto 0;
226
+ padding: 0;
227
+ border: none;
228
+ border-radius: 999px;
229
+ background: var(--dcp-button-bg, var(--dcp-secondary, #ffffff));
230
+ color: var(--dcp-accent, #00a26d);
231
+ font-size: 18px;
232
+ font-weight: 700;
233
+ line-height: 1;
234
+ letter-spacing: 0.5px;
235
+ transition: transform 0.1s ease, box-shadow 0.1s ease;
236
+ margin-top: 30px;
237
+ }
238
+ .dcp-button:not(:disabled) {
239
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(255, 255, 255, 0);
240
+ animation: shadow-pulse 1.5s infinite;
241
+ animation-delay: 0.5s;
242
+ cursor: pointer;
243
+ }
244
+ .dcp-button:hover:not(:disabled) {
245
+ transform: translateY(-1px);
246
+ box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15), 0 8px 8px rgba(0, 0, 0, 0.08), 0 0 0 0 rgba(255, 255, 255, 0);
247
+ }
248
+ .dcp-button:active:not(:disabled) {
249
+ transform: translateY(0);
250
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(255, 255, 255, 0);
251
+ }
252
+ .dcp-button:disabled {
253
+ // opacity: 0.6;
254
+ box-shadow: none;
255
+ animation: none;
256
+ cursor: not-allowed;
257
+ }
258
+ @keyframes dcp-fade-in {
259
+ from { opacity: 0; }
260
+ to { opacity: 1; }
261
+ }
262
+ @keyframes dcp-pop-in {
263
+ from { opacity: 0; transform: scale(0.92) translateY(8px); }
264
+ to { opacity: 1; transform: scale(1) translateY(0); }
265
+ }
266
+ .dcp-btn-message {
267
+ display: flex;
268
+ align-items: center;
269
+ justify-content: center;
270
+ gap: 8px;
271
+ height: 100%;
272
+ }
273
+ .dcp-loading-message svg {
274
+ width: 32px;
275
+ height: 24px;
276
+ }
277
+ .dcp-loading-circle {
278
+ fill: var(--dcp-accent, #00a26d);
279
+ animation: dcp-dot-pulse 1.2s infinite both;
280
+ }
281
+ .dcp-loading-circle:nth-child(1) {
282
+ animation-delay: 0s;
283
+ }
284
+ .dcp-loading-circle:nth-child(2) {
285
+ animation-delay: 0.2s;
286
+ }
287
+ .dcp-loading-circle:nth-child(3) {
288
+ animation-delay: 0.4s;
289
+ }
290
+ .dcp-success-message span {
291
+ animation: dcp-fade-in 0.2s ease;
292
+ }
293
+ @keyframes dcp-dot-pulse {
294
+ 0%, 80%, 100% {
295
+ opacity: 0.2;
296
+ }
297
+ 40% {
298
+ opacity: 1;
299
+ }
300
+ }
301
+ @keyframes shadow-pulse {
302
+ 0% {
303
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(255, 255, 255, 0.4);
304
+ }
305
+ 70% {
306
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 10px rgba(255, 255, 255, 0);
307
+ }
308
+ 100% {
309
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 6px rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(255, 255, 255, 0);
310
+ }
311
+ }
312
+ @media (prefers-reduced-motion: reduce) {
313
+ .dcp-overlay, .dcp-card { animation: none; }
314
+ }
315
+ .dcp-particles {
316
+ position: fixed;
317
+ inset: 0;
318
+ pointer-events: none;
319
+ z-index: 99999;
320
+ overflow: hidden;
321
+ }
322
+ .dcp-particle {
323
+ position: absolute;
324
+ pointer-events: none;
325
+ transition: top 5s linear, left 5s linear, transform 5s linear;
326
+ }
327
+ /* \u2500\u2500 Dark Mode overrides \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
328
+ .dcp-card.dcp-dark .dcp-button {
329
+ background: #1c1d22 !important;
330
+ color: #ffffff !important;
331
+ }
332
+ .dcp-card.dcp-dark .dcp-day-done {
333
+ background: #1c1d22 !important;
334
+ border: 1.5px solid transparent !important;
335
+ color: #ffffff !important;
336
+ }
337
+ .dcp-card.dcp-dark .dcp-day-today {
338
+ background: #1c1d22 !important;
339
+ border: 1.5px solid transparent !important;
340
+ color: #ffffff !important;
341
+ }
342
+ `,se=!1;function xe(){if(se||typeof document=="undefined")return;if(document.getElementById("dcp-styles")){se=!0;return}let e=document.createElement("style");e.id="dcp-styles",e.textContent=Fe,document.head.appendChild(e),se=!0}import{useCallback as ke,useEffect as W,useState as ee,useRef as le}from"react";function N(e=new Date){let t=e.getFullYear(),n=String(e.getMonth()+1).padStart(2,"0"),a=String(e.getDate()).padStart(2,"0");return`${t}-${n}-${a}`}function de(){let e=new Date;return e.setDate(e.getDate()-1),N(e)}function we(e){if(!e)return null;if(e instanceof Date)return N(e);if(typeof e=="number")return N(new Date(e));if(typeof e=="string"){if(/^\d{4}-\d{2}-\d{2}$/.test(e))return e;if(/^\d+$/.test(e))return N(new Date(Number(e)));try{let t=new Date(e);if(!isNaN(t.getTime()))return N(t)}catch(t){}}return null}function Me(e){if(typeof window=="undefined")return{lastCheckin:null,streak:0};try{let t=window.localStorage.getItem(e);if(!t)return{lastCheckin:null,streak:0};let n=JSON.parse(t);return{lastCheckin:typeof n.lastCheckin=="string"?n.lastCheckin:null,streak:typeof n.streak=="number"?n.streak:0}}catch(t){return{lastCheckin:null,streak:0}}}function te(e,t){try{window.localStorage.setItem(e,JSON.stringify(t))}catch(n){}}function pe(e={}){let{storageKey:t="daily-checkin",autoShow:n=!0,autoShowDelay:a=600,onCheckIn:p,baseUrl:c,sessionKey:l,locale:m="en",apiHeaders:A,lastShownDate:L,onStreakDataFetch:H,onApiResponse:M}=e,T=le(p),O=le(H),b=le(M);W(()=>{T.current=p,O.current=H,b.current=M});let[K,V]=ee(!1),[D,B]=ee({lastCheckin:null,streak:0}),[u,U]=ee(null),[Y,E]=ee(!1);W(()=>{let k=Me(t);B(k)},[t]),W(()=>{E(!1),U(null)},[l,c]),W(()=>{if(!n||Y)return;let k=N();if(c){if(!u)return;let g=u.allowClaim===0,i=!g;if(i&&L!==void 0&&L!==null){let o=we(L)!==k;i=!g}if(i){let s=window.setTimeout(()=>{V(!0),E(!0)},a);return()=>window.clearTimeout(s)}else E(!0)}else{let g=D.lastCheckin===k,i=!g;if(i&&L!==void 0&&L!==null){let o=we(L)!==k;i=!g}if(i){let s=window.setTimeout(()=>{V(!0),E(!0)},a);return()=>window.clearTimeout(s)}else E(!0)}},[n,a,L,c,u,D.lastCheckin,Y]),W(()=>{if(!c)return;(async()=>{var g,i,s;try{let o=j({"Content-Type":"application/json","Accept-Language":m},A);l&&(o.Sessionkey=l);let d=await fetch(`${c}/user/coins/get_daily_streak_coins`,{method:"POST",headers:o}),y=null;try{y=await d.json()}catch(h){y={message:d.statusText,status:d.status}}if((g=O.current)==null||g.call(O,y),(i=b.current)==null||i.call(b,"fetch",y),d.ok&&y&&typeof y=="object"){let h=y.data||y,P=h.allow_claim!==void 0?Number(h.allow_claim):null,R=h.current_day!==void 0?Number(h.current_day):null,J=Array.isArray(h.daily_streak_coins)?h.daily_streak_coins:null;if(P!==null&&R!==null&&J!==null){U({allowClaim:P,currentDay:R,dailyStreakCoins:J});let S=P===0,I=S?R:R-1,C={lastCheckin:S?N():de(),streak:I};te(t,C),B(C)}else{let S=typeof h.streak=="number"?h.streak:null,I=typeof h.lastCheckin=="string"?h.lastCheckin:null;(S!==null||I!==null)&&B(C=>{let F={lastCheckin:I!==null?I:C.lastCheckin,streak:S!==null?S:C.streak};return te(t,F),F})}}else if(!d.ok)throw new Error(`HTTP error! status: ${d.status}`)}catch(o){console.error("Failed to fetch daily streak coins:",o),(s=b.current)==null||s.call(b,"fetch",{message:(o==null?void 0:o.message)||"Network error, please try again.",error:o})}})()},[K,c,t,l,m,A]);let w=N(),ie=u?u.allowClaim===0:D.lastCheckin===w,X=u?u.allowClaim===0?u.currentDay:u.currentDay-1:D.lastCheckin===w||D.lastCheckin===de()?D.streak:0,re=ke(async()=>{var k,g;if(u){let i=null;if(c){let s=j({"Content-Type":"application/json","Accept-Language":m},A);l&&(s.Sessionkey=l);try{let o=await fetch(`${c}/user/coins/claim_coins`,{method:"POST",headers:s});try{i=await o.json()}catch(d){i={message:o.statusText,status:o.status}}(k=b.current)==null||k.call(b,"claim",i)}catch(o){console.error("Failed to claim coins:",o),i={message:(o==null?void 0:o.message)||"Network error, please try again.",error:o},(g=b.current)==null||g.call(b,"claim",i)}}U(s=>{var y;if(!s)return null;let o=s.currentDay,d=N();return(y=T.current)==null||y.call(T,{streak:o,date:d,apiResponse:i}),te(t,{lastCheckin:d,streak:o}),_(j({},s),{allowClaim:0})})}else B(i=>{var d;let s=N();if(i.lastCheckin===s)return i;let o={lastCheckin:s,streak:i.lastCheckin===de()?i.streak+1:1};return te(t,o),(d=T.current)==null||d.call(T,{streak:o.streak,date:s}),o})},[u,c,t,l,m,A]),z=ke(()=>{try{window.localStorage.removeItem(t)}catch(k){}B({lastCheckin:null,streak:0}),U(null)},[t]);return{open:K,setOpen:V,streak:X,checkedInToday:ie,checkIn:re,reset:z,dailyStreakCoins:(u==null?void 0:u.dailyStreakCoins)||void 0}}var ne={en:{title:"Daily Check-in",subtitle:"Check in to get {coin} {reward}",note:"You must claim daily bonus every day to form a streak!",dayLabel:"Day {num}",buttonLabel:"CLAIM",checkedInLabel:"SUCCESS",unitLabel:"Token"},es:{title:"Registro Diario",subtitle:"\xA1Reg\xEDstrate para obtener {coin} {reward}!",note:"\xA1Debes reclamar el bono diario todos los d\xEDas para mantener tu racha!",dayLabel:"D\xEDa {num}",buttonLabel:"RECLAMAR",checkedInLabel:"\xC9XITO",unitLabel:"Fichas"},fr:{title:"Check-in Quotidien",subtitle:"Connectez-vous pour obtenir {coin} {reward}",note:"Vous devez r\xE9clamer le bonus quotidien chaque jour pour former une s\xE9rie !",dayLabel:"Jour {num}",buttonLabel:"R\xC9CLAMER",checkedInLabel:"SUCC\xC8S",unitLabel:"Jetons"},de:{title:"T\xE4glicher Check-in",subtitle:"Checken Sie ein, um {coin} {reward} zu erhalten",note:"Sie m\xFCssen jeden Tag den t\xE4glichen Bonus beanspruchen, um eine serie aufzubauen!",dayLabel:"Tag {num}",buttonLabel:"BEANSPRUCHEN",checkedInLabel:"ERFOLGREICH",unitLabel:"Token"},hi:{title:"\u0926\u0948\u0928\u093F\u0915 \u091A\u0947\u0915-\u0907\u0928",subtitle:"{coin} {reward} \u092A\u094D\u0930\u093E\u092A\u094D\u0924 \u0915\u0930\u0928\u0947 \u0915\u0947 \u0932\u093F\u090F \u091A\u0947\u0915 \u0907\u0928 \u0915\u0930\u0947\u0902",note:"\u0932\u0917\u093E\u0924\u093E\u0930 \u0938\u093F\u0932\u0938\u093F\u0932\u093E (streak) \u092C\u0928\u093E\u090F \u0930\u0916\u0928\u0947 \u0915\u0947 \u0932\u093F\u090F \u0906\u092A\u0915\u094B \u0939\u0930 \u0926\u093F\u0928 \u0926\u0948\u0928\u093F\u0915 \u092C\u094B\u0928\u0938 \u0915\u093E \u0926\u093E\u0935\u093E \u0915\u0930\u0928\u093E \u0939\u094B\u0917\u093E!",dayLabel:"\u0926\u093F\u0928 {num}",buttonLabel:"\u0926\u093E\u0935\u093E \u0915\u0930\u0947\u0902",checkedInLabel:"\u0938\u092B\u0932",unitLabel:"\u091F\u094B\u0915\u0928"},zh:{title:"\u6BCF\u65E5\u7B7E\u5230",subtitle:"\u7B7E\u5230\u4EE5\u83B7\u5F97 {coin} {reward}",note:"\u60A8\u5FC5\u987B\u6BCF\u5929\u9886\u53D6\u6BCF\u65E5\u5956\u52B1\u4EE5\u4FDD\u6301\u8FDE\u7EED\u7B7E\u5230\uFF01",dayLabel:"\u7B2C {num} \u5929",buttonLabel:"\u9886\u53D6",checkedInLabel:"\u6210\u529F",unitLabel:"\u4EE3\u5E01"},pt:{title:"Check-in Di\xE1rio",subtitle:"Fa\xE7a check-in para obter {coin} {reward}",note:"Voc\xEA deve reivindicar o b\xF4nus di\xE1rio todos os dias para manter uma sequ\xEAncia!",dayLabel:"Dia {num}",buttonLabel:"REIVINDICAR",checkedInLabel:"SUCESSO",unitLabel:"Fichas"},ja:{title:"\u30C7\u30A4\u30EA\u30FC\u30C1\u30A7\u30C3\u30AF\u30A4\u30F3",subtitle:"\u30C1\u30A7\u30C3\u30AF\u30A4\u30F3\u3057\u3066 {coin} {reward} \u3092\u7372\u5F97",note:"\u30B9\u30C8\u30EA\u30FC\u30AF\u3092\u7EF4\u6301\u3059\u308B\u306B\u306F\u3001\u6BCE\u65E5\u30C7\u30A4\u30EA\u30FC\u30DC\u30FC\u30CA\u30B9\u3092\u53D7\u3051\u53D6\u308B\u5FC5\u8981\u304C\u3042\u308A\u307E\u3059\uFF01",dayLabel:"{num} \u65E5\u76EE",buttonLabel:"\u53D7\u3051\u53D6\u308B",checkedInLabel:"\u6210\u529F",unitLabel:"\u30C8\u30FC\u30AF\u30F3"},ko:{title:"\uC77C\uC77C \uCCB4\uD06C\uC778",subtitle:"{coin} {reward}\uC744(\uB97C) \uBC1B\uC73C\uB824\uBA74 \uCCB4\uD06C\uC778\uD558\uC138\uC694",note:"\uC2A4\uD2B8\uB9AD\uC744 \uC720\uC9C0\uD558\uB824\uBA74 \uB9E4\uC77C \uC77C\uC77C \uBCF4\uB108\uC2A4\uB97C \uBC1B\uC544\uC57C \uD569\uB2C8\uB2E4!",dayLabel:"{num} \uC77C\uCC28",buttonLabel:"\uBC1B\uAE30",checkedInLabel:"\uC131\uACF5",unitLabel:"\uD1A0\uD070"},it:{title:"Check-in Giornaliero",subtitle:"Accedi per ottenere {coin} {reward}",note:"Devi riscattare il bonus giornaliero ogni giorno per mantenere la serie!",dayLabel:"Giorno {num}",buttonLabel:"RISCATTA",checkedInLabel:"SUCCESSO",unitLabel:"Gettoni"},ru:{title:"\u0415\u0436\u0435\u0434\u043D\u0435\u0432\u043D\u044B\u0439 \u0432\u0445\u043E\u0434",subtitle:"\u0412\u043E\u0439\u0434\u0438\u0442\u0435, \u0447\u0442\u043E\u0431\u044B \u043F\u043E\u043B\u0443\u0447\u0438\u0442\u044C {coin} {reward}",note:"\u0412\u044B \u0434\u043E\u043B\u0436\u043D\u044B \u0437\u0430\u0431\u0438\u0440\u0430\u0442\u044C \u0435\u0436\u0435\u0434\u043D\u0435\u0432\u043D\u044B\u0439 \u0431\u043E\u043D\u0443\u0441 \u043A\u0430\u0436\u0434\u044B\u0439 \u0434\u0435\u043D\u044C, \u0447\u0442\u043E\u0431\u044B \u0441\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C \u0441\u0435\u0440\u0438\u044E!",dayLabel:"\u0414\u0435\u043D\u044C {num}",buttonLabel:"\u0417\u0410\u0411\u0420\u0410\u0422\u042C",checkedInLabel:"\u0423\u0421\u041F\u0415\u0428\u041D\u041E",unitLabel:"\u0422\u043E\u043A\u0435\u043D"},ar:{title:"\u062A\u0633\u062C\u064A\u0644 \u0627\u0644\u0648\u0635\u0648\u0644 \u0627\u0644\u064A\u0648\u0645\u064A",subtitle:"\u0633\u062C\u0644 \u0627\u0644\u0648\u0635\u0648\u0644 \u0644\u0644\u062D\u0635\u0648\u0644 \u0639\u0644\u0649 {coin} {reward}",note:"\u064A\u062C\u0628 \u0639\u0644\u064A\u0643 \u0627\u0644\u0645\u0637\u0627\u0644\u0628\u0629 \u0628\u0627\u0644\u0645\u0643\u0627\u0641\u0623\u0629 \u0627\u0644\u064A\u0648\u0645\u064A\u0629 \u0643\u0644 \u064A\u0648\u0645 \u0644\u062A\u0634\u0643\u064A\u0644 \u0633\u0644\u0633\u0644\u0629 \u0645\u062A\u062A\u0627\u0644\u064A\u0629!",dayLabel:"\u0627\u0644\u064A\u0648\u0645 {num}",buttonLabel:"\u0645\u0637\u0627\u0644\u0628\u0629",checkedInLabel:"\u0646\u062C\u0627\u062D",unitLabel:"\u0631\u0645\u0632"}};function Ce(e,t){let n=/\{([^}]+)\}/g,a=[],p=0,c;for(;(c=n.exec(e))!==null;){let m=c[1],A=e.slice(p,c.index);A&&a.push(A),m in t?a.push(t[m]):a.push(c[0]),p=n.lastIndex}let l=e.slice(p);return l&&a.push(l),a}function ve(e,t){return e.replace("{num}",String(t))}import{useEffect as Le,useRef as Ie}from"react";import{jsx as q}from"react/jsx-runtime";var Ae=["#2ecc71","#3498db","#e67e22","#e67e22","#e74c3c"],ae=window.innerHeight,oe=300,x=(e,t)=>e+Math.floor(Math.random()*(t-e)),Ne=()=>Ae[x(0,Ae.length)];function Te({count:e}){let t=[],n=[Ke,Se,Se],a=e;for(;a--;){let p=n[x(0,3)];t.push(q(p,{},a))}return q("div",{className:"dcp-particles",children:t})}function Se(){let e=Ie(null),t=x(5,10),n=x(0,window.innerWidth),a=x(-ae,0),p=x(0,45),c={backgroundColor:Ne(),width:`${t}px`,height:`${t}px`,borderRadius:`${t}px`,transform:`rotateZ(${p}deg)`,left:`${n}px`,top:`${a}px`};return Le(()=>{let l=e.current;l&&(l.offsetHeight,l.style.top=`${window.innerHeight+x(0,ae)}px`,l.style.left=`${n+x(-oe,oe)}px`)},[n]),q("div",{ref:e,className:"dcp-particle",style:c})}function Ke(){let e=Ie(null),t=x(15,45),n=x(0,window.innerWidth),a=x(-ae,0),p=Ne(),c=x(-15,15),l={fill:p,width:`${t}px`,height:`${t}px`,transform:`rotateZ(${c}deg)`,left:`${n}px`,top:`${a}px`};return Le(()=>{let m=e.current;m&&(m.offsetHeight,m.style.top=`${window.innerHeight+x(0,ae)}px`,m.style.left=`${n+x(-oe,oe)}px`,m.style.transform=`rotateZ(${x(-15,15)}deg)`)},[n]),q("svg",{ref:e,className:"dcp-particle",style:l,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",children:q("path",{fill:p,d:"M428.127,0l-12.716,10.062l12.718-10.06c8.785,11.101,19.716,24.917,19.716,51.051 s-10.932,39.951-19.716,51.053c-7.382,9.331-12.716,16.072-12.716,30.927c0,14.854,5.334,21.594,12.716,30.925 c8.784,11.101,19.716,24.917,19.716,51.05c0,26.135-10.931,39.949-19.715,51.051c-7.383,9.331-12.717,16.072-12.717,30.927 c0,14.855,5.332,21.593,12.711,30.919l-25.435,20.124c-8.781-11.097-19.708-24.909-19.708-51.042 c0-26.135,10.931-39.949,19.715-51.051c7.383-9.331,12.717-16.072,12.717-30.927c0-14.855-5.335-21.595-12.717-30.926 c-8.784-11.101-19.715-24.916-19.715-51.049s10.931-39.95,19.715-51.051c7.383-9.331,12.717-16.072,12.717-30.928 c0-14.855-5.335-21.596-12.718-30.927L428.127,0z"})})}import{Fragment as Ye,jsx as r,jsxs as Q}from"react/jsx-runtime";var ze="data:image/webp;base64,UklGRkoEAABXRUJQVlA4WAoAAAAQAAAALwAALwAAQUxQSEkBAAABkGvb2rFXO7Zt+wJSJaVqu2Rlu7KdOiOd0zk5tm3bxvf/73vw4X2fK4iICYBxt/zFGx9/MaZ8ebjd5QvZAVWHTFw3e9zrIsNj8BcXaF5yFGXf8JELVhbExN7iEt/7CEj7wKWasgxVm7hkVmqgmstnWbrSTAS4kqQj9gMn+ctHw/4WJ/pSo5FTZY0qHh/I8N8qg5zwHICAn5QUAFWcdBqwSWsbbr9pfUY+p82iponx5h1qiw+oHXtP7bpC7elXag+fULt8mdruBrW5TmplmcTM9u6/aD0A1mmNAvmkWBDg8ILSbQCoJsSS/3N4R+cMVHvIsCg1nKUyBU2HLzROQ2fKbwpvrPUg+Y2872HQH3NP1ssAGPV9LeecNYx7nGLizPMQm/tBEDsdBuEtnwSwu6mQmtR3g+lhj0d8IN83vWvp2I1H1/emS1wgEABWUDgg2gIAAFAQAJ0BKjAAMAA+bTCRRaQjIZcaBmRABsS2AE6ZQjsP3jzBKV/KPvLtCJAu0zGr6gNsx5iP2F/bHsW/5L1AP256xj0K/Lg/bH4Of3E/bf2kU+3LWqqR9opDfL/wFrW1w3oQUN1Ppz9kIubudiXuf3Yx6IpARwAfSwhi2XeuXpChwtAxGeB9kz17cAAA/vYJ09WTT3xCi1J9Jq3tXE4YiM0kubBPCG18gILYn/mcSuXKecVYx+VH8+/3Jaw71cqA3QUMorqXx+0HY5lRjzZoSpwUOrZsn5l2sq5FvGHjeiYhTMdP/vMao9xPicytNu792iLMMXYqSBrx/87XDP76mt0wJ4fNR+kRLk+0X7FWQInSVOEUye3HoEhBE79oHHIjfJzKzETvSMr8mVg0C+2cciKNc+RzbWS9bIugTZHFJH0iKfsMeIYL16bX3SgxJ48n39jLpm8dWE4pM6V4RDWJ2PnKM5s2spJRoMx0mbHKaQHSlsjaHaHvlgQzVgDI/UGKZGaiSmGMczxKaYHfxLF98uSVH2uaxsvvUz++XiK9SoUF1AYTQgTobO85hrO5yIU7xv6ydCMpVSrWr9lONlhPOIDGfU74TFvJsXjITMijzHVRZAKUDUgrjEl8e1cGC48efqTBQgyVu8TldkR07H6Tq/xe5m7whEcZTFFi4UaTB00z3sEgJxesACi0SC1I6IuFQGnpR6PN/2FEp1ztFwCZUQx6Su/LclEErk/nmxPAzKSwhieYyV0cGt6eKwoAPLg2t8QmCSNha9H553MuAVDI1IiDRTHF/n0MwSBwtHhhhHkoKic5iK/3BBv6kL2ZOig4y0Xyejy8X/Xs2yNjv2CJi88Ae5uqIEaQIAVQQekjsjPNsRr078SVLv+X8OMsB2lpLju2tyFHqezQHfeq1pp4q+jqiQWJMkskE6mCIS5oVfE5tT/PwW9N/C36v4RAZRjyf7em4Ac0bpKgAAA=",Ge="data:image/webp;base64,UklGRo4DAABXRUJQVlA4WAoAAAAQAAAAOwAAOwAAQUxQSIQBAAABGbIBylRhE9H/uNMgB7Jt07bWs23btm0jtW2/96P/M9u2bTO0bdvGs2f9fO2ICWDjto0kyntVu93+4eY3Pvvhpz/EX13+6dKNCXeTQCT0J0mCpIFJYSFY9MWfvSIeOuQpMmT61JCx7aLd5nlpCN+QMe+7WSb6aPAnMKAP8u0COzFzt/Em6AY7MfN6WboB8UTt+ryGwgVWIPwEzA92niCPwfAaOYAn7ubrLCBeJ8tjQJ/peuczVbgl44tC4cxDzmGc/aCugvqEb/tKGcHV5YwIQLzfJEh7MNIND1iAXmr8r48nvKYL6Ldl2iEvC3WRBPTQQQmQl/l2QdrnDhtA/4yzCUHWAiqcD+haQdkJA10URdClgDLgAzpfmqCzIAE6Y1ASjEAnQw10XV6B7q+nGJr4B/uTEdBdchp0n+z2AUF22jb/IPfCDAcRZFdNdRZBdkyjTf6ShnxHg3Kl9BBgsmJkSqWNAJMSLFM6UwSZpSCB2JkkAkyVPw+27AgdBJk6O8KQjv4YVlA4IOQBAABwCwCdASo8ADwAPm0sk0ckIiGhLBK8AIANiWoNsAUgopAjP2bj4wL/G+Ix0uPMBjgG8co0DZmvcEO5ipr3YhGqmW3HlaMyfAEzIs97ZwIyCgc3Pwh2oLe8+FXTuTKdfAcrtraAAP7rZFw5n2K/5sD288EcLAc0t91ywxA9cDV2Tbb1HcfaqXhEFZ/kvBWQJ+RyfgEjM5lu3BDFTOl8FICR0rF/QBcNt9/pSCx/ok55r0fhdRUA/L8DKkdR+G98EK4rXy/cqOn57Qp0oEdxFz5nQtfSPeoNuFzp9f75rxQr1IprVPlgl8Zl81cP1ccptcUJluQHsVbQP1SGQpn+Dnsvge6EwelegGM0squCACbsXp1tTz45SX4BOrRRtoATJN86Ft6P9LkHBc1n4oRMVUj4YBkAynW2VjAH8nWpisnw2+VTfU8Km5IBqqG+ajqp9ONYKapcKGzV92ABhg1PJgLmclk/3bA9HOr0zpxXB9RG5K/1uI1kB3t39hQblljArCqHr45zT6AIB6ASQwE6ClPuZ+oNTpGtmnM0YOASQV4J9C50FrkuqQB23xw/6dIzm3VK6Zplam2ZYd7aUEmP2cVohSmLm//oJt54bQoUrZn08sk+wY2cFHMpKFVW1RPbp7hswAAA";function Ee({dim:e}){return r("img",{className:"dcp-coin",src:ze,alt:"",style:e?{filter:"grayscale(1) opacity(0.5)"}:void 0})}var We=1;function qe(e){let[t,n]=De([]),[a,p]=De("ready"),c=Ve(!1),l=f=>{n(v=>v.filter(G=>G!==f))},fe=e,{open:m,onOpenChange:A,title:L,subtitle:H,note:M,days:T=7,rewards:O,unitLabel:b,doneIcon:K="\u2713",columns:V=3,buttonLabel:D,checkedInLabel:B,closeDelay:u=1500,closeOnOverlayClick:U=!1,className:Y,locale:E="en",theme:w,baseUrl:ie}=fe,X=ye(fe,["open","onOpenChange","title","subtitle","note","days","rewards","unitLabel","doneIcon","columns","buttonLabel","checkedInLabel","closeDelay","closeOnOverlayClick","className","locale","theme","baseUrl"]),re=ne[E]?E:"en",z=ne[re],k=L!==void 0?L:z.title,g=M!==void 0?M:z.note,i=b!==void 0?b:z.unitLabel,s=D!==void 0?D:z.buttonLabel,o=B!==void 0?B:z.checkedInLabel,d={};w&&(w.primaryColor&&(d["--dcp-bg"]=w.primaryColor),w.secondaryColor&&(d["--dcp-secondary"]=w.secondaryColor),w.accentColor&&(d["--dcp-accent"]=w.accentColor));let y=m!==void 0,h=pe(_(j({},X),{locale:E,baseUrl:ie,autoShow:y?!1:X.autoShow})),P=y?m:h.open,R=f=>{y||h.setOpen(f),A==null||A(f)},{streak:J,checkedInToday:S,dailyStreakCoins:I}=h;if(ue(()=>{P&&!c.current&&p(S?"complete":"ready")},[P,S]),ue(()=>{xe()},[]),ue(()=>{if(!P)return;let f=v=>{v.key==="Escape"&&R(!1)};return document.addEventListener("keydown",f),()=>document.removeEventListener("keydown",f)},[P]),!P||typeof document=="undefined")return null;let C=I?I.map(f=>f.coins):O,F=I?I.length:T,Z=J===0?0:(J-1)%F+1,Pe=S?-1:Z,Re=Math.min(S?Math.max(Z-1,0):Z,F-1),ce=C==null?void 0:C[Re],Be=H!=null?H:Ce(z.subtitle,{coin:r(Ee,{}),reward:ce!=null?ce:""}),je=()=>{a==="ready"&&(c.current=!0,p("loading"),h.checkIn(),setTimeout(()=>{p("complete"),c.current=!1;let f=We++;n(v=>[...v,f]),setTimeout(()=>{l(f)},6e3),u>0&&window.setTimeout(()=>R(!1),u)},1e3))};return Je(Q("div",{className:"dcp-overlay",onClick:U?()=>R(!1):void 0,role:"presentation",children:[Q("div",{className:["dcp-card",(w==null?void 0:w.dark)&&"dcp-dark",Y].filter(Boolean).join(" "),style:j({["--dcp-columns"]:V},d),onClick:f=>f.stopPropagation(),role:"dialog","aria-modal":"true","aria-label":typeof k=="string"?k:"Daily check-in",children:[r("div",{className:"dcp-modal-img-wrap",children:r("div",{className:"dcp-wrap-with-img",children:r("img",{className:"dcp-badge-img",src:ze,alt:"",decoding:"async",loading:"lazy"})})}),r("button",{className:"dcp-close",onClick:()=>R(!1),"aria-label":"Close",children:"\xD7"}),r("h2",{className:"dcp-title",children:k}),r("p",{className:"dcp-subtitle",children:Be}),g?r("p",{className:"dcp-note",children:g}):null,r("div",{className:"dcp-days",children:Array.from({length:F},(f,v)=>{let G=v<Z,me=v===Pe,Qe=["dcp-day",G&&"dcp-day-done",me&&"dcp-day-today"].filter(Boolean).join(" ");return Q("div",{className:Qe,children:[G?K==="\u2713"?r("img",{src:Ge,className:"dcp-day-check-img",alt:"\u2713"}):r("span",{className:"dcp-day-check",children:K}):null,r("span",{className:"dcp-day-name",children:ve(z.dayLabel,v+1)}),(C==null?void 0:C[v])!=null?Q(Ye,{children:[r("span",{className:"dcp-day-value",children:C[v]}),Q("span",{className:"dcp-day-unit",children:[r(Ee,{dim:!G&&!me})," ",i]})]}):null]},v)})}),Q("button",{className:`dcp-button ${a}`,onClick:je,disabled:a!=="ready",children:[a==="ready"&&r("div",{className:"dcp-btn-message dcp-submit-message",children:r("span",{children:s})}),a==="loading"&&r("div",{className:"dcp-btn-message dcp-loading-message",children:Q("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 19 17",children:[r("circle",{className:"dcp-loading-circle",cx:"2.2",cy:"10",r:"1.6"}),r("circle",{className:"dcp-loading-circle",cx:"9.5",cy:"10",r:"1.6"}),r("circle",{className:"dcp-loading-circle",cx:"16.8",cy:"10",r:"1.6"})]})}),a==="complete"&&r("div",{className:"dcp-btn-message dcp-success-message",children:r("span",{children:o})})]})]}),t.map(f=>r(Te,{count:Math.floor(window.innerWidth/5)},f))]}),document.body)}export{qe as DailyCheckinPopup,ne as locales,pe as useDailyCheckin};
package/package.json ADDED
@@ -0,0 +1,62 @@
1
+ {
2
+ "name": "daily-checkin-popup",
3
+ "version": "0.1.33",
4
+ "description": "Daily check-in popup with streak tracking for React. Zero dependencies, auto-shows once per day.",
5
+ "type": "module",
6
+ "main": "./dist/index.cjs",
7
+ "module": "./dist/index.js",
8
+ "types": "./dist/index.d.ts",
9
+ "exports": {
10
+ ".": {
11
+ "types": "./dist/index.d.ts",
12
+ "import": "./dist/index.js",
13
+ "require": "./dist/index.cjs"
14
+ }
15
+ },
16
+ "files": [
17
+ "dist"
18
+ ],
19
+ "publishConfig": {
20
+ "access": "public"
21
+ },
22
+ "engines": {
23
+ "node": ">=14.18.0"
24
+ },
25
+ "sideEffects": false,
26
+ "scripts": {
27
+ "build": "tsup src/index.ts --format esm,cjs --dts --minify --target es2017",
28
+ "prepare": "npm run build",
29
+ "dev": "tsup src/index.ts --format esm,cjs --dts --watch --target es2017",
30
+ "prepublishOnly": "npm run build"
31
+ },
32
+ "peerDependencies": {
33
+ "react": ">=17",
34
+ "react-dom": ">=17"
35
+ },
36
+ "devDependencies": {
37
+ "@types/react": "^19.0.0",
38
+ "@types/react-dom": "^19.0.0",
39
+ "react": "^19.0.0",
40
+ "react-dom": "^19.0.0",
41
+ "tsup": "^6.7.0",
42
+ "typescript": "^5.4.5"
43
+ },
44
+ "repository": {
45
+ "type": "git",
46
+ "url": "git+https://github.com/nileshcopilot/daily-check-in.git"
47
+ },
48
+ "homepage": "https://github.com/nileshcopilot/daily-check-in#readme",
49
+ "bugs": {
50
+ "url": "https://github.com/nileshcopilot/daily-check-in/issues"
51
+ },
52
+ "keywords": [
53
+ "react",
54
+ "daily-checkin",
55
+ "check-in",
56
+ "popup",
57
+ "modal",
58
+ "streak",
59
+ "rewards"
60
+ ],
61
+ "license": "MIT"
62
+ }