@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.
@@ -163,6 +163,17 @@
163
163
  --action-destructive-text: #ffffff;
164
164
  --action-disabled-background: #d1d5db;
165
165
  --action-disabled-text: #6b7280;
166
+ --elevation-surface-default: #1a2038;
167
+ --elevation-surface-raised: #1a2038;
168
+ --elevation-surface-floating: #1a2038;
169
+ --elevation-surface-overlay: #1a2038;
170
+ --shadow-none: none;
171
+ --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.06);
172
+ --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
173
+ --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.10), 0 2px 4px rgba(0, 0, 0, 0.06);
174
+ --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12), 0 4px 8px rgba(0, 0, 0, 0.06);
175
+ --shadow-xl: 0 20px 48px rgba(0, 0, 0, 0.16), 0 8px 16px rgba(0, 0, 0, 0.08);
176
+ --shadow-overflow: 0 4px 12px rgba(0, 0, 0, 0.10);
166
177
  --feedback-success-text: oklch(0.314 0.095 133.748);
167
178
  --feedback-success-icon: oklch(0.437 0.154 132.474);
168
179
  --feedback-success-background: oklch(0.99 0.01 131.68);
@@ -176,6 +176,17 @@
176
176
  --action-destructive-text: #ffffff;
177
177
  --action-disabled-background: #d1d5db;
178
178
  --action-disabled-text: #6b7280;
179
+ --elevation-surface-default: #ffffff;
180
+ --elevation-surface-raised: #ffffff;
181
+ --elevation-surface-floating: #ffffff;
182
+ --elevation-surface-overlay: #ffffff;
183
+ --shadow-none: none;
184
+ --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.06);
185
+ --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
186
+ --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.10), 0 2px 4px rgba(0, 0, 0, 0.06);
187
+ --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12), 0 4px 8px rgba(0, 0, 0, 0.06);
188
+ --shadow-xl: 0 20px 48px rgba(0, 0, 0, 0.16), 0 8px 16px rgba(0, 0, 0, 0.08);
189
+ --shadow-overflow: 0 4px 12px rgba(0, 0, 0, 0.10);
179
190
  --feedback-success-text: oklch(0.314 0.095 133.748);
180
191
  --feedback-success-icon: oklch(0.437 0.154 132.474);
181
192
  --feedback-success-background: oklch(0.99 0.01 131.68);
@@ -199,6 +210,70 @@
199
210
  --skeleton-base: #e5e7eb;
200
211
  --skeleton-highlight: #f3f4f6;
201
212
  --skeleton-wave: rgba(255, 255, 255, 0.5);
213
+ --text-display-xl-size: 6rem;
214
+ --text-display-xl-line-height: 1;
215
+ --text-display-xl-letter-spacing: 0;
216
+ --text-display-xl-weight: 500;
217
+ --text-display-lg-size: 4.5rem;
218
+ --text-display-lg-line-height: 1;
219
+ --text-display-lg-letter-spacing: 0;
220
+ --text-display-lg-weight: 500;
221
+ --text-display-md-size: 3rem;
222
+ --text-display-md-line-height: 1.05;
223
+ --text-display-md-letter-spacing: 0;
224
+ --text-display-md-weight: 500;
225
+ --text-heading-xl-size: 2.25rem;
226
+ --text-heading-xl-line-height: 1.1;
227
+ --text-heading-xl-letter-spacing: 0;
228
+ --text-heading-xl-weight: 500;
229
+ --text-heading-lg-size: 1.875rem;
230
+ --text-heading-lg-line-height: 1.15;
231
+ --text-heading-lg-letter-spacing: 0;
232
+ --text-heading-lg-weight: 500;
233
+ --text-heading-md-size: 1.5rem;
234
+ --text-heading-md-line-height: 1.2;
235
+ --text-heading-md-letter-spacing: 0;
236
+ --text-heading-md-weight: 600;
237
+ --text-heading-sm-size: 1.25rem;
238
+ --text-heading-sm-line-height: 1.25;
239
+ --text-heading-sm-letter-spacing: 0;
240
+ --text-heading-sm-weight: 600;
241
+ --text-body-lg-size: 1.125rem;
242
+ --text-body-lg-line-height: 1.55;
243
+ --text-body-lg-letter-spacing: 0;
244
+ --text-body-lg-weight: 400;
245
+ --text-body-md-size: 1rem;
246
+ --text-body-md-line-height: 1.5;
247
+ --text-body-md-letter-spacing: 0;
248
+ --text-body-md-weight: 400;
249
+ --text-body-sm-size: 0.875rem;
250
+ --text-body-sm-line-height: 1.55;
251
+ --text-body-sm-letter-spacing: 0;
252
+ --text-body-sm-weight: 400;
253
+ --text-label-lg-size: 1rem;
254
+ --text-label-lg-line-height: 1.4;
255
+ --text-label-lg-letter-spacing: 0;
256
+ --text-label-lg-weight: 500;
257
+ --text-label-md-size: 0.875rem;
258
+ --text-label-md-line-height: 1.4;
259
+ --text-label-md-letter-spacing: 0;
260
+ --text-label-md-weight: 500;
261
+ --text-label-sm-size: 0.8125rem;
262
+ --text-label-sm-line-height: 1.4;
263
+ --text-label-sm-letter-spacing: 0;
264
+ --text-label-sm-weight: 500;
265
+ --text-caption-size: 0.8125rem;
266
+ --text-caption-line-height: 1.4;
267
+ --text-caption-letter-spacing: 0;
268
+ --text-caption-weight: 400;
269
+ --text-code-size: 0.875rem;
270
+ --text-code-line-height: 1.5;
271
+ --text-code-letter-spacing: 0;
272
+ --text-code-weight: 400;
273
+ --text-eyebrow-size: 0.6875rem;
274
+ --text-eyebrow-line-height: 1.4;
275
+ --text-eyebrow-letter-spacing: 0.1em;
276
+ --text-eyebrow-weight: 600;
202
277
  --color-background-body: #ffffff;
