@team-monolith/cds 1.40.1 → 1.42.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.
Files changed (13) hide show
  1. package/@types/emotion.d.ts +38 -16
  2. package/dist/CodleDesignSystemProvider.d.ts +38 -16
  3. package/dist/CodleDesignSystemProvider.js +66 -44
  4. package/dist/components/Banner.js +12 -12
  5. package/dist/components/Button.js +3 -3
  6. package/dist/components/SquareButton.js +3 -3
  7. package/dist/components/Tag.js +19 -19
  8. package/dist/foundation/color.d.ts +7 -1
  9. package/dist/foundation/color.js +7 -1
  10. package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SelectBox/SelectBoxComponent.js +6 -6
  11. package/dist/patterns/LexicalEditor/plugins/ComponentAdderPlugin/useContextMenuOptions.js +8 -8
  12. package/dist/patterns/LexicalEditor/theme.js +8 -8
  13. package/package.json +1 -1
package/@types/emotion.d.ts CHANGED
@@ -8,6 +8,8 @@ interface CodleFontFamilies {
8
8
  interface CodleColors {
9
9
  background: {
10
10
  neutralBase: string;
11
+ neutralBaseActive: string;
12
+ neutralBaseDisabled: string;
11
13
  neutralAlt: string;
12
14
  neutralAltActive: string;
13
15
  neutralAltDisabled: string;
@@ -29,47 +31,59 @@ interface CodleColors {
29
31
  warning: string;
30
32
  warningActive: string;
31
33
  warningDisabled: string;
32
- black: string;
33
- blackActive: string;
34
- blackDisabled: string;
34
+ inverse: string;
35
+ inverseActive: string;
36
+ inverseDisabled: string;
35
37
  };
36
38
  foreground: {
37
39
  neutralBase: string;
40
+ neutralBaseActive: string;
38
41
  neutralBaseDisabled: string;
39
42
  neutralAlt: string;
43
+ neutralAltActive: string;
40
44
  neutralAltDisabled: string;
41
45
  primary: string;
46
+ primaryActive: string;
42
47
  primaryDisabled: string;
43
48
  secondary: string;
49
+ secondaryActive: string;
44
50
  secondaryDisabled: string;
45
51
  danger: string;
52
+ dangerActive: string;
46
53
  dangerDisabled: string;
47
54
  success: string;
55
+ successActive: string;
48
56
  successDisabled: string;
49
57
  info: string;
58
+ infoActive: string;
50
59
  infoDisabled: string;
51
60
  warning: string;
61
+ warningActive: string;
52
62
  warningDisabled: string;
53
63
  };
54
64
  container: {
55
- primaryContainer: string;
56
- primaryOnContainer: string;
57
- secondaryContainer: string;
58
- secondaryOnContainer: string;
59
- dangerContainer: string;
60
- dangerOnContainer: string;
61
- successContainer: string;
62
- successOnContainer: string;
63
- infoContainer: string;
64
- infoOnContainer: string;
65
- warningContainer: string;
66
- warningOnContainer: string;
65
+ blueContainer: string;
66
+ blueOnContainer: string;
67
+ orangeContainer: string;
68
+ orangeOnContainer: string;
69
+ redContainer: string;
70
+ redOnContainer: string;
71
+ greenContainer: string;
72
+ greenOnContainer: string;
73
+ tealContainer: string;
74
+ tealOnContainer: string;
75
+ yellowContainer: string;
76
+ yellowOnContainer: string;
67
77
  obsidianContainer: string;
68
78
  obsidianOnContainer: string;
69
79
  marbleContainer: string;
70
80
  marbleOnContainer: string;
71
81
  };
72
- activity: {
82
+ brand: {
83
+ brandOriginal: string;
84
+ brandAlt: string;
85
+ brandAccent: string;
86
+ brandFaded: string;
73
87
  pdf: string;
74
88
  pdfAlt: string;
75
89
  quiz: string;
@@ -87,6 +101,14 @@ interface CodleColors {
87
101
  video: string;
88
102
  videoAlt: string;
89
103
  };
104
+ blanket: {
105
+ neutral: string;
106
+ neutralLight: string;
107
+ neutralHeavy: string;
108
+ inverse: string;
109
+ inverseLight: string;
110
+ inverseHeavy: string;
111
+ };
90
112
  }
91
113
 
92
114
  declare module "@emotion/react" {
package/dist/CodleDesignSystemProvider.d.ts CHANGED
@@ -7,6 +7,8 @@ export declare const light: {
7
7
  color: {
8
8
  background: {
9
9
  neutralBase: string;
10
+ neutralBaseActive: string;
11
+ neutralBaseDisabled: string;
10
12
  neutralAlt: string;
11
13
  neutralAltActive: string;
12
14
  neutralAltDisabled: string;
@@ -28,47 +30,59 @@ export declare const light: {
28
30
  warning: string;
29
31
  warningActive: string;
30
32
  warningDisabled: string;
31
- black: string;
32
- blackActive: string;
33
- blackDisabled: string;
33
+ inverse: string;
34
+ inverseActive: string;
35
+ inverseDisabled: string;
34
36
  };
35
37
  foreground: {
36
38
  neutralBase: string;
39
+ neutralBaseActive: string;
37
40
  neutralBaseDisabled: string;
38
41
  neutralAlt: string;
42
+ neutralAltActive: string;
39
43
  neutralAltDisabled: string;
40
44
  primary: string;
45
+ primaryActive: string;
41
46
  primaryDisabled: string;
42
47
  secondary: string;
48
+ secondaryActive: string;
43
49
  secondaryDisabled: string;
44
50
  danger: string;
51
+ dangerActive: string;
45
52
  dangerDisabled: string;
46
53
  success: string;
54
+ successActive: string;
47
55
  successDisabled: string;
48
56
  info: string;
57
+ infoActive: string;
49
58
  infoDisabled: string;
50
59
  warning: string;
60
+ warningActive: string;
51
61
  warningDisabled: string;
52
62
  };
53
63
  container: {
54
- primaryContainer: string;
55
- primaryOnContainer: string;
56
- secondaryContainer: string;
57
- secondaryOnContainer: string;
58
- dangerContainer: string;
59
- dangerOnContainer: string;
60
- successContainer: string;
61
- successOnContainer: string;
62
- infoContainer: string;
63
- infoOnContainer: string;
64
- warningContainer: string;
65
- warningOnContainer: string;
64
+ blueContainer: string;
65
+ blueOnContainer: string;
66
+ orangeContainer: string;
67
+ orangeOnContainer: string;
68
+ redContainer: string;
69
+ redOnContainer: string;
70
+ greenContainer: string;
71
+ greenOnContainer: string;
72
+ tealContainer: string;
73
+ tealOnContainer: string;
74
+ yellowContainer: string;
75
+ yellowOnContainer: string;
66
76
  obsidianContainer: string;
67
77
  obsidianOnContainer: string;
68
78
  marbleContainer: string;
69
79
  marbleOnContainer: string;
70
80
  };
71
- activity: {
81
+ brand: {
82
+ brandOriginal: string;
83
+ brandAlt: string;
84
+ brandAccent: string;
85
+ brandFaded: string;
72
86
  pdf: string;
73
87
  pdfAlt: string;
74
88
  quiz: string;
@@ -86,6 +100,14 @@ export declare const light: {
86
100
  video: string;
87
101
  videoAlt: string;
88
102
  };
103
+ blanket: {
104
+ neutral: string;
105
+ neutralLight: string;
106
+ neutralHeavy: string;
107
+ inverse: string;
108
+ inverseLight: string;
109
+ inverseHeavy: string;
110
+ };
89
111
  };
90
112
  };
91
113
  interface CodleDesignSystemContext {
package/dist/CodleDesignSystemProvider.js CHANGED
@@ -13,68 +13,82 @@ export const light = {
13
13
  color: {
14
14
  background: {
15
15
  neutralBase: COLOR.white,
16
+ neutralBaseActive: COLOR.grey02,
17
+ neutralBaseDisabled: COLOR.grey01,
16
18
  neutralAlt: COLOR.grey02,
17
19
  neutralAltActive: COLOR.grey04,
18
20
  neutralAltDisabled: COLOR.grey01,
19
- primary: COLOR.blue06,
20
- primaryActive: COLOR.blue07,
21
+ primary: COLOR.blue07,
22
+ primaryActive: COLOR.blue08,
21
23
  primaryDisabled: COLOR.blue03,
22
- secondary: COLOR.orange06,
23
- secondaryActive: COLOR.orange07,
24
+ secondary: COLOR.orange07,
25
+ secondaryActive: COLOR.orange08,
24
26
  secondaryDisabled: COLOR.orange03,
25
- danger: COLOR.red06,
26
- dangerActive: COLOR.red07,
27
- dangerDisabled: COLOR.red03,
28
- success: COLOR.green06,
29
- successActive: COLOR.green07,
27
+ danger: COLOR.red08,
28
+ dangerActive: COLOR.red09,
29
+ dangerDisabled: COLOR.red02,
30
+ success: COLOR.green07,
31
+ successActive: COLOR.green08,
30
32
  successDisabled: COLOR.green03,
31
- info: COLOR.teal06,
32
- infoActive: COLOR.teal07,
33
- infoDisabled: COLOR.teal03,
34
- warning: COLOR.yellow06,
35
- warningActive: COLOR.yellow07,
36
- warningDisabled: COLOR.yellow03,
37
- black: COLOR.black,
38
- blackActive: COLOR.grey08,
39
- blackDisabled: COLOR.grey04,
33
+ info: COLOR.teal08,
34
+ infoActive: COLOR.teal09,
35
+ infoDisabled: COLOR.teal02,
36
+ warning: COLOR.yellow08,
37
+ warningActive: COLOR.yellow09,
38
+ warningDisabled: COLOR.yellow02,
39
+ inverse: COLOR.black,
40
+ inverseActive: COLOR.grey08,
41
+ inverseDisabled: COLOR.grey04,
40
42
  },
41
43
  foreground: {
42
44
  neutralBase: COLOR.black,
45
+ neutralBaseActive: COLOR.grey08,
43
46
  neutralBaseDisabled: COLOR.grey06,
44
47
  neutralAlt: COLOR.white,
45
- neutralAltDisabled: COLOR.white,
46
- primary: COLOR.blue06,
47
- primaryDisabled: COLOR.blue02,
48
- secondary: COLOR.orange06,
49
- secondaryDisabled: COLOR.orange02,
50
- danger: COLOR.red06,
51
- dangerDisabled: COLOR.red02,
52
- success: COLOR.green06,
53
- successDisabled: COLOR.green02,
54
- info: COLOR.teal06,
55
- infoDisabled: COLOR.teal02,
56
- warning: COLOR.yellow06,
57
- warningDisabled: COLOR.yellow02,
48
+ neutralAltActive: COLOR.grey02,
49
+ neutralAltDisabled: COLOR.grey08,
50
+ primary: COLOR.blue07,
51
+ primaryActive: COLOR.blue08,
52
+ primaryDisabled: COLOR.blue03,
53
+ secondary: COLOR.orange07,
54
+ secondaryActive: COLOR.orange08,
55
+ secondaryDisabled: COLOR.orange04,
56
+ danger: COLOR.red08,
57
+ dangerActive: COLOR.red09,
58
+ dangerDisabled: COLOR.red04,
59
+ success: COLOR.green07,
60
+ successActive: COLOR.green08,
61
+ successDisabled: COLOR.green04,
62
+ info: COLOR.teal08,
63
+ infoActive: COLOR.teal09,
64
+ infoDisabled: COLOR.teal04,
65
+ warning: COLOR.yellow08,
66
+ warningActive: COLOR.yellow09,
67
+ warningDisabled: COLOR.yellow04,
58
68
  },
59
69
  container: {
60
- primaryContainer: COLOR.blue01,
61
- primaryOnContainer: COLOR.blue08,
62
- secondaryContainer: COLOR.orange01,
63
- secondaryOnContainer: COLOR.orange08,
64
- dangerContainer: COLOR.red01,
65
- dangerOnContainer: COLOR.red08,
66
- successContainer: COLOR.green01,
67
- successOnContainer: COLOR.green08,
68
- infoContainer: COLOR.teal01,
69
- infoOnContainer: COLOR.teal08,
70
- warningContainer: COLOR.yellow01,
71
- warningOnContainer: COLOR.yellow08,
70
+ blueContainer: COLOR.blue01,
71
+ blueOnContainer: COLOR.blue08,
72
+ orangeContainer: COLOR.orange01,
73
+ orangeOnContainer: COLOR.orange08,
74
+ redContainer: COLOR.red01,
75
+ redOnContainer: COLOR.red08,
76
+ greenContainer: COLOR.green01,
77
+ greenOnContainer: COLOR.green08,
78
+ tealContainer: COLOR.teal01,
79
+ tealOnContainer: COLOR.teal08,
80
+ yellowContainer: COLOR.yellow01,
81
+ yellowOnContainer: COLOR.yellow08,
72
82
  obsidianContainer: COLOR.black,
73
83
  obsidianOnContainer: COLOR.grey03,
74
84
  marbleContainer: COLOR.grey03,
75
85
  marbleOnContainer: COLOR.grey07,
76
86
  },
77
- activity: {
87
+ brand: {
88
+ brandOriginal: COLOR.blue06,
89
+ brandAlt: COLOR.blue07,
90
+ brandAccent: COLOR.blue08,
91
+ brandFaded: COLOR.blue03,
78
92
  pdf: "#FF5850",
79
93
  pdfAlt: "#FFEEED",
80
94
  quiz: "#F889AA",
@@ -92,6 +106,14 @@ export const light = {
92
106
  video: "#5F32DE",
93
107
  videoAlt: "#CEC8DE",
94
108
  },
109
+ blanket: {
110
+ neutral: COLOR.alpha030,
111
+ neutralLight: COLOR.alpha015,
112
+ neutralHeavy: COLOR.alpha065,
113
+ inverse: COLOR.alphaf50,
114
+ inverseLight: COLOR.alphaf20,
115
+ inverseHeavy: COLOR.alphaf10,
116
+ },
95
117
  },
96
118
  };
97
119
  export const CodleDesignSystemContext = createContext({});
package/dist/components/Banner.js CHANGED
@@ -19,24 +19,24 @@ import SquareButton from "./SquareButton";
19
19
  import Button from "./Button";
20
20
  const COLOR_PALETTE = (theme, color) => ({
21
21
  red: {
22
- background: theme.color.container.dangerContainer,
23
- headline: theme.color.container.dangerOnContainer,
24
- content: theme.color.container.dangerOnContainer,
22
+ background: theme.color.container.redContainer,
23
+ headline: theme.color.container.redOnContainer,
24
+ content: theme.color.container.redOnContainer,
25
25
  },
26
26
  blue: {
27
- background: theme.color.container.primaryContainer,
28
- headline: theme.color.container.primaryOnContainer,
29
- content: theme.color.container.primaryOnContainer,
27
+ background: theme.color.container.blueContainer,
28
+ headline: theme.color.container.blueOnContainer,
29
+ content: theme.color.container.blueOnContainer,
30
30
  },
31
31
  green: {
32
- background: theme.color.container.successContainer,
33
- headline: theme.color.container.successOnContainer,
34
- content: theme.color.container.successOnContainer,
32
+ background: theme.color.container.greenContainer,
33
+ headline: theme.color.container.greenOnContainer,
34
+ content: theme.color.container.greenOnContainer,
35
35
  },
36
36
  yellow: {
37
- background: theme.color.container.warningContainer,
38
- headline: theme.color.container.warningOnContainer,
39
- content: theme.color.container.warningOnContainer,
37
+ background: theme.color.container.yellowContainer,
38
+ headline: theme.color.container.yellowOnContainer,
39
+ content: theme.color.container.yellowOnContainer,
40
40
  },
41
41
  white: {
42
42
  background: theme.color.background.neutralBase,
package/dist/components/Button.js CHANGED
@@ -109,14 +109,14 @@ const COLOR_TO_BUTTON_STYLE = (theme, color, disabled) => ({
109
109
  black: css `
110
110
  ${disabled
111
111
  ? css `
112
- background: ${theme.color.background.blackDisabled};
112
+ background: ${theme.color.background.inverseDisabled};
113
113
  color: ${theme.color.foreground.neutralAltDisabled};
114
114
  `
115
115
  : css `
116
- background: ${theme.color.background.black};
116
+ background: ${theme.color.background.inverse};
117
117
  color: ${theme.color.foreground.neutralAlt};
118
118
  ${HOVER(css `
119
- background: ${theme.color.background.blackActive};
119
+ background: ${theme.color.background.inverseActive};
120
120
  color: ${theme.color.foreground.neutralAlt};
121
121
  `)}
122
122
  `}
package/dist/components/SquareButton.js CHANGED
@@ -69,15 +69,15 @@ const COLOR_TO_BUTTON_STYLE = (theme, color) => ({
69
69
  }
70
70
  `,
71
71
  black: css `
72
- background: ${theme.color.background.black};
72
+ background: ${theme.color.background.inverse};
73
73
  border: none;
74
74
  color: ${theme.color.foreground.neutralAlt};
75
75
  ${HOVER(css `
76
- background: ${theme.color.background.blackActive};
76
+ background: ${theme.color.background.inverseActive};
77
77
  color: ${theme.color.foreground.neutralAlt};
78
78
  `)}
79
79
  &:disabled {
80
- background: ${theme.color.background.blackDisabled};
80
+ background: ${theme.color.background.inverseDisabled};
81
81
  color: ${theme.color.foreground.neutralAltDisabled};
82
82
  }
83
83
  `,
package/dist/components/Tag.js CHANGED
@@ -25,45 +25,45 @@ const COLOR_TO_STYLE = (theme, color) => ({
25
25
  `,
26
26
  red: css `
27
27
  box-sizing: border-box;
28
- background: ${theme.color.container.dangerContainer};
29
- border: 1px solid ${theme.color.container.dangerOnContainer};
30
- color: ${theme.color.container.dangerOnContainer};
28
+ background: ${theme.color.container.redContainer};
29
+ border: 1px solid ${theme.color.container.redOnContainer};
30
+ color: ${theme.color.container.redOnContainer};
31
31
  `,
32
32
  teal: css `
33
33
  box-sizing: border-box;
34
- background: ${theme.color.container.infoContainer};
35
- border: 1px solid ${theme.color.container.infoOnContainer};
36
- color: ${theme.color.container.infoOnContainer};
34
+ background: ${theme.color.container.tealContainer};
35
+ border: 1px solid ${theme.color.container.tealOnContainer};
36
+ color: ${theme.color.container.tealOnContainer};
37
37
  `,
38
38
  orange: css `
39
39
  box-sizing: border-box;
40
- background: ${theme.color.container.secondaryContainer};
41
- border: 1px solid ${theme.color.container.secondaryOnContainer};
42
- color: ${theme.color.container.secondaryOnContainer};
40
+ background: ${theme.color.container.orangeContainer};
41
+ border: 1px solid ${theme.color.container.orangeOnContainer};
42
+ color: ${theme.color.container.orangeOnContainer};
43
43
  `,
44
44
  blue: css `
45
45
  box-sizing: border-box;
46
- background: ${theme.color.container.primaryContainer};
47
- border: 1px solid ${theme.color.container.primaryOnContainer};
48
- color: ${theme.color.container.primaryOnContainer};
46
+ background: ${theme.color.container.blueContainer};
47
+ border: 1px solid ${theme.color.container.blueOnContainer};
48
+ color: ${theme.color.container.blueOnContainer};
49
49
  `,
50
50
  green: css `
51
51
  box-sizing: border-box;
52
- background: ${theme.color.container.successContainer};
53
- border: 1px solid ${theme.color.container.successOnContainer};
54
- color: ${theme.color.container.successOnContainer};
52
+ background: ${theme.color.container.greenContainer};
53
+ border: 1px solid ${theme.color.container.greenOnContainer};
54
+ color: ${theme.color.container.greenOnContainer};
55
55
  `,
56
56
  yellow: css `
57
57
  box-sizing: border-box;
58
- background: ${theme.color.container.warningContainer};
59
- border: 1px solid ${theme.color.container.warningOnContainer};
60
- color: ${theme.color.container.warningOnContainer};
58
+ background: ${theme.color.container.yellowContainer};
59
+ border: 1px solid ${theme.color.container.yellowOnContainer};
60
+ color: ${theme.color.container.yellowOnContainer};
61
61
  `,
62
62
  black: css `
63
63
  background: ${theme.color.container.obsidianContainer};
64
64
  color: ${theme.color.container.obsidianOnContainer};
65
65
  `,
66
- }[color]);
66
+ })[color];
67
67
  /**
68
68
  * [피그마](https://www.figma.com/file/yhrRFizzmhPoHdw9FbYow2/Codle-PD-Kit---Components?type=design&node-id=42-869&t=HZXCHP0r0tbvMA6v-0)
69
69
  */
package/dist/foundation/color.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  declare const _default: {
2
2
  blue10: string;
3
- priamry09: string;
3
+ blue09: string;
4
4
  blue08: string;
5
5
  blue07: string;
6
6
  blue06: string;
@@ -71,5 +71,11 @@ declare const _default: {
71
71
  grey02: string;
72
72
  grey01: string;
73
73
  white: string;
74
+ alpha065: string;
75
+ alpha030: string;
76
+ alpha015: string;
77
+ alphaf50: string;
78
+ alphaf20: string;
79
+ alphaf10: string;
74
80
  };
75
81
  export default _default;
package/dist/foundation/color.js CHANGED
@@ -1,7 +1,7 @@
1
1
  // eslint-disable-next-line import/no-anonymous-default-export
2
2
  export default {
3
3
  blue10: "#1C3D73",
4
- priamry09: "#234E91",
4
+ blue09: "#234E91",
5
5
  blue08: "#2C61B5",
6
6
  blue07: "#3574D9",
7
7
  blue06: "#3E88FF",
@@ -72,4 +72,10 @@ export default {
72
72
  grey02: "#F6F6F6",
73
73
  grey01: "#FDFDFD",
74
74
  white: "#FFFFFF",
75
+ alpha065: "#000000A6",
76
+ alpha030: "#0000004D",
77
+ alpha015: "#00000026",
78
+ alphaf50: "#FFFFFF80",
79
+ alphaf20: "#FFFFFF33",
80
+ alphaf10: "#FFFFFF1A",
75
81
  };
package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SelectBox/SelectBoxComponent.js CHANGED
@@ -4,19 +4,19 @@ import { css, useTheme } from "@emotion/react";
4
4
  import styled from "@emotion/styled";
5
5
  const TYPE_TO_CONTAINER_STYLE = (theme, type) => ({
6
6
  primary: css `
7
- background: ${theme.color.container.primaryContainer};
7
+ background: ${theme.color.container.blueContainer};
8
8
  border: 1px solid ${theme.color.foreground.primary};
9
- color: ${theme.color.container.primaryOnContainer};
9
+ color: ${theme.color.container.blueOnContainer};
10
10
  `,
11
11
  success: css `
12
- background: ${theme.color.container.successContainer};
12
+ background: ${theme.color.container.greenContainer};
13
13
  border: 1px solid ${theme.color.background.successActive};
14
- color: ${theme.color.container.successOnContainer};
14
+ color: ${theme.color.container.greenOnContainer};
15
15
  `,
16
16
  danger: css `
17
- background: ${theme.color.container.dangerContainer};
17
+ background: ${theme.color.container.redContainer};
18
18
  border: 1px solid ${theme.color.background.dangerActive};
19
- color: ${theme.color.container.dangerOnContainer};
19
+ color: ${theme.color.container.redOnContainer};
20
20
  `,
21
21
  })[type];
22
22
  const TYPE_TO_INDEX_STYLE = (theme, type) => ({
package/dist/patterns/LexicalEditor/plugins/ComponentAdderPlugin/useContextMenuOptions.js CHANGED
@@ -212,9 +212,9 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
212
212
  },
213
213
  }),
214
214
  new ComponentPickerOption("빨간색", {
215
- icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.dangerOnContainer })),
215
+ icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.redOnContainer })),
216
216
  iconContainerClassName: css `
217
- background: ${theme.color.container.dangerContainer};
217
+ background: ${theme.color.container.redContainer};
218
218
  `,
219
219
  keywords: ["red"],
220
220
  onSelect: () => {
@@ -224,9 +224,9 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
224
224
  },
225
225
  }),
226
226
  new ComponentPickerOption("노란색", {
227
- icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.warningOnContainer })),
227
+ icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.yellowOnContainer })),
228
228
  iconContainerClassName: css `
229
- background: ${theme.color.container.warningContainer};
229
+ background: ${theme.color.container.yellowContainer};
230
230
  `,
231
231
  keywords: ["yellow"],
232
232
  onSelect: () => {
@@ -236,9 +236,9 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
236
236
  },
237
237
  }),
238
238
  new ComponentPickerOption("파란색", {
239
- icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.primaryOnContainer })),
239
+ icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.blueOnContainer })),
240
240
  iconContainerClassName: css `
241
- background: ${theme.color.container.primaryContainer};
241
+ background: ${theme.color.container.blueContainer};
242
242
  `,
243
243
  keywords: ["blue"],
244
244
  onSelect: () => {
@@ -248,9 +248,9 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
248
248
  },
249
249
  }),
250
250
  new ComponentPickerOption("초록색", {
251
- icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.successOnContainer })),
251
+ icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.greenOnContainer })),
252
252
  iconContainerClassName: css `
253
- background: ${theme.color.container.successContainer};
253
+ background: ${theme.color.container.greenContainer};
254
254
  `,
255
255
  keywords: ["green"],
256
256
  onSelect: () => {
package/dist/patterns/LexicalEditor/theme.js CHANGED
@@ -41,7 +41,7 @@ export function getTheme(theme) {
41
41
  border-left: 4px solid ${theme.color.container.marbleContainer};
42
42
  `,
43
43
  red: css `
44
- color: ${theme.color.container.dangerOnContainer};
44
+ color: ${theme.color.container.redOnContainer};
45
45
 
46
46
  /* Default/Paragraph/14px-Rg */
47
47
  font-family: ${theme.fontFamily.ui};
@@ -52,10 +52,10 @@ export function getTheme(theme) {
52
52
 
53
53
  margin: 16px 0;
54
54
  padding-left: 12px;
55
- border-left: 4px solid ${theme.color.container.dangerContainer};
55
+ border-left: 4px solid ${theme.color.container.redContainer};
56
56
  `,
57
57
  yellow: css `
58
- color: ${theme.color.container.warningOnContainer};
58
+ color: ${theme.color.container.yellowOnContainer};
59
59
 
60
60
  /* Default/Paragraph/14px-Rg */
61
61
  font-family: ${theme.fontFamily.ui};
@@ -66,10 +66,10 @@ export function getTheme(theme) {
66
66
 
67
67
  margin: 16px 0;
68
68
  padding-left: 12px;
69
- border-left: 4px solid ${theme.color.container.warningContainer};
69
+ border-left: 4px solid ${theme.color.container.yellowContainer};
70
70
  `,
71
71
  blue: css `
72
- color: ${theme.color.container.primaryOnContainer};
72
+ color: ${theme.color.container.blueOnContainer};
73
73
 
74
74
  /* Default/Paragraph/14px-Rg */
75
75
  font-family: ${theme.fontFamily.ui};
@@ -80,10 +80,10 @@ export function getTheme(theme) {
80
80
 
81
81
  margin: 16px 0;
82
82
  padding-left: 12px;
83
- border-left: 4px solid ${theme.color.container.primaryContainer};
83
+ border-left: 4px solid ${theme.color.container.blueContainer};
84
84
  `,
85
85
  green: css `
86
- color: ${theme.color.container.successOnContainer};
86
+ color: ${theme.color.container.greenOnContainer};
87
87
 
88
88
  /* Default/Paragraph/14px-Rg */
89
89
  font-family: ${theme.fontFamily.ui};
@@ -94,7 +94,7 @@ export function getTheme(theme) {
94
94
 
95
95
  margin: 16px 0;
96
96
  padding-left: 12px;
97
- border-left: 4px solid ${theme.color.container.successContainer};
97
+ border-left: 4px solid ${theme.color.container.greenContainer};
98
98
  `,
99
99
  },
100
100
  heading: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@team-monolith/cds",
3
- "version": "1.40.1",
3
+ "version": "1.42.1",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "sideEffects": false,