@carbon/ibm-products 2.23.0 → 2.25.0

package/lib/components/NotificationsPanel/NotificationsPanel.js

@@ -1,41 +1,38 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.NotificationsPanel = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _devtools = require("../../global/js/utils/devtools");
-var _hooks = require("../../global/js/hooks");
-var _settings = require("../../settings");
-var _utils = require("./utils");
-var _propsHelper = require("../../global/js/utils/props-helper");
-var _NotificationsEmptyState = require("../EmptyStates/NotificationsEmptyState");
-var _react2 = require("@carbon/react");
-var _icons = require("@carbon/react/icons");
-var _excluded = ["className", "data", "daysAgoText", "dismissAllLabel", "dismissSingleNotificationIconDescription", "doNotDisturbDefaultToggled", "doNotDisturbLabel", "emptyStateLabel", "hourAgoText", "hoursAgoText", "minuteAgoText", "minutesAgoText", "monthAgoText", "monthsAgoText", "nowText", "onClickOutside", "onDismissAllNotifications", "onDismissSingleNotification", "onDoNotDisturbChange", "onSettingsClick", "onViewAllClick", "open", "previousLabel", "readLessLabel", "readMoreLabel", "secondsAgoText", "settingsIconDescription", "title", "todayLabel", "viewAllLabel", "yearAgoText", "yearsAgoText", "yesterdayAtText", "yesterdayLabel"];
 /**
- * Copyright IBM Corp. 2020, 2022
+ * Copyright IBM Corp. 2020, 2024
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-// Import portions of React that are needed.
-// Other standard imports.
-// Carbon and package components we use.
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var React = require('react');
+var index$1 = require('../../node_modules/prop-types/index.js');
+var index = require('../../node_modules/classnames/index.js');
+var devtools = require('../../global/js/utils/devtools.js');
+var settings = require('../../settings.js');
+var utils = require('./utils.js');
+var propsHelper = require('../../global/js/utils/props-helper.js');
+var react = require('@carbon/react');
+var icons = require('@carbon/react/icons');
+var usePreviousValue = require('../../global/js/hooks/usePreviousValue.js');
+var useClickOutside = require('../../global/js/hooks/useClickOutside.js');
+var NotificationsEmptyState = require('../EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var _Close;
+var _excluded = ["className", "data", "daysAgoText", "dismissAllLabel", "dismissSingleNotificationIconDescription", "doNotDisturbDefaultToggled", "doNotDisturbLabel", "emptyStateLabel", "hourAgoText", "hoursAgoText", "minuteAgoText", "minutesAgoText", "monthAgoText", "monthsAgoText", "nowText", "onClickOutside", "onDismissAllNotifications", "onDismissSingleNotification", "onDoNotDisturbChange", "onSettingsClick", "onViewAllClick", "open", "previousLabel", "readLessLabel", "readMoreLabel", "secondsAgoText", "settingsIconDescription", "title", "todayLabel", "viewAllLabel", "yearAgoText", "yearsAgoText", "yesterdayAtText", "yesterdayLabel"];
+
 // The block part of our conventional BEM class names (blockClass__E--M).
 var componentName = 'NotificationsPanel';
-var blockClass = "".concat(_settings.pkg.prefix, "--notifications-panel");
+var blockClass = "".concat(settings.pkg.prefix, "--notifications-panel");
 
 // Default values for props
 var defaults = {
@@ -90,7 +87,7 @@ var defaults = {
   },
   yesterdayLabel: 'Yesterday'
 };
-var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
+exports.NotificationsPanel = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
   var className = _ref.className,
     data = _ref.data,
     _ref$daysAgoText = _ref.daysAgoText,
@@ -151,30 +148,30 @@ var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.defaul
     yesterdayAtText = _ref$yesterdayAtText === void 0 ? defaults.yesterdayAtText : _ref$yesterdayAtText,
     _ref$yesterdayLabel = _ref.yesterdayLabel,
     yesterdayLabel = _ref$yesterdayLabel === void 0 ? defaults.yesterdayLabel : _ref$yesterdayLabel,
-    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var notificationPanelRef = (0, _react.useRef)();
-  var _useState = (0, _react.useState)(open),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var notificationPanelRef = React.useRef();
+  var _useState = React.useState(open),
+    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
     shouldRender = _useState2[0],
     setRender = _useState2[1];
-  var _useState3 = (0, _react.useState)([]),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+  var _useState3 = React.useState([]),
+    _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
     allNotifications = _useState4[0],
     setAllNotifications = _useState4[1];
-  var previousState = (0, _hooks.usePreviousValue)({
+  var previousState = usePreviousValue.usePreviousValue({
     open: open
   });
   var reducedMotion = window && window.matchMedia ? window.matchMedia('(prefers-reduced-motion: reduce)') : {
     matches: true
   };
-  (0, _react.useEffect)(function () {
+  React.useEffect(function () {
     // Set the notifications passed to the state within this component
     setAllNotifications(data);
   }, [data]);
-  (0, _hooks.useClickOutside)(ref || notificationPanelRef, function () {
+  useClickOutside.useClickOutside(ref || notificationPanelRef, function () {
     onClickOutside();
   });
-  (0, _react.useEffect)(function () {
+  React.useEffect(function () {
     // initialize the notification panel to open
     if (open) {
       setRender(true);
@@ -184,7 +181,7 @@ var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.defaul
     // initialize the notification panel to close
     !open && setRender(false);
   };
-  (0, _react.useEffect)(function () {
+  React.useEffect(function () {
     if (!open && previousState !== null && previousState !== void 0 && previousState.open && reducedMotion.matches) {
       setRender(false);
     }
@@ -222,15 +219,15 @@ var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.defaul
     })[0];
     var trimLength = 88;
     var description = notification.description;
-    var descriptionClassName = (0, _classnames.default)(["".concat(blockClass, "__notification-description"), (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(blockClass, "__notification-long-description"), notification.showAll), "".concat(blockClass, "__notification-short-description"), !notification.showAll)]);
-    var showMoreButtonClassName = (0, _classnames.default)([(0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(blockClass, "__notification-read-less-button"), notification.showAll), "".concat(blockClass, "__notification-read-more-button"), !notification.showAll)]);
-    return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", {
+    var descriptionClassName = index["default"](["".concat(blockClass, "__notification-description"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__notification-long-description"), notification.showAll), "".concat(blockClass, "__notification-short-description"), !notification.showAll)]);
+    var showMoreButtonClassName = index["default"]([_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__notification-read-less-button"), notification.showAll), "".concat(blockClass, "__notification-read-more-button"), !notification.showAll)]);
+    return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("p", {
       className: descriptionClassName
-    }, description), description.length > trimLength && /*#__PURE__*/_react.default.createElement(_react2.Button, {
+    }, description), description.length > trimLength && /*#__PURE__*/React__default["default"].createElement(react.Button, {
       kind: "ghost",
       size: "sm",
       renderIcon: function renderIcon(props) {
-        return /*#__PURE__*/_react.default.createElement(_icons.ChevronDown, (0, _extends2.default)({
+        return /*#__PURE__*/React__default["default"].createElement(icons.ChevronDown, _rollupPluginBabelHelpers["extends"]({
           size: 16
         }, props));
       },
@@ -251,12 +248,12 @@ var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.defaul
       className: showMoreButtonClassName
     }, notification.showAll ? readLessLabel : readMoreLabel));
   };
-  var renderNotification = function renderNotification(group, notification, index) {
-    var notificationClassName = (0, _classnames.default)(["".concat(blockClass, "__notification"), "".concat(blockClass, "__notification-").concat(group)]);
-    var notificationHeaderClassName = (0, _classnames.default)(["".concat(blockClass, "__notification-title"), (0, _defineProperty2.default)({}, "".concat(blockClass, "__notification-title-unread"), notification.unread)]);
-    return /*#__PURE__*/_react.default.createElement("div", {
+  var renderNotification = function renderNotification(group, notification, index$1) {
+    var notificationClassName = index["default"](["".concat(blockClass, "__notification"), "".concat(blockClass, "__notification-").concat(group)]);
+    var notificationHeaderClassName = index["default"](["".concat(blockClass, "__notification-title"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__notification-title-unread"), notification.unread)]);
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       "aria-label": notification.title,
-      key: "".concat(notification.timestamp, "-").concat(notification.title, "-").concat(index),
+      key: "".concat(notification.timestamp, "-").concat(notification.title, "-").concat(index$1),
       className: notificationClassName,
       type: "button",
       role: "button",
@@ -270,23 +267,23 @@ var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.defaul
         }
         event.which === 13 && notification.onNotificationClick(notification);
       }
-    }, notification.type === 'error' && /*#__PURE__*/_react.default.createElement(_icons.ErrorFilled, {
+    }, notification.type === 'error' && /*#__PURE__*/React__default["default"].createElement(icons.ErrorFilled, {
       size: 16,
-      className: (0, _classnames.default)(["".concat(blockClass, "__notification-status-icon"), "".concat(blockClass, "__notification-status-icon-error")])
-    }), notification.type === 'success' && /*#__PURE__*/_react.default.createElement(_icons.CheckmarkFilled, {
+      className: index["default"](["".concat(blockClass, "__notification-status-icon"), "".concat(blockClass, "__notification-status-icon-error")])
+    }), notification.type === 'success' && /*#__PURE__*/React__default["default"].createElement(icons.CheckmarkFilled, {
       size: 16,
-      className: (0, _classnames.default)(["".concat(blockClass, "__notification-status-icon"), "".concat(blockClass, "__notification-status-icon-success")])
-    }), notification.type === 'warning' && /*#__PURE__*/_react.default.createElement(_icons.WarningAltFilled, {
+      className: index["default"](["".concat(blockClass, "__notification-status-icon"), "".concat(blockClass, "__notification-status-icon-success")])
+    }), notification.type === 'warning' && /*#__PURE__*/React__default["default"].createElement(icons.WarningAltFilled, {
       size: 16,
-      className: (0, _classnames.default)(["".concat(blockClass, "__notification-status-icon"), "".concat(blockClass, "__notification-status-icon-warning")])
-    }), notification.type === 'informational' && /*#__PURE__*/_react.default.createElement(_icons.InformationSquareFilled, {
+      className: index["default"](["".concat(blockClass, "__notification-status-icon"), "".concat(blockClass, "__notification-status-icon-warning")])
+    }), notification.type === 'informational' && /*#__PURE__*/React__default["default"].createElement(icons.InformationSquareFilled, {
       size: 16,
-      className: (0, _classnames.default)(["".concat(blockClass, "__notification-status-icon"), "".concat(blockClass, "__notification-status-icon-informational")])
-    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: index["default"](["".concat(blockClass, "__notification-status-icon"), "".concat(blockClass, "__notification-status-icon-informational")])
+    }), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "".concat(blockClass, "__notification-content")
-    }, /*#__PURE__*/_react.default.createElement("p", {
+    }, /*#__PURE__*/React__default["default"].createElement("p", {
       className: "".concat(blockClass, "__notification-time-label")
-    }, (0, _utils.timeAgo)({
+    }, utils.timeAgo({
       previousTime: notification.timestamp,
       secondsAgoText: secondsAgoText,
       minuteAgoText: minuteAgoText,
@@ -300,12 +297,12 @@ var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.defaul
       yearsAgoText: yearsAgoText,
       yearAgoText: yearAgoText,
       nowText: nowText
-    })), /*#__PURE__*/_react.default.createElement("h6", {
+    })), /*#__PURE__*/React__default["default"].createElement("h6", {
       className: notificationHeaderClassName
-    }, notification.title), notification.description && notification.description.length && renderDescription(notification.id), notification.link && notification.link.text && notification.link.url && /*#__PURE__*/_react.default.createElement(_react2.Link, (0, _extends2.default)({
+    }, notification.title), notification.description && notification.description.length && renderDescription(notification.id), notification.link && notification.link.text && notification.link.url && /*#__PURE__*/React__default["default"].createElement(react.Link, _rollupPluginBabelHelpers["extends"]({
       href: notification.link.url,
       className: "".concat(blockClass, "__notifications-link")
-    }, (0, _propsHelper.prepareProps)({}, notification.link, ['text', 'url'])), notification.link.text)), /*#__PURE__*/_react.default.createElement(_react2.IconButton, {
+    }, propsHelper.prepareProps({}, notification.link, ['text', 'url'])), notification.link.text)), /*#__PURE__*/React__default["default"].createElement(react.IconButton, {
       align: "left",
       kind: "ghost",
       size: "sm",
@@ -314,38 +311,38 @@ var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.defaul
       onClick: function onClick(event) {
         return dismissSingleNotification(event, notification);
       }
-    }, /*#__PURE__*/_react.default.createElement(_icons.Close, {
+    }, _Close || (_Close = /*#__PURE__*/React__default["default"].createElement(icons.Close, {
       size: 16
-    })));
+    }))));
   };
   var dismissSingleNotification = function dismissSingleNotification(event, notification) {
     event.preventDefault();
     event.stopPropagation();
     onDismissSingleNotification(notification);
   };
