@ohhwells/bridge 0.1.50 → 0.1.51-next.119

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.
Files changed (8) hide show
  1. package/dist/index.cjs +1907 -585
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +30 -4
  4. package/dist/index.d.ts +30 -4
  5. package/dist/index.js +1724 -408
  6. package/dist/index.js.map +1 -1
  7. package/dist/styles.css +348 -375
  8. package/package.json +2 -1
package/dist/styles.css CHANGED
@@ -46,6 +46,7 @@
46
46
  --color-foreground: var(--ohw-foreground, #0c0a09);
47
47
  --color-card-foreground: var(--ohw-card-foreground, #0c0a09);
48
48
  --color-popover: var(--ohw-popover, #ffffff);
49
+ --color-popover-foreground: var(--ohw-popover-foreground, #0c0a09);
49
50
  --color-secondary: var(--ohw-secondary, #f5f5f4);
50
51
  --color-secondary-foreground: var(--ohw-secondary-foreground, #0c0a09);
51
52
  --color-muted: var(--ohw-muted, #f5f5f4);
@@ -54,6 +55,7 @@
54
55
  --color-accent-foreground: var(--ohw-accent-foreground, #0c0a09);
55
56
  --color-destructive: var(--ohw-destructive, #c10007);
56
57
  --color-destructive-foreground: var(--ohw-destructive-foreground, #fafaf9);
58
+ --color-bg-destructive-10: var(--ohw-bg-destructive-10, #c100071a);
57
59
  --color-border: var(--ohw-border, #e7e5e4);
58
60
  --color-input: var(--ohw-input, #e7e5e4);
59
61
  --color-ring: var(--ohw-ring, #0885FE);
@@ -146,6 +148,9 @@
146
148
  .left-1\/2 {
147
149
  left: calc(1 / 2 * 100%);
148
150
  }
151
+ .left-2 {
152
+ left: calc(var(--spacing) * 2);
153
+ }
149
154
  .left-5 {
150
155
  left: calc(var(--spacing) * 5);
151
156
  }
@@ -175,19 +180,29 @@
175
180
  }
176
181
  .container {
177
182
  width: 100%;
178
- @media (width >= 40rem) {
183
+ }
184
+ @media (width >= 40rem) {
185
+ .container {
179
186
  max-width: 40rem;
180
187
  }
181
- @media (width >= 48rem) {
188
+ }
189
+ @media (width >= 48rem) {
190
+ .container {
182
191
  max-width: 48rem;
183
192
  }
184
- @media (width >= 64rem) {
193
+ }
194
+ @media (width >= 64rem) {
195
+ .container {
185
196
  max-width: 64rem;
186
197
  }
187
- @media (width >= 80rem) {
198
+ }
199
+ @media (width >= 80rem) {
200
+ .container {
188
201
  max-width: 80rem;
189
202
  }
190
- @media (width >= 96rem) {
203
+ }
204
+ @media (width >= 96rem) {
205
+ .container {
191
206
  max-width: 96rem;
192
207
  }
193
208
  }
@@ -333,6 +348,9 @@
333
348
  .w-14 {
334
349
  width: calc(var(--spacing) * 14);
335
350
  }
351
+ .w-56 {
352
+ width: calc(var(--spacing) * 56);
353
+ }
336
354
  .w-\[3px\] {
337
355
  width: 3px;
338
356
  }
@@ -370,6 +388,9 @@
370
388
  .min-w-10 {
371
389
  min-width: calc(var(--spacing) * 10);
372
390
  }
391
+ .min-w-32 {
392
+ min-width: calc(var(--spacing) * 32);
393
+ }
373
394
  .min-w-\[64px\] {
374
395
  min-width: 64px;
375
396
  }
@@ -385,6 +406,9 @@
385
406
  .grow {
386
407
  flex-grow: 1;
387
408
  }
409
+ .origin-\[var\(--radix-dropdown-menu-content-transform-origin\)\] {
410
+ transform-origin: var(--radix-dropdown-menu-content-transform-origin);
411
+ }
388
412
  .origin-\[var\(--radix-tooltip-content-transform-origin\)\] {
389
413
  transform-origin: var(--radix-tooltip-content-transform-origin);
390
414
  }
@@ -400,6 +424,10 @@
400
424
  --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
401
425
  translate: var(--tw-translate-x) var(--tw-translate-y);
402
426
  }
427
+ .-translate-y-full {
428
+ --tw-translate-y: -100%;
429
+ translate: var(--tw-translate-x) var(--tw-translate-y);
430
+ }
403
431
  .translate-y-1\/2 {
404
432
  --tw-translate-y: calc(1 / 2 * 100%);
405
433
  translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -499,12 +527,18 @@
499
527
  .overflow-x-auto {
500
528
  overflow-x: auto;
501
529
  }
530
+ .rounded-\[6px\] {
531
+ border-radius: 6px;
532
+ }
502
533
  .rounded-\[10px\] {
503
534
  border-radius: 10px;
504
535
  }
505
536
  .rounded-\[calc\(var\(--radius\,0\.5rem\)-2px\)\] {
506
537
  border-radius: calc(var(--radius,0.5rem) - 2px);
507
538
  }
539
+ .rounded-\[calc\(var\(--radius\,0\.5rem\)-4px\)\] {
540
+ border-radius: calc(var(--radius,0.5rem) - 4px);
541
+ }
508
542
  .rounded-\[var\(--radius\,0\.5rem\)\] {
509
543
  border-radius: var(--radius,0.5rem);
510
544
  }
@@ -541,6 +575,10 @@
541
575
  border-style: var(--tw-border-style);
542
576
  border-width: 2px;
543
577
  }
578
+ .border-t {
579
+ border-top-style: var(--tw-border-style);
580
+ border-top-width: 1px;
581
+ }
544
582
  .border-b {
545
583
  border-bottom-style: var(--tw-border-style);
546
584
  border-bottom-width: 1px;
@@ -589,13 +627,17 @@
589
627
  }
590
628
  .bg-black\/20 {
591
629
  background-color: color-mix(in srgb, #000 20%, transparent);
592
- @supports (color: color-mix(in lab, red, red)) {
630
+ }
631
+ @supports (color: color-mix(in lab, red, red)) {
632
+ .bg-black\/20 {
593
633
  background-color: color-mix(in oklab, var(--color-black) 20%, transparent);
594
634
  }
595
635
  }
596
636
  .bg-black\/50 {
597
637
  background-color: color-mix(in srgb, #000 50%, transparent);
598
- @supports (color: color-mix(in lab, red, red)) {
638
+ }
639
+ @supports (color: color-mix(in lab, red, red)) {
640
+ .bg-black\/50 {
599
641
  background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
600
642
  }
601
643
  }
@@ -616,7 +658,9 @@
616
658
  }
617
659
  .bg-muted\/40 {
618
660
  background-color: var(--color-muted);
619
- @supports (color: color-mix(in lab, red, red)) {
661
+ }
662
+ @supports (color: color-mix(in lab, red, red)) {
663
+ .bg-muted\/40 {
620
664
  background-color: color-mix(in oklab, var(--color-muted) 40%, transparent);
621
665
  }
622
666
  }
@@ -747,6 +791,9 @@
747
791
  .pl-4 {
748
792
  padding-left: calc(var(--spacing) * 4);
749
793
  }
794
+ .pl-8 {
795
+ padding-left: calc(var(--spacing) * 8);
796
+ }
750
797
  .text-center {
751
798
  text-align: center;
752
799
  }
@@ -879,6 +926,9 @@
879
926
  .text-muted-foreground {
880
927
  color: var(--color-muted-foreground);
881
928
  }
929
+ .text-popover-foreground {
930
+ color: var(--color-popover-foreground);
931
+ }
882
932
  .text-primary-foreground {
883
933
  color: var(--color-primary-foreground);
884
934
  }
@@ -929,6 +979,10 @@
929
979
  --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--ohw-primary));
930
980
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
931
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
+ }
932
986
  .shadow-lg {
933
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));
934
988
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -1018,495 +1072,414 @@
1018
1072
  --tw-outline-style: none;
1019
1073
  outline-style: none;
1020
1074
  }
1021
- .placeholder\:text-muted-foreground {
1022
- &::-moz-placeholder {
1023
- color: var(--color-muted-foreground);
1024
- }
1025
- &::placeholder {
1026
- color: var(--color-muted-foreground);
1027
- }
1075
+ .select-none {
1076
+ -webkit-user-select: none;
1077
+ -moz-user-select: none;
1078
+ user-select: none;
1028
1079
  }
1029
- .before\:pointer-events-none {
1030
- &::before {
1031
- content: var(--tw-content);
1032
- pointer-events: none;
1033
- }
1080
+ .placeholder\:text-muted-foreground::-moz-placeholder {
1081
+ color: var(--color-muted-foreground);
1034
1082
  }
1035
- .before\:absolute {
1036
- &::before {
1037
- content: var(--tw-content);
1038
- position: absolute;
1039
- }
1083
+ .placeholder\:text-muted-foreground::placeholder {
1084
+ color: var(--color-muted-foreground);
1040
1085
  }
1041
- .before\:top-0 {
1042
- &::before {
1043
- content: var(--tw-content);
1044
- top: calc(var(--spacing) * 0);
1045
- }
1086
+ .before\:pointer-events-none::before {
1087
+ content: var(--tw-content);
1088
+ pointer-events: none;
1046
1089
  }
1047
- .before\:top-1\/2 {
1048
- &::before {
1049
- content: var(--tw-content);
1050
- top: calc(1 / 2 * 100%);
1051
- }
1090
+ .before\:absolute::before {
1091
+ content: var(--tw-content);
1092
+ position: absolute;
1052
1093
  }
1053
- .before\:right-0 {
1054
- &::before {
1055
- content: var(--tw-content);
1056
- right: calc(var(--spacing) * 0);
1057
- }
1094
+ .before\:top-0::before {
1095
+ content: var(--tw-content);
1096
+ top: calc(var(--spacing) * 0);
1058
1097
  }
1059
- .before\:bottom-0 {
1060
- &::before {
1061
- content: var(--tw-content);
1062
- bottom: calc(var(--spacing) * 0);
1063
- }
1098
+ .before\:top-1\/2::before {
1099
+ content: var(--tw-content);
1100
+ top: calc(1 / 2 * 100%);
1064
1101
  }
1065
- .before\:left-0 {
1066
- &::before {
1067
- content: var(--tw-content);
1068
- left: calc(var(--spacing) * 0);
1069
- }
1102
+ .before\:right-0::before {
1103
+ content: var(--tw-content);
1104
+ right: calc(var(--spacing) * 0);
1070
1105
  }
1071
- .before\:left-1\/2 {
1072
- &::before {
1073
- content: var(--tw-content);
1074
- left: calc(1 / 2 * 100%);
1075
- }
1106
+ .before\:bottom-0::before {
1107
+ content: var(--tw-content);
1108
+ bottom: calc(var(--spacing) * 0);
1076
1109
  }
1077
- .before\:size-2 {
1078
- &::before {
1079
- content: var(--tw-content);
1080
- width: calc(var(--spacing) * 2);
1081
- height: calc(var(--spacing) * 2);
1082
- }
1110
+ .before\:left-0::before {
1111
+ content: var(--tw-content);
1112
+ left: calc(var(--spacing) * 0);
1083
1113
  }
1084
- .before\:-translate-x-1\/2 {
1085
- &::before {
1086
- content: var(--tw-content);
1087
- --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
1088
- translate: var(--tw-translate-x) var(--tw-translate-y);
1089
- }
1114
+ .before\:left-1\/2::before {
1115
+ content: var(--tw-content);
1116
+ left: calc(1 / 2 * 100%);
1090
1117
  }
1091
- .before\:translate-x-1\/2 {
1092
- &::before {
1093
- content: var(--tw-content);
1094
- --tw-translate-x: calc(1 / 2 * 100%);
1095
- translate: var(--tw-translate-x) var(--tw-translate-y);
1096
- }
1118
+ .before\:size-2::before {
1119
+ content: var(--tw-content);
1120
+ width: calc(var(--spacing) * 2);
1121
+ height: calc(var(--spacing) * 2);
1097
1122
  }
1098
- .before\:-translate-y-1\/2 {
1099
- &::before {
1100
- content: var(--tw-content);
1101
- --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
1102
- translate: var(--tw-translate-x) var(--tw-translate-y);
1103
- }
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);
1104
1127
  }
1105
- .before\:translate-y-1\/2 {
1106
- &::before {
1107
- content: var(--tw-content);
1108
- --tw-translate-y: calc(1 / 2 * 100%);
1109
- translate: var(--tw-translate-x) var(--tw-translate-y);
1110
- }
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);
1111
1132
  }
1112
- .before\:rotate-45 {
1113
- &::before {
1114
- content: var(--tw-content);
1115
- rotate: 45deg;
1116
- }
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);
1117
1137
  }
1118
- .before\:bg-foreground {
1119
- &::before {
1120
- content: var(--tw-content);
1121
- background-color: var(--color-foreground);
1122
- }
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);
1123
1142
  }
1124
- .before\:content-\[\"\"\] {
1125
- &::before {
1126
- --tw-content: "";
1127
- content: var(--tw-content);
1128
- }
1143
+ .before\:rotate-45::before {
1144
+ content: var(--tw-content);
1145
+ rotate: 45deg;
1129
1146
  }
1130
- .hover\:bg-accent {
1131
- &:hover {
1132
- @media (hover: hover) {
1133
- background-color: var(--color-accent);
1134
- }
1135
- }
1147
+ .before\:bg-foreground::before {
1148
+ content: var(--tw-content);
1149
+ background-color: var(--color-foreground);
1136
1150
  }
1137
- .hover\:bg-background {
1138
- &:hover {
1139
- @media (hover: hover) {
1140
- background-color: var(--color-background);
1141
- }
1142
- }
1151
+ .before\:content-\[\"\"\]::before {
1152
+ --tw-content: "";
1153
+ content: var(--tw-content);
1143
1154
  }
1144
- .hover\:bg-destructive\/80 {
1145
- &:hover {
1146
- @media (hover: hover) {
1147
- background-color: var(--color-destructive);
1148
- @supports (color: color-mix(in lab, red, red)) {
1149
- background-color: color-mix(in oklab, var(--color-destructive) 80%, transparent);
1150
- }
1151
- }
1155
+ @media (hover: hover) {
1156
+ .hover\:bg-accent:hover {
1157
+ background-color: var(--color-accent);
1152
1158
  }
1153
1159
  }
1154
- .hover\:bg-muted {
1155
- &:hover {
1156
- @media (hover: hover) {
1157
- background-color: var(--color-muted);
1158
- }
1160
+ @media (hover: hover) {
1161
+ .hover\:bg-background:hover {
1162
+ background-color: var(--color-background);
1159
1163
  }
1160
1164
  }
1161
- .hover\:bg-muted\/30 {
1162
- &:hover {
1163
- @media (hover: hover) {
1164
- background-color: var(--color-muted);
1165
- @supports (color: color-mix(in lab, red, red)) {
1166
- background-color: color-mix(in oklab, var(--color-muted) 30%, transparent);
1167
- }
1168
- }
1165
+ @media (hover: hover) {
1166
+ .hover\:bg-destructive\/80:hover {
1167
+ background-color: var(--color-destructive);
1169
1168
  }
1170
- }
1171
- .hover\:bg-muted\/50 {
1172
- &:hover {
1173
- @media (hover: hover) {
1174
- background-color: var(--color-muted);
1175
- @supports (color: color-mix(in lab, red, red)) {
1176
- background-color: color-mix(in oklab, var(--color-muted) 50%, transparent);
1177
- }
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);
1178
1172
  }
1179
1173
  }
1180
1174
  }
1181
- .hover\:bg-muted\/80 {
1182
- &:hover {
1183
- @media (hover: hover) {
1184
- background-color: var(--color-muted);
1185
- @supports (color: color-mix(in lab, red, red)) {
1186
- background-color: color-mix(in oklab, var(--color-muted) 80%, transparent);
1187
- }
1188
- }
1175
+ @media (hover: hover) {
1176
+ .hover\:bg-muted:hover {
1177
+ background-color: var(--color-muted);
1189
1178
  }
1190
1179
  }
1191
- .hover\:bg-primary {
1192
- &:hover {
1193
- @media (hover: hover) {
1194
- background-color: var(--color-primary);
1195
- }
1180
+ @media (hover: hover) {
1181
+ .hover\:bg-muted\/30:hover {
1182
+ background-color: var(--color-muted);
1196
1183
  }
1197
- }
1198
- .hover\:bg-secondary\/80 {
1199
- &:hover {
1200
- @media (hover: hover) {
1201
- background-color: var(--color-secondary);
1202
- @supports (color: color-mix(in lab, red, red)) {
1203
- background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
1204
- }
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);
1205
1187
  }
1206
1188
  }
1207
1189
  }
1208
- .hover\:bg-transparent {
1209
- &:hover {
1210
- @media (hover: hover) {
1211
- background-color: transparent;
1212
- }
1190
+ @media (hover: hover) {
1191
+ .hover\:bg-muted\/50:hover {
1192
+ background-color: var(--color-muted);
1213
1193
  }
1214
- }
1215
- .hover\:text-accent-foreground {
1216
- &:hover {
1217
- @media (hover: hover) {
1218
- 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);
1219
1197
  }
1220
1198
  }
1221
1199
  }
1222
- .hover\:text-foreground {
1223
- &:hover {
1224
- @media (hover: hover) {
1225
- 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);
1226
1207
  }
1227
1208
  }
1228
1209
  }
1229
- .hover\:text-muted-foreground {
1230
- &:hover {
1231
- @media (hover: hover) {
1232
- color: var(--color-muted-foreground);
1233
- }
1210
+ @media (hover: hover) {
1211
+ .hover\:bg-primary:hover {
1212
+ background-color: var(--color-primary);
1234
1213
  }
1235
1214
  }
1236
- .hover\:opacity-90 {
1237
- &:hover {
1238
- @media (hover: hover) {
1239
- 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);
1240
1222
  }
1241
1223
  }
1242
1224
  }
1243
- .focus\:ring-2 {
1244
- &:focus {
1245
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1246
- 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;
1247
1228
  }
1248
1229
  }
1249
- .focus\:ring-ring {
1250
- &:focus {
1251
- --tw-ring-color: var(--color-ring);
1230
+ @media (hover: hover) {
1231
+ .hover\:text-accent-foreground:hover {
1232
+ color: var(--color-accent-foreground);
1252
1233
  }
1253
1234
  }
1254
- .focus\:ring-offset-2 {
1255
- &:focus {
1256
- --tw-ring-offset-width: 2px;
1257
- --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);
1258
1238
  }
1259
1239
  }
1260
- .focus\:outline-none {
1261
- &:focus {
1262
- --tw-outline-style: none;
1263
- outline-style: none;
1240
+ @media (hover: hover) {
1241
+ .hover\:text-muted-foreground:hover {
1242
+ color: var(--color-muted-foreground);
1264
1243
  }
1265
1244
  }
1266
- .focus-visible\:border-ring {
1267
- &:focus-visible {
1268
- border-color: var(--color-ring);
1245
+ @media (hover: hover) {
1246
+ .hover\:opacity-90:hover {
1247
+ opacity: 90%;
1269
1248
  }
1270
1249
  }
1271
- .focus-visible\:ring-\[3px\] {
1272
- &:focus-visible {
1273
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1274
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1275
- }
1250
+ .focus\:bg-muted:focus {
1251
+ background-color: var(--color-muted);
1276
1252
  }
1277
- .focus-visible\:ring-ring\/50 {
1278
- &:focus-visible {
1279
- --tw-ring-color: var(--color-ring);
1280
- @supports (color: color-mix(in lab, red, red)) {
1281
- --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
1282
- }
1283
- }
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);
1284
1256
  }
1285
- .enabled\:hover\:border {
1286
- &:enabled {
1287
- &:hover {
1288
- @media (hover: hover) {
1289
- border-style: var(--tw-border-style);
1290
- border-width: 1px;
1291
- }
1292
- }
1293
- }
1257
+ .focus\:ring-ring:focus {
1258
+ --tw-ring-color: var(--color-ring);
1294
1259
  }
1295
- .enabled\:hover\:border-stone-200 {
1296
- &:enabled {
1297
- &:hover {
1298
- @media (hover: hover) {
1299
- border-color: var(--color-stone-200);
1300
- }
1301
- }
1302
- }
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);
1303
1263
  }
1304
- .enabled\:hover\:text-stone-950 {
1305
- &:enabled {
1306
- &:hover {
1307
- @media (hover: hover) {
1308
- color: var(--color-stone-950);
1309
- }
1310
- }
1311
- }
1264
+ .focus\:outline-none:focus {
1265
+ --tw-outline-style: none;
1266
+ outline-style: none;
1312
1267
  }
1313
- .enabled\:active\:cursor-grabbing {
1314
- &:enabled {
1315
- &:active {
1316
- cursor: grabbing;
1317
- }
1318
- }
1268
+ .focus-visible\:border-ring:focus-visible {
1269
+ border-color: var(--color-ring);
1319
1270
  }
1320
- .enabled\:active\:border {
1321
- &:enabled {
1322
- &:active {
1323
- border-style: var(--tw-border-style);
1324
- border-width: 1px;
1325
- }
1326
- }
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);
1327
1274
  }
1328
- .enabled\:active\:border-primary {
1329
- &:enabled {
1330
- &:active {
1331
- border-color: var(--color-primary);
1332
- }
1333
- }
1275
+ .focus-visible\:ring-ring\/50:focus-visible {
1276
+ --tw-ring-color: var(--color-ring);
1334
1277
  }
1335
- .enabled\:active\:bg-primary-50 {
1336
- &:enabled {
1337
- &:active {
1338
- background-color: var(--color-primary-50);
1339
- }
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);
1340
1281
  }
1341
1282
  }
1342
- .enabled\:active\:text-stone-950 {
1343
- &:enabled {
1344
- &:active {
1345
- color: var(--color-stone-950);
1346
- }
1283
+ @media (hover: hover) {
1284
+ .enabled\:hover\:border:enabled:hover {
1285
+ border-style: var(--tw-border-style);
1286
+ border-width: 1px;
1347
1287
  }
1348
1288
  }
1349
- .enabled\:active\:shadow {
1350
- &:enabled {
1351
- &:active {
1352
- --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));
1353
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1354
- }
1289
+ @media (hover: hover) {
1290
+ .enabled\:hover\:border-stone-200:enabled:hover {
1291
+ border-color: var(--color-stone-200);
1355
1292
  }
1356
1293
  }
1357
- .disabled\:pointer-events-none {
1358
- &:disabled {
1359
- pointer-events: none;
1294
+ @media (hover: hover) {
1295
+ .enabled\:hover\:text-stone-950:enabled:hover {
1296
+ color: var(--color-stone-950);
1360
1297
  }
1361
1298
  }
1362
- .disabled\:cursor-not-allowed {
1363
- &:disabled {
1364
- cursor: not-allowed;
1365
- }
1299
+ .enabled\:active\:cursor-grabbing:enabled:active {
1300
+ cursor: grabbing;
1366
1301
  }
1367
- .disabled\:text-muted-foreground {
1368
- &:disabled {
1369
- color: var(--color-muted-foreground);
1370
- }
1302
+ .enabled\:active\:border:enabled:active {
1303
+ border-style: var(--tw-border-style);
1304
+ border-width: 1px;
1371
1305
  }
1372
- .disabled\:text-stone-950 {
1373
- &:disabled {
1374
- color: var(--color-stone-950);
1375
- }
1306
+ .enabled\:active\:border-primary:enabled:active {
1307
+ border-color: var(--color-primary);
1376
1308
  }
1377
- .disabled\:opacity-40 {
1378
- &:disabled {
1379
- opacity: 40%;
1380
- }
1309
+ .enabled\:active\:bg-primary-50:enabled:active {
1310
+ background-color: var(--color-primary-50);
1381
1311
  }
1382
- .disabled\:opacity-50 {
1383
- &:disabled {
1384
- opacity: 50%;
1385
- }
1312
+ .enabled\:active\:text-stone-950:enabled:active {
1313
+ color: var(--color-stone-950);
1386
1314
  }
1387
- .disabled\:opacity-60 {
1388
- &:disabled {
1389
- opacity: 60%;
1390
- }
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);
1391
1318
  }
1392
- .aria-invalid\:border-destructive {
1393
- &[aria-invalid="true"] {
1394
- border-color: var(--color-destructive);
1395
- }
1319
+ .disabled\:pointer-events-none:disabled {
1320
+ pointer-events: none;
1396
1321
  }
1397
- .aria-invalid\:ring-destructive\/20 {
1398
- &[aria-invalid="true"] {
1399
- --tw-ring-color: var(--color-destructive);
1400
- @supports (color: color-mix(in lab, red, red)) {
1401
- --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
1402
- }
1403
- }
1322
+ .disabled\:cursor-not-allowed:disabled {
1323
+ cursor: not-allowed;
1404
1324
  }
1405
- .data-\[state\=off\]\:opacity-50 {
1406
- &[data-state="off"] {
1407
- opacity: 50%;
1408
- }
1325
+ .disabled\:text-muted-foreground:disabled {
1326
+ color: var(--color-muted-foreground);
1409
1327
  }
1410
- .data-\[state\=off\]\:hover\:opacity-75 {
1411
- &[data-state="off"] {
1412
- &:hover {
1413
- @media (hover: hover) {
1414
- opacity: 75%;
1415
- }
1416
- }
1417
- }
1328
+ .disabled\:text-stone-950:disabled {
1329
+ color: var(--color-stone-950);
1418
1330
  }
1419
- .data-\[state\=on\]\:bg-accent {
1420
- &[data-state="on"] {
1421
- background-color: var(--color-accent);
1422
- }
1331
+ .disabled\:opacity-40:disabled {
1332
+ opacity: 40%;
1423
1333
  }
1424
- .data-\[state\=on\]\:bg-background {
1425
- &[data-state="on"] {
1426
- background-color: var(--color-background);
1427
- }
1334
+ .disabled\:opacity-50:disabled {
1335
+ opacity: 50%;
1428
1336
  }
1429
- .data-\[state\=on\]\:text-accent-foreground {
1430
- &[data-state="on"] {
1431
- 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);
1432
1349
  }
1433
1350
  }
1434
- .data-\[state\=on\]\:shadow-sm {
1435
- &[data-state="on"] {
1436
- --tw-shadow: 0px 1px 2px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.05));
1437
- 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%;
1438
1366
  }
1439
1367
  }
1440
- .sm\:contents {
1441
- @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 {
1442
1398
  display: contents;
1443
1399
  }
1444
1400
  }
1445
- .sm\:flex {
1446
- @media (width >= 40rem) {
1401
+ @media (width >= 40rem) {
1402
+ .sm\:flex {
1447
1403
  display: flex;
1448
1404
  }
1449
1405
  }
1450
- .sm\:hidden {
1451
- @media (width >= 40rem) {
1406
+ @media (width >= 40rem) {
1407
+ .sm\:hidden {
1452
1408
  display: none;
1453
1409
  }
1454
1410
  }
1455
- .sm\:w-\[120px\] {
1456
- @media (width >= 40rem) {
1411
+ @media (width >= 40rem) {
1412
+ .sm\:w-\[120px\] {
1457
1413
  width: 120px;
1458
1414
  }
1459
1415
  }
1460
- .sm\:w-\[200px\] {
1461
- @media (width >= 40rem) {
1416
+ @media (width >= 40rem) {
1417
+ .sm\:w-\[200px\] {
1462
1418
  width: 200px;
1463
1419
  }
1464
1420
  }
1465
- .sm\:shrink-0 {
1466
- @media (width >= 40rem) {
1421
+ @media (width >= 40rem) {
1422
+ .sm\:shrink-0 {
1467
1423
  flex-shrink: 0;
1468
1424
  }
1469
1425
  }
1470
- .sm\:items-center {
1471
- @media (width >= 40rem) {
1426
+ @media (width >= 40rem) {
1427
+ .sm\:items-center {
1472
1428
  align-items: center;
1473
1429
  }
1474
1430
  }
1475
- .sm\:gap-\[60px\] {
1476
- @media (width >= 40rem) {
1431
+ @media (width >= 40rem) {
1432
+ .sm\:gap-\[60px\] {
1477
1433
  gap: 60px;
1478
1434
  }
1479
1435
  }
1480
- .sm\:p-10 {
1481
- @media (width >= 40rem) {
1436
+ @media (width >= 40rem) {
1437
+ .sm\:p-10 {
1482
1438
  padding: calc(var(--spacing) * 10);
1483
1439
  }
1484
1440
  }
1485
- .sm\:px-16 {
1486
- @media (width >= 40rem) {
1441
+ @media (width >= 40rem) {
1442
+ .sm\:px-16 {
1487
1443
  padding-inline: calc(var(--spacing) * 16);
1488
1444
  }
1489
1445
  }
1490
- .sm\:py-20 {
1491
- @media (width >= 40rem) {
1446
+ @media (width >= 40rem) {
1447
+ .sm\:py-20 {
1492
1448
  padding-block: calc(var(--spacing) * 20);
1493
1449
  }
1494
1450
  }
1495
- .\[\&_svg\]\:pointer-events-none {
1496
- & svg {
1497
- pointer-events: none;
1498
- }
1451
+ .\[\&_svg\]\:pointer-events-none svg {
1452
+ pointer-events: none;
1499
1453
  }
1500
- .\[\&_svg\]\:shrink-0 {
1501
- & svg {
1502
- flex-shrink: 0;
1503
- }
1454
+ .\[\&_svg\]\:size-4 svg {
1455
+ width: calc(var(--spacing) * 4);
1456
+ height: calc(var(--spacing) * 4);
1504
1457
  }
1505
- .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 {
1506
- & svg:not([class*='size-']) {
1507
- width: calc(var(--spacing) * 4);
1508
- height: calc(var(--spacing) * 4);
1509
- }
1458
+ .\[\&_svg\]\:shrink-0 svg {
1459
+ flex-shrink: 0;
1460
+ }
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);
1510
1483
  }
1511
1484
  [data-ohw-bridge-root] {
1512
1485
  --color-primary: var(--ohw-primary, #0885FE);