@texturehq/edges 1.31.0 → 1.32.0

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
@@ -88,11 +88,79 @@
88
88
  --radius-lg: 0.5rem;
89
89
  --radius-xl: 0.75rem;
90
90
  --radius-full: 9999px;
91
+ --font-family-sans: Inter, system-ui, sans-serif;
92
+ --font-family-brand: 'TT Firs Neue', 'Helvetica Neue', Arial, system-ui, sans-serif;
93
+ --font-family-mono: 'Fira Code', monospace;
94
+ --font-size-xs: 0.75rem;
95
+ --font-size-sm: 0.875rem;
96
+ --font-size-base: 1rem;
97
+ --font-size-lg: 1.125rem;
98
+ --font-size-xl: 1.25rem;
99
+ --font-size-2xl: 1.5rem;
100
+ --font-size-3xl: 1.875rem;
101
+ --font-size-4xl: 2.25rem;
102
+ --font-size-5xl: 3rem;
103
+ --font-size-7xl: 4.5rem;
104
+ --font-size-8xl: 6rem;
105
+ --font-size-9xl: 8rem;
91
106
  --font-weight-light: 300;
92
107
  --font-weight-normal: 400;
93
108
  --font-weight-medium: 500;
94
109
  --font-weight-semibold: 600;
95
110
  --font-weight-bold: 700;
111
+ --font-lineheight-tight: 1.25;
112
+ --font-lineheight-normal: 1.5;
113
+ --font-letterspacing-normal: 0;
114
+ --font-letterspacing-widest: 0.1em;
115
+ --text-display-xl-size: 6rem;
116
+ --text-display-xl-line-height: 1;
117
+ --text-display-xl-weight: 500;
118
+ --text-display-lg-size: 4.5rem;
119
+ --text-display-lg-line-height: 1;
120
+ --text-display-lg-weight: 500;
121
+ --text-display-md-size: 3rem;
122
+ --text-display-md-line-height: 1.05;
123
+ --text-display-md-weight: 500;
124
+ --text-heading-xl-size: 2.25rem;
125
+ --text-heading-xl-line-height: 1.1;
126
+ --text-heading-xl-weight: 500;
127
+ --text-heading-lg-size: 1.875rem;
128
+ --text-heading-lg-line-height: 1.15;
129
+ --text-heading-lg-weight: 500;
130
+ --text-heading-md-size: 1.5rem;
131
+ --text-heading-md-line-height: 1.2;
132
+ --text-heading-md-weight: 600;
133
+ --text-heading-sm-size: 1.25rem;
134
+ --text-heading-sm-line-height: 1.25;
135
+ --text-heading-sm-weight: 600;
136
+ --text-body-lg-size: 1.125rem;
137
+ --text-body-lg-line-height: 1.55;
138
+ --text-body-lg-weight: 400;
139
+ --text-body-md-size: 1rem;
140
+ --text-body-md-line-height: 1.5;
141
+ --text-body-md-letter-spacing: 0;
142
+ --text-body-md-weight: 400;
143
+ --text-body-sm-size: 0.875rem;
144
+ --text-body-sm-line-height: 1.55;
145
+ --text-body-sm-weight: 400;
146
+ --text-label-lg-size: 1rem;
147
+ --text-label-lg-line-height: 1.4;
148
+ --text-label-lg-weight: 500;
149
+ --text-label-md-size: 0.875rem;
150
+ --text-label-md-line-height: 1.4;
151
+ --text-label-md-weight: 500;
152
+ --text-label-sm-size: 0.8125rem;
153
+ --text-label-sm-line-height: 1.4;
154
+ --text-label-sm-weight: 500;
155
+ --text-caption-size: 0.8125rem;
156
+ --text-caption-line-height: 1.4;
157
+ --text-caption-weight: 400;
158
+ --text-code-size: 0.875rem;
159
+ --text-code-line-height: 1.5;
160
+ --text-code-weight: 400;
161
+ --text-eyebrow-size: 0.6875rem;
162
+ --text-eyebrow-line-height: 1.4;
163
+ --text-eyebrow-weight: 600;
96
164
  --color-background-body: #ffffff;
97
165
  --color-background-surface: #ffffff;
98
166
  --color-background-muted: #f5f5f4;
@@ -187,6 +255,14 @@
187
255
  --color-state-exporting-data: #f9c869;
188
256
  --color-state-exporting-border: #f59e0b;