-  var mainSectionClassName = (0, _classnames.default)(["".concat(blockClass, "__main-section"), (0, _defineProperty2.default)({}, "".concat(blockClass, "__main-section-empty"), allNotifications && !allNotifications.length)]);
-  return shouldRender ? /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, rest, {
+  var mainSectionClassName = index["default"](["".concat(blockClass, "__main-section"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__main-section-empty"), allNotifications && !allNotifications.length)]);
+  return shouldRender ? /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
     id: blockClass,
-    className: (0, _classnames.default)(blockClass, className, "".concat(blockClass, "__container")),
+    className: index["default"](blockClass, className, "".concat(blockClass, "__container")),
     style: {
       animation: !reducedMotion.matches ? "".concat(open ? 'fade-in 250ms' : 'fade-out 250ms') : null
     },
     onAnimationEnd: onAnimationEnd,
     ref: ref || notificationPanelRef
-  }, (0, _devtools.getDevtoolsProps)(componentName)), /*#__PURE__*/_react.default.createElement("div", {
+  }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(blockClass, "__header-container")
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(blockClass, "__header-flex")
-  }, /*#__PURE__*/_react.default.createElement("h2", {
+  }, /*#__PURE__*/React__default["default"].createElement("h2", {
     className: "".concat(blockClass, "__header")
-  }, title), /*#__PURE__*/_react.default.createElement(_react2.Button, {
+  }, title), /*#__PURE__*/React__default["default"].createElement(react.Button, {
     size: "sm",
     kind: "ghost",
     className: "".concat(blockClass, "__dismiss-button"),
     onClick: function onClick() {
       return onDismissAllNotifications();
     }
-  }, dismissAllLabel)), onDoNotDisturbChange && /*#__PURE__*/_react.default.createElement(_react2.Toggle, {
+  }, dismissAllLabel)), onDoNotDisturbChange && /*#__PURE__*/React__default["default"].createElement(react.Toggle, {
     size: "sm",
     className: "".concat(blockClass, "__do-not-disturb-toggle"),
     id: "".concat(blockClass, "__do-not-disturb-toggle-component"),
@@ -357,38 +354,38 @@ var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.defaul
     defaultToggled: doNotDisturbDefaultToggled,
     "aria-label": doNotDisturbLabel,
     labelText: doNotDisturbLabel
-  })), /*#__PURE__*/_react.default.createElement("div", {
+  })), /*#__PURE__*/React__default["default"].createElement("div", {
     className: mainSectionClassName
-  }, withinLastDayNotifications && withinLastDayNotifications.length ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("h6", {
+  }, withinLastDayNotifications && withinLastDayNotifications.length ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("h6", {
     className: "".concat(blockClass, "__time-section-label")
   }, todayLabel), withinLastDayNotifications.map(function (notification, index) {
     return renderNotification('today', notification, index);
-  })) : null, previousDayNotifications && previousDayNotifications.length ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("h6", {
+  })) : null, previousDayNotifications && previousDayNotifications.length ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("h6", {
     className: "".concat(blockClass, "__time-section-label")
   }, yesterdayLabel), previousDayNotifications.map(function (notification, index) {
     return renderNotification('yesterday', notification, index);
-  })) : null, previousNotifications && previousNotifications.length ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("h6", {
+  })) : null, previousNotifications && previousNotifications.length ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("h6", {
     className: "".concat(blockClass, "__time-section-label")
   }, previousLabel), previousNotifications.map(function (notification, index) {
     return renderNotification('previous', notification, index);
-  })) : null, !allNotifications.length && /*#__PURE__*/_react.default.createElement(_NotificationsEmptyState.NotificationsEmptyState, {
+  })) : null, !allNotifications.length && /*#__PURE__*/React__default["default"].createElement(NotificationsEmptyState.NotificationsEmptyState, {
     illustrationTheme: "dark",
     title: "",
     subtitle: emptyStateLabel
-  })), onViewAllClick && onSettingsClick && allNotifications && allNotifications.length ? /*#__PURE__*/_react.default.createElement("div", {
+  })), onViewAllClick && onSettingsClick && allNotifications && allNotifications.length ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(blockClass, "__bottom-actions")
-  }, /*#__PURE__*/_react.default.createElement(_react2.Button, {
+  }, /*#__PURE__*/React__default["default"].createElement(react.Button, {
     kind: "ghost",
     className: "".concat(blockClass, "__view-all-button"),
     onClick: function onClick() {
       return onViewAllClick();
     }
-  }, viewAllLabel(allNotifications.length)), /*#__PURE__*/_react.default.createElement(_react2.Button, {
+  }, viewAllLabel(allNotifications.length)), /*#__PURE__*/React__default["default"].createElement(react.Button, {
     kind: "ghost",
     size: "sm",
     className: "".concat(blockClass, "__settings-button"),
     renderIcon: function renderIcon(props) {
-      return /*#__PURE__*/_react.default.createElement(_icons.Settings, (0, _extends2.default)({
+      return /*#__PURE__*/React__default["default"].createElement(icons.Settings, _rollupPluginBabelHelpers["extends"]({
         size: 16
       }, props));
     },
@@ -400,162 +397,162 @@ var NotificationsPanel = exports.NotificationsPanel = /*#__PURE__*/_react.defaul
 });
 
 // Return a placeholder if not released and not enabled by feature flag
-exports.NotificationsPanel = NotificationsPanel = _settings.pkg.checkComponentEnabled(NotificationsPanel, componentName);
+exports.NotificationsPanel = settings.pkg.checkComponentEnabled(exports.NotificationsPanel, componentName);
 
 // The display name of the component, used by React. Note that displayName
 // is used in preference to relying on function.name.
-NotificationsPanel.displayName = componentName;
+exports.NotificationsPanel.displayName = componentName;
 
 // The types and DocGen commentary for the component props,
 // in alphabetical order (for consistency).
 // See https://www.npmjs.com/package/prop-types#usage.
-NotificationsPanel.propTypes = {
+exports.NotificationsPanel.propTypes = {
   /**
    * Provide an optional class to be applied to the containing node.
    */
-  className: _propTypes.default.string,
+  className: index$1["default"].string,
   /**
    * Array of data for Notifications component to render
    */
-  data: _propTypes.default.arrayOf(_propTypes.default.shape({
-    id: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
-    type: _propTypes.default.oneOf(['error', 'warning', 'success', 'informational']),
-    timestamp: _propTypes.default.instanceOf(Date),
-    title: _propTypes.default.string,
-    description: _propTypes.default.string,
-    link: _propTypes.default.shape({
-      url: _propTypes.default.string,
-      text: _propTypes.default.string
+  data: index$1["default"].arrayOf(index$1["default"].shape({
+    id: index$1["default"].oneOfType([index$1["default"].string, index$1["default"].number]),
+    type: index$1["default"].oneOf(['error', 'warning', 'success', 'informational']),
+    timestamp: index$1["default"].instanceOf(Date),
+    title: index$1["default"].string,
+    description: index$1["default"].string,
+    link: index$1["default"].shape({
+      url: index$1["default"].string,
+      text: index$1["default"].string
     }),
-    unread: _propTypes.default.bool,
-    onNotificationClick: _propTypes.default.func
+    unread: index$1["default"].bool,
+    onNotificationClick: index$1["default"].func
   })).isRequired,
   /**
    * Sets the `days ago` label text
    */
-  daysAgoText: _propTypes.default.func,
+  daysAgoText: index$1["default"].func,
   /**
    * Label for Dismiss all button
    */
-  dismissAllLabel: _propTypes.default.string,
+  dismissAllLabel: index$1["default"].string,
   /**
    * Label for Dismiss single notification icon button
    */
-  dismissSingleNotificationIconDescription: _propTypes.default.string,
+  dismissSingleNotificationIconDescription: index$1["default"].string,
   /**
    * Optional: Determines if the `Do not disturb` toggle is on or off when the component is rendered
    */
-  doNotDisturbDefaultToggled: _propTypes.default.bool,
+  doNotDisturbDefaultToggled: index$1["default"].bool,
   /**
    * Optional: Label for Do not disturb toggle
    */
-  doNotDisturbLabel: _propTypes.default.string,
+  doNotDisturbLabel: index$1["default"].string,
   /**
    * Sets the empty state label text when there are no notifications
    */
-  emptyStateLabel: _propTypes.default.string,
+  emptyStateLabel: index$1["default"].string,
   /**
    * Sets the `hour ago` label text
    */
-  hourAgoText: _propTypes.default.func,
+  hourAgoText: index$1["default"].func,
   /**
    * Sets the `hours ago` label text
    */
-  hoursAgoText: _propTypes.default.func,
+  hoursAgoText: index$1["default"].func,
   /**
    * Sets the `minute ago` label text
    */
-  minuteAgoText: _propTypes.default.func,
+  minuteAgoText: index$1["default"].func,
   /**
    * Sets the `minutes ago` label text
    */
-  minutesAgoText: _propTypes.default.func,
+  minutesAgoText: index$1["default"].func,
   /**
    * Sets the `month ago` label text
    */
-  monthAgoText: _propTypes.default.func,
+  monthAgoText: index$1["default"].func,
   /**
    * Sets the `months ago` label text
    */
-  monthsAgoText: _propTypes.default.func,
+  monthsAgoText: index$1["default"].func,
   /**
    * Sets the `now` label text
    */
-  nowText: _propTypes.default.string,
+  nowText: index$1["default"].string,
   /**
    * Sets the notifications panel open state
    */
-  onClickOutside: _propTypes.default.func.isRequired,
+  onClickOutside: index$1["default"].func.isRequired,
   /**
    * Function that will dismiss all notifications
    */
-  onDismissAllNotifications: _propTypes.default.func,
+  onDismissAllNotifications: index$1["default"].func,
   /**
    * Function that will dismiss a single notification
    */
-  onDismissSingleNotification: _propTypes.default.func,
+  onDismissSingleNotification: index$1["default"].func,
   /**
    * Optional: function that returns the current selected value of the disable notification toggle
    */
-  onDoNotDisturbChange: _propTypes.default.func,
+  onDoNotDisturbChange: index$1["default"].func,
   /**
    * Event handler for the View all button
    */
-  onSettingsClick: _propTypes.default.func,
+  onSettingsClick: index$1["default"].func,
   /**
    * Event handler for the View all button
    */
-  onViewAllClick: _propTypes.default.func,
+  onViewAllClick: index$1["default"].func,
   /**
    * Determines whether the notifications panel should render or not
    */
-  open: _propTypes.default.bool.isRequired,
+  open: index$1["default"].bool.isRequired,
   /**
    * Sets the previous label text
    */
-  previousLabel: _propTypes.default.string,
+  previousLabel: index$1["default"].string,
   /**
    * Sets the `read less` label text
    */
-  readLessLabel: _propTypes.default.string,
+  readLessLabel: index$1["default"].string,
   /**
    * Sets the `read more` label text
    */
-  readMoreLabel: _propTypes.default.string,
+  readMoreLabel: index$1["default"].string,
   /**
    * Sets the `seconds ago` label text
    */
-  secondsAgoText: _propTypes.default.func,
+  secondsAgoText: index$1["default"].func,
   /**
    * Sets the settings icon description text
    */
-  settingsIconDescription: _propTypes.default.string,
+  settingsIconDescription: index$1["default"].string,
   /**
    * Sets the title for the Notifications panel
    */
-  title: _propTypes.default.string,
+  title: index$1["default"].string,
   /**
    * Sets the today label text
    */
-  todayLabel: _propTypes.default.string,
+  todayLabel: index$1["default"].string,
   /**
    * Sets the View all button text
    */
-  viewAllLabel: _propTypes.default.func,
+  viewAllLabel: index$1["default"].func,
   /**
    * Sets the `year ago` label text
    */
-  yearAgoText: _propTypes.default.func,
+  yearAgoText: index$1["default"].func,
   /**
    * Sets the `years ago` label text
    */
-  yearsAgoText: _propTypes.default.func,
+  yearsAgoText: index$1["default"].func,
   /**
    * Sets the `Yesterday at` label text
    */
-  yesterdayAtText: _propTypes.default.func,
+  yesterdayAtText: index$1["default"].func,
   /**
    * Sets the yesterday label text
    */
-  yesterdayLabel: _propTypes.default.string
-};
+  yesterdayLabel: index$1["default"].string
+};

package/lib/components/NotificationsPanel/index.d.ts

@@ -0,0 +1 @@
+export { NotificationsPanel } from "./NotificationsPanel";

package/lib/components/NotificationsPanel/utils.d.ts

@@ -0,0 +1,15 @@
+export function timeAgo({ previousTime, secondsAgoText, minuteAgoText, minutesAgoText, hoursAgoText, hourAgoText, daysAgoText, yesterdayAtText, monthsAgoText, monthAgoText, yearsAgoText, yearAgoText, nowText, }: {
+    previousTime: any;
+    secondsAgoText: any;
+    minuteAgoText: any;
+    minutesAgoText: any;
+    hoursAgoText: any;
+    hourAgoText: any;
+    daysAgoText: any;
+    yesterdayAtText: any;
+    monthsAgoText: any;
+    monthAgoText: any;
+    yearsAgoText: any;
+    yearAgoText: any;
+    nowText: any;
+}): any;

package/lib/components/NotificationsPanel/utils.js

@@ -1,17 +1,15 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.timeAgo = void 0;
 /**
- * Copyright IBM Corp. 2020, 2021
+ * Copyright IBM Corp. 2020, 2024
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
-var timeAgo = exports.timeAgo = function timeAgo(_ref) {
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var timeAgo = function timeAgo(_ref) {
   var previousTime = _ref.previousTime,
     secondsAgoText = _ref.secondsAgoText,
     minuteAgoText = _ref.minuteAgoText,
@@ -53,4 +51,6 @@ var getBrowserLocales = function getBrowserLocales() {
     var trimmedLocale = locale.trim();
     return trimmedLocale;
   });
-};
+};
+
+exports.timeAgo = timeAgo;

package/lib/components/OptionsTile/OptionsTile.d.ts

@@ -0,0 +1,5 @@
+/**
+ * TODO: A description of the component.
+ */
+export let OptionsTile: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from 'react';