@zendeskgarden/react-notifications 8.46.0 → 8.48.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/index.cjs.js CHANGED
@@ -28,14 +28,12 @@ function _interopNamespace(e) {
28
28
  var d = Object.getOwnPropertyDescriptor(e, k);
29
29
  Object.defineProperty(n, k, d.get ? d : {
30
30
  enumerable: true,
31
- get: function () {
32
- return e[k];
33
- }
31
+ get: function () { return e[k]; }
34
32
  });
35
33
  }
36
34
  });
37
35
  }
38
- n['default'] = e;
36
+ n["default"] = e;
39
37
  return Object.freeze(n);
40
38
  }
41
39
 
@@ -49,14 +47,9 @@ function ownKeys(object, enumerableOnly) {
49
47
 
50
48
  if (Object.getOwnPropertySymbols) {
51
49
  var symbols = Object.getOwnPropertySymbols(object);
52
-
53
- if (enumerableOnly) {
54
- symbols = symbols.filter(function (sym) {
55
- return Object.getOwnPropertyDescriptor(object, sym).enumerable;
56
- });
57
- }
58
-
59
- keys.push.apply(keys, symbols);
50
+ enumerableOnly && (symbols = symbols.filter(function (sym) {
51
+ return Object.getOwnPropertyDescriptor(object, sym).enumerable;
52
+ })), keys.push.apply(keys, symbols);
60
53
  }
61
54
 
62
55
  return keys;
@@ -64,19 +57,12 @@ function ownKeys(object, enumerableOnly) {
64
57
 
65
58
  function _objectSpread2(target) {
66
59
  for (var i = 1; i < arguments.length; i++) {
67
- var source = arguments[i] != null ? arguments[i] : {};
68
-
69
- if (i % 2) {
70
- ownKeys(Object(source), true).forEach(function (key) {
71
- _defineProperty(target, key, source[key]);
72
- });
73
- } else if (Object.getOwnPropertyDescriptors) {
74
- Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
75
- } else {
76
- ownKeys(Object(source)).forEach(function (key) {
77
- Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
78
- });
79
- }
60
+ var source = null != arguments[i] ? arguments[i] : {};
61
+ i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
62
+ _defineProperty(target, key, source[key]);
63
+ }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
64
+ Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
65
+ });
80
66
  }
81
67
 
82
68
  return target;
@@ -227,9 +213,9 @@ function _nonIterableRest() {
227
213
  }
228
214
 
229
215
  var COMPONENT_ID$5 = 'notifications.close';