189
257
  --color-state-exporting-text: #92400e;
258
+ --color-brand-primary: var(--color-ink);
259
+ --color-brand-dark: var(--color-ink);
260
+ --color-brand-light: var(--color-linen);
261
+ --color-brand-background: var(--color-linen);
262
+ --color-neutral-black: var(--color-black);
263
+ --action-brand-background: var(--color-ink);
264
+ --action-brand-hover: var(--color-graphite);
265
+ --feedback-success-text: var(--color-success-dark);
190
266
  --control-sm: 0.75rem;
191
267
  --control-md: 0.875rem;
192
268
  --control-lg: 1rem;
@@ -492,6 +568,81 @@
492
568
  --font-letterspacing-wide: 0.025em;
493
569
  --font-letterspacing-wider: 0.05em;
494
570
  --font-letterspacing-widest: 0.1em;
571
+ --elevation-surface-default: #ffffff;
572
+ --elevation-surface-raised: #ffffff;
573
+ --elevation-surface-floating: #ffffff;
574
+ --elevation-surface-overlay: #ffffff;
575
+ --shadow-none: none;
576
+ --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.06);
577
+ --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
578
+ --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.10), 0 2px 4px rgba(0, 0, 0, 0.06);
579
+ --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12), 0 4px 8px rgba(0, 0, 0, 0.06);
580
+ --shadow-xl: 0 20px 48px rgba(0, 0, 0, 0.16), 0 8px 16px rgba(0, 0, 0, 0.08);
581
+ --shadow-overflow: 0 4px 12px rgba(0, 0, 0, 0.10);
582
+ --text-display-xl-size: 6rem;
583
+ --text-display-xl-line-height: 1;
584
+ --text-display-xl-letter-spacing: 0;
585
+ --text-display-xl-weight: 500;
586
+ --text-display-lg-size: 4.5rem;
587
+ --text-display-lg-line-height: 1;
588
+ --text-display-lg-letter-spacing: 0;
589
+ --text-display-lg-weight: 500;
590
+ --text-display-md-size: 3rem;
591
+ --text-display-md-line-height: 1.05;
592
+ --text-display-md-letter-spacing: 0;
593
+ --text-display-md-weight: 500;
594
+ --text-heading-xl-size: 2.25rem;
595
+ --text-heading-xl-line-height: 1.1;
596
+ --text-heading-xl-letter-spacing: 0;
597
+ --text-heading-xl-weight: 500;
598
+ --text-heading-lg-size: 1.875rem;
599
+ --text-heading-lg-line-height: 1.15;
600
+ --text-heading-lg-letter-spacing: 0;
601
+ --text-heading-lg-weight: 500;
602
+ --text-heading-md-size: 1.5rem;
603
+ --text-heading-md-line-height: 1.2;
604
+ --text-heading-md-letter-spacing: 0;
605
+ --text-heading-md-weight: 600;
606
+ --text-heading-sm-size: 1.25rem;
607
+ --text-heading-sm-line-height: 1.25;
608
+ --text-heading-sm-letter-spacing: 0;
609
+ --text-heading-sm-weight: 600;
610
+ --text-body-lg-size: 1.125rem;
611
+ --text-body-lg-line-height: 1.55;
612
+ --text-body-lg-letter-spacing: 0;
613
+ --text-body-lg-weight: 400;
614
+ --text-body-md-size: 1rem;
615
+ --text-body-md-line-height: 1.5;
616
+ --text-body-md-letter-spacing: 0;
617
+ --text-body-md-weight: 400;
618
+ --text-body-sm-size: 0.875rem;
619
+ --text-body-sm-line-height: 1.55;
620
+ --text-body-sm-letter-spacing: 0;
621
+ --text-body-sm-weight: 400;
622
+ --text-label-lg-size: 1rem;
623
+ --text-label-lg-line-height: 1.4;
624
+ --text-label-lg-letter-spacing: 0;
625
+ --text-label-lg-weight: 500;
626
+ --text-label-md-size: 0.875rem;
627
+ --text-label-md-line-height: 1.4;
628
+ --text-label-md-letter-spacing: 0;
629
+ --text-label-md-weight: 500;
630
+ --text-label-sm-size: 0.8125rem;
631
+ --text-label-sm-line-height: 1.4;
632
+ --text-label-sm-letter-spacing: 0;
633
+ --text-label-sm-weight: 500;
634
+ --text-caption-size: 0.8125rem;
635
+ --text-caption-line-height: 1.4;
636
+ --text-caption-letter-spacing: 0;
637
+ --text-caption-weight: 400;
638
+ --text-code-size: 0.875rem;
639
+ --text-code-line-height: 1.5;
640
+ --text-code-letter-spacing: 0;
641
+ --text-code-weight: 400;
642
+ --text-eyebrow-size: 0.6875rem;
643
+ --text-eyebrow-line-height: 1.4;
644
+ --text-eyebrow-letter-spacing: 0.1em;
645
+ --text-eyebrow-weight: 600;
495
646
  --color-background-body: #ffffff;
