@ohhwells/bridge 0.1.38 → 0.1.39-next.72

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
@@ -12,7 +12,6 @@
12
12
  --color-white: #fff;
13
13
  --spacing: 0.25rem;
14
14
  --container-xs: 20rem;
15
- --container-md: 28rem;
16
15
  --text-xs: 12px;
17
16
  --text-xs--line-height: 16px;
18
17
  --text-sm: 14px;
@@ -23,10 +22,6 @@
23
22
  --text-lg--line-height: 28px;
24
23
  --text-xl: 20px;
25
24
  --text-xl--line-height: 28px;
26
- --text-4xl: 36px;
27
- --text-4xl--line-height: 40px;
28
- --text-5xl: 48px;
29
- --text-5xl--line-height: 1;
30
25
  --font-weight-normal: 400;
31
26
  --font-weight-medium: 500;
32
27
  --font-weight-semibold: 600;
@@ -61,8 +56,6 @@
61
56
  --color-border: var(--ohw-border, #e2e8f0);
62
57
  --color-input: var(--ohw-input, #e2e8f0);
63
58
  --color-ring: var(--ohw-ring, #64748b);
64
- --text-5xl--letter-spacing: -0.025em;
65
- --text-4xl--letter-spacing: -0.025em;
66
59
  --text-xl--letter-spacing: -0.025em;
67
60
  --text-lg--letter-spacing: 0em;
68
61
  --text-base--letter-spacing: 0em;
@@ -110,6 +103,9 @@
110
103
  .top-2\.5 {
111
104
  top: calc(var(--spacing) * 2.5);
112
105
  }
106
+ .top-3 {
107
+ top: calc(var(--spacing) * 3);
108
+ }
113
109
  .top-\[9px\] {
114
110
  top: 9px;
115
111
  }
@@ -125,6 +121,9 @@
125
121
  .right-1\.5 {
126
122
  right: calc(var(--spacing) * 1.5);
127
123
  }
124
+ .right-3 {
125
+ right: calc(var(--spacing) * 3);
126
+ }
128
127
  .right-\[9px\] {
129
128
  right: 9px;
130
129
  }
@@ -140,6 +139,9 @@
140
139
  .left-1\/2 {
141
140
  left: calc(1 / 2 * 100%);
142
141
  }
142
+ .left-5 {
143
+ left: calc(var(--spacing) * 5);
144
+ }
143
145
  .z-10 {
144
146
  z-index: 10;
145
147
  }
@@ -152,6 +154,12 @@
152
154
  .z-2147483647 {
153
155
  z-index: 2147483647;
154
156
  }
157
+ .z-\[1\] {
158
+ z-index: 1;
159
+ }
160
+ .z-\[2\] {
161
+ z-index: 2;
162
+ }
155
163
  .z-\[2147483646\] {
156
164
  z-index: 2147483646;
157
165
  }
@@ -212,6 +220,9 @@
212
220
  .flex {
213
221
  display: flex;
214
222
  }
223
+ .grid {
224
+ display: grid;
225
+ }
215
226
  .hidden {
216
227
  display: none;
217
228
  }
@@ -225,6 +236,21 @@
225
236
  width: calc(var(--spacing) * 4);
226
237
  height: calc(var(--spacing) * 4);
227
238
  }
239
+ .size-5 {
240
+ width: calc(var(--spacing) * 5);
241
+ height: calc(var(--spacing) * 5);
242
+ }
243
+ .size-7 {
244
+ width: calc(var(--spacing) * 7);
245
+ height: calc(var(--spacing) * 7);
246
+ }
247
+ .size-8 {
248
+ width: calc(var(--spacing) * 8);
249
+ height: calc(var(--spacing) * 8);
250
+ }
251
+ .\!h-full {
252
+ height: 100% !important;
253
+ }
228
254
  .h-6 {
229
255
  height: calc(var(--spacing) * 6);
230
256
  }
@@ -240,8 +266,11 @@
240
266
  .h-10 {
241
267
  height: calc(var(--spacing) * 10);
242
268
  }
243
- .h-20 {
244
- height: calc(var(--spacing) * 20);
269
+ .h-\[3px\] {
270
+ height: 3px;
271
+ }
272
+ .h-\[36px\] {
273
+ height: 36px;
245
274
  }
246
275
  .h-\[70px\] {
247
276
  height: 70px;
@@ -279,6 +308,9 @@
279
308
  .min-h-screen {
280
309
  min-height: 100vh;
281
310
  }
311
+ .\!w-full {
312
+ width: 100% !important;
313
+ }
282
314
  .w-2 {
283
315
  width: calc(var(--spacing) * 2);
284
316
  }
@@ -297,6 +329,12 @@
297
329
  .w-14 {
298
330
  width: calc(var(--spacing) * 14);
299
331
  }
332
+ .w-\[3px\] {
333
+ width: 3px;
334
+ }
335
+ .w-\[200px\] {
336
+ width: 200px;
337
+ }
300
338
  .w-\[var\(--radix-popover-trigger-width\)\] {
301
339
  width: var(--radix-popover-trigger-width);
302
340
  }
@@ -310,18 +348,12 @@
310
348
  .w-px {
311
349
  width: 1px;
312
350
  }
313
- .max-w-\[483px\] {
314
- max-width: 483px;
351
+ .max-w-\[448px\] {
352
+ max-width: 448px;
315
353
  }
316
354
  .max-w-\[1280px\] {
317
355
  max-width: 1280px;
318
356
  }
319
- .max-w-\[calc\(100\%-16px\)\] {
320
- max-width: calc(100% - 16px);
321
- }
322
- .max-w-\[calc\(100vw-16px\)\] {
323
- max-width: calc(100vw - 16px);
324
- }
325
357
  .max-w-xs {
326
358
  max-width: var(--container-xs);
327
359
  }
@@ -361,6 +393,10 @@
361
393
  --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
362
394
  translate: var(--tw-translate-x) var(--tw-translate-y);
363
395
  }
396
+ .translate-y-1\/2 {
397
+ --tw-translate-y: calc(1 / 2 * 100%);
398
+ translate: var(--tw-translate-x) var(--tw-translate-y);
399
+ }
364
400
  .transform {
365
401
  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
366
402
  }
@@ -447,6 +483,9 @@
447
483
  .overflow-hidden {
448
484
  overflow: hidden;
449
485
  }
486
+ .overflow-visible {
487
+ overflow: visible;
488
+ }
450
489
  .overflow-x-auto {
451
490
  overflow-x: auto;
452
491
  }
@@ -535,6 +574,12 @@
535
574
  .bg-background {
536
575
  background-color: var(--color-background);
537
576
  }
577
+ .bg-background\/90 {
578
+ background-color: var(--color-background);
579
+ @supports (color: color-mix(in lab, red, red)) {
580
+ background-color: color-mix(in oklab, var(--color-background) 90%, transparent);
581
+ }
582
+ }
538
583
  .bg-black\/20 {
539
584
  background-color: color-mix(in srgb, #000 20%, transparent);
540
585
  @supports (color: color-mix(in lab, red, red)) {
@@ -562,6 +607,12 @@
562
607
  .bg-muted {
563
608
  background-color: var(--color-muted);
564
609
  }
610
+ .bg-muted\/40 {
611
+ background-color: var(--color-muted);
612
+ @supports (color: color-mix(in lab, red, red)) {
613
+ background-color: color-mix(in oklab, var(--color-muted) 40%, transparent);
614
+ }
615
+ }
565
616
  .bg-popover {
566
617
  background-color: var(--color-popover);
567
618
  }
@@ -577,6 +628,10 @@
577
628
  .bg-white {
578
629
  background-color: var(--color-white);
579
630
  }
631
+ .object-cover {
632
+ -o-object-fit: cover;
633
+ object-fit: cover;
634
+ }
580
635
  .p-0 {
581
636
  padding: calc(var(--spacing) * 0);
582
637
  }
@@ -613,6 +668,9 @@
613
668
  .px-3 {
614
669
  padding-inline: calc(var(--spacing) * 3);
615
670
  }
671
+ .px-4 {
672
+ padding-inline: calc(var(--spacing) * 4);
673
+ }
616
674
  .px-5 {
617
675
  padding-inline: calc(var(--spacing) * 5);
618
676
  }
@@ -637,6 +695,9 @@
637
695
  .py-2 {
638
696
  padding-block: calc(var(--spacing) * 2);
639
697
  }
698
+ .py-3 {
699
+ padding-block: calc(var(--spacing) * 3);
700
+ }
640
701
  .py-4 {
641
702
  padding-block: calc(var(--spacing) * 4);
642
703
  }
@@ -694,11 +755,6 @@
694
755
  .font-sans {
695
756
  font-family: var(--font-sans);
696
757
  }
697
- .text-4xl {
698
- font-size: var(--text-4xl);
699
- line-height: var(--tw-leading, var(--text-4xl--line-height));
700
- letter-spacing: var(--tw-tracking, var(--text-4xl--letter-spacing));
701
- }
702
758
  .text-base {
703
759
  font-size: var(--text-base);
704
760
  line-height: var(--tw-leading, var(--text-base--line-height));
@@ -728,6 +784,10 @@
728
784
  font-size: var(--text-body);
729
785
  line-height: var(--tw-leading, var(--text-body--line-height));
730
786
  }
787
+ .leading-4 {
788
+ --tw-leading: calc(var(--spacing) * 4);
789
+ line-height: calc(var(--spacing) * 4);
790
+ }
731
791
  .leading-5 {
732
792
  --tw-leading: calc(var(--spacing) * 5);
733
793
  line-height: calc(var(--spacing) * 5);
@@ -752,6 +812,10 @@
752
812
  --tw-font-weight: var(--font-weight-medium);
753
813
  font-weight: var(--font-weight-medium);
754
814
  }
815
+ .font-medium\! {
816
+ --tw-font-weight: var(--font-weight-medium) !important;
817
+ font-weight: var(--font-weight-medium) !important;
818
+ }
755
819
  .font-normal {
756
820
  --tw-font-weight: var(--font-weight-normal);
757
821
  font-weight: var(--font-weight-normal);
@@ -760,6 +824,10 @@
760
824
  --tw-font-weight: var(--font-weight-semibold);
761
825
  font-weight: var(--font-weight-semibold);
762
826
  }
827
+ .tracking-\[0\.18px\] {
828
+ --tw-tracking: 0.18px;
829
+ letter-spacing: 0.18px;
830
+ }
763
831
  .tracking-display-tight {
764
832
  --tw-tracking: var(--tracking-display-tight);
765
833
  letter-spacing: var(--tracking-display-tight);
@@ -798,6 +866,9 @@
798
866
  .text-foreground {
799
867
  color: var(--color-foreground);
800
868
  }
869
+ .text-foreground\! {
870
+ color: var(--color-foreground) !important;
871
+ }
801
872
  .text-muted-foreground {
802
873
  color: var(--color-muted-foreground);
803
874
  }
@@ -813,6 +884,9 @@
813
884
  .text-stone-500 {
814
885
  color: var(--color-stone-500);
815
886
  }
887
+ .text-white {
888
+ color: var(--color-white);
889
+ }
816
890
  .italic {
817
891
  font-style: italic;
818
892
  }
@@ -822,9 +896,18 @@
822
896
  .caret-foreground {
823
897
  caret-color: var(--color-foreground);
824
898
  }
899
+ .opacity-0 {
900
+ opacity: 0%;
901
+ }
902
+ .opacity-40 {
903
+ opacity: 40%;
904
+ }
825
905
  .opacity-50 {
826
906
  opacity: 50%;
827
907
  }
908
+ .opacity-70 {
909
+ opacity: 70%;
910
+ }
828
911
  .opacity-80 {
829
912
  opacity: 80%;
830
913
  }
@@ -871,6 +954,10 @@
871
954
  --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
872
955
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
873
956
  }
957
+ .ring {
958
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
959
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
960
+ }
874
961
  .ring-0 {
875
962
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
876
963
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -882,6 +969,11 @@
882
969
  .filter {
883
970
  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
884
971
  }
972
+ .transition-\[background-color\] {
973
+ transition-property: background-color;
974
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
975
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
976
+ }
885
977
  .transition-\[border-color\,box-shadow\] {
886
978
  transition-property: border-color,box-shadow;
887
979
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -902,6 +994,15 @@
902
994
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
903
995
  transition-duration: var(--tw-duration, var(--default-transition-duration));
904
996
  }
997
+ .transition-opacity {
998
+ transition-property: opacity;
999
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1000
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
1001
+ }
1002
+ .duration-150 {
1003
+ --tw-duration: 150ms;
1004
+ transition-duration: 150ms;
1005
+ }
905
1006
  .duration-200 {
906
1007
  --tw-duration: 200ms;
907
1008
  transition-duration: 200ms;
@@ -1178,6 +1279,11 @@
1178
1279
  }
1179
1280
  }
1180
1281
  }
1282
+ .active\:cursor-grabbing {
1283
+ &:active {
1284
+ cursor: grabbing;
1285
+ }
1286
+ }
1181
1287
  .enabled\:hover\:border {
1182
1288
  &:enabled {
1183
1289
  &:hover {
@@ -1388,18 +1494,6 @@
1388
1494
  padding-block: calc(var(--spacing) * 20);
1389
1495
  }
1390
1496
  }
1391
- .sm\:text-5xl {
1392
- @media (width >= 40rem) {
1393
- font-size: var(--text-5xl);
1394
- line-height: var(--tw-leading, var(--text-5xl--line-height));
1395
- letter-spacing: var(--tw-tracking, var(--text-5xl--letter-spacing));
1396
- }
1397
- }
1398
- .md\:w-md {
1399
- @media (width >= 48rem) {
1400
- width: var(--container-md);
1401
- }
1402
- }
1403
1497
  .\[\&_svg\]\:pointer-events-none {
1404
1498
  & svg {
1405
1499
  pointer-events: none;
@@ -1572,6 +1666,47 @@
1572
1666
  border-color: var(--ohw-border) !important;
1573
1667
  color: var(--ohw-foreground) !important;
1574
1668
  }
1669
+ [data-ohw-section-picker] {
1670
+ --ohw-background: #ffffff;
1671
+ --ohw-foreground: #0c0a09;
1672
+ --ohw-primary: #0885fe;
1673
+ --ohw-primary-foreground: #fafaf9;
1674
+ --ohw-muted: #f5f5f4;
1675
+ --ohw-muted-foreground: #78716c;
1676
+ --ohw-border: #e7e5e4;
1677
+ --ohw-popover-foreground: #0c0a09;
1678
+ --color-muted-foreground: var(--ohw-muted-foreground);
1679
+ --font-sans: Figtree, ui-sans-serif, system-ui, sans-serif;
1680
+ font-family: var(--font-sans);
1681
+ }
1682
+ html[data-ohw-section-picking] [data-ohw-hovered],
1683
+ html[data-ohw-section-picking] [data-ohw-state-hovered] {
1684
+ outline: none !important;
1685
+ box-shadow: none !important;
1686
+ }
1687
+ html[data-ohw-section-picking] [data-ohw-item-interaction],
1688
+ html[data-ohw-section-picking] [data-ohw-section-insert-line],
1689
+ html[data-ohw-section-picking] [data-ohw-navbar-container-chrome],
1690
+ html[data-ohw-section-picking] [data-ohw-edit-chrome],
1691
+ html[data-ohw-section-picking] [data-ohw-toolbar],
1692
+ html[data-ohw-section-picking] [data-ohw-max-badge],
1693
+ html[data-ohw-section-picking] [data-ohw-state-toggle] {
1694
+ display: none !important;
1695
+ pointer-events: none !important;
1696
+ }
1697
+ .ov-gap-line {
1698
+ background-color: var(--ohw-primary, #0885fe);
1699
+ border-radius: 2px;
1700
+ box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5);
1701
+ }
1702
+ [data-ohw-navbar-container-chrome] {
1703
+ --ohw-primary: #0885fe;
1704
+ --ohw-background: #ffffff;
1705
+ --ohw-foreground: #0c0a09;
1706
+ --ohw-border: #e7e5e4;
1707
+ --font-sans: Figtree, ui-sans-serif, system-ui, sans-serif;
1708
+ font-family: var(--font-sans);
1709
+ }
1575
1710
  [data-ohw-bridge-root].dark {
1576
1711
  --ohw-background: #020617;
1577
1712
  --ohw-foreground: #f8fafc;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ohhwells/bridge",
3
- "version": "0.1.38",
3
+ "version": "0.1.39-next.72",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",