@hitachivantara/uikit-react-lab 2.6.18

package/dist/NotificationPanel/Notification/styles.js

@@ -0,0 +1,73 @@
+"use strict";
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+require("core-js/modules/es.array.concat.js");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var styles = function styles(theme) {
+  return {
+    root: {
+      display: "flex",
+      minHeight: "68px",
+      backgroundColor: theme.palette.common.white,
+      color: theme.hv.palette.accent.acce1,
+      padding: "".concat(theme.hv.spacing.sm, "px ").concat(theme.hv.spacing.sm, "px"),
+      "&$read": {
+        backgroundColor: theme.hv.palette.atmosphere.atmo2
+      }
+    },
+    read: {},
+    iconContainer: {
+      width: "32px",
+      marginRight: "".concat(theme.hv.spacing.sm, "px")
+    },
+    title: _objectSpread(_objectSpread({}, theme.hv.typography.highlightText), {}, {
+      marginBottom: "5px",
+      "&$read": _objectSpread({}, theme.hv.typography.normalText)
+    }),
+    timeContainer: _objectSpread(_objectSpread({}, theme.hv.typography.vizText), {}, {
+      display: "flex",
+      alignItems: "center"
+    }),
+    bullet: {
+      width: "6px",
+      height: "6px",
+      borderRadius: "50%",
+      marginRight: "6px",
+      backgroundColor: theme.palette.common.black,
+      "&$hide": {
+        display: "none"
+      }
+    },
+    hide: {}
+  };
+};
+
+var _default = styles;
+exports.default = _default;
+//# sourceMappingURL=styles.js.map

