@ohhwells/bridge 0.1.36-next.49 → 0.1.36-next.51

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
@@ -4,6 +4,7 @@
4
4
  :root, :host {
5
5
  --font-sans: Figtree, sans-serif;
6
6
  --color-red-500: oklch(63.7% 0.237 25.331);
7
+ --color-gray-300: oklch(87.2% 0.01 258.338);
7
8
  --color-stone-200: oklch(92.3% 0.003 48.717);
8
9
  --color-stone-500: #78716C;
9
10
  --color-stone-950: #0C0A09;
@@ -32,6 +33,8 @@
32
33
  --radius-md: 6px;
33
34
  --radius-lg: 0.5rem;
34
35
  --radius-xl: 0.75rem;
36
+ --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
37
+ --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
35
38
  --default-transition-duration: 150ms;
36
39
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
37
40
  --font-display: 'Instrument Serif', 'Times New Roman', serif;
@@ -61,6 +64,7 @@
61
64
  --text-xs--letter-spacing: 0em;
62
65
  --text-body: 18px;
63
66
  --text-body--line-height: 1.5;
67
+ --radius-none: 0px;
64
68
  --tracking-display-tight: -0.030em;
65
69
  }
66
70
  }
@@ -100,6 +104,9 @@
100
104
  .top-2\.5 {
101
105
  top: calc(var(--spacing) * 2.5);
102
106
  }
107
+ .top-3 {
108
+ top: calc(var(--spacing) * 3);
109
+ }
103
110
  .top-\[9px\] {
104
111
  top: 9px;
105
112
  }
@@ -115,6 +122,9 @@
115
122
  .right-1\.5 {
116
123
  right: calc(var(--spacing) * 1.5);
117
124
  }
125
+ .right-3 {
126
+ right: calc(var(--spacing) * 3);
127
+ }
118
128
  .right-\[9px\] {
119
129
  right: 9px;
120
130
  }
@@ -130,6 +140,9 @@
130
140
  .left-1\/2 {
131
141
  left: calc(1 / 2 * 100%);
132
142
  }
143
+ .left-5 {
144
+ left: calc(var(--spacing) * 5);
145
+ }
133
146
  .z-10 {
134
147
  z-index: 10;
135
148
  }
@@ -142,6 +155,12 @@
142
155
  .z-2147483647 {
143
156
  z-index: 2147483647;
144
157
  }
158
+ .z-\[1\] {
159
+ z-index: 1;
160
+ }
161
+ .z-\[2\] {
162
+ z-index: 2;
163
+ }
145
164
  .z-\[2147483646\] {
146
165
  z-index: 2147483646;
147
166
  }
@@ -202,6 +221,9 @@
202
221
  .flex {
203
222
  display: flex;
204
223
  }
224
+ .grid {
225
+ display: grid;
226
+ }
205
227
  .hidden {
206
228
  display: none;
207
229
  }
@@ -215,6 +237,18 @@
215
237
  width: calc(var(--spacing) * 4);
216
238
  height: calc(var(--spacing) * 4);
217
239
  }
240
+ .size-5 {
241
+ width: calc(var(--spacing) * 5);
242
+ height: calc(var(--spacing) * 5);
243
+ }
244
+ .size-7 {
245
+ width: calc(var(--spacing) * 7);
246
+ height: calc(var(--spacing) * 7);
247
+ }
248
+ .size-8 {
249
+ width: calc(var(--spacing) * 8);
250
+ height: calc(var(--spacing) * 8);
251
+ }
218
252
  .h-6 {
219
253
  height: calc(var(--spacing) * 6);
220
254
  }
@@ -230,9 +264,6 @@
230
264
  .h-10 {
231
265
  height: calc(var(--spacing) * 10);
232
266
  }
233
- .h-20 {
234
- height: calc(var(--spacing) * 20);
235
- }
236
267
  .h-\[70px\] {
237
268
  height: 70px;
238
269
  }
@@ -351,9 +382,16 @@
351
382
  --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
352
383
  translate: var(--tw-translate-x) var(--tw-translate-y);
353
384
  }
385
+ .translate-y-1\/2 {
386
+ --tw-translate-y: calc(1 / 2 * 100%);
387
+ translate: var(--tw-translate-x) var(--tw-translate-y);
388
+ }
354
389
  .transform {
355
390
  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
356
391
  }
392
+ .animate-pulse {
393
+ animation: var(--animate-pulse);
394
+ }
357
395
  .cursor-default {
358
396
  cursor: default;
359
397
  }
@@ -434,6 +472,9 @@
434
472
  .overflow-hidden {
435
473
  overflow: hidden;
436
474
  }
475
+ .overflow-visible {
476
+ overflow: visible;
477
+ }
437
478
  .overflow-x-auto {
438
479
  overflow-x: auto;
439
480
  }
