@astryxdesign/theme-stone 0.5.3 → 0.5.4-canary.0fee3bc

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/stone.d.ts CHANGED
@@ -2,11 +2,10 @@
2
2
  * @generated by `astryx theme build` — do not edit manually.
3
3
  * Source: src/stoneTheme.ts
4
4
  * Command: astryx theme build src/stoneTheme.ts --out dist/theme.css
5
- * CLI: @astryxdesign/cli@0.5.3
6
- * Core: @astryxdesign/core@0.5.3
5
+ * CLI: @astryxdesign/cli@0.5.4
6
+ * Core: @astryxdesign/core@0.5.4
7
7
  */
8
8
 
9
- /// <reference path="./stone.variants.d.ts" />
10
9
  import type { DefinedTheme } from '@astryxdesign/core/theme';
11
10
  import type { IconRegistry } from '@astryxdesign/core/Icon';
12
11
  export declare const stoneIconRegistry: IconRegistry;
package/dist/stone.js CHANGED
@@ -2,8 +2,8 @@
2
2
  * @generated by `astryx theme build` — do not edit manually.
3
3
  * Source: src/stoneTheme.ts
4
4
  * Command: astryx theme build src/stoneTheme.ts --out dist/theme.css
5
- * CLI: @astryxdesign/cli@0.5.3
6
- * Core: @astryxdesign/core@0.5.3
5
+ * CLI: @astryxdesign/cli@0.5.4
6
+ * Core: @astryxdesign/core@0.5.4
7
7
  */
8
8
 
9
9
  import { stoneIconRegistry } from "./icons.mjs";
@@ -513,6 +513,46 @@ export const stoneTheme = {
513
513
  "--color-accent": "var(--color-on-light)"
514
514
  }
515
515
  },
516
+ __adaptations: {
517
+ "widthBreakpoints": {
518
+ "sm": 640,
519
+ "md": 768,
520
+ "lg": 1024,
521
+ "xl": 1280,
522
+ "2xl": 1536
523
+ },
524
+ "rules": []
525
+ },
526
+ __axes: {
527
+ "typography": {
528
+ "scale": {
529
+ "base": 14,
530
+ "ratio": 1.25
531
+ },
532
+ "body": {
533
+ "family": "Figtree",
534
+ "fallbacks": "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif"
535
+ },
536
+ "heading": {
537
+ "family": "Montserrat",
538
+ "fallbacks": "\"Figtree\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif",
539
+ "weights": {
540
+ "3": "bold",
541
+ "4": "bold"
542
+ }
543
+ },
544
+ "code": {
545
+ "family": "JetBrains Mono",
546
+ "fallbacks": "\"SF Mono\", Monaco, Consolas, monospace"
547
+ }
548
+ },
549
+ "motion": {
550
+ "fast": 125,
551
+ "medium": 300,
552
+ "slow": 700,
553
+ "ratio": 0.75
554
+ }
555
+ },
516
556
  icons: stoneIconRegistry,
517
557
  };
518
558
 
@@ -1,4 +1,4 @@
1
- export declare const stoneTheme: import("@astryxdesign/core/theme").DefinedTheme;
1
+ export declare const stoneTheme: import("@astryxdesign/core/theme").ResolvedDefinedTheme;
2
2
  /**
3
3
  * Raw tonal palettes — every color at every tone step (0–100 in 5s).
4
4
  * Same hue and chroma used to derive all theme tokens.
@@ -1 +1 @@
1
- {"version":3,"file":"stoneTheme.d.ts","sourceRoot":"","sources":["../src/stoneTheme.ts"],"names":[],"mappings":"AA6DA,eAAO,MAAM,UAAU,iDAiVrB,CAAC;AAEH;;;;GAIG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2PhB,CAAC"}
1
+ {"version":3,"file":"stoneTheme.d.ts","sourceRoot":"","sources":["../src/stoneTheme.ts"],"names":[],"mappings":"AA6DA,eAAO,MAAM,UAAU,yDAiVrB,CAAC;AAEH;;;;GAIG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2PhB,CAAC"}
package/dist/theme.css CHANGED
@@ -2,8 +2,8 @@
2
2
  * @generated by `astryx theme build` — do not edit manually.
3
3
  * Source: src/stoneTheme.ts
4
4
  * Command: astryx theme build src/stoneTheme.ts --out dist/theme.css
5
- * CLI: @astryxdesign/cli@0.5.3
6
- * Core: @astryxdesign/core@0.5.3
5
+ * CLI: @astryxdesign/cli@0.5.4
6
+ * Core: @astryxdesign/core@0.5.4
7
7
  */
