@team-monolith/cds 1.122.6 → 1.123.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 (189) hide show
  1. package/@types/emotion.d.ts +194 -162
  2. package/README.md +37 -37
  3. package/dist/CdsProvider.js +14 -14
  4. package/dist/components/AlertDialog/AlertDialog.js +54 -54
  5. package/dist/components/AlertDialog/AlertDialogActions.js +7 -7
  6. package/dist/components/AlertDialog/AlertDialogContent.js +8 -8
  7. package/dist/components/AlertDialog/AlertDialogTitle.js +34 -34
  8. package/dist/components/AnimatedButton.js +32 -32
  9. package/dist/components/Banner.js +46 -52
  10. package/dist/components/Book/Book.js +174 -174
  11. package/dist/components/Button.js +179 -179
  12. package/dist/components/CheckboxInput.js +148 -148
  13. package/dist/components/FileTypeAlertDialog.js +4 -4
  14. package/dist/components/Input.js +53 -53
  15. package/dist/components/InputBase.js +72 -72
  16. package/dist/components/Modal.js +4 -4
  17. package/dist/components/OverflowTooltip.js +4 -4
  18. package/dist/components/Pagination.js +56 -56
  19. package/dist/components/PinInput.js +64 -64
  20. package/dist/components/Popover.js +27 -27
  21. package/dist/components/RadioInput.js +73 -73
  22. package/dist/components/Slider.js +58 -58
  23. package/dist/components/SquareButton.js +109 -109
  24. package/dist/components/Switch.js +69 -69
  25. package/dist/components/SwitchButton.js +107 -107
  26. package/dist/components/Tag.js +72 -72
  27. package/dist/components/Tooltip.js +19 -19
  28. package/dist/foundation/breakpoints.js +16 -16
  29. package/dist/foundation/typography.d.ts +30 -0
  30. package/dist/foundation/typography.js +210 -0
  31. package/dist/icons/custom/colored/ai-helper.svg +4 -4
  32. package/dist/icons/custom/colored/ai-quiz-color.svg +20 -20
  33. package/dist/icons/custom/colored/ai-socroom-color.svg +14 -14
  34. package/dist/icons/custom/colored/badge-color.svg +4 -4
  35. package/dist/icons/custom/colored/badge-gold.svg +11 -11
  36. package/dist/icons/custom/colored/badge-green.svg +11 -11
  37. package/dist/icons/custom/colored/badge-silver.svg +11 -11
  38. package/dist/icons/custom/colored/basic-plus.svg +31 -31
  39. package/dist/icons/custom/colored/basic.svg +3 -3
  40. package/dist/icons/custom/colored/board-color.svg +5 -5
  41. package/dist/icons/custom/colored/cast-cloudy-color.svg +6 -6
  42. package/dist/icons/custom/colored/cast-partly-color.svg +7 -7
  43. package/dist/icons/custom/colored/cast-rainbow-color.svg +13 -13
  44. package/dist/icons/custom/colored/cast-sunny-color.svg +4 -4
  45. package/dist/icons/custom/colored/clap-bronze.svg +8 -8
  46. package/dist/icons/custom/colored/clap-gold.svg +8 -8
  47. package/dist/icons/custom/colored/clap-silver.svg +8 -8
  48. package/dist/icons/custom/colored/class.svg +13 -13
  49. package/dist/icons/custom/colored/codap-color.svg +13 -13
  50. package/dist/icons/custom/colored/ebook-color.svg +5 -5
  51. package/dist/icons/custom/colored/embedded-color.svg +38 -38
  52. package/dist/icons/custom/colored/emo-clap-color.svg +252 -252
  53. package/dist/icons/custom/colored/emo-good-color.svg +68 -68
  54. package/dist/icons/custom/colored/emo-great-color.svg +67 -67
  55. package/dist/icons/custom/colored/emo-heart-color.svg +239 -239
  56. package/dist/icons/custom/colored/emo-hundred-color.svg +194 -194
  57. package/dist/icons/custom/colored/emo-neutral-color.svg +76 -76
  58. package/dist/icons/custom/colored/emo-stars-color.svg +121 -121
  59. package/dist/icons/custom/colored/emo-thumbup-color.svg +238 -238
  60. package/dist/icons/custom/colored/empty.svg +1 -1
  61. package/dist/icons/custom/colored/entry-color.svg +4 -4
  62. package/dist/icons/custom/colored/filename-all-color.svg +4 -4
  63. package/dist/icons/custom/colored/filename-doc-color.svg +5 -5
  64. package/dist/icons/custom/colored/filename-hwp-color.svg +6 -6
  65. package/dist/icons/custom/colored/filename-img-color.svg +6 -6
  66. package/dist/icons/custom/colored/filename-mp4-color.svg +5 -5
  67. package/dist/icons/custom/colored/filename-pdf-color.svg +12 -12
  68. package/dist/icons/custom/colored/filename-ppt-color.svg +6 -6
  69. package/dist/icons/custom/colored/filename-xls-color.svg +5 -5
  70. package/dist/icons/custom/colored/filename-zip-color.svg +5 -5
  71. package/dist/icons/custom/colored/google.svg +13 -13
  72. package/dist/icons/custom/colored/hand-fill.svg +4 -4
  73. package/dist/icons/custom/colored/judge-color.svg +6 -6
  74. package/dist/icons/custom/colored/makecode-color.svg +4 -4
  75. package/dist/icons/custom/colored/master.svg +12 -12
  76. package/dist/icons/custom/colored/material.svg +6 -6
  77. package/dist/icons/custom/colored/medal-bronze.svg +9 -9
  78. package/dist/icons/custom/colored/medal-gold.svg +9 -9
  79. package/dist/icons/custom/colored/medal-silver.svg +9 -9
  80. package/dist/icons/custom/colored/pro.svg +4 -4
  81. package/dist/icons/custom/colored/problem.svg +7 -7
  82. package/dist/icons/custom/colored/python-color.svg +4 -4
  83. package/dist/icons/custom/colored/quiz-color.svg +12 -12
  84. package/dist/icons/custom/colored/resource-color.svg +13 -13
  85. package/dist/icons/custom/colored/scratch-color.svg +6 -6
  86. package/dist/icons/custom/colored/type-helper.svg +9 -9
  87. package/dist/icons/custom/colored/whale.svg +7 -7
  88. package/dist/icons/custom/colored/worksheet-color.svg +5 -5
  89. package/dist/icons/custom/default/ai-quiz.svg +8 -8
  90. package/dist/icons/custom/default/ai-socroom.svg +13 -13
  91. package/dist/icons/custom/default/badge.svg +4 -4
  92. package/dist/icons/custom/default/board.svg +5 -5
  93. package/dist/icons/custom/default/cast-cloudy.svg +3 -3
  94. package/dist/icons/custom/default/cast-partly.svg +4 -4
  95. package/dist/icons/custom/default/cast-rainbow.svg +12 -12
  96. package/dist/icons/custom/default/cast-sunny.svg +3 -3
  97. package/dist/icons/custom/default/codap.svg +11 -11
  98. package/dist/icons/custom/default/ebook.svg +3 -3
  99. package/dist/icons/custom/default/embedded.svg +4 -4
  100. package/dist/icons/custom/default/emo-clap.svg +6 -6
  101. package/dist/icons/custom/default/emo-good.svg +12 -12
  102. package/dist/icons/custom/default/emo-great.svg +12 -12
  103. package/dist/icons/custom/default/emo-heart.svg +5 -5
  104. package/dist/icons/custom/default/emo-hundred.svg +3 -3
  105. package/dist/icons/custom/default/emo-neutral.svg +14 -14
  106. package/dist/icons/custom/default/emo-stars.svg +14 -14
  107. package/dist/icons/custom/default/emo-thumbup.svg +3 -3
  108. package/dist/icons/custom/default/entry.svg +4 -4
  109. package/dist/icons/custom/default/fab.svg +10 -10
  110. package/dist/icons/custom/default/grant-alt.svg +5 -5
  111. package/dist/icons/custom/default/grant.svg +4 -4
  112. package/dist/icons/custom/default/hand-line.svg +3 -3
  113. package/dist/icons/custom/default/judge.svg +3 -3
  114. package/dist/icons/custom/default/makecode.svg +5 -5
  115. package/dist/icons/custom/default/pdf.svg +3 -3
  116. package/dist/icons/custom/default/python.svg +7 -7
  117. package/dist/icons/custom/default/quiz.svg +4 -4
  118. package/dist/icons/custom/default/resource.svg +11 -11
  119. package/dist/icons/custom/default/scratch.svg +3 -3
  120. package/dist/icons/custom/default/scroll-alt.svg +5 -5
  121. package/dist/icons/custom/default/scroll-fill.svg +4 -4
  122. package/dist/icons/custom/default/scroll-line.svg +5 -5
  123. package/dist/icons/custom/default/symbol.svg +4 -4
  124. package/dist/icons/custom/default/worksheet.svg +4 -4
  125. package/dist/icons/custom/svgrColoredTemplate.js +26 -26
  126. package/dist/icons/custom/svgrDefaultTemplate.js +26 -26
  127. package/dist/patterns/Accordion.js +20 -20
  128. package/dist/patterns/Dropdown/DropdownItem/DropdownItem.js +60 -60
  129. package/dist/patterns/Dropdown/DropdownMenu/DropdownMenu.js +27 -27
  130. package/dist/patterns/Dropdown/DropdownMenu/style.js +19 -19
  131. package/dist/patterns/LexicalEditor/Plugins.js +36 -36
  132. package/dist/patterns/LexicalEditor/components/FileSelectInput.js +23 -23
  133. package/dist/patterns/LexicalEditor/components/InsertImageDialog/ImagePreview.js +4 -4
  134. package/dist/patterns/LexicalEditor/components/InsertImageDialog/InsertImageDialog.js +15 -15
  135. package/dist/patterns/LexicalEditor/components/InsertVideoDialog/InsertVideoDialog.js +17 -17
  136. package/dist/patterns/LexicalEditor/components/UploadFileDialog/UploadFileDialog.js +2 -2
  137. package/dist/patterns/LexicalEditor/hr.svg +3 -3
  138. package/dist/patterns/LexicalEditor/nodes/FileNode/FileComponent.js +44 -44
  139. package/dist/patterns/LexicalEditor/nodes/FileNode/FileDownloadButton.js +25 -25
  140. package/dist/patterns/LexicalEditor/nodes/ImageNode/ImageComponent.js +8 -8
  141. package/dist/patterns/LexicalEditor/nodes/ImageNode/ImageResizer.js +60 -60
  142. package/dist/patterns/LexicalEditor/nodes/ProblemInputNode/InputComponent.js +19 -19
  143. package/dist/patterns/LexicalEditor/nodes/ProblemInputNode/SegmentedInput.js +49 -49
  144. package/dist/patterns/LexicalEditor/nodes/ProblemInputNode/SettingForm/FormSolution.js +7 -7
  145. package/dist/patterns/LexicalEditor/nodes/ProblemInputNode/SettingForm/SettingForm.js +73 -73
  146. package/dist/patterns/LexicalEditor/nodes/ProblemInputNode/SettingForm/TextTypeDropdown.js +5 -5
  147. package/dist/patterns/LexicalEditor/nodes/ProblemInputNode/TextInput.js +7 -7
  148. package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SelectBox/SelectBoxComponent.js +69 -69
  149. package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SelectBox/SelectBoxEdit.js +3 -3
  150. package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SelectBox/SelectBoxView.js +15 -15
  151. package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SelectComponent.js +28 -28
  152. package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SettingForm/FormSelection.js +54 -54
  153. package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SettingForm/SettingForm.js +61 -61
  154. package/dist/patterns/LexicalEditor/nodes/SelfEvaluationNode/EvaluationComponent/Evaluation/Evaluation.js +75 -75
  155. package/dist/patterns/LexicalEditor/nodes/SelfEvaluationNode/EvaluationComponent/Evaluation/SettingForm/FormIconAndLabel/FormIconAndLabel.js +17 -17
  156. package/dist/patterns/LexicalEditor/nodes/SelfEvaluationNode/EvaluationComponent/Evaluation/SettingForm/FormIconAndLabel/FormLabel.js +7 -7
  157. package/dist/patterns/LexicalEditor/nodes/SelfEvaluationNode/EvaluationComponent/Evaluation/SettingForm/FormQuestion.js +28 -28
  158. package/dist/patterns/LexicalEditor/nodes/SelfEvaluationNode/EvaluationComponent/Evaluation/SettingForm/SettingForm.js +52 -52
  159. package/dist/patterns/LexicalEditor/nodes/SelfEvaluationNode/EvaluationComponent/EvaluationComponent.js +7 -7
  160. package/dist/patterns/LexicalEditor/nodes/SheetInputNode/InputComponent.js +25 -25
  161. package/dist/patterns/LexicalEditor/nodes/SheetInputNode/SettingForm.js +53 -53
  162. package/dist/patterns/LexicalEditor/nodes/SheetSelectNode/SelectComponent/SelectBox/SelectBoxComponent.js +54 -54
  163. package/dist/patterns/LexicalEditor/nodes/SheetSelectNode/SelectComponent/SelectBox/SelectBoxView.js +5 -5
  164. package/dist/patterns/LexicalEditor/nodes/SheetSelectNode/SelectComponent/SelectComponent.js +21 -21
  165. package/dist/patterns/LexicalEditor/nodes/SheetSelectNode/SelectComponent/SettingForm/FormSelection.js +42 -42
  166. package/dist/patterns/LexicalEditor/nodes/SheetSelectNode/SelectComponent/SettingForm/SettingForm.js +71 -71
  167. package/dist/patterns/LexicalEditor/nodes/VideoNode/VideoComponent.js +7 -7
  168. package/dist/patterns/LexicalEditor/plugins/ComponentAdderPlugin/ComponentAdder.js +51 -51
  169. package/dist/patterns/LexicalEditor/plugins/ComponentAdderPlugin/ComponentAdderPlugin.js +11 -11
  170. package/dist/patterns/LexicalEditor/plugins/ComponentAdderPlugin/menu.svg +7 -7
  171. package/dist/patterns/LexicalEditor/plugins/ComponentAdderPlugin/plus.svg +2 -2
  172. package/dist/patterns/LexicalEditor/plugins/ComponentPickerMenuPlugin/ComponentPickerMenuItem.js +32 -32
  173. package/dist/patterns/LexicalEditor/plugins/ComponentPickerMenuPlugin/ComponentPickerMenuList.js +32 -32
  174. package/dist/patterns/LexicalEditor/plugins/ComponentPickerMenuPlugin/ComponentPickerMenuPlugin.js +12 -12
  175. package/dist/patterns/LexicalEditor/plugins/ComponentPickerMenuPlugin/componentPickerOptionUtils.js +2 -2
  176. package/dist/patterns/LexicalEditor/plugins/FloatingLinkEditorPlugin/FloatingLinkEditor.js +49 -49
  177. package/dist/patterns/LexicalEditor/plugins/FloatingTextFormatToolbarPlugin/FloatingTextFormatPopup.js +36 -36
  178. package/dist/patterns/LexicalEditor/plugins/ParagraphPlaceholderPlugin/index.js +7 -7
  179. package/dist/patterns/LexicalEditor/theme.js +243 -243
  180. package/dist/patterns/SegmentedControl/SegmentedControlButton.js +10 -10
  181. package/dist/patterns/SegmentedControl/SegmentedControlGroup.js +8 -8
  182. package/dist/patterns/SegmentedControl/SegmentedControlSquareButton.js +2 -2
  183. package/dist/patterns/Tabs.js +43 -43
  184. package/dist/patterns/ToggleButtonGroup/ToggleButton.js +40 -40
  185. package/dist/patterns/ToggleButtonGroup/ToggleButtonGroup.js +11 -11
  186. package/dist/utils/hover.js +12 -12
  187. package/dist/utils/reset.js +19 -19
  188. package/dist/utils/visuallyHidden.js +10 -10
  189. package/package.json +109 -109