203
278
  --color-background-surface: #ffffff;
204
279
  --color-background-muted: #f3f4f6;
@@ -410,6 +485,10 @@
410
485
  --action-destructive-text: var(--color-white);
411
486
  --action-disabled-background: var(--color-gray-300);
412
487
  --action-disabled-text: var(--color-gray-500);
488
+ --elevation-surface-default: var(--color-background-surface);
489
+ --elevation-surface-raised: var(--color-background-surface);
490
+ --elevation-surface-floating: var(--color-background-surface);
491
+ --elevation-surface-overlay: var(--color-background-surface);
413
492
  --feedback-success-text: var(--color-green-900);
414
493
  --feedback-success-icon: var(--color-green-700);
415
494
  --feedback-success-border: var(--color-green-600);
@@ -428,6 +507,54 @@
428
507
  --color-map-neutral-border: var(--color-black);
429
508
  --skeleton-base: var(--color-gray-200);
430
509
  --skeleton-highlight: var(--color-gray-100);
510
+ --text-display-xl-size: var(--font-size-8xl);
511
+ --text-display-xl-letter-spacing: var(--font-letterspacing-normal);
512
+ --text-display-xl-weight: var(--font-weight-medium);
513
+ --text-display-lg-size: var(--font-size-7xl);
514
+ --text-display-lg-letter-spacing: var(--font-letterspacing-normal);
515
+ --text-display-lg-weight: var(--font-weight-medium);
516
+ --text-display-md-size: var(--font-size-5xl);
517
+ --text-display-md-letter-spacing: var(--font-letterspacing-normal);
518
+ --text-display-md-weight: var(--font-weight-medium);
519
+ --text-heading-xl-size: var(--font-size-4xl);
520
+ --text-heading-xl-letter-spacing: var(--font-letterspacing-normal);
521
+ --text-heading-xl-weight: var(--font-weight-medium);
522
+ --text-heading-lg-size: var(--font-size-3xl);
523
+ --text-heading-lg-letter-spacing: var(--font-letterspacing-normal);
524
+ --text-heading-lg-weight: var(--font-weight-medium);
525
+ --text-heading-md-size: var(--font-size-2xl);
526
+ --text-heading-md-letter-spacing: var(--font-letterspacing-normal);
527
+ --text-heading-md-weight: var(--font-weight-semibold);
528
+ --text-heading-sm-size: var(--font-size-xl);
529
+ --text-heading-sm-line-height: var(--font-lineheight-tight);
530
+ --text-heading-sm-letter-spacing: var(--font-letterspacing-normal);
531
+ --text-heading-sm-weight: var(--font-weight-semibold);
532
+ --text-body-lg-size: var(--font-size-lg);
533
+ --text-body-lg-letter-spacing: var(--font-letterspacing-normal);
534
+ --text-body-lg-weight: var(--font-weight-normal);
535
+ --text-body-md-size: var(--font-size-base);
536
+ --text-body-md-line-height: var(--font-lineheight-normal);
537
+ --text-body-md-letter-spacing: var(--font-letterspacing-normal);
538
+ --text-body-md-weight: var(--font-weight-normal);
539
+ --text-body-sm-size: var(--font-size-sm);
540
+ --text-body-sm-letter-spacing: var(--font-letterspacing-normal);
541
+ --text-body-sm-weight: var(--font-weight-normal);
542
+ --text-label-lg-size: var(--font-size-base);
543
+ --text-label-lg-letter-spacing: var(--font-letterspacing-normal);
544
+ --text-label-lg-weight: var(--font-weight-medium);
545
+ --text-label-md-size: var(--font-size-sm);
546
+ --text-label-md-letter-spacing: var(--font-letterspacing-normal);
547
+ --text-label-md-weight: var(--font-weight-medium);
548
+ --text-label-sm-letter-spacing: var(--font-letterspacing-normal);
549
+ --text-label-sm-weight: var(--font-weight-medium);
550
+ --text-caption-letter-spacing: var(--font-letterspacing-normal);
551
+ --text-caption-weight: var(--font-weight-normal);
552
+ --text-code-size: var(--font-size-sm);
553
+ --text-code-line-height: var(--font-lineheight-normal);
554
+ --text-code-letter-spacing: var(--font-letterspacing-normal);
555
+ --text-code-weight: var(--font-weight-normal);
556
+ --text-eyebrow-letter-spacing: var(--font-letterspacing-widest);
557
+ --text-eyebrow-weight: var(--font-weight-semibold);
431
558
  --color-background-body: var(--color-white);