@@ -452,6 +493,9 @@
452
493
  .rounded-md {
453
494
  border-radius: var(--radius-md);
454
495
  }
496
+ .rounded-none {
497
+ border-radius: var(--radius-none);
498
+ }
455
499
  .rounded-sm {
456
500
  border-radius: var(--radius-sm);
457
501
  }
@@ -519,6 +563,12 @@
519
563
  .bg-background {
520
564
  background-color: var(--color-background);
521
565
  }
566
+ .bg-background\/90 {
567
+ background-color: var(--color-background);
568
+ @supports (color: color-mix(in lab, red, red)) {
569
+ background-color: color-mix(in oklab, var(--color-background) 90%, transparent);
570
+ }
571
+ }
522
572
  .bg-black\/20 {
523
573
  background-color: color-mix(in srgb, #000 20%, transparent);
524
574
  @supports (color: color-mix(in lab, red, red)) {
@@ -540,9 +590,18 @@
540
590
  .bg-foreground {
541
591
  background-color: var(--color-foreground);
542
592
  }
593
+ .bg-gray-300 {
594
+ background-color: var(--color-gray-300);
595
+ }
543
596
  .bg-muted {
544
597
  background-color: var(--color-muted);
545
598
  }
599
+ .bg-muted\/40 {
600
+ background-color: var(--color-muted);
601
+ @supports (color: color-mix(in lab, red, red)) {
602
+ background-color: color-mix(in oklab, var(--color-muted) 40%, transparent);
603
+ }
604
+ }
546
605
  .bg-popover {
547
606
  background-color: var(--color-popover);
548
607
  }
@@ -594,6 +653,9 @@
594
653
  .px-3 {
595
654
  padding-inline: calc(var(--spacing) * 3);
596
655
  }
656
+ .px-4 {
657
+ padding-inline: calc(var(--spacing) * 4);
658
+ }
597
659
  .px-5 {
598
660
  padding-inline: calc(var(--spacing) * 5);
599
661
  }
@@ -618,6 +680,9 @@
618
680
  .py-2 {
619
681
  padding-block: calc(var(--spacing) * 2);
620
682
  }
683
+ .py-3 {
684
+ padding-block: calc(var(--spacing) * 3);
685
+ }
621
686
  .py-4 {
622
687
  padding-block: calc(var(--spacing) * 4);
623
688
  }
@@ -704,6 +769,10 @@
704
769
  font-size: var(--text-body);
705
770
  line-height: var(--tw-leading, var(--text-body--line-height));
706
771
  }
772
+ .leading-4 {
773
+ --tw-leading: calc(var(--spacing) * 4);
774
+ line-height: calc(var(--spacing) * 4);
775
+ }
707
776
  .leading-5 {
708
777
  --tw-leading: calc(var(--spacing) * 5);
709
778
  line-height: calc(var(--spacing) * 5);
@@ -728,6 +797,10 @@
728
797
  --tw-font-weight: var(--font-weight-medium);
729
798
  font-weight: var(--font-weight-medium);
730
799
  }
800
+ .font-medium\! {
801
+ --tw-font-weight: var(--font-weight-medium) !important;
802
+ font-weight: var(--font-weight-medium) !important;
803
+ }
731
804
  .font-normal {
732
805
  --tw-font-weight: var(--font-weight-normal);
733
806
  font-weight: var(--font-weight-normal);
@@ -736,6 +809,10 @@
736
809
  --tw-font-weight: var(--font-weight-semibold);
737
810
  font-weight: var(--font-weight-semibold);
738
811
  }
812
+ .tracking-\[0\.18px\] {
813
+ --tw-tracking: 0.18px;
814
+ letter-spacing: 0.18px;
815
+ }
739
816
  .tracking-display-tight {
740
817
  --tw-tracking: var(--tracking-display-tight);
741
818
  letter-spacing: var(--tracking-display-tight);
@@ -774,6 +851,9 @@
774
851
  .text-foreground {
775
852
  color: var(--color-foreground);
776
853
  }
854
+ .text-foreground\! {
855
+ color: var(--color-foreground) !important;
856
+ }
777
857
  .text-muted-foreground {
778
858
  color: var(--color-muted-foreground);
779
859
  }
@@ -789,6 +869,9 @@
789
869
  .text-stone-500 {
790
870
  color: var(--color-stone-500);
791
871
  }
872
+ .text-white {
873
+ color: var(--color-white);
874
+ }
792
875
  .italic {
793
876
  font-style: italic;
794
877
  }
@@ -858,6 +941,11 @@
858
941
  .filter {
859
942
  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,);
860
943
  }
944
+ .transition-\[background-color\] {
945
+ transition-property: background-color;
946
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
947
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
948
+ }
861
949
  .transition-\[border-color\,box-shadow\] {
862
950
  transition-property: border-color,box-shadow;
863
951
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -878,10 +966,23 @@
878
966
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
879
967
  transition-duration: var(--tw-duration, var(--default-transition-duration));
880
968
  }
969
+ .transition-opacity {
970
+ transition-property: opacity;
971
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
972
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
973
+ }
974
+ .duration-150 {
975
+ --tw-duration: 150ms;
976
+ transition-duration: 150ms;
977
+ }
881
978
  .duration-200 {
882
979
  --tw-duration: 200ms;
883
980
  transition-duration: 200ms;
884
981
  }
982
+ .ease-out {
983
+ --tw-ease: var(--ease-out);
984
+ transition-timing-function: var(--ease-out);
985
+ }
885
986
  .outline-none {
886
987
  --tw-outline-style: none;
887
988
  outline-style: none;
@@ -1002,6 +1103,13 @@
1002
1103
  }
1003
1104
  }
1004
1105
  }