package/dist/NotificationPanel/Notification/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","names":["styles","theme","root","display","minHeight","backgroundColor","palette","common","white","color","hv","accent","acce1","padding","spacing","sm","atmosphere","atmo2","read","iconContainer","width","marginRight","title","typography","highlightText","marginBottom","normalText","timeContainer","vizText","alignItems","bullet","height","borderRadius","black","hide"],"sources":["../../../src/NotificationPanel/Notification/styles.js"],"sourcesContent":["const styles = (theme) => ({\n  root: {\n    display: \"flex\",\n    minHeight: \"68px\",\n    backgroundColor: theme.palette.common.white,\n    color: theme.hv.palette.accent.acce1,\n    padding: `${theme.hv.spacing.sm}px ${theme.hv.spacing.sm}px`,\n\n    \"&$read\": {\n      backgroundColor: theme.hv.palette.atmosphere.atmo2,\n    },\n  },\n  read: {},\n  iconContainer: {\n    width: \"32px\",\n    marginRight: `${theme.hv.spacing.sm}px`,\n  },\n  title: {\n    ...theme.hv.typography.highlightText,\n    marginBottom: \"5px\",\n\n    \"&$read\": {\n      ...theme.hv.typography.normalText,\n    },\n  },\n  timeContainer: {\n    ...theme.hv.typography.vizText,\n    display: \"flex\",\n    alignItems: \"center\",\n  },\n  bullet: {\n    width: \"6px\",\n    height: \"6px\",\n    borderRadius: \"50%\",\n    marginRight: \"6px\",\n    backgroundColor: theme.palette.common.black,\n\n    \"&$hide\": {\n      display: \"none\",\n    },\n  },\n  hide: {},\n});\n\nexport default styles;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAMA,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;EAAA,OAAY;IACzBC,IAAI,EAAE;MACJC,OAAO,EAAE,MADL;MAEJC,SAAS,EAAE,MAFP;MAGJC,eAAe,EAAEJ,KAAK,CAACK,OAAN,CAAcC,MAAd,CAAqBC,KAHlC;MAIJC,KAAK,EAAER,KAAK,CAACS,EAAN,CAASJ,OAAT,CAAiBK,MAAjB,CAAwBC,KAJ3B;MAKJC,OAAO,YAAKZ,KAAK,CAACS,EAAN,CAASI,OAAT,CAAiBC,EAAtB,gBAA8Bd,KAAK,CAACS,EAAN,CAASI,OAAT,CAAiBC,EAA/C,OALH;MAOJ,UAAU;QACRV,eAAe,EAAEJ,KAAK,CAACS,EAAN,CAASJ,OAAT,CAAiBU,UAAjB,CAA4BC;MADrC;IAPN,CADmB;IAYzBC,IAAI,EAAE,EAZmB;IAazBC,aAAa,EAAE;MACbC,KAAK,EAAE,MADM;MAEbC,WAAW,YAAKpB,KAAK,CAACS,EAAN,CAASI,OAAT,CAAiBC,EAAtB;IAFE,CAbU;IAiBzBO,KAAK,kCACArB,KAAK,CAACS,EAAN,CAASa,UAAT,CAAoBC,aADpB;MAEHC,YAAY,EAAE,KAFX;MAIH,4BACKxB,KAAK,CAACS,EAAN,CAASa,UAAT,CAAoBG,UADzB;IAJG,EAjBoB;IAyBzBC,aAAa,kCACR1B,KAAK,CAACS,EAAN,CAASa,UAAT,CAAoBK,OADZ;MAEXzB,OAAO,EAAE,MAFE;MAGX0B,UAAU,EAAE;IAHD,EAzBY;IA8BzBC,MAAM,EAAE;MACNV,KAAK,EAAE,KADD;MAENW,MAAM,EAAE,KAFF;MAGNC,YAAY,EAAE,KAHR;MAINX,WAAW,EAAE,KAJP;MAKNhB,eAAe,EAAEJ,KAAK,CAACK,OAAN,CAAcC,MAAd,CAAqB0B,KALhC;MAON,UAAU;QACR9B,OAAO,EAAE;MADD;IAPJ,CA9BiB;IAyCzB+B,IAAI,EAAE;EAzCmB,CAAZ;AAAA,CAAf;;eA4CelC,M"}

package/dist/NotificationPanel/NotificationPanel.d.ts

@@ -0,0 +1,49 @@
+import * as React from "react";
+import { StandardProps } from "@material-ui/core";
+
+interface Header {
+  /**
+   * The title of the header
+   */
+  headerTitle: string;
+  /**
+   * The icon that denoted close functionality
+   */
+  headerCloseImg: React.ElementType<React.HTMLAttributes<HTMLElement>>;
+}
+
+interface Notification {
+  /**
+   * Id of notification
+   */
+  id: string;
+}
+
+export type HvNotificationPanelClassKey = "panel" | "badgeBorder";
+
+export interface HvNotificationPanelProps
+  extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvNotificationPanelClassKey> {
+  /**
+   * 'true' if panel is open or 'false' if the panel is not open
+   */
+  open?: boolean;
+
+  /**
+   * renderable element that opens the notification panel
+   */
+  icon: React.ElementType<React.HTMLAttributes<HTMLElement>>;
+  /**
+   * Object that holds header properties
+   */
+  header: Header;
+  /**
+   * Array of notification object to be rendered inside the panel
+   */
+  notifications: Notification[];
+  /**
+   * renderable footer element
+   */
+  footer: React.ElementType<React.HTMLAttributes<HTMLElement>>;
+}
+
+export default function HvNotificationPanel(props: HvNotificationPanelProps): JSX.Element | null;

package/dist/NotificationPanel/NotificationPanel.js

@@ -0,0 +1,219 @@
+"use strict";
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.reflect.construct.js");
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _map = _interopRequireDefault(require("lodash/map"));
+
+var _core = require("@material-ui/core");
+
+var _uikitReactCore = require("@hitachivantara/uikit-react-core");
+
+var _Panel = _interopRequireDefault(require("./Panel"));
+
+var _Notification = _interopRequireDefault(require("./Notification"));
+
+var _styles = _interopRequireDefault(require("./styles"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+/**
+ * Notification Panel displays all of read and unread notifications. Still in development
+ */
+var HvNotificationPanel = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(HvNotificationPanel, _Component);
+
+  var _super = _createSuper(HvNotificationPanel);
+
+  function HvNotificationPanel(props) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, HvNotificationPanel);
+    _this = _super.call(this, props);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleIconClick", function () {
+      _this.setState(function (prevState) {
+        return {
+          open: !prevState.open
+        };
+      });
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleIconKeyDown", function (e) {
+      if (e.keyCode === 13) {
+        _this.setState(function (prevState) {
+          return {
+            open: !prevState.open
+          };
+        });
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onClose", function () {
+      _this.setState({
+        open: false
+      });
+    });
+    _this.state = {
+      open: props.open
+    };
+    return _this;
+  }
+
+  (0, _createClass2.default)(HvNotificationPanel, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          classes = _this$props.classes,
+          icon = _this$props.icon,
+          header = _this$props.header,
+          footer = _this$props.footer,
+          notifications = _this$props.notifications;
+      var open = this.state.open;
+      var n = (0, _map.default)(notifications, function (notification) {
+        return /*#__PURE__*/_react.default.createElement(_Notification.default, {
+          key: notification.id,
+          notification: notification
+        });
+      });
+      var panelProps = {
+        open: open,
+        classes: {
+          panel: classes.panel
+        },
+        onClose: this.onClose,
+        header: header,
+        footer: footer,
+        notifications: notifications
+      };
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: classes.root
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        role: "button",
+        className: classes.iconWrapper,
+        tabIndex: "0",
+        onKeyDown: this.handleIconKeyDown,
+        onClick: this.handleIconClick
+      }, /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvBadge, {
+        icon: icon,
+        showCount: true,
+        count: notifications.length,
+        classes: {
+          root: classes.badgeBorder
+        }
+      })), /*#__PURE__*/_react.default.createElement(_Panel.default, panelProps, n));
+    }
+  }]);
+  return HvNotificationPanel;
+}(_react.Component);
+
+process.env.NODE_ENV !== "production" ? HvNotificationPanel.propTypes = {
+  /**
+   * 'true' if panel is open or 'false' if the panel is not open
+   */
+  open: _propTypes.default.bool,
+
+  /**
+   * A Jss Object used to override or extend the styles applied.
+   */
+  classes: _propTypes.default.shape({
+    root: _propTypes.default.string,
+    iconWrapper: _propTypes.default.string,
+
+    /**
+     * styles object applied to the panel
+     */
+    panel: _propTypes.default.any,
+
+    /**
+     * styles object applied to badgeContainer
+     */
+    badgeBorder: _propTypes.default.any
+  }).isRequired,
+
+  /**
+   * renderable element that opens the notification panel
+   */
+  icon: _propTypes.default.element.isRequired,
+
+  /**
+   * Object that holds header properties
+   */
+  header: _propTypes.default.shape({
+    /**
+     * The title of the header
+     */
+    headerTitle: _propTypes.default.string.isRequired,
+
+    /**
+     * The icon that denoted close functionality
+     */
+    headerCloseImg: _propTypes.default.element.isRequired
+  }).isRequired,
+
+  /**
+   * Array of notification object to be rendered inside the panel
+   */
+  notifications: _propTypes.default.arrayOf(_propTypes.default.shape({
+    /**
+     * Id of notification
+     */
+    id: _propTypes.default.string.isRequired
+  })).isRequired,
+
+  /**
+   * renderable footer element
+   */
+  footer: _propTypes.default.element.isRequired
+} : void 0;
+HvNotificationPanel.defaultProps = {
+  open: false
+};
+
+var _default = (0, _core.withStyles)(_styles.default, {
+  name: "HvNotificationPanel"
+})(HvNotificationPanel);
+
+exports.default = _default;
+//# sourceMappingURL=NotificationPanel.js.map

