@synerise/ds-information-card 1.6.4 → 1.6.5

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.
Files changed (39) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/dist/InformationCard.d.ts +6 -6
  3. package/dist/InformationCard.js +82 -135
  4. package/dist/InformationCard.styles.d.ts +25 -25
  5. package/dist/InformationCard.styles.js +68 -69
  6. package/dist/InformationCard.types.d.ts +8 -8
  7. package/dist/InformationCard.types.js +1 -1
  8. package/dist/InformationCard.utils.d.ts +3 -3
  9. package/dist/InformationCard.utils.js +29 -36
  10. package/dist/InformationCardActions/InformationCardActions.d.ts +2 -2
  11. package/dist/InformationCardActions/InformationCardActions.js +22 -26
  12. package/dist/InformationCardActions/InformationCardActions.types.d.ts +2 -2
  13. package/dist/InformationCardActions/InformationCardActions.types.js +1 -1
  14. package/dist/InformationCardDescription/InformationCardDescription.d.ts +2 -2
  15. package/dist/InformationCardDescription/InformationCardDescription.js +23 -29
  16. package/dist/InformationCardFooter/InformationCardFooter.d.ts +2 -2
  17. package/dist/InformationCardFooter/InformationCardFooter.js +29 -42
  18. package/dist/InformationCardFooter/InformationCardFooter.types.d.ts +3 -3
  19. package/dist/InformationCardFooter/InformationCardFooter.types.js +1 -1
  20. package/dist/InformationCardPropertyList/InformationCardPropertyList.d.ts +2 -2
  21. package/dist/InformationCardPropertyList/InformationCardPropertyList.js +32 -30
  22. package/dist/InformationCardPropertyList/InformationCardPropertyList.types.d.ts +1 -1
  23. package/dist/InformationCardPropertyList/InformationCardPropertyList.types.js +1 -1
  24. package/dist/InformationCardSummary/InformationCardSummary.d.ts +2 -2
  25. package/dist/InformationCardSummary/InformationCardSummary.js +29 -30
  26. package/dist/InformationCardSummary/InformationCardSummary.types.d.ts +2 -2
  27. package/dist/InformationCardSummary/InformationCardSummary.types.js +1 -1
  28. package/dist/InformationCardTooltip/InformationCard.constants.d.ts +1 -1
  29. package/dist/InformationCardTooltip/InformationCard.constants.js +13 -6
  30. package/dist/InformationCardTooltip/InformationCardTooltip.d.ts +4 -4
  31. package/dist/InformationCardTooltip/InformationCardTooltip.js +27 -43
  32. package/dist/InformationCardTooltip/InformationCardTooltip.styles.d.ts +1 -1
  33. package/dist/InformationCardTooltip/InformationCardTooltip.styles.js +6 -3
  34. package/dist/InformationCardTooltip/InformationCardTooltip.types.d.ts +5 -5
  35. package/dist/InformationCardTooltip/InformationCardTooltip.types.js +1 -1
  36. package/dist/index.js +12 -7
  37. package/dist/modules.d.js +1 -1
  38. package/dist/modules.d.ts +0 -0
  39. package/package.json +23 -23
