@team-monolith/cds 1.17.3 → 1.18.1

package/dist/components/Popover.d.ts

@@ -7,10 +7,8 @@ export interface PopoverProps {
     content?: React.ReactNode;
     /** 좌측 아이콘 */
     icon?: React.ReactNode;
-    /** 우측 버튼 텍스트 */
-    buttonLabel?: string;
-    /** 우측 버튼 클릭시 동작 */
-    onButtonClick?: () => void;
+    /** 우측 버튼 */
+    button?: React.ReactNode;
 }
 declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
 export default Popover;

package/dist/components/Popover.js

@@ -2,12 +2,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import styled from "@emotion/styled";
 import React from "react";
 import shadows from "../foundation/shadows";
-import { RESET_BUTTON } from "../utils/reset";
-import { HOVER } from "../utils/hover";
 import { css } from "@emotion/react";
 const Popover = React.forwardRef((props, ref) => {
-    const { className, headline, content, icon, buttonLabel, onButtonClick } = props;
-    return (_jsxs(Container, Object.assign({ ref: ref, className: className }, { children: [icon && _jsx(Icon, { children: icon }), _jsxs(ContentArea, { children: [headline && _jsx(Headline, { children: headline }), content && _jsx(Content, { children: content })] }), buttonLabel && (_jsx(PopoverButton, Object.assign({ type: "button", onClick: onButtonClick }, { children: buttonLabel })))] })));
+    const { className, headline, content, icon, button } = props;
+    return (_jsxs(Container, Object.assign({ ref: ref, className: className }, { children: [icon && _jsx(Icon, { children: icon }), _jsxs(ContentArea, { children: [headline && _jsx(Headline, { children: headline }), content && _jsx(Content, { children: content })] }), button] })));
 });
 export default Popover;
 const Container = styled.div(({ theme }) => css `
@@ -42,18 +40,3 @@ const Headline = styled.div `
 const Content = styled.div `
   font-weight: 400;
 `;
-const PopoverButton = styled.button(({ theme }) => css `
-    ${RESET_BUTTON}
-    margin: 4px;
-    padding: 6px 8px;
-    cursor: pointer;
-    background-color: ${theme.color.background.primary};
-    color: ${theme.color.background.neutralAlt};
-    font-size: 14px;
-    line-height: 16px;
-    border-radius: 8px;
-    ${HOVER(css `
-      color: ${theme.color.foreground.neutralAlt};
-      background: ${theme.color.background.primaryActive};
-    `)}
-  `);

package/dist/patterns/Accordion.d.ts

@@ -1,6 +1,7 @@
 import React from "react";
 export interface AccordionProps {
     className?: string;
+    gap?: number;
     icon?: React.ReactNode;
     title: React.ReactNode;
     children: React.ReactNode;

package/dist/patterns/Accordion.js

@@ -5,11 +5,11 @@ import styled from "@emotion/styled";
 import { ArrowDownSLineIcon, ArrowUpSLineIcon } from "../icons";
 /** 배너같이 생겼으나 누를 때마다 하단내용이 접힘(보이지않음)/펼침(보임) 상태가 바뀌는 컴포넌트입니다. */
 export function Accordion(props) {
-    const { className, icon, title, children, open = false, onClick } = props;
+    const { className, icon, title, children, open = false, onClick, gap = 2, } = props;
     return (_jsxs("div", Object.assign({ css: css `
         display: flex;
         flex-direction: column;
-        gap: 2px;
+        gap: ${gap}px;
       ` }, { children: [_jsxs(Container, Object.assign({ className: className, onClick: onClick }, { children: [_jsxs(Title, { children: [icon, title] }), open ? _jsx(ArrowUpSLineIcon, {}) : _jsx(ArrowDownSLineIcon, {})] })), open && children] })));
 }
 const Title = styled.div(({ theme }) => css `

package/package.json

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