package/dist/NotificationPanel/NotificationPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationPanel.js","names":["HvNotificationPanel","props","setState","prevState","open","e","keyCode","state","classes","icon","header","footer","notifications","n","map","notification","id","panelProps","panel","onClose","root","iconWrapper","handleIconKeyDown","handleIconClick","length","badgeBorder","Component","propTypes","PropTypes","bool","shape","string","any","isRequired","element","headerTitle","headerCloseImg","arrayOf","defaultProps","withStyles","styles","name"],"sources":["../../src/NotificationPanel/NotificationPanel.js"],"sourcesContent":["import React, { Component } from \"react\";\nimport PropTypes from \"prop-types\";\nimport map from \"lodash/map\";\nimport { withStyles } from \"@material-ui/core\";\nimport { HvBadge } from \"@hitachivantara/uikit-react-core\";\nimport Panel from \"./Panel\";\nimport Notification from \"./Notification\";\nimport styles from \"./styles\";\n\n/**\n * Notification Panel displays all of read and unread notifications. Still in development\n */\nclass HvNotificationPanel extends Component {\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      open: props.open,\n    };\n  }\n\n  handleIconClick = () => {\n    this.setState((prevState) => ({\n      open: !prevState.open,\n    }));\n  };\n\n  handleIconKeyDown = (e) => {\n    if (e.keyCode === 13) {\n      this.setState((prevState) => ({\n        open: !prevState.open,\n      }));\n    }\n  };\n\n  onClose = () => {\n    this.setState({\n      open: false,\n    });\n  };\n\n  render() {\n    const { classes, icon, header, footer, notifications } = this.props;\n    const { open } = this.state;\n\n    const n = map(notifications, (notification) => (\n      <Notification key={notification.id} notification={notification} />\n    ));\n\n    const panelProps = {\n      open,\n      classes: {\n        panel: classes.panel,\n      },\n      onClose: this.onClose,\n      header,\n      footer,\n      notifications,\n    };\n\n    return (\n      <div className={classes.root}>\n        <div\n          role=\"button\"\n          className={classes.iconWrapper}\n          tabIndex=\"0\"\n          onKeyDown={this.handleIconKeyDown}\n          onClick={this.handleIconClick}\n        >\n          <HvBadge\n            icon={icon}\n            showCount\n            count={notifications.length}\n            classes={{ root: classes.badgeBorder }}\n          />\n        </div>\n        <Panel {...panelProps}>{n}</Panel>\n      </div>\n    );\n  }\n}\n\nHvNotificationPanel.propTypes = {\n  /**\n   * 'true' if panel is open or 'false' if the panel is not open\n   */\n  open: PropTypes.bool,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    root: PropTypes.string,\n    iconWrapper: PropTypes.string,\n    /**\n     * styles object applied to the panel\n     */\n    panel: PropTypes.any,\n    /**\n     * styles object applied to badgeContainer\n     */\n    badgeBorder: PropTypes.any,\n  }).isRequired,\n  /**\n   * renderable element that opens the notification panel\n   */\n  icon: PropTypes.element.isRequired,\n  /**\n   * Object that holds header properties\n   */\n  header: PropTypes.shape({\n    /**\n     * The title of the header\n     */\n    headerTitle: PropTypes.string.isRequired,\n    /**\n     * The icon that denoted close functionality\n     */\n    headerCloseImg: PropTypes.element.isRequired,\n  }).isRequired,\n  /**\n   * Array of notification object to be rendered inside the panel\n   */\n  notifications: PropTypes.arrayOf(\n    PropTypes.shape({\n      /**\n       * Id of notification\n       */\n      id: PropTypes.string.isRequired,\n    })\n  ).isRequired,\n  /**\n   * renderable footer element\n   */\n  footer: PropTypes.element.isRequired,\n};\n\nHvNotificationPanel.defaultProps = {\n  open: false,\n};\n\nexport default withStyles(styles, { name: \"HvNotificationPanel\" })(HvNotificationPanel);\n"],"mappings":"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"}

