@zendeskgarden/react-notifications 9.3.0 → 9.5.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.
- package/dist/esm/styled/StyledAlert.js +3 -3
- package/dist/esm/styled/StyledBase.js +3 -3
- package/dist/esm/styled/StyledIcon.js +3 -3
- package/dist/esm/styled/StyledNotification.js +3 -3
- package/dist/esm/styled/StyledWell.js +3 -3
- package/dist/esm/styled/content/StyledClose.js +3 -3
- package/dist/esm/styled/content/StyledParagraph.js +3 -3
- package/dist/esm/styled/content/StyledTitle.js +3 -3
- package/dist/esm/styled/global-alert/StyledGlobalAlert.js +3 -3
- package/dist/esm/styled/global-alert/StyledGlobalAlertButton.js +3 -3
- package/dist/esm/styled/global-alert/StyledGlobalAlertClose.js +3 -3
- package/dist/esm/styled/global-alert/StyledGlobalAlertContent.js +3 -3
- package/dist/esm/styled/global-alert/StyledGlobalAlertIcon.js +3 -3
- package/dist/esm/styled/global-alert/StyledGlobalAlertTitle.js +3 -3
- package/dist/index.cjs.js +28 -28
- package/package.json +6 -6
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { componentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { StyledTitle } from './content/StyledTitle.js';
|
|
10
10
|
import { StyledBase } from './StyledBase.js';
|
|
11
11
|
import { validationTypes } from '../utils/icons.js';
|
|
@@ -39,10 +39,10 @@ const colorStyles = props => {
|
|
|
39
39
|
};
|
|
40
40
|
const StyledAlert = styled(StyledBase).attrs({
|
|
41
41
|
'data-garden-id': COMPONENT_ID,
|
|
42
|
-
'data-garden-version': '9.
|
|
42
|
+
'data-garden-version': '9.5.0'
|
|
43
43
|
}).withConfig({
|
|
44
44
|
displayName: "StyledAlert",
|
|
45
45
|
componentId: "sc-fyn8jp-0"
|
|
46
|
-
})(["", " ", ";"], colorStyles,
|
|
46
|
+
})(["", " ", ";"], colorStyles, componentStyles);
|
|
47
47
|
|
|
48
48
|
export { StyledAlert };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import { getLineHeight,
|
|
8
|
+
import { getLineHeight, componentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { validationTypes } from '../utils/icons.js';
|
|
10
10
|
|
|
11
11
|
const COMPONENT_ID = 'notifications.base_container';
|
|
@@ -80,10 +80,10 @@ const padding = props => {
|
|
|
80
80
|
};
|
|
81
81
|
const StyledBase = styled.div.attrs({
|
|
82
82
|
'data-garden-id': COMPONENT_ID,
|
|
83
|
-
'data-garden-version': '9.
|
|
83
|
+
'data-garden-version': '9.5.0'
|
|
84
84
|
}).withConfig({
|
|
85
85
|
displayName: "StyledBase",
|
|
86
86
|
componentId: "sc-14syaqw-0"
|
|
87
|
-
})(["position:relative;border:", ";border-radius:", ";padding:", ";line-height:", ";font-size:", ";direction:", ";", ";", ""], props => props.theme.borders.sm, props => props.theme.borderRadii.md, padding, props => getLineHeight(props.theme.space.base * 5, props.theme.fontSizes.md), props => props.theme.fontSizes.md, props => props.theme.rtl && 'rtl', colorStyles,
|
|
87
|
+
})(["position:relative;border:", ";border-radius:", ";padding:", ";line-height:", ";font-size:", ";direction:", ";", ";", ""], props => props.theme.borders.sm, props => props.theme.borderRadii.md, padding, props => getLineHeight(props.theme.space.base * 5, props.theme.fontSizes.md), props => props.theme.fontSizes.md, props => props.theme.rtl && 'rtl', colorStyles, componentStyles);
|
|
88
88
|
|
|
89
89
|
export { StyledBase };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import { StyledBaseIcon,
|
|
8
|
+
import { StyledBaseIcon, componentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { validationTypes } from '../utils/icons.js';
|
|
10
10
|
|
|
11
11
|
const COMPONENT_ID = 'notifications.icon';
|
|
@@ -49,10 +49,10 @@ const colorStyles = _ref2 => {
|
|
|
49
49
|
};
|
|
50
50
|
const StyledIcon = styled(StyledBaseIcon).attrs({
|
|
51
51
|
'data-garden-id': COMPONENT_ID,
|
|
52
|
-
'data-garden-version': '9.
|
|
52
|
+
'data-garden-version': '9.5.0'
|
|
53
53
|
}).withConfig({
|
|
54
54
|
displayName: "StyledIcon",
|
|
55
55
|
componentId: "sc-msklws-0"
|
|
56
|
-
})(["position:absolute;", " ", " ", ""], sizeStyles, colorStyles,
|
|
56
|
+
})(["position:absolute;", " ", " ", ""], sizeStyles, colorStyles, componentStyles);
|
|
57
57
|
|
|
58
58
|
export { StyledIcon };
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*/
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
import styled, { css } from 'styled-components';
|
|
9
|
-
import {
|
|
9
|
+
import { componentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
10
10
|
import { TYPE } from '../types/index.js';
|
|
11
11
|
import { StyledTitle } from './content/StyledTitle.js';
|
|
12
12
|
import { StyledBase } from './StyledBase.js';
|
|
@@ -41,11 +41,11 @@ const colorStyles = props => {
|
|
|
41
41
|
};
|
|
42
42
|
const StyledNotification = styled(StyledBase).attrs({
|
|
43
43
|
'data-garden-id': COMPONENT_ID,
|
|
44
|
-
'data-garden-version': '9.
|
|
44
|
+
'data-garden-version': '9.5.0'
|
|
45
45
|
}).withConfig({
|
|
46
46
|
displayName: "StyledNotification",
|
|
47
47
|
componentId: "sc-uf6jh-0"
|
|
48
|
-
})(["", " ", ";"], colorStyles,
|
|
48
|
+
})(["", " ", ";"], colorStyles, componentStyles);
|
|
49
49
|
StyledNotification.propTypes = {
|
|
50
50
|
$type: PropTypes.oneOf(TYPE)
|
|
51
51
|
};
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { componentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { StyledBase } from './StyledBase.js';
|
|
10
10
|
|
|
11
11
|
const COMPONENT_ID = 'notifications.well';
|
|
@@ -35,10 +35,10 @@ const colorStyles = _ref => {
|
|
|
35
35
|
};
|
|
36
36
|
const StyledWell = styled(StyledBase).attrs({
|
|
37
37
|
'data-garden-id': COMPONENT_ID,
|
|
38
|
-
'data-garden-version': '9.
|
|
38
|
+
'data-garden-version': '9.5.0'
|
|
39
39
|
}).withConfig({
|
|
40
40
|
displayName: "StyledWell",
|
|
41
41
|
componentId: "sc-a5831c-0"
|
|
42
|
-
})(["", " ", ";"], colorStyles,
|
|
42
|
+
})(["", " ", ";"], colorStyles, componentStyles);
|
|
43
43
|
|
|
44
44
|
export { StyledWell };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { componentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { validationTypes } from '../../utils/icons.js';
|
|
10
10
|
import { IconButton } from '@zendeskgarden/react-buttons';
|
|
11
11
|
|
|
@@ -58,10 +58,10 @@ const colorStyles = _ref => {
|
|
|
58
58
|
};
|
|
59
59
|
const StyledClose = styled(IconButton).attrs({
|
|
60
60
|
'data-garden-id': COMPONENT_ID,
|
|
61
|
-
'data-garden-version': '9.
|
|
61
|
+
'data-garden-version': '9.5.0'
|
|
62
62
|
}).withConfig({
|
|
63
63
|
displayName: "StyledClose",
|
|
64
64
|
componentId: "sc-1mr9nx1-0"
|
|
65
|
-
})(["position:absolute;top:", "px;right:", ";left:", ";", " ", ";"], props => props.theme.space.base, p => !p.theme.rtl && `${p.theme.space.base}px`, p => p.theme.rtl && `${p.theme.space.base}px`, colorStyles,
|
|
65
|
+
})(["position:absolute;top:", "px;right:", ";left:", ";", " ", ";"], props => props.theme.space.base, p => !p.theme.rtl && `${p.theme.space.base}px`, p => p.theme.rtl && `${p.theme.space.base}px`, colorStyles, componentStyles);
|
|
66
66
|
|
|
67
67
|
export { StyledClose };
|
|
@@ -5,15 +5,15 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { componentStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const COMPONENT_ID = 'notifications.paragraph';
|
|
11
11
|
const StyledParagraph = styled.p.attrs({
|
|
12
12
|
'data-garden-id': COMPONENT_ID,
|
|
13
|
-
'data-garden-version': '9.
|
|
13
|
+
'data-garden-version': '9.5.0'
|
|
14
14
|
}).withConfig({
|
|
15
15
|
displayName: "StyledParagraph",
|
|
16
16
|
componentId: "sc-12tmd6p-0"
|
|
17
|
-
})(["margin:", "px 0 0;", ";"], props => props.theme.space.base * 2,
|
|
17
|
+
})(["margin:", "px 0 0;", ";"], props => props.theme.space.base * 2, componentStyles);
|
|
18
18
|
|
|
19
19
|
export { StyledParagraph };
|
|
@@ -5,18 +5,18 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled from 'styled-components';
|
|
8
|
-
import { getColor,
|
|
8
|
+
import { getColor, componentStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const COMPONENT_ID = 'notifications.title';
|
|
11
11
|
const StyledTitle = styled.div.attrs({
|
|
12
12
|
'data-garden-id': COMPONENT_ID,
|
|
13
|
-
'data-garden-version': '9.
|
|
13
|
+
'data-garden-version': '9.5.0'
|
|
14
14
|
}).withConfig({
|
|
15
15
|
displayName: "StyledTitle",
|
|
16
16
|
componentId: "sc-xx4jsv-0"
|
|
17
17
|
})(["margin:0;color:", ";font-weight:", ";", ";"], p => getColor({
|
|
18
18
|
variable: 'foreground.default',
|
|
19
19
|
theme: p.theme
|
|
20
|
-
}), props => props.$isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold,
|
|
20
|
+
}), props => props.$isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, componentStyles);
|
|
21
21
|
|
|
22
22
|
export { StyledTitle };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { componentStyles, getColor, focusStyles, getLineHeight } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const COMPONENT_ID = 'notifications.global_alert';
|
|
11
11
|
const colorStyles = _ref => {
|
|
@@ -148,10 +148,10 @@ const sizeStyles = props => {
|
|
|
148
148
|
};
|
|
149
149
|
const StyledGlobalAlert = styled.div.attrs({
|
|
150
150
|
'data-garden-id': COMPONENT_ID,
|
|
151
|
-
'data-garden-version': '9.
|
|
151
|
+
'data-garden-version': '9.5.0'
|
|
152
152
|
}).withConfig({
|
|
153
153
|
displayName: "StyledGlobalAlert",
|
|
154
154
|
componentId: "sc-k6rimt-0"
|
|
155
|
-
})(["display:flex;flex-wrap:nowrap;overflow:auto;overflow-x:hidden;box-sizing:border-box;direction:", ";", " ", " && a{border-radius:", ";text-decoration:underline;}", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', sizeStyles, colorStyles, props => props.theme.borderRadii.sm,
|
|
155
|
+
})(["display:flex;flex-wrap:nowrap;overflow:auto;overflow-x:hidden;box-sizing:border-box;direction:", ";", " ", " && a{border-radius:", ";text-decoration:underline;}", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', sizeStyles, colorStyles, props => props.theme.borderRadii.sm, componentStyles);
|
|
156
156
|
|
|
157
157
|
export { StyledGlobalAlert };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { componentStyles, getColor, focusStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { Button } from '@zendeskgarden/react-buttons';
|
|
10
10
|
import { colorStyles as colorStyles$1 } from './StyledGlobalAlertClose.js';
|
|
11
11
|
|
|
@@ -106,10 +106,10 @@ function sizeStyles(props) {
|
|
|
106
106
|
}
|
|
107
107
|
const StyledGlobalAlertButton = styled(Button).attrs({
|
|
108
108
|
'data-garden-id': COMPONENT_ID,
|
|
109
|
-
'data-garden-version': '9.
|
|
109
|
+
'data-garden-version': '9.5.0'
|
|
110
110
|
}).withConfig({
|
|
111
111
|
displayName: "StyledGlobalAlertButton",
|
|
112
112
|
componentId: "sc-1txe91a-0"
|
|
113
|
-
})(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles,
|
|
113
|
+
})(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles, componentStyles);
|
|
114
114
|
|
|
115
115
|
export { StyledGlobalAlertButton };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { componentStyles, getColor, focusStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
import { IconButton } from '@zendeskgarden/react-buttons';
|
|
10
10
|
|
|
11
11
|
const COMPONENT_ID = 'notifications.global_alert.close';
|
|
@@ -91,10 +91,10 @@ const sizeStyles = props => {
|
|
|
91
91
|
};
|
|
92
92
|
const StyledGlobalAlertClose = styled(IconButton).attrs({
|
|
93
93
|
'data-garden-id': COMPONENT_ID,
|
|
94
|
-
'data-garden-version': '9.
|
|
94
|
+
'data-garden-version': '9.5.0'
|
|
95
95
|
}).withConfig({
|
|
96
96
|
displayName: "StyledGlobalAlertClose",
|
|
97
97
|
componentId: "sc-1g5s93s-0"
|
|
98
|
-
})(["", ";", ";", ";"], sizeStyles, colorStyles,
|
|
98
|
+
})(["", ";", ";", ";"], sizeStyles, colorStyles, componentStyles);
|
|
99
99
|
|
|
100
100
|
export { StyledGlobalAlertClose, colorStyles };
|
|
@@ -5,15 +5,15 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { componentStyles } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const COMPONENT_ID = 'notifications.global_alert.content';
|
|
11
11
|
const StyledGlobalAlertContent = styled.div.attrs({
|
|
12
12
|
'data-garden-id': COMPONENT_ID,
|
|
13
|
-
'data-garden-version': '9.
|
|
13
|
+
'data-garden-version': '9.5.0'
|
|
14
14
|
}).withConfig({
|
|
15
15
|
displayName: "StyledGlobalAlertContent",
|
|
16
16
|
componentId: "sc-rept0u-0"
|
|
17
|
-
})(["flex-grow:1;", ";"],
|
|
17
|
+
})(["flex-grow:1;", ";"], componentStyles);
|
|
18
18
|
|
|
19
19
|
export { StyledGlobalAlertContent };
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
8
|
import { math } from 'polished';
|
|
9
|
-
import { StyledBaseIcon,
|
|
9
|
+
import { StyledBaseIcon, componentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
10
10
|
|
|
11
11
|
const COMPONENT_ID = 'notifications.global_alert.icon';
|
|
12
12
|
const sizeStyles = props => {
|
|
@@ -53,10 +53,10 @@ const colorStyles = _ref => {
|
|
|
53
53
|
};
|
|
54
54
|
const StyledGlobalAlertIcon = styled(StyledBaseIcon).attrs({
|
|
55
55
|
'data-garden-id': COMPONENT_ID,
|
|
56
|
-
'data-garden-version': '9.
|
|
56
|
+
'data-garden-version': '9.5.0'
|
|
57
57
|
}).withConfig({
|
|
58
58
|
displayName: "StyledGlobalAlertIcon",
|
|
59
59
|
componentId: "sc-84ne9k-0"
|
|
60
|
-
})(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles,
|
|
60
|
+
})(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles, componentStyles);
|
|
61
61
|
|
|
62
62
|
export { StyledGlobalAlertIcon };
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import styled, { css } from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { componentStyles, getColor } from '@zendeskgarden/react-theming';
|
|
9
9
|
|
|
10
10
|
const COMPONENT_ID = 'notifications.global_alert.title';
|
|
11
11
|
const colorStyles = _ref => {
|
|
@@ -37,10 +37,10 @@ const colorStyles = _ref => {
|
|
|
37
37
|
};
|
|
38
38
|
const StyledGlobalAlertTitle = styled.div.attrs({
|
|
39
39
|
'data-garden-id': COMPONENT_ID,
|
|
40
|
-
'data-garden-version': '9.
|
|
40
|
+
'data-garden-version': '9.5.0'
|
|
41
41
|
}).withConfig({
|
|
42
42
|
displayName: "StyledGlobalAlertTitle",
|
|
43
43
|
componentId: "sc-10clqbo-0"
|
|
44
|
-
})(["display:inline;margin-", ":", "px;font-weight:", ";", ";", ";"], props => props.theme.rtl ? 'left' : 'right', props => props.theme.space.base * 2, props => props.$isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, colorStyles,
|
|
44
|
+
})(["display:inline;margin-", ":", "px;font-weight:", ";", ";", ";"], props => props.theme.rtl ? 'left' : 'right', props => props.theme.space.base * 2, props => props.$isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, colorStyles, componentStyles);
|
|
45
45
|
|
|
46
46
|
export { StyledGlobalAlertTitle };
|
package/dist/index.cjs.js
CHANGED
|
@@ -206,32 +206,32 @@ const colorStyles$a = _ref => {
|
|
|
206
206
|
};
|
|
207
207
|
const StyledClose = styled__default.default(reactButtons.IconButton).attrs({
|
|
208
208
|
'data-garden-id': COMPONENT_ID$d,
|
|
209
|
-
'data-garden-version': '9.
|
|
209
|
+
'data-garden-version': '9.5.0'
|
|
210
210
|
}).withConfig({
|
|
211
211
|
displayName: "StyledClose",
|
|
212
212
|
componentId: "sc-1mr9nx1-0"
|
|
213
|
-
})(["position:absolute;top:", "px;right:", ";left:", ";", " ", ";"], props => props.theme.space.base, p => !p.theme.rtl && `${p.theme.space.base}px`, p => p.theme.rtl && `${p.theme.space.base}px`, colorStyles$a,
|
|
213
|
+
})(["position:absolute;top:", "px;right:", ";left:", ";", " ", ";"], props => props.theme.space.base, p => !p.theme.rtl && `${p.theme.space.base}px`, p => p.theme.rtl && `${p.theme.space.base}px`, colorStyles$a, reactTheming.componentStyles);
|
|
214
214
|
|
|
215
215
|
const COMPONENT_ID$c = 'notifications.paragraph';
|
|
216
216
|
const StyledParagraph = styled__default.default.p.attrs({
|
|
217
217
|
'data-garden-id': COMPONENT_ID$c,
|
|
218
|
-
'data-garden-version': '9.
|
|
218
|
+
'data-garden-version': '9.5.0'
|
|
219
219
|
}).withConfig({
|
|
220
220
|
displayName: "StyledParagraph",
|
|
221
221
|
componentId: "sc-12tmd6p-0"
|
|
222
|
-
})(["margin:", "px 0 0;", ";"], props => props.theme.space.base * 2,
|
|
222
|
+
})(["margin:", "px 0 0;", ";"], props => props.theme.space.base * 2, reactTheming.componentStyles);
|
|
223
223
|
|
|
224
224
|
const COMPONENT_ID$b = 'notifications.title';
|
|
225
225
|
const StyledTitle = styled__default.default.div.attrs({
|
|
226
226
|
'data-garden-id': COMPONENT_ID$b,
|
|
227
|
-
'data-garden-version': '9.
|
|
227
|
+
'data-garden-version': '9.5.0'
|
|
228
228
|
}).withConfig({
|
|
229
229
|
displayName: "StyledTitle",
|
|
230
230
|
componentId: "sc-xx4jsv-0"
|
|
231
231
|
})(["margin:0;color:", ";font-weight:", ";", ";"], p => reactTheming.getColor({
|
|
232
232
|
variable: 'foreground.default',
|
|
233
233
|
theme: p.theme
|
|
234
|
-
}), props => props.$isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold,
|
|
234
|
+
}), props => props.$isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, reactTheming.componentStyles);
|
|
235
235
|
|
|
236
236
|
const COMPONENT_ID$a = 'notifications.base_container';
|
|
237
237
|
const colorStyles$9 = _ref => {
|
|
@@ -305,11 +305,11 @@ const padding = props => {
|
|
|
305
305
|
};
|
|
306
306
|
const StyledBase = styled__default.default.div.attrs({
|
|
307
307
|
'data-garden-id': COMPONENT_ID$a,
|
|
308
|
-
'data-garden-version': '9.
|
|
308
|
+
'data-garden-version': '9.5.0'
|
|
309
309
|
}).withConfig({
|
|
310
310
|
displayName: "StyledBase",
|
|
311
311
|
componentId: "sc-14syaqw-0"
|
|
312
|
-
})(["position:relative;border:", ";border-radius:", ";padding:", ";line-height:", ";font-size:", ";direction:", ";", ";", ""], props => props.theme.borders.sm, props => props.theme.borderRadii.md, padding, props => reactTheming.getLineHeight(props.theme.space.base * 5, props.theme.fontSizes.md), props => props.theme.fontSizes.md, props => props.theme.rtl && 'rtl', colorStyles$9,
|
|
312
|
+
})(["position:relative;border:", ";border-radius:", ";padding:", ";line-height:", ";font-size:", ";direction:", ";", ";", ""], props => props.theme.borders.sm, props => props.theme.borderRadii.md, padding, props => reactTheming.getLineHeight(props.theme.space.base * 5, props.theme.fontSizes.md), props => props.theme.fontSizes.md, props => props.theme.rtl && 'rtl', colorStyles$9, reactTheming.componentStyles);
|
|
313
313
|
|
|
314
314
|
const COMPONENT_ID$9 = 'notifications.alert';
|
|
315
315
|
const colorStyles$8 = props => {
|
|
@@ -340,11 +340,11 @@ const colorStyles$8 = props => {
|
|
|
340
340
|
};
|
|
341
341
|
const StyledAlert = styled__default.default(StyledBase).attrs({
|
|
342
342
|
'data-garden-id': COMPONENT_ID$9,
|
|
343
|
-
'data-garden-version': '9.
|
|
343
|
+
'data-garden-version': '9.5.0'
|
|
344
344
|
}).withConfig({
|
|
345
345
|
displayName: "StyledAlert",
|
|
346
346
|
componentId: "sc-fyn8jp-0"
|
|
347
|
-
})(["", " ", ";"], colorStyles$8,
|
|
347
|
+
})(["", " ", ";"], colorStyles$8, reactTheming.componentStyles);
|
|
348
348
|
|
|
349
349
|
const COMPONENT_ID$8 = 'notifications.notification';
|
|
350
350
|
const colorStyles$7 = props => {
|
|
@@ -375,11 +375,11 @@ const colorStyles$7 = props => {
|
|
|
375
375
|
};
|
|
376
376
|
const StyledNotification = styled__default.default(StyledBase).attrs({
|
|
377
377
|
'data-garden-id': COMPONENT_ID$8,
|
|
378
|
-
'data-garden-version': '9.
|
|
378
|
+
'data-garden-version': '9.5.0'
|
|
379
379
|
}).withConfig({
|
|
380
380
|
displayName: "StyledNotification",
|
|
381
381
|
componentId: "sc-uf6jh-0"
|
|
382
|
-
})(["", " ", ";"], colorStyles$7,
|
|
382
|
+
})(["", " ", ";"], colorStyles$7, reactTheming.componentStyles);
|
|
383
383
|
StyledNotification.propTypes = {
|
|
384
384
|
$type: PropTypes__default.default.oneOf(TYPE)
|
|
385
385
|
};
|
|
@@ -411,11 +411,11 @@ const colorStyles$6 = _ref => {
|
|
|
411
411
|
};
|
|
412
412
|
const StyledWell = styled__default.default(StyledBase).attrs({
|
|
413
413
|
'data-garden-id': COMPONENT_ID$7,
|
|
414
|
-
'data-garden-version': '9.
|
|
414
|
+
'data-garden-version': '9.5.0'
|
|
415
415
|
}).withConfig({
|
|
416
416
|
displayName: "StyledWell",
|
|
417
417
|
componentId: "sc-a5831c-0"
|
|
418
|
-
})(["", " ", ";"], colorStyles$6,
|
|
418
|
+
})(["", " ", ";"], colorStyles$6, reactTheming.componentStyles);
|
|
419
419
|
|
|
420
420
|
const COMPONENT_ID$6 = 'notifications.icon';
|
|
421
421
|
const sizeStyles$4 = _ref => {
|
|
@@ -458,11 +458,11 @@ const colorStyles$5 = _ref2 => {
|
|
|
458
458
|
};
|
|
459
459
|
const StyledIcon = styled__default.default(reactTheming.StyledBaseIcon).attrs({
|
|
460
460
|
'data-garden-id': COMPONENT_ID$6,
|
|
461
|
-
'data-garden-version': '9.
|
|
461
|
+
'data-garden-version': '9.5.0'
|
|
462
462
|
}).withConfig({
|
|
463
463
|
displayName: "StyledIcon",
|
|
464
464
|
componentId: "sc-msklws-0"
|
|
465
|
-
})(["position:absolute;", " ", " ", ""], sizeStyles$4, colorStyles$5,
|
|
465
|
+
})(["position:absolute;", " ", " ", ""], sizeStyles$4, colorStyles$5, reactTheming.componentStyles);
|
|
466
466
|
|
|
467
467
|
const COMPONENT_ID$5 = 'notifications.global_alert';
|
|
468
468
|
const colorStyles$4 = _ref => {
|
|
@@ -605,11 +605,11 @@ const sizeStyles$3 = props => {
|
|
|
605
605
|
};
|
|
606
606
|
const StyledGlobalAlert = styled__default.default.div.attrs({
|
|
607
607
|
'data-garden-id': COMPONENT_ID$5,
|
|
608
|
-
'data-garden-version': '9.
|
|
608
|
+
'data-garden-version': '9.5.0'
|
|
609
609
|
}).withConfig({
|
|
610
610
|
displayName: "StyledGlobalAlert",
|
|
611
611
|
componentId: "sc-k6rimt-0"
|
|
612
|
-
})(["display:flex;flex-wrap:nowrap;overflow:auto;overflow-x:hidden;box-sizing:border-box;direction:", ";", " ", " && a{border-radius:", ";text-decoration:underline;}", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', sizeStyles$3, colorStyles$4, props => props.theme.borderRadii.sm,
|
|
612
|
+
})(["display:flex;flex-wrap:nowrap;overflow:auto;overflow-x:hidden;box-sizing:border-box;direction:", ";", " ", " && a{border-radius:", ";text-decoration:underline;}", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', sizeStyles$3, colorStyles$4, props => props.theme.borderRadii.sm, reactTheming.componentStyles);
|
|
613
613
|
|
|
614
614
|
const COMPONENT_ID$4 = 'notifications.global_alert.close';
|
|
615
615
|
const colorStyles$3 = props => {
|
|
@@ -694,11 +694,11 @@ const sizeStyles$2 = props => {
|
|
|
694
694
|
};
|
|
695
695
|
const StyledGlobalAlertClose = styled__default.default(reactButtons.IconButton).attrs({
|
|
696
696
|
'data-garden-id': COMPONENT_ID$4,
|
|
697
|
-
'data-garden-version': '9.
|
|
697
|
+
'data-garden-version': '9.5.0'
|
|
698
698
|
}).withConfig({
|
|
699
699
|
displayName: "StyledGlobalAlertClose",
|
|
700
700
|
componentId: "sc-1g5s93s-0"
|
|
701
|
-
})(["", ";", ";", ";"], sizeStyles$2, colorStyles$3,
|
|
701
|
+
})(["", ";", ";", ";"], sizeStyles$2, colorStyles$3, reactTheming.componentStyles);
|
|
702
702
|
|
|
703
703
|
const COMPONENT_ID$3 = 'notifications.global_alert.button';
|
|
704
704
|
function colorStyles$2(props) {
|
|
@@ -797,20 +797,20 @@ function sizeStyles$1(props) {
|
|
|
797
797
|
}
|
|
798
798
|
const StyledGlobalAlertButton = styled__default.default(reactButtons.Button).attrs({
|
|
799
799
|
'data-garden-id': COMPONENT_ID$3,
|
|
800
|
-
'data-garden-version': '9.
|
|
800
|
+
'data-garden-version': '9.5.0'
|
|
801
801
|
}).withConfig({
|
|
802
802
|
displayName: "StyledGlobalAlertButton",
|
|
803
803
|
componentId: "sc-1txe91a-0"
|
|
804
|
-
})(["flex-shrink:0;", ";", ";", ";"], sizeStyles$1, colorStyles$2,
|
|
804
|
+
})(["flex-shrink:0;", ";", ";", ";"], sizeStyles$1, colorStyles$2, reactTheming.componentStyles);
|
|
805
805
|
|
|
806
806
|
const COMPONENT_ID$2 = 'notifications.global_alert.content';
|
|
807
807
|
const StyledGlobalAlertContent = styled__default.default.div.attrs({
|
|
808
808
|
'data-garden-id': COMPONENT_ID$2,
|
|
809
|
-
'data-garden-version': '9.
|
|
809
|
+
'data-garden-version': '9.5.0'
|
|
810
810
|
}).withConfig({
|
|
811
811
|
displayName: "StyledGlobalAlertContent",
|
|
812
812
|
componentId: "sc-rept0u-0"
|
|
813
|
-
})(["flex-grow:1;", ";"],
|
|
813
|
+
})(["flex-grow:1;", ";"], reactTheming.componentStyles);
|
|
814
814
|
|
|
815
815
|
const COMPONENT_ID$1 = 'notifications.global_alert.icon';
|
|
816
816
|
const sizeStyles = props => {
|
|
@@ -857,11 +857,11 @@ const colorStyles$1 = _ref => {
|
|
|
857
857
|
};
|
|
858
858
|
const StyledGlobalAlertIcon = styled__default.default(reactTheming.StyledBaseIcon).attrs({
|
|
859
859
|
'data-garden-id': COMPONENT_ID$1,
|
|
860
|
-
'data-garden-version': '9.
|
|
860
|
+
'data-garden-version': '9.5.0'
|
|
861
861
|
}).withConfig({
|
|
862
862
|
displayName: "StyledGlobalAlertIcon",
|
|
863
863
|
componentId: "sc-84ne9k-0"
|
|
864
|
-
})(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles$1,
|
|
864
|
+
})(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles$1, reactTheming.componentStyles);
|
|
865
865
|
|
|
866
866
|
const COMPONENT_ID = 'notifications.global_alert.title';
|
|
867
867
|
const colorStyles = _ref => {
|
|
@@ -893,11 +893,11 @@ const colorStyles = _ref => {
|
|
|
893
893
|
};
|
|
894
894
|
const StyledGlobalAlertTitle = styled__default.default.div.attrs({
|
|
895
895
|
'data-garden-id': COMPONENT_ID,
|
|
896
|
-
'data-garden-version': '9.
|
|
896
|
+
'data-garden-version': '9.5.0'
|
|
897
897
|
}).withConfig({
|
|
898
898
|
displayName: "StyledGlobalAlertTitle",
|
|
899
899
|
componentId: "sc-10clqbo-0"
|
|
900
|
-
})(["display:inline;margin-", ":", "px;font-weight:", ";", ";", ";"], props => props.theme.rtl ? 'left' : 'right', props => props.theme.space.base * 2, props => props.$isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, colorStyles,
|
|
900
|
+
})(["display:inline;margin-", ":", "px;font-weight:", ";", ";", ";"], props => props.theme.rtl ? 'left' : 'right', props => props.theme.space.base * 2, props => props.$isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, colorStyles, reactTheming.componentStyles);
|
|
901
901
|
|
|
902
902
|
const NotificationsContext = React.createContext(undefined);
|
|
903
903
|
const useNotificationsContext = () => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zendeskgarden/react-notifications",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.5.0",
|
|
4
4
|
"description": "Notification and Well components within the Garden Design System",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Zendesk Garden <garden@zendesk.com>",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"sideEffects": false,
|
|
22
22
|
"types": "dist/typings/index.d.ts",
|
|
23
23
|
"dependencies": {
|
|
24
|
-
"@zendeskgarden/react-buttons": "^9.
|
|
24
|
+
"@zendeskgarden/react-buttons": "^9.5.0",
|
|
25
25
|
"polished": "^4.3.1",
|
|
26
26
|
"prop-types": "^15.5.7",
|
|
27
27
|
"react-transition-group": "^4.4.2",
|
|
@@ -34,9 +34,9 @@
|
|
|
34
34
|
"styled-components": "^5.3.1 || ^6.0.0"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
|
-
"@types/react-transition-group": "4.4.
|
|
38
|
-
"@zendeskgarden/react-theming": "^9.
|
|
39
|
-
"@zendeskgarden/svg-icons": "7.
|
|
37
|
+
"@types/react-transition-group": "4.4.12",
|
|
38
|
+
"@zendeskgarden/react-theming": "^9.5.0",
|
|
39
|
+
"@zendeskgarden/svg-icons": "7.5.0"
|
|
40
40
|
},
|
|
41
41
|
"keywords": [
|
|
42
42
|
"components",
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"access": "public"
|
|
49
49
|
},
|
|
50
50
|
"zendeskgarden:src": "src/index.ts",
|
|
51
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "43546784a9aa985332ddcc6dd09209a11e2c03ff"
|
|
52
52
|
}
|