496
647
  --color-background-surface: #ffffff;
497
648
  --color-background-muted: #f5f5f4;
@@ -699,6 +850,58 @@
699
850
  --color-state-exporting-text: #92400e;
700
851
  }
701
852
  :root {
853
+ --elevation-surface-default: var(--color-background-surface);
854
+ --elevation-surface-raised: var(--color-background-surface);
855
+ --elevation-surface-floating: var(--color-background-surface);
856
+ --elevation-surface-overlay: var(--color-background-surface);
857
+ --text-display-xl-size: var(--font-size-8xl);
858
+ --text-display-xl-letter-spacing: var(--font-letterspacing-normal);
859
+ --text-display-xl-weight: var(--font-weight-medium);
860
+ --text-display-lg-size: var(--font-size-7xl);
861
+ --text-display-lg-letter-spacing: var(--font-letterspacing-normal);
862
+ --text-display-lg-weight: var(--font-weight-medium);
863
+ --text-display-md-size: var(--font-size-5xl);
864
+ --text-display-md-letter-spacing: var(--font-letterspacing-normal);
865
+ --text-display-md-weight: var(--font-weight-medium);
866
+ --text-heading-xl-size: var(--font-size-4xl);
867
+ --text-heading-xl-letter-spacing: var(--font-letterspacing-normal);
868
+ --text-heading-xl-weight: var(--font-weight-medium);
869
+ --text-heading-lg-size: var(--font-size-3xl);
870
+ --text-heading-lg-letter-spacing: var(--font-letterspacing-normal);
871
+ --text-heading-lg-weight: var(--font-weight-medium);
872
+ --text-heading-md-size: var(--font-size-2xl);
873
+ --text-heading-md-letter-spacing: var(--font-letterspacing-normal);
874
+ --text-heading-md-weight: var(--font-weight-semibold);
875
+ --text-heading-sm-size: var(--font-size-xl);
876
+ --text-heading-sm-line-height: var(--font-lineheight-tight);
877
+ --text-heading-sm-letter-spacing: var(--font-letterspacing-normal);
878
+ --text-heading-sm-weight: var(--font-weight-semibold);
879
+ --text-body-lg-size: var(--font-size-lg);
880
+ --text-body-lg-letter-spacing: var(--font-letterspacing-normal);
881
+ --text-body-lg-weight: var(--font-weight-normal);
882
+ --text-body-md-size: var(--font-size-base);
883
+ --text-body-md-line-height: var(--font-lineheight-normal);
884
+ --text-body-md-letter-spacing: var(--font-letterspacing-normal);
885
+ --text-body-md-weight: var(--font-weight-normal);
886
+ --text-body-sm-size: var(--font-size-sm);
887
+ --text-body-sm-letter-spacing: var(--font-letterspacing-normal);
888
+ --text-body-sm-weight: var(--font-weight-normal);
889
+ --text-label-lg-size: var(--font-size-base);
890
+ --text-label-lg-letter-spacing: var(--font-letterspacing-normal);
891
+ --text-label-lg-weight: var(--font-weight-medium);
892
+ --text-label-md-size: var(--font-size-sm);
893
+ --text-label-md-letter-spacing: var(--font-letterspacing-normal);
894
+ --text-label-md-weight: var(--font-weight-medium);
895
+ --text-label-sm-letter-spacing: var(--font-letterspacing-normal);
896
+ --text-label-sm-weight: var(--font-weight-medium);
897
+ --text-caption-letter-spacing: var(--font-letterspacing-normal);
898
+ --text-caption-weight: var(--font-weight-normal);
899
+ --text-code-size: var(--font-size-sm);
900
+ --text-code-line-height: var(--font-lineheight-normal);
901
+ --text-code-letter-spacing: var(--font-letterspacing-normal);
902
+ --text-code-weight: var(--font-weight-normal);
903
+ --text-eyebrow-letter-spacing: var(--font-letterspacing-widest);
904
+ --text-eyebrow-weight: var(--font-weight-semibold);
702
905
  --color-background-body: var(--color-white);
703
906
  --color-background-surface: var(--color-white);
704
907
  --color-background-muted: var(--color-gray-100);
@@ -749,6 +952,30 @@
749
952
  --color-map-satellite-border: var(--color-white);
750
953
  --color-map-neutral-border: var(--color-black);
751
954
  }
