@atproto/oauth-client-browser-example 0.0.4 → 0.0.5
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/files.json +8 -8
- package/dist/index.html +1 -1
- package/dist/main.css +222 -52
- package/dist/main.js +1338 -1250
- package/dist/main.js.map +1 -1
- package/package.json +5 -5
package/dist/index.html
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
<title>OAuth Client Example</title>
|
|
8
8
|
<link rel="stylesheet" href="main.css">
|
|
9
9
|
</head>
|
|
10
|
-
<body class="bg-
|
|
10
|
+
<body class="bg-slate-100 dark:bg-slate-800 min-h-screen">
|
|
11
11
|
<div id="root"></div>
|
|
12
12
|
<script src="main.js"></script>
|
|
13
13
|
</body>
|
package/dist/main.css
CHANGED
|
@@ -501,18 +501,79 @@ video {
|
|
|
501
501
|
--tw-contain-paint: ;
|
|
502
502
|
--tw-contain-style: ;
|
|
503
503
|
}
|
|
504
|
+
.container {
|
|
505
|
+
width: 100%;
|
|
506
|
+
}
|
|
507
|
+
@media (min-width: 640px) {
|
|
508
|
+
|
|
509
|
+
.container {
|
|
510
|
+
max-width: 640px;
|
|
511
|
+
}
|
|
512
|
+
}
|
|
513
|
+
@media (min-width: 768px) {
|
|
514
|
+
|
|
515
|
+
.container {
|
|
516
|
+
max-width: 768px;
|
|
517
|
+
}
|
|
518
|
+
}
|
|
519
|
+
@media (min-width: 1024px) {
|
|
520
|
+
|
|
521
|
+
.container {
|
|
522
|
+
max-width: 1024px;
|
|
523
|
+
}
|
|
524
|
+
}
|
|
525
|
+
@media (min-width: 1280px) {
|
|
526
|
+
|
|
527
|
+
.container {
|
|
528
|
+
max-width: 1280px;
|
|
529
|
+
}
|
|
530
|
+
}
|
|
531
|
+
@media (min-width: 1536px) {
|
|
532
|
+
|
|
533
|
+
.container {
|
|
534
|
+
max-width: 1536px;
|
|
535
|
+
}
|
|
536
|
+
}
|
|
537
|
+
.visible {
|
|
538
|
+
visibility: visible;
|
|
539
|
+
}
|
|
540
|
+
.invisible {
|
|
541
|
+
visibility: hidden;
|
|
542
|
+
}
|
|
543
|
+
.absolute {
|
|
544
|
+
position: absolute;
|
|
545
|
+
}
|
|
504
546
|
.relative {
|
|
505
547
|
position: relative;
|
|
506
548
|
}
|
|
507
|
-
.
|
|
508
|
-
|
|
549
|
+
.inset-0 {
|
|
550
|
+
inset: 0px;
|
|
509
551
|
}
|
|
510
|
-
.
|
|
511
|
-
|
|
512
|
-
margin-bottom: 1rem;
|
|
552
|
+
.right-0 {
|
|
553
|
+
right: 0px;
|
|
513
554
|
}
|
|
514
|
-
.
|
|
515
|
-
|
|
555
|
+
.z-10 {
|
|
556
|
+
z-index: 10;
|
|
557
|
+
}
|
|
558
|
+
.z-50 {
|
|
559
|
+
z-index: 50;
|
|
560
|
+
}
|
|
561
|
+
.mx-1 {
|
|
562
|
+
margin-left: 0.25rem;
|
|
563
|
+
margin-right: 0.25rem;
|
|
564
|
+
}
|
|
565
|
+
.mx-auto {
|
|
566
|
+
margin-left: auto;
|
|
567
|
+
margin-right: auto;
|
|
568
|
+
}
|
|
569
|
+
.mb-8 {
|
|
570
|
+
margin-bottom: 2rem;
|
|
571
|
+
}
|
|
572
|
+
.ml-1 {
|
|
573
|
+
margin-left: 0.25rem;
|
|
574
|
+
}
|
|
575
|
+
.mt-1 {
|
|
576
|
+
margin-top: 0.25rem;
|
|
516
577
|
}
|
|
517
578
|
.mt-2 {
|
|
518
579
|
margin-top: 0.5rem;
|
|
@@ -526,26 +587,71 @@ video {
|
|
|
526
587
|
.flex {
|
|
527
588
|
display: flex;
|
|
528
589
|
}
|
|
529
|
-
.
|
|
530
|
-
|
|
590
|
+
.h-4 {
|
|
591
|
+
height: 1rem;
|
|
592
|
+
}
|
|
593
|
+
.h-5 {
|
|
594
|
+
height: 1.25rem;
|
|
595
|
+
}
|
|
596
|
+
.h-6 {
|
|
597
|
+
height: 1.5rem;
|
|
598
|
+
}
|
|
599
|
+
.min-h-screen {
|
|
600
|
+
min-height: 100vh;
|
|
601
|
+
}
|
|
602
|
+
.w-4 {
|
|
603
|
+
width: 1rem;
|
|
604
|
+
}
|
|
605
|
+
.w-5 {
|
|
606
|
+
width: 1.25rem;
|
|
607
|
+
}
|
|
608
|
+
.w-6 {
|
|
609
|
+
width: 1.5rem;
|
|
531
610
|
}
|
|
532
611
|
.w-\[1px\] {
|
|
533
612
|
width: 1px;
|
|
534
613
|
}
|
|
614
|
+
.w-\[450px\] {
|
|
615
|
+
width: 450px;
|
|
616
|
+
}
|
|
535
617
|
.w-full {
|
|
536
618
|
width: 100%;
|
|
537
619
|
}
|
|
538
620
|
.min-w-0 {
|
|
539
621
|
min-width: 0px;
|
|
540
622
|
}
|
|
541
|
-
.
|
|
542
|
-
|
|
623
|
+
.min-w-36 {
|
|
624
|
+
min-width: 9rem;
|
|
625
|
+
}
|
|
626
|
+
.max-w-3xl {
|
|
627
|
+
max-width: 48rem;
|
|
628
|
+
}
|
|
629
|
+
.max-w-full {
|
|
630
|
+
max-width: 100%;
|
|
631
|
+
}
|
|
632
|
+
.flex-1 {
|
|
633
|
+
flex: 1 1 0%;
|
|
543
634
|
}
|
|
544
635
|
.flex-auto {
|
|
545
636
|
flex: 1 1 auto;
|
|
546
637
|
}
|
|
547
|
-
.
|
|
548
|
-
|
|
638
|
+
.flex-grow {
|
|
639
|
+
flex-grow: 1;
|
|
640
|
+
}
|
|
641
|
+
.origin-top-right {
|
|
642
|
+
transform-origin: top right;
|
|
643
|
+
}
|
|
644
|
+
@keyframes spin {
|
|
645
|
+
|
|
646
|
+
to {
|
|
647
|
+
transform: rotate(360deg);
|
|
648
|
+
}
|
|
649
|
+
}
|
|
650
|
+
.animate-spin {
|
|
651
|
+
animation: spin 1s linear infinite;
|
|
652
|
+
}
|
|
653
|
+
.cursor-default {
|
|
654
|
+
cursor: default;
|
|
549
655
|
}
|
|
550
656
|
.flex-col {
|
|
551
657
|
flex-direction: column;
|
|
@@ -556,6 +662,12 @@ video {
|
|
|
556
662
|
.items-center {
|
|
557
663
|
align-items: center;
|
|
558
664
|
}
|
|
665
|
+
.items-stretch {
|
|
666
|
+
align-items: stretch;
|
|
667
|
+
}
|
|
668
|
+
.justify-center {
|
|
669
|
+
justify-content: center;
|
|
670
|
+
}
|
|
559
671
|
.justify-stretch {
|
|
560
672
|
justify-content: stretch;
|
|
561
673
|
}
|
|
@@ -564,8 +676,19 @@ video {
|
|
|
564
676
|
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
|
565
677
|
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
|
566
678
|
}
|
|
567
|
-
.
|
|
568
|
-
|
|
679
|
+
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
|
|
680
|
+
--tw-space-y-reverse: 0;
|
|
681
|
+
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
|
|
682
|
+
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
|
|
683
|
+
}
|
|
684
|
+
.overflow-auto {
|
|
685
|
+
overflow: auto;
|
|
686
|
+
}
|
|
687
|
+
.overflow-hidden {
|
|
688
|
+
overflow: hidden;
|
|
689
|
+
}
|
|
690
|
+
.rounded-full {
|
|
691
|
+
border-radius: 9999px;
|
|
569
692
|
}
|
|
570
693
|
.rounded-md {
|
|
571
694
|
border-radius: 0.375rem;
|
|
@@ -573,28 +696,36 @@ video {
|
|
|
573
696
|
.border {
|
|
574
697
|
border-width: 1px;
|
|
575
698
|
}
|
|
699
|
+
.border-2 {
|
|
700
|
+
border-width: 2px;
|
|
701
|
+
}
|
|
702
|
+
.border-t {
|
|
703
|
+
border-top-width: 1px;
|
|
704
|
+
}
|
|
576
705
|
.border-solid {
|
|
577
706
|
border-style: solid;
|
|
578
707
|
}
|
|
708
|
+
.border-current {
|
|
709
|
+
border-color: currentColor;
|
|
710
|
+
}
|
|
711
|
+
.border-gray-200 {
|
|
712
|
+
--tw-border-opacity: 1;
|
|
713
|
+
border-color: rgb(229 231 235 / var(--tw-border-opacity));
|
|
714
|
+
}
|
|
579
715
|
.border-slate-200 {
|
|
580
716
|
--tw-border-opacity: 1;
|
|
581
717
|
border-color: rgb(226 232 240 / var(--tw-border-opacity));
|
|
582
718
|
}
|
|
583
|
-
.
|
|
584
|
-
|
|
585
|
-
background-color: rgb(59 130 246 / var(--tw-bg-opacity));
|
|
586
|
-
}
|
|
587
|
-
.bg-blue-600 {
|
|
588
|
-
--tw-bg-opacity: 1;
|
|
589
|
-
background-color: rgb(37 99 235 / var(--tw-bg-opacity));
|
|
719
|
+
.border-t-transparent {
|
|
720
|
+
border-top-color: transparent;
|
|
590
721
|
}
|
|
591
|
-
.bg-
|
|
722
|
+
.bg-purple-600 {
|
|
592
723
|
--tw-bg-opacity: 1;
|
|
593
|
-
background-color: rgb(
|
|
724
|
+
background-color: rgb(147 51 234 / var(--tw-bg-opacity));
|
|
594
725
|
}
|
|
595
|
-
.bg-
|
|
726
|
+
.bg-slate-100 {
|
|
596
727
|
--tw-bg-opacity: 1;
|
|
597
|
-
background-color: rgb(
|
|
728
|
+
background-color: rgb(241 245 249 / var(--tw-bg-opacity));
|
|
598
729
|
}
|
|
599
730
|
.bg-transparent {
|
|
600
731
|
background-color: transparent;
|
|
@@ -612,6 +743,10 @@ video {
|
|
|
612
743
|
.p-4 {
|
|
613
744
|
padding: 1rem;
|
|
614
745
|
}
|
|
746
|
+
.px-1 {
|
|
747
|
+
padding-left: 0.25rem;
|
|
748
|
+
padding-right: 0.25rem;
|
|
749
|
+
}
|
|
615
750
|
.px-2 {
|
|
616
751
|
padding-left: 0.5rem;
|
|
617
752
|
padding-right: 0.5rem;
|
|
@@ -624,31 +759,45 @@ video {
|
|
|
624
759
|
padding-left: 1rem;
|
|
625
760
|
padding-right: 1rem;
|
|
626
761
|
}
|
|
762
|
+
.py-0 {
|
|
763
|
+
padding-top: 0px;
|
|
764
|
+
padding-bottom: 0px;
|
|
765
|
+
}
|
|
627
766
|
.py-1 {
|
|
628
767
|
padding-top: 0.25rem;
|
|
629
768
|
padding-bottom: 0.25rem;
|
|
630
769
|
}
|
|
631
|
-
.py
|
|
770
|
+
.py-2 {
|
|
771
|
+
padding-top: 0.5rem;
|
|
772
|
+
padding-bottom: 0.5rem;
|
|
773
|
+
}
|
|
774
|
+
.pt-1 {
|
|
632
775
|
padding-top: 0.25rem;
|
|
633
|
-
|
|
776
|
+
}
|
|
777
|
+
.text-left {
|
|
778
|
+
text-align: left;
|
|
779
|
+
}
|
|
780
|
+
.text-center {
|
|
781
|
+
text-align: center;
|
|
782
|
+
}
|
|
783
|
+
.text-2xl {
|
|
784
|
+
font-size: 1.5rem;
|
|
785
|
+
line-height: 2rem;
|
|
634
786
|
}
|
|
635
787
|
.text-base {
|
|
636
788
|
font-size: 1rem;
|
|
637
789
|
line-height: 1.5rem;
|
|
638
790
|
}
|
|
639
|
-
.
|
|
640
|
-
font-
|
|
791
|
+
.text-sm {
|
|
792
|
+
font-size: 0.875rem;
|
|
793
|
+
line-height: 1.25rem;
|
|
641
794
|
}
|
|
642
|
-
.
|
|
643
|
-
|
|
795
|
+
.font-medium {
|
|
796
|
+
font-weight: 500;
|
|
644
797
|
}
|
|
645
|
-
.text-
|
|
798
|
+
.text-gray-700 {
|
|
646
799
|
--tw-text-opacity: 1;
|
|
647
|
-
color: rgb(
|
|
648
|
-
}
|
|
649
|
-
.text-blue-600 {
|
|
650
|
-
--tw-text-opacity: 1;
|
|
651
|
-
color: rgb(37 99 235 / var(--tw-text-opacity));
|
|
800
|
+
color: rgb(55 65 81 / var(--tw-text-opacity));
|
|
652
801
|
}
|
|
653
802
|
.text-inherit {
|
|
654
803
|
color: inherit;
|
|
@@ -657,6 +806,10 @@ video {
|
|
|
657
806
|
--tw-text-opacity: 1;
|
|
658
807
|
color: rgb(64 64 64 / var(--tw-text-opacity));
|
|
659
808
|
}
|
|
809
|
+
.text-purple-600 {
|
|
810
|
+
--tw-text-opacity: 1;
|
|
811
|
+
color: rgb(147 51 234 / var(--tw-text-opacity));
|
|
812
|
+
}
|
|
660
813
|
.text-white {
|
|
661
814
|
--tw-text-opacity: 1;
|
|
662
815
|
color: rgb(255 255 255 / var(--tw-text-opacity));
|
|
@@ -666,10 +819,27 @@ video {
|
|
|
666
819
|
--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
|
|
667
820
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
668
821
|
}
|
|
822
|
+
.shadow-md {
|
|
823
|
+
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
|
|
824
|
+
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
|
|
825
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
826
|
+
}
|
|
669
827
|
.outline-none {
|
|
670
828
|
outline: 2px solid transparent;
|
|
671
829
|
outline-offset: 2px;
|
|
672
830
|
}
|
|
831
|
+
.ring-1 {
|
|
832
|
+
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
833
|
+
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
834
|
+
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
835
|
+
}
|
|
836
|
+
.ring-black {
|
|
837
|
+
--tw-ring-opacity: 1;
|
|
838
|
+
--tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity));
|
|
839
|
+
}
|
|
840
|
+
.ring-opacity-5 {
|
|
841
|
+
--tw-ring-opacity: 0.05;
|
|
842
|
+
}
|
|
673
843
|
.transition {
|
|
674
844
|
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
|
|
675
845
|
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
|
|
@@ -683,22 +853,21 @@ video {
|
|
|
683
853
|
.ease-in-out {
|
|
684
854
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
685
855
|
}
|
|
686
|
-
.hover\:
|
|
687
|
-
--tw-
|
|
688
|
-
--tw-
|
|
689
|
-
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));
|
|
856
|
+
.hover\:bg-gray-100:hover {
|
|
857
|
+
--tw-bg-opacity: 1;
|
|
858
|
+
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
|
690
859
|
}
|
|
691
|
-
.hover\:bg-
|
|
860
|
+
.hover\:bg-purple-100:hover {
|
|
692
861
|
--tw-bg-opacity: 1;
|
|
693
|
-
background-color: rgb(
|
|
862
|
+
background-color: rgb(243 232 255 / var(--tw-bg-opacity));
|
|
694
863
|
}
|
|
695
|
-
.hover\:bg-
|
|
864
|
+
.hover\:bg-purple-700:hover {
|
|
696
865
|
--tw-bg-opacity: 1;
|
|
697
|
-
background-color: rgb(
|
|
866
|
+
background-color: rgb(126 34 206 / var(--tw-bg-opacity));
|
|
698
867
|
}
|
|
699
|
-
.
|
|
868
|
+
.focus\:bg-gray-100:focus {
|
|
700
869
|
--tw-bg-opacity: 1;
|
|
701
|
-
background-color: rgb(
|
|
870
|
+
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
|
702
871
|
}
|
|
703
872
|
.focus\:outline-none:focus {
|
|
704
873
|
outline: 2px solid transparent;
|
|
@@ -709,12 +878,13 @@ video {
|
|
|
709
878
|
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
710
879
|
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
711
880
|
}
|
|
712
|
-
.focus\:ring-
|
|
713
|
-
--tw-ring-
|
|
881
|
+
.focus\:ring-purple-500:focus {
|
|
882
|
+
--tw-ring-opacity: 1;
|
|
883
|
+
--tw-ring-color: rgb(168 85 247 / var(--tw-ring-opacity));
|
|
714
884
|
}
|
|
715
|
-
.focus\:ring-
|
|
885
|
+
.focus\:ring-purple-800:focus {
|
|
716
886
|
--tw-ring-opacity: 1;
|
|
717
|
-
--tw-ring-color: rgb(
|
|
887
|
+
--tw-ring-color: rgb(107 33 168 / var(--tw-ring-opacity));
|
|
718
888
|
}
|
|
719
889
|
.focus\:ring-offset-2:focus {
|
|
720
890
|
--tw-ring-offset-width: 2px;
|