@instructure/quiz-core 17.19.2-rc.5 → 17.19.3-rc.2

package/lib/common/components/ImportModal/presenter.js

@@ -0,0 +1,442 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ImportModal = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
+
+var _uiAlerts = require("@instructure/ui-alerts");
+
+var _uiButtons = require("@instructure/ui-buttons");
+
+var _uiText = require("@instructure/ui-text");
+
+var _uiProgress = require("@instructure/ui-progress");
+
+var _uiHeading = require("@instructure/ui-heading");
+
+var _uiTabs = require("@instructure/ui-tabs");
+
+var _uiToggleDetails = require("@instructure/ui-toggle-details");
+
+var _uiTextInput = require("@instructure/ui-text-input");
+
+var _uiThemeable = require("@instructure/ui-themeable");
+
+var _quizCommon = require("@instructure/quiz-common");
+
+var _theme = _interopRequireDefault(require("./theme.js"));
+
+var _index = _interopRequireDefault(require("./ImportFileSelector/index.js"));
+
+var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
+
+var _dec, _class, _class2, _temp;
+
+var styles = {
+  componentId: 'ceoks',
+  template: function template(theme) {
+    return "\n\n.ceoks_bOkE{margin-top:".concat(theme.altTextMargin || 'inherit', "}");
+  },
+  'altTextWrapper': 'ceoks_bOkE'
+};
+var ImportModal = (_dec = (0, _uiThemeable.themeable)(_theme.default, styles), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(ImportModal, _Component);
+
+  var _super = (0, _createSuper2.default)(ImportModal);
+
+  function ImportModal() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, ImportModal);
+
+    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));
+    _this.state = {
+      selectedTabIndex: 0
+    };
+
+    _this.componentDidUpdate = function (prevProps, prevState) {
+      if (!_this.props.modalOpen) {
+        return;
+      }
+
+      var _this$props = _this.props,
+          disableConfirm = _this$props.disableConfirm,
+          uploadStatus = _this$props.uploadStatus;
+      var isUploadSuccess = uploadStatus === _quizCommon.FILE_UPLOAD_SUCCESS && uploadStatus !== prevProps.uploadStatus;
+
+      if (disableConfirm && isUploadSuccess) {
+        _this.continueAction();
+      }
+
+      if (uploadStatus !== prevProps.uploadStatus) {
+        _this.alertScreenreader();
+      }
+    };
+
+    _this.cancelAction = function () {
+      _this.props.clearFiles();
+
+      _this.props.clearAltText();
+
+      if (_this.props.closeOverride) {
+        // this timeout is needed because if this modal closes first,
+        // then the ItemFeedbackModal will also close in the same click
+        // since it will think the click happened "onOverlayClick"
+        setTimeout(_this.props.closeOverride);
+      } else {
+        _this.props.closeModal();
+      } // Wait for the modal to close before setting the status to prevent flashing
+      // the select screen when closing the modal due to the modal having a gradual
+      // fade transition that will display the change in state
+
+
+      setTimeout(function () {
+        return _this.props.setUploadStatus(_quizCommon.FILE_UPLOAD_SELECT);
+      }, 300);
+    };
+
+    _this.errorAction = function () {
+      return _this.props.setUploadStatus(_quizCommon.FILE_UPLOAD_ERROR);
+    };
+
+    _this.continueAction = function () {
+      var uploadStatus = _this.props.uploadStatus;
+
+      switch (uploadStatus) {
+        case _quizCommon.FILE_UPLOAD_SUCCESS:
+        case _quizCommon.FILE_UPLOAD_FAILURE:
+          _this.cancelAction();
+
+          break;
+
+        case _quizCommon.FILE_UPLOAD_ERROR:
+          _this.props.clearFiles();
+
+          _this.props.clearAltText();
+
+          _this.props.setUploadStatus(_quizCommon.FILE_UPLOAD_SELECT);
+
+          break;
+
+        default:
+          _this.props.fileUpload(_this.props.files.get(0), _this.errorAction, _this.props.altText);
+
+          _this.props.setUploadStatus(_quizCommon.FILE_UPLOAD_IMPORTING);
+
+          _this.props.onContinue();
+
+          break;
+      }
+    };
+
+    _this.handleFile = function (file) {
+      _this.props.receiveFile(file);
+
+      _this.confirmButton.focus();
+    };
+
+    _this.onAltTextChange = function (e) {
+      _this.props.setAltText(e.target.value);
+    };
+
+    _this.handleTabChange = function (event, _ref) {
+      var index = _ref.index;
+
+      _this.setState({
+        selectedTabIndex: index
+      });
+    };
+
+    return _this;
+  }
+
+  (0, _createClass2.default)(ImportModal, [{
+    key: "componentDidUpdate",
+    value: function componentDidUpdate() {
+      if (this.props.uploadStatus === _quizCommon.FILE_UPLOAD_SUCCESS && this.props.modalOpen) {
+        this.cancelAction();
+      }
+    }
+  }, {
+    key: "setRef",
+    value: function setRef(refName) {
+      var _this2 = this;
+
+      return function (node) {
+        _this2[refName] = node;
+      };
+    }
+  }, {
+    key: "disableCancelButton",
+    value: function disableCancelButton() {
+      var uploadStatus = this.props.uploadStatus;
+      return [_quizCommon.FILE_UPLOAD_ERROR, _quizCommon.FILE_UPLOAD_FAILURE, _quizCommon.FILE_UPLOAD_SUCCESS].includes(uploadStatus);
+    }
+  }, {
+    key: "cancelButton",
+    value: function cancelButton() {
+      return /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
+        disabled: this.disableCancelButton(),
+        onClick: this.cancelAction,
+        margin: _quizCommon.XSMALL_SIDE_MARGIN,
+        ref: this.setRef('cancelImportButton'),
+        "data-automation": "sdk-cancel-import-button"
+      }, (0, _formatMessage.default)('Cancel'));
+    }
+  }, {
+    key: "disableContinueButton",
+    value: function disableContinueButton() {
+      var _this$props2 = this.props,
+          uploadStatus = _this$props2.uploadStatus,
+          files = _this$props2.files;
+      return uploadStatus === _quizCommon.FILE_UPLOAD_IMPORTING || files.size === 0;
+    }
+  }, {
+    key: "continueButtonMessage",
+    value: function continueButtonMessage() {
+      var uploadStatus = this.props.uploadStatus;
+
+      switch (uploadStatus) {
+        case _quizCommon.FILE_UPLOAD_FAILURE:
+          return (0, _formatMessage.default)('Okay');
+
+        case _quizCommon.FILE_UPLOAD_SUCCESS:
+          return (0, _formatMessage.default)('Done');
+
+        case _quizCommon.FILE_UPLOAD_ERROR:
+          return (0, _formatMessage.default)('Start Over');
+
+        default:
+          return (0, _formatMessage.default)('Import');
+      }
+    }
+  }, {
+    key: "continueButton",
+    value: function continueButton() {
+      return /*#__PURE__*/_react.default.createElement(_uiButtons.Button, {
+        onClick: this.continueAction,
+        variant: "primary",
+        disabled: this.disableContinueButton(),
+        margin: _quizCommon.XSMALL_SIDE_MARGIN,
+        ref: this.setRef('confirmButton'),
+        "data-automation": "sdk-continue-import-button"
+      }, this.continueButtonMessage());
+    }
+  }, {
+    key: "renderErroredContent",
+    value: function renderErroredContent() {
+      return /*#__PURE__*/_react.default.createElement(_uiAlerts.Alert, {
+        variant: "error",
+        ref: this.setRef('errorAlert')
+      }, this.uploadStatusMessage());
+    }
+  }, {
+    key: "renderSelectingContent",
+    value: function renderSelectingContent(fileType) {
+      return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", null, this.props.importMessage), /*#__PURE__*/_react.default.createElement(_index.default, {
+        files: this.props.files,
+        ref: this.setRef('fileSelector'),
+        receiveFile: this.handleFile,
+        acceptAttribute: fileType,
+        "data-automation": "sdk-import-file-selector"
+      }), fileType === 'image/*' && /*#__PURE__*/_react.default.createElement("div", {
+        className: styles.altTextWrapper
+      }, /*#__PURE__*/_react.default.createElement(_uiTextInput.TextInput, {
+        ref: this.setRef('altTextInput'),
+        onChange: this.onAltTextChange,
+        value: this.props.altText,
+        renderLabel: /*#__PURE__*/_react.default.createElement("div", null, (0, _formatMessage.default)('alt text (optional)')),
+        type: "text"
+      })));
+    }
+  }, {
+    key: "renderFailureContent",
+    value: function renderFailureContent() {
+      return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_uiAlerts.Alert, {
+        variant: "error",
+        ref: this.setRef('failureAlert'),
+        "data-automation": "sdk-import-error-alert"
+      }, /*#__PURE__*/_react.default.createElement("div", null, this.uploadStatusMessage(), /*#__PURE__*/_react.default.createElement(_uiToggleDetails.ToggleDetails, {
+        summary: /*#__PURE__*/_react.default.createElement(_uiText.Text, {
+          size: "small"
+        }, (0, _formatMessage.default)('Error Details'))
+      }, /*#__PURE__*/_react.default.createElement(_uiText.Text, {
+        size: "small"
+      }, this.props.failureMessage)))));
+    }
+  }, {
+    key: "renderSuccessContent",
+    value: function renderSuccessContent() {
+      return /*#__PURE__*/_react.default.createElement(_uiAlerts.Alert, {
+        variant: "success",
+        ref: this.setRef('successAlert'),
+        "data-automation": "sdk-import-success-alert"
+      }, this.uploadStatusMessage());
+    }
+  }, {
+    key: "renderImportingContent",
+    value: function renderImportingContent() {
+      return /*#__PURE__*/_react.default.createElement(_uiProgress.Progress, {
+        label: (0, _formatMessage.default)('Import process completion'),
+        valueNow: this.props.progressValue,
+        ref: this.setRef('progressBar')
+      });
+    }
+  }, {
+    key: "uploadStatusMessage",
+    value: function uploadStatusMessage() {
+      if (this.props.uploadStatus === _quizCommon.FILE_UPLOAD_FAILURE) {
+        return (0, _formatMessage.default)('Error: there was a problem importing your file.');
+      } else if (this.props.uploadStatus === _quizCommon.FILE_UPLOAD_ERROR) {
+        return (0, _formatMessage.default)('Error: there was a problem uploading your file.');
+      } else if (this.props.uploadStatus === _quizCommon.FILE_UPLOAD_SUCCESS) {
+        var file = this.props.files.get(0);
+        var fileName = file ? file.name : '';
+        return (0, _formatMessage.default)('Success: {fileName} has imported successfully!', {
+          fileName: fileName
+        });
+      }
+    }
+  }, {
+    key: "alertScreenreader",
+    value: function alertScreenreader() {
+      var msg = this.uploadStatusMessage();
+
+      if (msg) {
+        this.props.screenreaderNotification(msg);
+      }
+    }
+  }, {
+    key: "renderImportContent",
+    value: function renderImportContent(fileType) {
+      switch (this.props.uploadStatus) {
+        case _quizCommon.FILE_UPLOAD_FAILURE:
+          return this.renderFailureContent();
+
+        case _quizCommon.FILE_UPLOAD_SUCCESS:
+          return this.renderSuccessContent();
+
+        case _quizCommon.FILE_UPLOAD_ERROR:
+          return this.renderErroredContent();
+
+        case _quizCommon.FILE_UPLOAD_IMPORTING:
+          return this.renderImportingContent();
+
+        default:
+          return this.renderSelectingContent(fileType);
+      }
+    }
+  }, {
+    key: "renderContent",
+    value: function renderContent() {
+      var _this3 = this;
+
+      if (typeof this.props.acceptFileType === 'string') {
+        return this.renderImportContent(this.props.acceptFileType);
+      }
+
+      var selectedIndex = this.state.selectedTabIndex;
+      return /*#__PURE__*/_react.default.createElement(_uiTabs.Tabs, {
+        onRequestTabChange: this.handleTabChange,
+        variant: "secondary"
+      }, this.props.acceptFileType.map(function (_ref2, index) {
+        var fileType = _ref2.fileType,
+            title = _ref2.title;
+        return /*#__PURE__*/_react.default.createElement(_uiTabs.Tabs.Panel, {
+          key: title,
+          renderTitle: title,
+          disabled: _this3.props.files.size > 0 && index !== selectedIndex,
+          isSelected: selectedIndex === index
+        }, _this3.renderImportContent(fileType));
+      }));
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/_react.default.createElement(_quizCommon.ImportantModal, {
+        open: this.props.modalOpen,
+        size: "small",
+        onClose: this.props.onClose,
+        onDismiss: this.cancelAction,
+        label: (0, _formatMessage.default)('Import Content'),
+        ref: this.setRef('modal'),
+        "data-automation": "sdk-import-content-modal"
+      }, /*#__PURE__*/_react.default.createElement(_quizCommon.ModalHeader, null, /*#__PURE__*/_react.default.createElement(_uiHeading.Heading, {
+        level: "reset",
+        as: "h2"
+      }, (0, _formatMessage.default)('Import Content')), /*#__PURE__*/_react.default.createElement(_uiButtons.CloseButton, {
+        onClick: this.cancelAction,
+        placement: "end",
+        offset: "medium",
+        screenReaderLabel: (0, _formatMessage.default)('Close')
+      })), /*#__PURE__*/_react.default.createElement(_quizCommon.ModalBody, null, this.renderContent()), /*#__PURE__*/_react.default.createElement(_quizCommon.ModalFooter, null, this.cancelButton(), this.continueButton()));
+    }
+  }]);
+  ImportModal.displayName = "ImportModal";
+  return ImportModal;
+}(_react.Component), _class2.propTypes = {
+  acceptFileType: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.shape({
+    fileType: _propTypes.default.string,
+    title: _propTypes.default.string
+  }))]).isRequired,
+  altText: _propTypes.default.string.isRequired,
+  // passed in by connect
+  clearAltText: _propTypes.default.func.isRequired,
+  // passed in by connect
+  clearFiles: _propTypes.default.func.isRequired,
+  // passed in by connect
+  closeModal: _propTypes.default.func.isRequired,
+  // passed in by connect
+  closeOverride: _propTypes.default.func,
+  disableConfirm: _propTypes.default.bool,
+  failureMessage: _propTypes.default.string.isRequired,
+  files: _reactImmutableProptypes.default.list.isRequired,
+  // passed in by connect
+  fileUpload: _propTypes.default.func.isRequired,
+  importMessage: _propTypes.default.string.isRequired,
+  modalOpen: _propTypes.default.bool.isRequired,
+  // passed in by connect
+  onClose: _propTypes.default.func,
+  onContinue: _propTypes.default.func.isRequired,
+  progressValue: _propTypes.default.number.isRequired,
+  receiveFile: _propTypes.default.func.isRequired,
+  // passed in by connect
+  screenreaderNotification: _propTypes.default.func.isRequired,
+  // passed in by connect
+  setAltText: _propTypes.default.func.isRequired,
+  // passed in by connect
+  setUploadStatus: _propTypes.default.func.isRequired,
+  // passed in by connect
+  uploadStatus: _propTypes.default.oneOf([_quizCommon.FILE_UPLOAD_SELECT, _quizCommon.FILE_UPLOAD_IMPORTING, _quizCommon.FILE_UPLOAD_SUCCESS, _quizCommon.FILE_UPLOAD_FAILURE, _quizCommon.FILE_UPLOAD_ERROR]).isRequired // passed in by connect
+
+}, _class2.defaultProps = {
+  closeOverride: null,
+  disableConfirm: false,
+  onClose: function onClose() {}
+}, _temp)) || _class);
+exports.ImportModal = ImportModal;
+var _default = ImportModal;
+exports.default = _default;