230
- var StyledClose = styled__default['default'].button.attrs({
216
+ var StyledClose = styled__default["default"].button.attrs({
231
217
  'data-garden-id': COMPONENT_ID$5,
232
- 'data-garden-version': '8.46.0'
218
+ 'data-garden-version': '8.48.0'
233
219
  }).withConfig({
234
220
  displayName: "StyledClose",
235
221
  componentId: "sc-1mr9nx1-0"
@@ -259,9 +245,9 @@ StyledClose.defaultProps = {
259
245
  };
260
246
 
261
247
  var COMPONENT_ID$4 = 'notifications.paragraph';
262
- var StyledParagraph = styled__default['default'].p.attrs({
248
+ var StyledParagraph = styled__default["default"].p.attrs({
263
249
  'data-garden-id': COMPONENT_ID$4,
264
- 'data-garden-version': '8.46.0'
250
+ 'data-garden-version': '8.48.0'
265
251
  }).withConfig({
266
252
  displayName: "StyledParagraph",
267
253
  componentId: "sc-12tmd6p-0"
@@ -275,9 +261,9 @@ StyledParagraph.defaultProps = {
275
261
  };
276
262
 
277
263
  var COMPONENT_ID$3 = 'notifications.title';
278
- var StyledTitle = styled__default['default'].div.attrs({
264
+ var StyledTitle = styled__default["default"].div.attrs({
279
265
  'data-garden-id': COMPONENT_ID$3,
280
- 'data-garden-version': '8.46.0'
266
+ 'data-garden-version': '8.48.0'
281
267
  }).withConfig({
282
268
  displayName: "StyledTitle",
283
269
  componentId: "sc-xx4jsv-0"
@@ -322,7 +308,7 @@ var padding = function padding(props) {
322
308
  var paddingHorizontal = "".concat(space.base * 10, "px");
323
309
  return "".concat(paddingVertical, " ").concat(paddingHorizontal);
324
310
  };
325
- var StyledBase = styled__default['default'].div.withConfig({
311
+ var StyledBase = styled__default["default"].div.withConfig({
326
312
  displayName: "StyledBase",
327
313
  componentId: "sc-14syaqw-0"
328
314
  })(["position:relative;border:", ";border-radius:", ";box-shadow:", ";padding:", ";line-height:", ";font-size:", ";direction:", ";", ";"], function (props) {
@@ -346,10 +332,10 @@ var COMPONENT_ID$2 = 'notifications.alert';
346
332
  var colorStyles$1 = function colorStyles(props) {
347
333
  return styled.css(["", "{color:", ";}"], StyledTitle, props.hue && reactTheming.getColor(props.hue, 800, props.theme));
348
334
  };
349
- var StyledAlert = styled__default['default'](StyledBase).attrs(function (props) {
335
+ var StyledAlert = styled__default["default"](StyledBase).attrs(function (props) {
350
336
  return {
351
337
  'data-garden-id': COMPONENT_ID$2,
352
- 'data-garden-version': '8.46.0',
338
+ 'data-garden-version': '8.48.0',
353
339
  role: props.role === undefined ? 'alert' : props.role
354
340
  };
355
341
  }).withConfig({
@@ -393,10 +379,10 @@ var colorStyles = function colorStyles(props) {
393
379
  }
394
380
  return styled.css(["", "{color:", ";}"], StyledTitle, color);
395
381
  };
396
- var StyledNotification = styled__default['default'](StyledBase).attrs(function (props) {
382
+ var StyledNotification = styled__default["default"](StyledBase).attrs(function (props) {
397
383
  return {
398
384
  'data-garden-id': COMPONENT_ID$1,
399
- 'data-garden-version': '8.46.0',
385
+ 'data-garden-version': '8.48.0',
400
386
  role: props.role === undefined ? 'status' : props.role
401
387
  };
402
388
  }).withConfig({
@@ -406,16 +392,16 @@ var StyledNotification = styled__default['default'](StyledBase).attrs(function (
406
392
  return reactTheming.retrieveComponentStyles(COMPONENT_ID$1, props);
407
393
  });
408
394
  StyledNotification.propTypes = {
409
- type: PropTypes__default['default'].oneOf(ARRAY_VALIDATION_TYPE)
395
+ type: PropTypes__default["default"].oneOf(ARRAY_VALIDATION_TYPE)
410
396
  };
411
397
  StyledNotification.defaultProps = {
412
398
  theme: reactTheming.DEFAULT_THEME
413
399
  };
414
400
 
415
401
  var COMPONENT_ID = 'notifications.well';
416
- var StyledWell = styled__default['default'](StyledBase).attrs({
402
+ var StyledWell = styled__default["default"](StyledBase).attrs({
417
403
  'data-garden-id': COMPONENT_ID,
418
- 'data-garden-version': '8.46.0'
404
+ 'data-garden-version': '8.48.0'
419
405
  }).withConfig({
420
406
  displayName: "StyledWell",
421
407
  componentId: "sc-a5831c-0"
@@ -431,10 +417,10 @@ StyledWell.defaultProps = {
431
417
  };
432
418
 
433
419
  var _excluded$2 = ["children"];
434
- var StyledIcon = styled__default['default'](function (_ref) {
420
+ var StyledIcon = styled__default["default"](function (_ref) {
435
421
  var children = _ref.children,
436
422
  props = _objectWithoutProperties(_ref, _excluded$2);
437
- return React__default['default'].cloneElement(React.Children.only(children), props);
423
+ return React__default["default"].cloneElement(React.Children.only(children), props);
438
424
  }).withConfig({
439
425
  displayName: "StyledIcon",
440
426
  componentId: "sc-msklws-0"
@@ -451,122 +437,116 @@ StyledIcon.defaultProps = {
451
437
  theme: reactTheming.DEFAULT_THEME
452
438
  };
453
439
 
454
- function _extends$4() { _extends$4 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
440
+ var _g$2, _circle$2;
455
441
 
456
- var _ref$4 = /*#__PURE__*/React__namespace.createElement("g", {
457
- fill: "none",
458
- stroke: "currentColor"
459
- }, /*#__PURE__*/React__namespace.createElement("circle", {
460
- cx: 7.5,
461
- cy: 8.5,
462
- r: 7
463
- }), /*#__PURE__*/React__namespace.createElement("path", {
464
- strokeLinecap: "round",
465
- d: "M7.5 4.5V9"
466
- }));
467
-
468
- var _ref2$2 = /*#__PURE__*/React__namespace.createElement("circle", {
469
- cx: 7.5,
470
- cy: 12,
471
- r: 1,
472
- fill: "currentColor"
473
- });
442
+ function _extends$4() { _extends$4 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
474
443
 
475
- function SvgAlertErrorStroke(props) {
444
+ var SvgAlertErrorStroke = function SvgAlertErrorStroke(props) {
476
445
  return /*#__PURE__*/React__namespace.createElement("svg", _extends$4({
477
446
  xmlns: "http://www.w3.org/2000/svg",
478
447
  width: 16,
479
448
  height: 16,
480
- viewBox: "0 0 16 16",
481
449
  focusable: "false",
482
- role: "presentation"
483
- }, props), _ref$4, _ref2$2);
484
- }
450
+ viewBox: "0 0 16 16",
451
+ "aria-hidden": "true"
452
+ }, props), _g$2 || (_g$2 = /*#__PURE__*/React__namespace.createElement("g", {
453
+ fill: "none",
454
+ stroke: "currentColor"
455
+ }, /*#__PURE__*/React__namespace.createElement("circle", {
456
+ cx: 7.5,
457
+ cy: 8.5,
458
+ r: 7
459
+ }), /*#__PURE__*/React__namespace.createElement("path", {
460
+ strokeLinecap: "round",
461
+ d: "M7.5 4.5V9"
462
+ }))), _circle$2 || (_circle$2 = /*#__PURE__*/React__namespace.createElement("circle", {
463
+ cx: 7.5,
464
+ cy: 12,
465
+ r: 1,
466
+ fill: "currentColor"
467
+ })));
468
+ };
469
+
470
+ var _g$1;
485
471
 
486
472
  function _extends$3() { _extends$3 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); }
487
473
 
488
- var _ref$3 = /*#__PURE__*/React__namespace.createElement("g", {
489
- fill: "none",
490
- stroke: "currentColor"
491
- }, /*#__PURE__*/React__namespace.createElement("path", {
492
- strokeLinecap: "round",
493
- strokeLinejoin: "round",
494
- d: "M4 9l2.5 2.5 5-5"
495
- }), /*#__PURE__*/React__namespace.createElement("circle", {
496
- cx: 7.5,
497
- cy: 8.5,
498
- r: 7
499
- }));
500
-
501
- function SvgCheckCircleStroke(props) {
474
+ var SvgCheckCircleStroke = function SvgCheckCircleStroke(props) {
502
475
  return /*#__PURE__*/React__namespace.createElement("svg", _extends$3({
503
476
  xmlns: "http://www.w3.org/2000/svg",
504
477
  width: 16,
505
478
  height: 16,
506
- viewBox: "0 0 16 16",
507
479
  focusable: "false",
508
- role: "presentation"
509
- }, props), _ref$3);
510
- }
480
+ viewBox: "0 0 16 16",
481
+ "aria-hidden": "true"
482
+ }, props), _g$1 || (_g$1 = /*#__PURE__*/React__namespace.createElement("g", {
483
+ fill: "none",
484
+ stroke: "currentColor"
485
+ }, /*#__PURE__*/React__namespace.createElement("path", {
486
+ strokeLinecap: "round",
487
+ strokeLinejoin: "round",
488
+ d: "M4 9l2.5 2.5 5-5"
489
+ }), /*#__PURE__*/React__namespace.createElement("circle", {
490
+ cx: 7.5,
491
+ cy: 8.5,
492
+ r: 7
493
+ }))));
494
+ };
495
+
496
+ var _path$1, _circle$1;
511
497
 
512
498
  function _extends$2() { _extends$2 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
513
499
 
514
- var _ref$2 = /*#__PURE__*/React__namespace.createElement("path", {
515
- fill: "none",
516
- stroke: "currentColor",
517
- strokeLinecap: "round",
518
- d: "M.88 13.77L7.06 1.86c.19-.36.7-.36.89 0l6.18 11.91c.17.33-.07.73-.44.73H1.32c-.37 0-.61-.4-.44-.73zM7.5 6v3.5"
519
- });
520
-
521
- var _ref2$1 = /*#__PURE__*/React__namespace.createElement("circle", {
522
- cx: 7.5,
523
- cy: 12,
524
- r: 1,
525
- fill: "currentColor"
526
- });
527
-
528
- function SvgAlertWarningStroke(props) {
500
+ var SvgAlertWarningStroke = function SvgAlertWarningStroke(props) {
529
501
  return /*#__PURE__*/React__namespace.createElement("svg", _extends$2({
530
502
  xmlns: "http://www.w3.org/2000/svg",
531
503
  width: 16,
532
504
  height: 16,
533
- viewBox: "0 0 16 16",
534
505
  focusable: "false",
535
- role: "presentation"
536
- }, props), _ref$2, _ref2$1);
537
- }
506
+ viewBox: "0 0 16 16",
507
+ "aria-hidden": "true"
508
+ }, props), _path$1 || (_path$1 = /*#__PURE__*/React__namespace.createElement("path", {
509
+ fill: "none",
510
+ stroke: "currentColor",
511
+ strokeLinecap: "round",
512
+ d: "M.88 13.77L7.06 1.86c.19-.36.7-.36.89 0l6.18 11.91c.17.33-.07.73-.44.73H1.32c-.37 0-.61-.4-.44-.73zM7.5 6v3.5"
513
+ })), _circle$1 || (_circle$1 = /*#__PURE__*/React__namespace.createElement("circle", {
514
+ cx: 7.5,
515
+ cy: 12,
516
+ r: 1,
517
+ fill: "currentColor"
518
+ })));
519
+ };
520
+
521
+ var _g, _circle;
538
522
 
539
523
  function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
540
524
 
541
- var _ref$1 = /*#__PURE__*/React__namespace.createElement("g", {
542
- stroke: "currentColor"
543
- }, /*#__PURE__*/React__namespace.createElement("circle", {
544
- cx: 7.5,
545
- cy: 8.5,
546
- r: 7,
547
- fill: "none"
548
- }), /*#__PURE__*/React__namespace.createElement("path", {
549
- strokeLinecap: "round",
550
- d: "M7.5 12.5V8"
551
- }));
552
-
553
- var _ref2 = /*#__PURE__*/React__namespace.createElement("circle", {
554
- cx: 7.5,
555
- cy: 5,
556
- r: 1,
557
- fill: "currentColor"
558
- });
559
-
560
- function SvgInfoStroke(props) {
525
+ var SvgInfoStroke = function SvgInfoStroke(props) {
561
526
  return /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
562
527
  xmlns: "http://www.w3.org/2000/svg",
563
528
  width: 16,
564
529
  height: 16,
565
- viewBox: "0 0 16 16",
566
530
  focusable: "false",
567
- role: "presentation"
568
- }, props), _ref$1, _ref2);
569
- }
531
+ viewBox: "0 0 16 16",
532
+ "aria-hidden": "true"
533
+ }, props), _g || (_g = /*#__PURE__*/React__namespace.createElement("g", {
534
+ stroke: "currentColor"
535
+ }, /*#__PURE__*/React__namespace.createElement("circle", {
536
+ cx: 7.5,
537
+ cy: 8.5,
538
+ r: 7,
539
+ fill: "none"
540
+ }), /*#__PURE__*/React__namespace.createElement("path", {
541
+ strokeLinecap: "round",
542
+ d: "M7.5 12.5V8"
543
+ }))), _circle || (_circle = /*#__PURE__*/React__namespace.createElement("circle", {
544
+ cx: 7.5,
545
+ cy: 5,
546
+ r: 1,
547
+ fill: "currentColor"
548
+ })));
549
+ };
570
550
 
571
551
  var validationIcons = {
572
552
  success: SvgCheckCircleStroke,
@@ -586,87 +566,87 @@ var useNotificationsContext = function useNotificationsContext() {
586
566
  return React.useContext(NotificationsContext);
587
567
  };
588
568
 
589
- var Alert = React__default['default'].forwardRef(function (props, ref) {
569
+ var Alert = React__default["default"].forwardRef(function (props, ref) {
590
570
  var hue = validationHues[props.type];
591
571
  var Icon = validationIcons[props.type];
592
- return React__default['default'].createElement(NotificationsContext.Provider, {
572
+ return React__default["default"].createElement(NotificationsContext.Provider, {
593
573
  value: hue
594
- }, React__default['default'].createElement(StyledAlert, _extends$5({
574
+ }, React__default["default"].createElement(StyledAlert, _extends$5({
595
575
  ref: ref,
596
576
  hue: hue
597
- }, props), React__default['default'].createElement(StyledIcon, {
577
+ }, props), React__default["default"].createElement(StyledIcon, {
598
578
  hue: hue
599
- }, React__default['default'].createElement(Icon, null)), props.children));
579
+ }, React__default["default"].createElement(Icon, null)), props.children));
600
580
  });
601
581
  Alert.displayName = 'Alert';
602
582
  Alert.propTypes = {
603
- type: PropTypes__default['default'].oneOf(ARRAY_VALIDATION_TYPE).isRequired
583
+ type: PropTypes__default["default"].oneOf(ARRAY_VALIDATION_TYPE).isRequired
604
584
  };
605
585
 
606
- var Notification = React__default['default'].forwardRef(function (props, ref) {
586
+ var Notification = React__default["default"].forwardRef(function (props, ref) {
607
587
  var Icon = props.type ? validationIcons[props.type] : SvgInfoStroke;
608
588
  var hue = props.type && validationHues[props.type];
609
- return React__default['default'].createElement(StyledNotification, _extends$5({
589
+ return React__default["default"].createElement(StyledNotification, _extends$5({
610
590
  ref: ref,
611
591
  type: props.type,
612
592
  isFloating: true
613
- }, props), props.type && React__default['default'].createElement(StyledIcon, {
593
+ }, props), props.type && React__default["default"].createElement(StyledIcon, {
614
594
  hue: hue
615
- }, React__default['default'].createElement(Icon, null)), props.children);
595
+ }, React__default["default"].createElement(Icon, null)), props.children);
616
596
  });
617
597
  Notification.displayName = 'Notification';
618
598
  Notification.propTypes = {
619
- type: PropTypes__default['default'].oneOf(ARRAY_VALIDATION_TYPE)
599
+ type: PropTypes__default["default"].oneOf(ARRAY_VALIDATION_TYPE)
620
600
  };
621
601
 
622
- var Well = React__default['default'].forwardRef(function (props, ref) {
623
- return React__default['default'].createElement(StyledWell, _extends$5({
602
+ var Well = React__default["default"].forwardRef(function (props, ref) {
603
+ return React__default["default"].createElement(StyledWell, _extends$5({
624
604
  ref: ref
625
605
  }, props));
626
606
  });
627
607
  Well.displayName = 'Well';
628
608
  Well.propTypes = {
629
- isRecessed: PropTypes__default['default'].bool,
630
- isFloating: PropTypes__default['default'].bool
609
+ isRecessed: PropTypes__default["default"].bool,
610
+ isFloating: PropTypes__default["default"].bool
631
611
  };
632
612
 
633
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
613
+ var _path;
634
614
 
635
- var _ref = /*#__PURE__*/React__namespace.createElement("path", {
636
- stroke: "currentColor",
637
- strokeLinecap: "round",
638
- d: "M3 9l6-6m0 6L3 3"
639
- });
615
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
640
616
 
641
- function SvgXStroke(props) {
617
+ var SvgXStroke = function SvgXStroke(props) {
642
618
  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
643
619
  xmlns: "http://www.w3.org/2000/svg",
644
620
  width: 12,
645
621
  height: 12,
646
- viewBox: "0 0 12 12",
647
622
  focusable: "false",
648
- role: "presentation"
649
- }, props), _ref);
650
- }
623
+ viewBox: "0 0 12 12",
624
+ "aria-hidden": "true"
625
+ }, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
626
+ stroke: "currentColor",
627
+ strokeLinecap: "round",
628
+ d: "M3 9l6-6m0 6L3 3"
629
+ })));
630
+ };
651
631
 
652
- var Close = React__default['default'].forwardRef(function (props, ref) {
632
+ var Close = React__default["default"].forwardRef(function (props, ref) {
653
633
  var hue = useNotificationsContext();
654
- return React__default['default'].createElement(StyledClose, _extends$5({
634
+ return React__default["default"].createElement(StyledClose, _extends$5({
655
635
  ref: ref,
656
636
  hue: hue
657
- }, props), React__default['default'].createElement(SvgXStroke, null));
637
+ }, props), React__default["default"].createElement(SvgXStroke, null));
658
638
  });
659
639
  Close.displayName = 'Close';
660
640
 
661
- var Paragraph = React__default['default'].forwardRef(function (props, ref) {
662
- return React__default['default'].createElement(StyledParagraph, _extends$5({
641
+ var Paragraph = React__default["default"].forwardRef(function (props, ref) {
642
+ return React__default["default"].createElement(StyledParagraph, _extends$5({
663
643
  ref: ref
664
644
  }, props));
665
645
  });
666
646
  Paragraph.displayName = 'Paragraph';
667
647
 
668
- var Title = React__default['default'].forwardRef(function (props, ref) {
669
- return React__default['default'].createElement(StyledTitle, _extends$5({
648
+ var Title = React__default["default"].forwardRef(function (props, ref) {
649
+ return React__default["default"].createElement(StyledTitle, _extends$5({
670
650
  ref: ref
671
651
  }, props));
672
652
  });
@@ -726,6 +706,8 @@ var toasterReducer = function toasterReducer(state, action) {
726
706
  }
727
707
  };
728
708
 
709
+ var ToastContext = React.createContext(undefined);
710
+
729
711
  var DEFAULT_TOAST_OPTIONS = {
730
712
  autoDismiss: 5000,
731
713
  placement: 'top-end'
@@ -830,7 +812,7 @@ var Toast = function Toast(_ref) {
830
812
 
831
813
  var TRANSITION_CLASS = 'garden-toast-transition';
832
814
  var DEFAULT_DURATION = '400ms';
833
- var StyledFadeInTransition = styled__default['default'].div.withConfig({
815
+ var StyledFadeInTransition = styled__default["default"].div.withConfig({
834
816
  displayName: "styled__StyledFadeInTransition",
835
817
  componentId: "sc-nq0usb-0"
836
818
  })(["transition:opacity ", " ease-in 300ms;opacity:", ";margin-bottom:", "px;", " &.", "-enter{transform:translateY( ", " );opacity:0;max-height:0;}&.", "-enter-active{transform:translateY(0);transition:opacity ", " ease-in,transform ", " cubic-bezier(0.15,0.85,0.35,1.2),max-height ", ";opacity:1;max-height:500px;}&.", "-exit{opacity:1;max-height:500px;}&.", "-exit-active{transition:opacity 550ms ease-out,max-height ", " linear 150ms;opacity:0;max-height:0;}"], DEFAULT_DURATION, function (p) {
@@ -886,7 +868,7 @@ var placementStyles = function placementStyles(props) {
886
868
  return '';
887
869
  }
888
870
  };
889
- var StyledTransitionGroup = styled__default['default'](reactTransitionGroup.TransitionGroup).withConfig({
871
+ var StyledTransitionGroup = styled__default["default"](reactTransitionGroup.TransitionGroup).withConfig({
890
872
  displayName: "styled__StyledTransitionGroup",
891
873
  componentId: "sc-nq0usb-1"
892
874
  })(["position:fixed;z-index:", ";", ";"], function (props) {
@@ -938,15 +920,15 @@ var ToastSlot = function ToastSlot(_ref) {
938
920
  }
939
921
  return index >= limit;
940
922
  }, [limit, placement, toasts.length]);
941
- return React__default['default'].createElement(StyledTransitionGroup, _extends$5({
923
+ return React__default["default"].createElement(StyledTransitionGroup, _extends$5({
942
924
  key: placement,
943
925
  $placement: placement,
944
926
  $zIndex: zIndex,
945
927
  onMouseEnter: handleMouseEnter,
946
928
  onMouseLeave: handleMouseLeave
947
929
  }, props), toasts.map(function (toast, index) {
948
- var transitionRef = React__default['default'].createRef();
949
- return React__default['default'].createElement(reactTransitionGroup.CSSTransition, {
930
+ var transitionRef = React__default["default"].createRef();
931
+ return React__default["default"].createElement(reactTransitionGroup.CSSTransition, {
950
932
  key: toast.id,
951
933
  timeout: {
952
934
  enter: 400,
@@ -955,18 +937,17 @@ var ToastSlot = function ToastSlot(_ref) {
955
937
  unmountOnExit: true,
956
938
  classNames: TRANSITION_CLASS,
957
939
  nodeRef: transitionRef
958
- }, React__default['default'].createElement(StyledFadeInTransition, {
940
+ }, React__default["default"].createElement(StyledFadeInTransition, {
959
941
  ref: transitionRef,
960
942
  placement: placement,
961
943
  isHidden: isHidden(index)
962
- }, React__default['default'].createElement(Toast, {
944
+ }, React__default["default"].createElement(Toast, {
963
945
  toast: toast,
964
946
  pauseTimers: pauseTimers || isHidden(index)
965
947
  })));
966
948
  }));
967
949
  };
968
950
 
969
- var ToastContext = React.createContext(undefined);
970
951
  var ToastProvider = function ToastProvider(_ref) {
971
952
  var limit = _ref.limit,
972
953
  zIndex = _ref.zIndex,
@@ -990,14 +971,14 @@ var ToastProvider = function ToastProvider(_ref) {
990
971
  if (placement === 'bottom' || placement === 'bottom-start' || placement === 'bottom-end') {
991
972
  matchingToasts = matchingToasts.reverse();
992
973
  }
993
- return React__default['default'].createElement(ToastSlot, _extends$5({
974
+ return React__default["default"].createElement(ToastSlot, _extends$5({
994
975
  placement: placement,
995
976
  toasts: matchingToasts,
996
977
  zIndex: zIndex,
997
978
  limit: limit
998
979
  }, placementProps[placement]));
999
980
  }, [limit, state.toasts, zIndex, placementProps]);
1000
- return React__default['default'].createElement(ToastContext.Provider, {
981
+ return React__default["default"].createElement(ToastContext.Provider, {
1001
982
  value: contextValue
1002
983
  }, toastsByPlacement('top-start'), toastsByPlacement('top'), toastsByPlacement('top-end'), children, toastsByPlacement('bottom-start'), toastsByPlacement('bottom'), toastsByPlacement('bottom-end'));
1003
984
  };
@@ -1006,8 +987,9 @@ ToastProvider.defaultProps = {
1006
987
  limit: 4
1007
988
  };
1008
989
  ToastProvider.propTypes = {
1009
- limit: PropTypes__default['default'].number,
1010
- zIndex: PropTypes__default['default'].number
990
+ limit: PropTypes__default["default"].number,
991
+ zIndex: PropTypes__default["default"].number,
992
+ placementProps: PropTypes__default["default"].object
1011
993
  };
1012
994
 
1013
995
  exports.Alert = Alert;
package/dist/index.esm.js CHANGED
@@ -19,14 +19,9 @@ function ownKeys(object, enumerableOnly) {
19
19
 
20
20
  if (Object.getOwnPropertySymbols) {
21
21
  var symbols = Object.getOwnPropertySymbols(object);
22
-
23
- if (enumerableOnly) {
24
- symbols = symbols.filter(function (sym) {
25
- return Object.getOwnPropertyDescriptor(object, sym).enumerable;
26
- });
27
- }
28
-
29
- keys.push.apply(keys, symbols);
22
+ enumerableOnly && (symbols = symbols.filter(function (sym) {
23
+ return Object.getOwnPropertyDescriptor(object, sym).enumerable;
24
+ })), keys.push.apply(keys, symbols);
30
25
  }
31
26
 
32
27
  return keys;
@@ -34,19 +29,12 @@ function ownKeys(object, enumerableOnly) {
34
29
 
35
30
  function _objectSpread2(target) {
36
31
  for (var i = 1; i < arguments.length; i++) {
37
- var source = arguments[i] != null ? arguments[i] : {};
38
-
39
- if (i % 2) {
40
- ownKeys(Object(source), true).forEach(function (key) {
41
- _defineProperty(target, key, source[key]);
42
- });
43
- } else if (Object.getOwnPropertyDescriptors) {
44
- Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
45
- } else {
46
- ownKeys(Object(source)).forEach(function (key) {
47
- Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
48
- });
49
- }
32
+ var source = null != arguments[i] ? arguments[i] : {};
33
+ i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
34
+ _defineProperty(target, key, source[key]);
35
+ }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
36
+ Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
37
+ });
50
38
  }
51
39
 
52
40
  return target;
@@ -199,7 +187,7 @@ function _nonIterableRest() {
199
187
  var COMPONENT_ID$5 = 'notifications.close';
200
188
  var StyledClose = styled.button.attrs({
201
189
  'data-garden-id': COMPONENT_ID$5,
202
- 'data-garden-version': '8.46.0'
190
+ 'data-garden-version': '8.48.0'
203
191
  }).withConfig({
204
192
  displayName: "StyledClose",
205
193
  componentId: "sc-1mr9nx1-0"
@@ -231,7 +219,7 @@ StyledClose.defaultProps = {
231
219
  var COMPONENT_ID$4 = 'notifications.paragraph';
232
220
  var StyledParagraph = styled.p.attrs({
233
221
  'data-garden-id': COMPONENT_ID$4,
234
- 'data-garden-version': '8.46.0'
222
+ 'data-garden-version': '8.48.0'
235
223
  }).withConfig({
236
224
  displayName: "StyledParagraph",
237
225
  componentId: "sc-12tmd6p-0"
@@ -247,7 +235,7 @@ StyledParagraph.defaultProps = {
247
235
  var COMPONENT_ID$3 = 'notifications.title';
248
236
  var StyledTitle = styled.div.attrs({
249
237
  'data-garden-id': COMPONENT_ID$3,
250
- 'data-garden-version': '8.46.0'
238
+ 'data-garden-version': '8.48.0'
251
239
  }).withConfig({
252
240
  displayName: "StyledTitle",
253
241
  componentId: "sc-xx4jsv-0"
@@ -319,7 +307,7 @@ var colorStyles$1 = function colorStyles(props) {
319
307
  var StyledAlert = styled(StyledBase).attrs(function (props) {
320
308
  return {
321
309
  'data-garden-id': COMPONENT_ID$2,
322
- 'data-garden-version': '8.46.0',
310
+ 'data-garden-version': '8.48.0',
323
311
  role: props.role === undefined ? 'alert' : props.role
324
312
  };
325
313
  }).withConfig({
@@ -366,7 +354,7 @@ var colorStyles = function colorStyles(props) {
366
354
  var StyledNotification = styled(StyledBase).attrs(function (props) {
367
355
  return {
368
356
  'data-garden-id': COMPONENT_ID$1,
369
- 'data-garden-version': '8.46.0',
357
+ 'data-garden-version': '8.48.0',
370
358
  role: props.role === undefined ? 'status' : props.role
371
359
  };
372
360
  }).withConfig({
@@ -385,7 +373,7 @@ StyledNotification.defaultProps = {
385
373
  var COMPONENT_ID = 'notifications.well';
386
374
  var StyledWell = styled(StyledBase).attrs({
387
375
  'data-garden-id': COMPONENT_ID,
388
- 'data-garden-version': '8.46.0'
376
+ 'data-garden-version': '8.48.0'
389
377
  }).withConfig({
390
378
  displayName: "StyledWell",
391
379
  componentId: "sc-a5831c-0"
@@ -421,122 +409,116 @@ StyledIcon.defaultProps = {
421
409
  theme: DEFAULT_THEME
422
410
  };
423
411
 
424
- function _extends$4() { _extends$4 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
412
+ var _g$2, _circle$2;
425
413
 
426
- var _ref$4 = /*#__PURE__*/React.createElement("g", {
427
- fill: "none",
428
- stroke: "currentColor"
429
- }, /*#__PURE__*/React.createElement("circle", {
430
- cx: 7.5,
431
- cy: 8.5,
432
- r: 7
433
- }), /*#__PURE__*/React.createElement("path", {
434
- strokeLinecap: "round",
435
- d: "M7.5 4.5V9"
436
- }));
437
-
438
- var _ref2$2 = /*#__PURE__*/React.createElement("circle", {
439
- cx: 7.5,
440
- cy: 12,
441
- r: 1,
442
- fill: "currentColor"
443
- });
414
+ function _extends$4() { _extends$4 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
444
415
 
445
- function SvgAlertErrorStroke(props) {
416
+ var SvgAlertErrorStroke = function SvgAlertErrorStroke(props) {
446
417
  return /*#__PURE__*/React.createElement("svg", _extends$4({
447
418
  xmlns: "http://www.w3.org/2000/svg",
448
419
  width: 16,
449
420
  height: 16,
450
- viewBox: "0 0 16 16",
451
421
  focusable: "false",
452
- role: "presentation"
453
- }, props), _ref$4, _ref2$2);
454
- }
422
+ viewBox: "0 0 16 16",
423
+ "aria-hidden": "true"
424
+ }, props), _g$2 || (_g$2 = /*#__PURE__*/React.createElement("g", {
425
+ fill: "none",
426
+ stroke: "currentColor"
427
+ }, /*#__PURE__*/React.createElement("circle", {
428
+ cx: 7.5,
429
+ cy: 8.5,
430
+ r: 7
431
+ }), /*#__PURE__*/React.createElement("path", {
432
+ strokeLinecap: "round",
433
+ d: "M7.5 4.5V9"
434
+ }))), _circle$2 || (_circle$2 = /*#__PURE__*/React.createElement("circle", {
435
+ cx: 7.5,
436
+ cy: 12,
437
+ r: 1,
438
+ fill: "currentColor"
439
+ })));
440
+ };
441
+
442
+ var _g$1;
455
443
 
456
444
  function _extends$3() { _extends$3 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); }
457
445
 
458
- var _ref$3 = /*#__PURE__*/React.createElement("g", {
459
- fill: "none",
460
- stroke: "currentColor"
461
- }, /*#__PURE__*/React.createElement("path", {
462
- strokeLinecap: "round",
463
- strokeLinejoin: "round",
464
- d: "M4 9l2.5 2.5 5-5"
465
- }), /*#__PURE__*/React.createElement("circle", {
466
- cx: 7.5,
467
- cy: 8.5,
468
- r: 7
469
- }));
470
-
471
- function SvgCheckCircleStroke(props) {
446
+ var SvgCheckCircleStroke = function SvgCheckCircleStroke(props) {
472
447
  return /*#__PURE__*/React.createElement("svg", _extends$3({
473
448
  xmlns: "http://www.w3.org/2000/svg",
474
449
  width: 16,
475
450
  height: 16,
476
- viewBox: "0 0 16 16",
477
451
  focusable: "false",
478
- role: "presentation"
479
- }, props), _ref$3);
480
- }
452
+ viewBox: "0 0 16 16",
453
+ "aria-hidden": "true"
454
+ }, props), _g$1 || (_g$1 = /*#__PURE__*/React.createElement("g", {
455
+ fill: "none",
456
+ stroke: "currentColor"
457
+ }, /*#__PURE__*/React.createElement("path", {
458
+ strokeLinecap: "round",
459
+ strokeLinejoin: "round",
460
+ d: "M4 9l2.5 2.5 5-5"
461
+ }), /*#__PURE__*/React.createElement("circle", {
462
+ cx: 7.5,
463
+ cy: 8.5,
464
+ r: 7
465
+ }))));
466
+ };
467
+
468
+ var _path$1, _circle$1;
481
469
 
482
470
  function _extends$2() { _extends$2 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
483
471
 
484
- var _ref$2 = /*#__PURE__*/React.createElement("path", {
485
- fill: "none",
486
- stroke: "currentColor",
487
- strokeLinecap: "round",
488
- d: "M.88 13.77L7.06 1.86c.19-.36.7-.36.89 0l6.18 11.91c.17.33-.07.73-.44.73H1.32c-.37 0-.61-.4-.44-.73zM7.5 6v3.5"
489
- });
490
-
491
- var _ref2$1 = /*#__PURE__*/React.createElement("circle", {
492
- cx: 7.5,
493
- cy: 12,
494
- r: 1,
495
- fill: "currentColor"
496
- });
497
-
498
- function SvgAlertWarningStroke(props) {
472
+ var SvgAlertWarningStroke = function SvgAlertWarningStroke(props) {
499
473
  return /*#__PURE__*/React.createElement("svg", _extends$2({
500
474
  xmlns: "http://www.w3.org/2000/svg",
501
475
  width: 16,
502
476
  height: 16,
503
- viewBox: "0 0 16 16",
504
477
  focusable: "false",
505
- role: "presentation"
506
- }, props), _ref$2, _ref2$1);
507
- }
478
+ viewBox: "0 0 16 16",
479
+ "aria-hidden": "true"
480
+ }, props), _path$1 || (_path$1 = /*#__PURE__*/React.createElement("path", {
481
+ fill: "none",
482
+ stroke: "currentColor",
483
+ strokeLinecap: "round",
484
+ d: "M.88 13.77L7.06 1.86c.19-.36.7-.36.89 0l6.18 11.91c.17.33-.07.73-.44.73H1.32c-.37 0-.61-.4-.44-.73zM7.5 6v3.5"
485
+ })), _circle$1 || (_circle$1 = /*#__PURE__*/React.createElement("circle", {
486
+ cx: 7.5,
487
+ cy: 12,
488
+ r: 1,
489
+ fill: "currentColor"
490
+ })));
491
+ };
492
+
493
+ var _g, _circle;
508
494
 
509
495
  function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
510
496
 
511
- var _ref$1 = /*#__PURE__*/React.createElement("g", {
512
- stroke: "currentColor"
513
- }, /*#__PURE__*/React.createElement("circle", {
514
- cx: 7.5,
515
- cy: 8.5,
516
- r: 7,
517
- fill: "none"
518
- }), /*#__PURE__*/React.createElement("path", {
519
- strokeLinecap: "round",
520
- d: "M7.5 12.5V8"
521
- }));
522
-
523
- var _ref2 = /*#__PURE__*/React.createElement("circle", {
524
- cx: 7.5,
525
- cy: 5,
526
- r: 1,
527
- fill: "currentColor"
528
- });
529
-
530
- function SvgInfoStroke(props) {
497
+ var SvgInfoStroke = function SvgInfoStroke(props) {
531
498
  return /*#__PURE__*/React.createElement("svg", _extends$1({
532
499
  xmlns: "http://www.w3.org/2000/svg",
533
500
  width: 16,
534
501
  height: 16,
535
- viewBox: "0 0 16 16",
536
502
  focusable: "false",
537
- role: "presentation"
538
- }, props), _ref$1, _ref2);
539
- }
503
+ viewBox: "0 0 16 16",
504
+ "aria-hidden": "true"
505
+ }, props), _g || (_g = /*#__PURE__*/React.createElement("g", {
506
+ stroke: "currentColor"
507
+ }, /*#__PURE__*/React.createElement("circle", {
508
+ cx: 7.5,
509
+ cy: 8.5,
510
+ r: 7,
511
+ fill: "none"
512
+ }), /*#__PURE__*/React.createElement("path", {
513
+ strokeLinecap: "round",
514
+ d: "M7.5 12.5V8"
515
+ }))), _circle || (_circle = /*#__PURE__*/React.createElement("circle", {
516
+ cx: 7.5,
517
+ cy: 5,
518
+ r: 1,
519
+ fill: "currentColor"
520
+ })));
521
+ };
540
522
 
541
523
  var validationIcons = {
542
524
  success: SvgCheckCircleStroke,
@@ -600,24 +582,24 @@ Well.propTypes = {
600
582
  isFloating: PropTypes.bool
601
583
  };
602
584
 
603
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
585
+ var _path;
604
586
 
605
- var _ref = /*#__PURE__*/React.createElement("path", {
606
- stroke: "currentColor",
607
- strokeLinecap: "round",
608
- d: "M3 9l6-6m0 6L3 3"
609
- });
587
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
610
588
 
611
- function SvgXStroke(props) {
589
+ var SvgXStroke = function SvgXStroke(props) {
612
590
  return /*#__PURE__*/React.createElement("svg", _extends({
613
591
  xmlns: "http://www.w3.org/2000/svg",
614
592
  width: 12,
615
593
  height: 12,
616
- viewBox: "0 0 12 12",
617
594
  focusable: "false",
618
- role: "presentation"
619
- }, props), _ref);
620
- }
595
+ viewBox: "0 0 12 12",
596
+ "aria-hidden": "true"
597
+ }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
598
+ stroke: "currentColor",
599
+ strokeLinecap: "round",
600
+ d: "M3 9l6-6m0 6L3 3"
601
+ })));
602
+ };
621
603
 
622
604
  var Close = React__default.forwardRef(function (props, ref) {
623
605
  var hue = useNotificationsContext();
@@ -696,6 +678,8 @@ var toasterReducer = function toasterReducer(state, action) {
696
678
  }
697
679
  };
698
680
 
681
+ var ToastContext = createContext(undefined);
682
+
699
683
  var DEFAULT_TOAST_OPTIONS = {
700
684
  autoDismiss: 5000,
701
685
  placement: 'top-end'
@@ -936,7 +920,6 @@ var ToastSlot = function ToastSlot(_ref) {
936
920
  }));
937
921
  };
938
922
 
939
- var ToastContext = createContext(undefined);
940
923
  var ToastProvider = function ToastProvider(_ref) {
941
924
  var limit = _ref.limit,
942
925
  zIndex = _ref.zIndex,
@@ -977,7 +960,8 @@ ToastProvider.defaultProps = {
977
960
  };
978
961
  ToastProvider.propTypes = {
979
962
  limit: PropTypes.number,
980
- zIndex: PropTypes.number
963
+ zIndex: PropTypes.number,
964
+ placementProps: PropTypes.object
981
965
  };
982
966
 
983
967
  export { Alert, Close, Notification, Paragraph, Title, ToastProvider, Well, useToast };
@@ -4,12 +4,12 @@
4
4
  * Use of this source code is governed under the Apache License, Version 2.0
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
- import React from 'react';
8
- export interface IAlertProps {
7
+ import React, { HTMLAttributes } from 'react';
8
+ export interface IAlertProps extends HTMLAttributes<HTMLDivElement> {
9
9
  /** Applies alert type styles */
10
10
  type: 'success' | 'warning' | 'error' | 'info';
11
11
  }
12
12
  /**
13
13
  * @extends HTMLAttributes<HTMLDivElement>
14
14
  */
15
- export declare const Alert: React.ForwardRefExoticComponent<IAlertProps & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
15
+ export declare const Alert: React.ForwardRefExoticComponent<IAlertProps & React.RefAttributes<HTMLDivElement>>;
@@ -4,9 +4,13 @@
4
4
  * Use of this source code is governed under the Apache License, Version 2.0
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
- import React from 'react';
8
- import { IStyledNotificationProps } from '../styled';
7
+ import React, { HTMLAttributes } from 'react';
8
+ import { VALIDATION_TYPE } from '../utils/types';
9
+ export interface INotificationProps extends HTMLAttributes<HTMLDivElement> {
10
+ /** Applies notification type styles */
11
+ type?: VALIDATION_TYPE;
12
+ }
9
13
  /**
10
14
  * @extends HTMLAttributes<HTMLDivElement>
11
15
  */
12
- export declare const Notification: React.ForwardRefExoticComponent<IStyledNotificationProps & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
16
+ export declare const Notification: React.ForwardRefExoticComponent<INotificationProps & React.RefAttributes<HTMLDivElement>>;
@@ -4,8 +4,8 @@
4
4
  * Use of this source code is governed under the Apache License, Version 2.0
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
- import React from 'react';
8
- interface IWellProps {
7
+ import React, { HTMLAttributes } from 'react';
8
+ export interface IWellProps extends HTMLAttributes<HTMLDivElement> {
9
9
  /** Applies a background color */
10
10
  isRecessed?: boolean;
11
11
  /** Applies a drop shadow */
@@ -14,5 +14,4 @@ interface IWellProps {
14
14
  /**
15
15
  * @extends HTMLAttributes<HTMLDivElement>
16
16
  */
17
- export declare const Well: React.ForwardRefExoticComponent<IWellProps & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
18
- export {};
17
+ export declare const Well: React.ForwardRefExoticComponent<IWellProps & React.RefAttributes<HTMLDivElement>>;
@@ -4,11 +4,10 @@
4
4
  * Use of this source code is governed under the Apache License, Version 2.0
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
- import React from 'react';
8
7
  import { IToast } from './reducer';
9
8
  interface IToastProps {
10
9
  toast: IToast;
11
10
  pauseTimers: boolean;
12
11
  }
13
- export declare const Toast: React.FC<IToastProps>;
12
+ export declare const Toast: ({ toast, pauseTimers }: IToastProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
14
13
  export {};
@@ -0,0 +1,14 @@
1
+ /**
2
+ * Copyright Zendesk, Inc.
3
+ *
4
+ * Use of this source code is governed under the Apache License, Version 2.0
5
+ * found at http://www.apache.org/licenses/LICENSE-2.0.
6
+ */
7
+ import { Dispatch } from 'react';
8
+ import { IToasterState, ToasterReducerAction } from './reducer';
9
+ interface IToastContext {
10
+ state: IToasterState;
11
+ dispatch: Dispatch<ToasterReducerAction>;
12
+ }
13
+ export declare const ToastContext: import("react").Context<IToastContext | undefined>;
14
+ export {};
@@ -4,24 +4,32 @@
4
4
  * Use of this source code is governed under the Apache License, Version 2.0
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
- import React, { Dispatch, HTMLAttributes } from 'react';
8
- import { IToasterState, ToasterReducerAction, ToastPlacement } from './reducer';
9
- export declare const ToastContext: React.Context<{
10
- state: IToasterState;
11
- dispatch: Dispatch<ToasterReducerAction>;
12
- } | undefined>;
7
+ import { HTMLAttributes, PropsWithChildren } from 'react';
8
+ import PropTypes from 'prop-types';
9
+ import { ToastPlacement } from './reducer';
13
10
  export interface IToastProviderProps {
14
11
  /**
15
12
  * Limits the number of visible toasts
16
13
  */
17
14
  limit?: number;
18
- /**
19
- * Sets the `z-index` of the toast
20
- */
21
- zIndex?: number;
22
15
  /**
23
16
  * Passes placement-based customization props to the toast's parent element
24
17
  */
25
18
  placementProps?: Partial<Record<ToastPlacement, HTMLAttributes<HTMLDivElement>>>;
19
+ /**
20
+ * Sets the `z-index` of the toast
21
+ */
22
+ zIndex?: number;
26
23
  }
27
- export declare const ToastProvider: React.FC<IToastProviderProps>;
24
+ export declare const ToastProvider: {
25
+ ({ limit, zIndex, placementProps, children }: PropsWithChildren<IToastProviderProps>): JSX.Element;
26
+ displayName: string;
27
+ defaultProps: {
28
+ limit: number;
29
+ };
30
+ propTypes: {
31
+ limit: PropTypes.Requireable<number>;
32
+ zIndex: PropTypes.Requireable<number>;
33
+ placementProps: PropTypes.Requireable<object>;
34
+ };
35
+ };
@@ -4,7 +4,7 @@
4
4
  * Use of this source code is governed under the Apache License, Version 2.0
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
- import React, { HTMLAttributes } from 'react';
7
+ import { HTMLAttributes } from 'react';
8
8
  import { IToast, ToastPlacement } from './reducer';
9
9
  interface IToastSlotProps extends HTMLAttributes<HTMLDivElement> {
10
10
  toasts: IToast[];
@@ -12,5 +12,5 @@ interface IToastSlotProps extends HTMLAttributes<HTMLDivElement> {
12
12
  limit: number;
13
13
  zIndex?: number;
14
14
  }
15
- export declare const ToastSlot: React.FC<IToastSlotProps>;
15
+ export declare const ToastSlot: ({ toasts, placement, zIndex, limit, ...props }: IToastSlotProps) => JSX.Element;
16
16
  export {};
@@ -5,12 +5,15 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  export { Alert } from './elements/Alert';
8
+ export type { IAlertProps } from './elements/Alert';
8
9
  export { Notification } from './elements/Notification';
10
+ export type { INotificationProps } from './elements/Notification';
9
11
  export { Well } from './elements/Well';
12
+ export type { IWellProps } from './elements/Well';
10
13
  export { Close } from './elements/content/Close';
11
14
  export { Paragraph } from './elements/content/Paragraph';
12
15
  export { Title } from './elements/content/Title';
13
16
  export { ToastProvider } from './elements/toaster/ToastProvider';
14
17
  export type { IToastProviderProps } from './elements/toaster/ToastProvider';
15
- export type { IToast, IToastOptions, ToastPlacement } from './elements/toaster/reducer';
18
+ export type { IToast, IToastOptions, ToastContent, ToastPlacement } from './elements/toaster/reducer';
16
19
  export { useToast } from './elements/toaster/useToast';
@@ -14,5 +14,5 @@ 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
- role: string & {};
17
+ role: import("react").AriaRole;
18
18
  } & IStyledAlertProps, "role" | "data-garden-id" | "data-garden-version">;
@@ -16,5 +16,5 @@ export interface IStyledNotificationProps {
16
16
  export declare const StyledNotification: import("styled-components").StyledComponent<"div", DefaultTheme, import("./StyledBase").IStyledBaseProps & {
17
17
  'data-garden-id': string;
18
18
  'data-garden-version': string;
19
- role: string & {};
19
+ role: import("react").AriaRole;
20
20
  } & IStyledNotificationProps, "role" | "data-garden-id" | "data-garden-version">;
@@ -4,5 +4,6 @@
4
4
  * Use of this source code is governed under the Apache License, Version 2.0
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
- export declare const NotificationsContext: import("react").Context<"successHue" | "warningHue" | "dangerHue" | "neutralHue" | undefined>;
8
- export declare const useNotificationsContext: () => "successHue" | "warningHue" | "dangerHue" | "neutralHue" | undefined;
7
+ import { VALIDATION_HUE } from './types';
8
+ export declare const NotificationsContext: import("react").Context<VALIDATION_HUE | undefined>;
9
+ export declare const useNotificationsContext: () => VALIDATION_HUE | undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zendeskgarden/react-notifications",
3
- "version": "8.46.0",
3
+ "version": "8.48.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>",
@@ -34,7 +34,7 @@
34
34
  },
35
35
  "devDependencies": {
36
36
  "@types/react-transition-group": "4.4.4",
37
- "@zendeskgarden/react-theming": "^8.46.0",
37
+ "@zendeskgarden/react-theming": "^8.48.0",
38
38
  "@zendeskgarden/svg-icons": "6.30.2"
39
39
  },
40
40
  "keywords": [
@@ -47,5 +47,5 @@
47
47
  "access": "public"
48
48
  },
49
49
  "zendeskgarden:src": "src/index.ts",
50
- "gitHead": "9e577b188009344c7ad0a035749930a4e19e400a"
50
+ "gitHead": "75f36aee62043004650c3eb2e1583b98a87d71f8"
51
51
  }