@ohhwells/bridge 0.1.49 → 0.1.51-next.118

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/styles.css CHANGED
@@ -22,10 +22,6 @@
22
22
  --text-lg--line-height: 28px;
23
23
  --text-xl: 20px;
24
24
  --text-xl--line-height: 28px;
25
- --text-4xl: 36px;
26
- --text-4xl--line-height: 40px;
27
- --text-5xl: 48px;
28
- --text-5xl--line-height: 1;
29
25
  --font-weight-normal: 400;
30
26
  --font-weight-medium: 500;
31
27
  --font-weight-semibold: 600;
@@ -50,6 +46,7 @@
50
46
  --color-foreground: var(--ohw-foreground, #0c0a09);
51
47
  --color-card-foreground: var(--ohw-card-foreground, #0c0a09);
52
48
  --color-popover: var(--ohw-popover, #ffffff);
49
+ --color-popover-foreground: var(--ohw-popover-foreground, #0c0a09);
53
50
  --color-secondary: var(--ohw-secondary, #f5f5f4);
54
51
  --color-secondary-foreground: var(--ohw-secondary-foreground, #0c0a09);
55
52
  --color-muted: var(--ohw-muted, #f5f5f4);
@@ -58,11 +55,10 @@
58
55
  --color-accent-foreground: var(--ohw-accent-foreground, #0c0a09);
59
56
  --color-destructive: var(--ohw-destructive, #c10007);
60
57
  --color-destructive-foreground: var(--ohw-destructive-foreground, #fafaf9);
58
+ --color-bg-destructive-10: var(--ohw-bg-destructive-10, #c100071a);
61
59
  --color-border: var(--ohw-border, #e7e5e4);
62
60
  --color-input: var(--ohw-input, #e7e5e4);
63
61
  --color-ring: var(--ohw-ring, #0885FE);
64
- --text-5xl--letter-spacing: -0.025em;
65
- --text-4xl--letter-spacing: -0.025em;
66
62
  --text-xl--letter-spacing: -0.025em;
67
63
  --text-lg--letter-spacing: 0em;
68
64
  --text-base--letter-spacing: 0em;
@@ -152,6 +148,9 @@
152
148
  .left-1\/2 {
153
149
  left: calc(1 / 2 * 100%);
154
150
  }
151
+ .left-2 {
152
+ left: calc(var(--spacing) * 2);
153
+ }
155
154
  .left-5 {
156
155
  left: calc(var(--spacing) * 5);
157
156
  }
@@ -181,19 +180,29 @@
181
180
  }
182
181
  .container {
183
182
  width: 100%;
184
- @media (width >= 40rem) {
183
+ }
184
+ @media (width >= 40rem) {
185
+ .container {
185
186
  max-width: 40rem;
186
187
  }
187
- @media (width >= 48rem) {
188
+ }
189
+ @media (width >= 48rem) {
190
+ .container {
188
191
  max-width: 48rem;
189
192
  }
190
- @media (width >= 64rem) {
193
+ }
194
+ @media (width >= 64rem) {
195
+ .container {
191
196
  max-width: 64rem;
192
197
  }
193
- @media (width >= 80rem) {
198
+ }
199
+ @media (width >= 80rem) {
200
+ .container {
194
201
  max-width: 80rem;
195
202
  }
196
- @media (width >= 96rem) {
203
+ }
204
+ @media (width >= 96rem) {
205
+ .container {
197
206
  max-width: 96rem;
198
207
  }
199
208
  }
@@ -339,6 +348,9 @@
339
348
  .w-14 {
340
349
  width: calc(var(--spacing) * 14);
341
350
  }
351
+ .w-56 {
352
+ width: calc(var(--spacing) * 56);
353
+ }
342
354
  .w-\[3px\] {
343
355
  width: 3px;
344
356
  }
@@ -376,6 +388,9 @@
376
388
  .min-w-10 {
377
389
  min-width: calc(var(--spacing) * 10);
378
390
  }
391
+ .min-w-32 {
392
+ min-width: calc(var(--spacing) * 32);
393
+ }
379
394
  .min-w-\[64px\] {
380
395
  min-width: 64px;
381
396
  }
@@ -391,6 +406,9 @@
391
406
  .grow {
392
407
  flex-grow: 1;
393
408
  }
409
+ .origin-\[var\(--radix-dropdown-menu-content-transform-origin\)\] {
410
+ transform-origin: var(--radix-dropdown-menu-content-transform-origin);
411
+ }
394
412
  .origin-\[var\(--radix-tooltip-content-transform-origin\)\] {
395
413
  transform-origin: var(--radix-tooltip-content-transform-origin);
396
414
  }
@@ -406,6 +424,10 @@
406
424
  --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
407
425
  translate: var(--tw-translate-x) var(--tw-translate-y);
408
426
  }
427
+ .-translate-y-full {
428
+ --tw-translate-y: -100%;
429
+ translate: var(--tw-translate-x) var(--tw-translate-y);
430
+ }
409
431
  .translate-y-1\/2 {
410
432
  --tw-translate-y: calc(1 / 2 * 100%);
411
433
  translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -505,12 +527,18 @@
505
527
  .overflow-x-auto {
506
528
  overflow-x: auto;
507
529
  }
530
+ .rounded-\[6px\] {
531
+ border-radius: 6px;
532
+ }
508
533
  .rounded-\[10px\] {
509
534
  border-radius: 10px;
510
535
  }
511
536
  .rounded-\[calc\(var\(--radius\,0\.5rem\)-2px\)\] {
512
537
  border-radius: calc(var(--radius,0.5rem) - 2px);
513
538
  }
539
+ .rounded-\[calc\(var\(--radius\,0\.5rem\)-4px\)\] {
540
+ border-radius: calc(var(--radius,0.5rem) - 4px);
541
+ }
514
542
  .rounded-\[var\(--radius\,0\.5rem\)\] {
515
543
  border-radius: var(--radius,0.5rem);
516
544
  }
@@ -547,6 +575,10 @@
547
575
  border-style: var(--tw-border-style);
548
576
  border-width: 2px;
549
577
  }
578
+ .border-t {
579
+ border-top-style: var(--tw-border-style);
580
+ border-top-width: 1px;
581
+ }
550
582
  .border-b {
551
583
  border-bottom-style: var(--tw-border-style);
552
584
  border-bottom-width: 1px;
@@ -595,13 +627,17 @@
595
627
  }
596
628
  .bg-black\/20 {
597
629
  background-color: color-mix(in srgb, #000 20%, transparent);
598
- @supports (color: color-mix(in lab, red, red)) {
630
+ }
631
+ @supports (color: color-mix(in lab, red, red)) {
632
+ .bg-black\/20 {
599
633
  background-color: color-mix(in oklab, var(--color-black) 20%, transparent);
600
634
  }
601
635
  }
602
636
  .bg-black\/50 {
603
637
  background-color: color-mix(in srgb, #000 50%, transparent);
604
- @supports (color: color-mix(in lab, red, red)) {
638
+ }
639
+ @supports (color: color-mix(in lab, red, red)) {
640
+ .bg-black\/50 {
605
641
  background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
606
642
  }
607
643
  }
@@ -622,7 +658,9 @@
622
658
  }
623
659
  .bg-muted\/40 {
624
660
  background-color: var(--color-muted);
625
- @supports (color: color-mix(in lab, red, red)) {
661
+ }
662
+ @supports (color: color-mix(in lab, red, red)) {
663
+ .bg-muted\/40 {
626
664
  background-color: color-mix(in oklab, var(--color-muted) 40%, transparent);
627
665
  }
628
666
  }
@@ -753,6 +791,9 @@
753
791
  .pl-4 {
754
792
  padding-left: calc(var(--spacing) * 4);
755
793
  }
794
+ .pl-8 {
795
+ padding-left: calc(var(--spacing) * 8);
796
+ }
756
797
  .text-center {
757
798
  text-align: center;
758
799
  }
@@ -768,11 +809,6 @@
768
809
  .font-sans {
769
810
  font-family: var(--font-sans);
770
811
  }
771
- .text-4xl {
772
- font-size: var(--text-4xl);
773
- line-height: var(--tw-leading, var(--text-4xl--line-height));
774
- letter-spacing: var(--tw-tracking, var(--text-4xl--letter-spacing));
775
- }
776
812
  .text-base {
777
813
  font-size: var(--text-base);
778
814
  line-height: var(--tw-leading, var(--text-base--line-height));
@@ -890,6 +926,9 @@
890
926
  .text-muted-foreground {
891
927
  color: var(--color-muted-foreground);
892
928
  }
929
+ .text-popover-foreground {
930
+ color: var(--color-popover-foreground);
931
+ }
893
932
  .text-primary-foreground {
894
933
  color: var(--color-primary-foreground);
895
934
  }
@@ -940,6 +979,10 @@
940
979
  --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--ohw-primary));
941
980
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
942
981
  }
982
+ .shadow-\[0px_4px_6px_0px_rgba\(0\,0\,0\,0\.1\)\,0px_2px_4px_0px_rgba\(0\,0\,0\,0\.1\)\] {
983
+ --tw-shadow: 0px 4px 6px 0px var(--tw-shadow-color, rgba(0,0,0,0.1)), 0px 2px 4px 0px var(--tw-shadow-color, rgba(0,0,0,0.1));
984
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
985
+ }
943
986
  .shadow-lg {
944
987
  --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
945
988
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -1029,502 +1072,414 @@
1029
1072
  --tw-outline-style: none;
1030
1073
  outline-style: none;
1031
1074
  }
1032
- .placeholder\:text-muted-foreground {
1033
- &::-moz-placeholder {
1034
- color: var(--color-muted-foreground);
1035
- }
1036
- &::placeholder {
1037
- color: var(--color-muted-foreground);
1038
- }
1075
+ .select-none {
1076
+ -webkit-user-select: none;
1077
+ -moz-user-select: none;
1078
+ user-select: none;
1039
1079
  }
1040
- .before\:pointer-events-none {
1041
- &::before {
1042
- content: var(--tw-content);
1043
- pointer-events: none;
1044
- }
1080
+ .placeholder\:text-muted-foreground::-moz-placeholder {
1081
+ color: var(--color-muted-foreground);
1045
1082
  }
1046
- .before\:absolute {
1047
- &::before {
1048
- content: var(--tw-content);
1049
- position: absolute;
1050
- }
1083
+ .placeholder\:text-muted-foreground::placeholder {
1084
+ color: var(--color-muted-foreground);
1051
1085
  }
1052
- .before\:top-0 {
1053
- &::before {
1054
- content: var(--tw-content);
1055
- top: calc(var(--spacing) * 0);
1056
- }
1086
+ .before\:pointer-events-none::before {
1087
+ content: var(--tw-content);
1088
+ pointer-events: none;
1057
1089
  }
1058
- .before\:top-1\/2 {
1059
- &::before {
1060
- content: var(--tw-content);
1061
- top: calc(1 / 2 * 100%);
1062
- }
1090
+ .before\:absolute::before {
1091
+ content: var(--tw-content);
1092
+ position: absolute;
1063
1093
  }
1064
- .before\:right-0 {
1065
- &::before {
1066
- content: var(--tw-content);
1067
- right: calc(var(--spacing) * 0);
1068
- }
1094
+ .before\:top-0::before {
1095
+ content: var(--tw-content);
1096
+ top: calc(var(--spacing) * 0);
1069
1097
  }
1070
- .before\:bottom-0 {
1071
- &::before {
1072
- content: var(--tw-content);
1073
- bottom: calc(var(--spacing) * 0);
1074
- }
1098
+ .before\:top-1\/2::before {
1099
+ content: var(--tw-content);
1100
+ top: calc(1 / 2 * 100%);
1075
1101
  }
1076
- .before\:left-0 {
1077
- &::before {
1078
- content: var(--tw-content);
1079
- left: calc(var(--spacing) * 0);
1080
- }
1102
+ .before\:right-0::before {
1103
+ content: var(--tw-content);
1104
+ right: calc(var(--spacing) * 0);
1081
1105
  }
1082
- .before\:left-1\/2 {
1083
- &::before {
1084
- content: var(--tw-content);
1085
- left: calc(1 / 2 * 100%);
1086
- }
1106
+ .before\:bottom-0::before {
1107
+ content: var(--tw-content);
1108
+ bottom: calc(var(--spacing) * 0);
1087
1109
  }
1088
- .before\:size-2 {
1089
- &::before {
1090
- content: var(--tw-content);
1091
- width: calc(var(--spacing) * 2);
1092
- height: calc(var(--spacing) * 2);
1093
- }
1110
+ .before\:left-0::before {
1111
+ content: var(--tw-content);
1112
+ left: calc(var(--spacing) * 0);
1094
1113
  }
1095
- .before\:-translate-x-1\/2 {
1096
- &::before {
1097
- content: var(--tw-content);
1098
- --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
1099
- translate: var(--tw-translate-x) var(--tw-translate-y);
1100
- }
1114
+ .before\:left-1\/2::before {
1115
+ content: var(--tw-content);
1116
+ left: calc(1 / 2 * 100%);
1101
1117
  }
1102
- .before\:translate-x-1\/2 {
1103
- &::before {
1104
- content: var(--tw-content);
1105
- --tw-translate-x: calc(1 / 2 * 100%);
1106
- translate: var(--tw-translate-x) var(--tw-translate-y);
1107
- }
1118
+ .before\:size-2::before {
1119
+ content: var(--tw-content);
1120
+ width: calc(var(--spacing) * 2);
1121
+ height: calc(var(--spacing) * 2);
1108
1122
  }
1109
- .before\:-translate-y-1\/2 {
1110
- &::before {
1111
- content: var(--tw-content);
1112
- --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
1113
- translate: var(--tw-translate-x) var(--tw-translate-y);
1114
- }
1123
+ .before\:-translate-x-1\/2::before {
1124
+ content: var(--tw-content);
1125
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
1126
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1115
1127
  }
1116
- .before\:translate-y-1\/2 {
1117
- &::before {
1118
- content: var(--tw-content);
1119
- --tw-translate-y: calc(1 / 2 * 100%);
1120
- translate: var(--tw-translate-x) var(--tw-translate-y);
1121
- }
1128
+ .before\:translate-x-1\/2::before {
1129
+ content: var(--tw-content);
1130
+ --tw-translate-x: calc(1 / 2 * 100%);
1131
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1122
1132
  }
1123
- .before\:rotate-45 {
1124
- &::before {
1125
- content: var(--tw-content);
1126
- rotate: 45deg;
1127
- }
1133
+ .before\:-translate-y-1\/2::before {
1134
+ content: var(--tw-content);
1135
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
1136
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1128
1137
  }
1129
- .before\:bg-foreground {
1130
- &::before {
1131
- content: var(--tw-content);
1132
- background-color: var(--color-foreground);
1133
- }
1138
+ .before\:translate-y-1\/2::before {
1139
+ content: var(--tw-content);
1140
+ --tw-translate-y: calc(1 / 2 * 100%);
1141
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1134
1142
  }
1135
- .before\:content-\[\"\"\] {
1136
- &::before {
1137
- --tw-content: "";
1138
- content: var(--tw-content);
1139
- }
1143
+ .before\:rotate-45::before {
1144
+ content: var(--tw-content);
1145
+ rotate: 45deg;
1140
1146
  }
1141
- .hover\:bg-accent {
1142
- &:hover {
1143
- @media (hover: hover) {
1144
- background-color: var(--color-accent);
1145
- }
1146
- }
1147
+ .before\:bg-foreground::before {
1148
+ content: var(--tw-content);
1149
+ background-color: var(--color-foreground);
1147
1150
  }
1148
- .hover\:bg-background {
1149
- &:hover {
1150
- @media (hover: hover) {
1151
- background-color: var(--color-background);
1152
- }
1153
- }
1151
+ .before\:content-\[\"\"\]::before {
1152
+ --tw-content: "";
1153
+ content: var(--tw-content);
1154
1154
  }
1155
- .hover\:bg-destructive\/80 {
1156
- &:hover {
1157
- @media (hover: hover) {
1158
- background-color: var(--color-destructive);
1159
- @supports (color: color-mix(in lab, red, red)) {
1160
- background-color: color-mix(in oklab, var(--color-destructive) 80%, transparent);
1161
- }
1162
- }
1155
+ @media (hover: hover) {
1156
+ .hover\:bg-accent:hover {
1157
+ background-color: var(--color-accent);
1163
1158
  }
1164
1159
  }
1165
- .hover\:bg-muted {
1166
- &:hover {
1167
- @media (hover: hover) {
1168
- background-color: var(--color-muted);
1169
- }
1160
+ @media (hover: hover) {
1161
+ .hover\:bg-background:hover {
1162
+ background-color: var(--color-background);
1170
1163
  }
1171
1164
  }
1172
- .hover\:bg-muted\/30 {
1173
- &:hover {
1174
- @media (hover: hover) {
1175
- background-color: var(--color-muted);
1176
- @supports (color: color-mix(in lab, red, red)) {
1177
- background-color: color-mix(in oklab, var(--color-muted) 30%, transparent);
1178
- }
1179
- }
1165
+ @media (hover: hover) {
1166
+ .hover\:bg-destructive\/80:hover {
1167
+ background-color: var(--color-destructive);
1180
1168
  }
1181
- }
1182
- .hover\:bg-muted\/50 {
1183
- &:hover {
1184
- @media (hover: hover) {
1185
- background-color: var(--color-muted);
1186
- @supports (color: color-mix(in lab, red, red)) {
1187
- background-color: color-mix(in oklab, var(--color-muted) 50%, transparent);
1188
- }
1169
+ @supports (color: color-mix(in lab, red, red)) {
1170
+ .hover\:bg-destructive\/80:hover {
1171
+ background-color: color-mix(in oklab, var(--color-destructive) 80%, transparent);
1189
1172
  }
1190
1173
  }
1191
1174
  }
1192
- .hover\:bg-muted\/80 {
1193
- &:hover {
1194
- @media (hover: hover) {
1195
- background-color: var(--color-muted);
1196
- @supports (color: color-mix(in lab, red, red)) {
1197
- background-color: color-mix(in oklab, var(--color-muted) 80%, transparent);
1198
- }
1199
- }
1175
+ @media (hover: hover) {
1176
+ .hover\:bg-muted:hover {
1177
+ background-color: var(--color-muted);
1200
1178
  }
1201
1179
  }
1202
- .hover\:bg-primary {
1203
- &:hover {
1204
- @media (hover: hover) {
1205
- background-color: var(--color-primary);
1206
- }
1180
+ @media (hover: hover) {
1181
+ .hover\:bg-muted\/30:hover {
1182
+ background-color: var(--color-muted);
1207
1183
  }
1208
- }
1209
- .hover\:bg-secondary\/80 {
1210
- &:hover {
1211
- @media (hover: hover) {
1212
- background-color: var(--color-secondary);
1213
- @supports (color: color-mix(in lab, red, red)) {
1214
- background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
1215
- }
1184
+ @supports (color: color-mix(in lab, red, red)) {
1185
+ .hover\:bg-muted\/30:hover {
1186
+ background-color: color-mix(in oklab, var(--color-muted) 30%, transparent);
1216
1187
  }
1217
1188
  }
1218
1189
  }
1219
- .hover\:bg-transparent {
1220
- &:hover {
1221
- @media (hover: hover) {
1222
- background-color: transparent;
1223
- }
1190
+ @media (hover: hover) {
1191
+ .hover\:bg-muted\/50:hover {
1192
+ background-color: var(--color-muted);
1224
1193
  }
1225
- }
1226
- .hover\:text-accent-foreground {
1227
- &:hover {
1228
- @media (hover: hover) {
1229
- color: var(--color-accent-foreground);
1194
+ @supports (color: color-mix(in lab, red, red)) {
1195
+ .hover\:bg-muted\/50:hover {
1196
+ background-color: color-mix(in oklab, var(--color-muted) 50%, transparent);
1230
1197
  }
1231
1198
  }
1232
1199
  }
1233
- .hover\:text-foreground {
1234
- &:hover {
1235
- @media (hover: hover) {
1236
- color: var(--color-foreground);
1200
+ @media (hover: hover) {
1201
+ .hover\:bg-muted\/80:hover {
1202
+ background-color: var(--color-muted);
1203
+ }
1204
+ @supports (color: color-mix(in lab, red, red)) {
1205
+ .hover\:bg-muted\/80:hover {
1206
+ background-color: color-mix(in oklab, var(--color-muted) 80%, transparent);
1237
1207
  }
1238
1208
  }
1239
1209
  }
1240
- .hover\:text-muted-foreground {
1241
- &:hover {
1242
- @media (hover: hover) {
1243
- color: var(--color-muted-foreground);
1244
- }
1210
+ @media (hover: hover) {
1211
+ .hover\:bg-primary:hover {
1212
+ background-color: var(--color-primary);
1245
1213
  }
1246
1214
  }
1247
- .hover\:opacity-90 {
1248
- &:hover {
1249
- @media (hover: hover) {
1250
- opacity: 90%;
1215
+ @media (hover: hover) {
1216
+ .hover\:bg-secondary\/80:hover {
1217
+ background-color: var(--color-secondary);
1218
+ }
1219
+ @supports (color: color-mix(in lab, red, red)) {
1220
+ .hover\:bg-secondary\/80:hover {
1221
+ background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
1251
1222
  }
1252
1223
  }
1253
1224
  }
1254
- .focus\:ring-2 {
1255
- &:focus {
1256
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1257
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1225
+ @media (hover: hover) {
1226
+ .hover\:bg-transparent:hover {
1227
+ background-color: transparent;
1258
1228
  }
1259
1229
  }
1260
- .focus\:ring-ring {
1261
- &:focus {
1262
- --tw-ring-color: var(--color-ring);
1230
+ @media (hover: hover) {
1231
+ .hover\:text-accent-foreground:hover {
1232
+ color: var(--color-accent-foreground);
1263
1233
  }
1264
1234
  }
1265
- .focus\:ring-offset-2 {
1266
- &:focus {
1267
- --tw-ring-offset-width: 2px;
1268
- --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1235
+ @media (hover: hover) {
1236
+ .hover\:text-foreground:hover {
1237
+ color: var(--color-foreground);
1269
1238
  }
1270
1239
  }
1271
- .focus\:outline-none {
1272
- &:focus {
1273
- --tw-outline-style: none;
1274
- outline-style: none;
1240
+ @media (hover: hover) {
1241
+ .hover\:text-muted-foreground:hover {
1242
+ color: var(--color-muted-foreground);
1275
1243
  }
1276
1244
  }
1277
- .focus-visible\:border-ring {
1278
- &:focus-visible {
1279
- border-color: var(--color-ring);
1245
+ @media (hover: hover) {
1246
+ .hover\:opacity-90:hover {
1247
+ opacity: 90%;
1280
1248
  }
1281
1249
  }
1282
- .focus-visible\:ring-\[3px\] {
1283
- &:focus-visible {
1284
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1285
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1286
- }
1250
+ .focus\:bg-muted:focus {
1251
+ background-color: var(--color-muted);
1287
1252
  }
1288
- .focus-visible\:ring-ring\/50 {
1289
- &:focus-visible {
1290
- --tw-ring-color: var(--color-ring);
1291
- @supports (color: color-mix(in lab, red, red)) {
1292
- --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
1293
- }
1294
- }
1253
+ .focus\:ring-2:focus {
1254
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1255
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1295
1256
  }
1296
- .enabled\:hover\:border {
1297
- &:enabled {
1298
- &:hover {
1299
- @media (hover: hover) {
1300
- border-style: var(--tw-border-style);
1301
- border-width: 1px;
1302
- }
1303
- }
1304
- }
1257
+ .focus\:ring-ring:focus {
1258
+ --tw-ring-color: var(--color-ring);
1305
1259
  }
1306
- .enabled\:hover\:border-stone-200 {
1307
- &:enabled {
1308
- &:hover {
1309
- @media (hover: hover) {
1310
- border-color: var(--color-stone-200);
1311
- }
1312
- }
1313
- }
1260
+ .focus\:ring-offset-2:focus {
1261
+ --tw-ring-offset-width: 2px;
1262
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1314
1263
  }
1315
- .enabled\:hover\:text-stone-950 {
1316
- &:enabled {
1317
- &:hover {
1318
- @media (hover: hover) {
1319
- color: var(--color-stone-950);
1320
- }
1321
- }
1322
- }
1264
+ .focus\:outline-none:focus {
1265
+ --tw-outline-style: none;
1266
+ outline-style: none;
1323
1267
  }
1324
- .enabled\:active\:cursor-grabbing {
1325
- &:enabled {
1326
- &:active {
1327
- cursor: grabbing;
1328
- }
1329
- }
1268
+ .focus-visible\:border-ring:focus-visible {
1269
+ border-color: var(--color-ring);
1330
1270
  }
1331
- .enabled\:active\:border {
1332
- &:enabled {
1333
- &:active {
1334
- border-style: var(--tw-border-style);
1335
- border-width: 1px;
1336
- }
1337
- }
1271
+ .focus-visible\:ring-\[3px\]:focus-visible {
1272
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1273
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1338
1274
  }
1339
- .enabled\:active\:border-primary {
1340
- &:enabled {
1341
- &:active {
1342
- border-color: var(--color-primary);
1343
- }
1344
- }
1275
+ .focus-visible\:ring-ring\/50:focus-visible {
1276
+ --tw-ring-color: var(--color-ring);
1345
1277
  }
1346
- .enabled\:active\:bg-primary-50 {
1347
- &:enabled {
1348
- &:active {
1349
- background-color: var(--color-primary-50);
1350
- }
1278
+ @supports (color: color-mix(in lab, red, red)) {
1279
+ .focus-visible\:ring-ring\/50:focus-visible {
1280
+ --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
1351
1281
  }
1352
1282
  }
1353
- .enabled\:active\:text-stone-950 {
1354
- &:enabled {
1355
- &:active {
1356
- color: var(--color-stone-950);
1357
- }
1283
+ @media (hover: hover) {
1284
+ .enabled\:hover\:border:enabled:hover {
1285
+ border-style: var(--tw-border-style);
1286
+ border-width: 1px;
1358
1287
  }
1359
1288
  }
1360
- .enabled\:active\:shadow {
1361
- &:enabled {
1362
- &:active {
1363
- --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1364
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1365
- }
1289
+ @media (hover: hover) {
1290
+ .enabled\:hover\:border-stone-200:enabled:hover {
1291
+ border-color: var(--color-stone-200);
1366
1292
  }
1367
1293
  }
1368
- .disabled\:pointer-events-none {
1369
- &:disabled {
1370
- pointer-events: none;
1294
+ @media (hover: hover) {
1295
+ .enabled\:hover\:text-stone-950:enabled:hover {
1296
+ color: var(--color-stone-950);
1371
1297
  }
1372
1298
  }
1373
- .disabled\:cursor-not-allowed {
1374
- &:disabled {
1375
- cursor: not-allowed;
1376
- }
1299
+ .enabled\:active\:cursor-grabbing:enabled:active {
1300
+ cursor: grabbing;
1377
1301
  }
1378
- .disabled\:text-muted-foreground {
1379
- &:disabled {
1380
- color: var(--color-muted-foreground);
1381
- }
1302
+ .enabled\:active\:border:enabled:active {
1303
+ border-style: var(--tw-border-style);
1304
+ border-width: 1px;
1382
1305
  }
1383
- .disabled\:text-stone-950 {
1384
- &:disabled {
1385
- color: var(--color-stone-950);
1386
- }
1306
+ .enabled\:active\:border-primary:enabled:active {
1307
+ border-color: var(--color-primary);
1387
1308
  }
1388
- .disabled\:opacity-40 {
1389
- &:disabled {
1390
- opacity: 40%;
1391
- }
1309
+ .enabled\:active\:bg-primary-50:enabled:active {
1310
+ background-color: var(--color-primary-50);
1392
1311
  }
1393
- .disabled\:opacity-50 {
1394
- &:disabled {
1395
- opacity: 50%;
1396
- }
1312
+ .enabled\:active\:text-stone-950:enabled:active {
1313
+ color: var(--color-stone-950);
1397
1314
  }
1398
- .disabled\:opacity-60 {
1399
- &:disabled {
1400
- opacity: 60%;
1401
- }
1315
+ .enabled\:active\:shadow:enabled:active {
1316
+ --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1317
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1402
1318
  }
1403
- .aria-invalid\:border-destructive {
1404
- &[aria-invalid="true"] {
1405
- border-color: var(--color-destructive);
1406
- }
1319
+ .disabled\:pointer-events-none:disabled {
1320
+ pointer-events: none;
1407
1321
  }
1408
- .aria-invalid\:ring-destructive\/20 {
1409
- &[aria-invalid="true"] {
1410
- --tw-ring-color: var(--color-destructive);
1411
- @supports (color: color-mix(in lab, red, red)) {
1412
- --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
1413
- }
1414
- }
1322
+ .disabled\:cursor-not-allowed:disabled {
1323
+ cursor: not-allowed;
1415
1324
  }
1416
- .data-\[state\=off\]\:opacity-50 {
1417
- &[data-state="off"] {
1418
- opacity: 50%;
1419
- }
1325
+ .disabled\:text-muted-foreground:disabled {
1326
+ color: var(--color-muted-foreground);
1420
1327
  }
1421
- .data-\[state\=off\]\:hover\:opacity-75 {
1422
- &[data-state="off"] {
1423
- &:hover {
1424
- @media (hover: hover) {
1425
- opacity: 75%;
1426
- }
1427
- }
1428
- }
1328
+ .disabled\:text-stone-950:disabled {
1329
+ color: var(--color-stone-950);
1429
1330
  }
1430
- .data-\[state\=on\]\:bg-accent {
1431
- &[data-state="on"] {
1432
- background-color: var(--color-accent);
1433
- }
1331
+ .disabled\:opacity-40:disabled {
1332
+ opacity: 40%;
1434
1333
  }
1435
- .data-\[state\=on\]\:bg-background {
1436
- &[data-state="on"] {
1437
- background-color: var(--color-background);
1438
- }
1334
+ .disabled\:opacity-50:disabled {
1335
+ opacity: 50%;
1439
1336
  }
1440
- .data-\[state\=on\]\:text-accent-foreground {
1441
- &[data-state="on"] {
1442
- color: var(--color-accent-foreground);
1337
+ .disabled\:opacity-60:disabled {
1338
+ opacity: 60%;
1339
+ }
1340
+ .aria-invalid\:border-destructive[aria-invalid="true"] {
1341
+ border-color: var(--color-destructive);
1342
+ }
1343
+ .aria-invalid\:ring-destructive\/20[aria-invalid="true"] {
1344
+ --tw-ring-color: var(--color-destructive);
1345
+ }
1346
+ @supports (color: color-mix(in lab, red, red)) {
1347
+ .aria-invalid\:ring-destructive\/20[aria-invalid="true"] {
1348
+ --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
1443
1349
  }
1444
1350
  }
1445
- .data-\[state\=on\]\:shadow-sm {
1446
- &[data-state="on"] {
1447
- --tw-shadow: 0px 1px 2px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.05));
1448
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1351
+ .data-\[disabled\]\:pointer-events-none[data-disabled] {
1352
+ pointer-events: none;
1353
+ }
1354
+ .data-\[disabled\]\:opacity-50[data-disabled] {
1355
+ opacity: 50%;
1356
+ }
1357
+ .data-\[highlighted\]\:bg-muted[data-highlighted] {
1358
+ background-color: var(--color-muted);
1359
+ }
1360
+ .data-\[state\=off\]\:opacity-50[data-state="off"] {
1361
+ opacity: 50%;
1362
+ }
1363
+ @media (hover: hover) {
1364
+ .data-\[state\=off\]\:hover\:opacity-75[data-state="off"]:hover {
1365
+ opacity: 75%;
1449
1366
  }
1450
1367
  }
1451
- .sm\:contents {
1452
- @media (width >= 40rem) {
1368
+ .data-\[state\=on\]\:bg-accent[data-state="on"] {
1369
+ background-color: var(--color-accent);
1370
+ }
1371
+ .data-\[state\=on\]\:bg-background[data-state="on"] {
1372
+ background-color: var(--color-background);
1373
+ }
1374
+ .data-\[state\=on\]\:text-accent-foreground[data-state="on"] {
1375
+ color: var(--color-accent-foreground);
1376
+ }
1377
+ .data-\[state\=on\]\:shadow-sm[data-state="on"] {
1378
+ --tw-shadow: 0px 1px 2px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.05));
1379
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1380
+ }
1381
+ .data-\[variant\=destructive\]\:text-destructive[data-variant="destructive"] {
1382
+ color: var(--color-destructive);
1383
+ }
1384
+ .data-\[variant\=destructive\]\:focus\:bg-bg-destructive-10[data-variant="destructive"]:focus {
1385
+ background-color: var(--color-bg-destructive-10);
1386
+ }
1387
+ .data-\[variant\=destructive\]\:focus\:text-destructive[data-variant="destructive"]:focus {
1388
+ color: var(--color-destructive);
1389
+ }
1390
+ .data-\[variant\=destructive\]\:data-\[highlighted\]\:bg-bg-destructive-10[data-variant="destructive"][data-highlighted] {
1391
+ background-color: var(--color-bg-destructive-10);
1392
+ }
1393
+ .data-\[variant\=destructive\]\:data-\[highlighted\]\:text-destructive[data-variant="destructive"][data-highlighted] {
1394
+ color: var(--color-destructive);
1395
+ }
1396
+ @media (width >= 40rem) {
1397
+ .sm\:contents {
1453
1398
  display: contents;
1454
1399
  }
1455
1400
  }
1456
- .sm\:flex {
1457
- @media (width >= 40rem) {
1401
+ @media (width >= 40rem) {
1402
+ .sm\:flex {
1458
1403
  display: flex;
1459
1404
  }
1460
1405
  }
1461
- .sm\:hidden {
1462
- @media (width >= 40rem) {
1406
+ @media (width >= 40rem) {
1407
+ .sm\:hidden {
1463
1408
  display: none;
1464
1409
  }
1465
1410
  }
1466
- .sm\:w-\[120px\] {
1467
- @media (width >= 40rem) {
1411
+ @media (width >= 40rem) {
1412
+ .sm\:w-\[120px\] {
1468
1413
  width: 120px;
1469
1414
  }
1470
1415
  }
1471
- .sm\:w-\[200px\] {
1472
- @media (width >= 40rem) {
1416
+ @media (width >= 40rem) {
1417
+ .sm\:w-\[200px\] {
1473
1418
  width: 200px;
1474
1419
  }
1475
1420
  }
1476
- .sm\:shrink-0 {
1477
- @media (width >= 40rem) {
1421
+ @media (width >= 40rem) {
1422
+ .sm\:shrink-0 {
1478
1423
  flex-shrink: 0;
1479
1424
  }
1480
1425
  }
1481
- .sm\:items-center {
1482
- @media (width >= 40rem) {
1426
+ @media (width >= 40rem) {
1427
+ .sm\:items-center {
1483
1428
  align-items: center;
1484
1429
  }
1485
1430
  }
1486
- .sm\:gap-\[60px\] {
1487
- @media (width >= 40rem) {
1431
+ @media (width >= 40rem) {
1432
+ .sm\:gap-\[60px\] {
1488
1433
  gap: 60px;
1489
1434
  }
1490
1435
  }
1491
- .sm\:p-10 {
1492
- @media (width >= 40rem) {
1436
+ @media (width >= 40rem) {
1437
+ .sm\:p-10 {
1493
1438
  padding: calc(var(--spacing) * 10);
1494
1439
  }
1495
1440
  }
1496
- .sm\:px-16 {
1497
- @media (width >= 40rem) {
1441
+ @media (width >= 40rem) {
1442
+ .sm\:px-16 {
1498
1443
  padding-inline: calc(var(--spacing) * 16);
1499
1444
  }
1500
1445
  }
1501
- .sm\:py-20 {
1502
- @media (width >= 40rem) {
1446
+ @media (width >= 40rem) {
1447
+ .sm\:py-20 {
1503
1448
  padding-block: calc(var(--spacing) * 20);
1504
1449
  }
1505
1450
  }
1506
- .sm\:text-5xl {
1507
- @media (width >= 40rem) {
1508
- font-size: var(--text-5xl);
1509
- line-height: var(--tw-leading, var(--text-5xl--line-height));
1510
- letter-spacing: var(--tw-tracking, var(--text-5xl--letter-spacing));
1511
- }
1451
+ .\[\&_svg\]\:pointer-events-none svg {
1452
+ pointer-events: none;
1512
1453
  }
1513
- .\[\&_svg\]\:pointer-events-none {
1514
- & svg {
1515
- pointer-events: none;
1516
- }
1454
+ .\[\&_svg\]\:size-4 svg {
1455
+ width: calc(var(--spacing) * 4);
1456
+ height: calc(var(--spacing) * 4);
1517
1457
  }
1518
- .\[\&_svg\]\:shrink-0 {
1519
- & svg {
1520
- flex-shrink: 0;
1521
- }
1458
+ .\[\&_svg\]\:shrink-0 svg {
1459
+ flex-shrink: 0;
1522
1460
  }
1523
- .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 {
1524
- & svg:not([class*='size-']) {
1525
- width: calc(var(--spacing) * 4);
1526
- height: calc(var(--spacing) * 4);
1527
- }
1461
+ .data-\[variant\=destructive\]\:\[\&_svg\]\:text-destructive[data-variant="destructive"] svg {
1462
+ color: var(--color-destructive);
1463
+ }
1464
+ .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*='size-']) {
1465
+ width: calc(var(--spacing) * 4);
1466
+ height: calc(var(--spacing) * 4);
1467
+ }
1468
+ .\[\&_svg\:not\(\[class\*\=absolute\]\)\]\:relative svg:not([class*=absolute]) {
1469
+ position: relative;
1470
+ }
1471
+ .\[\&\>svg\:first-child\]\:absolute > svg:first-child {
1472
+ position: absolute;
1473
+ }
1474
+ .\[\&\>svg\:first-child\]\:top-1\/2 > svg:first-child {
1475
+ top: calc(1 / 2 * 100%);
1476
+ }
1477
+ .\[\&\>svg\:first-child\]\:left-2 > svg:first-child {
1478
+ left: calc(var(--spacing) * 2);
1479
+ }
1480
+ .\[\&\>svg\:first-child\]\:-translate-y-1\/2 > svg:first-child {
1481
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
1482
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1528
1483
  }
1529
1484
  [data-ohw-bridge-root] {
1530
1485
  --color-primary: var(--ohw-primary, #0885FE);