955
+ :root {
956
+ --text-display-xl: var(--text-display-xl-weight) var(--text-display-xl-size)/var(--text-display-xl-line-height) var(--font-family-brand);
957
+ --text-display-lg: var(--text-display-lg-weight) var(--text-display-lg-size)/var(--text-display-lg-line-height) var(--font-family-brand);
958
+ --text-display-md: var(--text-display-md-weight) var(--text-display-md-size)/var(--text-display-md-line-height) var(--font-family-brand);
959
+ --text-heading-xl: var(--text-heading-xl-weight) var(--text-heading-xl-size)/var(--text-heading-xl-line-height) var(--font-family-brand);
960
+ --text-heading-lg: var(--text-heading-lg-weight) var(--text-heading-lg-size)/var(--text-heading-lg-line-height) var(--font-family-brand);
961
+ --text-heading-md: var(--text-heading-md-weight) var(--text-heading-md-size)/var(--text-heading-md-line-height) var(--font-family-brand);
962
+ --text-heading-sm: var(--text-heading-sm-weight) var(--text-heading-sm-size)/var(--text-heading-sm-line-height) var(--font-family-brand);
963
+ --text-body-lg: var(--text-body-lg-weight) var(--text-body-lg-size)/var(--text-body-lg-line-height) var(--font-family-sans);
964
+ --text-body-md: var(--text-body-md-weight) var(--text-body-md-size)/var(--text-body-md-line-height) var(--font-family-sans);
965
+ --text-body-sm: var(--text-body-sm-weight) var(--text-body-sm-size)/var(--text-body-sm-line-height) var(--font-family-sans);
966
+ --text-label-lg: var(--text-label-lg-weight) var(--text-label-lg-size)/var(--text-label-lg-line-height) var(--font-family-sans);
967
+ --text-label-md: var(--text-label-md-weight) var(--text-label-md-size)/var(--text-label-md-line-height) var(--font-family-sans);
968
+ --text-label-sm: var(--text-label-sm-weight) var(--text-label-sm-size)/var(--text-label-sm-line-height) var(--font-family-sans);
969
+ --text-caption: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line-height) var(--font-family-sans);
970
+ --text-code: var(--text-code-weight) var(--text-code-size)/var(--text-code-line-height) var(--font-family-mono);
971
+ --text-eyebrow: var(--text-eyebrow-weight) var(--text-eyebrow-size)/var(--text-eyebrow-line-height) var(--font-family-mono);
972
+ }
973
+ @media (max-width: 768px) {
974
+ :root {
975
+ --text-body-md-size: 1.0625rem;
976
+ --text-body-lg-size: 1.1875rem;
977
+ }
978
+ }
752
979
  .theme-dark {
753
980
  --color-white: #ffffff;
754
981
  --color-black: #000000;
@@ -877,6 +1104,17 @@
877
1104
  --font-letterspacing-wide: 0.025em;
878
1105
  --font-letterspacing-wider: 0.05em;
879
1106
  --font-letterspacing-widest: 0.1em;
1107
+ --elevation-surface-default: var(--color-background-surface);
1108
+ --elevation-surface-raised: var(--color-background-surface);
1109
+ --elevation-surface-floating: var(--color-background-surface);
1110
+ --elevation-surface-overlay: var(--color-background-surface);
1111
+ --shadow-none: none;
1112
+ --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.06);
1113
+ --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
1114
+ --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.10), 0 2px 4px rgba(0, 0, 0, 0.06);
1115
+ --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12), 0 4px 8px rgba(0, 0, 0, 0.06);
1116
+ --shadow-xl: 0 20px 48px rgba(0, 0, 0, 0.16), 0 8px 16px rgba(0, 0, 0, 0.08);
1117
+ --shadow-overflow: 0 4px 12px rgba(0, 0, 0, 0.10);
880
1118
  --color-background-body: var(--color-gray-950);
881
1119
  --color-background-surface: var(--color-gray-900);
