@team-monolith/cds 1.17.2 → 1.18.0

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.
@@ -7,10 +7,8 @@ export interface PopoverProps {
7
7
  content?: React.ReactNode;
8
8
  /** 좌측 아이콘 */
9
9
  icon?: React.ReactNode;
10
- /** 우측 버튼 텍스트 */
11
- buttonLabel?: string;
12
- /** 우측 버튼 클릭시 동작 */
13
- onButtonClick?: () => void;
10
+ /** 우측 버튼 */
11
+ button?: React.ReactNode;
14
12
  }
15
13
  declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
16
14
  export default Popover;
@@ -2,12 +2,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import styled from "@emotion/styled";
3
3
  import React from "react";
4
4
  import shadows from "../foundation/shadows";
5
- import { RESET_BUTTON } from "../utils/reset";
6
- import { HOVER } from "../utils/hover";
7
5
  import { css } from "@emotion/react";
8
6
  const Popover = React.forwardRef((props, ref) => {
9
- const { className, headline, content, icon, buttonLabel, onButtonClick } = props;
10
- 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 })))] })));
7
+ const { className, headline, content, icon, button } = props;
8
+ 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] })));
11
9
  });
12
10
  export default Popover;
13
11
  const Container = styled.div(({ theme }) => css `
@@ -42,18 +40,3 @@ const Headline = styled.div `
42
40
  const Content = styled.div `
43
41
  font-weight: 400;
44
42
  `;
45
- const PopoverButton = styled.button(({ theme }) => css `
46
- ${RESET_BUTTON}
47
- margin: 4px;
48
- padding: 6px 8px;
49
- cursor: pointer;
50
- background-color: ${theme.color.background.primary};
51
- color: ${theme.color.background.neutralAlt};
52
- font-size: 14px;
53
- line-height: 16px;
54
- border-radius: 8px;
55
- ${HOVER(css `
56
- color: ${theme.color.foreground.neutralAlt};
57
- background: ${theme.color.background.primaryActive};
58
- `)}
59
- `);
@@ -35,6 +35,10 @@ export declare const CustomResourceIcon: React.ForwardRefExoticComponent<{
35
35
  className?: string | undefined;
36
36
  color?: string | undefined;
37
37
  } & React.RefAttributes<any>>;
38
+ export declare const customResourceColorSvg: string;
39
+ export declare const CustomResourceColorIcon: React.ForwardRefExoticComponent<{
40
+ className?: string | undefined;
41
+ } & React.RefAttributes<any>>;
38
42
  export declare const customFabSvg: string;
39
43
  export declare const CustomFabIcon: React.ForwardRefExoticComponent<{
40
44
  className?: string | undefined;
@@ -31,6 +31,11 @@ export const CustomResourceIcon = forwardRef((props, ref) => {
31
31
  const uniqueId = useMemo(uid, []);
32
32
  return (_jsxs("svg", Object.assign({}, props, { ref: ref, width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsxs("g", Object.assign({ clipPath: `url(#clip0_${uniqueId})` }, { children: [_jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.66989 11.9999H4.50003C4.15734 11.9999 3.82192 12.0462 3.5 12.1344V4.00005C3.5 2.89566 4.39514 2 5.50005 2H17.5004C18.6048 2 19.5004 2.89566 19.5004 4.00005V14H11.2318L10.3236 13.0919C9.61335 12.3878 8.67147 11.9999 7.66989 11.9999ZM6.5 5C5.94772 5 5.5 5.44772 5.5 6V8C5.5 8.55228 5.94772 9 6.5 9H16.5C17.0523 9 17.5 8.55228 17.5 8V6C17.5 5.44772 17.0523 5 16.5 5H6.5Z", fill: "currentColor" }), _jsx("path", { d: "M3.08568 14.5862C3.46056 14.2113 3.9694 14.0005 4.50005 14.0005H7.66992C8.19797 14.0005 8.70473 14.2087 9.08013 14.5805L10.5002 16.0005H19.4999C20.0306 16.0005 20.5389 16.2113 20.9143 16.5862C21.2892 16.9611 21.5 17.4699 21.5 18.0006V19.0006V20.0006C21.5 20.5313 21.2892 21.0396 20.9143 21.415C20.5394 21.7899 20.0306 22.0007 19.4999 22.0007H4.50005C3.9694 22.0007 3.46108 21.7899 3.08568 21.415C2.71081 21.0401 2.5 20.5313 2.5 20.0006V16.0005C2.5 15.4699 2.71081 14.9616 3.08568 14.5862Z", fill: "currentColor" })] })), _jsx("defs", { children: _jsx("clipPath", Object.assign({ id: `clip0_${uniqueId}` }, { children: _jsx("rect", { width: "19", height: "20", fill: "white", transform: "translate(2.5 2)" }) })) })] })));
33
33
  });
34
+ import customResourceColorSvgImport from "./custom/resource-color.svg";
35
+ export const customResourceColorSvg = customResourceColorSvgImport;
36
+ export const CustomResourceColorIcon = forwardRef((props, ref) => {
37
+ return (_jsxs("svg", Object.assign({}, props, { ref: ref, width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [_jsx("path", { d: "M4 4C4 2.89543 4.89543 2 6 2H18C19.1046 2 20 2.89543 20 4V20C20 21.1046 19.1046 22 18 22H6C4.89543 22 4 21.1046 4 20V4Z", fill: "#C5DBFF" }), _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.58578 14.5858C3.96086 14.2107 4.46957 14 5 14H8.17C8.69814 13.9996 9.20502 14.2081 9.58 14.58L11 16H20C20.5305 16 21.0392 16.2107 21.4143 16.5858C21.7893 16.9609 22 17.4696 22 18V19H22V20C22 20.5304 21.7893 21.0391 21.4142 21.4142C21.0392 21.7893 20.5304 22 20 22H5C4.46957 22 3.96089 21.7893 3.58582 21.4142C3.21074 21.0391 3 20.5304 3 20V19.57V19V16C3 15.4696 3.21071 14.9609 3.58578 14.5858Z", fill: "#5599FF" }), _jsx("path", { d: "M6 6C6 5.44772 6.44772 5 7 5H17C17.5523 5 18 5.44772 18 6V8C18 8.55228 17.5523 9 17 9H7C6.44772 9 6 8.55228 6 8V6Z", fill: "#82ACE8" }), _jsx("path", { d: "M17.4 10H6.6C6.26863 10 6 10.2239 6 10.5V11.5C6 11.7761 6.26863 12 6.6 12H17.4C17.7313 12 18 11.7761 18 11.5V10.5C18 10.2239 17.7313 10 17.4 10Z", fill: "#82ACE8" })] })));
38
+ });
34
39
  import customFabSvgImport from "./custom/fab.svg";
35
40
  export const customFabSvg = customFabSvgImport;
36
41
  export const CustomFabIcon = forwardRef((props, ref) => {
@@ -0,0 +1,14 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path
3
+ d="M4 4C4 2.89543 4.89543 2 6 2H18C19.1046 2 20 2.89543 20 4V20C20 21.1046 19.1046 22 18 22H6C4.89543 22 4 21.1046 4 20V4Z"
4
+ fill="#C5DBFF" />
5
+ <path fill-rule="evenodd" clip-rule="evenodd"
6
+ d="M3.58578 14.5858C3.96086 14.2107 4.46957 14 5 14H8.17C8.69814 13.9996 9.20502 14.2081 9.58 14.58L11 16H20C20.5305 16 21.0392 16.2107 21.4143 16.5858C21.7893 16.9609 22 17.4696 22 18V19H22V20C22 20.5304 21.7893 21.0391 21.4142 21.4142C21.0392 21.7893 20.5304 22 20 22H5C4.46957 22 3.96089 21.7893 3.58582 21.4142C3.21074 21.0391 3 20.5304 3 20V19.57V19V16C3 15.4696 3.21071 14.9609 3.58578 14.5858Z"
7
+ fill="#5599FF" />
8
+ <path
9
+ d="M6 6C6 5.44772 6.44772 5 7 5H17C17.5523 5 18 5.44772 18 6V8C18 8.55228 17.5523 9 17 9H7C6.44772 9 6 8.55228 6 8V6Z"
10
+ fill="#82ACE8" />
11
+ <path
12
+ d="M17.4 10H6.6C6.26863 10 6 10.2239 6 10.5V11.5C6 11.7761 6.26863 12 6.6 12H17.4C17.7313 12 18 11.7761 18 11.5V10.5C18 10.2239 17.7313 10 17.4 10Z"
13
+ fill="#82ACE8" />
14
+ </svg>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@team-monolith/cds",
3
- "version": "1.17.2",
3
+ "version": "1.18.0",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "sideEffects": false,