@@ -164,57 +164,57 @@ export function FloatingLinkEditor(props) {
164
164
  editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);
165
165
  }, children: _jsx(DeleteBinLineIcon, {}) })] })] })) }));
166
166
  }
167
- const Container = styled.div `
168
- position: absolute;
169
- top: 0;
170
- left: 0;
171
- z-index: 10;
172
- will-change: transform;
173
-
174
- display: flex;
175
- padding: 0px 4px;
176
- align-items: center;
177
- gap: 4px;
178
-
179
- border-radius: 8px;
180
- // 메뉴가 활성화되지 않아도 클릭한 영역을 따라 다니도록 개발되었습니다.
181
- // border가 있으면 활성화되지 않은 상태에서도 노출되므로 border를 제거합니다.
182
- /* border: 1px solid #e8e8eb; */
183
- background: ${({ theme }) => theme.color.background.neutralBase};
184
- box-shadow: 0px 3px 15px -3px rgba(13, 20, 33, 0.13);
185
-
186
- width: 400px;
167
+ const Container = styled.div `
168
+ position: absolute;
169
+ top: 0;
170
+ left: 0;
171
+ z-index: 10;
172
+ will-change: transform;
173
+
174
+ display: flex;
175
+ padding: 0px 4px;
176
+ align-items: center;
177
+ gap: 4px;
178
+
179
+ border-radius: 8px;
180
+ // 메뉴가 활성화되지 않아도 클릭한 영역을 따라 다니도록 개발되었습니다.
181
+ // border가 있으면 활성화되지 않은 상태에서도 노출되므로 border를 제거합니다.
182
+ /* border: 1px solid #e8e8eb; */
183
+ background: ${({ theme }) => theme.color.background.neutralBase};
184
+ box-shadow: 0px 3px 15px -3px rgba(13, 20, 33, 0.13);
185
+
186
+ width: 400px;
187
187
  `;
188
- const Buttons = styled.div `
189
- display: flex;
190
- align-items: center;
191
- gap: 4px;
188
+ const Buttons = styled.div `
189
+ display: flex;
190
+ align-items: center;
191
+ gap: 4px;
192
192
  `;
