@medway-ui/core 1.1.0 → 1.2.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/assets/css/tokens.css +126 -0
- package/dist/assets/js/tokens.ts +65 -0
- package/dist/index.d.mts +1 -2
- package/dist/index.d.ts +1 -2
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
|
@@ -437,6 +437,69 @@
|
|
|
437
437
|
--color-secondary-background-soft-emphasis: var(--color-secondary-8);
|
|
438
438
|
--color-secondary-background-soft-muted: var(--color-secondary-6);
|
|
439
439
|
|
|
440
|
+
/* === Base gradient base === */
|
|
441
|
+
--color-gradient-base-blur-1: var(--color-primary-lighten-6);
|
|
442
|
+
--color-gradient-base-blur-2: var(--color-secondary-lighten-3);
|
|
443
|
+
--color-gradient-base-blur-3: var(--color-secondary-lighten-6);
|
|
444
|
+
--color-gradient-base-bg-1: var(--color-gray-50);
|
|
445
|
+
--color-gradient-base-bg-2: var(--color-gray-10);
|
|
446
|
+
|
|
447
|
+
/* === Base gradient cir === */
|
|
448
|
+
--color-gradient-cir-blur-1: var(--color-cir-lighten-3);
|
|
449
|
+
--color-gradient-cir-blur-2: var(--color-secondary-lighten-1);
|
|
450
|
+
--color-gradient-cir-blur-3: var(--color-cir-darken-1);
|
|
451
|
+
--color-gradient-cir-bg-1: var(--color-cir-lighten-6);
|
|
452
|
+
--color-gradient-cir-bg-2: var(--color-gray-10);
|
|
453
|
+
|
|
454
|
+
/* === Base gradient cm === */
|
|
455
|
+
--color-gradient-cm-blur-1: var(--color-cm-lighten-4);
|
|
456
|
+
--color-gradient-cm-blur-2: var(--color-cm-lighten-2);
|
|
457
|
+
--color-gradient-cm-blur-3: var(--color-cm);
|
|
458
|
+
--color-gradient-cm-bg-1: var(--color-cm-lighten-6);
|
|
459
|
+
--color-gradient-cm-bg-2: var(--color-gray-10);
|
|
460
|
+
|
|
461
|
+
/* === Base gradient go === */
|
|
462
|
+
--color-gradient-go-blur-1: var(--color-go-lighten-6);
|
|
463
|
+
--color-gradient-go-blur-2: var(--color-go-lighten-4);
|
|
464
|
+
--color-gradient-go-blur-3: var(--color-go-lighten-2);
|
|
465
|
+
--color-gradient-go-bg-1: var(--color-go-lighten-6);
|
|
466
|
+
--color-gradient-go-bg-2: var(--color-gray-10);
|
|
467
|
+
|
|
468
|
+
/* === Base gradient ped === */
|
|
469
|
+
--color-gradient-ped-blur-1: var(--color-ped-lighten-4);
|
|
470
|
+
--color-gradient-ped-blur-2: var(--color-ped-lighten-2);
|
|
471
|
+
--color-gradient-ped-blur-3: var(--color-ped);
|
|
472
|
+
--color-gradient-ped-bg-1: var(--color-ped-lighten-5);
|
|
473
|
+
--color-gradient-ped-bg-2: var(--color-gray-10);
|
|
474
|
+
|
|
475
|
+
/* === Base gradient prev === */
|
|
476
|
+
--color-gradient-prev-blur-1: var(--color-prev-lighten-5);
|
|
477
|
+
--color-gradient-prev-blur-2: var(--color-prev-lighten-3);
|
|
478
|
+
--color-gradient-prev-blur-3: var(--color-prev);
|
|
479
|
+
--color-gradient-prev-bg-1: var(--color-prev-lighten-6);
|
|
480
|
+
--color-gradient-prev-bg-2: var(--color-gray-10);
|
|
481
|
+
|
|
482
|
+
/* === Base gradient r1 === */
|
|
483
|
+
--color-gradient-r1-blur-1: var(--color-secondary);
|
|
484
|
+
--color-gradient-r1-blur-2: var(--color-primary-lighten-3);
|
|
485
|
+
--color-gradient-r1-blur-3: var(--color-primary-lighten-5);
|
|
486
|
+
--color-gradient-r1-bg-1: var(--color-primary);
|
|
487
|
+
--color-gradient-r1-bg-2: var(--color-primary-lighten-1);
|
|
488
|
+
|
|
489
|
+
/* === Base gradient rplus === */
|
|
490
|
+
--color-gradient-rplus-blur-1: var(--color-primary-lighten-1);
|
|
491
|
+
--color-gradient-rplus-blur-2: var(--color-primary-lighten-3);
|
|
492
|
+
--color-gradient-rplus-blur-3: var(--color-primary-lighten-5);
|
|
493
|
+
--color-gradient-rplus-bg-1: var(--color-primary-lighten-1);
|
|
494
|
+
--color-gradient-rplus-bg-2: var(--color-primary);
|
|
495
|
+
|
|
496
|
+
/* === Base gradient pt === */
|
|
497
|
+
--color-gradient-pt-blur-1: var(--color-secondary);
|
|
498
|
+
--color-gradient-pt-blur-2: var(--color-secondary-darken-2);
|
|
499
|
+
--color-gradient-pt-blur-3: var(--color-secondary-darken-4);
|
|
500
|
+
--color-gradient-pt-bg-1: var(--color-gray-600);
|
|
501
|
+
--color-gradient-pt-bg-2: var(--color-gray-450);
|
|
502
|
+
|
|
440
503
|
/* === Typography fontfamily === */
|
|
441
504
|
--font-sans:
|
|
442
505
|
"Montserrat", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
|
|
@@ -651,6 +714,69 @@
|
|
|
651
714
|
--color-secondary-background-soft: var(--color-secondary-8);
|
|
652
715
|
--color-secondary-background-soft-emphasis: var(--color-secondary-24);
|
|
653
716
|
--color-secondary-background-soft-muted: var(--color-secondary-12);
|
|
717
|
+
|
|
718
|
+
/* === Dark gradient base === */
|
|
719
|
+
--color-gradient-base-blur-1: var(--color-primary-lighten-3);
|
|
720
|
+
--color-gradient-base-blur-2: var(--color-secondary-darken-1);
|
|
721
|
+
--color-gradient-base-blur-3: var(--color-secondary);
|
|
722
|
+
--color-gradient-base-bg-1: var(--color-primary-darken-1);
|
|
723
|
+
--color-gradient-base-bg-2: var(--color-primary-darken-2);
|
|
724
|
+
|
|
725
|
+
/* === Dark gradient cir === */
|
|
726
|
+
--color-gradient-cir-blur-1: var(--color-cir-darken-1);
|
|
727
|
+
--color-gradient-cir-blur-2: var(--color-cir-darken-2);
|
|
728
|
+
--color-gradient-cir-blur-3: var(--color-cir-darken-3);
|
|
729
|
+
--color-gradient-cir-bg-1: var(--color-cir-darken-5);
|
|
730
|
+
--color-gradient-cir-bg-2: var(--color-cir-darken-6);
|
|
731
|
+
|
|
732
|
+
/* === Dark gradient cm === */
|
|
733
|
+
--color-gradient-cm-blur-1: var(--color-cm);
|
|
734
|
+
--color-gradient-cm-blur-2: var(--color-cm-darken-1);
|
|
735
|
+
--color-gradient-cm-blur-3: var(--color-cm-darken-2);
|
|
736
|
+
--color-gradient-cm-bg-1: var(--color-cm-darken-4);
|
|
737
|
+
--color-gradient-cm-bg-2: var(--color-cm-darken-6);
|
|
738
|
+
|
|
739
|
+
/* === Dark gradient go === */
|
|
740
|
+
--color-gradient-go-blur-1: var(--color-go-lighten-2);
|
|
741
|
+
--color-gradient-go-blur-2: var(--color-go);
|
|
742
|
+
--color-gradient-go-blur-3: var(--color-go-darken-2);
|
|
743
|
+
--color-gradient-go-bg-1: var(--color-go-darken-3);
|
|
744
|
+
--color-gradient-go-bg-2: var(--color-go-darken-5);
|
|
745
|
+
|
|
746
|
+
/* === Dark gradient ped === */
|
|
747
|
+
--color-gradient-ped-blur-1: var(--color-ped);
|
|
748
|
+
--color-gradient-ped-blur-2: var(--color-ped-darken-3);
|
|
749
|
+
--color-gradient-ped-blur-3: var(--color-ped-darken-5);
|
|
750
|
+
--color-gradient-ped-bg-1: var(--color-ped-darken-4);
|
|
751
|
+
--color-gradient-ped-bg-2: var(--color-yellow-darken-6);
|
|
752
|
+
|
|
753
|
+
/* === Dark gradient prev === */
|
|
754
|
+
--color-gradient-prev-blur-1: var(--color-prev-lighten-1);
|
|
755
|
+
--color-gradient-prev-blur-2: var(--color-prev);
|
|
756
|
+
--color-gradient-prev-blur-3: var(--color-prev-darken-1);
|
|
757
|
+
--color-gradient-prev-bg-1: var(--color-prev-darken-2);
|
|
758
|
+
--color-gradient-prev-bg-2: var(--color-prev-darken-4);
|
|
759
|
+
|
|
760
|
+
/* === Dark gradient r1 === */
|
|
761
|
+
--color-gradient-r1-blur-1: var(--color-secondary);
|
|
762
|
+
--color-gradient-r1-blur-2: var(--color-primary-lighten-1);
|
|
763
|
+
--color-gradient-r1-blur-3: var(--color-primary-lighten-2);
|
|
764
|
+
--color-gradient-r1-bg-1: var(--color-primary);
|
|
765
|
+
--color-gradient-r1-bg-2: var(--color-primary-darken-2);
|
|
766
|
+
|
|
767
|
+
/* === Dark gradient rplus === */
|
|
768
|
+
--color-gradient-rplus-blur-1: var(--color-primary-lighten-5);
|
|
769
|
+
--color-gradient-rplus-blur-2: var(--color-primary-lighten-3);
|
|
770
|
+
--color-gradient-rplus-blur-3: var(--color-primary-lighten-1);
|
|
771
|
+
--color-gradient-rplus-bg-1: var(--color-primary);
|
|
772
|
+
--color-gradient-rplus-bg-2: var(--color-primary-darken-2);
|
|
773
|
+
|
|
774
|
+
/* === Dark gradient pt === */
|
|
775
|
+
--color-gradient-pt-blur-1: var(--color-secondary);
|
|
776
|
+
--color-gradient-pt-blur-2: var(--color-secondary-darken-1);
|
|
777
|
+
--color-gradient-pt-blur-3: var(--color-secondary-darken-3);
|
|
778
|
+
--color-gradient-pt-bg-1: var(--color-gray-800);
|
|
779
|
+
--color-gradient-pt-bg-2: var(--color-gray-900);
|
|
654
780
|
}
|
|
655
781
|
|
|
656
782
|
@layer components {
|
package/dist/assets/js/tokens.ts
CHANGED
|
@@ -417,6 +417,71 @@ export const colors = {
|
|
|
417
417
|
"var(--color-secondary-background-soft-emphasis)",
|
|
418
418
|
"background-soft-muted": "var(--color-secondary-background-soft-muted)",
|
|
419
419
|
},
|
|
420
|
+
gradient: {
|
|
421
|
+
base: {
|
|
422
|
+
"blur-1": "var(--color-gradient-base-blur-1)",
|
|
423
|
+
"blur-2": "var(--color-gradient-base-blur-2)",
|
|
424
|
+
"blur-3": "var(--color-gradient-base-blur-3)",
|
|
425
|
+
"bg-1": "var(--color-gradient-base-bg-1)",
|
|
426
|
+
"bg-2": "var(--color-gradient-base-bg-2)",
|
|
427
|
+
},
|
|
428
|
+
cir: {
|
|
429
|
+
"blur-1": "var(--color-gradient-cir-blur-1)",
|
|
430
|
+
"blur-2": "var(--color-gradient-cir-blur-2)",
|
|
431
|
+
"blur-3": "var(--color-gradient-cir-blur-3)",
|
|
432
|
+
"bg-1": "var(--color-gradient-cir-bg-1)",
|
|
433
|
+
"bg-2": "var(--color-gradient-cir-bg-2)",
|
|
434
|
+
},
|
|
435
|
+
cm: {
|
|
436
|
+
"blur-1": "var(--color-gradient-cm-blur-1)",
|
|
437
|
+
"blur-2": "var(--color-gradient-cm-blur-2)",
|
|
438
|
+
"blur-3": "var(--color-gradient-cm-blur-3)",
|
|
439
|
+
"bg-1": "var(--color-gradient-cm-bg-1)",
|
|
440
|
+
"bg-2": "var(--color-gradient-cm-bg-2)",
|
|
441
|
+
},
|
|
442
|
+
go: {
|
|
443
|
+
"blur-1": "var(--color-gradient-go-blur-1)",
|
|
444
|
+
"blur-2": "var(--color-gradient-go-blur-2)",
|
|
445
|
+
"blur-3": "var(--color-gradient-go-blur-3)",
|
|
446
|
+
"bg-1": "var(--color-gradient-go-bg-1)",
|
|
447
|
+
"bg-2": "var(--color-gradient-go-bg-2)",
|
|
448
|
+
},
|
|
449
|
+
ped: {
|
|
450
|
+
"blur-1": "var(--color-gradient-ped-blur-1)",
|
|
451
|
+
"blur-2": "var(--color-gradient-ped-blur-2)",
|
|
452
|
+
"blur-3": "var(--color-gradient-ped-blur-3)",
|
|
453
|
+
"bg-1": "var(--color-gradient-ped-bg-1)",
|
|
454
|
+
"bg-2": "var(--color-gradient-ped-bg-2)",
|
|
455
|
+
},
|
|
456
|
+
prev: {
|
|
457
|
+
"blur-1": "var(--color-gradient-prev-blur-1)",
|
|
458
|
+
"blur-2": "var(--color-gradient-prev-blur-2)",
|
|
459
|
+
"blur-3": "var(--color-gradient-prev-blur-3)",
|
|
460
|
+
"bg-1": "var(--color-gradient-prev-bg-1)",
|
|
461
|
+
"bg-2": "var(--color-gradient-prev-bg-2)",
|
|
462
|
+
},
|
|
463
|
+
r1: {
|
|
464
|
+
"blur-1": "var(--color-gradient-r1-blur-1)",
|
|
465
|
+
"blur-2": "var(--color-gradient-r1-blur-2)",
|
|
466
|
+
"blur-3": "var(--color-gradient-r1-blur-3)",
|
|
467
|
+
"bg-1": "var(--color-gradient-r1-bg-1)",
|
|
468
|
+
"bg-2": "var(--color-gradient-r1-bg-2)",
|
|
469
|
+
},
|
|
470
|
+
rplus: {
|
|
471
|
+
"blur-1": "var(--color-gradient-rplus-blur-1)",
|
|
472
|
+
"blur-2": "var(--color-gradient-rplus-blur-2)",
|
|
473
|
+
"blur-3": "var(--color-gradient-rplus-blur-3)",
|
|
474
|
+
"bg-1": "var(--color-gradient-rplus-bg-1)",
|
|
475
|
+
"bg-2": "var(--color-gradient-rplus-bg-2)",
|
|
476
|
+
},
|
|
477
|
+
pt: {
|
|
478
|
+
"blur-1": "var(--color-gradient-pt-blur-1)",
|
|
479
|
+
"blur-2": "var(--color-gradient-pt-blur-2)",
|
|
480
|
+
"blur-3": "var(--color-gradient-pt-blur-3)",
|
|
481
|
+
"bg-1": "var(--color-gradient-pt-bg-1)",
|
|
482
|
+
"bg-2": "var(--color-gradient-pt-bg-2)",
|
|
483
|
+
},
|
|
484
|
+
},
|
|
420
485
|
};
|
|
421
486
|
|
|
422
487
|
export const fontFamily = {
|
package/dist/index.d.mts
CHANGED
|
@@ -268,9 +268,8 @@ declare function Tag({ className, variant, asChild, icon, children, ...props }:
|
|
|
268
268
|
declare const tileVariants: (props?: ({
|
|
269
269
|
variant?: "regular" | "go" | "cm" | "cir" | "ped" | "prev" | null | undefined;
|
|
270
270
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
271
|
-
declare function Tile({ className, variant, asChild,
|
|
271
|
+
declare function Tile({ className, variant, asChild, disabled, inactive, ...props }: React.ComponentProps<"div"> & React.ComponentProps<"div"> & VariantProps<typeof tileVariants> & {
|
|
272
272
|
asChild?: boolean;
|
|
273
|
-
editable?: boolean;
|
|
274
273
|
disabled?: boolean;
|
|
275
274
|
inactive?: boolean;
|
|
276
275
|
}): react_jsx_runtime.JSX.Element;
|
package/dist/index.d.ts
CHANGED
|
@@ -268,9 +268,8 @@ declare function Tag({ className, variant, asChild, icon, children, ...props }:
|
|
|
268
268
|
declare const tileVariants: (props?: ({
|
|
269
269
|
variant?: "regular" | "go" | "cm" | "cir" | "ped" | "prev" | null | undefined;
|
|
270
270
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
271
|
-
declare function Tile({ className, variant, asChild,
|
|
271
|
+
declare function Tile({ className, variant, asChild, disabled, inactive, ...props }: React.ComponentProps<"div"> & React.ComponentProps<"div"> & VariantProps<typeof tileVariants> & {
|
|
272
272
|
asChild?: boolean;
|
|
273
|
-
editable?: boolean;
|
|
274
273
|
disabled?: boolean;
|
|
275
274
|
inactive?: boolean;
|
|
276
275
|
}): react_jsx_runtime.JSX.Element;
|