8
8
 
9
9
  @layer reset {
@@ -14,60 +14,60 @@
14
14
  }
15
15
 
16
16
  :where(h1) {
17
- font-size: var(--font-size-2xl);
18
- font-weight: var(--font-weight-semibold);
19
- line-height: 1.3333;
17
+ font-size: var(--text-heading-1-size);
18
+ font-weight: var(--text-heading-1-weight);
19
+ line-height: var(--text-heading-1-leading);
20
20
  }
21
21
 
22
22
  :where(h2) {
23
- font-size: var(--font-size-xl);
24
- font-weight: var(--font-weight-semibold);
25
- line-height: 1.4545;
23
+ font-size: var(--text-heading-2-size);
24
+ font-weight: var(--text-heading-2-weight);
25
+ line-height: var(--text-heading-2-leading);
26
26
  }
27
27
 
28
28
  :where(h3) {
29
- font-size: var(--font-size-lg);
30
- font-weight: var(--font-weight-bold);
31
- line-height: 1.5556;
29
+ font-size: var(--text-heading-3-size);
30
+ font-weight: var(--text-heading-3-weight);
31
+ line-height: var(--text-heading-3-leading);
32
32
  }
33
33
 
34
34
  :where(h4) {
35
- font-size: var(--font-size-base);
36
- font-weight: var(--font-weight-bold);
37
- line-height: 1.4286;
35
+ font-size: var(--text-heading-4-size);
36
+ font-weight: var(--text-heading-4-weight);
37
+ line-height: var(--text-heading-4-leading);
38
38
  }
39
39
 
40
40
  :where(h5) {
41
- font-size: var(--font-size-sm);
42
- font-weight: var(--font-weight-semibold);
43
- line-height: 1.4545;
41
+ font-size: var(--text-heading-5-size);
42
+ font-weight: var(--text-heading-5-weight);
43
+ line-height: var(--text-heading-5-leading);
44
44
  }
45
45
 
46
46
  :where(h6) {
47
- font-size: var(--font-size-xs);
48
- font-weight: var(--font-weight-semibold);
49
- line-height: 1.7778;
47
+ font-size: var(--text-heading-6-size);
48
+ font-weight: var(--text-heading-6-weight);
49
+ line-height: var(--text-heading-6-leading);
50
50
  }
51
51
 
52
52
  :where(p) {
53
53
  font-family: var(--font-family-body);
54
- font-size: var(--font-size-base);
55
- font-weight: var(--font-weight-normal);
56
- line-height: 1.4286;
54
+ font-size: var(--text-body-size);
55
+ font-weight: var(--text-body-weight);
56
+ line-height: var(--text-body-leading);
57
57
  color: var(--color-text-primary);
58
58
  }
59
59
 
60
60
  :where(small) {
61
- font-size: 12px;
62
- font-weight: var(--font-weight-normal);
63
- line-height: 1.4545;
61
+ font-size: var(--text-supporting-size);
62
+ font-weight: var(--text-supporting-weight);
63
+ line-height: var(--text-supporting-leading);
64
64
  color: var(--color-text-secondary);
65
65
  }
66
66
 
67
67
  :where(code, pre) {
68
68
  font-family: var(--font-family-code);
69
- font-size: var(--font-size-base);
70
- line-height: 1.4286;
69
+ font-size: var(--text-code-size);
70
+ line-height: var(--text-code-leading);
71
71
  }
72
72
 
73
73
  :where(hr) {
@@ -318,109 +318,109 @@
318
318
  --shadow-inset-error: inset 0px 0px 0px 2px #83838a30;
319
319
  }
320
320
 
