@team-monolith/cds 1.109.0 → 1.109.2

package/dist/components/AlertDialog/AlertDialog.d.ts

@@ -13,6 +13,8 @@ export interface AlertDialogOwnProps<RootComponentType extends React.ElementType
     icon?: React.ReactNode;
     /** 전달시 아이콘 패딩이 비활성화 됩니다. */
     disableIconPadding?: boolean;
+    /** Modal의 zindex를 직접 전달합니다. 미전달시 기본값(ZINDEX.ALERT = 700)이 사용됩니다. */
+    zIndex?: number;
 }
 export type AlertDialogProps<RootComponentType extends React.ElementType = AlertDialogTypeMap["defaultComponent"]> = PolymorphicProps<AlertDialogTypeMap<RootComponentType>, RootComponentType>;
 export interface AlertDialogTypeMap<RootComponentType extends React.ElementType = "div"> {

package/dist/components/AlertDialog/AlertDialog.js

@@ -20,11 +20,11 @@ import { AlertDialogContext } from "./AlertDialogContext";
 import { ZINDEX } from "../../utils/zIndex";
 import { Modal } from "../..";
 export const AlertDialog = React.forwardRef(function AlertDialog(props, ref) {
-    const { className, component: Component = "div", open, onClose, children, icon, disableIconPadding } = props, other = __rest(props, ["className", "component", "open", "onClose", "children", "icon", "disableIconPadding"]);
+    const { className, component: Component = "div", open, onClose, children, icon, disableIconPadding, zIndex } = props, other = __rest(props, ["className", "component", "open", "onClose", "children", "icon", "disableIconPadding", "zIndex"]);
     const theme = useTheme();
     const paddingAreaName = disableIconPadding ? "content" : "iconPadding";
     return (_jsx(Modal, Object.assign({ open: open, onClose: onClose, ref: ref, sx: {
-            zIndex: ZINDEX.ALERT,
+            zIndex: zIndex !== null && zIndex !== void 0 ? zIndex : ZINDEX.ALERT,
         } }, other, { children: _jsxs(Component, { className: className, css: css `
             width: 480px;
             max-height: calc(100% - 48px);

package/dist/patterns/Dropdown/DropdownItem/DropdownItem.js

@@ -11,10 +11,10 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
 /** @jsxImportSource @emotion/react */
-import { css } from "@emotion/react";
+import { css, useTheme } from "@emotion/react";
 import * as React from "react";
 import styled from "@emotion/styled";
-import { CheckboxInput, ArrowRightSLineIcon, HOVER, RESET_BUTTON, } from "../../..";
+import { CheckboxInput, ArrowRightSLineIcon, HOVER, RESET_BUTTON, OverflowTooltip, } from "../../..";
 import { useContext, useId, useRef } from "react";
 import { DropdownMenu } from "../DropdownMenu";
 import { DropdownContext } from "../DropdownContext";
@@ -31,6 +31,7 @@ const DropdownItem = React.forwardRef(function DropdownItem(props, ref) {
     const itemRef = useRef(null);
     const { open, onCloseOnItemClick, nestedIndex, itemState, setItemState } = useContext(DropdownContext);
     const dropdownMenuId = `dropdown-menu-${useId()}`;
+    const theme = useTheme();
     const absItemIndex = nestedIndex ? `${nestedIndex}-${index}` : `${index}`;
     // 서브메뉴가 존재하는지 여부
     const isSubMenuExist = Boolean(children);
@@ -61,7 +62,12 @@ const DropdownItem = React.forwardRef(function DropdownItem(props, ref) {
                 }
                 : {}), { children: _jsxs(Item, { ref: itemRef, disabled: disabled, selected: isSubMenuShowed || Boolean(active), children: [_jsxs(LeftWrapper, { children: [checkbox && (_jsx(StyledCheckboxInput, Object.assign({}, checkboxProps, { disabled: disabled, onClick: (e) => {
                                         e.stopPropagation();
-                                    } }))), startIcon && (_jsx(IconDiv, { type: type, preserveIconColor: preserveIconColor, children: startIcon })), _jsx(LabelDiv, { css: labelCss, type: type, children: label })] }), endIcon && (_jsx(IconDiv, { type: type, preserveIconColor: preserveIconColor, children: endIcon })), !endIcon && isSubMenuExist && (_jsx(IconDiv, { type: type, preserveIconColor: preserveIconColor, children: _jsx(ArrowRightSLineIcon, {}) }))] }) })), isSubMenuExist && (_jsx(DropdownContext.Provider, { value: {
+                                    } }))), startIcon && (_jsx(IconDiv, { type: type, preserveIconColor: preserveIconColor, children: startIcon })), _jsx(LabelDiv, { css: labelCss, type: type, children: _jsx(OverflowTooltip, { text: label, childrenCss: css `
+                  font-size: 14px;
+                  font-weight: 400;
+                  font-family: ${theme.fontFamily.ui};
+                  color: ${TYPE_TO_COLOR(theme, type)};
+                ` }) })] }), endIcon && (_jsx(IconDiv, { type: type, preserveIconColor: preserveIconColor, children: endIcon })), !endIcon && isSubMenuExist && (_jsx(IconDiv, { type: type, preserveIconColor: preserveIconColor, children: _jsx(ArrowRightSLineIcon, {}) }))] }) })), isSubMenuExist && (_jsx(DropdownContext.Provider, { value: {
                     open,
                     onCloseOnItemClick,
                     nestedIndex: absItemIndex,
@@ -93,9 +99,9 @@ const IconDiv = styled("div", {
     }
   `);
 const LabelDiv = styled.div `
+  flex: 1;
+  min-width: 0;
   overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
   font-size: 14px;
   font-weight: 400;
   font-family: ${({ theme }) => theme.fontFamily.ui};
@@ -108,6 +114,7 @@ const LeftWrapper = styled.div `
   white-space: nowrap;
   gap: 4px;
   flex: 1;
+  min-width: 0;
 `;
 const Item = styled.div(({ theme, selected, disabled }) => css `
     background-color: ${theme.color.background.neutralBase};

package/package.json

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