@team-monolith/cds 1.102.0 → 1.102.1

package/dist/patterns/LexicalEditor/nodes/ProblemInputNode/SettingForm/FormSolution.js

@@ -19,10 +19,6 @@ export function FormSolution(props) {
             `, startIcon: _jsx(TextTypeDropdown, { index: index, control: control, disabled: disabled }), endIcon: _jsxs("div", Object.assign({ css: css `
                   display: flex;
                   gap: 4px;
-                ` }, { children: [onDelete && (_jsx(SquareButton, { color: "white", size: "xsmall", icon: _jsx(DeleteBinLineIcon, {}), onClick: onDelete, buttonProps: {
-                                "aria-label": "삭제",
-                            } })), disabled && (_jsx(Tooltip, Object.assign({ text: _jsxs("span", { children: ["\uC785\uB825 \uCE78 \uC124\uC815\uC774 '\uAE00\uC790 \uC218\uB300\uB85C'\uC778 \uACBD\uC6B0", _jsx("br", {}), "\uC815\uB2F5\uC744 \uD558\uB098\uB9CC \uB4F1\uB85D\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4."] }) }, { children: _jsx(SquareButton, { color: "danger", size: "xsmall", icon: _jsx(AlertFillIcon, { color: theme.color.foreground.neutralAlt }), disabled: true, buttonProps: {
-                                    "aria-label": "정답 등록 불가",
-                                } }) })))] })) }));
+                ` }, { children: [onDelete && (_jsx(SquareButton, { color: "white", size: "xsmall", icon: _jsx(DeleteBinLineIcon, {}), onClick: onDelete, "aria-label": "\uC0AD\uC81C" })), disabled && (_jsx(Tooltip, Object.assign({ text: _jsxs("span", { children: ["\uC785\uB825 \uCE78 \uC124\uC815\uC774 '\uAE00\uC790 \uC218\uB300\uB85C'\uC778 \uACBD\uC6B0", _jsx("br", {}), "\uC815\uB2F5\uC744 \uD558\uB098\uB9CC \uB4F1\uB85D\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4."] }) }, { children: _jsx(SquareButton, { color: "danger", size: "xsmall", icon: _jsx(AlertFillIcon, { color: theme.color.foreground.neutralAlt }), disabled: true, "aria-label": "\uC815\uB2F5 \uB4F1\uB85D \uBD88\uAC00" }) })))] })) }));
         } }));
 }

package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SelectComponent.js