882
1120
  --color-background-muted: var(--color-gray-800);
@@ -1083,45 +1321,6 @@
1083
1321
  --color-state-exporting-border: #fbbf24;
1084
1322
  --color-state-exporting-text: #fef3c7;
1085
1323
  }
1086
- :root {
1087
- --color-brand-primary: var(--color-ink);
1088
- --color-brand-dark: var(--color-ink);
1089
- --color-brand-light: var(--color-linen);
1090
- --color-brand-background: var(--color-linen);
1091
- --color-neutral-white: var(--color-white);
1092
- --color-neutral-black: var(--color-black);
1093
- --action-brand-background: var(--color-ink);
1094
- --action-brand-hover: var(--color-graphite);
1095
- --action-brand-text: var(--color-white);
1096
- --action-default-background: var(--color-ink);
1097
- --action-default-hover: var(--color-graphite);
1098
- --action-default-text: var(--color-white);
1099
- --action-destructive-background: var(--color-error-base);
1100
- --action-destructive-hover: var(--color-error-dark);
1101
- --action-destructive-text: var(--color-white);
1102
- --action-disabled-background: var(--color-gray-300);
1103
- --action-disabled-text: var(--color-gray-500);
1104
- --feedback-success-text: var(--color-success-dark);
1105
- --feedback-success-icon: var(--color-success-base);
1106
- --feedback-success-background: var(--color-success-light);
1107
- --feedback-success-border: var(--color-success-base);
1108
- --feedback-error-text: var(--color-error-dark);
1109
- --feedback-error-icon: var(--color-error-base);
1110
- --feedback-error-background: var(--color-error-light);
1111
- --feedback-error-border: var(--color-error-base);
1112
- --feedback-warning-text: var(--color-warning-dark);
1113
- --feedback-warning-icon: var(--color-warning-base);
1114
- --feedback-warning-background: var(--color-warning-light);
1115
- --feedback-warning-border: var(--color-warning-base);
1116
- --feedback-info-text: var(--color-info-dark);
1117
- --feedback-info-icon: var(--color-info-base);
1118
- --feedback-info-background: var(--color-info-light);
1119
- --feedback-info-border: var(--color-info-base);
1120
- --skeleton-base: var(--color-gray-200);
1121
- --skeleton-highlight: var(--color-gray-100);
1122
- --skeleton-wave: var(--color-skeleton-wave-light);
1123
- --theme-text-label: var(--color-ink);
1124
- }
1125
1324
  :root {
1126
1325
  --theme-background-canvas: var(--color-background-canvas);
1127
1326
  --theme-background-ai: var(--color-background-ai);
@@ -3436,6 +3635,15 @@
3436
3635
  border-color: color-mix(in oklab, var(--color-border-muted) 50%, transparent);
3437
3636
  }
3438
3637
  }
