@ory/elements-react 0.0.0-pr.8e964fc1 → 0.0.0-pr.f3c2f07
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/CHANGELOG.md +111 -0
- package/DEVELOPMENT.md +19 -4
- package/babel.config.js +10 -0
- package/dist/client/frontendClient.d.mts +5 -2
- package/dist/client/frontendClient.d.ts +5 -2
- package/dist/client/frontendClient.js +25 -2
- package/dist/client/frontendClient.js.map +1 -1
- package/dist/client/frontendClient.mjs +25 -2
- package/dist/client/frontendClient.mjs.map +1 -1
- package/dist/index.d.mts +40 -5
- package/dist/index.d.ts +40 -5
- package/dist/index.js +539 -114
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +539 -115
- package/dist/index.mjs.map +1 -1
- package/dist/theme/default/index.css +171 -110
- package/dist/theme/default/index.css.map +1 -1
- package/dist/theme/default/index.d.mts +30 -4
- package/dist/theme/default/index.d.ts +30 -4
- package/dist/theme/default/index.js +3811 -551
- package/dist/theme/default/index.js.map +1 -1
- package/dist/theme/default/index.mjs +3823 -497
- package/dist/theme/default/index.mjs.map +1 -1
- package/package.json +9 -3
- package/tsconfig.json +1 -1
- package/dist/theme/default/tailwind/defaults.d.mts +0 -737
- package/dist/theme/default/tailwind/defaults.d.ts +0 -737
|
@@ -154,6 +154,114 @@
|
|
|
154
154
|
/* src/theme/default/global.css */
|
|
155
155
|
*,
|
|
156
156
|
::before,
|
|
157
|
+
::after {
|
|
158
|
+
--tw-border-spacing-x: 0;
|
|
159
|
+
--tw-border-spacing-y: 0;
|
|
160
|
+
--tw-translate-x: 0;
|
|
161
|
+
--tw-translate-y: 0;
|
|
162
|
+
--tw-rotate: 0;
|
|
163
|
+
--tw-skew-x: 0;
|
|
164
|
+
--tw-skew-y: 0;
|
|
165
|
+
--tw-scale-x: 1;
|
|
166
|
+
--tw-scale-y: 1;
|
|
167
|
+
--tw-pan-x: ;
|
|
168
|
+
--tw-pan-y: ;
|
|
169
|
+
--tw-pinch-zoom: ;
|
|
170
|
+
--tw-scroll-snap-strictness: proximity;
|
|
171
|
+
--tw-gradient-from-position: ;
|
|
172
|
+
--tw-gradient-via-position: ;
|
|
173
|
+
--tw-gradient-to-position: ;
|
|
174
|
+
--tw-ordinal: ;
|
|
175
|
+
--tw-slashed-zero: ;
|
|
176
|
+
--tw-numeric-figure: ;
|
|
177
|
+
--tw-numeric-spacing: ;
|
|
178
|
+
--tw-numeric-fraction: ;
|
|
179
|
+
--tw-ring-inset: ;
|
|
180
|
+
--tw-ring-offset-width: 0px;
|
|
181
|
+
--tw-ring-offset-color: #fff;
|
|
182
|
+
--tw-ring-color: rgb(147 197 253 / 0.5);
|
|
183
|
+
--tw-ring-offset-shadow: 0 0 #0000;
|
|
184
|
+
--tw-ring-shadow: 0 0 #0000;
|
|
185
|
+
--tw-shadow: 0 0 #0000;
|
|
186
|
+
--tw-shadow-colored: 0 0 #0000;
|
|
187
|
+
--tw-blur: ;
|
|
188
|
+
--tw-brightness: ;
|
|
189
|
+
--tw-contrast: ;
|
|
190
|
+
--tw-grayscale: ;
|
|
191
|
+
--tw-hue-rotate: ;
|
|
192
|
+
--tw-invert: ;
|
|
193
|
+
--tw-saturate: ;
|
|
194
|
+
--tw-sepia: ;
|
|
195
|
+
--tw-drop-shadow: ;
|
|
196
|
+
--tw-backdrop-blur: ;
|
|
197
|
+
--tw-backdrop-brightness: ;
|
|
198
|
+
--tw-backdrop-contrast: ;
|
|
199
|
+
--tw-backdrop-grayscale: ;
|
|
200
|
+
--tw-backdrop-hue-rotate: ;
|
|
201
|
+
--tw-backdrop-invert: ;
|
|
202
|
+
--tw-backdrop-opacity: ;
|
|
203
|
+
--tw-backdrop-saturate: ;
|
|
204
|
+
--tw-backdrop-sepia: ;
|
|
205
|
+
--tw-contain-size: ;
|
|
206
|
+
--tw-contain-layout: ;
|
|
207
|
+
--tw-contain-paint: ;
|
|
208
|
+
--tw-contain-style: ;
|
|
209
|
+
}
|
|
210
|
+
::backdrop {
|
|
211
|
+
--tw-border-spacing-x: 0;
|
|
212
|
+
--tw-border-spacing-y: 0;
|
|
213
|
+
--tw-translate-x: 0;
|
|
214
|
+
--tw-translate-y: 0;
|
|
215
|
+
--tw-rotate: 0;
|
|
216
|
+
--tw-skew-x: 0;
|
|
217
|
+
--tw-skew-y: 0;
|
|
218
|
+
--tw-scale-x: 1;
|
|
219
|
+
--tw-scale-y: 1;
|
|
220
|
+
--tw-pan-x: ;
|
|
221
|
+
--tw-pan-y: ;
|
|
222
|
+
--tw-pinch-zoom: ;
|
|
223
|
+
--tw-scroll-snap-strictness: proximity;
|
|
224
|
+
--tw-gradient-from-position: ;
|
|
225
|
+
--tw-gradient-via-position: ;
|
|
226
|
+
--tw-gradient-to-position: ;
|
|
227
|
+
--tw-ordinal: ;
|
|
228
|
+
--tw-slashed-zero: ;
|
|
229
|
+
--tw-numeric-figure: ;
|
|
230
|
+
--tw-numeric-spacing: ;
|
|
231
|
+
--tw-numeric-fraction: ;
|
|
232
|
+
--tw-ring-inset: ;
|
|
233
|
+
--tw-ring-offset-width: 0px;
|
|
234
|
+
--tw-ring-offset-color: #fff;
|
|
235
|
+
--tw-ring-color: rgb(147 197 253 / 0.5);
|
|
236
|
+
--tw-ring-offset-shadow: 0 0 #0000;
|
|
237
|
+
--tw-ring-shadow: 0 0 #0000;
|
|
238
|
+
--tw-shadow: 0 0 #0000;
|
|
239
|
+
--tw-shadow-colored: 0 0 #0000;
|
|
240
|
+
--tw-blur: ;
|
|
241
|
+
--tw-brightness: ;
|
|
242
|
+
--tw-contrast: ;
|
|
243
|
+
--tw-grayscale: ;
|
|
244
|
+
--tw-hue-rotate: ;
|
|
245
|
+
--tw-invert: ;
|
|
246
|
+
--tw-saturate: ;
|
|
247
|
+
--tw-sepia: ;
|
|
248
|
+
--tw-drop-shadow: ;
|
|
249
|
+
--tw-backdrop-blur: ;
|
|
250
|
+
--tw-backdrop-brightness: ;
|
|
251
|
+
--tw-backdrop-contrast: ;
|
|
252
|
+
--tw-backdrop-grayscale: ;
|
|
253
|
+
--tw-backdrop-hue-rotate: ;
|
|
254
|
+
--tw-backdrop-invert: ;
|
|
255
|
+
--tw-backdrop-opacity: ;
|
|
256
|
+
--tw-backdrop-saturate: ;
|
|
257
|
+
--tw-backdrop-sepia: ;
|
|
258
|
+
--tw-contain-size: ;
|
|
259
|
+
--tw-contain-layout: ;
|
|
260
|
+
--tw-contain-paint: ;
|
|
261
|
+
--tw-contain-style: ;
|
|
262
|
+
}
|
|
263
|
+
*,
|
|
264
|
+
::before,
|
|
157
265
|
::after {
|
|
158
266
|
box-sizing: border-box;
|
|
159
267
|
border-width: 0;
|
|
@@ -367,117 +475,9 @@ video {
|
|
|
367
475
|
max-width: 100%;
|
|
368
476
|
height: auto;
|
|
369
477
|
}
|
|
370
|
-
[hidden] {
|
|
478
|
+
[hidden]:where(:not([hidden=until-found])) {
|
|
371
479
|
display: none;
|
|
372
480
|
}
|
|
373
|
-
*,
|
|
374
|
-
::before,
|
|
375
|
-
::after {
|
|
376
|
-
--tw-border-spacing-x: 0;
|
|
377
|
-
--tw-border-spacing-y: 0;
|
|
378
|
-
--tw-translate-x: 0;
|
|
379
|
-
--tw-translate-y: 0;
|
|
380
|
-
--tw-rotate: 0;
|
|
381
|
-
--tw-skew-x: 0;
|
|
382
|
-
--tw-skew-y: 0;
|
|
383
|
-
--tw-scale-x: 1;
|
|
384
|
-
--tw-scale-y: 1;
|
|
385
|
-
--tw-pan-x: ;
|
|
386
|
-
--tw-pan-y: ;
|
|
387
|
-
--tw-pinch-zoom: ;
|
|
388
|
-
--tw-scroll-snap-strictness: proximity;
|
|
389
|
-
--tw-gradient-from-position: ;
|
|
390
|
-
--tw-gradient-via-position: ;
|
|
391
|
-
--tw-gradient-to-position: ;
|
|
392
|
-
--tw-ordinal: ;
|
|
393
|
-
--tw-slashed-zero: ;
|
|
394
|
-
--tw-numeric-figure: ;
|
|
395
|
-
--tw-numeric-spacing: ;
|
|
396
|
-
--tw-numeric-fraction: ;
|
|
397
|
-
--tw-ring-inset: ;
|
|
398
|
-
--tw-ring-offset-width: 0px;
|
|
399
|
-
--tw-ring-offset-color: #fff;
|
|
400
|
-
--tw-ring-color: rgb(147 197 253 / 0.5);
|
|
401
|
-
--tw-ring-offset-shadow: 0 0 #0000;
|
|
402
|
-
--tw-ring-shadow: 0 0 #0000;
|
|
403
|
-
--tw-shadow: 0 0 #0000;
|
|
404
|
-
--tw-shadow-colored: 0 0 #0000;
|
|
405
|
-
--tw-blur: ;
|
|
406
|
-
--tw-brightness: ;
|
|
407
|
-
--tw-contrast: ;
|
|
408
|
-
--tw-grayscale: ;
|
|
409
|
-
--tw-hue-rotate: ;
|
|
410
|
-
--tw-invert: ;
|
|
411
|
-
--tw-saturate: ;
|
|
412
|
-
--tw-sepia: ;
|
|
413
|
-
--tw-drop-shadow: ;
|
|
414
|
-
--tw-backdrop-blur: ;
|
|
415
|
-
--tw-backdrop-brightness: ;
|
|
416
|
-
--tw-backdrop-contrast: ;
|
|
417
|
-
--tw-backdrop-grayscale: ;
|
|
418
|
-
--tw-backdrop-hue-rotate: ;
|
|
419
|
-
--tw-backdrop-invert: ;
|
|
420
|
-
--tw-backdrop-opacity: ;
|
|
421
|
-
--tw-backdrop-saturate: ;
|
|
422
|
-
--tw-backdrop-sepia: ;
|
|
423
|
-
--tw-contain-size: ;
|
|
424
|
-
--tw-contain-layout: ;
|
|
425
|
-
--tw-contain-paint: ;
|
|
426
|
-
--tw-contain-style: ;
|
|
427
|
-
}
|
|
428
|
-
::backdrop {
|
|
429
|
-
--tw-border-spacing-x: 0;
|
|
430
|
-
--tw-border-spacing-y: 0;
|
|
431
|
-
--tw-translate-x: 0;
|
|
432
|
-
--tw-translate-y: 0;
|
|
433
|
-
--tw-rotate: 0;
|
|
434
|
-
--tw-skew-x: 0;
|
|
435
|
-
--tw-skew-y: 0;
|
|
436
|
-
--tw-scale-x: 1;
|
|
437
|
-
--tw-scale-y: 1;
|
|
438
|
-
--tw-pan-x: ;
|
|
439
|
-
--tw-pan-y: ;
|
|
440
|
-
--tw-pinch-zoom: ;
|
|
441
|
-
--tw-scroll-snap-strictness: proximity;
|
|
442
|
-
--tw-gradient-from-position: ;
|
|
443
|
-
--tw-gradient-via-position: ;
|
|
444
|
-
--tw-gradient-to-position: ;
|
|
445
|
-
--tw-ordinal: ;
|
|
446
|
-
--tw-slashed-zero: ;
|
|
447
|
-
--tw-numeric-figure: ;
|
|
448
|
-
--tw-numeric-spacing: ;
|
|
449
|
-
--tw-numeric-fraction: ;
|
|
450
|
-
--tw-ring-inset: ;
|
|
451
|
-
--tw-ring-offset-width: 0px;
|
|
452
|
-
--tw-ring-offset-color: #fff;
|
|
453
|
-
--tw-ring-color: rgb(147 197 253 / 0.5);
|
|
454
|
-
--tw-ring-offset-shadow: 0 0 #0000;
|
|
455
|
-
--tw-ring-shadow: 0 0 #0000;
|
|
456
|
-
--tw-shadow: 0 0 #0000;
|
|
457
|
-
--tw-shadow-colored: 0 0 #0000;
|
|
458
|
-
--tw-blur: ;
|
|
459
|
-
--tw-brightness: ;
|
|
460
|
-
--tw-contrast: ;
|
|
461
|
-
--tw-grayscale: ;
|
|
462
|
-
--tw-hue-rotate: ;
|
|
463
|
-
--tw-invert: ;
|
|
464
|
-
--tw-saturate: ;
|
|
465
|
-
--tw-sepia: ;
|
|
466
|
-
--tw-drop-shadow: ;
|
|
467
|
-
--tw-backdrop-blur: ;
|
|
468
|
-
--tw-backdrop-brightness: ;
|
|
469
|
-
--tw-backdrop-contrast: ;
|
|
470
|
-
--tw-backdrop-grayscale: ;
|
|
471
|
-
--tw-backdrop-hue-rotate: ;
|
|
472
|
-
--tw-backdrop-invert: ;
|
|
473
|
-
--tw-backdrop-opacity: ;
|
|
474
|
-
--tw-backdrop-saturate: ;
|
|
475
|
-
--tw-backdrop-sepia: ;
|
|
476
|
-
--tw-contain-size: ;
|
|
477
|
-
--tw-contain-layout: ;
|
|
478
|
-
--tw-contain-paint: ;
|
|
479
|
-
--tw-contain-style: ;
|
|
480
|
-
}
|
|
481
481
|
.container {
|
|
482
482
|
width: 100%;
|
|
483
483
|
}
|
|
@@ -521,9 +521,15 @@ video {
|
|
|
521
521
|
.inset-0 {
|
|
522
522
|
inset: 0px;
|
|
523
523
|
}
|
|
524
|
+
.right-0 {
|
|
525
|
+
right: 0px;
|
|
526
|
+
}
|
|
524
527
|
.z-50 {
|
|
525
528
|
z-index: 50;
|
|
526
529
|
}
|
|
530
|
+
.col-span-2 {
|
|
531
|
+
grid-column: span 2 / span 2;
|
|
532
|
+
}
|
|
527
533
|
.col-span-full {
|
|
528
534
|
grid-column: 1 / -1;
|
|
529
535
|
}
|
|
@@ -545,6 +551,9 @@ video {
|
|
|
545
551
|
.mt-16 {
|
|
546
552
|
margin-top: 4rem;
|
|
547
553
|
}
|
|
554
|
+
.block {
|
|
555
|
+
display: block;
|
|
556
|
+
}
|
|
548
557
|
.inline-block {
|
|
549
558
|
display: inline-block;
|
|
550
559
|
}
|
|
@@ -557,6 +566,9 @@ video {
|
|
|
557
566
|
.grid {
|
|
558
567
|
display: grid;
|
|
559
568
|
}
|
|
569
|
+
.list-item {
|
|
570
|
+
display: list-item;
|
|
571
|
+
}
|
|
560
572
|
.hidden {
|
|
561
573
|
display: none;
|
|
562
574
|
}
|
|
@@ -567,6 +579,10 @@ video {
|
|
|
567
579
|
width: 2.5rem;
|
|
568
580
|
height: 2.5rem;
|
|
569
581
|
}
|
|
582
|
+
.size-2 {
|
|
583
|
+
width: 0.5rem;
|
|
584
|
+
height: 0.5rem;
|
|
585
|
+
}
|
|
570
586
|
.size-4 {
|
|
571
587
|
width: 1rem;
|
|
572
588
|
height: 1rem;
|
|
@@ -595,6 +611,9 @@ video {
|
|
|
595
611
|
.h-5 {
|
|
596
612
|
height: 1.25rem;
|
|
597
613
|
}
|
|
614
|
+
.h-full {
|
|
615
|
+
height: 100%;
|
|
616
|
+
}
|
|
598
617
|
.max-h-10 {
|
|
599
618
|
max-height: 2.5rem;
|
|
600
619
|
}
|
|
@@ -607,12 +626,21 @@ video {
|
|
|
607
626
|
.min-h-screen {
|
|
608
627
|
min-height: 100vh;
|
|
609
628
|
}
|
|
629
|
+
.w-12 {
|
|
630
|
+
width: 3rem;
|
|
631
|
+
}
|
|
632
|
+
.w-7 {
|
|
633
|
+
width: 1.75rem;
|
|
634
|
+
}
|
|
610
635
|
.w-full {
|
|
611
636
|
width: 100%;
|
|
612
637
|
}
|
|
613
638
|
.w-px {
|
|
614
639
|
width: 1px;
|
|
615
640
|
}
|
|
641
|
+
.min-w-1 {
|
|
642
|
+
min-width: 0.25rem;
|
|
643
|
+
}
|
|
616
644
|
.min-w-\[19rem\] {
|
|
617
645
|
min-width: 19rem;
|
|
618
646
|
}
|
|
@@ -738,12 +766,20 @@ video {
|
|
|
738
766
|
.overflow-hidden {
|
|
739
767
|
overflow: hidden;
|
|
740
768
|
}
|
|
769
|
+
.truncate {
|
|
770
|
+
overflow: hidden;
|
|
771
|
+
text-overflow: ellipsis;
|
|
772
|
+
white-space: nowrap;
|
|
773
|
+
}
|
|
741
774
|
.text-ellipsis {
|
|
742
775
|
text-overflow: ellipsis;
|
|
743
776
|
}
|
|
744
777
|
.text-nowrap {
|
|
745
778
|
text-wrap: nowrap;
|
|
746
779
|
}
|
|
780
|
+
.break-words {
|
|
781
|
+
overflow-wrap: break-word;
|
|
782
|
+
}
|
|
747
783
|
.rounded-\[999px\] {
|
|
748
784
|
border-radius: 999px;
|
|
749
785
|
}
|
|
@@ -815,9 +851,12 @@ video {
|
|
|
815
851
|
.border-ory-border-default {
|
|
816
852
|
border-color: var(--ory-border-default);
|
|
817
853
|
}
|
|
854
|
+
.border-toggle-border-default {
|
|
855
|
+
border-color: var(--toggle-border-default);
|
|
856
|
+
}
|
|
818
857
|
.bg-\[white\] {
|
|
819
858
|
--tw-bg-opacity: 1;
|
|
820
|
-
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
|
859
|
+
background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
|
|
821
860
|
}
|
|
822
861
|
.bg-button-identifier-background-default {
|
|
823
862
|
background-color: var(--button-identifier-background-default);
|
|
@@ -852,6 +891,12 @@ video {
|
|
|
852
891
|
.bg-ory-background-default {
|
|
853
892
|
background-color: var(--ory-background-default);
|
|
854
893
|
}
|
|
894
|
+
.bg-toggle-background-default {
|
|
895
|
+
background-color: var(--toggle-background-default);
|
|
896
|
+
}
|
|
897
|
+
.bg-toggle-foreground-default {
|
|
898
|
+
background-color: var(--toggle-foreground-default);
|
|
899
|
+
}
|
|
855
900
|
.fill-checkbox-foreground-checked {
|
|
856
901
|
fill: var(--checkbox-foreground-checked);
|
|
857
902
|
}
|
|
@@ -871,6 +916,9 @@ video {
|
|
|
871
916
|
.p-8 {
|
|
872
917
|
padding: 2rem;
|
|
873
918
|
}
|
|
919
|
+
.p-\[3px\] {
|
|
920
|
+
padding: 3px;
|
|
921
|
+
}
|
|
874
922
|
.px-2 {
|
|
875
923
|
padding-left: 0.5rem;
|
|
876
924
|
padding-right: 0.5rem;
|
|
@@ -1278,9 +1326,22 @@ video {
|
|
|
1278
1326
|
.data-\[disabled\]\:pointer-events-none[data-disabled] {
|
|
1279
1327
|
pointer-events: none;
|
|
1280
1328
|
}
|
|
1329
|
+
.data-\[state\=checked\]\:translate-x-3[data-state=checked] {
|
|
1330
|
+
--tw-translate-x: 0.75rem;
|
|
1331
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
1332
|
+
}
|
|
1333
|
+
.data-\[state\=checked\]\:border-toggle-border-checked[data-state=checked] {
|
|
1334
|
+
border-color: var(--toggle-border-checked);
|
|
1335
|
+
}
|
|
1281
1336
|
.data-\[disabled\]\:bg-button-secondary-background-disabled[data-disabled] {
|
|
1282
1337
|
background-color: var(--button-secondary-background-disabled);
|
|
1283
1338
|
}
|
|
1339
|
+
.data-\[state\=checked\]\:bg-toggle-background-checked[data-state=checked] {
|
|
1340
|
+
background-color: var(--toggle-background-checked);
|
|
1341
|
+
}
|
|
1342
|
+
.data-\[state\=checked\]\:bg-toggle-foreground-checked[data-state=checked] {
|
|
1343
|
+
background-color: var(--toggle-foreground-checked);
|
|
1344
|
+
}
|
|
1284
1345
|
.data-\[disabled\]\:text-button-secondary-foreground-disabled[data-disabled] {
|
|
1285
1346
|
color: var(--button-secondary-foreground-disabled);
|
|
1286
1347
|
}
|