432
559
  --color-background-surface: var(--color-white);
433
560
  --color-background-muted: var(--color-gray-100);
@@ -454,3 +581,31 @@
454
581
  --color-skeleton-base: var(--color-gray-200);
455
582
  --color-skeleton-highlight: var(--color-gray-100);
456
583
  }
584
+
585
+ /* Semantic typography shorthand — `font:` shorthand per role. */
586
+ :root {
587
+ --text-display-xl: var(--text-display-xl-weight) var(--text-display-xl-size)/var(--text-display-xl-line-height) var(--font-family-brand);
588
+ --text-display-lg: var(--text-display-lg-weight) var(--text-display-lg-size)/var(--text-display-lg-line-height) var(--font-family-brand);
589
+ --text-display-md: var(--text-display-md-weight) var(--text-display-md-size)/var(--text-display-md-line-height) var(--font-family-brand);
590
+ --text-heading-xl: var(--text-heading-xl-weight) var(--text-heading-xl-size)/var(--text-heading-xl-line-height) var(--font-family-brand);
591
+ --text-heading-lg: var(--text-heading-lg-weight) var(--text-heading-lg-size)/var(--text-heading-lg-line-height) var(--font-family-brand);
592
+ --text-heading-md: var(--text-heading-md-weight) var(--text-heading-md-size)/var(--text-heading-md-line-height) var(--font-family-brand);
593
+ --text-heading-sm: var(--text-heading-sm-weight) var(--text-heading-sm-size)/var(--text-heading-sm-line-height) var(--font-family-brand);
594
+ --text-body-lg: var(--text-body-lg-weight) var(--text-body-lg-size)/var(--text-body-lg-line-height) var(--font-family-sans);
595
+ --text-body-md: var(--text-body-md-weight) var(--text-body-md-size)/var(--text-body-md-line-height) var(--font-family-sans);
596
+ --text-body-sm: var(--text-body-sm-weight) var(--text-body-sm-size)/var(--text-body-sm-line-height) var(--font-family-sans);
597
+ --text-label-lg: var(--text-label-lg-weight) var(--text-label-lg-size)/var(--text-label-lg-line-height) var(--font-family-sans);
598
+ --text-label-md: var(--text-label-md-weight) var(--text-label-md-size)/var(--text-label-md-line-height) var(--font-family-sans);
599
+ --text-label-sm: var(--text-label-sm-weight) var(--text-label-sm-size)/var(--text-label-sm-line-height) var(--font-family-sans);
600
+ --text-caption: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line-height) var(--font-family-sans);
601
+ --text-code: var(--text-code-weight) var(--text-code-size)/var(--text-code-line-height) var(--font-family-mono);
602
+ --text-eyebrow: var(--text-eyebrow-weight) var(--text-eyebrow-size)/var(--text-eyebrow-line-height) var(--font-family-mono);
603
+ }
604
+
605
+ /* Mobile bump — body copy gets a touch larger on phones for readability. */
606
+ @media (max-width: 768px) {
607
+ :root {
608
+ --text-body-md-size: 1.0625rem; /* 16 → 17 */
609
+ --text-body-lg-size: 1.1875rem; /* 18 → 19 */
610
+ }
611
+ }