3638
+ .border-brand-primary {
3639
+ border-color: var(--color-brand-primary);
3640
+ }
3641
+ .border-brand-primary\/20 {
3642
+ border-color: color-mix(in srgb, #111111 20%, transparent);
3643
+ @supports (color: color-mix(in lab, red, red)) {
3644
+ border-color: color-mix(in oklab, var(--color-brand-primary) 20%, transparent);
3645
+ }
3646
+ }
3439
3647
  .border-current {
3440
3648
  border-color: currentcolor;
3441
3649
  }
@@ -3529,6 +3737,9 @@
3529
3737
  .border-l-border-muted {
3530
3738
  border-left-color: var(--color-border-muted);
3531
3739
  }
3740
+ .border-l-brand-primary {
3741
+ border-left-color: var(--color-brand-primary);
3742
+ }
3532
3743
  .border-l-feedback-error-border {
3533
3744
  border-left-color: var(--color-feedback-error-border);
3534
3745
  }
@@ -3661,6 +3872,24 @@
3661
3872
  .bg-border-muted {
3662
3873
  background-color: var(--color-border-muted);
3663
3874
  }
3875
+ .bg-brand-light {
3876
+ background-color: var(--color-brand-light);
3877
+ }
3878
+ .bg-brand-primary {
3879
+ background-color: var(--color-brand-primary);
3880
+ }
3881
+ .bg-brand-primary\/10 {
3882
+ background-color: color-mix(in srgb, #111111 10%, transparent);
3883
+ @supports (color: color-mix(in lab, red, red)) {
3884
+ background-color: color-mix(in oklab, var(--color-brand-primary) 10%, transparent);
3885
+ }
3886
+ }
3887
+ .bg-brand-primary\/20 {
3888
+ background-color: color-mix(in srgb, #111111 20%, transparent);
3889
+ @supports (color: color-mix(in lab, red, red)) {
3890
+ background-color: color-mix(in oklab, var(--color-brand-primary) 20%, transparent);
3891
+ }
3892
+ }
3664
3893
  .bg-current {
3665
3894
  background-color: currentcolor;
3666
3895
  }
@@ -3751,6 +3980,9 @@
3751
3980
  .bg-inherit {
3752
3981
  background-color: inherit;
3753
3982
  }
3983
+ .bg-neutral-black {
3984
+ background-color: var(--color-neutral-black);
3985
+ }
3754
3986
  .bg-orange-50 {
3755
3987
  background-color: var(--color-orange-50);
3756
3988
  }
@@ -3964,6 +4196,12 @@
3964
4196
  .fill-background-surface {
3965
4197
  fill: var(--color-background-surface);
3966
4198
  }
4199
+ .fill-brand-primary {
4200
+ fill: var(--color-brand-primary);
4201
+ }
4202
+ .fill-neutral-black {
4203
+ fill: var(--color-neutral-black);
4204
+ }
3967
4205
  .fill-red-500 {
3968
4206
  fill: var(--color-red-500);
3969
4207
  }
@@ -4498,6 +4736,12 @@
4498
4736
  .text-blue-900 {
4499
4737
  color: var(--color-blue-900);
4500
4738
  }
4739
+ .text-brand-light {
4740
+ color: var(--color-brand-light);
4741
+ }
4742
+ .text-brand-primary {
4743
+ color: var(--color-brand-primary);
4744
+ }
4501
4745
  .text-current {
4502
4746
  color: currentcolor;
4503
4747
  }
@@ -4794,23 +5038,31 @@
4794
5038
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4795
5039
  }
4796
5040
  .shadow-lg {
4797
- --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));
5041
+ --tw-shadow: 0 8px 24px var(--tw-shadow-color, rgba(0, 0, 0, 0.12)), 0 4px 8px var(--tw-shadow-color, rgba(0, 0, 0, 0.06));
4798
5042
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4799
5043
  }
4800
5044
  .shadow-md {
4801
- --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));
5045
+ --tw-shadow: 0 4px 12px var(--tw-shadow-color, rgba(0, 0, 0, 0.10)), 0 2px 4px var(--tw-shadow-color, rgba(0, 0, 0, 0.06));
4802
5046
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4803
5047
  }
4804
5048
  .shadow-none {
4805
5049
  --tw-shadow: 0 0 #0000;
4806
5050
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4807
5051
  }
5052
+ .shadow-overflow {
5053
+ --tw-shadow: 0 4px 12px var(--tw-shadow-color, rgba(0, 0, 0, 0.10));
5054
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
5055
+ }
4808
5056
  .shadow-sm {
4809
- --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));
5057
+ --tw-shadow: 0 1px 4px var(--tw-shadow-color, rgba(0, 0, 0, 0.08)), 0 2px 8px var(--tw-shadow-color, rgba(0, 0, 0, 0.04));
4810
5058
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4811
5059
  }
4812
5060
  .shadow-xl {
4813
- --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
5061
+ --tw-shadow: 0 20px 48px var(--tw-shadow-color, rgba(0, 0, 0, 0.16)), 0 8px 16px var(--tw-shadow-color, rgba(0, 0, 0, 0.08));
5062
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
5063
+ }
5064
+ .shadow-xs {
5065
+ --tw-shadow: 0 1px 2px var(--tw-shadow-color, rgba(0, 0, 0, 0.06));
4814
5066
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4815
5067
  }
4816
5068
  .\!ring-0 {
@@ -5101,6 +5353,26 @@
5101
5353
  }
5102
5354
  }
5103
5355
  }