package/dist/NotificationPanel/Panel/Panel.js

@@ -0,0 +1,202 @@
+"use strict";
+
+require("core-js/modules/es.reflect.construct.js");
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("core-js/modules/es.array.concat.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _lodash = _interopRequireDefault(require("lodash"));
+
+var _uikitReactCore = require("@hitachivantara/uikit-react-core");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var EnterKeyCode = 13;
+
+var Panel = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(Panel, _Component);
+
+  var _super = _createSuper(Panel);
+
+  function Panel() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, Panel);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onKeyDownClose", function (e) {
+      if (e.keyCode === EnterKeyCode) {
+        var onClose = _this.props.onClose;
+        onClose();
+      }
+    });
+    return _this;
+  }
+
+  (0, _createClass2.default)(Panel, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          classes = _this$props.classes,
+          open = _this$props.open,
+          _this$props$header = _this$props.header,
+          headerTitle = _this$props$header.headerTitle,
+          headerCloseImg = _this$props$header.headerCloseImg,
+          notifications = _this$props.notifications,
+          onClose = _this$props.onClose,
+          footer = _this$props.footer,
+          children = _this$props.children;
+
+      var newNotificationCount = _lodash.default.filter(notifications, function (notification) {
+        return !notification.isRead;
+      }).length;
+
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: "".concat(classes.root, " ").concat(open ? classes.open : "", " ").concat(classes.panel),
+        ref: this.rootRef
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: classes.header
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: classes.titleContainer
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: classes.title
+      }, headerTitle), /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvBadge, {
+        count: newNotificationCount,
+        showCount: true
+      })), /*#__PURE__*/_react.default.createElement("div", {
+        role: "button",
+        className: classes.close,
+        tabIndex: "0",
+        onKeyDown: this.onKeyDownClose,
+        onClick: onClose
+      }, headerCloseImg)), /*#__PURE__*/_react.default.createElement("div", {
+        className: classes.notificationsContainer
+      }, children), /*#__PURE__*/_react.default.createElement("div", {
+        className: classes.footerContainer
+      }, footer));
+    }
+  }]);
+  return Panel;
+}(_react.Component);
+
+exports.default = Panel;
+process.env.NODE_ENV !== "production" ? Panel.propTypes = {
+  /**
+   * 'true' if the panel is open or 'false if the panel is closed
+   */
+  open: _propTypes.default.bool,
+
+  /**
+   * Number of new notifications
+   */
+  notifications: _propTypes.default.arrayOf(_propTypes.default.shape({
+    /**
+     * 'true' if notification has been read; 'false' otherwise
+     */
+    isRead: _propTypes.default.bool.isRequired
+  }).isRequired),
+
+  /**
+   * A Jss Object used to override or extend the styles applied.
+   */
+  classes: _propTypes.default.shape({
+    /**
+     * styles applied to the panel
+     */
+    panel: _propTypes.default.string,
+    root: _propTypes.default.string,
+    open: _propTypes.default.string,
+    header: _propTypes.default.string,
+    titleContainer: _propTypes.default.string,
+    title: _propTypes.default.string,
+    close: _propTypes.default.string,
+    notificationsContainer: _propTypes.default.string,
+    footerContainer: _propTypes.default.string
+  }).isRequired,
+
+  /**
+   * The function that will be executed when the panel is closed
+   */
+  onClose: _propTypes.default.func.isRequired,
+
+  /**
+   * Object that holds header properties
+   */
+  header: _propTypes.default.shape({
+    /**
+     * The title of the header
+     */
+    headerTitle: _propTypes.default.string.isRequired,
+
+    /**
+     * The icon that denoted close functionality
+     */
+    headerCloseImg: _propTypes.default.element.isRequired
+  }).isRequired,
+
+  /**
+   * The renderable footer element
+   */
+  footer: _propTypes.default.element.isRequired,
+
+  /**
+   * Node to be rendered
+   */
+  children: _propTypes.default.node
+} : void 0;
+Panel.defaultProps = {
+  open: false,
+  notifications: [],
+  children: null
+};
+//# sourceMappingURL=Panel.js.map

