@synerise/ds-alert 0.8.23 → 0.8.25

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.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,25 @@
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
+ ## [0.8.25](https://github.com/Synerise/synerise-design/compare/@synerise/ds-alert@0.8.24...@synerise/ds-alert@0.8.25) (2024-08-30)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **alert:** fixes to section message ([b8e40ce](https://github.com/Synerise/synerise-design/commit/b8e40ceb26fc53e91660047e9953600cf09c653d))
12
+
13
+
14
+
15
+
16
+
17
+ ## [0.8.24](https://github.com/Synerise/synerise-design/compare/@synerise/ds-alert@0.8.23...@synerise/ds-alert@0.8.24) (2024-08-27)
18
+
19
+ **Note:** Version bump only for package @synerise/ds-alert
20
+
21
+
22
+
23
+
24
+
6
25
  ## [0.8.23](https://github.com/Synerise/synerise-design/compare/@synerise/ds-alert@0.8.22...@synerise/ds-alert@0.8.23) (2024-08-19)
7
26
 
8
27
 
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { Props } from './SectionMessage.types';
3
- declare const SectionMessage: ({ icon, type, message, description, showMoreLabel, onShowMore, onClose, newClient, moreButtons, withEmphasis, withLink, unorderedList, color, withClose, customColor, customColorIcon, customIcon, textButton, }: Props) => React.JSX.Element;
3
+ declare const SectionMessage: ({ icon, type, message, description, showMoreLabel, onShowMore, onClose, suffixel, moreButtons, withEmphasis, withLink, unorderedList, color, withClose, customColor, customColorIcon, customIcon, }: Props) => React.JSX.Element;
4
4
  export default SectionMessage;
@@ -1,6 +1,5 @@
1
1
  import React, { useMemo } from 'react';
2
- import Icon, { CloseM, WarningFillM, UserAddM, Check3M, HelpFillM, UserUpM, UpdateDataM, NotificationsReceiveM } from '@synerise/ds-icon';
3
- import Button from '@synerise/ds-button';
2
+ import Icon, { CloseM, WarningFillM, Check3M, HelpFillM, UserUpM, UpdateDataM, NotificationsReceiveM } from '@synerise/ds-icon';
4
3
  import * as S from './SectionMessage.styles';