@@ -76,9 +76,7 @@ export function SelectComponent(props) {
                                 ? `${index + 1}번 선택지`
                                 : selection.show.text, onClick: () => setSettingOpen(true) }, index))) })), _jsx(SquareButton, { size: "small", color: "icon", icon: _jsx(Settings3FillIcon, {}), onClick: () => {
                             setSettingOpen(true);
-                        }, buttonProps: {
-                            "aria-label": "선택지 설정",
-                        } })] })), settingOpen && (_jsx(SettingForm, { selections: selections, nodeKey: nodeKey, onClose: () => setSettingOpen(false) }))] }));
+                        }, "aria-label": "\uC120\uD0DD\uC9C0 \uC124\uC815" })] })), settingOpen && (_jsx(SettingForm, { selections: selections, nodeKey: nodeKey, onClose: () => setSettingOpen(false) }))] }));
 }
 const Alert = styled.div(({ theme }) => css `
     display: flex;

package/dist/patterns/LexicalEditor/nodes/ProblemSelectNode/SettingForm/FormSelection.js

@@ -54,15 +54,9 @@ export function FormSelection(props) {
           align-items: center;
         ` }, { children: [_jsx(SquareButton, { color: "icon", size: "xsmall", icon: value.show.image ? _jsx(ImageEditFillIcon, {}) : _jsx(ImageAddFillIcon, {}), onClick: () => {
                             setImageOpen(true);
-                        }, buttonProps: {
-                            "aria-label": value.show.image
-                                ? "이미지 바꾸기"
-                                : "이미지 삽입하기",
-                        } }), _jsxs(Answer, { children: ["\uC815\uB2F5", _jsx(Switch, { checked: Boolean(value.isAnswer), size: "small", onChange: () => {
+                        }, "aria-label": value.show.image ? "이미지 바꾸기" : "이미지 삽입하기" }), _jsxs(Answer, { children: ["\uC815\uB2F5", _jsx(Switch, { checked: Boolean(value.isAnswer), size: "small", onChange: () => {
                                     onChange(Object.assign(Object.assign({}, value), { isAnswer: !value.isAnswer }));
-                                } })] }), onDelete && (_jsx(SquareButton, { color: "white", size: "xsmall", icon: _jsx(DeleteBinLineIcon, {}), onClick: onDelete, buttonProps: {
-                            "aria-label": "삭제",
-                        } }))] }))] }));
+                                } })] }), onDelete && (_jsx(SquareButton, { color: "white", size: "xsmall", icon: _jsx(DeleteBinLineIcon, {}), onClick: onDelete, "aria-label": "\uC0AD\uC81C" }))] }))] }));
 }
 const Container = styled.div(({ theme }) => css `
     display: flex;

package/dist/patterns/LexicalEditor/nodes/SelfEvaluationNode/EvaluationComponent/Evaluation/SettingForm/FormQuestion.js

@@ -8,9 +8,7 @@ export function FormQuestion(props) {
     const { control, index, onDelete } = props;
     return (_jsxs(Item, { children: [_jsx(Index, { children: index + 1 }), _jsx(FormInput, { control: control, name: `evaluations.${index}.question.text`, rules: {
                     required: "필수 입력 항목입니다.",
-                }, size: "small", placeholder: `${index + 1}번 평가 항목`, multiline: true, fullWidth: true }), onDelete && (_jsx(SquareButton, { color: "white", size: "xsmall", icon: _jsx(DeleteBinLineIcon, {}), onClick: onDelete, buttonProps: {
-                    "aria-label": "삭제",
-                } }))] }));
+                }, size: "small", placeholder: `${index + 1}번 평가 항목`, multiline: true, fullWidth: true }), onDelete && (_jsx(SquareButton, { color: "white", size: "xsmall", icon: _jsx(DeleteBinLineIcon, {}), onClick: onDelete, "aria-label": "\uC0AD\uC81C" }))] }));
 }
 const Item = styled.div(({ theme }) => css `
     display: flex;

package/dist/patterns/LexicalEditor/nodes/SelfEvaluationNode/EvaluationComponent/EvaluationComponent.js

@@ -51,9 +51,7 @@ export function EvaluationComponent(props) {
             width: ${EVALUATION_EDIT_WIDTH}px;
           `, data: data, evaluations: evaluations, onClick: () => setSettingOpen((open) => !open) }), _jsx(SquareButton, { size: "small", color: "icon", icon: _jsx(Settings3FillIcon, {}), onClick: () => {
                             setSettingOpen((open) => !open);
-                        }, buttonProps: {
-                            "aria-label": "평가 칸 설정",
-                        } })] })), settingOpen && (_jsx(SettingForm, { css: css `
+                        }, "aria-label": "\uD3C9\uAC00 \uCE78 \uC124\uC815" })] })), settingOpen && (_jsx(SettingForm, { css: css `
             width: ${EVALUATION_EDIT_WIDTH}px;
           `, iconType: iconType, labels: labels, evaluations: evaluations, nodeKey: nodeKey, onClose: () => setSettingOpen(false) }))] }));
 }

package/dist/patterns/LexicalEditor/nodes/SheetInputNode/InputComponent.js