package/dist/NotificationPanel/Panel/Panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Panel.js","names":["EnterKeyCode","Panel","e","keyCode","onClose","props","classes","open","header","headerTitle","headerCloseImg","notifications","footer","children","newNotificationCount","_","filter","notification","isRead","length","root","panel","rootRef","titleContainer","title","close","onKeyDownClose","notificationsContainer","footerContainer","Component","propTypes","PropTypes","bool","arrayOf","shape","isRequired","string","func","element","node","defaultProps"],"sources":["../../../src/NotificationPanel/Panel/Panel.js"],"sourcesContent":["import React, { Component } from \"react\";\nimport PropTypes from \"prop-types\";\nimport _ from \"lodash\";\nimport { HvBadge } from \"@hitachivantara/uikit-react-core\";\n\nconst EnterKeyCode = 13;\n\nexport default class Panel extends Component {\n  onKeyDownClose = (e) => {\n    if (e.keyCode === EnterKeyCode) {\n      const { onClose } = this.props;\n      onClose();\n    }\n  };\n\n  render() {\n    const {\n      classes,\n      open,\n      header: { headerTitle, headerCloseImg },\n      notifications,\n      onClose,\n      footer,\n      children,\n    } = this.props;\n    const newNotificationCount = _.filter(\n      notifications,\n      (notification) => !notification.isRead\n    ).length;\n\n    return (\n      <div\n        className={`${classes.root} ${open ? classes.open : \"\"} ${classes.panel}`}\n        ref={this.rootRef}\n      >\n        <div className={classes.header}>\n          <div className={classes.titleContainer}>\n            <div className={classes.title}>{headerTitle}</div>\n            <HvBadge count={newNotificationCount} showCount />\n          </div>\n          <div\n            role=\"button\"\n            className={classes.close}\n            tabIndex=\"0\"\n            onKeyDown={this.onKeyDownClose}\n            onClick={onClose}\n          >\n            {headerCloseImg}\n          </div>\n        </div>\n        <div className={classes.notificationsContainer}>{children}</div>\n        <div className={classes.footerContainer}>{footer}</div>\n      </div>\n    );\n  }\n}\n\nPanel.propTypes = {\n  /**\n   * 'true' if the panel is open or 'false if the panel is closed\n   */\n  open: PropTypes.bool,\n  /**\n   * Number of new notifications\n   */\n  notifications: PropTypes.arrayOf(\n    PropTypes.shape({\n      /**\n       * 'true' if notification has been read; 'false' otherwise\n       */\n      isRead: PropTypes.bool.isRequired,\n    }).isRequired\n  ),\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * styles applied to the panel\n     */\n    panel: PropTypes.string,\n    root: PropTypes.string,\n    open: PropTypes.string,\n    header: PropTypes.string,\n    titleContainer: PropTypes.string,\n    title: PropTypes.string,\n    close: PropTypes.string,\n    notificationsContainer: PropTypes.string,\n    footerContainer: PropTypes.string,\n  }).isRequired,\n  /**\n   * The function that will be executed when the panel is closed\n   */\n  onClose: PropTypes.func.isRequired,\n  /**\n   * Object that holds header properties\n   */\n  header: PropTypes.shape({\n    /**\n     * The title of the header\n     */\n    headerTitle: PropTypes.string.isRequired,\n    /**\n     * The icon that denoted close functionality\n     */\n    headerCloseImg: PropTypes.element.isRequired,\n  }).isRequired,\n  /**\n   * The renderable footer element\n   */\n  footer: PropTypes.element.isRequired,\n  /**\n   * Node to be rendered\n   */\n  children: PropTypes.node,\n};\n\nPanel.defaultProps = {\n  open: false,\n  notifications: [],\n  children: null,\n};\n"],"mappings":"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"}

package/dist/NotificationPanel/Panel/index.js

@@ -0,0 +1,21 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _withStyles = _interopRequireDefault(require("@material-ui/core/styles/withStyles"));
+
+var _styles = _interopRequireDefault(require("./styles"));
+
+var _Panel = _interopRequireDefault(require("./Panel"));
+
+var _default = (0, _withStyles.default)(_styles.default, {
+  name: "HvNotificationPanelPanel"
+})(_Panel.default);
+
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/dist/NotificationPanel/Panel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["withStyles","styles","name","Panel"],"sources":["../../../src/NotificationPanel/Panel/index.js"],"sourcesContent":["import withStyles from \"@material-ui/core/styles/withStyles\";\nimport styles from \"./styles\";\nimport Panel from \"./Panel\";\n\nexport default withStyles(styles, { name: \"HvNotificationPanelPanel\" })(Panel);\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;eAEe,IAAAA,mBAAA,EAAWC,eAAX,EAAmB;EAAEC,IAAI,EAAE;AAAR,CAAnB,EAAyDC,cAAzD,C"}