193
- const Button = styled.button `
194
- // reset
195
- border: none;
196
- outline: none;
197
- background: none;
198
- cursor: pointer;
199
-
200
- padding: 8px 4px;
201
-
202
- svg {
203
- width: 18px;
204
- height: 18px;
205
- }
193
+ const Button = styled.button `
194
+ // reset
195
+ border: none;
196
+ outline: none;
197
+ background: none;
198
+ cursor: pointer;
199
+
200
+ padding: 8px 4px;
201
+
202
+ svg {
203
+ width: 18px;
204
+ height: 18px;
205
+ }
206
206
  `;
207
- const Link = styled.a `
208
- width: 100%;
209
- padding: 0px 8px;
210
-
211
- /* Default/Paragraph/16px-Rg */
212
- font-family: ${({ theme }) => theme.fontFamily.ui};
213
- font-size: 16px;
214
- font-style: normal;
215
- font-weight: 400;
216
- line-height: 24px; /* 150% */
207
+ const Link = styled.a `
208
+ width: 100%;
209
+ padding: 0px 8px;
210
+
211
+ /* Default/Paragraph/16px-Rg */
212
+ font-family: ${({ theme }) => theme.fontFamily.ui};
213
+ font-size: 16px;
214
+ font-style: normal;
215
+ font-weight: 400;
216
+ line-height: 24px; /* 150% */
217
217
  `;
