@zendeskgarden/react-notifications 8.69.6 → 8.69.7
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/index.cjs.js
CHANGED
|
@@ -60,7 +60,7 @@ const TYPE = ['success', 'warning', 'error', 'info'];
|
|
|
60
60
|
const COMPONENT_ID$b = 'notifications.close';
|
|
61
61
|
const StyledClose = styled__default.default.button.attrs({
|
|
62
62
|
'data-garden-id': COMPONENT_ID$b,
|
|
63
|
-
'data-garden-version': '8.69.
|
|
63
|
+
'data-garden-version': '8.69.7'
|
|
64
64
|
}).withConfig({
|
|
65
65
|
displayName: "StyledClose",
|
|
66
66
|
componentId: "sc-1mr9nx1-0"
|
|
@@ -75,7 +75,7 @@ StyledClose.defaultProps = {
|
|
|
75
75
|
const COMPONENT_ID$a = 'notifications.paragraph';
|
|
76
76
|
const StyledParagraph = styled__default.default.p.attrs({
|
|
77
77
|
'data-garden-id': COMPONENT_ID$a,
|
|
78
|
-
'data-garden-version': '8.69.
|
|
78
|
+
'data-garden-version': '8.69.7'
|
|
79
79
|
}).withConfig({
|
|
80
80
|
displayName: "StyledParagraph",
|
|
81
81
|
componentId: "sc-12tmd6p-0"
|
|
@@ -87,7 +87,7 @@ StyledParagraph.defaultProps = {
|
|
|
87
87
|
const COMPONENT_ID$9 = 'notifications.title';
|
|
88
88
|
const StyledTitle = styled__default.default.div.attrs({
|
|
89
89
|
'data-garden-id': COMPONENT_ID$9,
|
|
90
|
-
'data-garden-version': '8.69.
|
|
90
|
+
'data-garden-version': '8.69.7'
|
|
91
91
|
}).withConfig({
|
|
92
92
|
displayName: "StyledTitle",
|
|
93
93
|
componentId: "sc-xx4jsv-0"
|
|
@@ -142,11 +142,10 @@ StyledBase.defaultProps = {
|
|
|
142
142
|
|
|
143
143
|
const COMPONENT_ID$8 = 'notifications.alert';
|
|
144
144
|
const colorStyles$5 = props => styled.css(["", "{color:", ";}"], StyledTitle, props.hue && reactTheming.getColor(props.hue, 800, props.theme));
|
|
145
|
-
const StyledAlert = styled__default.default(StyledBase).attrs(
|
|
145
|
+
const StyledAlert = styled__default.default(StyledBase).attrs({
|
|
146
146
|
'data-garden-id': COMPONENT_ID$8,
|
|
147
|
-
'data-garden-version': '8.69.
|
|
148
|
-
|
|
149
|
-
})).withConfig({
|
|
147
|
+
'data-garden-version': '8.69.7'
|
|
148
|
+
}).withConfig({
|
|
150
149
|
displayName: "StyledAlert",
|
|
151
150
|
componentId: "sc-fyn8jp-0"
|
|
152
151
|
})(["", " ", ";"], colorStyles$5, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$8, props));
|
|
@@ -191,7 +190,7 @@ const colorStyles$4 = props => {
|
|
|
191
190
|
};
|
|
192
191
|
const StyledNotification = styled__default.default(StyledBase).attrs({
|
|
193
192
|
'data-garden-id': COMPONENT_ID$7,
|
|
194
|
-
'data-garden-version': '8.69.
|
|
193
|
+
'data-garden-version': '8.69.7'
|
|
195
194
|
}).withConfig({
|
|
196
195
|
displayName: "StyledNotification",
|
|
197
196
|
componentId: "sc-uf6jh-0"
|
|
@@ -206,7 +205,7 @@ StyledNotification.defaultProps = {
|
|
|
206
205
|
const COMPONENT_ID$6 = 'notifications.well';
|
|
207
206
|
const StyledWell = styled__default.default(StyledBase).attrs({
|
|
208
207
|
'data-garden-id': COMPONENT_ID$6,
|
|
209
|
-
'data-garden-version': '8.69.
|
|
208
|
+
'data-garden-version': '8.69.7'
|
|
210
209
|
}).withConfig({
|
|
211
210
|
displayName: "StyledWell",
|
|
212
211
|
componentId: "sc-a5831c-0"
|
|
@@ -293,7 +292,7 @@ const sizeStyles$3 = props => {
|
|
|
293
292
|
};
|
|
294
293
|
const StyledGlobalAlert = styled__default.default.div.attrs({
|
|
295
294
|
'data-garden-id': COMPONENT_ID$5,
|
|
296
|
-
'data-garden-version': '8.69.
|
|
295
|
+
'data-garden-version': '8.69.7'
|
|
297
296
|
}).withConfig({
|
|
298
297
|
displayName: "StyledGlobalAlert",
|
|
299
298
|
componentId: "sc-k6rimt-0"
|
|
@@ -353,7 +352,7 @@ const sizeStyles$2 = props => {
|
|
|
353
352
|
};
|
|
354
353
|
const StyledGlobalAlertClose = styled__default.default(reactButtons.IconButton).attrs({
|
|
355
354
|
'data-garden-id': COMPONENT_ID$4,
|
|
356
|
-
'data-garden-version': '8.69.
|
|
355
|
+
'data-garden-version': '8.69.7',
|
|
357
356
|
size: 'small'
|
|
358
357
|
}).withConfig({
|
|
359
358
|
displayName: "StyledGlobalAlertClose",
|
|
@@ -408,7 +407,7 @@ function sizeStyles$1(props) {
|
|
|
408
407
|
}
|
|
409
408
|
const StyledGlobalAlertButton = styled__default.default(reactButtons.Button).attrs({
|
|
410
409
|
'data-garden-id': COMPONENT_ID$3,
|
|
411
|
-
'data-garden-version': '8.69.
|
|
410
|
+
'data-garden-version': '8.69.7',
|
|
412
411
|
focusInset: false,
|
|
413
412
|
isDanger: false,
|
|
414
413
|
isLink: false,
|
|
@@ -427,7 +426,7 @@ StyledGlobalAlertButton.defaultProps = {
|
|
|
427
426
|
const COMPONENT_ID$2 = 'notifications.global-alert.content';
|
|
428
427
|
const StyledGlobalAlertContent = styled__default.default.div.attrs({
|
|
429
428
|
'data-garden-id': COMPONENT_ID$2,
|
|
430
|
-
'data-garden-version': '8.69.
|
|
429
|
+
'data-garden-version': '8.69.7'
|
|
431
430
|
}).withConfig({
|
|
432
431
|
displayName: "StyledGlobalAlertContent",
|
|
433
432
|
componentId: "sc-rept0u-0"
|
|
@@ -451,7 +450,7 @@ const StyledGlobalAlertIcon = styled__default.default(_ref => {
|
|
|
451
450
|
return React__namespace.default.cloneElement(React.Children.only(children), props);
|
|
452
451
|
}).attrs({
|
|
453
452
|
'data-garden-id': COMPONENT_ID$1,
|
|
454
|
-
'data-garden-version': '8.69.
|
|
453
|
+
'data-garden-version': '8.69.7'
|
|
455
454
|
}).withConfig({
|
|
456
455
|
displayName: "StyledGlobalAlertIcon",
|
|
457
456
|
componentId: "sc-84ne9k-0"
|
|
@@ -479,7 +478,7 @@ const colorStyles = props => {
|
|
|
479
478
|
};
|
|
480
479
|
const StyledGlobalAlertTitle = styled__default.default.div.attrs({
|
|
481
480
|
'data-garden-id': COMPONENT_ID,
|
|
482
|
-
'data-garden-version': '8.69.
|
|
481
|
+
'data-garden-version': '8.69.7'
|
|
483
482
|
}).withConfig({
|
|
484
483
|
displayName: "StyledGlobalAlertTitle",
|
|
485
484
|
componentId: "sc-10clqbo-0"
|
|
@@ -609,14 +608,19 @@ const useNotificationsContext = () => {
|
|
|
609
608
|
return React.useContext(NotificationsContext);
|
|
610
609
|
};
|
|
611
610
|
|
|
612
|
-
const Alert = React__namespace.default.forwardRef((
|
|
611
|
+
const Alert = React__namespace.default.forwardRef((_ref, ref) => {
|
|
612
|
+
let {
|
|
613
|
+
role,
|
|
614
|
+
...props
|
|
615
|
+
} = _ref;
|
|
613
616
|
const hue = validationHues[props.type];
|
|
614
617
|
const Icon = validationIcons[props.type];
|
|
615
618
|
return React__namespace.default.createElement(NotificationsContext.Provider, {
|
|
616
619
|
value: hue
|
|
617
620
|
}, React__namespace.default.createElement(StyledAlert, _extends$6({
|
|
618
621
|
ref: ref,
|
|
619
|
-
hue: hue
|
|
622
|
+
hue: hue,
|
|
623
|
+
role: role === undefined ? 'alert' : role
|
|
620
624
|
}, props), React__namespace.default.createElement(StyledIcon, {
|
|
621
625
|
hue: hue
|
|
622
626
|
}, React__namespace.default.createElement(Icon, null)), props.children));
|
package/dist/index.esm.js
CHANGED
|
@@ -35,7 +35,7 @@ const TYPE = ['success', 'warning', 'error', 'info'];
|
|
|
35
35
|
const COMPONENT_ID$b = 'notifications.close';
|
|
36
36
|
const StyledClose = styled.button.attrs({
|
|
37
37
|
'data-garden-id': COMPONENT_ID$b,
|
|
38
|
-
'data-garden-version': '8.69.
|
|
38
|
+
'data-garden-version': '8.69.7'
|
|
39
39
|
}).withConfig({
|
|
40
40
|
displayName: "StyledClose",
|
|
41
41
|
componentId: "sc-1mr9nx1-0"
|
|
@@ -50,7 +50,7 @@ StyledClose.defaultProps = {
|
|
|
50
50
|
const COMPONENT_ID$a = 'notifications.paragraph';
|
|
51
51
|
const StyledParagraph = styled.p.attrs({
|
|
52
52
|
'data-garden-id': COMPONENT_ID$a,
|
|
53
|
-
'data-garden-version': '8.69.
|
|
53
|
+
'data-garden-version': '8.69.7'
|
|
54
54
|
}).withConfig({
|
|
55
55
|
displayName: "StyledParagraph",
|
|
56
56
|
componentId: "sc-12tmd6p-0"
|
|
@@ -62,7 +62,7 @@ StyledParagraph.defaultProps = {
|
|
|
62
62
|
const COMPONENT_ID$9 = 'notifications.title';
|
|
63
63
|
const StyledTitle = styled.div.attrs({
|
|
64
64
|
'data-garden-id': COMPONENT_ID$9,
|
|
65
|
-
'data-garden-version': '8.69.
|
|
65
|
+
'data-garden-version': '8.69.7'
|
|
66
66
|
}).withConfig({
|
|
67
67
|
displayName: "StyledTitle",
|
|
68
68
|
componentId: "sc-xx4jsv-0"
|
|
@@ -117,11 +117,10 @@ StyledBase.defaultProps = {
|
|
|
117
117
|
|
|
118
118
|
const COMPONENT_ID$8 = 'notifications.alert';
|
|
119
119
|
const colorStyles$5 = props => css(["", "{color:", ";}"], StyledTitle, props.hue && getColor(props.hue, 800, props.theme));
|
|
120
|
-
const StyledAlert = styled(StyledBase).attrs(
|
|
120
|
+
const StyledAlert = styled(StyledBase).attrs({
|
|
121
121
|
'data-garden-id': COMPONENT_ID$8,
|
|
122
|
-
'data-garden-version': '8.69.
|
|
123
|
-
|
|
124
|
-
})).withConfig({
|
|
122
|
+
'data-garden-version': '8.69.7'
|
|
123
|
+
}).withConfig({
|
|
125
124
|
displayName: "StyledAlert",
|
|
126
125
|
componentId: "sc-fyn8jp-0"
|
|
127
126
|
})(["", " ", ";"], colorStyles$5, props => retrieveComponentStyles(COMPONENT_ID$8, props));
|
|
@@ -166,7 +165,7 @@ const colorStyles$4 = props => {
|
|
|
166
165
|
};
|
|
167
166
|
const StyledNotification = styled(StyledBase).attrs({
|
|
168
167
|
'data-garden-id': COMPONENT_ID$7,
|
|
169
|
-
'data-garden-version': '8.69.
|
|
168
|
+
'data-garden-version': '8.69.7'
|
|
170
169
|
}).withConfig({
|
|
171
170
|
displayName: "StyledNotification",
|
|
172
171
|
componentId: "sc-uf6jh-0"
|
|
@@ -181,7 +180,7 @@ StyledNotification.defaultProps = {
|
|
|
181
180
|
const COMPONENT_ID$6 = 'notifications.well';
|
|
182
181
|
const StyledWell = styled(StyledBase).attrs({
|
|
183
182
|
'data-garden-id': COMPONENT_ID$6,
|
|
184
|
-
'data-garden-version': '8.69.
|
|
183
|
+
'data-garden-version': '8.69.7'
|
|
185
184
|
}).withConfig({
|
|
186
185
|
displayName: "StyledWell",
|
|
187
186
|
componentId: "sc-a5831c-0"
|
|
@@ -268,7 +267,7 @@ const sizeStyles$3 = props => {
|
|
|
268
267
|
};
|
|
269
268
|
const StyledGlobalAlert = styled.div.attrs({
|
|
270
269
|
'data-garden-id': COMPONENT_ID$5,
|
|
271
|
-
'data-garden-version': '8.69.
|
|
270
|
+
'data-garden-version': '8.69.7'
|
|
272
271
|
}).withConfig({
|
|
273
272
|
displayName: "StyledGlobalAlert",
|
|
274
273
|
componentId: "sc-k6rimt-0"
|
|
@@ -328,7 +327,7 @@ const sizeStyles$2 = props => {
|
|
|
328
327
|
};
|
|
329
328
|
const StyledGlobalAlertClose = styled(IconButton).attrs({
|
|
330
329
|
'data-garden-id': COMPONENT_ID$4,
|
|
331
|
-
'data-garden-version': '8.69.
|
|
330
|
+
'data-garden-version': '8.69.7',
|
|
332
331
|
size: 'small'
|
|
333
332
|
}).withConfig({
|
|
334
333
|
displayName: "StyledGlobalAlertClose",
|
|
@@ -383,7 +382,7 @@ function sizeStyles$1(props) {
|
|
|
383
382
|
}
|
|
384
383
|
const StyledGlobalAlertButton = styled(Button).attrs({
|
|
385
384
|
'data-garden-id': COMPONENT_ID$3,
|
|
386
|
-
'data-garden-version': '8.69.
|
|
385
|
+
'data-garden-version': '8.69.7',
|
|
387
386
|
focusInset: false,
|
|
388
387
|
isDanger: false,
|
|
389
388
|
isLink: false,
|
|
@@ -402,7 +401,7 @@ StyledGlobalAlertButton.defaultProps = {
|
|
|
402
401
|
const COMPONENT_ID$2 = 'notifications.global-alert.content';
|
|
403
402
|
const StyledGlobalAlertContent = styled.div.attrs({
|
|
404
403
|
'data-garden-id': COMPONENT_ID$2,
|
|
405
|
-
'data-garden-version': '8.69.
|
|
404
|
+
'data-garden-version': '8.69.7'
|
|
406
405
|
}).withConfig({
|
|
407
406
|
displayName: "StyledGlobalAlertContent",
|
|
408
407
|
componentId: "sc-rept0u-0"
|
|
@@ -426,7 +425,7 @@ const StyledGlobalAlertIcon = styled(_ref => {
|
|
|
426
425
|
return React__default.cloneElement(Children.only(children), props);
|
|
427
426
|
}).attrs({
|
|
428
427
|
'data-garden-id': COMPONENT_ID$1,
|
|
429
|
-
'data-garden-version': '8.69.
|
|
428
|
+
'data-garden-version': '8.69.7'
|
|
430
429
|
}).withConfig({
|
|
431
430
|
displayName: "StyledGlobalAlertIcon",
|
|
432
431
|
componentId: "sc-84ne9k-0"
|
|
@@ -454,7 +453,7 @@ const colorStyles = props => {
|
|
|
454
453
|
};
|
|
455
454
|
const StyledGlobalAlertTitle = styled.div.attrs({
|
|
456
455
|
'data-garden-id': COMPONENT_ID,
|
|
457
|
-
'data-garden-version': '8.69.
|
|
456
|
+
'data-garden-version': '8.69.7'
|
|
458
457
|
}).withConfig({
|
|
459
458
|
displayName: "StyledGlobalAlertTitle",
|
|
460
459
|
componentId: "sc-10clqbo-0"
|
|
@@ -584,14 +583,19 @@ const useNotificationsContext = () => {
|
|
|
584
583
|
return useContext(NotificationsContext);
|
|
585
584
|
};
|
|
586
585
|
|
|
587
|
-
const Alert = React__default.forwardRef((
|
|
586
|
+
const Alert = React__default.forwardRef((_ref, ref) => {
|
|
587
|
+
let {
|
|
588
|
+
role,
|
|
589
|
+
...props
|
|
590
|
+
} = _ref;
|
|
588
591
|
const hue = validationHues[props.type];
|
|
589
592
|
const Icon = validationIcons[props.type];
|
|
590
593
|
return React__default.createElement(NotificationsContext.Provider, {
|
|
591
594
|
value: hue
|
|
592
595
|
}, React__default.createElement(StyledAlert, _extends$6({
|
|
593
596
|
ref: ref,
|
|
594
|
-
hue: hue
|
|
597
|
+
hue: hue,
|
|
598
|
+
role: role === undefined ? 'alert' : role
|
|
595
599
|
}, props), React__default.createElement(StyledIcon, {
|
|
596
600
|
hue: hue
|
|
597
601
|
}, React__default.createElement(Icon, null)), props.children));
|
|
@@ -14,5 +14,4 @@ export interface IStyledAlertProps {
|
|
|
14
14
|
export declare const StyledAlert: import("styled-components").StyledComponent<"div", DefaultTheme, import("./StyledBase").IStyledBaseProps & {
|
|
15
15
|
'data-garden-id': string;
|
|
16
16
|
'data-garden-version': string;
|
|
17
|
-
|
|
18
|
-
} & IStyledAlertProps, "role" | "data-garden-id" | "data-garden-version">;
|
|
17
|
+
} & IStyledAlertProps, "data-garden-id" | "data-garden-version">;
|
|
@@ -29,5 +29,5 @@ export declare const StyledGlobalAlertButton: import("styled-components").Styled
|
|
|
29
29
|
isPill: false;
|
|
30
30
|
isStretched: false;
|
|
31
31
|
size: "small";
|
|
32
|
-
} & IStyledGlobalAlertButtonProps, "
|
|
32
|
+
} & IStyledGlobalAlertButtonProps, "isDanger" | "size" | "isStretched" | "isNeutral" | "isLink" | "isPill" | "focusInset" | "data-garden-id" | "data-garden-version">;
|
|
33
33
|
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zendeskgarden/react-notifications",
|
|
3
|
-
"version": "8.69.
|
|
3
|
+
"version": "8.69.7",
|
|
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": "^8.69.
|
|
24
|
+
"@zendeskgarden/react-buttons": "^8.69.7",
|
|
25
25
|
"polished": "^4.1.1",
|
|
26
26
|
"prop-types": "^15.5.7",
|
|
27
27
|
"react-transition-group": "^4.4.2",
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
37
|
"@types/react-transition-group": "4.4.6",
|
|
38
|
-
"@zendeskgarden/react-theming": "^8.69.
|
|
38
|
+
"@zendeskgarden/react-theming": "^8.69.7",
|
|
39
39
|
"@zendeskgarden/svg-icons": "6.33.0"
|
|
40
40
|
},
|
|
41
41
|
"keywords": [
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"access": "public"
|
|
49
49
|
},
|
|
50
50
|
"zendeskgarden:src": "src/index.ts",
|
|
51
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "edcaadca55ca86ff003c6130c84488345f3043b9"
|
|
52
52
|
}
|