1106
+ .hover\:bg-background {
1107
+ &:hover {
1108
+ @media (hover: hover) {
1109
+ background-color: var(--color-background);
1110
+ }
1111
+ }
1112
+ }
1005
1113
  .hover\:bg-destructive\/80 {
1006
1114
  &:hover {
1007
1115
  @media (hover: hover) {
@@ -1530,6 +1638,41 @@
1530
1638
  border-color: var(--ohw-border) !important;
1531
1639
  color: var(--ohw-foreground) !important;
1532
1640
  }
1641
+ [data-ohw-section-picker] {
1642
+ --ohw-background: #ffffff;
1643
+ --ohw-foreground: #0c0a09;
1644
+ --ohw-primary: #0885fe;
1645
+ --ohw-primary-foreground: #fafaf9;
1646
+ --ohw-muted: #f5f5f4;
1647
+ --ohw-muted-foreground: #78716c;
1648
+ --ohw-border: #e7e5e4;
1649
+ --ohw-popover-foreground: #0c0a09;
1650
+ --color-muted-foreground: var(--ohw-muted-foreground);
1651
+ --font-sans: Figtree, ui-sans-serif, system-ui, sans-serif;
1652
+ font-family: var(--font-sans);
1653
+ }
1654
+ html[data-ohw-section-picking] [data-ohw-hovered] {
1655
+ outline: none !important;
1656
+ box-shadow: none !important;
1657
+ }
1658
+ html[data-ohw-section-picking] [data-ohw-item-interaction],
1659
+ html[data-ohw-section-picking] [data-ohw-section-insert-line],
1660
+ html[data-ohw-section-picking] [data-ohw-navbar-container-chrome],
1661
+ html[data-ohw-section-picking] [data-ohw-edit-chrome],
1662
+ html[data-ohw-section-picking] [data-ohw-toolbar],
1663
+ html[data-ohw-section-picking] [data-ohw-max-badge],
1664
+ html[data-ohw-section-picking] [data-ohw-state-toggle] {
1665
+ display: none !important;
1666
+ pointer-events: none !important;
1667
+ }
1668
+ [data-ohw-navbar-container-chrome] {
1669
+ --ohw-primary: #0885fe;
1670
+ --ohw-background: #ffffff;
1671
+ --ohw-foreground: #0c0a09;
1672
+ --ohw-border: #e7e5e4;
1673
+ --font-sans: Figtree, ui-sans-serif, system-ui, sans-serif;
1674
+ font-family: var(--font-sans);
1675
+ }
1533
1676
  [data-ohw-bridge-root].dark {
1534
1677
  --ohw-background: #020617;
1535
1678
  --ohw-foreground: #f8fafc;
@@ -1759,11 +1902,20 @@
1759
1902
  syntax: "*";
1760
1903
  inherits: false;
1761
1904
  }
1905
+ @property --tw-ease {
1906
+ syntax: "*";
1907
+ inherits: false;
1908
+ }
1762
1909
  @property --tw-content {
1763
1910
  syntax: "*";
1764
1911
  initial-value: "";
1765
1912
  inherits: false;
1766
1913
  }
1914
+ @keyframes pulse {
1915
+ 50% {
1916
+ opacity: 0.5;
1917
+ }
1918
+ }
1767
1919
  @layer properties {
1768
1920
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
1769
1921
  *, ::before, ::after, ::backdrop {
@@ -1808,6 +1960,7 @@
1808
1960
  --tw-drop-shadow-alpha: 100%;
1809
1961
  --tw-drop-shadow-size: initial;
1810
1962
  --tw-duration: initial;
1963
+ --tw-ease: initial;
1811
1964
  --tw-content: "";
1812
1965
  }
1813
1966
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ohhwells/bridge",
3
- "version": "0.1.36-next.49",
3
+ "version": "0.1.36-next.51",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",