218
- const StyledInput = styled(Input) `
219
- margin: 4px 0px;
218
+ const StyledInput = styled(Input) `
219
+ margin: 4px 0px;
220
220
  `;
@@ -19,41 +19,41 @@ export const FloatingTextFormatPopup = forwardRef(function FloatingTextFormatPop
19
19
  editor.dispatchCommand(FORMAT_TEXT_COMMAND, "code");
20
20
  }, active: Boolean(isCode), "aria-label": "Insert code block", children: _jsx(CodeFillIcon, {}) }), _jsx(IconButton, { type: "button", onClick: insertLink, active: Boolean(isLink), "aria-label": "Insert link", children: _jsx(LinkIcon, {}) })] })) }));
21
21
  });
22
- const Container = styled.div `
23
- position: absolute;
24
- top: 0;
25
- left: 0;
26
- z-index: 10;
27
- will-change: transform;
28
-
29
- display: inline-flex;
30
- padding: 0px 4px;
31
- align-items: flex-start;
32
- gap: 4px;
33
-
34
- border-radius: 8px;
35
- border: 1px solid #e8e8eb;
36
- background: ${({ theme }) => theme.color.background.neutralBase};
37
- box-shadow: 0px 3px 15px -3px rgba(13, 20, 33, 0.13);
22
+ const Container = styled.div `
23
+ position: absolute;
24
+ top: 0;
25
+ left: 0;
26
+ z-index: 10;
27
+ will-change: transform;
28
+
29
+ display: inline-flex;
30
+ padding: 0px 4px;
31
+ align-items: flex-start;
32
+ gap: 4px;
33
+
34
+ border-radius: 8px;
35
+ border: 1px solid #e8e8eb;
36
+ background: ${({ theme }) => theme.color.background.neutralBase};
37
+ box-shadow: 0px 3px 15px -3px rgba(13, 20, 33, 0.13);
38
38
  `;
