@designbasekorea/ui 0.2.6 → 0.2.7

package/dist/index.umd.js

@@ -6328,7 +6328,7 @@
                     }), onClick: handleDrawerClick, role: "dialog", "aria-modal": "true", "aria-labelledby": title ? `${id || 'drawer'}-title` : undefined, "aria-describedby": id ? `${id}-content` : undefined, tabIndex: -1, id: id, children: [(title || showCloseButton) && (jsxRuntime.jsxs("div", { className: "designbase-drawer__header", children: [title && (jsxRuntime.jsx("h2", { className: "designbase-drawer__title", id: id ? `${id}-title` : undefined, children: title })), showCloseButton && (jsxRuntime.jsx(Button, { variant: "ghost", size: "s", onClick: handleClose, className: "designbase-drawer__close-button", "aria-label": "\uB2EB\uAE30", children: jsxRuntime.jsx(icons.CloseIcon, { size: iconSize, color: "currentColor" }) }))] })), jsxRuntime.jsx("div", { className: "designbase-drawer__content", id: id ? `${id}-content` : undefined, children: children })] })] }), document.body);
     };
 
-    const Dropdown = ({ items, trigger, label = '메뉴', size = 'm', placement = 'bottom-left', fullWidth = false, disabled = false, className, isOpen: controlledIsOpen, onToggle, ...props }) => {
+    const Dropdown = ({ items, trigger, label = '메뉴', triggerVariant = 'tertiary', triggerIcon, iconOnly = false, size = 'm', placement = 'bottom-left', fullWidth = false, disabled = false, className, isOpen: controlledIsOpen, onToggle, ...props }) => {
         // 아이콘 크기 계산 (m이 기본값)
         const iconSize = size === 's' ? 14 : size === 'l' ? 18 : 16;
         const [isOpen, setIsOpen] = React.useState(false);
@@ -6457,13 +6457,11 @@
             'designbase-dropdown--full-width': fullWidth,
             'designbase-dropdown--disabled': disabled,
         }, className);
-        const triggerClasses = clsx('designbase-dropdown__trigger', {
-            'designbase-dropdown__trigger--open': isDropdownOpen,
-        });
+        const buttonSize = size;
         const menuClasses = clsx('designbase-dropdown__menu', `designbase-dropdown__menu--${placement}`, {
             'designbase-dropdown__menu--open': isDropdownOpen,
         });
-        return (jsxRuntime.jsxs("div", { ref: containerRef, className: classes, ...props, children: [jsxRuntime.jsx("button", { ref: triggerRef, className: triggerClasses, onClick: handleToggle, onKeyDown: handleKeyDown, disabled: disabled, "aria-haspopup": "true", "aria-expanded": isDropdownOpen, "aria-label": label, children: trigger || (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: "designbase-dropdown__trigger-label", children: label }), jsxRuntime.jsx(icons.ChevronDownIcon, { size: iconSize, className: "designbase-dropdown__trigger-icon" })] })) }), jsxRuntime.jsx("div", { ref: menuRef, className: menuClasses, role: "menu", "aria-label": label, children: items.map((item, index) => {
+        return (jsxRuntime.jsxs("div", { ref: containerRef, className: classes, ...props, children: [trigger ? (jsxRuntime.jsx("div", { ref: triggerRef, onClick: handleToggle, onKeyDown: handleKeyDown, children: trigger })) : (jsxRuntime.jsx("div", { ref: triggerRef, children: jsxRuntime.jsx(Button, { variant: triggerVariant, size: buttonSize, iconOnly: iconOnly, startIcon: triggerIcon, endIcon: icons.ChevronDownIcon, disabled: disabled, fullWidth: fullWidth, onPress: handleToggle, "aria-haspopup": "true", "aria-expanded": isDropdownOpen, "aria-label": label, className: isDropdownOpen ? 'designbase-dropdown__trigger--open' : '', children: label }) })), jsxRuntime.jsx("div", { ref: menuRef, className: menuClasses, role: "menu", "aria-label": label, children: items.map((item, index) => {
                         if (item.divider) {
                             return (jsxRuntime.jsx("div", { className: "designbase-dropdown__divider", role: "separator" }, `divider-${index}`));
                         }