@insforge/nextjs 0.4.0

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 ADDED
@@ -0,0 +1,468 @@
1
+ /* src/styles.css */
2
+ @font-face {
3
+ font-family: "Manrope";
4
+ src: url("./Manrope-VariableFont_wght-OKHRIJEM.ttf") format("truetype");
5
+ font-weight: 100 900;
6
+ font-style: normal;
7
+ font-display: swap;
8
+ }
9
+ :root {
10
+ --font-manrope:
11
+ "Manrope",
12
+ -apple-system,
13
+ BlinkMacSystemFont,
14
+ "Segoe UI",
15
+ Roboto,
16
+ sans-serif;
17
+ }
18
+ .insforge-auth-container * {
19
+ box-sizing: border-box;
20
+ }
21
+ .insforge-auth-container {
22
+ width: 100%;
23
+ max-width: 400px;
24
+ background: white;
25
+ }
26
+ .insforge-branding {
27
+ padding: 8px 8px 16px 8px;
28
+ display: flex;
29
+ flex-direction: row;
30
+ justify-content: center;
31
+ align-items: center;
32
+ gap: 4px;
33
+ }
34
+ .insforge-branding-text {
35
+ color: var(--black, #000);
36
+ font-family: var(--font-manrope);
37
+ font-size: 12px;
38
+ font-style: normal;
39
+ font-weight: 400;
40
+ line-height: normal;
41
+ }
42
+ .insforge-auth-card {
43
+ width: 100%;
44
+ border-radius: 12px;
45
+ box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.25);
46
+ }
47
+ .insforge-auth-content {
48
+ padding: 24px 24px 40px 24px;
49
+ display: flex;
50
+ flex-direction: column;
51
+ justify-content: center;
52
+ align-items: stretch;
53
+ gap: 24px;
54
+ }
55
+ .insforge-auth-header {
56
+ display: flex;
57
+ flex-direction: column;
58
+ justify-content: start;
59
+ align-items: start;
60
+ gap: 8px;
61
+ }
62
+ .insforge-auth-title {
63
+ color: #000;
64
+ font-family: Inter;
65
+ font-size: 32px;
66
+ font-style: normal;
67
+ font-weight: 400;
68
+ line-height: 48px;
69
+ }
70
+ .insforge-auth-subtitle {
71
+ color: #828282;
72
+ font-family: Inter;
73
+ font-size: 14px;
74
+ font-style: normal;
75
+ font-weight: 400;
76
+ line-height: 24px;
77
+ }
78
+ .insforge-error-banner {
79
+ display: flex;
80
+ align-items: center;
81
+ gap: 0.75rem;
82
+ padding: 1rem;
83
+ margin-bottom: 1.5rem;
84
+ background-color: #fef2f2;
85
+ border: 1px solid #fecaca;
86
+ border-radius: 0.5rem;
87
+ color: #dc2626;
88
+ font-size: 0.875rem;
89
+ line-height: 1.25rem;
90
+ }
91
+ .insforge-error-icon {
92
+ flex-shrink: 0;
93
+ width: 1.25rem;
94
+ height: 1.25rem;
95
+ }
96
+ .insforge-form {
97
+ display: flex;
98
+ flex-direction: column;
99
+ justify-content: center;
100
+ align-items: stretch;
101
+ gap: 24px;
102
+ }
103
+ .insforge-form-group {
104
+ display: flex;
105
+ flex-direction: column;
106
+ justify-content: center;
107
+ align-items: stretch;
108
+ gap: 4px;
109
+ }
110
+ .insforge-form-label-row {
111
+ display: flex;
112
+ justify-content: space-between;
113
+ align-items: center;
114
+ }
115
+ .insforge-form-label {
116
+ color: #000;
117
+ font-family: Inter;
118
+ font-size: 14px;
119
+ font-style: normal;
120
+ font-weight: 400;
121
+ line-height: 24px;
122
+ }
123
+ .insforge-form-link {
124
+ color: #828282;
125
+ text-align: right;
126
+ font-family: Inter;
127
+ font-size: 14px;
128
+ font-style: normal;
129
+ font-weight: 400;
130
+ line-height: 24px;
131
+ }
132
+ .insforge-form-link:hover {
133
+ color: #828282;
134
+ text-decoration: underline;
135
+ }
136
+ .insforge-input-wrapper {
137
+ position: relative;
138
+ }
139
+ .insforge-input {
140
+ width: 100%;
141
+ display: flex;
142
+ padding: 8px 8px 10px 12px;
143
+ align-items: center;
144
+ gap: 8px;
145
+ align-self: stretch;
146
+ border-radius: 4px;
147
+ border: 1px solid #BCBCBC;
148
+ background: #FFF;
149
+ font-family: Inter;
150
+ font-size: 16px;
151
+ font-style: normal;
152
+ font-weight: 400;
153
+ line-height: 20px;
154
+ }
155
+ .insforge-input::placeholder {
156
+ color: #A6A6A6;
157
+ }
158
+ .insforge-input:focus {
159
+ outline: none;
160
+ }
161
+ .insforge-input-with-icon {
162
+ padding-right: 3rem;
163
+ }
164
+ .insforge-input-icon-btn {
165
+ position: absolute;
166
+ right: 8px;
167
+ top: 50%;
168
+ transform: translateY(-50%);
169
+ background: transparent;
170
+ border: none;
171
+ color: #A6A6A6;
172
+ cursor: pointer;
173
+ transition: color 0.2s;
174
+ display: flex;
175
+ align-items: center;
176
+ justify-content: center;
177
+ }
178
+ .insforge-input-icon-btn:hover {
179
+ color: #6b7280;
180
+ }
181
+ .insforge-btn-primary {
182
+ border-radius: 4px;
183
+ background: #000;
184
+ width: 100%;
185
+ display: flex;
186
+ padding: 12px 16px;
187
+ justify-content: center;
188
+ align-items: center;
189
+ gap: 10px;
190
+ align-self: stretch;
191
+ color: #FFF;
192
+ font-family: Manrope;
193
+ font-size: 16px;
194
+ font-style: normal;
195
+ font-weight: 600;
196
+ line-height: normal;
197
+ border: none;
198
+ cursor: pointer;
199
+ }
200
+ .insforge-btn-primary:hover {
201
+ background: #303030;
202
+ }
203
+ .insforge-btn-primary:disabled {
204
+ opacity: 0.5;
205
+ cursor: not-allowed;
206
+ }
207
+ .insforge-btn-primary .insforge-btn-loader {
208
+ display: none;
209
+ animation: insforge-spin 1s linear infinite;
210
+ }
211
+ .insforge-btn-primary[data-loading] .insforge-btn-loader {
212
+ display: block;
213
+ }
214
+ .insforge-text-center {
215
+ text-align: center;
216
+ margin: -12px 0 0 0;
217
+ color: #828282;
218
+ font-family: Inter;
219
+ font-size: 14px;
220
+ font-style: normal;
221
+ font-weight: 400;
222
+ line-height: 24px;
223
+ }
224
+ .insforge-link-primary {
225
+ color: #2563EB;
226
+ font-family: Inter;
227
+ font-size: 14px;
228
+ font-style: normal;
229
+ font-weight: 400;
230
+ line-height: 24px;
231
+ }
232
+ .insforge-link-primary:hover {
233
+ text-decoration: underline;
234
+ }
235
+ .insforge-divider {
236
+ display: flex;
237
+ justify-content: center;
238
+ align-items: center;
239
+ gap: 24px;
240
+ align-self: stretch;
241
+ }
242
+ .insforge-divider::before,
243
+ .insforge-divider::after {
244
+ content: "";
245
+ flex: 1;
246
+ height: 1px;
247
+ background: #C6C6C6;
248
+ }
249
+ .insforge-divider-text {
250
+ color: #C6C6C6;
251
+ font-family: Manrope;
252
+ font-size: 14px;
253
+ font-style: normal;
254
+ font-weight: 600;
255
+ line-height: normal;
256
+ }
257
+ .insforge-oauth-container {
258
+ display: flex;
259
+ flex-direction: column;
260
+ align-items: stretch;
261
+ gap: 12px;
262
+ }
263
+ .insforge-oauth-btn {
264
+ display: flex;
265
+ height: 36px;
266
+ padding: 8px 12px;
267
+ flex-direction: row;
268
+ justify-content: center;
269
+ align-items: center;
270
+ gap: 12px;
271
+ border-radius: 6px;
272
+ border: 1px solid #E4E4E7;
273
+ background: #FFF;
274
+ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.10);
275
+ color: #09090B;
276
+ text-align: center;
277
+ font-family: Inter;
278
+ font-size: 14px;
279
+ font-style: normal;
280
+ font-weight: 500;
281
+ line-height: 20px;
282
+ cursor: pointer;
283
+ }
284
+ .insforge-oauth-btn:hover {
285
+ background: #f9fafb;
286
+ border-color: #9ca3af;
287
+ }
288
+ .insforge-oauth-btn:disabled {
289
+ opacity: 0.6;
290
+ cursor: not-allowed;
291
+ }
292
+ .insforge-oauth-icon {
293
+ display: flex;
294
+ align-items: center;
295
+ justify-content: center;
296
+ flex-shrink: 0;
297
+ }
298
+ .insforge-oauth-loader {
299
+ display: none;
300
+ animation: insforge-spin 1s linear infinite;
301
+ }
302
+ .insforge-oauth-btn[data-loading] .insforge-oauth-icon {
303
+ display: none;
304
+ }
305
+ .insforge-oauth-btn[data-loading] .insforge-oauth-loader {
306
+ display: block;
307
+ }
308
+ @keyframes insforge-spin {
309
+ from {
310
+ transform: rotate(0deg);
311
+ }
312
+ to {
313
+ transform: rotate(360deg);
314
+ }
315
+ }
316
+ .insforge-user-button-container {
317
+ position: relative;
318
+ display: inline-block;
319
+ }
320
+ .insforge-user-button {
321
+ padding: 0.25rem;
322
+ background: transparent;
323
+ border: none;
324
+ border-radius: 9999px;
325
+ cursor: pointer;
326
+ transition: all 0.2s;
327
+ display: flex;
328
+ align-items: center;
329
+ justify-content: center;
330
+ gap: 0.5rem;
331
+ }
332
+ .insforge-user-button:hover {
333
+ background: rgba(0, 0, 0, 0.05);
334
+ }
335
+ .insforge-user-button-detailed {
336
+ border-radius: 0.5rem;
337
+ padding: 0.5rem;
338
+ }
339
+ .insforge-user-button-info {
340
+ display: flex;
341
+ flex-direction: column;
342
+ align-items: flex-start;
343
+ gap: 0.125rem;
344
+ }
345
+ .insforge-user-button-name {
346
+ font-size: 0.875rem;
347
+ font-weight: 600;
348
+ color: #111827;
349
+ line-height: 1.25rem;
350
+ text-align: left;
351
+ }
352
+ .insforge-user-button-email {
353
+ font-size: 0.75rem;
354
+ color: #6b7280;
355
+ line-height: 1rem;
356
+ text-align: left;
357
+ }
358
+ .insforge-user-avatar {
359
+ width: 2.5rem;
360
+ height: 2.5rem;
361
+ border-radius: 9999px;
362
+ object-fit: cover;
363
+ }
364
+ .insforge-user-avatar-placeholder {
365
+ display: flex;
366
+ align-items: center;
367
+ justify-content: center;
368
+ width: 2.5rem;
369
+ height: 2.5rem;
370
+ background: #3b82f6;
371
+ color: white;
372
+ font-weight: 600;
373
+ font-size: 0.875rem;
374
+ border-radius: 9999px;
375
+ }
376
+ .insforge-user-dropdown {
377
+ position: absolute;
378
+ top: 100%;
379
+ right: 0;
380
+ margin-top: 0.5rem;
381
+ min-width: 10rem;
382
+ background: white;
383
+ border: 1px solid #e5e7eb;
384
+ border-radius: 0.5rem;
385
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
386
+ z-index: 50;
387
+ overflow: hidden;
388
+ padding: 0.25rem;
389
+ }
390
+ .insforge-sign-out-button {
391
+ display: flex;
392
+ align-items: center;
393
+ justify-content: flex-start;
394
+ gap: 0.5rem;
395
+ width: 100%;
396
+ padding: 0.5rem 0.75rem;
397
+ font-size: 0.875rem;
398
+ font-family: inherit;
399
+ color: #dc2626;
400
+ background: transparent;
401
+ border: none;
402
+ border-radius: 0.375rem;
403
+ cursor: pointer;
404
+ transition: background 0.2s;
405
+ text-align: left;
406
+ }
407
+ .insforge-sign-out-button:hover {
408
+ background: #fef2f2;
409
+ }
410
+ .insforge-loading {
411
+ display: flex;
412
+ justify-content: center;
413
+ align-items: center;
414
+ padding: 2rem;
415
+ color: #6b7280;
416
+ font-size: 0.875rem;
417
+ }
418
+ .insforge-password-strength {
419
+ display: flex;
420
+ flex-direction: column;
421
+ gap: 0.25rem;
422
+ margin-top: 0.5rem;
423
+ }
424
+ .insforge-password-requirement {
425
+ height: 1.5rem;
426
+ display: flex;
427
+ align-items: center;
428
+ gap: 0.25rem;
429
+ }
430
+ .insforge-password-check {
431
+ width: 1.25rem;
432
+ height: 1.25rem;
433
+ border-radius: 9999px;
434
+ display: flex;
435
+ border-width: 2px;
436
+ border-style: solid;
437
+ align-items: center;
438
+ justify-content: center;
439
+ transition: all 0.2s ease-in-out;
440
+ background-color: transparent;
441
+ border-color: #a3a3a3;
442
+ flex-shrink: 0;
443
+ }
444
+ .insforge-password-check-valid {
445
+ background-color: #22c55e;
446
+ border-color: transparent;
447
+ }
448
+ .insforge-password-check-icon {
449
+ color: #fff;
450
+ stroke-width: 3;
451
+ }
452
+ .insforge-password-requirement-label {
453
+ color: #000;
454
+ font-family: Inter;
455
+ font-size: 14px;
456
+ font-style: normal;
457
+ font-weight: 400;
458
+ line-height: 24px;
459
+ }
460
+ @media (max-width: 640px) {
461
+ .insforge-auth-card {
462
+ padding: 2rem 1.5rem;
463
+ }
464
+ .insforge-auth-title {
465
+ font-size: 1.75rem;
466
+ }
467
+ }
468
+ /*# sourceMappingURL=index.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/styles.css"],"sourcesContent":["/**\r\n * InsForge Next.js Component Library Styles\r\n * A standalone CSS file for auth components - no Tailwind required!\r\n */\r\n\r\n/* Font Face Declaration */\r\n@font-face {\r\n font-family: 'Manrope';\r\n src: url('./fonts/Manrope-VariableFont_wght.ttf') format('truetype');\r\n font-weight: 100 900;\r\n font-style: normal;\r\n font-display: swap;\r\n}\r\n\r\n/* CSS Variables */\r\n:root {\r\n --font-manrope: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\r\n}\r\n\r\n/* Reset and Base Styles */\r\n.insforge-auth-container * {\r\n box-sizing: border-box;\r\n}\r\n\r\n/* Main Container - App handles layout, we just provide the card */\r\n.insforge-auth-container {\r\n width: 100%;\r\n max-width: 400px;\r\n background: white;\r\n}\r\n\r\n.insforge-branding {\r\n padding: 8px 8px 16px 8px;\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 4px;\r\n}\r\n\r\n.insforge-branding-text {\r\n color: var(--black, #000);\r\n font-family: var(--font-manrope);\r\n font-size: 12px;\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: normal;\r\n}\r\n\r\n/* Form Card */\r\n.insforge-auth-card {\r\n width: 100%;\r\n border-radius: 12px;\r\n box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.25);\r\n}\r\n\r\n.insforge-auth-content {\r\n padding: 24px 24px 40px 24px;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: stretch;\r\n gap: 24px;\r\n}\r\n\r\n/* Header */\r\n.insforge-auth-header {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: start;\r\n align-items: start;\r\n gap: 8px;\r\n}\r\n\r\n.insforge-auth-title {\r\n color: #000;\r\n font-family: Inter;\r\n font-size: 32px;\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: 48px;\r\n}\r\n\r\n.insforge-auth-subtitle {\r\n color: #828282;\r\n font-family: Inter;\r\n font-size: 14px;\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: 24px;\r\n}\r\n\r\n/* Error Banner */\r\n.insforge-error-banner {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.75rem;\r\n padding: 1rem;\r\n margin-bottom: 1.5rem;\r\n background-color: #fef2f2;\r\n border: 1px solid #fecaca;\r\n border-radius: 0.5rem;\r\n color: #dc2626;\r\n font-size: 0.875rem;\r\n line-height: 1.25rem;\r\n}\r\n\r\n.insforge-error-icon {\r\n flex-shrink: 0;\r\n width: 1.25rem;\r\n height: 1.25rem;\r\n}\r\n\r\n/* Form Elements */\r\n.insforge-form {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: stretch;\r\n gap: 24px;\r\n}\r\n\r\n.insforge-form-group {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: stretch;\r\n gap: 4px;\r\n}\r\n\r\n.insforge-form-label-row {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n}\r\n\r\n.insforge-form-label {\r\n color: #000;\r\n font-family: Inter;\r\n font-size: 14px;\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: 24px;\r\n}\r\n\r\n.insforge-form-link {\r\n color: #828282;\r\n text-align: right;\r\n font-family: Inter;\r\n font-size: 14px;\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: 24px;\r\n}\r\n\r\n.insforge-form-link:hover {\r\n color: #828282;\r\n text-decoration: underline;\r\n}\r\n\r\n/* Input Container for Password (with icon) */\r\n.insforge-input-wrapper {\r\n position: relative;\r\n}\r\n\r\n.insforge-input {\r\n width: 100%;\r\n display: flex;\r\n padding: 8px 8px 10px 12px;\r\n align-items: center;\r\n gap: 8px;\r\n align-self: stretch;\r\n border-radius: 4px;\r\n border: 1px solid #BCBCBC;\r\n background: #FFF;\r\n font-family: Inter;\r\n font-size: 16px;\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: 20px;\r\n}\r\n\r\n.insforge-input::placeholder {\r\n color: #A6A6A6;\r\n}\r\n\r\n.insforge-input:focus {\r\n outline: none;\r\n}\r\n\r\n.insforge-input-with-icon {\r\n padding-right: 3rem;\r\n}\r\n\r\n.insforge-input-icon-btn {\r\n position: absolute;\r\n right: 8px;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n background: transparent;\r\n border: none;\r\n color: #A6A6A6;\r\n cursor: pointer;\r\n transition: color 0.2s;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n}\r\n\r\n.insforge-input-icon-btn:hover {\r\n color: #6b7280;\r\n}\r\n\r\n/* Primary Button */\r\n.insforge-btn-primary {\r\n border-radius: 4px;\r\n background: #000;\r\n width: 100%;\r\n display: flex;\r\n padding: 12px 16px;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 10px;\r\n align-self: stretch;\r\n color: #FFF;\r\n font-family: Manrope;\r\n font-size: 16px;\r\n font-style: normal;\r\n font-weight: 600;\r\n line-height: normal;\r\n border: none;\r\n cursor: pointer;\r\n}\r\n\r\n.insforge-btn-primary:hover {\r\n background: #303030;\r\n}\r\n\r\n.insforge-btn-primary:disabled {\r\n opacity: 0.5;\r\n cursor: not-allowed;\r\n}\r\n\r\n.insforge-btn-primary .insforge-btn-loader {\r\n display: none;\r\n animation: insforge-spin 1s linear infinite;\r\n}\r\n\r\n.insforge-btn-primary[data-loading] .insforge-btn-loader {\r\n display: block;\r\n}\r\n\r\n/* Text Link Section */\r\n.insforge-text-center {\r\n text-align: center;\r\n margin: -12px 0 0 0;\r\n color: #828282;\r\n font-family: Inter;\r\n font-size: 14px;\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: 24px;\r\n}\r\n\r\n.insforge-link-primary {\r\n color: #2563EB;\r\n font-family: Inter;\r\n font-size: 14px;\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: 24px;\r\n}\r\n\r\n.insforge-link-primary:hover {\r\n text-decoration: underline;\r\n}\r\n\r\n/* Divider */\r\n.insforge-divider {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 24px;\r\n align-self: stretch;\r\n}\r\n\r\n.insforge-divider::before,\r\n.insforge-divider::after {\r\n content: '';\r\n flex: 1;\r\n height: 1px;\r\n background: #C6C6C6;\r\n}\r\n\r\n.insforge-divider-text {\r\n color: #C6C6C6;\r\n font-family: Manrope;\r\n font-size: 14px;\r\n font-style: normal;\r\n font-weight: 600;\r\n line-height: normal;\r\n}\r\n\r\n/* OAuth Section */\r\n.insforge-oauth-container {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n gap: 12px;\r\n}\r\n\r\n/* OAuth Button */\r\n.insforge-oauth-btn {\r\n display: flex;\r\n height: 36px;\r\n padding: 8px 12px;\r\n flex-direction: row;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 12px;\r\n border-radius: 6px;\r\n border: 1px solid #E4E4E7;\r\n background: #FFF;\r\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.10);\r\n color: #09090B;\r\n text-align: center;\r\n font-family: Inter;\r\n font-size: 14px;\r\n font-style: normal;\r\n font-weight: 500;\r\n line-height: 20px;\r\n cursor: pointer;\r\n}\r\n\r\n.insforge-oauth-btn:hover {\r\n background: #f9fafb;\r\n border-color: #9ca3af;\r\n}\r\n\r\n.insforge-oauth-btn:disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n}\r\n\r\n.insforge-oauth-icon {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n}\r\n\r\n.insforge-oauth-loader {\r\n display: none;\r\n animation: insforge-spin 1s linear infinite;\r\n}\r\n\r\n.insforge-oauth-btn[data-loading] .insforge-oauth-icon {\r\n display: none;\r\n}\r\n\r\n.insforge-oauth-btn[data-loading] .insforge-oauth-loader {\r\n display: block;\r\n}\r\n\r\n/* Spin Animation */\r\n@keyframes insforge-spin {\r\n from {\r\n transform: rotate(0deg);\r\n }\r\n to {\r\n transform: rotate(360deg);\r\n }\r\n}\r\n\r\n/* UserButton Styles */\r\n.insforge-user-button-container {\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.insforge-user-button {\r\n padding: 0.25rem;\r\n background: transparent;\r\n border: none;\r\n border-radius: 9999px;\r\n cursor: pointer;\r\n transition: all 0.2s;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 0.5rem;\r\n}\r\n\r\n.insforge-user-button:hover {\r\n background: rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.insforge-user-button-detailed {\r\n border-radius: 0.5rem;\r\n padding: 0.5rem;\r\n}\r\n\r\n.insforge-user-button-info {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-start;\r\n gap: 0.125rem;\r\n}\r\n\r\n.insforge-user-button-name {\r\n font-size: 0.875rem;\r\n font-weight: 600;\r\n color: #111827;\r\n line-height: 1.25rem;\r\n text-align: left;\r\n}\r\n\r\n.insforge-user-button-email {\r\n font-size: 0.75rem;\r\n color: #6b7280;\r\n line-height: 1rem;\r\n text-align: left;\r\n}\r\n\r\n.insforge-user-avatar {\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n border-radius: 9999px;\r\n object-fit: cover;\r\n}\r\n\r\n.insforge-user-avatar-placeholder {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 2.5rem;\r\n height: 2.5rem;\r\n background: #3b82f6;\r\n color: white;\r\n font-weight: 600;\r\n font-size: 0.875rem;\r\n border-radius: 9999px;\r\n}\r\n\r\n.insforge-user-dropdown {\r\n position: absolute;\r\n top: 100%;\r\n right: 0;\r\n margin-top: 0.5rem;\r\n min-width: 10rem;\r\n background: white;\r\n border: 1px solid #e5e7eb;\r\n border-radius: 0.5rem;\r\n box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\r\n z-index: 50;\r\n overflow: hidden;\r\n padding: 0.25rem;\r\n}\r\n\r\n.insforge-sign-out-button {\r\n display: flex;\r\n align-items: center;\r\n justify-content: flex-start;\r\n gap: 0.5rem;\r\n width: 100%;\r\n padding: 0.5rem 0.75rem;\r\n font-size: 0.875rem;\r\n font-family: inherit;\r\n color: #dc2626;\r\n background: transparent;\r\n border: none;\r\n border-radius: 0.375rem;\r\n cursor: pointer;\r\n transition: background 0.2s;\r\n text-align: left;\r\n}\r\n\r\n.insforge-sign-out-button:hover {\r\n background: #fef2f2;\r\n}\r\n\r\n/* Loading State */\r\n.insforge-loading {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n padding: 2rem;\r\n color: #6b7280;\r\n font-size: 0.875rem;\r\n}\r\n\r\n/* Password Strength Indicator */\r\n.insforge-password-strength {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 0.25rem;\r\n margin-top: 0.5rem;\r\n}\r\n\r\n.insforge-password-requirement {\r\n height: 1.5rem;\r\n display: flex;\r\n align-items: center;\r\n gap: 0.25rem;\r\n}\r\n\r\n.insforge-password-check {\r\n width: 1.25rem;\r\n height: 1.25rem;\r\n border-radius: 9999px;\r\n display: flex;\r\n border-width: 2px;\r\n border-style: solid;\r\n align-items: center;\r\n justify-content: center;\r\n transition: all 0.2s ease-in-out;\r\n background-color: transparent;\r\n border-color: #a3a3a3;\r\n flex-shrink: 0;\r\n}\r\n\r\n.insforge-password-check-valid {\r\n background-color: #22c55e;\r\n border-color: transparent;\r\n}\r\n\r\n.insforge-password-check-icon {\r\n color: #fff;\r\n stroke-width: 3;\r\n}\r\n\r\n.insforge-password-requirement-label {\r\n color:#000;\r\n font-family: Inter;\r\n font-size: 14px;\r\n font-style: normal;\r\n font-weight: 400;\r\n line-height: 24px;\r\n}\r\n\r\n/* Responsive adjustments */\r\n@media (max-width: 640px) {\r\n .insforge-auth-card {\r\n padding: 2rem 1.5rem;\r\n }\r\n\r\n .insforge-auth-title {\r\n font-size: 1.75rem;\r\n }\r\n}\r\n\r\n"],"mappings":"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","names":[]}
@@ -0,0 +1,146 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import * as react from 'react';
3
+ import { ReactNode } from 'react';
4
+
5
+ interface InsforgeUser {
6
+ id: string;
7
+ email: string;
8
+ avatar_url?: string;
9
+ nickname?: string;
10
+ bio?: string;
11
+ birthday?: string;
12
+ createdAt: string;
13
+ updatedAt: string;
14
+ [key: string]: any;
15
+ }
16
+ interface InsforgeSession {
17
+ userId: string;
18
+ token: string;
19
+ expiresAt: string;
20
+ createdAt: string;
21
+ }
22
+ interface AuthContextValue {
23
+ user: InsforgeUser | null;
24
+ session: InsforgeSession | null;
25
+ isLoaded: boolean;
26
+ isSignedIn: boolean;
27
+ signIn: (email: string, password: string) => Promise<void>;
28
+ signUp: (email: string, password: string) => Promise<void>;
29
+ signOut: () => Promise<void>;
30
+ updateUser: (data: Partial<InsforgeUser>) => Promise<void>;
31
+ }
32
+ interface AuthProviderProps {
33
+ children: ReactNode;
34
+ baseUrl: string;
35
+ onAuthChange?: (user: InsforgeUser | null) => void;
36
+ }
37
+ interface SignInProps {
38
+ baseUrl: string;
39
+ afterSignInUrl?: string;
40
+ providers?: OAuthProvider[];
41
+ appearance?: {
42
+ container?: React.CSSProperties;
43
+ form?: React.CSSProperties;
44
+ button?: React.CSSProperties;
45
+ };
46
+ title?: string;
47
+ subtitle?: string;
48
+ emailLabel?: string;
49
+ emailPlaceholder?: string;
50
+ passwordLabel?: string;
51
+ passwordPlaceholder?: string;
52
+ forgotPasswordText?: string;
53
+ submitButtonText?: string;
54
+ loadingButtonText?: string;
55
+ signUpText?: string;
56
+ signUpLinkText?: string;
57
+ signUpUrl?: string;
58
+ dividerText?: string;
59
+ onSuccess?: (user: InsforgeUser) => void;
60
+ onError?: (error: Error) => void;
61
+ }
62
+ interface SignUpProps {
63
+ baseUrl: string;
64
+ afterSignUpUrl?: string;
65
+ providers?: OAuthProvider[];
66
+ appearance?: {
67
+ container?: React.CSSProperties;
68
+ form?: React.CSSProperties;
69
+ button?: React.CSSProperties;
70
+ };
71
+ title?: string;
72
+ subtitle?: string;
73
+ emailLabel?: string;
74
+ emailPlaceholder?: string;
75
+ passwordLabel?: string;
76
+ passwordPlaceholder?: string;
77
+ submitButtonText?: string;
78
+ loadingButtonText?: string;
79
+ signInText?: string;
80
+ signInLinkText?: string;
81
+ signInUrl?: string;
82
+ dividerText?: string;
83
+ onSuccess?: (user: InsforgeUser) => void;
84
+ onError?: (error: Error) => void;
85
+ }
86
+ interface UserButtonProps {
87
+ afterSignOutUrl?: string;
88
+ mode?: 'detailed' | 'simple';
89
+ appearance?: {
90
+ button?: React.CSSProperties;
91
+ dropdown?: React.CSSProperties;
92
+ };
93
+ }
94
+ interface ProtectProps {
95
+ children: ReactNode;
96
+ fallback?: ReactNode;
97
+ redirectTo?: string;
98
+ condition?: (user: InsforgeUser) => boolean;
99
+ }
100
+ interface ConditionalProps {
101
+ children: ReactNode;
102
+ }
103
+ type OAuthProvider = 'google' | 'github';
104
+
105
+ declare function AuthProvider({ children, baseUrl, onAuthChange }: AuthProviderProps): react_jsx_runtime.JSX.Element;
106
+
107
+ interface InsforgeConfig {
108
+ oauthProviders: OAuthProvider[];
109
+ isLoaded: boolean;
110
+ refetch: () => Promise<void>;
111
+ }
112
+ interface InsforgeConfigProviderProps {
113
+ children: ReactNode;
114
+ baseUrl: string;
115
+ }
116
+ declare function InsforgeConfigProvider({ children, baseUrl }: InsforgeConfigProviderProps): react_jsx_runtime.JSX.Element;
117
+ declare function useInsforgeConfig(): InsforgeConfig;
118
+
119
+ declare function useAuth(): AuthContextValue;
120
+
121
+ declare function useUser(): {
122
+ user: InsforgeUser | null;
123
+ isLoaded: boolean;
124
+ };
125
+
126
+ declare function useSession(): {
127
+ session: InsforgeSession | null;
128
+ isLoaded: boolean;
129
+ isSignedIn: boolean;
130
+ };
131
+
132
+ declare function useOAuthProviders(): OAuthProvider[];
133
+
134
+ declare function SignIn({ baseUrl, afterSignInUrl, providers, appearance, title, subtitle, emailLabel, emailPlaceholder, passwordLabel, passwordPlaceholder, forgotPasswordText, submitButtonText, loadingButtonText, signUpText, signUpLinkText, signUpUrl, dividerText, onSuccess, onError, }: SignInProps): react_jsx_runtime.JSX.Element;
135
+
136
+ declare function SignUp({ baseUrl, afterSignUpUrl, providers, appearance, title, subtitle, emailLabel, emailPlaceholder, passwordLabel, passwordPlaceholder, submitButtonText, loadingButtonText, signInText, signInLinkText, signInUrl, dividerText, onSuccess, onError, }: SignUpProps): react_jsx_runtime.JSX.Element;
137
+
138
+ declare function UserButton({ afterSignOutUrl, mode, appearance, }: UserButtonProps): react_jsx_runtime.JSX.Element | null;
139
+
140
+ declare function SignedIn({ children }: ConditionalProps): react_jsx_runtime.JSX.Element | null;
141
+
142
+ declare function SignedOut({ children }: ConditionalProps): react_jsx_runtime.JSX.Element | null;
143
+
144
+ declare function Protect({ children, fallback, redirectTo, condition, }: ProtectProps): string | number | bigint | true | Iterable<react.ReactNode> | Promise<react.AwaitedReactNode> | react_jsx_runtime.JSX.Element | null;
145
+
146
+ export { type AuthContextValue, AuthProvider, type AuthProviderProps, type ConditionalProps, InsforgeConfigProvider, type InsforgeSession, type InsforgeUser, type OAuthProvider, Protect, type ProtectProps, SignIn, type SignInProps, SignUp, type SignUpProps, SignedIn, SignedOut, UserButton, type UserButtonProps, useAuth, useInsforgeConfig, useOAuthProviders, useSession, useUser };