@medway-ui/core 1.10.2 → 1.11.1

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.
@@ -314,6 +314,42 @@
314
314
  --color-state-active: var(--color-primary-16);
315
315
  --color-state-error: var(--color-red-16);
316
316
 
317
+ /* === Base feedback success colors === */
318
+ --color-feedback-success-foreground: var(--color-green-darken-3);
319
+ --color-feedback-success-foreground-emphasis: var(--color-green-darken-4);
320
+ --color-feedback-success-foreground-onfill: var(--color-white);
321
+ --color-feedback-success-stroke: var(--color-green);
322
+ --color-feedback-success-stroke-emphasis: var(--color-green-darken-2);
323
+ --color-feedback-success-background-fill: var(--color-green-darken-2);
324
+ --color-feedback-success-background-fill-emphasis: var(--color-green-darken-3);
325
+ --color-feedback-success-background-soft: var(--color-green-16);
326
+ --color-feedback-success-background-soft-emphasis: var(--color-green-12);
327
+ --color-feedback-success-background-soft-muted: var(--color-green-6);
328
+
329
+ /* === Base feedback error colors === */
330
+ --color-feedback-error-foreground: var(--color-red-darken-2);
331
+ --color-feedback-error-foreground-emphasis: var(--color-red-darken-3);
332
+ --color-feedback-error-foreground-onfill: var(--color-white);
333
+ --color-feedback-error-stroke: var(--color-red);
334
+ --color-feedback-error-stroke-emphasis: var(--color-red-darken-1);
335
+ --color-feedback-error-background-fill: var(--color-red-darken-1);
336
+ --color-feedback-error-background-fill-emphasis: var(--color-red-darken-2);
337
+ --color-feedback-error-background-soft: var(--color-red-12);
338
+ --color-feedback-error-background-soft-emphasis: var(--color-red-8);
339
+ --color-feedback-error-background-soft-muted: var(--color-red-4);
340
+
341
+ /* === Base feedback warning colors === */
342
+ --color-feedback-warning-foreground: var(--color-yellow-darken-4);
343
+ --color-feedback-warning-foreground-emphasis: var(--color-yellow-darken-5);
344
+ --color-feedback-warning-foreground-onfill: var(--color-yellow-darken-5);
345
+ --color-feedback-warning-stroke: var(--color-yellow-lighten-1);
346
+ --color-feedback-warning-stroke-emphasis: var(--color-yellow);
347
+ --color-feedback-warning-background-fill: var(--color-yellow-lighten-2);
348
+ --color-feedback-warning-background-fill-emphasis: var(--color-yellow);
349
+ --color-feedback-warning-background-soft: var(--color-yellow-24);
350
+ --color-feedback-warning-background-soft-emphasis: var(--color-yellow-16);
351
+ --color-feedback-warning-background-soft-muted: var(--color-yellow-8);
352
+
317
353
  /* === Base surfacecolors === */
318
354
  --color-surface-elevated: var(--color-white);
319
355
  --color-surface-card: var(--color-white);
@@ -592,6 +628,42 @@
592
628
  --color-state-active: var(--color-white-16);
593
629
  --color-state-error: var(--color-red-16);
594
630
 
631
+ /* === Base feedback success colors === */
632
+ --color-feedback-success-foreground: var(--color-green-lighten-4);
633
+ --color-feedback-success-foreground-emphasis: var(--color-green-lighten-6);
634
+ --color-feedback-success-foreground-onfill: var(--color-white);
635
+ --color-feedback-success-stroke: var(--color-green-darken-2);
636
+ --color-feedback-success-stroke-emphasis: var(--color-green);
637
+ --color-feedback-success-background-fill: var(--color-green-darken-3);
638
+ --color-feedback-success-background-fill-emphasis: var(--color-green-darken-2);
639
+ --color-feedback-success-background-soft: var(--color-green-8);
640
+ --color-feedback-success-background-soft-emphasis: var(--color-green-24);
641
+ --color-feedback-success-background-soft-muted: var(--color-green-16);
642
+
643
+ /* === Base feedback error colors === */
644
+ --color-feedback-error-foreground: var(--color-red-lighten-3);
645
+ --color-feedback-error-foreground-emphasis: var(--color-red-lighten-4);
646
+ --color-feedback-error-foreground-onfill: var(--color-white);
647
+ --color-feedback-error-stroke: var(--color-red-darken-1);
648
+ --color-feedback-error-stroke-emphasis: var(--color-red);
649
+ --color-feedback-error-background-fill: var(--color-red-darken-2);
650
+ --color-feedback-error-background-fill-emphasis: var(--color-red-darken-1);
651
+ --color-feedback-error-background-soft: var(--color-red-12);
652
+ --color-feedback-error-background-soft-emphasis: var(--color-red-24);
653
+ --color-feedback-error-background-soft-muted: var(--color-red-16);
654
+
655
+ /* === Base feedback warning colors === */
656
+ --color-feedback-warning-foreground: var(--color-yellow-lighten-2);
657
+ --color-feedback-warning-foreground-emphasis: var(--color-yellow-lighten-4);
658
+ --color-feedback-warning-foreground-onfill: var(--color-yellow-darken-5);
659
+ --color-feedback-warning-stroke: var(--color-yellow);
660
+ --color-feedback-warning-stroke-emphasis: var(--color-yellow-lighten-1);
661
+ --color-feedback-warning-background-fill: var(--color-yellow);
662
+ --color-feedback-warning-background-fill-emphasis: var(--color-yellow-lighten-2);
663
+ --color-feedback-warning-background-soft: var(--color-yellow-8);
664
+ --color-feedback-warning-background-soft-emphasis: var(--color-yellow-24);
665
+ --color-feedback-warning-background-soft-muted: var(--color-yellow-16);
666
+
595
667
  /* === Base content colors === */
