@codecademy/gamut-styles 20.1.1-alpha.d5d6ec.0 → 20.1.1-alpha.e2ff0c.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.
@@ -40,7 +40,7 @@ export declare const adminTheme: Record<"breakpoints", {
40
40
  readonly md: "5rem";
41
41
  };
42
42
  readonly headerZ: 15;
43
- }, "elements">>> & import("@codecademy/variance/dist/createTheme/types").Merge<import("@codecademy/variance/dist/createTheme/types").MergeTheme<import("@codecademy/variance/dist/createTheme/types").MergeTheme<import("@codecademy/variance/dist/createTheme/types").MergeTheme<Record<"breakpoints", {
43
+ }, "elements">>> & import("@codecademy/variance/dist/createTheme/types").Merge<import("@codecademy/variance/dist/createTheme/types").MergeTheme<import("@codecademy/variance/dist/createTheme/types").MergeTheme<Record<"breakpoints", {
44
44
  c_base: string;
45
45
  c_xs: string;
46
46
  c_sm: string;
@@ -544,19 +544,6 @@ export declare const adminTheme: Record<"breakpoints", {
544
544
  }>, Record<"borders", import("@codecademy/variance").LiteralPaths<{
545
545
  1: string;
546
546
  2: string;
547
- }, "-">>>, Record<"elevation", import("@codecademy/variance").LiteralPaths<{
548
- rest: {
549
- shadow: string;
550
- transform: string;
551
- };
552
- hover: {
553
- shadow: string;
554
- transform: string;
555
- };
556
- hoverMirrored: {
557
- shadow: string;
558
- transform: string;
559
- };
560
547
  }, "-">>>, import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys, Record<"name", string>> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys, {
561
548
  colors: import("@codecademy/variance").KeyAsVariable<import("@codecademy/variance").LiteralPaths<{
562
549
  primary: {
@@ -21,7 +21,7 @@ export declare const coreTheme: Record<"breakpoints", {
21
21
  readonly md: "5rem";
22
22
  };
23
23
  readonly headerZ: 15;
24
- }, "elements">>> & import("@codecademy/variance/dist/createTheme/types").Merge<import("@codecademy/variance/dist/createTheme/types").MergeTheme<import("@codecademy/variance/dist/createTheme/types").MergeTheme<import("@codecademy/variance/dist/createTheme/types").MergeTheme<Record<"breakpoints", {
24
+ }, "elements">>> & import("@codecademy/variance/dist/createTheme/types").Merge<import("@codecademy/variance/dist/createTheme/types").MergeTheme<import("@codecademy/variance/dist/createTheme/types").MergeTheme<Record<"breakpoints", {
25
25
  c_base: string;
26
26
  c_xs: string;
27
27
  c_sm: string;
@@ -525,19 +525,6 @@ export declare const coreTheme: Record<"breakpoints", {
525
525
  }>, Record<"borders", import("@codecademy/variance").LiteralPaths<{
526
526
  1: string;
527
527
  2: string;
528
- }, "-">>>, Record<"elevation", import("@codecademy/variance").LiteralPaths<{
529
- rest: {
530
- shadow: string;
531
- transform: string;
532
- };
533
- hover: {
534
- shadow: string;
535
- transform: string;
536
- };
537
- hoverMirrored: {
538
- shadow: string;
539
- transform: string;
540
- };
541
528
  }, "-">>>, import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys, Record<"name", string>> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys;
542
529
  export type CoreThemeShape = typeof coreTheme;
543
530
  export interface CoreTheme extends CoreThemeShape {
@@ -129,27 +129,4 @@ export const coreTheme = createTheme({
129
129
  }) => ({
130
130
  1: `1px solid ${colors['border-primary']}`,
131
131
  2: `2px solid ${colors['border-primary']}`
132
- })).addScale('elevation', ({
133
- colors
134
- }) => {
135
- const shadowPrimary = colors['shadow-primary'];
136
- const offset = 8;
137
- const lift = 4;
138
- const shadow = x => `${x}px ${offset}px 0 0 ${shadowPrimary}`;
139
- return {
140
- rest: {
141
- shadow: `0 0 0 0 ${shadowPrimary}`,
142
- transform: 'none'
143
- },
144
- hover: {
145
- shadow: shadow(-offset),
146
- transform: `translate(${lift}px, -${lift}px)`
147
- },
148
- // camelCase: variance's `LiteralPaths` splits token paths on `-`, so a
149
- // hyphenated key would resolve to `never` and drop out of the theme type.
150
- hoverMirrored: {
151
- shadow: shadow(offset),
152
- transform: `translate(-${lift}px, -${lift}px)`
153
- }
154
- };
155
- }).createScaleVariables('elements').addName('core').build();
132
+ })).createScaleVariables('elements').addName('core').build();
@@ -544,20 +544,6 @@ export declare const lxStudioTheme: Record<"breakpoints", {
544
544
  1: string;
545
545
  2: string;
546
546
  }, "-">;
547
- elevation: import("@codecademy/variance").LiteralPaths<{
548
- rest: {
549
- shadow: string;
550
- transform: string;
551
- };
552
- hover: {
553
- shadow: string;
554
- transform: string;
555
- };
556
- hoverMirrored: {
557
- shadow: string;
558
- transform: string;
559
- };
560
- }, "-">;
561
547
  name: string;
562
548
  } & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys, Record<"colors", import("@codecademy/variance").KeyAsVariable<import("@codecademy/variance").LiteralPaths<{
563
549
  lxStudioSuccess: "#06844F";
@@ -22,7 +22,7 @@ export declare const percipioTheme: Record<"breakpoints", {
22
22
  md: string;
23
23
  lg: string;
24
24
  xl: string;
25
- }> & import("@codecademy/variance/dist/createTheme/types").Merge<import("@codecademy/variance/dist/createTheme/types").MergeTheme<Record<"breakpoints", {
25
+ }> & import("@codecademy/variance/dist/createTheme/types").Merge<Record<"breakpoints", {
26
26
  c_base: string;
27
27
  c_xs: string;
28
28
  c_sm: string;
@@ -536,20 +536,6 @@ export declare const percipioTheme: Record<"breakpoints", {
536
536
  1: string;
537
537
  2: string;
538
538
  }, "-">;
539
- elevation: import("@codecademy/variance").LiteralPaths<{
540
- rest: {
541
- shadow: string;
542
- transform: string;
543
- };
544
- hover: {
545
- shadow: string;
546
- transform: string;
547
- };
548
- hoverMirrored: {
549
- shadow: string;
550
- transform: string;
551
- };
552
- }, "-">;
553
539
  name: string;
554
540
  } & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys, Record<"colors", import("@codecademy/variance").KeyAsVariable<import("@codecademy/variance").LiteralPaths<{
555
541
  percipioTextPrimary: "#222325";
@@ -1163,20 +1149,7 @@ export declare const percipioTheme: Record<"breakpoints", {
1163
1149
  }>;
1164
1150
  mode: "light";
1165
1151
  _getColorValue: (color: "beige" | "blue" | "navy" | "green" | "yellow" | "pink" | "red" | "orange" | "hyper" | "white" | "beige-100" | "blue-0" | "blue-100" | "blue-300" | "blue-400" | "blue-500" | "blue-800" | "navy-100" | "navy-300" | "navy-400" | "navy-500" | "navy-800" | "navy-200" | "navy-600" | "navy-700" | "navy-900" | "green-0" | "green-100" | "green-400" | "green-700" | "green-900" | "yellow-0" | "yellow-400" | "yellow-500" | "yellow-900" | "pink-0" | "pink-400" | "red-0" | "red-300" | "red-400" | "red-500" | "red-600" | "red-900" | "orange-100" | "orange-500" | "hyper-400" | "hyper-500" | "gray-100" | "gray-300" | "gray-800" | "gray-200" | "gray-600" | "gray-900" | "white-100" | "white-300" | "white-400" | "white-500" | "white-200" | "white-600" | "white-700" | "lightBlue" | "lightGreen" | "paleBlue" | "paleGreen" | "palePink" | "paleYellow" | "paleRed" | "black" | "text" | "secondary" | "background" | "primary" | "danger" | "interface" | "border-primary" | "text-accent" | "text-disabled" | "text-secondary" | "secondary-hover" | "feedback-error" | "feedback-success" | "feedback-warning" | "background-disabled" | "background-error" | "background-success" | "background-warning" | "background-contrast" | "background-current" | "background-primary" | "background-selected" | "background-hover" | "primary-hover" | "primary-inverse" | "shadow-secondary" | "shadow-primary" | "danger-hover" | "interface-hover" | "border-disabled" | "border-secondary" | "border-tertiary" | "sapphire" | "percipioTextPrimary" | "percipioTextSecondary" | "percipioTextDisabled" | "percipioTextAccent" | "percipioBgPrimary" | "percipioBgSuccess" | "percipioBgWarning" | "percipioBgError" | "percipioActionPrimaryHover" | "percipioActionSecondary" | "percipioActionSecondaryHover" | "percipioActionDangerHover" | "percipioFeedbackSuccess" | "percipioFeedbackWarning" | "percipioDanger") => string;
1166
- }>, Record<"elevation", import("@codecademy/variance").LiteralPaths<{
1167
- rest: {
1168
- shadow: string;
1169
- transform: string;
1170
- };
1171
- hover: {
1172
- shadow: string;
1173
- transform: string;
1174
- };
1175
- hoverMirrored: {
1176
- shadow: string;
1177
- transform: string;
1178
- };
1179
- }, "-">>> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys, Record<"name", string>> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys;
1152
+ }> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys, Record<"name", string>> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys;
1180
1153
  export type PercipioThemeShape = typeof percipioTheme;