5
4
  var ICONS = {
6
5
  positive: /*#__PURE__*/React.createElement(Check3M, null),
@@ -21,7 +20,7 @@ var SectionMessage = function SectionMessage(_ref) {
21
20
  showMoreLabel = _ref.showMoreLabel,
22
21
  onShowMore = _ref.onShowMore,
23
22
  onClose = _ref.onClose,
24
- newClient = _ref.newClient,
23
+ suffixel = _ref.suffixel,
25
24
  moreButtons = _ref.moreButtons,
26
25
  withEmphasis = _ref.withEmphasis,
27
26
  withLink = _ref.withLink,
@@ -30,8 +29,7 @@ var SectionMessage = function SectionMessage(_ref) {
30
29
  withClose = _ref.withClose,
31
30
  customColor = _ref.customColor,
32
31
  customColorIcon = _ref.customColorIcon,
33
- customIcon = _ref.customIcon,
34
- textButton = _ref.textButton;
32
+ customIcon = _ref.customIcon;
35
33
  var renderMessage = useMemo(function () {
36
34
  return /*#__PURE__*/React.createElement(S.AlertContent, {
37
35
  withLink: withLink
@@ -58,12 +56,7 @@ var SectionMessage = function SectionMessage(_ref) {
58
56
  customColorIcon: customColorIcon
59
57
  }, customIcon || /*#__PURE__*/React.createElement(Icon, {
60
58
  component: renderIcon
61
- })), renderMessage), /*#__PURE__*/React.createElement(S.ButtonWrapper, null, newClient && /*#__PURE__*/React.createElement(Button, {
62
- type: "ghost",
63
- mode: "icon-label"
64
- }, /*#__PURE__*/React.createElement(Icon, {
65
- component: /*#__PURE__*/React.createElement(UserAddM, null)
66
- }), textButton), withClose && /*#__PURE__*/React.createElement(S.IconCloseWrapper, {
59
+ })), renderMessage), /*#__PURE__*/React.createElement(S.ButtonWrapper, null, suffixel && /*#__PURE__*/React.createElement(S.SuffixWrapper, null, suffixel), withClose && /*#__PURE__*/React.createElement(S.IconCloseWrapper, {
67
60
  onClick: handleClose
68
61
  }, /*#__PURE__*/React.createElement(Icon, {
69
62
  component: /*#__PURE__*/React.createElement(CloseM, null)
@@ -14,6 +14,7 @@ export declare const ButtonWrapper: import("styled-components").StyledComponent<
14
14
  export declare const FirstButtonWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
15
15
  export declare const NumberWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
16
16
  export declare const ButtonsWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
17
+ export declare const SuffixWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
17
18
  export declare const IconOrderWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
18
19
  export declare const OrderWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
19
20
  export declare const Wrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -49,9 +49,13 @@ export var ButtonsWrapper = styled.div.withConfig({
49
49
  displayName: "SectionMessagestyles__ButtonsWrapper",
50
50
  componentId: "sc-1kuq4h0-8"
51
51
  })(["padding:16px 0 0 0;display:flex;"]);
52
+ export var SuffixWrapper = styled.div.withConfig({
53
+ displayName: "SectionMessagestyles__SuffixWrapper",
54
+ componentId: "sc-1kuq4h0-9"
55
+ })(["display:flex;"]);
52
56
  export var IconOrderWrapper = styled.div.withConfig({
53
57
  displayName: "SectionMessagestyles__IconOrderWrapper",
54
- componentId: "sc-1kuq4h0-9"
58
+ componentId: "sc-1kuq4h0-10"
55
59
  })(["display:none;margin:-4px 0;svg{fill:", ";}&:hover{svg{fill:", ";cursor:pointer;}}"], function (props) {
56
60
  return props.theme.palette['grey-700'];
57
61
  }, function (props) {
@@ -59,7 +63,7 @@ export var IconOrderWrapper = styled.div.withConfig({
59
63
  });
60
64
  export var OrderWrapper = styled.div.withConfig({
61
65
  displayName: "SectionMessagestyles__OrderWrapper",
62
- componentId: "sc-1kuq4h0-10"
66
+ componentId: "sc-1kuq4h0-11"
63
67
  })(["display:flex;&:hover{", "{display:block;}", "{background-image:linear-gradient( to right,", " 20%,rgba(255,255,255,0) 10% );background-color:transparent;background-position:bottom left;background-size:5px 1px;background-repeat:repeat-x;color:", ";}}"], IconOrderWrapper, NumberWrapper, function (props) {
64
68
  return props.theme.palette['grey-400'];
65
69
  }, function (props) {
@@ -67,13 +71,13 @@ export var OrderWrapper = styled.div.withConfig({
67
71
  });
68
72
  export var Wrapper = styled.div.withConfig({
69
73
  displayName: "SectionMessagestyles__Wrapper",
70
- componentId: "sc-1kuq4h0-11"
74
+ componentId: "sc-1kuq4h0-12"
71
75
  })(["margin-top:10px;color:", ";"], function (props) {
72
76
  return props.theme.palette['grey-700'];
73
77
  });
74
78
  export var Container = styled.div.withConfig({
75
79
  displayName: "SectionMessagestyles__Container",
76
- componentId: "sc-1kuq4h0-12"
80
+ componentId: "sc-1kuq4h0-13"
77
81
  })(["width:100%;align-items:center;justify-content:center;background-color:", ";border:1px solid ", ";border-top:2px solid ", ";border-radius:2px;"], function (props) {
78
82
  return props.customColor ? props.theme.palette[props.customColor + "-050"] : props.theme.palette[props.color + "-050"];
79
83
  }, function (props) {
@@ -83,29 +87,29 @@ export var Container = styled.div.withConfig({
83
87
  });
84
88
  export var WrapperSectionMessage = styled.div.withConfig({
85
89
  displayName: "SectionMessagestyles__WrapperSectionMessage",
86
- componentId: "sc-1kuq4h0-13"
90
+ componentId: "sc-1kuq4h0-14"
87
91
  })(["display:flex;font-size:13px;color:inherit;justify-content:space-between;"]);
88
92
  export var AlertMessage = styled.span.withConfig({
89
93
  displayName: "SectionMessagestyles__AlertMessage",
90
- componentId: "sc-1kuq4h0-14"
94
+ componentId: "sc-1kuq4h0-15"
91
95
  })(["font-size:13px;line-height:1.39;font-weight:500;max-width:400px;overflow:hidden;text-overflow:ellipsis;color:", ";"], function (props) {
92
96
  return props.theme.palette['grey-700'];
93
97
  });
94
98
  export var AlertDescription = styled.span.withConfig({
95
99
  displayName: "SectionMessagestyles__AlertDescription",
96
- componentId: "sc-1kuq4h0-15"
100
+ componentId: "sc-1kuq4h0-16"
97
101
  })(["display:flex;font-size:13px;line-height:1.39;font-weight:normal;padding-right:3px;margin-top:2px;color:", ";"], function (props) {
98
102
  return props.theme.palette['grey-700'];
99
103
  });
100
104
  export var EmphasisWrapper = styled.span.withConfig({
101
105
  displayName: "SectionMessagestyles__EmphasisWrapper",
102
- componentId: "sc-1kuq4h0-16"
106
+ componentId: "sc-1kuq4h0-17"
103
107
  })(["display:flex;font-size:13px;line-height:1.39;font-weight:500;margin-top:2px;color:inherit;"]);
104
108
  export var LinkWrapper = styled.span.withConfig({
105
109
  displayName: "SectionMessagestyles__LinkWrapper",
106
- componentId: "sc-1kuq4h0-17"
110
+ componentId: "sc-1kuq4h0-18"
107
111
  })(["display:flex;font-size:13px;line-height:1.5;font-weight:400;margin-top:2px;color:inherit;text-decoration:underline;cursor:pointer;a{color:inherit;}"]);
108
112
  export var AlertShowMore = styled.span.withConfig({
109
113
  displayName: "SectionMessagestyles__AlertShowMore",
110
- componentId: "sc-1kuq4h0-18"
114
+ componentId: "sc-1kuq4h0-19"
111
115
  })(["display:flex;font-size:13px;font-weight:500;color:inherit;text-decoration:underline;cursor:pointer;margin-top:6px;"]);
@@ -15,12 +15,11 @@ export interface Props extends Omit<AlertProps, 'type' | 'message'> {
15
15
  showMoreLabel?: React.ReactNode;
16
16
  onShowMore?: () => void;
17
17
  onClose?: () => void;
18
- newClient?: boolean | React.ReactNode;
18
+ suffixel?: React.ReactNode;
19
19
  moreButtons?: boolean | React.ReactNode;
20
20
  withEmphasis?: React.ReactNode;
21
21
  withLink?: React.ReactNode;
22
22
  unorderedList?: React.ReactNode;
23
23
  withClose?: React.ReactNode;
24
24
  customIcon?: React.ReactElement;
25
- textButton?: string;
26
25
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-alert",
3
- "version": "0.8.23",
3
+ "version": "0.8.25",
4
4
  "description": "Alert UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -33,9 +33,10 @@
33
33
  ],
34
34
  "types": "dist/index.d.ts",
35
35
  "dependencies": {
36
- "@synerise/ds-button": "^0.21.5",
37
- "@synerise/ds-icon": "^0.65.0",
38
- "@synerise/ds-unordered-list": "^0.2.94",
36
+ "@synerise/ds-button": "^0.21.7",
37
+ "@synerise/ds-icon": "^0.65.2",
38
+ "@synerise/ds-unordered-list": "^0.3.1",
39
+ "@synerise/ds-utils": "^0.28.2",
39
40
  "animate.css": "^4.1.1",
40
41
  "react-animate-height": "^2.0.23",
41
42
  "react-dom": "16.13.0",
@@ -47,5 +48,5 @@
47
48
  "react": ">=16.9.0 <= 17.0.2",
48
49
  "styled-components": "5.0.1"
49
50
  },
50
- "gitHead": "2e6de17b64023536c24be8fcb67b1e53e8bffa3d"
51
+ "gitHead": "d5df67eecdc1cbcb56def8c17d04b7d883876fbf"
51
52
  }