5356
+ .group-hover\:bg-brand-primary\/15 {
5357
+ &:is(:where(.group):hover *) {
5358
+ @media (hover: hover) {
5359
+ background-color: color-mix(in srgb, #111111 15%, transparent);
5360
+ @supports (color: color-mix(in lab, red, red)) {
5361
+ background-color: color-mix(in oklab, var(--color-brand-primary) 15%, transparent);
5362
+ }
5363
+ }
5364
+ }
5365
+ }
5366
+ .group-hover\:bg-brand-primary\/90 {
5367
+ &:is(:where(.group):hover *) {
5368
+ @media (hover: hover) {
5369
+ background-color: color-mix(in srgb, #111111 90%, transparent);
5370
+ @supports (color: color-mix(in lab, red, red)) {
5371
+ background-color: color-mix(in oklab, var(--color-brand-primary) 90%, transparent);
5372
+ }
5373
+ }
5374
+ }
5375
+ }
5104
5376
  .group-hover\:bg-gray-200 {
5105
5377
  &:is(:where(.group):hover *) {
5106
5378
  @media (hover: hover) {
@@ -5108,6 +5380,13 @@
5108
5380
  }
5109
5381
  }
5110
5382
  }
5383
+ .group-hover\:text-brand-primary {
5384
+ &:is(:where(.group):hover *) {
5385
+ @media (hover: hover) {
5386
+ color: var(--color-brand-primary);
5387
+ }
5388
+ }
5389
+ }
5111
5390
  .group-hover\:text-text-heading {
5112
5391
  &:is(:where(.group):hover *) {
5113
5392
  @media (hover: hover) {
@@ -5405,7 +5684,7 @@
5405
5684
  }
5406
5685
  .focus-within\:shadow-md {
5407
5686
  &:focus-within {
5408
- --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));
5687
+ --tw-shadow: 0 4px 12px var(--tw-shadow-color, rgba(0, 0, 0, 0.10)), 0 2px 4px var(--tw-shadow-color, rgba(0, 0, 0, 0.06));
5409
5688
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
5410
5689
  }
5411
5690
  }
@@ -5582,6 +5861,16 @@
5582
5861
  }
5583
5862
  }
5584
5863
  }
5864
+ .hover\:bg-brand-primary\/90 {
5865
+ &:hover {
5866
+ @media (hover: hover) {
5867
+ background-color: color-mix(in srgb, #111111 90%, transparent);
5868
+ @supports (color: color-mix(in lab, red, red)) {
5869
+ background-color: color-mix(in oklab, var(--color-brand-primary) 90%, transparent);
5870
+ }
5871
+ }
5872
+ }
5873
+ }
5585
5874
  .hover\:bg-feedback-error-background {
5586
5875
  &:hover {
5587
5876
  @media (hover: hover) {
@@ -5719,6 +6008,13 @@
5719
6008
  }
5720
6009
  }
5721
6010
  }
6011
+ .hover\:text-brand-primary {
6012
+ &:hover {
6013
+ @media (hover: hover) {
6014
+ color: var(--color-brand-primary);
6015
+ }
6016
+ }
6017
+ }
5722
6018
  .hover\:text-text-body {
5723
6019
  &:hover {
5724
6020
  @media (hover: hover) {
@@ -5909,6 +6205,11 @@
5909
6205
  border-width: 0px !important;
5910
6206
  }
5911
6207
  }
6208
+ .focus-visible\:bg-brand-light {
6209
+ &:focus-visible {
6210
+ background-color: var(--color-brand-light);
6211
+ }
6212
+ }
5912
6213
  .focus-visible\:\!ring-0 {
5913
6214
  &:focus-visible {
5914
6215
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;
@@ -8255,7 +8556,7 @@
8255
8556
  &:hover {
8256
8557
  @media (hover: hover) {
8257
8558
  &::-moz-range-thumb {
8258
- --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));
8559
+ --tw-shadow: 0 1px 4px var(--tw-shadow-color, rgba(0, 0, 0, 0.08)), 0 2px 8px var(--tw-shadow-color, rgba(0, 0, 0, 0.04));
8259
8560
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
8260
8561
  }
8261
8562
  }
@@ -8334,7 +8635,7 @@
8334
8635
  &:hover {
8335
8636
  @media (hover: hover) {
8336
8637
  &::-webkit-slider-thumb {
8337
- --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));
8638
+ --tw-shadow: 0 1px 4px var(--tw-shadow-color, rgba(0, 0, 0, 0.08)), 0 2px 8px var(--tw-shadow-color, rgba(0, 0, 0, 0.04));
8338
8639
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
8339
8640
  }
8340
8641
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@texturehq/edges",
3
- "version": "1.31.0",
3
+ "version": "1.32.0",
4
4
  "author": "Nicholas Brown <nick@texturehq.com>",
5
5
  "description": "A shared component library for Texture",
6
6
  "type": "module",