1181
1154
  export interface PercipioTheme extends PercipioThemeShape {
1182
1155
  }
@@ -53,24 +53,4 @@ export const percipioTheme = createTheme({
53
53
  disabled: 'navy-300'
54
54
  }
55
55
  }
56
- }).addScale('elevation', ({
57
- colors
58
- }) => {
59
- const shadowPrimary = colors['shadow-primary'];
60
- const shadowSecondary = colors['shadow-secondary'];
61
- const hover = `0 1px 4px 0 ${shadowPrimary}, 0 2px 11px 0 ${shadowSecondary}`;
62
- return {
63
- rest: {
64
- shadow: `0 1px 4px 0 ${shadowPrimary}, 0 2px 7px 0 ${shadowPrimary}`,
65
- transform: 'none'
66
- },
67
- hover: {
68
- shadow: hover,
69
- transform: 'none'
70
- },
71
- hoverMirrored: {
72
- shadow: hover,
73
- transform: 'none'
74
- }
75
- };
76
56
  }).addName('percipio').build();
@@ -56,7 +56,7 @@ export declare const platformTheme: Record<"breakpoints", {
56
56
  readonly md: "5rem";
57
57
  };
58
58
  readonly headerZ: 15;
59
- }, "elements">>> & import("@codecademy/variance/dist/createTheme/types").Merge<import("@codecademy/variance/dist/createTheme/types").MergeTheme<import("@codecademy/variance/dist/createTheme/types").MergeTheme<import("@codecademy/variance/dist/createTheme/types").MergeTheme<Record<"breakpoints", {
59
+ }, "elements">>> & import("@codecademy/variance/dist/createTheme/types").Merge<import("@codecademy/variance/dist/createTheme/types").MergeTheme<import("@codecademy/variance/dist/createTheme/types").MergeTheme<Record<"breakpoints", {
60
60
  c_base: string;
61
61
  c_xs: string;
62
62
  c_sm: string;
@@ -560,19 +560,6 @@ export declare const platformTheme: Record<"breakpoints", {
560
560
  }>, Record<"borders", import("@codecademy/variance").LiteralPaths<{
561
561
  1: string;
562
562
  2: string;
563
- }, "-">>>, Record<"elevation", import("@codecademy/variance").LiteralPaths<{
564
- rest: {
565
- shadow: string;
566
- transform: string;
567
- };
568
- hover: {
569
- shadow: string;
570
- transform: string;
571
- };
572
- hoverMirrored: {
573
- shadow: string;
574
- transform: string;
575
- };
576
563
  }, "-">>>, import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys, Record<"name", string>> & import("@codecademy/variance/dist/createTheme/types").PrivateThemeKeys, Record<"colors", import("@codecademy/variance").KeyAsVariable<import("@codecademy/variance").LiteralPaths<{
577
564
  readonly lightBeige: "#FFFBF8";
578
565
  readonly gold: "#8A7300";
package/package.json CHANGED
@@ -1,10 +1,10 @@
1
1
  {
2
2
  "name": "@codecademy/gamut-styles",
3
3
  "description": "Styleguide & Component library for codecademy.com",
4
- "version": "20.1.1-alpha.d5d6ec.0",
4
+ "version": "20.1.1-alpha.e2ff0c.0",
5
5
  "author": "Jake Hiller <jake@codecademy.com>",
6
6
  "dependencies": {
7
- "@codecademy/variance": "0.26.2-alpha.d5d6ec.0",
7
+ "@codecademy/variance": "0.26.2-alpha.e2ff0c.0",
8
8
  "@emotion/is-prop-valid": "^1.1.0",
9
9
  "framer-motion": "^11.18.0",
10
10
  "get-nonce": "^1.0.0",