321
- .astryx-heading.level-1 {
321
+ .astryx-heading[data-level="1"] {
322
322
  font-family: var(--font-family-heading);
323
323
  font-size: var(--text-heading-1-size);
324
324
  font-weight: var(--text-heading-1-weight);
325
325
  line-height: var(--text-heading-1-leading);
326
326
  }
327
327
 
328
- .astryx-heading.level-2 {
328
+ .astryx-heading[data-level="2"] {
329
329
  font-family: var(--font-family-heading);
330
330
  font-size: var(--text-heading-2-size);
331
331
  font-weight: var(--text-heading-2-weight);
332
332
  line-height: var(--text-heading-2-leading);
333
333
  }
334
334
 
335
- .astryx-heading.level-3 {
335
+ .astryx-heading[data-level="3"] {
336
336
  font-family: var(--font-family-heading);
337
337
  font-size: var(--text-heading-3-size);
338
338
  font-weight: var(--text-heading-3-weight);
339
339
  line-height: var(--text-heading-3-leading);
340
340
  }
341
341
 
342
- .astryx-heading.level-4 {
342
+ .astryx-heading[data-level="4"] {
343
343
  font-family: var(--font-family-heading);
344
344
  font-size: var(--text-heading-4-size);
345
345
  font-weight: var(--text-heading-4-weight);
346
346
  line-height: var(--text-heading-4-leading);
347
347
  }
348
348
 
349
- .astryx-heading.level-5 {
349
+ .astryx-heading[data-level="5"] {
350
350
  font-family: var(--font-family-heading);
351
351
  font-size: var(--text-heading-5-size);
352
352
  font-weight: var(--text-heading-5-weight);
353
353
  line-height: var(--text-heading-5-leading);
354
354
  }
355
355
 
356
- .astryx-heading.level-6 {
356
+ .astryx-heading[data-level="6"] {
357
357
  font-family: var(--font-family-heading);
358
358
  font-size: var(--text-heading-6-size);
359
359
  font-weight: var(--text-heading-6-weight);
360
360
  line-height: var(--text-heading-6-leading);
361
361
  }
362
362
 
363
- .astryx-heading.display-1 {
363
+ .astryx-heading[data-type="display-1"] {
364
364
  font-family: var(--font-family-heading);
365
365
  font-size: var(--text-display-1-size);
366
366
  line-height: var(--text-display-1-leading);
367
367
  }
368
368
 
369
- .astryx-heading.display-2 {
369
+ .astryx-heading[data-type="display-2"] {
370
370
  font-family: var(--font-family-heading);
371
371
  font-size: var(--text-display-2-size);
372
372
  line-height: var(--text-display-2-leading);
373
373
  }
374
374
 
375
- .astryx-heading.display-3 {
375
+ .astryx-heading[data-type="display-3"] {
376
376
  font-family: var(--font-family-heading);
377
377
  font-size: var(--text-display-3-size);
378
378
  line-height: var(--text-display-3-leading);
379
379
  }
380
380
 
381
- .astryx-text.body {
381
+ .astryx-text[data-type="body"] {
382
382
  font-family: var(--font-family-body);
383
383
  font-size: var(--text-body-size);
384
384
  line-height: var(--text-body-leading);
385
385
  }
386
386
 
387
- .astryx-text.large {
387
+ .astryx-text[data-type="large"] {
388
388
  font-family: var(--font-family-body);
389
389
  font-size: var(--text-large-size);
390
390
  line-height: var(--text-large-leading);
391
391
  }
392
392
 
393
- .astryx-text.label {
393
+ .astryx-text[data-type="label"] {
394
394
  font-family: var(--font-family-body);
395
395
  font-size: var(--text-label-size);
396
396
  line-height: var(--text-label-leading);
397
397
  }
398
398
 
399
- .astryx-text.code {
399
+ .astryx-text[data-type="code"] {
400
400
  font-family: var(--font-family-code);
401
401
  font-size: var(--text-code-size);
402
402
  line-height: var(--text-code-leading);
403
403
  }
404
404
 
405
- .astryx-text.supporting {
405
+ .astryx-text[data-type="supporting"] {
406
406
  font-family: var(--font-family-body);
407
407
  font-size: var(--text-supporting-size);
408
408
  line-height: var(--text-supporting-leading);
409
409
  }
410
410
 
411
- .astryx-text.display-1 {
411
+ .astryx-text[data-type="display-1"] {
412
412
  font-family: var(--font-family-heading);
413
413
  font-size: var(--text-display-1-size);
414
414
  line-height: var(--text-display-1-leading);
415
415
  }
416
416
 
417
- .astryx-text.display-2 {
417
+ .astryx-text[data-type="display-2"] {
418
418
  font-family: var(--font-family-heading);
419
419
  font-size: var(--text-display-2-size);
420
420
  line-height: var(--text-display-2-leading);
421
421
  }
422
422
 
423
- .astryx-text.display-3 {
423
+ .astryx-text[data-type="display-3"] {
424
424
  font-family: var(--font-family-heading);
425
425
  font-size: var(--text-display-3-size);
426
426
  line-height: var(--text-display-3-leading);
@@ -431,88 +431,88 @@
431
431
  --_button-radius: var(--radius-full);
432
432
  }
433
433
 
434
- .astryx-button.secondary {
434
+ .astryx-button[data-variant="secondary"] {
435
435
  background-color: transparent;
436
436
  border-width: 1.5px;
437
437
  border-style: solid;
438
438
  border-color: var(--color-border-emphasized);
439
439
  }
440
440
 
441
- .astryx-button.secondary:hover:where(:not(:disabled,[aria-disabled="true"])) {
441
+ .astryx-button[data-variant="secondary"]:hover:where(:not(:disabled,[aria-disabled="true"])) {
442
442
  background-color: var(--color-neutral);
443
443
  }
444
444
 
445
- .astryx-button.destructive {
445
+ .astryx-button[data-variant="destructive"] {
446
446
  background-color: var(--color-background-red);
447
447
  color: var(--color-text-red);
448
448
  }
449
449
 
450
- .astryx-badge.info {
450
+ .astryx-badge[data-variant="info"] {
451
451
  background-color: var(--color-background-blue);
452
452
  color: var(--color-text-blue);
453
453
  }
454
454
 
455
- .astryx-badge.neutral {
455
+ .astryx-badge[data-variant="neutral"] {
456
456
  background-color: var(--color-background-gray);
457
457
  color: var(--color-text-gray);
458
458
  }
459
459
 
460
- .astryx-badge.success {
460
+ .astryx-badge[data-variant="success"] {
461
461
  background-color: var(--color-background-green);
462
462
  color: var(--color-text-green);
463
463
  }
464
464
 
465
- .astryx-badge.warning {
465
+ .astryx-badge[data-variant="warning"] {
466
466
  background-color: var(--color-background-yellow);
467
467
  color: var(--color-text-yellow);
468
468
  }
469
469
 
470
- .astryx-badge.error {
470
+ .astryx-badge[data-variant="error"] {
471
471
  background-color: var(--color-background-red);
472
472
  color: var(--color-text-red);
473
473
  }
474
474
 
475
- .astryx-banner.info {
475
+ .astryx-banner[data-status="info"] {
476
476
  --color-accent-muted: var(--color-background-blue);
477
477
  --color-text-primary: var(--color-text-blue);
478
478
  --color-text-secondary: var(--color-text-blue);
479
479
  --color-accent: var(--color-text-blue);
480
480
  }
481
481
 
482
- .astryx-banner.success {
482
+ .astryx-banner[data-status="success"] {
483
483
  --color-success-muted: var(--color-background-green);
484
484
  --color-text-primary: var(--color-text-green);
485
485
  --color-text-secondary: var(--color-text-green);
486
486
  --color-success: var(--color-text-green);
487
487
  }
488
488
 
489
- .astryx-banner.warning {
489
+ .astryx-banner[data-status="warning"] {
490
490
  --color-warning-muted: var(--color-background-yellow);
491
491
  --color-text-primary: var(--color-text-yellow);
492
492
  --color-text-secondary: var(--color-text-yellow);
493
493
  --color-warning: var(--color-text-yellow);
494
494
  }
495
495
 
496
- .astryx-banner.error {
496
+ .astryx-banner[data-status="error"] {
497
497
  --color-error-muted: var(--color-background-red);
498
498
  --color-text-primary: var(--color-text-red);
499
499
  --color-text-secondary: var(--color-text-red);
500
500
  --color-error: var(--color-text-red);
501
501
  }
502
502
 
503
- .astryx-progressbar-fill.accent {
503
+ .astryx-progressbar-fill[data-variant="accent"] {
504
504
  background-color: light-dark(#d7e4f5, #a0acbc);
505
505
  }
506
506
 
507
- .astryx-progressbar-fill.success {
507
+ .astryx-progressbar-fill[data-variant="success"] {
508
508
  background-color: light-dark(#d0e9ce, #9ab298);
509
509
  }
510
510
 
511
- .astryx-progressbar-fill.warning {
511
+ .astryx-progressbar-fill[data-variant="warning"] {
512
512
  background-color: light-dark(#f4e1b7, #bbaa82);
513
513
  }
514
514
 
515
- .astryx-progressbar-fill.error {
515
+ .astryx-progressbar-fill[data-variant="error"] {
516
516
  background-color: light-dark(#f9dcd7, #c0a5a0);
517
517
  }
518
518
 
@@ -524,123 +524,123 @@
524
524
  --color-background-gray: var(--color-skeleton);
525
525
  }
526
526
 
527
- .astryx-field-status.success {
527
+ .astryx-field-status[data-type="success"] {
528
528
  background-color: var(--color-background-green);
529
529
  }
530
530
 
531
- .astryx-field-status.warning {
531
+ .astryx-field-status[data-type="warning"] {
532
532
  background-color: var(--color-background-yellow);
533
533
  }
534
534
 
535
- .astryx-field-status.error {
535
+ .astryx-field-status[data-type="error"] {
536
536
  background-color: var(--color-background-red);
537
537
  }
538
538
 
539
- .astryx-text-input.success {
539
+ .astryx-text-input[data-status="success"] {
540
540
  --color-success: light-dark(#7f977e, #99b298);
541
541
  }
542
542
 
543
- .astryx-text-input.warning {
543
+ .astryx-text-input[data-status="warning"] {
544
544
  --color-warning: light-dark(#9f8f68, #bbaa81);
545
545
  }
546
546
 
547
- .astryx-text-input.error {
547
+ .astryx-text-input[data-status="error"] {
548
548
  --color-error: light-dark(#a58b86, #c0a5a1);
549
549
  }
550
550
 
551
- .astryx-textarea.success {
551
+ .astryx-textarea[data-status="success"] {
552
552
  --color-success: light-dark(#7f977e, #99b298);
553
553
  }
554
554
 
555
- .astryx-textarea.warning {
555
+ .astryx-textarea[data-status="warning"] {
556
556
  --color-warning: light-dark(#9f8f68, #bbaa81);
557
557
  }
558
558
 
559
- .astryx-textarea.error {
559
+ .astryx-textarea[data-status="error"] {
560
560
  --color-error: light-dark(#a58b86, #c0a5a1);
561
561
  }
562
562
 
563
- .astryx-number-input.success {
563
+ .astryx-number-input[data-status="success"] {
564
564
  --color-success: light-dark(#7f977e, #99b298);
565
565
  }
566
566
 
567
- .astryx-number-input.warning {
567
+ .astryx-number-input[data-status="warning"] {
568
568
  --color-warning: light-dark(#9f8f68, #bbaa81);
569
569
  }
570
570
 
571
- .astryx-number-input.error {
571
+ .astryx-number-input[data-status="error"] {
572
572
  --color-error: light-dark(#a58b86, #c0a5a1);
573
573
  }
574
574
 
575
- .astryx-date-input.success {
575
+ .astryx-date-input[data-status="success"] {
576
576
  --color-success: light-dark(#7f977e, #99b298);
577
577
  }
578
578
 
579
- .astryx-date-input.warning {
579
+ .astryx-date-input[data-status="warning"] {
580
580
  --color-warning: light-dark(#9f8f68, #bbaa81);
581
581
  }
582
582
 
583
- .astryx-date-input.error {
583
+ .astryx-date-input[data-status="error"] {
584
584
  --color-error: light-dark(#a58b86, #c0a5a1);
585
585
  }
586
586
 
587
- .astryx-time-input.success {
587
+ .astryx-time-input[data-status="success"] {
588
588
  --color-success: light-dark(#7f977e, #99b298);
589
589
  }
590
590
 
591
- .astryx-time-input.warning {
591
+ .astryx-time-input[data-status="warning"] {
592
592
  --color-warning: light-dark(#9f8f68, #bbaa81);
593
593
  }
594
594
 
595
- .astryx-time-input.error {
595
+ .astryx-time-input[data-status="error"] {
596
596
  --color-error: light-dark(#a58b86, #c0a5a1);
597
597
  }
598
598
 
599
- .astryx-selector.success {
599
+ .astryx-selector[data-status="success"] {
600
600
  --color-success: light-dark(#7f977e, #99b298);
601
601
  }
602
602
 
603
- .astryx-selector.warning {
603
+ .astryx-selector[data-status="warning"] {
604
604
  --color-warning: light-dark(#9f8f68, #bbaa81);
605
605
  }
606
606
 
607
- .astryx-selector.error {
607
+ .astryx-selector[data-status="error"] {
608
608
  --color-error: light-dark(#a58b86, #c0a5a1);
609
609
  }
610
610
 
611
- .astryx-multi-selector.success {
611
+ .astryx-multi-selector[data-status="success"] {
612
612
  --color-success: light-dark(#7f977e, #99b298);
613
613
  }
614
614
 
615
- .astryx-multi-selector.warning {
615
+ .astryx-multi-selector[data-status="warning"] {
616
616
  --color-warning: light-dark(#9f8f68, #bbaa81);
617
617
  }
618
618
 
619
- .astryx-multi-selector.error {
619
+ .astryx-multi-selector[data-status="error"] {
620
620
  --color-error: light-dark(#a58b86, #c0a5a1);
621
621
  }
622
622
 
623
- .astryx-typeahead.success {
623
+ .astryx-typeahead[data-status="success"] {
624
624
  --color-success: light-dark(#7f977e, #99b298);
625
625
  }
626
626
 
627
- .astryx-typeahead.warning {
627
+ .astryx-typeahead[data-status="warning"] {
628
628
  --color-warning: light-dark(#9f8f68, #bbaa81);
629
629
  }
630
630
 
631
- .astryx-typeahead.error {
631
+ .astryx-typeahead[data-status="error"] {
632
632
  --color-error: light-dark(#a58b86, #c0a5a1);
633
633
  }
634
634
 
635
- .astryx-tokenizer.success {
635
+ .astryx-tokenizer[data-status="success"] {
636
636
  --color-success: light-dark(#7f977e, #99b298);
637
637
  }
638
638
 
639
- .astryx-tokenizer.warning {
639
+ .astryx-tokenizer[data-status="warning"] {
640
640
  --color-warning: light-dark(#9f8f68, #bbaa81);
641
641
  }
642
642
 
643
- .astryx-tokenizer.error {
643
+ .astryx-tokenizer[data-status="error"] {
644
644
  --color-error: light-dark(#a58b86, #c0a5a1);
645
645
  }
646
646
 
@@ -652,47 +652,55 @@
652
652
  --astryx-section-padding: var(--spacing-3);
653
653
  }
654
654
 
655
- .astryx-text.primary { color: var(--color-text-primary); }
655
+ .astryx-text[data-color="primary"] { color: var(--color-text-primary); }
656
+
657
+ .astryx-heading[data-color="primary"] { color: var(--color-text-primary); }
658
+
659
+ .astryx-text[data-color="secondary"] { color: var(--color-text-secondary); }
660
+
661
+ .astryx-heading[data-color="secondary"] { color: var(--color-text-secondary); }
662
+
663
+ .astryx-text[data-color="disabled"] { color: var(--color-text-disabled); }
656
664
 
657
- .astryx-heading.primary { color: var(--color-text-primary); }
665
+ .astryx-heading[data-color="disabled"] { color: var(--color-text-disabled); }
658
666
 
659
- .astryx-text.secondary { color: var(--color-text-secondary); }
667
+ .astryx-text[data-color="placeholder"] { color: var(--color-text-secondary); }
660
668
 
661
- .astryx-heading.secondary { color: var(--color-text-secondary); }
669
+ .astryx-heading[data-color="placeholder"] { color: var(--color-text-secondary); }
662
670
 
663
- .astryx-text.disabled { color: var(--color-text-disabled); }
671
+ .astryx-text[data-color="accent"] { color: var(--color-text-accent); }
664
672
 
665
- .astryx-heading.disabled { color: var(--color-text-disabled); }
673
+ .astryx-heading[data-color="accent"] { color: var(--color-text-accent); }
666
674
 
667
- .astryx-text.placeholder { color: var(--color-text-secondary); }
675
+ .astryx-text[data-size="4xs"] { font-size: var(--font-size-4xs); }
668
676
 
669
- .astryx-heading.placeholder { color: var(--color-text-secondary); }
677
+ .astryx-text[data-size="3xs"] { font-size: var(--font-size-3xs); }
670
678
 
671
- .astryx-text.accent { color: var(--color-text-accent); }
679
+ .astryx-text[data-size="2xs"] { font-size: var(--font-size-2xs); }
672
680
 
673
- .astryx-heading.accent { color: var(--color-text-accent); }
681
+ .astryx-text[data-size="xsm"] { font-size: var(--font-size-xs); }
674
682
 
675
- .astryx-text.size-4xs { font-size: var(--font-size-4xs); }
683
+ .astryx-text[data-size="sm"] { font-size: var(--font-size-sm); }
676
684
 
677
- .astryx-text.size-3xs { font-size: var(--font-size-3xs); }
685
+ .astryx-text[data-size="base"] { font-size: var(--font-size-base); }
678
686
 
679
- .astryx-text.size-2xs { font-size: var(--font-size-2xs); }
687
+ .astryx-text[data-size="lg"] { font-size: var(--font-size-lg); }
680
688
 
681
- .astryx-text.xsm { font-size: var(--font-size-xs); }
689
+ .astryx-text[data-size="xl"] { font-size: var(--font-size-xl); }
682
690
 
683
- .astryx-text.sm { font-size: var(--font-size-sm); }
691
+ .astryx-text[data-size="2xl"] { font-size: var(--font-size-2xl); }
684
692
 
685
- .astryx-text.base { font-size: var(--font-size-base); }
693
+ .astryx-text[data-size="3xl"] { font-size: var(--font-size-3xl); }
686
694
 
687
- .astryx-text.lg { font-size: var(--font-size-lg); }
695
+ .astryx-text[data-size="4xl"] { font-size: var(--font-size-4xl); }
688
696
 
689
- .astryx-text.xl { font-size: var(--font-size-xl); }
697
+ .astryx-heading[data-weight="normal"] { font-weight: var(--font-weight-normal); }
690
698
 
691
- .astryx-text.size-2xl { font-size: var(--font-size-2xl); }
699
+ .astryx-heading[data-weight="medium"] { font-weight: var(--font-weight-medium); }
692
700
 
693
- .astryx-text.size-3xl { font-size: var(--font-size-3xl); }
701
+ .astryx-heading[data-weight="semibold"] { font-weight: var(--font-weight-semibold); }
694
702
 
695
- .astryx-text.size-4xl { font-size: var(--font-size-4xl); }
703
+ .astryx-heading[data-weight="bold"] { font-weight: var(--font-weight-bold); }
696
704
  }
697
705
  }
698
706
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@astryxdesign/theme-stone",
3
- "version": "0.5.3",
3
+ "version": "0.5.4-canary.0fee3bc",
4
4
  "displayName": "Stone Theme",
5
5
  "private": false,
6
6
  "description": "Warm stone and slate, earthy and understated, with just enough character to feel handcrafted.",
@@ -49,11 +49,11 @@
49
49
  "lucide-react": "^1.18.0"
50
50
  },
51
51
  "peerDependencies": {
52
- "@astryxdesign/core": "0.5.3",
52
+ "@astryxdesign/core": "0.5.4-canary.0fee3bc",
53
53
  "react": ">=19"
54
54
  },
55
55
  "devDependencies": {
56
- "@astryxdesign/cli": "0.5.3"
56
+ "@astryxdesign/cli": "0.5.4-canary.0fee3bc"
57
57
  },
58
58
  "module": "./dist/source.mjs",
59
59
  "scripts": {
@@ -1,27 +0,0 @@
1
- /**
2
- * @generated by `astryx theme build` — do not edit manually.
3
- * Source: src/stoneTheme.ts
4
- * Command: astryx theme build src/stoneTheme.ts --out dist/theme.css
5
- * CLI: @astryxdesign/cli@0.5.3
6
- * Core: @astryxdesign/core@0.5.3
7
- */
8
-
9
- // Generated by astryx theme build
10
- export {};
11
-
12
- declare module '@astryxdesign/core/Heading' {
13
- interface HeadingTypeMap {
14
- 'display-1': true;
15
- 'display-2': true;
16
- 'display-3': true;
17
- }
18
- }
19
-
20
- declare module '@astryxdesign/core/ProgressBar' {
21
- interface ProgressBarVariantMap {
22
- 'accent': true;
23
- 'success': true;
24
- 'warning': true;
25
- 'error': true;
26
- }
27
- }