@@ -58,9 +58,7 @@ export function InputComponent(props) {
         ` }, { children: [_jsx(VirtualInput, Object.assign({ onClick: () => setSettingOpen((open) => !open), css: multiline &&
                             css `
               height: ${TEXTAREA_HEIGHT + 2 * INPUT_VERTICAL_PADDING}px;
-            ` }, { children: multiline ? "서술형 입력 칸" : "단답형 입력 칸" })), _jsx(SquareButton, { size: "small", color: "icon", icon: _jsx(Settings3FillIcon, {}), onClick: () => setSettingOpen((open) => !open), buttonProps: {
-                            "aria-label": "입력 칸 설정",
-                        } })] })), settingOpen && (_jsx(SettingForm, { multiline: multiline, placeholder: placeholder, nodeKey: nodeKey, onClose: () => setSettingOpen(false) }))] }));
+            ` }, { children: multiline ? "서술형 입력 칸" : "단답형 입력 칸" })), _jsx(SquareButton, { size: "small", color: "icon", icon: _jsx(Settings3FillIcon, {}), onClick: () => setSettingOpen((open) => !open), "aria-label": "\uC785\uB825 \uCE78 \uC124\uC815" })] })), settingOpen && (_jsx(SettingForm, { multiline: multiline, placeholder: placeholder, nodeKey: nodeKey, onClose: () => setSettingOpen(false) }))] }));
 }
 const VirtualInput = styled.div(({ theme }) => css `
     box-sizing: border-box;

package/dist/patterns/LexicalEditor/nodes/SheetSelectNode/SelectComponent/SelectComponent.js

@@ -64,9 +64,7 @@ export function SelectComponent(props) {
                                 ? `${index + 1}번 선택지`
                                 : selection.show.text, onClick: () => setSettingOpen((open) => !open) }, index))) })), _jsx(SquareButton, { size: "small", color: "icon", icon: _jsx(Settings3FillIcon, {}), onClick: () => {
                             setSettingOpen((open) => !open);
-                        }, buttonProps: {
-                            "aria-label": "선택지 설정",
-                        } })] })), settingOpen && (_jsx(SettingForm, { data: {
+                        }, "aria-label": "\uC120\uD0DD\uC9C0 \uC124\uC815" })] })), settingOpen && (_jsx(SettingForm, { data: {
                     selections,
                     allowMultipleAnswers,
                 }, nodeKey: nodeKey, onClose: () => setSettingOpen(false) }))] }));

package/dist/patterns/LexicalEditor/nodes/SheetSelectNode/SelectComponent/SettingForm/FormSelection.js

@@ -53,11 +53,7 @@ export function FormSelection(props) {
           align-items: center;
         ` }, { children: [_jsx(SquareButton, { color: "icon", size: "xsmall", icon: value.image ? _jsx(ImageEditFillIcon, {}) : _jsx(ImageAddFillIcon, {}), onClick: () => {
                             setImageOpen(true);
-                        }, buttonProps: {
-                            "aria-label": value.image ? "이미지 바꾸기" : "이미지 삽입하기",
-                        } }), onDelete && (_jsx(SquareButton, { color: "white", size: "xsmall", icon: _jsx(DeleteBinLineIcon, {}), onClick: onDelete, buttonProps: {
-                            "aria-label": "삭제",
-                        } }))] }))] }));
+                        }, "aria-label": value.image ? "이미지 바꾸기" : "이미지 삽입하기" }), onDelete && (_jsx(SquareButton, { color: "white", size: "xsmall", icon: _jsx(DeleteBinLineIcon, {}), onClick: onDelete, "aria-label": "\uC0AD\uC81C" }))] }))] }));
 }
 const Container = styled.div(({ theme }) => css `
     display: flex;

package/dist/patterns/LexicalEditor/plugins/ComponentAdderPlugin/menu.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+  <path d="M9.41002 7.29999H9.40002" stroke="#363636" stroke-width="2.6" stroke-linecap="round"/>
+  <path d="M14.6 7.29999H14.59" stroke="#363636" stroke-width="2.6" stroke-linecap="round"/>
+  <path d="M9.31004 12H9.30005" stroke="#363636" stroke-width="2.6" stroke-linecap="round"/>
+  <path d="M14.6 12H14.59" stroke="#363636" stroke-width="2.6" stroke-linecap="round"/>
+  <path d="M9.41002 16.7H9.40002" stroke="#363636" stroke-width="2.6" stroke-linecap="round"/>
+  <path d="M14.6 16.7H14.59" stroke="#363636" stroke-width="2.6" stroke-linecap="round"/>
+</svg>

package/dist/patterns/LexicalEditor/plugins/ComponentAdderPlugin/plus.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+  <path d="M12 7V12M12 12V17M12 12H17M12 12H7" stroke="#363636" stroke-width="2" stroke-linecap="round"/>
+</svg>

package/dist/patterns/SegmentedControl/SegmentedControlSquareButton.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { SquareButtonProps } from "../..";
-export interface SegmentedControlSquareButtonProps<T> extends Omit<SquareButtonProps, "color" | "size" | "icon"> {
+export interface SegmentedControlSquareButtonProps<T> extends Omit<SquareButtonProps, "color" | "size" | "icon" | "value"> {
     value: T;
     icon: React.ReactNode | ((isActive: boolean) => React.ReactNode);
 }

package/dist/patterns/SegmentedControl/SegmentedControlSquareButton.js

@@ -11,7 +11,6 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 /** @jsxImportSource @emotion/react */
-import styled from "@emotion/styled";
 import { css } from "@emotion/react";
 import React, { useContext } from "react";
 import { shadows, SquareButton } from "../..";
@@ -20,16 +19,16 @@ import { SegmentedControlGroupPropsContext, } from "./SegmentedControlGroupProps
  * [피그마](https://www.figma.com/file/PnQp3tPxiCjgsPZfLUaUL1/Codle-PD-Kit---Patterns?node-id=181%3A89883)
  */
 export const SegmentedControlSquareButton = React.forwardRef(function SegmentedControlSquareButton(props, ref) {
-    const { onClick, icon, buttonProps } = props, other = __rest(props, ["onClick", "icon", "buttonProps"]);
+    const { onClick, icon, value } = props, other = __rest(props, ["onClick", "icon", "value"]);
     const context = useContext(SegmentedControlGroupPropsContext);
     const handleClick = (e) => {
         var _a;
-        (_a = context.onClick) === null || _a === void 0 ? void 0 : _a.call(context, props.value);
+        (_a = context.onClick) === null || _a === void 0 ? void 0 : _a.call(context, value);
         onClick === null || onClick === void 0 ? void 0 : onClick(e);
     };
     const isActive = context.multiSelect
-        ? context.value.includes(props.value)
-        : context.value === props.value;
+        ? context.value.includes(value)
+        : context.value === value;
     // 화살표 키(좌, 우)로 인접 버튼으로 포커스 이동하는 로직
     const handleKeyDown = (e) => {
         var _a, _b, _c, _d;
@@ -48,19 +47,8 @@ export const SegmentedControlSquareButton = React.forwardRef(function SegmentedC
             siblingButton.focus();
         }
     };
-    return (_jsx(StyledSquareButton, Object.assign({}, other, { ref: ref, isActive: isActive, icon: typeof icon === "function" ? icon(isActive) : icon, color: isActive ? "white" : "icon", size: context.size, fullWidth: context.fullWidth, onClick: handleClick, onKeyDown: handleKeyDown, disabled: context.disabled || props.disabled, buttonProps: Object.assign(Object.assign({}, buttonProps), { "aria-selected": isActive, role: "tab", tabIndex: isActive ? 0 : -1 }) })));
+    return (_jsx(SquareButton, Object.assign({}, other, { css: isActive &&
+            css `
+            box-shadow: ${shadows.shadow04};
+          `, ref: ref, icon: typeof icon === "function" ? icon(isActive) : icon, color: isActive ? "white" : "icon", size: context.size, onClick: handleClick, onKeyDown: handleKeyDown, disabled: context.disabled || props.disabled, "aria-selected": isActive, role: "tab", tabIndex: isActive ? 0 : -1 })));
 });
-const StyledSquareButton = styled(SquareButton, {
-    shouldForwardProp: (prop) => prop !== "isActive",
-})(({ isActive }) => css `
-    display: flex;
-    justify-content: center;
-    flex-grow: 1;
-    ${isActive &&
-    `
-      box-shadow: ${shadows.shadow04}; 
-      span {
-        font-weight: 700;
-      }
-    `}
-  `);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@team-monolith/cds",
-  "version": "1.102.0",
+  "version": "1.102.1",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "sideEffects": false,