@urbanos/react-discovery-ui 2.1.43

package/lib/components/recommendation-list/recommendation-list.js

@@ -0,0 +1,72 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("react");
+var _reactTooltip = _interopRequireDefault(require("react-tooltip"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+require("./recommendation-list.scss");
+var _reactCopyToClipboard = require("react-copy-to-clipboard");
+var _utils = require("../../utils");
+var _FilterNone = _interopRequireDefault(require("@material-ui/icons/FilterNone"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+var RecommendationList = function RecommendationList(props) {
+  var recommendations = props.recommendations;
+  var _useState = (0, _react.useState)(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    showTooltipAsCopied = _useState2[0],
+    setShowTooltipAsCopied = _useState2[1];
+  var createHoverText = function createHoverText(systemName) {
+    return showTooltipAsCopied ? 'Copied!' : "Copy table name '".concat(systemName, "'");
+  };
+  var onCopyClick = function onCopyClick() {
+    setShowTooltipAsCopied(true);
+  };
+  var recommendationItems = function recommendationItems() {
+    return recommendations.map(function (recommendation) {
+      return /*#__PURE__*/React.createElement("div", {
+        key: recommendation.id
+      }, /*#__PURE__*/React.createElement(_reactTooltip.default, {
+        id: recommendation.id,
+        effect: "solid",
+        afterHide: function afterHide() {
+          return setShowTooltipAsCopied(false);
+        },
+        getContent: [function () {
+          return createHoverText(recommendation.systemName);
+        }]
+      }), /*#__PURE__*/React.createElement(_reactCopyToClipboard.CopyToClipboard, {
+        text: recommendation.systemName,
+        className: "action copy-table-name-icon",
+        onCopy: function onCopy() {
+          return onCopyClick();
+        }
+      }, /*#__PURE__*/React.createElement(_FilterNone.default, {
+        "data-for": recommendation.id,
+        "data-tip": ""
+      })), /*#__PURE__*/React.createElement("div", {
+        className: "recommendation"
+      }, /*#__PURE__*/React.createElement("a", {
+        role: "link",
+        href: _utils.RecommendationUtils.getDatasetUrl(recommendation),
+        target: "_blank",
+        className: "action"
+      }, recommendation.dataTitle)));
+    });
+  };
+  return /*#__PURE__*/React.createElement("recommendation-list", null, /*#__PURE__*/React.createElement("div", {
+    className: "list-box"
+  }, recommendationItems()));
+};
+RecommendationList.propTypes = {
+  recommendations: _propTypes.default.array
+};
+var _default = exports.default = RecommendationList;

package/lib/components/recommendation-list/recommendation-list.scss

@@ -0,0 +1,61 @@
+@import "../../styles/variables.scss";
+@import "../../styles/mixins.scss";
+
+recommendation-list {
+  .recommendation {
+    line-height: 1rem;
+    margin-bottom: 0.7rem;
+    width: 85%;
+    display: inline-block;
+
+    a {
+      word-break: break-all;
+    }
+  }
+
+  .list-box {
+    border: 1px solid $light-grey;
+    max-height: 100%;
+    overflow-y: auto;
+    border: 1px solid $almost-black;
+    display: inline-block;
+    padding: 0.5em;
+
+    &::-webkit-scrollbar {
+      -webkit-appearance: none;
+    }
+
+    &::-webkit-scrollbar:vertical {
+      width: 11px;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      border-radius: 8px;
+      border: 2px solid white;
+      background-color: $almost-black;
+    }
+  }
+
+  .copy-table-name-icon {
+    vertical-align: top;
+    margin-right: 0.4rem;
+    width: 10%;
+    height: 1.4rem;
+  }
+
+  .action {
+    color: $dark-blue;
+
+    &:hover {
+      color: $almost-black;
+    }
+
+    &:active {
+      color: $dark-grey;
+    }
+  }
+
+  a {
+    @include link();
+  }
+}

package/lib/components/recommendation-list/recommendation-list.test.js

@@ -0,0 +1,38 @@
+import { mount } from 'enzyme'
+import ReactTooltip from 'react-tooltip'
+import RecommendationList from './recommendation-list'
+import { recommendations } from '../../../test-helpers/recommendations'
+import { act } from 'react-dom/test-utils'
+
+let subject
+
+describe('RecommendationList', () => {
+  describe('with data', () => {
+    beforeEach(() => {
+      subject = mount(<RecommendationList
+        recommendations={recommendations}
+                      />)
+    })
+
+    test('returns urls for each recommended dataset', () => {
+      expect(subject.find('.recommendation').length).toEqual(recommendations.length)
+    })
+
+    test('shows tooltips with table names for copy buttons', () => {
+      expect(subject.contains(ReactTooltip)).toBeTruthy()
+      const tooltips = subject.find(ReactTooltip).map((elem) => elem.text())
+      expect(tooltips).toContain(`Copy table name '${recommendations[0].systemName}'`)
+    })
+
+    test('copy button changes tooltip text to "Copied" when it is clicked', () => {
+      subject.find('.copy-table-name-icon').at(0).simulate('click')
+      expect(subject.find(ReactTooltip).at(0).text()).toEqual('Copied!')
+    })
+
+    test('tooltip changes back to table name text after it disapears', () => {
+      subject.find('.copy-table-name-icon').at(0).simulate('click')
+      act(() => { subject.find(ReactTooltip).at(0).prop('afterHide')() })
+      expect(subject.find(ReactTooltip).at(0).text()).toEqual(`Copy table name '${recommendations[0].systemName}'`)
+    })
+  })
+})

package/lib/components/remote-toggle/__snapshots__/remote-toggle.test.js.snap

@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<RemoteToggle /> renders 1`] = `ShallowWrapper {}`;

package/lib/components/remote-toggle/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _remoteToggle.default;
+  }
+});
+var _remoteToggle = _interopRequireDefault(require("./remote-toggle"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/lib/components/remote-toggle/remote-toggle.js

@@ -0,0 +1,35 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
+function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
+function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
+function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
+var RemoteToggle = /*#__PURE__*/function (_Component) {
+  function RemoteToggle() {
+    _classCallCheck(this, RemoteToggle);
+    return _callSuper(this, RemoteToggle, arguments);
+  }
+  _inherits(RemoteToggle, _Component);
+  return _createClass(RemoteToggle, [{
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/_react.default.createElement("div", null, "RemoteToggle");
+    }
+  }]);
+}(_react.Component);
+var _default = exports.default = RemoteToggle;

package/lib/components/remote-toggle/remote-toggle.test.js

@@ -0,0 +1,10 @@
+import React from 'react'
+import { shallow } from 'enzyme'
+import RemoteToggle from './remote-toggle'
+
+describe('<RemoteToggle />', () => {
+  test('renders', () => {
+    const wrapper = shallow(<RemoteToggle />)
+    expect(wrapper).toMatchSnapshot()
+  })
+})

package/lib/components/share/index.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _share = _interopRequireDefault(require("./share"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = _share.default;

package/lib/components/share/share.js

@@ -0,0 +1,109 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("./share.scss");
+var _react = _interopRequireDefault(require("react"));
+var _reactShare = require("react-share");
+var _reactCopyToClipboard = require("react-copy-to-clipboard");
+var _FileCopyOutlined = _interopRequireDefault(require("@material-ui/icons/FileCopyOutlined"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
+function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
+function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
+function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
+var Share = /*#__PURE__*/function (_React$Component) {
+  function Share(props) {
+    var _this;
+    _classCallCheck(this, Share);
+    _this = _callSuper(this, Share, [props]);
+    _this.state = {
+      copyMessage: 'Copy Link'
+    };
+    return _this;
+  }
+  _inherits(Share, _React$Component);
+  return _createClass(Share, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+      var shareLocation = window.location.href;
+      var iconSize = 32;
+      var iconBgStyle = {};
+      return /*#__PURE__*/_react.default.createElement("share-zone", null, /*#__PURE__*/_react.default.createElement("div", {
+        className: "share-header"
+      }, "SHARE DATASET"), /*#__PURE__*/_react.default.createElement("div", {
+        className: "share-icons"
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        "data-testid": "social-media-twitter"
+      }, /*#__PURE__*/_react.default.createElement(_reactShare.TwitterShareButton, {
+        url: shareLocation,
+        className: "shareButton",
+        additionalProps: {
+          'aria-label': 'Twitter Share'
+        }
+      }, /*#__PURE__*/_react.default.createElement(_reactShare.TwitterIcon, {
+        iconBgStyle: iconBgStyle,
+        round: true,
+        iconFillColor: "#00aced",
+        size: iconSize
+      }))), /*#__PURE__*/_react.default.createElement("div", {
+        "data-testid": "social-media-facebook"
+      }, /*#__PURE__*/_react.default.createElement(_reactShare.FacebookShareButton, {
+        url: shareLocation,
+        className: "shareButton",
+        additionalProps: {
+          'aria-label': 'Facebook Share'
+        }
+      }, /*#__PURE__*/_react.default.createElement(_reactShare.FacebookIcon, {
+        iconBgStyle: iconBgStyle,
+        round: true,
+        iconFillColor: "#3b5998",
+        className: "icon",
+        size: iconSize
+      }))), /*#__PURE__*/_react.default.createElement("div", {
+        "data-testid": "social-media-linkedin"
+      }, /*#__PURE__*/_react.default.createElement(_reactShare.LinkedinShareButton, {
+        url: shareLocation,
+        className: "shareButton",
+        additionalProps: {
+          'aria-label': 'Linked In Share'
+        }
+      }, /*#__PURE__*/_react.default.createElement(_reactShare.LinkedinIcon, {
+        iconBgStyle: iconBgStyle,
+        round: true,
+        iconFillColor: "#3b5998",
+        className: "icon",
+        size: iconSize
+      })))), /*#__PURE__*/_react.default.createElement(_reactCopyToClipboard.CopyToClipboard, {
+        style: {
+          height: "".concat(iconSize, "px")
+        },
+        text: shareLocation,
+        onCopy: function onCopy() {
+          return _this2.setState({
+            copyMessage: 'Copied!'
+          });
+        }
+      }, /*#__PURE__*/_react.default.createElement("button", {
+        tabIndex: "0",
+        className: "primary-background-color clipboard button"
+      }, /*#__PURE__*/_react.default.createElement(_FileCopyOutlined.default, null), /*#__PURE__*/_react.default.createElement("div", {
+        "data-testid": "clipboard",
+        className: "copy"
+      }, this.state.copyMessage))));
+    }
+  }]);
+}(_react.default.Component);
+var _default = exports.default = Share;

package/lib/components/share/share.scss

@@ -0,0 +1,66 @@
+@import '../../styles/mixins.scss';
+@import '../../styles/variables.scss';
+
+share-zone {
+    @include custom-element();
+    width: 100%;
+    padding: 1.125rem 0;
+    margin-top: 1rem;
+    border-top: 1px solid $light-grey;
+
+    .share-header,
+    .name {
+        @include header-small();
+        margin-bottom: 0.5rem;
+    }
+
+    .button {
+        text-decoration: none;
+        border-width: 0px;
+        margin-top: 0.75rem;
+        border-style: none;
+        display: flex;
+        align-items: center;
+        text-align: center;
+        overflow: hidden;
+        cursor: pointer;
+        border-radius: 8px;
+        height: 32px;
+        color: white;
+        padding: 6px;
+
+        &:hover {
+            color: white;
+            background-color: $almost-black;
+            text-decoration: underline;
+        }
+    }
+
+    .share-icons {
+        display: flex;
+    }
+
+    .shareButton {
+        margin: 0 0.5rem 0 0;
+        cursor: pointer;
+        width: 32px;
+        height: 32px;
+        border-radius: 32px;
+    }
+
+    .shareButton:hover {
+        opacity: 0.75;
+    }
+
+    .clipboard {
+        text-align: center;
+        display: flex;
+        color: white;
+        font-weight: bold;
+        font-size: 0.9rem;
+        height: 32px;
+        color: white;
+        display: flex;
+        padding: 6px;
+    }
+}

package/lib/components/streaming-api-doc/index.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _streamingApiDoc = _interopRequireDefault(require("./streaming-api-doc"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = _streamingApiDoc.default;

package/lib/components/streaming-api-doc/streaming-api-doc.js

@@ -0,0 +1,76 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("./streaming-api-doc.scss");
+var _react = require("react");
+var _collapsableBox = _interopRequireDefault(require("../../components/collapsable-box"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
+function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
+function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
+function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
+var _default = exports.default = /*#__PURE__*/function (_Component) {
+  function _default() {
+    _classCallCheck(this, _default);
+    return _callSuper(this, _default, arguments);
+  }
+  _inherits(_default, _Component);
+  return _createClass(_default, [{
+    key: "streamingHeader",
+    value: function streamingHeader() {
+      return /*#__PURE__*/React.createElement("div", null, "Access Operating System data through a websocket.");
+    }
+  }, {
+    key: "streamingBody",
+    value: function streamingBody() {
+      var dataset = this.props.dataset;
+      var systemName = dataset.organization.name + '__' + dataset.name;
+      return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+        className: "example-container"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "example-header"
+      }, "Example using ", /*#__PURE__*/React.createElement("a", {
+        role: "link",
+        href: "https://github.com/vi/websocat"
+      }, "Websocat"), " on a terminal"), /*#__PURE__*/React.createElement("div", {
+        className: "example-code"
+      }, /*#__PURE__*/React.createElement("code", null, /*#__PURE__*/React.createElement("div", null, "websocat ".concat(window.DISC_STREAMS_URL, "/socket/websocket -H='User-Agent: websocat'")), /*#__PURE__*/React.createElement("div", null, "{\"topic\": \"streaming:".concat(systemName, "\",\"event\":\"phx_join\",\"payload\":{\"api_key\":\"USER_API_KEY_HERE\"},\"ref\":\"1\"}")))), /*#__PURE__*/React.createElement("div", {
+        className: "example-header"
+      }, "Phoenix Channels clients"), /*#__PURE__*/React.createElement("div", null, "For application development, look at the ", /*#__PURE__*/React.createElement("a", {
+        role: "link",
+        href: "https://www.npmjs.com/package/phoenix",
+        target: "_blank"
+      }, "official Phoenix Javascript library"), ", or one of the ", /*#__PURE__*/React.createElement("a", {
+        role: "link",
+        href: "https://hexdocs.pm/phoenix/channels.html#client-libraries",
+        target: "_blank"
+      }, "other client libraries"))));
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      if (!this.props.dataset) {
+        return /*#__PURE__*/React.createElement("streaming-api-doc", null);
+      }
+      return /*#__PURE__*/React.createElement("streaming-api-doc", {
+        class: "streaming-api-doc"
+      }, /*#__PURE__*/React.createElement(_collapsableBox.default, {
+        title: "Websocket Streaming Example",
+        headerHtml: this.streamingHeader(),
+        expanded: this.props.expanded
+      }, this.streamingBody()));
+    }
+  }]);
+}(_react.Component);

package/lib/components/streaming-api-doc/streaming-api-doc.scss

@@ -0,0 +1,23 @@
+@import '../../styles/mixins.scss';
+@import '../../styles/variables.scss';
+
+streaming-api-doc {
+  .example-container {
+    justify-content: space-between;
+    padding: 0px 20px 20px 20px
+  }
+
+  .example-code {
+    border-radius: 5px;
+    border: $medium-grey solid 1px;
+    background-color: $super-light-grey;
+    padding: 10px;
+    overflow-wrap: break-word;
+    word-wrap: break-word;
+  }
+
+  .example-header {
+    font-weight: bold;
+    padding-top: 1rem
+  }
+}

package/lib/components/streaming-api-doc/streaming-api-doc.test.js

@@ -0,0 +1,24 @@
+import { render } from 'enzyme'
+import StreamingApiDoc from './streaming-api-doc'
+
+describe('streaming-api-doc element', () => {
+  let subject
+
+  beforeEach(() => {
+    const matchMedia = jest.fn()
+    Object.defineProperty(window, 'matchMedia', {
+      writable: true,
+      value: jest.fn().mockImplementation(query => ({
+        matches: true
+      }))
+    })
+  })
+
+  test('the example should have proper topic', () => {
+    subject = render(<StreamingApiDoc dataset={{ id: 'coda_stuff', name: 'data_name', organization: { name: 'org_name', sourceType: 'stream' } }} />)
+
+    expect(subject.find('.example-code').text()).toContain(
+      'streaming:org_name__data_name'
+    )
+  })
+})

package/lib/components/tooltip/index.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _tooltip = _interopRequireDefault(require("./tooltip"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = _tooltip.default;

package/lib/components/tooltip/tooltip.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+require("./tooltip.scss");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = function _default(_ref) {
+  var text = _ref.text;
+  return /*#__PURE__*/_react.default.createElement("span", {
+    className: "tooltip"
+  }, text, /*#__PURE__*/_react.default.createElement("div", {
+    className: "tooltip-text"
+  }, text));
+};

package/lib/components/tooltip/tooltip.scss

@@ -0,0 +1,16 @@
+@import '../../styles/variables.scss';
+
+.tooltip-text {
+  visibility: hidden;
+  background-color: $dark-grey;
+  color: #fff;
+  text-align: center;
+  border-radius: 0.5rem;
+  padding: 0.5rem 1rem;
+  position: absolute;
+  z-index: 1;
+}
+
+.tooltip:hover .tooltip-text {
+  visibility: visible;
+}

package/lib/components/tooltip/tooltip.test.js

@@ -0,0 +1,19 @@
+import { render } from 'enzyme'
+import Tooltip from '.'
+
+describe('tooltip', () => {
+  const text = 'LOL OMG'
+  let subject
+
+  beforeEach(() => {
+    subject = render(<Tooltip text={text} />)
+  })
+
+  it('contains the given text', () => {
+    expect(subject.text()).toContain(text)
+  })
+
+  it('contains the same text in a tooltip', () => {
+    expect(subject.find('.tooltip-text').text()).toBe(text)
+  })
+})

package/lib/components/visualization-list-menu-item/index.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _visualizationListMenuItem = _interopRequireDefault(require("./visualization-list-menu-item"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = _visualizationListMenuItem.default;