596
668
  --color-content-title: var(--color-white);
597
669
  --color-content-paragraph: var(--color-gray-150);
@@ -18,6 +18,44 @@ export const colors = {
18
18
  active: "var(--color-state-active)",
19
19
  error: "var(--color-state-error)",
20
20
  },
21
+ feedback: {
22
+ success: {
23
+ foreground: "var(--color-feedback-success-foreground)",
24
+ "foreground-emphasis": "var(--color-feedback-success-foreground-emphasis)",
25
+ "foreground-onfill": "var(--color-feedback-success-foreground-onfill)",
26
+ stroke: "var(--color-feedback-success-stroke)",
27
+ "stroke-emphasis": "var(--color-feedback-success-stroke-emphasis)",
28
+ "background-fill": "var(--color-feedback-success-background-fill)",
29
+ "background-fill-emphasis": "var(--color-feedback-success-background-fill-emphasis)",
30
+ "background-soft": "var(--color-feedback-success-background-soft)",
31
+ "background-soft-emphasis": "var(--color-feedback-success-background-soft-emphasis)",
32
+ "background-soft-muted": "var(--color-feedback-success-background-soft-muted)",
33
+ },
34
+ error: {
35
+ foreground: "var(--color-feedback-error-foreground)",
36
+ "foreground-emphasis": "var(--color-feedback-error-foreground-emphasis)",
37
+ "foreground-onfill": "var(--color-feedback-error-foreground-onfill)",
38
+ stroke: "var(--color-feedback-error-stroke)",
39
+ "stroke-emphasis": "var(--color-feedback-error-stroke-emphasis)",
40
+ "background-fill": "var(--color-feedback-error-background-fill)",
41
+ "background-fill-emphasis": "var(--color-feedback-error-background-fill-emphasis)",
42
+ "background-soft": "var(--color-feedback-error-background-soft)",
43
+ "background-soft-emphasis": "var(--color-feedback-error-background-soft-emphasis)",
44
+ "background-soft-muted": "var(--color-feedback-error-background-soft-muted)",
45
+ },
46
+ warning: {
47
+ foreground: "var(--color-feedback-warning-foreground)",
48
+ "foreground-emphasis": "var(--color-feedback-warning-foreground-emphasis)",
49
+ "foreground-onfill": "var(--color-feedback-warning-foreground-onfill)",
50
+ stroke: "var(--color-feedback-warning-stroke)",
51
+ "stroke-emphasis": "var(--color-feedback-warning-stroke-emphasis)",
52
+ "background-fill": "var(--color-feedback-warning-background-fill)",
53
+ "background-fill-emphasis": "var(--color-feedback-warning-background-fill-emphasis)",
54
+ "background-soft": "var(--color-feedback-warning-background-soft)",
55
+ "background-soft-emphasis": "var(--color-feedback-warning-background-soft-emphasis)",
56
+ "background-soft-muted": "var(--color-feedback-warning-background-soft-muted)",
57
+ },
58
+ },
21
59
  surface: {
22
60
  elevated: "var(--color-surface-elevated)",
23
61
  card: "var(--color-surface-card)",
@@ -611,6 +649,14 @@ export const keyframes = {
611
649
  height: "var(--radix-collapsible-content-height)",
612
650
  },
613
651
  },
652
+ shine: {
653
+ from: {
654
+ backgroundPosition: "200% 0",
655
+ },
656
+ to: {
657
+ backgroundPosition: "-200% 0",
658
+ },
659
+ },
614
660
  "collapsible-up": {
615
661
  from: {
616
662
  height: "var(--radix-collapsible-content-height)",
@@ -644,4 +690,5 @@ export const animation = {
644
690
  "collapsible-up": "collapsible-up 0.2s ease-out",
645
691
  "fade-in": "fade-in 0.2s ease-out",
646
692
  "fade-out": "fade-out 0.2s ease-out",
693
+ shine: "shine 2s infinite linear",
647
694
  };