package/lib/common/components/ImportModal/theme.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = generator;
+
+function generator(_ref) {
+  var spacing = _ref.spacing;
+  return {
+    altTextMargin: spacing.large
+  };
+}

package/lib/common/components/LearnosityCalculator/index.js

@@ -0,0 +1,196 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.LearnosityCalculator = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _uiView = require("@instructure/ui-view");
+
+var _index = require("../../../taking/learnosity/index.js");
+
+var LearnosityCalculator = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(LearnosityCalculator, _Component);
+
+  var _super = (0, _createSuper2.default)(LearnosityCalculator);
+
+  function LearnosityCalculator() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, LearnosityCalculator);
+
+    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));
+    _this.state = {
+      learnosityCalculatorReady: false,
+      featureId: _this.props.featureId || "calc_".concat(new Date().getTime())
+    };
+
+    _this.handleClick = function () {
+      _this.toggle();
+
+      _this.props.setActiveCalculatorId(_this.state.featureId);
+    };
+
+    return _this;
+  }
+
+  (0, _createClass2.default)(LearnosityCalculator, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      if (this.props.calculatorType !== 'none') {
+        this.initializeLearnosity();
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.destroyLearnosity();
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      if (this.props.calculatorType !== 'none' && (prevProps.calculatorType === 'none' || this.props.quizSessionId && !prevProps.quizSessionId)) {
+        this.initializeLearnosity();
+      } else if (this.props.calculatorType === 'none' && prevProps.calculatorType !== 'none') {
+        this.destroyLearnosity();
+      } else if (this.props.activeCalculatorId !== prevProps.activeCalculatorId && this.props.activeCalculatorId !== this.state.featureId) {
+        this.toggle(false);
+      }
+    }
+  }, {
+    key: "initializeLearnosity",
+    value: function () {
+      var _initializeLearnosity = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+        return _regenerator.default.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                if (this.props.quizSessionId) {
+                  _context.next = 2;
+                  break;
+                }
+
+                return _context.abrupt("return");
+
+              case 2:
+                _context.next = 4;
+                return this.props.appendFeature(this.props.quizSessionId, {
+                  type: 'calculator',
+                  mode: this.props.calculatorType,
+                  feature_id: this.state.featureId
+                });
+
+              case 4:
+                if (!(this.props.calculatorType === 'none')) {
+                  _context.next = 6;
+                  break;
+                }
+
+                return _context.abrupt("return");
+
+              case 6:
+                this.setState({
+                  learnosityCalculatorReady: true
+                });
+
+              case 7:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee, this);
+      }));
+
+      function initializeLearnosity() {
+        return _initializeLearnosity.apply(this, arguments);
+      }
+
+      return initializeLearnosity;
+    }()
+  }, {
+    key: "destroyLearnosity",
+    value: function destroyLearnosity() {
+      this.props.destroyFeature(this.state.featureId);
+    }
+  }, {
+    key: "toggle",
+    value: function toggle(onOff) {
+      this.props.toggleFeature(this.state.featureId, onOff);
+    }
+  }, {
+    key: "renderCalculator",
+    value: function renderCalculator() {
+      return /*#__PURE__*/_react.default.createElement(_uiView.View, {
+        as: "div"
+      }, this.props.render({
+        toggleCalculator: this.handleClick,
+        enabled: this.state.learnosityCalculatorReady
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        hidden: true
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        className: // eslint-disable-next-line react/jsx-no-literals
+        "learnosity-feature feature-".concat(this.state.featureId)
+      })));
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      if (!this.props.quizSessionId || this.props.calculatorType === 'none') {
+        return null;
+      } else {
+        return this.renderCalculator();
+      }
+    }
+  }]);
+  LearnosityCalculator.displayName = "LearnosityCalculator";
+  return LearnosityCalculator;
+}(_react.Component);
+
+exports.LearnosityCalculator = LearnosityCalculator;
+LearnosityCalculator.propTypes = {
+  activeCalculatorId: _propTypes.default.string,
+  appendFeature: _propTypes.default.func.isRequired,
+  calculatorType: _propTypes.default.oneOf(['none', 'basic', 'scientific']),
+  destroyFeature: _propTypes.default.func.isRequired,
+  featureId: _propTypes.default.string,
+  quizSessionId: _propTypes.default.string,
+  render: _propTypes.default.func.isRequired,
+  setActiveCalculatorId: _propTypes.default.func,
+  toggleFeature: _propTypes.default.func.isRequired
+};
+LearnosityCalculator.defaultProps = {
+  activeCalculatorId: null,
+  appendFeature: _index.appendFeature,
+  calculatorType: 'none',
+  destroyFeature: _index.destroyFeature,
+  featureId: null,
+  quizSessionId: null,
+  setActiveCalculatorId: Function.prototype,
+  toggleFeature: _index.toggleFeature
+};
+var _default = LearnosityCalculator;
+exports.default = _default;

package/lib/common/components/Pin/Pin.examples.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {
+  maxExamplesPerPage: 1,
+  propValues: {
+    isPinned: [true, false]
+  },
+  getComponentProps: function getComponentProps(props) {
+    return {
+      position: 0,
+      pinSessionItem: Function.prototype,
+      variant: 'icon'
+    };
+  }
+};
+exports.default = _default;

package/lib/common/components/Pin/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Pin = void 0;
+
+var _presenter = require("./presenter.js");
+
+var Pin = _presenter.Pin;
+exports.Pin = Pin;
+var _default = Pin;
+exports.default = _default;