39
- const IconButton = styled.button `
40
- border: none;
41
- outline: none;
42
-
43
- display: flex;
44
- padding: 8px 4px;
45
- align-items: center;
46
- gap: 4px;
47
-
48
- background: #fff;
49
-
50
- svg {
51
- width: 18px;
52
- height: 18px;
53
- ${({ theme, active }) => active && `color: ${theme.color.foreground.primary};`}
54
- }
55
-
56
- &:hover {
57
- background: ${({ theme }) => theme.color.background.neutralAlt};
58
- }
39
+ const IconButton = styled.button `
40
+ border: none;
41
+ outline: none;
42
+
43
+ display: flex;
44
+ padding: 8px 4px;
45
+ align-items: center;
46
+ gap: 4px;
47
+
48
+ background: #fff;
49
+
50
+ svg {
51
+ width: 18px;
52
+ height: 18px;
53
+ ${({ theme, active }) => active && `color: ${theme.color.foreground.primary};`}
54
+ }
55
+
56
+ &:hover {
57
+ background: ${({ theme }) => theme.color.background.neutralAlt};
58
+ }
59
59
  `;
@@ -3,13 +3,13 @@ import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext
3
3
  import { $getSelection, $isParagraphNode, $isRangeSelection } from "lexical";
4
4
  import { css as cssToClassName } from "@emotion/css";
5
5
  import { useTheme } from "@emotion/react";
6
- const getPlaceholderClassName = (theme) => cssToClassName `
7
- &::before {
8
- position: absolute;
9
- content: attr(data-placeholder);
10
- color: ${theme.color.foreground.neutralBaseDisabled};
11
- pointer-events: none;
12
- }
6
+ const getPlaceholderClassName = (theme) => cssToClassName `
7
+ &::before {
8
+ position: absolute;
9
+ content: attr(data-placeholder);
10
+ color: ${theme.color.foreground.neutralBaseDisabled};
11
+ pointer-events: none;
12
+ }
13
13
  `;
14
14
  export const ParagraphPlaceholderPlugin = ({ placeholder, }) => {
15
15
  const [editor] = useLexicalComposerContext();