@atproto/oauth-client-browser-example 0.0.3 → 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/LICENSE.txt +1 -1
- package/dist/files.json +8 -8
- package/dist/index.html +1 -1
- package/dist/main.css +258 -32
- package/dist/main.js +1365 -1227
- package/dist/main.js.map +1 -1
- package/package.json +8 -7
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,15 +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;
|
|
551
|
+
}
|
|
552
|
+
.right-0 {
|
|
553
|
+
right: 0px;
|
|
554
|
+
}
|
|
555
|
+
.z-10 {
|
|
556
|
+
z-index: 10;
|
|
509
557
|
}
|
|
510
|
-
.
|
|
511
|
-
|
|
512
|
-
|
|
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;
|
|
513
577
|
}
|
|
514
578
|
.mt-2 {
|
|
515
579
|
margin-top: 0.5rem;
|
|
@@ -517,24 +581,78 @@ video {
|
|
|
517
581
|
.block {
|
|
518
582
|
display: block;
|
|
519
583
|
}
|
|
584
|
+
.inline-block {
|
|
585
|
+
display: inline-block;
|
|
586
|
+
}
|
|
520
587
|
.flex {
|
|
521
588
|
display: flex;
|
|
522
589
|
}
|
|
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;
|
|
610
|
+
}
|
|
523
611
|
.w-\[1px\] {
|
|
524
612
|
width: 1px;
|
|
525
613
|
}
|
|
614
|
+
.w-\[450px\] {
|
|
615
|
+
width: 450px;
|
|
616
|
+
}
|
|
526
617
|
.w-full {
|
|
527
618
|
width: 100%;
|
|
528
619
|
}
|
|
529
620
|
.min-w-0 {
|
|
530
621
|
min-width: 0px;
|
|
531
622
|
}
|
|
532
|
-
.
|
|
533
|
-
|
|
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%;
|
|
534
634
|
}
|
|
535
635
|
.flex-auto {
|
|
536
636
|
flex: 1 1 auto;
|
|
537
637
|
}
|
|
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;
|
|
655
|
+
}
|
|
538
656
|
.flex-col {
|
|
539
657
|
flex-direction: column;
|
|
540
658
|
}
|
|
@@ -544,11 +662,33 @@ video {
|
|
|
544
662
|
.items-center {
|
|
545
663
|
align-items: center;
|
|
546
664
|
}
|
|
665
|
+
.items-stretch {
|
|
666
|
+
align-items: stretch;
|
|
667
|
+
}
|
|
668
|
+
.justify-center {
|
|
669
|
+
justify-content: center;
|
|
670
|
+
}
|
|
547
671
|
.justify-stretch {
|
|
548
672
|
justify-content: stretch;
|
|
549
673
|
}
|
|
550
|
-
.
|
|
551
|
-
|
|
674
|
+
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
|
|
675
|
+
--tw-space-x-reverse: 0;
|
|
676
|
+
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
|
677
|
+
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
|
678
|
+
}
|
|
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;
|
|
552
692
|
}
|
|
553
693
|
.rounded-md {
|
|
554
694
|
border-radius: 0.375rem;
|
|
@@ -556,24 +696,36 @@ video {
|
|
|
556
696
|
.border {
|
|
557
697
|
border-width: 1px;
|
|
558
698
|
}
|
|
699
|
+
.border-2 {
|
|
700
|
+
border-width: 2px;
|
|
701
|
+
}
|
|
702
|
+
.border-t {
|
|
703
|
+
border-top-width: 1px;
|
|
704
|
+
}
|
|
559
705
|
.border-solid {
|
|
560
706
|
border-style: solid;
|
|
561
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
|
+
}
|
|
562
715
|
.border-slate-200 {
|
|
563
716
|
--tw-border-opacity: 1;
|
|
564
717
|
border-color: rgb(226 232 240 / var(--tw-border-opacity));
|
|
565
718
|
}
|
|
566
|
-
.
|
|
567
|
-
|
|
568
|
-
background-color: rgb(59 130 246 / var(--tw-bg-opacity));
|
|
719
|
+
.border-t-transparent {
|
|
720
|
+
border-top-color: transparent;
|
|
569
721
|
}
|
|
570
|
-
.bg-
|
|
722
|
+
.bg-purple-600 {
|
|
571
723
|
--tw-bg-opacity: 1;
|
|
572
|
-
background-color: rgb(
|
|
724
|
+
background-color: rgb(147 51 234 / var(--tw-bg-opacity));
|
|
573
725
|
}
|
|
574
|
-
.bg-
|
|
726
|
+
.bg-slate-100 {
|
|
575
727
|
--tw-bg-opacity: 1;
|
|
576
|
-
background-color: rgb(
|
|
728
|
+
background-color: rgb(241 245 249 / var(--tw-bg-opacity));
|
|
577
729
|
}
|
|
578
730
|
.bg-transparent {
|
|
579
731
|
background-color: transparent;
|
|
@@ -591,6 +743,14 @@ video {
|
|
|
591
743
|
.p-4 {
|
|
592
744
|
padding: 1rem;
|
|
593
745
|
}
|
|
746
|
+
.px-1 {
|
|
747
|
+
padding-left: 0.25rem;
|
|
748
|
+
padding-right: 0.25rem;
|
|
749
|
+
}
|
|
750
|
+
.px-2 {
|
|
751
|
+
padding-left: 0.5rem;
|
|
752
|
+
padding-right: 0.5rem;
|
|
753
|
+
}
|
|
594
754
|
.px-3 {
|
|
595
755
|
padding-left: 0.75rem;
|
|
596
756
|
padding-right: 0.75rem;
|
|
@@ -599,27 +759,45 @@ video {
|
|
|
599
759
|
padding-left: 1rem;
|
|
600
760
|
padding-right: 1rem;
|
|
601
761
|
}
|
|
762
|
+
.py-0 {
|
|
763
|
+
padding-top: 0px;
|
|
764
|
+
padding-bottom: 0px;
|
|
765
|
+
}
|
|
602
766
|
.py-1 {
|
|
603
767
|
padding-top: 0.25rem;
|
|
604
768
|
padding-bottom: 0.25rem;
|
|
605
769
|
}
|
|
606
|
-
.py
|
|
770
|
+
.py-2 {
|
|
771
|
+
padding-top: 0.5rem;
|
|
772
|
+
padding-bottom: 0.5rem;
|
|
773
|
+
}
|
|
774
|
+
.pt-1 {
|
|
607
775
|
padding-top: 0.25rem;
|
|
608
|
-
|
|
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;
|
|
609
786
|
}
|
|
610
787
|
.text-base {
|
|
611
788
|
font-size: 1rem;
|
|
612
789
|
line-height: 1.5rem;
|
|
613
790
|
}
|
|
614
|
-
.
|
|
615
|
-
font-
|
|
791
|
+
.text-sm {
|
|
792
|
+
font-size: 0.875rem;
|
|
793
|
+
line-height: 1.25rem;
|
|
616
794
|
}
|
|
617
|
-
.
|
|
618
|
-
|
|
795
|
+
.font-medium {
|
|
796
|
+
font-weight: 500;
|
|
619
797
|
}
|
|
620
|
-
.text-
|
|
798
|
+
.text-gray-700 {
|
|
621
799
|
--tw-text-opacity: 1;
|
|
622
|
-
color: rgb(
|
|
800
|
+
color: rgb(55 65 81 / var(--tw-text-opacity));
|
|
623
801
|
}
|
|
624
802
|
.text-inherit {
|
|
625
803
|
color: inherit;
|
|
@@ -628,21 +806,68 @@ video {
|
|
|
628
806
|
--tw-text-opacity: 1;
|
|
629
807
|
color: rgb(64 64 64 / var(--tw-text-opacity));
|
|
630
808
|
}
|
|
809
|
+
.text-purple-600 {
|
|
810
|
+
--tw-text-opacity: 1;
|
|
811
|
+
color: rgb(147 51 234 / var(--tw-text-opacity));
|
|
812
|
+
}
|
|
631
813
|
.text-white {
|
|
632
814
|
--tw-text-opacity: 1;
|
|
633
815
|
color: rgb(255 255 255 / var(--tw-text-opacity));
|
|
634
816
|
}
|
|
817
|
+
.shadow-lg {
|
|
818
|
+
--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
|
|
819
|
+
--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
|
|
820
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
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
|
+
}
|
|
635
827
|
.outline-none {
|
|
636
828
|
outline: 2px solid transparent;
|
|
637
829
|
outline-offset: 2px;
|
|
638
830
|
}
|
|
639
|
-
.
|
|
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
|
+
}
|
|
843
|
+
.transition {
|
|
844
|
+
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
|
|
845
|
+
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
|
|
846
|
+
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
|
|
847
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
848
|
+
transition-duration: 150ms;
|
|
849
|
+
}
|
|
850
|
+
.duration-300 {
|
|
851
|
+
transition-duration: 300ms;
|
|
852
|
+
}
|
|
853
|
+
.ease-in-out {
|
|
854
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
855
|
+
}
|
|
856
|
+
.hover\:bg-gray-100:hover {
|
|
640
857
|
--tw-bg-opacity: 1;
|
|
641
|
-
background-color: rgb(
|
|
858
|
+
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
|
642
859
|
}
|
|
643
|
-
.hover\:bg-
|
|
860
|
+
.hover\:bg-purple-100:hover {
|
|
644
861
|
--tw-bg-opacity: 1;
|
|
645
|
-
background-color: rgb(
|
|
862
|
+
background-color: rgb(243 232 255 / var(--tw-bg-opacity));
|
|
863
|
+
}
|
|
864
|
+
.hover\:bg-purple-700:hover {
|
|
865
|
+
--tw-bg-opacity: 1;
|
|
866
|
+
background-color: rgb(126 34 206 / var(--tw-bg-opacity));
|
|
867
|
+
}
|
|
868
|
+
.focus\:bg-gray-100:focus {
|
|
869
|
+
--tw-bg-opacity: 1;
|
|
870
|
+
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
|
646
871
|
}
|
|
647
872
|
.focus\:outline-none:focus {
|
|
648
873
|
outline: 2px solid transparent;
|
|
@@ -653,12 +878,13 @@ video {
|
|
|
653
878
|
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
654
879
|
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
655
880
|
}
|
|
656
|
-
.focus\:ring-
|
|
657
|
-
--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));
|
|
658
884
|
}
|
|
659
|
-
.focus\:ring-
|
|
885
|
+
.focus\:ring-purple-800:focus {
|
|
660
886
|
--tw-ring-opacity: 1;
|
|
661
|
-
--tw-ring-color: rgb(
|
|
887
|
+
--tw-ring-color: rgb(107 33 168 / var(--tw-ring-opacity));
|
|
662
888
|
}
|
|
663
889
|
.focus\:ring-offset-2:focus {
|
|
664
890
|
--tw-ring-offset-width: 2px;
|