@team-monolith/cds 1.96.0 → 1.96.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.
|
@@ -22,13 +22,22 @@ const TYPE_TO_INDEX_ICON = (type) => ({
|
|
|
22
22
|
})[type];
|
|
23
23
|
export function SelectBoxView(props) {
|
|
24
24
|
const { index, isSelected, isAnswer, image, text, onClick } = props;
|
|
25
|
-
const
|
|
25
|
+
const selectedTypeAndDescription = isSelected
|
|
26
26
|
? isAnswer === undefined
|
|
27
|
-
?
|
|
27
|
+
? {
|
|
28
|
+
type: "primary",
|
|
29
|
+
description: "선택됨",
|
|
30
|
+
}
|
|
28
31
|
: isAnswer
|
|
29
|
-
?
|
|
30
|
-
|
|
31
|
-
|
|
32
|
+
? {
|
|
33
|
+
type: "success",
|
|
34
|
+
description: "선택됨, 정답",
|
|
35
|
+
}
|
|
36
|
+
: {
|
|
37
|
+
type: "danger",
|
|
38
|
+
description: "선택됨, 오답",
|
|
39
|
+
}
|
|
40
|
+
: null;
|
|
32
41
|
const boxRef = useRef(null);
|
|
33
42
|
const handleKeyDown = (e) => {
|
|
34
43
|
// onClick이 없으면 아무것도 하지 않음.
|
|
@@ -50,7 +59,15 @@ export function SelectBoxView(props) {
|
|
|
50
59
|
const ariaText = text || (image && image.altText) || index.toString() + "번 선택지";
|
|
51
60
|
return (_jsx(SelectBoxComponent, { css: css `
|
|
52
61
|
width: 100%;
|
|
53
|
-
`, ref: boxRef, role: onClick ? "checkbox" : undefined, "aria-checked": isSelected, "aria-label": onClick
|
|
62
|
+
`, ref: boxRef, role: onClick ? "checkbox" : undefined, "aria-checked": isSelected, "aria-label": onClick
|
|
63
|
+
? ariaText +
|
|
64
|
+
" " +
|
|
65
|
+
(selectedTypeAndDescription
|
|
66
|
+
? selectedTypeAndDescription.description
|
|
67
|
+
: "선택하기")
|
|
68
|
+
: ariaText, tabIndex: onClick ? 0 : -1, type: selectedTypeAndDescription === null || selectedTypeAndDescription === void 0 ? void 0 : selectedTypeAndDescription.type, index: selectedTypeAndDescription
|
|
69
|
+
? TYPE_TO_INDEX_ICON(selectedTypeAndDescription.type)
|
|
70
|
+
: index, image: image, text: text, onClick: onClick,
|
|
54
71
|
// 선택되지 않았으나 정답일 때 정답 태그를 표시
|
|
55
72
|
endIcon: isAnswer &&
|
|
56
73
|
!isSelected && (_jsx(Tag, { label: "\uC815\uB2F5", icon: _jsx(CheckboxCircleFillIcon, {}), color: "green", css: css `
|