@ohhwells/bridge 0.1.32 → 0.1.33-next.38

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,9 @@
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-stone-200: oklch(92.3% 0.003 48.717);
8
+ --color-stone-500: #78716C;
9
+ --color-stone-950: #0C0A09;
7
10
  --color-black: #000;
8
11
  --color-white: #fff;
9
12
  --spacing: 0.25rem;
@@ -18,10 +21,6 @@
18
21
  --text-lg--line-height: 28px;
19
22
  --text-xl: 20px;
20
23
  --text-xl--line-height: 28px;
21
- --text-4xl: 36px;
22
- --text-4xl--line-height: 40px;
23
- --text-5xl: 48px;
24
- --text-5xl--line-height: 1;
25
24
  --font-weight-normal: 400;
26
25
  --font-weight-medium: 500;
27
26
  --font-weight-semibold: 600;
@@ -38,6 +37,7 @@
38
37
  --font-body: 'Red Hat Display', system-ui, sans-serif;
39
38
  --color-primary: var(--ohw-primary, #0885FE);
40
39
  --color-primary-foreground: var(--ohw-primary-foreground, #FAFAF9);
40
+ --color-primary-50: var(--ohw-primary-50, #EFF6FF);
41
41
  --color-background: var(--ohw-background, #ffffff);
42
42
  --color-foreground: var(--ohw-foreground, #020617);
43
43
  --color-card-foreground: var(--ohw-card-foreground, #020617);
@@ -53,8 +53,6 @@
53
53
  --color-border: var(--ohw-border, #e2e8f0);
54
54
  --color-input: var(--ohw-input, #e2e8f0);
55
55
  --color-ring: var(--ohw-ring, #64748b);
56
- --text-5xl--letter-spacing: -0.025em;
57
- --text-4xl--letter-spacing: -0.025em;
58
56
  --text-xl--letter-spacing: -0.025em;
59
57
  --text-lg--letter-spacing: 0em;
60
58
  --text-base--letter-spacing: 0em;
@@ -200,6 +198,10 @@
200
198
  .inline-flex {
201
199
  display: inline-flex;
202
200
  }
201
+ .size-4 {
202
+ width: calc(var(--spacing) * 4);
203
+ height: calc(var(--spacing) * 4);
204
+ }
203
205
  .h-7 {
204
206
  height: calc(var(--spacing) * 7);
205
207
  }
@@ -236,6 +238,9 @@
236
238
  .max-h-48 {
237
239
  max-height: calc(var(--spacing) * 48);
238
240
  }
241
+ .max-h-\[30px\] {
242
+ max-height: 30px;
243
+ }
239
244
  .max-h-\[calc\(100\%-32px\)\] {
240
245
  max-height: calc(100% - 32px);
241
246
  }
@@ -251,6 +256,9 @@
251
256
  .w-2 {
252
257
  width: calc(var(--spacing) * 2);
253
258
  }
259
+ .w-4 {
260
+ width: calc(var(--spacing) * 4);
261
+ }
254
262
  .w-7 {
255
263
  width: calc(var(--spacing) * 7);
256
264
  }
@@ -323,6 +331,9 @@
323
331
  .cursor-default {
324
332
  cursor: default;
325
333
  }
334
+ .cursor-grab {
335
+ cursor: grab;
336
+ }
326
337
  .cursor-pointer {
327
338
  cursor: pointer;
328
339
  }
@@ -629,11 +640,6 @@
629
640
  .font-sans {
630
641
  font-family: var(--font-sans);
631
642
  }
632
- .text-4xl {
633
- font-size: var(--text-4xl);
634
- line-height: var(--tw-leading, var(--text-4xl--line-height));
635
- letter-spacing: var(--tw-tracking, var(--text-4xl--letter-spacing));
636
- }
637
643
  .text-base {
638
644
  font-size: var(--text-base);
639
645
  line-height: var(--tw-leading, var(--text-base--line-height));
@@ -742,6 +748,9 @@
742
748
  .text-secondary-foreground {
743
749
  color: var(--color-secondary-foreground);
744
750
  }
751
+ .text-stone-500 {
752
+ color: var(--color-stone-500);
753
+ }
745
754
  .italic {
746
755
  font-style: italic;
747
756
  }
@@ -772,6 +781,10 @@
772
781
  --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));
773
782
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
774
783
  }
784
+ .shadow-md {
785
+ --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
786
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
787
+ }
775
788
  .shadow-none {
776
789
  --tw-shadow: 0 0 #0000;
777
790
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -813,11 +826,20 @@
813
826
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
814
827
  transition-duration: var(--tw-duration, var(--default-transition-duration));
815
828
  }
829
+ .transition-all {
830
+ transition-property: all;
831
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
832
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
833
+ }
816
834
  .transition-colors {
817
835
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
818
836
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
819
837
  transition-duration: var(--tw-duration, var(--default-transition-duration));
820
838
  }
839
+ .duration-200 {
840
+ --tw-duration: 200ms;
841
+ transition-duration: 200ms;
842
+ }
821
843
  .outline-none {
822
844
  --tw-outline-style: none;
823
845
  outline-style: none;
@@ -978,6 +1000,78 @@
978
1000
  }
979
1001
  }
980
1002
  }
1003
+ .enabled\:hover\:border {
1004
+ &:enabled {
1005
+ &:hover {
1006
+ @media (hover: hover) {
1007
+ border-style: var(--tw-border-style);
1008
+ border-width: 1px;
1009
+ }
1010
+ }
1011
+ }
1012
+ }
1013
+ .enabled\:hover\:border-stone-200 {
1014
+ &:enabled {
1015
+ &:hover {
1016
+ @media (hover: hover) {
1017
+ border-color: var(--color-stone-200);
1018
+ }
1019
+ }
1020
+ }
1021
+ }
1022
+ .enabled\:hover\:text-stone-950 {
1023
+ &:enabled {
1024
+ &:hover {
1025
+ @media (hover: hover) {
1026
+ color: var(--color-stone-950);
1027
+ }
1028
+ }
1029
+ }
1030
+ }
1031
+ .enabled\:active\:cursor-grabbing {
1032
+ &:enabled {
1033
+ &:active {
1034
+ cursor: grabbing;
1035
+ }
1036
+ }
1037
+ }
1038
+ .enabled\:active\:border {
1039
+ &:enabled {
1040
+ &:active {
1041
+ border-style: var(--tw-border-style);
1042
+ border-width: 1px;
1043
+ }
1044
+ }
1045
+ }
1046
+ .enabled\:active\:border-primary {
1047
+ &:enabled {
1048
+ &:active {
1049
+ border-color: var(--color-primary);
1050
+ }
1051
+ }
1052
+ }
1053
+ .enabled\:active\:bg-primary-50 {
1054
+ &:enabled {
1055
+ &:active {
1056
+ background-color: var(--color-primary-50);
1057
+ }
1058
+ }
1059
+ }
1060
+ .enabled\:active\:text-stone-950 {
1061
+ &:enabled {
1062
+ &:active {
1063
+ color: var(--color-stone-950);
1064
+ }
1065
+ }
1066
+ }
1067
+ .enabled\:active\:shadow {
1068
+ &:enabled {
1069
+ &:active {
1070
+ --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));
1071
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1072
+ }
1073
+ }
1074
+ }
981
1075
  .disabled\:pointer-events-none {
982
1076
  &:disabled {
983
1077
  pointer-events: none;
@@ -988,6 +1082,16 @@
988
1082
  cursor: not-allowed;
989
1083
  }
990
1084
  }
1085
+ .disabled\:text-stone-950 {
1086
+ &:disabled {
1087
+ color: var(--color-stone-950);
1088
+ }
1089
+ }
1090
+ .disabled\:opacity-40 {
1091
+ &:disabled {
1092
+ opacity: 40%;
1093
+ }
1094
+ }
991
1095
  .disabled\:opacity-50 {
992
1096
  &:disabled {
993
1097
  opacity: 50%;
@@ -1096,13 +1200,6 @@
1096
1200
  padding-block: calc(var(--spacing) * 20);
1097
1201
  }
1098
1202
  }
1099
- .sm\:text-5xl {
1100
- @media (width >= 40rem) {
1101
- font-size: var(--text-5xl);
1102
- line-height: var(--tw-leading, var(--text-5xl--line-height));
1103
- letter-spacing: var(--tw-tracking, var(--text-5xl--letter-spacing));
1104
- }
1105
- }
1106
1203
  .md\:w-md {
1107
1204
  @media (width >= 48rem) {
1108
1205
  width: var(--container-md);
@@ -1127,8 +1224,10 @@
1127
1224
  [data-ohw-bridge-root] {
1128
1225
  --color-primary: var(--ohw-primary, #0885FE);
1129
1226
  --color-primary-foreground: var(--ohw-primary-foreground, #FAFAF9);
1227
+ --color-primary-50: var(--ohw-primary-50, #EFF6FF);
1130
1228
  --ohw-primary: #0885FE;
1131
1229
  --ohw-primary-foreground: #FAFAF9;
1230
+ --ohw-primary-50: #EFF6FF;
1132
1231
  --ohw-background: #ffffff;
1133
1232
  --ohw-foreground: #020617;
1134
1233
  --ohw-card: #ffffff;
@@ -1287,6 +1386,7 @@
1287
1386
  --ohw-popover-foreground: #f8fafc;
1288
1387
  --ohw-primary: #f8fafc;
1289
1388
  --ohw-primary-foreground: #0f172a;
1389
+ --ohw-primary-50: #1e3a5f;
1290
1390
  --ohw-hover-primary: #f1f5f9;
1291
1391
  --ohw-secondary: #1e293b;
1292
1392
  --ohw-secondary-foreground: #f8fafc;
@@ -1502,6 +1602,10 @@
1502
1602
  syntax: "*";
1503
1603
  inherits: false;
1504
1604
  }
1605
+ @property --tw-duration {
1606
+ syntax: "*";
1607
+ inherits: false;
1608
+ }
1505
1609
  @layer properties {
1506
1610
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
1507
1611
  *, ::before, ::after, ::backdrop {
@@ -1545,6 +1649,7 @@
1545
1649
  --tw-drop-shadow-color: initial;
1546
1650
  --tw-drop-shadow-alpha: 100%;
1547
1651
  --tw-drop-shadow-size: initial;
1652
+ --tw-duration: initial;
1548
1653
  }
1549
1654
  }
1550
1655
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ohhwells/bridge",
3
- "version": "0.1.32",
3
+ "version": "0.1.33-next.38",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",
@@ -28,6 +28,7 @@
28
28
  },
29
29
  "dependencies": {
30
30
  "@radix-ui/react-slot": "^1.3.0",
31
+ "lucide-react": "^1.23.0",
31
32
  "radix-ui": "^1.4.3"
32
33
  },
33
34
  "devDependencies": {