package/CHANGELOG.md CHANGED
@@ -3,6 +3,10 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [1.6.5](https://github.com/Synerise/synerise-design/compare/@synerise/ds-information-card@1.6.4...@synerise/ds-information-card@1.6.5) (2026-03-24)
7
+
8
+ **Note:** Version bump only for package @synerise/ds-information-card
9
+
6
10
  ## [1.6.4](https://github.com/Synerise/synerise-design/compare/@synerise/ds-information-card@1.6.3...@synerise/ds-information-card@1.6.4) (2026-03-20)
7
11
 
8
12
  **Note:** Version bump only for package @synerise/ds-information-card
@@ -1,15 +1,15 @@
1
- import React from 'react';
1
+ import { default as React } from 'react';
2
2
  declare const InformationCard: React.ForwardRefExoticComponent<{
3
3
  actionButton?: boolean | (() => React.ReactNode);
4
4
  actionButtonCallback?: () => void;
5
5
  actionButtonTooltipText?: string;
6
- actionsMenu?: Omit<import("./InformationCardActions/InformationCardActions.types").InformationCardActionsProps, "onHeaderClick" | "maxHeight">;
6
+ actionsMenu?: Omit<import('./InformationCardActions/InformationCardActions.types').InformationCardActionsProps, "onHeaderClick" | "maxHeight">;
7
7
  asTooltip?: boolean;
8
8
  avatarTooltipText?: string;
9
9
  className?: string;
10
10
  copyTooltip?: string;
11
11
  copiedTooltip?: string;
12
- descriptionConfig?: import("@synerise/ds-subtle-form/dist/Elements/TextArea/TextArea.types").SubtleTextAreaProps | string | null | undefined;
12
+ descriptionConfig?: import('@synerise/ds-subtle-form/dist/Elements/TextArea/TextArea.types').SubtleTextAreaProps | string | null | undefined;
13
13
  renderFooter?: () => JSX.Element;
14
14
  footerText?: React.ReactNode | null;
15
15
  icon?: React.ReactNode;
@@ -19,7 +19,7 @@ declare const InformationCard: React.ForwardRefExoticComponent<{
19
19
  subtitle?: React.ReactNode;
20
20
  title: React.ReactNode;
21
21
  renderAdditionalDescription?: () => React.ReactNode;
22
- propertyListItems?: import(".").InformationCardPropertyListProps["items"];
23
- summaryItems?: import("./InformationCardSummary/InformationCardSummary.types").InformationCardSummaryProps["items"];
24
- } & Omit<React.HTMLAttributes<HTMLDivElement>, "title" | "className" | "icon" | "actionButton" | "actionButtonCallback" | "actionButtonTooltipText" | "actionsMenu" | "asTooltip" | "avatarTooltipText" | "copyTooltip" | "copiedTooltip" | "descriptionConfig" | "renderFooter" | "footerText" | "iconColor" | "notice" | "renderBadge" | "subtitle" | "renderAdditionalDescription" | "propertyListItems" | "summaryItems"> & import("@synerise/ds-utils").DataAttributes & React.RefAttributes<HTMLDivElement>>;
22
+ propertyListItems?: import('.').InformationCardPropertyListProps["items"];
23
+ summaryItems?: import('./InformationCardSummary/InformationCardSummary.types').InformationCardSummaryProps["items"];
24
+ } & Omit<React.HTMLAttributes<HTMLDivElement>, "title" | "className" | "icon" | "footerText" | "asTooltip" | "actionButton" | "actionButtonCallback" | "actionButtonTooltipText" | "actionsMenu" | "avatarTooltipText" | "copyTooltip" | "copiedTooltip" | "descriptionConfig" | "renderFooter" | "iconColor" | "notice" | "renderBadge" | "subtitle" | "renderAdditionalDescription" | "propertyListItems" | "summaryItems"> & import('@synerise/ds-utils').DataAttributes & React.RefAttributes<HTMLDivElement>>;
25
25
  export default InformationCard;
@@ -1,139 +1,86 @@
1
- var _excluded = ["actionButton", "actionButtonTooltipText", "actionButtonCallback", "actionsMenu", "asTooltip", "avatarTooltipText", "copyTooltip", "copiedTooltip", "renderFooter", "renderBadge", "subtitle", "title", "notice", "footerText", "icon", "iconColor", "descriptionConfig", "className", "renderAdditionalDescription", "propertyListItems", "summaryItems"];
2
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
3
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
4
- import React, { forwardRef, useEffect, useRef, useState } from 'react';
5
- import Card from '@synerise/ds-card';
6
- import { SegmentM } from '@synerise/ds-icon';
7
- import { FloatingDelayGroup, HOVER_CLOSE_DELAY, HOVER_OPEN_DELAY } from '@synerise/ds-popover';
8
- import { useResizeObserver } from '@synerise/ds-utils';
9
- import * as S from './InformationCard.styles';
10
- import { buildIconBadge } from './InformationCard.utils';
11
- import { InformationCardActions } from './InformationCardActions/InformationCardActions';
12
- import { InformationCardDescription } from './InformationCardDescription/InformationCardDescription';
13
- import { InformationCardFooter } from './InformationCardFooter/InformationCardFooter';
14
- import { InformationCardPropertyList } from './InformationCardPropertyList/InformationCardPropertyList';
15
- import { InformationCardSummary } from './InformationCardSummary/InformationCardSummary';
16
- var InformationCard = /*#__PURE__*/forwardRef(function (_ref, ref) {
17
- var actionButton = _ref.actionButton,
18
- actionButtonTooltipText = _ref.actionButtonTooltipText,
19
- actionButtonCallback = _ref.actionButtonCallback,
20
- actionsMenu = _ref.actionsMenu,
21
- asTooltip = _ref.asTooltip,
22
- avatarTooltipText = _ref.avatarTooltipText,
23
- copyTooltip = _ref.copyTooltip,
24
- copiedTooltip = _ref.copiedTooltip,
25
- renderFooter = _ref.renderFooter,
26
- _renderBadge2 = _ref.renderBadge,
27
- subtitle = _ref.subtitle,
28
- title = _ref.title,
29
- notice = _ref.notice,
30
- footerText = _ref.footerText,
31
- _ref$icon = _ref.icon,
32
- iconElement = _ref$icon === void 0 ? /*#__PURE__*/React.createElement(SegmentM, null) : _ref$icon,
33
- iconColor = _ref.iconColor,
34
- descriptionConfig = _ref.descriptionConfig,
35
- className = _ref.className,
36
- renderAdditionalDescription = _ref.renderAdditionalDescription,
37
- propertyListItems = _ref.propertyListItems,
38
- summaryItems = _ref.summaryItems,
39
- props = _objectWithoutPropertiesLoose(_ref, _excluded);
40
- var _useState = useState(false),
41
- isActionsMenuVisible = _useState[0],
42
- setIsActionsMenuVisible = _useState[1];
43
- var mainSlideRef = useRef(null);
44
- var _useResizeObserver = useResizeObserver(mainSlideRef),
45
- height = _useResizeObserver.height;
46
- var copyableSlot = function copyableSlot(content) {
47
- return content && /*#__PURE__*/React.createElement(S.CopyWrapper, {
48
- copyable: true
49
- }, /*#__PURE__*/React.createElement(S.Flex, {
50
- style: {
51
- backgroundColor: '',
52
- alignItems: 'center',
53
- textAlign: 'left'
54
- }
55
- }, /*#__PURE__*/React.createElement("span", null, content), /*#__PURE__*/React.createElement(S.Copyable, {
56
- copyValue: content,
57
- texts: {
58
- copyTooltip: copyTooltip != null ? copyTooltip : 'Copy to clipboard',
59
- copiedTooltip: copiedTooltip != null ? copiedTooltip : 'Copied'
60
- }
61
- })));
62
- };
63
- var hasFooter = !!(footerText || actionButton || actionsMenu);
64
-
65
- // eslint-disable-next-line react-hooks/exhaustive-deps
66
- useEffect(function () {
67
- var _mainSlideRef$current;
68
- if (!((_mainSlideRef$current = mainSlideRef.current) != null && _mainSlideRef$current.clientWidth)) {
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+ import { forwardRef, useState, useRef, useEffect } from "react";
3
+ import Card from "@synerise/ds-card";
4
+ import { SegmentM } from "@synerise/ds-icon";
5
+ import { FloatingDelayGroup, HOVER_CLOSE_DELAY, HOVER_OPEN_DELAY } from "@synerise/ds-popover";
6
+ import { useResizeObserver } from "@synerise/ds-utils";
7
+ import { InfoCardWrapper, InfoCardSlidesWrapper, InfoCardSlide, BottomDivider, CopyWrapper, Flex, Copyable } from "./InformationCard.styles.js";
8
+ import { buildIconBadge } from "./InformationCard.utils.js";
9
+ import { InformationCardActions } from "./InformationCardActions/InformationCardActions.js";
10
+ import { InformationCardDescription } from "./InformationCardDescription/InformationCardDescription.js";
11
+ import { InformationCardFooter } from "./InformationCardFooter/InformationCardFooter.js";
12
+ import { InformationCardPropertyList } from "./InformationCardPropertyList/InformationCardPropertyList.js";
13
+ import { InformationCardSummary } from "./InformationCardSummary/InformationCardSummary.js";
14
+ const InformationCard = forwardRef(({
15
+ actionButton,
16
+ actionButtonTooltipText,
17
+ actionButtonCallback,
18
+ actionsMenu,
19
+ asTooltip,
20
+ avatarTooltipText,
21
+ copyTooltip,
22
+ copiedTooltip,
23
+ renderFooter,
24
+ renderBadge,
25
+ subtitle,
26
+ title,
27
+ notice,
28
+ footerText,
29
+ icon: iconElement = /* @__PURE__ */ jsx(SegmentM, {}),
30
+ iconColor,
31
+ descriptionConfig,
32
+ className,
33
+ renderAdditionalDescription,
34
+ propertyListItems,
35
+ summaryItems,
36
+ ...props
37
+ }, ref) => {
38
+ const [isActionsMenuVisible, setIsActionsMenuVisible] = useState(false);
39
+ const mainSlideRef = useRef(null);
40
+ const {
41
+ height
42
+ } = useResizeObserver(mainSlideRef);
43
+ const copyableSlot = (content) => content && /* @__PURE__ */ jsx(CopyWrapper, { copyable: true, children: /* @__PURE__ */ jsxs(Flex, { style: {
44
+ backgroundColor: "",
45
+ alignItems: "center",
46
+ textAlign: "left"
47
+ }, children: [
48
+ /* @__PURE__ */ jsx("span", { children: content }),
49
+ /* @__PURE__ */ jsx(Copyable, { copyValue: content, texts: {
50
+ copyTooltip: copyTooltip ?? "Copy to clipboard",
51
+ copiedTooltip: copiedTooltip ?? "Copied"
52
+ } })
53
+ ] }) });
54
+ const hasFooter = !!(footerText || actionButton || actionsMenu);
55
+ useEffect(() => {
56
+ if (!mainSlideRef.current?.clientWidth) {
69
57
  setIsActionsMenuVisible(false);
70
58
  }
71
59
  });
72
- var showBottomDivider = !!(summaryItems && (propertyListItems || descriptionConfig || notice || renderAdditionalDescription));
73
- return /*#__PURE__*/React.createElement(FloatingDelayGroup, {
74
- delay: {
75
- open: HOVER_OPEN_DELAY,
76
- close: HOVER_CLOSE_DELAY
77
- }
78
- }, /*#__PURE__*/React.createElement(S.InfoCardWrapper, _extends({
79
- "data-testid": "information-card",
80
- "data-popup-container": true,
81
- ref: ref,
82
- "aria-label": "information card",
83
- className: "ds-info-card " + className,
84
- asTooltip: asTooltip,
85
- isActionsMenuVisible: isActionsMenuVisible,
86
- hasActionsMenu: !!actionsMenu,
87
- hasFooter: !!(renderFooter || hasFooter)
88
- }, props), /*#__PURE__*/React.createElement(S.InfoCardSlidesWrapper, null, /*#__PURE__*/React.createElement(S.InfoCardSlide, {
89
- ref: mainSlideRef
90
- }, /*#__PURE__*/React.createElement(Card, {
91
- background: "white",
92
- renderBadge: function renderBadge() {
93
- var _renderBadge;
94
- return _renderBadge2 !== null && /*#__PURE__*/React.createElement("div", {
95
- style: {
96
- marginRight: '16px'
97
- }
98
- }, (_renderBadge = _renderBadge2 == null ? void 0 : _renderBadge2()) != null ? _renderBadge : buildIconBadge({
99
- iconElement: iconElement,
100
- iconColor: iconColor,
101
- avatarTooltipText: avatarTooltipText
102
- }));
103
- },
104
- title: typeof title === 'string' ? copyableSlot(title) : title,
105
- description: typeof subtitle === 'string' ? copyableSlot(subtitle) : subtitle,
106
- headerSideChildren: undefined,
107
- compactHeader: false,
108
- withoutPadding: true,
109
- lively: false,
110
- withHeader: true
111
- }, (!!descriptionConfig || notice) && /*#__PURE__*/React.createElement(InformationCardDescription, {
112
- extraInformation: notice,
113
- descriptionConfig: descriptionConfig
114
- }), renderAdditionalDescription && renderAdditionalDescription(), propertyListItems && /*#__PURE__*/React.createElement(InformationCardPropertyList, {
115
- items: propertyListItems
116
- }), showBottomDivider && /*#__PURE__*/React.createElement(S.BottomDivider, {
117
- dashed: true,
118
- marginBottom: 8
119
- }), summaryItems && /*#__PURE__*/React.createElement(InformationCardSummary, {
120
- items: summaryItems
121
- }), renderFooter && renderFooter() || hasFooter && /*#__PURE__*/React.createElement(InformationCardFooter, {
122
- text: footerText,
123
- actionButton: actionButton,
124
- actionButtonCallback: actionButtonCallback,
125
- actionButtonTooltipText: actionButtonTooltipText,
126
- actionsMenuButtonLabel: actionsMenu == null ? void 0 : actionsMenu.buttonLabel,
127
- actionsMenuButtonOnClick: actionsMenu ? function () {
128
- return setIsActionsMenuVisible(true);
129
- } : undefined
130
- }))), actionsMenu && /*#__PURE__*/React.createElement(S.InfoCardSlide, {
131
- height: height
132
- }, /*#__PURE__*/React.createElement(InformationCardActions, _extends({}, actionsMenu, {
133
- maxHeight: height,
134
- onHeaderClick: function onHeaderClick() {
135
- return setIsActionsMenuVisible(false);
136
- }
137
- }))))));
60
+ const showBottomDivider = !!(summaryItems && (propertyListItems || descriptionConfig || notice || renderAdditionalDescription));
61
+ return /* @__PURE__ */ jsx(FloatingDelayGroup, { delay: {
62
+ open: HOVER_OPEN_DELAY,
63
+ close: HOVER_CLOSE_DELAY
64
+ }, children: /* @__PURE__ */ jsx(InfoCardWrapper, { "data-testid": "information-card", "data-popup-container": true, ref, "aria-label": "information card", className: `ds-info-card ${className}`, asTooltip, isActionsMenuVisible, hasActionsMenu: !!actionsMenu, hasFooter: !!(renderFooter || hasFooter), ...props, children: /* @__PURE__ */ jsxs(InfoCardSlidesWrapper, { children: [
65
+ /* @__PURE__ */ jsx(InfoCardSlide, { ref: mainSlideRef, children: /* @__PURE__ */ jsxs(Card, { background: "white", renderBadge: () => {
66
+ return renderBadge !== null && /* @__PURE__ */ jsx("div", { style: {
67
+ marginRight: "16px"
68
+ }, children: renderBadge?.() ?? buildIconBadge({
69
+ iconElement,
70
+ iconColor,
71
+ avatarTooltipText
72
+ }) });
73
+ }, title: typeof title === "string" ? copyableSlot(title) : title, description: typeof subtitle === "string" ? copyableSlot(subtitle) : subtitle, headerSideChildren: void 0, compactHeader: false, withoutPadding: true, lively: false, withHeader: true, children: [
74
+ (!!descriptionConfig || notice) && /* @__PURE__ */ jsx(InformationCardDescription, { extraInformation: notice, descriptionConfig }),
75
+ renderAdditionalDescription && renderAdditionalDescription(),
76
+ propertyListItems && /* @__PURE__ */ jsx(InformationCardPropertyList, { items: propertyListItems }),
77
+ showBottomDivider && /* @__PURE__ */ jsx(BottomDivider, { dashed: true, marginBottom: 8 }),
78
+ summaryItems && /* @__PURE__ */ jsx(InformationCardSummary, { items: summaryItems }),
79
+ renderFooter && renderFooter() || hasFooter && /* @__PURE__ */ jsx(InformationCardFooter, { text: footerText, actionButton, actionButtonCallback, actionButtonTooltipText, actionsMenuButtonLabel: actionsMenu?.buttonLabel, actionsMenuButtonOnClick: actionsMenu ? () => setIsActionsMenuVisible(true) : void 0 })
80
+ ] }) }),
81
+ actionsMenu && /* @__PURE__ */ jsx(InfoCardSlide, { height, children: /* @__PURE__ */ jsx(InformationCardActions, { ...actionsMenu, maxHeight: height, onHeaderClick: () => setIsActionsMenuVisible(false) }) })
82
+ ] }) }) });
138
83
  });
139
- export default InformationCard;
84
+ export {
85
+ InformationCard as default
86
+ };
@@ -1,43 +1,43 @@
1
- export declare const Flex: import("styled-components").StyledComponent<"div", any, {}, never>;
2
- export declare const Copyable: import("styled-components").StyledComponent<({ copyValue, texts, onMouseEnter, onMouseLeave, icon, placement, onCopy, onClick, ...rest }: import("@synerise/ds-copy-icon").CopyIconProps) => React.JSX.Element, any, {}, never>;
3
- export declare const CopyWrapper: import("styled-components").StyledComponent<"div", any, {
1
+ export declare const Flex: import('styled-components').StyledComponent<"div", any, {}, never>;
2
+ export declare const Copyable: import('styled-components').StyledComponent<({ copyValue, texts, onMouseEnter, onMouseLeave, icon, placement, onCopy, onClick, ...rest }: import('@synerise/ds-copy-icon').CopyIconProps) => React.JSX.Element, any, {}, never>;
3
+ export declare const CopyWrapper: import('styled-components').StyledComponent<"div", any, {
4
4
  copyable: boolean;
5
5
  }, never>;
6
- export declare const Divider: import("styled-components").StyledComponent<(props: import("@synerise/ds-divider").DividerProps) => React.JSX.Element, any, {}, never>;
7
- export declare const BottomDivider: import("styled-components").StyledComponent<(props: import("@synerise/ds-divider").DividerProps) => React.JSX.Element, any, {}, never>;
8
- export declare const FooterWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
9
- export declare const ActionsMenuItems: import("styled-components").StyledComponent<"div", any, {}, never>;
10
- export declare const FlexGrow: import("styled-components").StyledComponent<"div", any, {
6
+ export declare const Divider: import('styled-components').StyledComponent<(props: import('@synerise/ds-divider').DividerProps) => React.JSX.Element, any, {}, never>;
7
+ export declare const BottomDivider: import('styled-components').StyledComponent<(props: import('@synerise/ds-divider').DividerProps) => React.JSX.Element, any, {}, never>;
8
+ export declare const FooterWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
9
+ export declare const ActionsMenuItems: import('styled-components').StyledComponent<"div", any, {}, never>;
10
+ export declare const FlexGrow: import('styled-components').StyledComponent<"div", any, {
11
11
  grow?: number;
12
12
  }, never>;
13
- export declare const ActionButtonContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
14
- export declare const InfoCardSlidesWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
15
- export declare const InfoCardSlide: import("styled-components").StyledComponent<"div", any, {
13
+ export declare const ActionButtonContainer: import('styled-components').StyledComponent<"div", any, {}, never>;
14
+ export declare const InfoCardSlidesWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
15
+ export declare const InfoCardSlide: import('styled-components').StyledComponent<"div", any, {
16
16
  height?: number;
17
17
  }, never>;
18
- export declare const InfoCardWrapper: import("styled-components").StyledComponent<"div", any, {
18
+ export declare const InfoCardWrapper: import('styled-components').StyledComponent<"div", any, {
19
19
  footerText?: string;
20
20
  asTooltip?: boolean;
21
21
  hasActionsMenu?: boolean;
22
22
  isActionsMenuVisible?: boolean;
23
23
  hasFooter?: boolean;
24
24
  }, never>;
25
- export declare const AlertWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
26
- export declare const NonEditableWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
27
- export declare const DescriptionWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
25
+ export declare const AlertWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
26
+ export declare const NonEditableWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
27
+ export declare const DescriptionWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
28
28
  /**
29
29
  * This component can be used to style container with popovers/tooltips to disable arrow.
30
30
  */
31
- export declare const HidePopoverArrowWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
31
+ export declare const HidePopoverArrowWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
32
32
  /**
33
33
  * Should be mounted in application where.
34
34
  */
35
- export declare const GlobalCSSHidePopoverArrow: import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;
36
- export declare const ExtraInfo: import("styled-components").StyledComponent<"div", any, {}, never>;
37
- export declare const InformationCardActionsWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
38
- export declare const InformationCardPropertyListWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
39
- export declare const InformationCardPropertyItem: import("styled-components").StyledComponent<"div", any, {}, never>;
40
- export declare const InformationCardPropertyItemLabel: import("styled-components").StyledComponent<"span", any, {}, never>;
41
- export declare const InformationCardPropertyItemValue: import("styled-components").StyledComponent<"span", any, {}, never>;
42
- export declare const InformationCardSummaryWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
43
- export declare const InformationCardSummaryItem: import("styled-components").StyledComponent<"div", any, {}, never>;
35
+ export declare const GlobalCSSHidePopoverArrow: import('styled-components').GlobalStyleComponent<{}, import('styled-components').DefaultTheme>;
36
+ export declare const ExtraInfo: import('styled-components').StyledComponent<"div", any, {}, never>;
37
+ export declare const InformationCardActionsWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
38
+ export declare const InformationCardPropertyListWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
39
+ export declare const InformationCardPropertyItem: import('styled-components').StyledComponent<"div", any, {}, never>;
40
+ export declare const InformationCardPropertyItemLabel: import('styled-components').StyledComponent<"span", any, {}, never>;
41
+ export declare const InformationCardPropertyItemValue: import('styled-components').StyledComponent<"span", any, {}, never>;
42
+ export declare const InformationCardSummaryWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
43
+ export declare const InformationCardSummaryItem: import('styled-components').StyledComponent<"div", any, {}, never>;
@@ -1,136 +1,135 @@
1
- import styled, { createGlobalStyle, css } from 'styled-components';
2
- import { CardStyles } from '@synerise/ds-card';
3
- import CopyIcon from '@synerise/ds-copy-icon';
4
- import { RowWrapper } from '@synerise/ds-description/dist/Row/DescriptionRow.styles';
5
- import DSDivider from '@synerise/ds-divider';
6
- import { Container } from '@synerise/ds-skeleton/dist/Skeleton.styles';
7
- import { StatusTag } from '@synerise/ds-status/dist/Status.styles';
8
- import { macro } from '@synerise/ds-typography';
9
- var INFOCARD_WIDTH = 350;
10
- export var Flex = styled.div.withConfig({
1
+ import styled, { css, createGlobalStyle } from "styled-components";
2
+ import { CardStyles } from "@synerise/ds-card";
3
+ import CopyIcon from "@synerise/ds-copy-icon";
4
+ import { RowWrapper } from "@synerise/ds-description/dist/Row/DescriptionRow.styles";
5
+ import DSDivider from "@synerise/ds-divider";
6
+ import { Container } from "@synerise/ds-skeleton/dist/Skeleton.styles";
7
+ import { StatusTag } from "@synerise/ds-status/dist/Status.styles";
8
+ import { macro } from "@synerise/ds-typography";
9
+ const INFOCARD_WIDTH = 350;
10
+ const Flex = /* @__PURE__ */ styled.div.withConfig({
11
11
  displayName: "InformationCardstyles__Flex",
12
12
  componentId: "sc-zxu5qa-0"
13
13
  })(["display:flex;"]);
14
- export var Copyable = styled(CopyIcon).withConfig({
14
+ const Copyable = /* @__PURE__ */ styled(CopyIcon).withConfig({
15
15
  displayName: "InformationCardstyles__Copyable",
16
16
  componentId: "sc-zxu5qa-1"
17
17
  })(["display:flex;align-items:center;height:20px;visibility:hidden;position:relative;margin-left:8px;opacity:0;"]);
18
- export var CopyWrapper = styled(RowWrapper).withConfig({
18
+ const CopyWrapper = /* @__PURE__ */ styled(RowWrapper).withConfig({
19
19
  displayName: "InformationCardstyles__CopyWrapper",
20
20
  componentId: "sc-zxu5qa-2"
21
21
  })(["&:hover{", "{visibility:visible;opacity:1;}}"], Copyable);
22
- export var Divider = styled(DSDivider).withConfig({
22
+ const Divider = /* @__PURE__ */ styled(DSDivider).withConfig({
23
23
  displayName: "InformationCardstyles__Divider",
24
24
  componentId: "sc-zxu5qa-3"
25
25
  })(["&&{margin:8px 0;width:100%;}"]);
26
- export var BottomDivider = styled(DSDivider).withConfig({
26
+ const BottomDivider = /* @__PURE__ */ styled(DSDivider).withConfig({
27
27
  displayName: "InformationCardstyles__BottomDivider",
28
28
  componentId: "sc-zxu5qa-4"
29
29
  })(["&&{margin-left:16px;margin-right:16px;}"]);
30
- export var FooterWrapper = styled(Flex).withConfig({
30
+ const FooterWrapper = /* @__PURE__ */ styled(Flex).withConfig({
31
31
  displayName: "InformationCardstyles__FooterWrapper",
32
32
  componentId: "sc-zxu5qa-5"
33
- })(["background:", ";border-top:solid 1px ", ";padding:8px;"], function (props) {
34
- return props.theme.palette['grey-050'];
35
- }, function (props) {
36
- return props.theme.palette['grey-100'];
37
- });
38
- export var ActionsMenuItems = styled.div.withConfig({
33
+ })(["background:", ";border-top:solid 1px ", ";padding:8px;"], (props) => props.theme.palette["grey-050"], (props) => props.theme.palette["grey-100"]);
34
+ const ActionsMenuItems = /* @__PURE__ */ styled.div.withConfig({
39
35
  displayName: "InformationCardstyles__ActionsMenuItems",
40
36
  componentId: "sc-zxu5qa-6"
41
37
  })([""]);
42
- export var FlexGrow = styled.div.withConfig({
38
+ const FlexGrow = /* @__PURE__ */ styled.div.withConfig({
43
39
  displayName: "InformationCardstyles__FlexGrow",
44
40
  componentId: "sc-zxu5qa-7"
45
- })(["flex-grow:", ";"], function (_ref) {
46
- var _ref$grow = _ref.grow,
47
- grow = _ref$grow === void 0 ? 1 : _ref$grow;
48
- return grow;
49
- });
50
- export var ActionButtonContainer = styled.div.withConfig({
41
+ })(["flex-grow:", ";"], ({
42
+ grow = 1
43
+ }) => grow);
44
+ const ActionButtonContainer = /* @__PURE__ */ styled.div.withConfig({
51
45
  displayName: "InformationCardstyles__ActionButtonContainer",
52
46
  componentId: "sc-zxu5qa-8"
53
47
  })([""]);
54
- export var InfoCardSlidesWrapper = styled.div.withConfig({
48
+ const InfoCardSlidesWrapper = /* @__PURE__ */ styled.div.withConfig({
55
49
  displayName: "InformationCardstyles__InfoCardSlidesWrapper",
56
50
  componentId: "sc-zxu5qa-9"
57
51
  })([""]);
58
- export var InfoCardSlide = styled.div.withConfig({
52
+ const InfoCardSlide = /* @__PURE__ */ styled.div.withConfig({
59
53
  displayName: "InformationCardstyles__InfoCardSlide",
60
54
  componentId: "sc-zxu5qa-10"
61
- })(["", ""], function (props) {
62
- return props.height && "max-height: " + props.height + "px;";
63
- });
64
- export var InfoCardWrapper = styled.div.withConfig({
55
+ })(["", ""], (props) => props.height && `max-height: ${props.height}px;`);
56
+ const InfoCardWrapper = /* @__PURE__ */ styled.div.withConfig({
65
57
  displayName: "InformationCardstyles__InfoCardWrapper",
66
58
  componentId: "sc-zxu5qa-11"
67
- })(["margin-left:", ";width:", "px;overflow:hidden;color:", ";text-align:left;font-size:13px;", "{width:", "px;display:flex;transition:left 0.3s;position:relative;left:", ";}", "{width:", "px;height:min-content;}overflow-wrap:anywhere;background-color:white;border-radius:3px;box-shadow:", ";", "{font-weight:400;gap:16px;", "}", "{padding-top:0;display:flex;flex-direction:column;gap:8px;}", "{padding:16px 16px 1px 16px;margin-bottom:0;}", "{align-self:center;margin-left:10px;margin-right:10px;}", "{margin:0;gap:2px;}", "{margin:0;}", "", "{margin-bottom:0;font-size:14px;}", "", "{font-size:11px;}.ds-button{background:transparent;}.btn-focus,.btn-focus:hover{box-shadow:unset;}"], function (props) {
68
- return props.asTooltip ? '0' : '8px';
69
- }, INFOCARD_WIDTH, function (props) {
70
- return props.theme.palette['grey-600'];
71
- }, InfoCardSlidesWrapper, function (props) {
72
- return props.hasActionsMenu ? INFOCARD_WIDTH * 2 : INFOCARD_WIDTH;
73
- }, function (props) {
74
- return props.isActionsMenuVisible ? "-" + INFOCARD_WIDTH + "px" : '0';
75
- }, InfoCardSlide, INFOCARD_WIDTH, function (props) {
76
- return props.asTooltip ? 'unset' : '0 16px 32px 0 rgba(35, 41, 54, 0.1)';
77
- }, CardStyles.Card.Container, function (props) {
78
- return !props.hasFooter && css(["padding-bottom:8px;margin-bottom:1px;"]);
79
- }, CardStyles.Card.PaddingWrapper, CardStyles.Card.Header, CardStyles.Card.IconContainer, CardStyles.Card.HeaderContent, CardStyles.Card.TitleWrapper, CardStyles.Card.Title, CardStyles.Card.Title, CardStyles.Card.Description, CardStyles.Card.Description);
80
- export var AlertWrapper = styled.div.withConfig({
59
+ })(["margin-left:", ";width:", "px;overflow:hidden;color:", ";text-align:left;font-size:13px;", "{width:", "px;display:flex;transition:left 0.3s;position:relative;left:", ";}", "{width:", "px;height:min-content;}overflow-wrap:anywhere;background-color:white;border-radius:3px;box-shadow:", ";", "{font-weight:400;gap:16px;", "}", "{padding-top:0;display:flex;flex-direction:column;gap:8px;}", "{padding:16px 16px 1px 16px;margin-bottom:0;}", "{align-self:center;margin-left:10px;margin-right:10px;}", "{margin:0;gap:2px;}", "{margin:0;}", "", "{margin-bottom:0;font-size:14px;}", "", "{font-size:11px;}.ds-button{background:transparent;}.btn-focus,.btn-focus:hover{box-shadow:unset;}"], (props) => props.asTooltip ? "0" : "8px", INFOCARD_WIDTH, (props) => props.theme.palette["grey-600"], InfoCardSlidesWrapper, (props) => props.hasActionsMenu ? INFOCARD_WIDTH * 2 : INFOCARD_WIDTH, (props) => props.isActionsMenuVisible ? `-${INFOCARD_WIDTH}px` : "0", InfoCardSlide, INFOCARD_WIDTH, (props) => props.asTooltip ? "unset" : "0 16px 32px 0 rgba(35, 41, 54, 0.1)", CardStyles.Card.Container, (props) => !props.hasFooter && css(["padding-bottom:8px;margin-bottom:1px;"]), CardStyles.Card.PaddingWrapper, CardStyles.Card.Header, CardStyles.Card.IconContainer, CardStyles.Card.HeaderContent, CardStyles.Card.TitleWrapper, CardStyles.Card.Title, CardStyles.Card.Title, CardStyles.Card.Description, CardStyles.Card.Description);
60
+ const AlertWrapper = /* @__PURE__ */ styled.div.withConfig({
81
61
  displayName: "InformationCardstyles__AlertWrapper",
82
62
  componentId: "sc-zxu5qa-12"
83
63
  })(["padding-bottom:8px;:empty{display:none;}"]);
84
- export var NonEditableWrapper = styled.div.withConfig({
64
+ const NonEditableWrapper = /* @__PURE__ */ styled.div.withConfig({
85
65
  displayName: "InformationCardstyles__NonEditableWrapper",
86
66
  componentId: "sc-zxu5qa-13"
87
67
  })(["padding-bottom:8px;:empty{display:none;}"]);
88
- export var DescriptionWrapper = styled.div.withConfig({
68
+ const DescriptionWrapper = /* @__PURE__ */ styled.div.withConfig({
89
69
  displayName: "InformationCardstyles__DescriptionWrapper",
90
70
  componentId: "sc-zxu5qa-14"
91
71
  })(["padding:0 16px;"]);
92
-
93
- /**
94
- * This component can be used to style container with popovers/tooltips to disable arrow.
95
- */
96
- export var HidePopoverArrowWrapper = styled.div.withConfig({
72
+ const HidePopoverArrowWrapper = /* @__PURE__ */ styled.div.withConfig({
97
73
  displayName: "InformationCardstyles__HidePopoverArrowWrapper",
98
74
  componentId: "sc-zxu5qa-15"
99
75
  })([".ant-popover-arrow-content,.ant-tooltip-arrow-content{display:none;}"]);
100
-
101
- /**
102
- * Should be mounted in application where.
103
- */
104
- export var GlobalCSSHidePopoverArrow = createGlobalStyle([".ant-popover-arrow-content,.ant-tooltip-arrow-content{display:none;}"]);
105
- export var ExtraInfo = styled.div.withConfig({
76
+ const GlobalCSSHidePopoverArrow = /* @__PURE__ */ createGlobalStyle([".ant-popover-arrow-content,.ant-tooltip-arrow-content{display:none;}"]);
77
+ const ExtraInfo = /* @__PURE__ */ styled.div.withConfig({
106
78
  displayName: "InformationCardstyles__ExtraInfo",
107
79
  componentId: "sc-zxu5qa-16"
108
80
  })(["margin-bottom:1px;"]);
109
- export var InformationCardActionsWrapper = styled.div.withConfig({
81
+ const InformationCardActionsWrapper = /* @__PURE__ */ styled.div.withConfig({
110
82
  displayName: "InformationCardstyles__InformationCardActionsWrapper",
111
83
  componentId: "sc-zxu5qa-17"
112
84
  })(["padding:8px;"]);
113
- export var InformationCardPropertyListWrapper = styled.div.withConfig({
85
+ const InformationCardPropertyListWrapper = /* @__PURE__ */ styled.div.withConfig({
114
86
  displayName: "InformationCardstyles__InformationCardPropertyListWrapper",
115
87
  componentId: "sc-zxu5qa-18"
116
88
  })(["display:flex;flex-direction:column;padding:0 16px 8px;gap:8px;", "{padding:0;}", "{margin:0;}"], Container, StatusTag);
117
- export var InformationCardPropertyItem = styled.div.withConfig({
89
+ const InformationCardPropertyItem = /* @__PURE__ */ styled.div.withConfig({
118
90
  displayName: "InformationCardstyles__InformationCardPropertyItem",
119
91
  componentId: "sc-zxu5qa-19"
120
92
  })(["display:flex;align-items:center;flex-wrap:wrap;column-gap:8px;row-gap:6px;"]);
121
- export var InformationCardPropertyItemLabel = styled.span.withConfig({
93
+ const InformationCardPropertyItemLabel = /* @__PURE__ */ styled.span.withConfig({
122
94
  displayName: "InformationCardstyles__InformationCardPropertyItemLabel",
123
95
  componentId: "sc-zxu5qa-20"
124
96
  })(["", ""], macro.small);
125
- export var InformationCardPropertyItemValue = styled.span.withConfig({
97
+ const InformationCardPropertyItemValue = /* @__PURE__ */ styled.span.withConfig({
126
98
  displayName: "InformationCardstyles__InformationCardPropertyItemValue",
127
99
  componentId: "sc-zxu5qa-21"
128
100
  })(["", " flex-grow:1;font-weight:500;"], macro.small);
129
- export var InformationCardSummaryWrapper = styled(Flex).withConfig({
101
+ const InformationCardSummaryWrapper = /* @__PURE__ */ styled(Flex).withConfig({
130
102
  displayName: "InformationCardstyles__InformationCardSummaryWrapper",
131
103
  componentId: "sc-zxu5qa-22"
132
104
  })(["margin:0 16px;padding-bottom:8px;gap:0 4px;flex-wrap:wrap;"]);
133
- export var InformationCardSummaryItem = styled(Flex).withConfig({
105
+ const InformationCardSummaryItem = /* @__PURE__ */ styled(Flex).withConfig({
134
106
  displayName: "InformationCardstyles__InformationCardSummaryItem",
135
107
  componentId: "sc-zxu5qa-23"
136
- })(["font-weight:500;align-items:center;gap:4px;"]);
108
+ })(["font-weight:500;align-items:center;gap:4px;"]);
109
+ export {
110
+ ActionButtonContainer,
111
+ ActionsMenuItems,
112
+ AlertWrapper,
113
+ BottomDivider,
114
+ CopyWrapper,
115
+ Copyable,
116
+ DescriptionWrapper,
117
+ Divider,
118
+ ExtraInfo,
119
+ Flex,
120
+ FlexGrow,
121
+ FooterWrapper,
122
+ GlobalCSSHidePopoverArrow,
123
+ HidePopoverArrowWrapper,
124
+ InfoCardSlide,
125
+ InfoCardSlidesWrapper,
126
+ InfoCardWrapper,
127
+ InformationCardActionsWrapper,
128
+ InformationCardPropertyItem,
129
+ InformationCardPropertyItemLabel,
130
+ InformationCardPropertyItemValue,
131
+ InformationCardPropertyListWrapper,
132
+ InformationCardSummaryItem,
133
+ InformationCardSummaryWrapper,
134
+ NonEditableWrapper
135
+ };
@@ -1,11 +1,11 @@
1
- import type { ReactNode } from 'react';
2
- import { type Color, type Size } from '@synerise/ds-avatar/dist/Avatar.types';
3
- import { type IconProps } from '@synerise/ds-icon';
4
- import { type SubtleTextAreaProps } from '@synerise/ds-subtle-form/dist/Elements/TextArea/TextArea.types';
5
- import type { WithHTMLAttributes } from '@synerise/ds-utils';
6
- import { type InformationCardActionsProps } from './InformationCardActions/InformationCardActions.types';
7
- import { type InformationCardPropertyListProps } from './InformationCardPropertyList/InformationCardPropertyList.types';
8
- import { type InformationCardSummaryProps } from './InformationCardSummary/InformationCardSummary.types';
1
+ import { ReactNode } from 'react';
2
+ import { Color, Size } from '@synerise/ds-avatar/dist/Avatar.types';
3
+ import { IconProps } from '@synerise/ds-icon';
4
+ import { SubtleTextAreaProps } from '@synerise/ds-subtle-form/dist/Elements/TextArea/TextArea.types';
5
+ import { WithHTMLAttributes } from '@synerise/ds-utils';
6
+ import { InformationCardActionsProps } from './InformationCardActions/InformationCardActions.types';
7
+ import { InformationCardPropertyListProps } from './InformationCardPropertyList/InformationCardPropertyList.types';
8
+ import { InformationCardSummaryProps } from './InformationCardSummary/InformationCardSummary.types';
9
9
  export type BadgeData = {
10
10
  type?: string;
11
11
  title?: string;
@@ -1 +1 @@
1
- export {};
1
+
@@ -1,6 +1,6 @@
1
- import React, { type PropsWithChildren } from 'react';
2
- import { type InlineAlertType } from '@synerise/ds-alert/dist/InlineAlert/InlineAlert.types';
3
- import { type BadgeData } from './InformationCard.types';
1
+ import { default as React, PropsWithChildren } from 'react';
2
+ import { InlineAlertType } from '@synerise/ds-alert/dist/InlineAlert/InlineAlert.types';
3
+ import { BadgeData } from './InformationCard.types';
4
4
  export declare function buildInitialsBadge(name: string): React.JSX.Element;
5
5
  export declare function buildExtraInfo(message: string, level?: InlineAlertType): React.JSX.Element;
6
6
  export declare function getInitials(name: string): string;