@instructure/outcomes-ui 2.1.0 → 2.1.3

package/es/translated/mi/components/AlignmentItem/index.js

@@ -0,0 +1,185 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import React, { useState, useEffect, useRef } from 'react';
+import PropTypes from 'prop-types';
+import { Checkbox } from '@instructure/ui-checkbox';
+import { Flex } from '@instructure/ui-flex';
+import { Text } from '@instructure/ui-text';
+import { IconArrowOpenDownLine, IconArrowOpenEndLine, IconTrashLine } from '@instructure/ui-icons';
+import { IconButton } from '@instructure/ui-buttons';
+import { ScreenReaderContent } from '@instructure/ui-a11y-content';
+import { Popover } from '@instructure/ui-popover';
+import { TruncateText } from '@instructure/ui-truncate-text';
+import { View } from '@instructure/ui-view';
+import OutcomeDescription from "../OutcomeDescription/index.js";
+import { outcomeShape } from "../../store/shapes.js";
+
+var AlignmentItem = function AlignmentItem(_ref) {
+  var outcome = _ref.outcome,
+      removeAlignment = _ref.removeAlignment,
+      canManageOutcomes = _ref.canManageOutcomes,
+      isTray = _ref.isTray,
+      shouldFocus = _ref.shouldFocus,
+      isOutcomeSelected = _ref.isOutcomeSelected,
+      selectOutcomeIds = _ref.selectOutcomeIds,
+      deselectOutcomeIds = _ref.deselectOutcomeIds;
+
+  var _useState = useState(true),
+      _useState2 = _slicedToArray(_useState, 2),
+      truncated = _useState2[0],
+      setTruncated = _useState2[1];
+
+  var id = outcome.id,
+      label = outcome.label,
+      title = outcome.title,
+      description = outcome.description;
+  var trashIconRef = useRef();
+
+  var toggleExpandOutcomeDetails = function toggleExpandOutcomeDetails() {
+    return setTruncated(function (prevState) {
+      return !prevState;
+    });
+  };
+
+  useEffect(function () {
+    if (shouldFocus) {
+      var _trashIconRef$current;
+
+      (_trashIconRef$current = trashIconRef.current) === null || _trashIconRef$current === void 0 ? void 0 : _trashIconRef$current.focus();
+    }
+  }, [shouldFocus]);
+
+  var toggleOutcomeSelection = function toggleOutcomeSelection() {
+    if (isOutcomeSelected(id)) {
+      deselectOutcomeIds([id]);
+    } else {
+      selectOutcomeIds([id]);
+    }
+  };
+
+  var renderTitleText = function renderTitleText(size, weight) {
+    return /*#__PURE__*/React.createElement(Text, {
+      size: size,
+      weight: weight,
+      wrap: "break-word"
+    }, title);
+  };
+
+  var renderOutcomeTitle = function renderOutcomeTitle() {
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        padding: isTray ? '0.5rem 0' : '0.4rem 0 0 0.3rem'
+      },
+      "data-automation": "alignmentItem__outcomeName"
+    }, truncated ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ScreenReaderContent, null, title), /*#__PURE__*/React.createElement(TruncateText, {
+      position: "middle"
+    }, renderTitleText('medium', 'bold'), /*#__PURE__*/React.createElement("span", null))) : renderTitleText('medium', 'bold'));
+  };
+
+  var renderDeleteButton = function renderDeleteButton() {
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        padding: '0.2rem 0 0'
+      },
+      "data-automation": "outcomeAlignmentItem__delete"
+    }, /*#__PURE__*/React.createElement(IconButton, {
+      size: "small",
+      withBackground: false,
+      withBorder: false,
+      screenReaderLabel: "Tango " + title,
+      onClick: removeAlignment,
+      ref: trashIconRef
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        fontSize: '1rem'
+      }
+    }, /*#__PURE__*/React.createElement(IconTrashLine, null))));
+  };
+
+  return /*#__PURE__*/React.createElement(View, {
+    as: "div",
+    padding: "x-small 0"
+  }, /*#__PURE__*/React.createElement(Flex, {
+    as: "div",
+    alignItems: "start"
+  }, /*#__PURE__*/React.createElement(Flex.Item, {
+    as: "div",
+    size: isTray ? '4.5rem' : '2rem'
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      padding: '0.3125rem 0'
+    }
+  }, /*#__PURE__*/React.createElement(Flex, {
+    alignItems: "center"
+  }, isTray && /*#__PURE__*/React.createElement(Flex.Item, {
+    as: "div",
+    padding: "0 0 0 xx-small"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "OutcomeSelector"
+  }, /*#__PURE__*/React.createElement(Checkbox, {
+    label: /*#__PURE__*/React.createElement(ScreenReaderContent, null, "Select outcome " + title),
+    value: "medium",
+    checked: isOutcomeSelected(id),
+    onChange: toggleOutcomeSelection
+  }))), /*#__PURE__*/React.createElement(Flex.Item, {
+    as: "div"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    size: "small",
+    screenReaderLabel: truncated ? "Expand description for outcome " + title : "Collapse description for outcome " + title,
+    withBackground: false,
+    withBorder: false,
+    onClick: toggleExpandOutcomeDetails
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex',
+      alignSelf: 'center',
+      fontSize: '0.875rem'
+    }
+  }, truncated ? /*#__PURE__*/React.createElement(IconArrowOpenEndLine, null) : /*#__PURE__*/React.createElement(IconArrowOpenDownLine, null))))))), /*#__PURE__*/React.createElement(Flex.Item, {
+    alignItems: "center",
+    size: "50%",
+    shouldGrow: true
+  }, truncated ? /*#__PURE__*/React.createElement(Popover, {
+    renderTrigger: renderOutcomeTitle(),
+    color: "primary-inverse",
+    placement: "top start",
+    offsetY: '-10rem'
+  }, /*#__PURE__*/React.createElement(View, {
+    as: "div",
+    maxWidth: "19rem",
+    padding: "small"
+  }, renderTitleText('small', 'normal'))) : renderOutcomeTitle()), canManageOutcomes && !isTray && /*#__PURE__*/React.createElement(Flex.Item, null, renderDeleteButton())), /*#__PURE__*/React.createElement(Flex, {
+    as: "div",
+    alignItems: "start"
+  }, /*#__PURE__*/React.createElement(Flex.Item, {
+    size: isTray ? '4.5rem' : '2.3rem'
+  }), /*#__PURE__*/React.createElement(Flex.Item, {
+    size: "80%"
+  }, /*#__PURE__*/React.createElement(View, {
+    as: "div",
+    padding: "0 0 x-small"
+  }, /*#__PURE__*/React.createElement(OutcomeDescription, {
+    label: label,
+    description: description
+  })))));
+};
+
+AlignmentItem.propTypes = {
+  outcome: outcomeShape.isRequired,
+  removeAlignment: PropTypes.func,
+  canManageOutcomes: PropTypes.bool,
+  isTray: PropTypes.bool,
+  shouldFocus: PropTypes.bool,
+  isOutcomeSelected: PropTypes.func,
+  selectOutcomeIds: PropTypes.func,
+  deselectOutcomeIds: PropTypes.func
+};
+AlignmentItem.defaultProps = {
+  removeAlignment: function removeAlignment() {},
+  canManageOutcomes: true,
+  isTray: false,
+  shouldFocus: false,
+  isOutcomeSelected: function isOutcomeSelected() {},
+  selectOutcomeIds: function selectOutcomeIds() {},
+  deselectOutcomeIds: function deselectOutcomeIds() {}
+};
+export default AlignmentItem;

package/es/translated/mi/components/AlignmentItem/index.stories.js

@@ -0,0 +1,46 @@
+import React from 'react';
+import { object } from '@storybook/addon-knobs';
+import { basicOutcome } from "../../../.storybook/constants.js";
+import AlignmentItem from "./index.js";
+export default {
+  title: 'AlignmentItem'
+};
+
+var noOp = function noOp() {};
+
+export var alignment = function alignment() {
+  return /*#__PURE__*/React.createElement(AlignmentItem, {
+    outcome: object('Outcome', basicOutcome),
+    removeAlignment: noOp,
+    readOnly: false,
+    isTray: false,
+    setFocusedOutcome: noOp,
+    isOutcomeSelected: noOp,
+    selectOutcomeIds: noOp,
+    deselectOutcomeIds: noOp
+  });
+};
+export var readOnlyAlignment = function readOnlyAlignment() {
+  return /*#__PURE__*/React.createElement(AlignmentItem, {
+    outcome: object('Outcome', basicOutcome),
+    removeAlignment: noOp,
+    readOnly: true,
+    isTray: false,
+    setFocusedOutcome: noOp,
+    isOutcomeSelected: noOp,
+    selectOutcomeIds: noOp,
+    deselectOutcomeIds: noOp
+  });
+};
+export var outcome = function outcome() {
+  return /*#__PURE__*/React.createElement(AlignmentItem, {
+    outcome: object('Outcome', basicOutcome),
+    removeAlignment: noOp,
+    readOnly: false,
+    isTray: true,
+    setFocusedOutcome: noOp,
+    isOutcomeSelected: noOp,
+    selectOutcomeIds: noOp,
+    deselectOutcomeIds: noOp
+  });
+};

package/es/translated/mi/components/OutcomeCheckbox/index.js

@@ -97,7 +97,7 @@ var OutcomeCheckbox = (_dec = themeable(theme, styles), _dec(_class = (_temp = _
       }, /*#__PURE__*/React.createElement(Text, {
         size: "x-small",
         weight: "bold"
-      }, "Friendly Description")), /*#__PURE__*/React.createElement(View, {
+      }, "Ng\u0101 \u0100hua Hoahoa")), /*#__PURE__*/React.createElement(View, {
         as: "div",
         margin: "0 small 0 0",
         padding: "0 x-small x-small",
@@ -108,7 +108,8 @@ var OutcomeCheckbox = (_dec = themeable(theme, styles), _dec(_class = (_temp = _
       }, outcome.friendly_description))), /*#__PURE__*/React.createElement("div", {
         className: styles.checkboxDescription
       }, /*#__PURE__*/React.createElement(OutcomeDescription, {
-        description: description
+        description: description,
+        maxLines: 2
       })));
     }
   }]);

package/es/translated/mi/components/OutcomeDescription/__tests__/index.test.js

@@ -7,8 +7,7 @@ describe('OutcomeDescription', function () {
   function makeProps() {
     var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
     return Object.assign({
-      description: 'Hello there',
-      truncate: true
+      description: 'Hello there'
     }, props);
   }
 
@@ -34,6 +33,13 @@ describe('OutcomeDescription', function () {
     });
     expect(wrapper.find('TruncateText')).to.have.length(1);
   });
+  it('renders outcome label and description', function () {
+    var props = makeProps({
+      label: 'Outcome label'
+    });
+    var wrapper = mount( /*#__PURE__*/React.createElement(OutcomeDescription, props));
+    expect(wrapper.text()).to.match(/Outcome labelHello there/);
+  });
   it('meets a11y standards', function () {
     return checkA11y( /*#__PURE__*/React.createElement(OutcomeDescription, makeProps()));
   });

package/es/translated/mi/components/OutcomeDescription/index.js

@@ -1,54 +1,45 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Text } from '@instructure/ui-text';
 import { TruncateText } from '@instructure/ui-truncate-text';
 
-var OutcomeDescription = /*#__PURE__*/function (_React$Component) {
-  _inherits(OutcomeDescription, _React$Component);
+var OutcomeDescription = function OutcomeDescription(_ref) {
+  var label = _ref.label,
+      description = _ref.description,
+      truncate = _ref.truncate,
+      maxLines = _ref.maxLines;
 
-  var _super = _createSuper(OutcomeDescription);
+  var stripHtmlTags = function stripHtmlTags(text) {
+    var doc = new DOMParser().parseFromString(text, 'text/html');
+    return doc.body.textContent || '';
+  };
 
-  function OutcomeDescription() {
-    _classCallCheck(this, OutcomeDescription);
+  var truncateText = function truncateText(text, position) {
+    return /*#__PURE__*/React.createElement(TruncateText, {
+      maxLines: maxLines,
+      position: position
+    }, text);
+  };
 
-    return _super.apply(this, arguments);
-  }
+  var renderText = function renderText(text, position) {
+    var strippedText = stripHtmlTags(text);
+    var renderedText = truncate ? truncateText(strippedText, position) : strippedText;
+    return /*#__PURE__*/React.createElement(Text, null, renderedText);
+  };
 
-  _createClass(OutcomeDescription, [{
-    key: "stripHtmlTags",
-    value: function stripHtmlTags(text) {
-      var doc = new DOMParser().parseFromString(text, 'text/html');
-      return doc.body.textContent || '';
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          truncate = _this$props.truncate,
-          description = _this$props.description;
-      var strippedText = this.stripHtmlTags(description);
-      return /*#__PURE__*/React.createElement(Text, {
-        size: "x-small"
-      }, truncate ? /*#__PURE__*/React.createElement(TruncateText, {
-        maxLines: 2,
-        position: "end"
-      }, strippedText) : strippedText);
-    }
-  }]);
-
-  OutcomeDescription.displayName = "OutcomeDescription";
-  return OutcomeDescription;
-}(React.Component);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, label && renderText(label, 'middle'), description && renderText(description, 'end'));
+};
 
 OutcomeDescription.propTypes = {
+  description: PropTypes.string,
+  label: PropTypes.string,
   truncate: PropTypes.bool,
-  description: PropTypes.string.isRequired
+  maxLines: PropTypes.number
 };
 OutcomeDescription.defaultProps = {
-  truncate: true
+  description: '',
+  label: '',
+  truncate: true,
+  maxLines: 1
 };
-export { OutcomeDescription as default };
+export default OutcomeDescription;

package/es/translated/mi/components/OutcomeDescription/index.stories.js

@@ -1,12 +1,12 @@
 import React from 'react';
-import { text, boolean } from '@storybook/addon-knobs';
+import { text } from '@storybook/addon-knobs';
 import OutcomeDescription from "./index.js";
 export default {
   title: 'OutcomeDescription'
 };
 export var standard = function standard() {
   return /*#__PURE__*/React.createElement(OutcomeDescription, {
-    truncate: boolean('Truncate', true),
+    label: text('Label', 'Example Label'),
     description: text('Description', 'Example Description')
   });
 };

package/es/translated/mi/components/OutcomePicker/index.js

@@ -122,7 +122,8 @@ var OutcomePicker = /*#__PURE__*/function (_React$Component) {
         setFocusedOutcome: setFocusedOutcome,
         isOutcomeSelected: isOutcomeSelected,
         selectOutcomeIds: selectOutcomeIds,
-        deselectOutcomeIds: deselectOutcomeIds
+        deselectOutcomeIds: deselectOutcomeIds,
+        isPicker: true
       });
     }
   }, {

package/es/translated/mi/components/OutcomeTray/OutcomeList/__tests__/index.test.js

@@ -21,11 +21,11 @@ describe('OutcomeList', function () {
     }, props);
   }
 
-  it('renders an OutcomeCheckbox', function () {
+  it('renders an AlignmentItem', function () {
     var wrapper = shallow( /*#__PURE__*/React.createElement(OutcomeList, makeProps()), {
       disableLifecycleMethods: true
     });
-    expect(wrapper.find('OutcomeCheckbox')).to.have.length(1);
+    expect(wrapper.find('AlignmentItem')).to.have.length(1);
   });
   it('renders loading spinner when state is loading', function () {
     var props = makeProps({

package/es/translated/mi/components/OutcomeTray/OutcomeList/index.js

@@ -6,7 +6,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Spinner } from '@instructure/ui-spinner';
 import { Flex } from '@instructure/ui-flex';
-import OutcomeCheckbox from "../../OutcomeCheckbox/index.js";
+import AlignmentItem from "../../AlignmentItem/index.js";
 import Pagination from "../../Pagination/index.js";
 export var RESULTS_PER_PAGE = 10;
 
@@ -26,19 +26,18 @@ var OutcomeList = /*#__PURE__*/function (_React$Component) {
     value: function renderList() {
       var _this$props = this.props,
           outcomes = _this$props.outcomes,
-          setFocusedOutcome = _this$props.setFocusedOutcome,
           isOutcomeSelected = _this$props.isOutcomeSelected,
           selectOutcomeIds = _this$props.selectOutcomeIds,
           deselectOutcomeIds = _this$props.deselectOutcomeIds;
       return outcomes.map(function (outcome) {
         return /*#__PURE__*/React.createElement("div", {
           key: outcome.id
-        }, /*#__PURE__*/React.createElement(OutcomeCheckbox, {
+        }, /*#__PURE__*/React.createElement(AlignmentItem, {
           outcome: outcome,
-          setFocusedOutcome: setFocusedOutcome,
           isOutcomeSelected: isOutcomeSelected,
           selectOutcomeIds: selectOutcomeIds,
-          deselectOutcomeIds: deselectOutcomeIds
+          deselectOutcomeIds: deselectOutcomeIds,
+          isTray: true
         }));
       });
     }
@@ -92,7 +91,6 @@ var OutcomeList = /*#__PURE__*/function (_React$Component) {
 
 OutcomeList.propTypes = {
   outcomes: PropTypes.array.isRequired,
-  setFocusedOutcome: PropTypes.func.isRequired,
   isOutcomeSelected: PropTypes.func.isRequired,
   selectOutcomeIds: PropTypes.func.isRequired,
   deselectOutcomeIds: PropTypes.func.isRequired,

package/es/translated/mi/components/OutcomeTray/index.js

@@ -16,7 +16,6 @@ import { View } from '@instructure/ui-view';
 import { Tray } from '@instructure/ui-tray';
 import { Spinner } from '@instructure/ui-spinner';
 import OutcomeList from "./OutcomeList/index.js";
-import OutcomeViewModal from "../OutcomeViewModal/index.js";
 import SearchInput from "../SearchInput/index.js";
 import SearchResults from "../SearchResults/index.js";
 import theme from "../theme.js";
@@ -64,7 +63,6 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
     value: function renderList() {
       var _this$props2 = this.props,
           outcomes = _this$props2.outcomes,
-          setFocusedOutcome = _this$props2.setFocusedOutcome,
           isOutcomeSelected = _this$props2.isOutcomeSelected,
           selectOutcomeIds = _this$props2.selectOutcomeIds,
           deselectOutcomeIds = _this$props2.deselectOutcomeIds,
@@ -77,7 +75,6 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
         padding: "small none none none"
       }, /*#__PURE__*/React.createElement(OutcomeList, {
         outcomes: outcomes,
-        setFocusedOutcome: setFocusedOutcome,
         isOutcomeSelected: isOutcomeSelected,
         selectOutcomeIds: selectOutcomeIds,
         deselectOutcomeIds: deselectOutcomeIds,
@@ -87,45 +84,22 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
         getOutcomesList: getOutcomesList
       }));
     }
-  }, {
-    key: "renderViewModal",
-    value: function renderViewModal() {
-      var _this$props3 = this.props,
-          focusedOutcome = _this$props3.focusedOutcome,
-          setFocusedOutcome = _this$props3.setFocusedOutcome,
-          artifactTypeName = _this$props3.artifactTypeName,
-          displayMasteryDescription = _this$props3.displayMasteryDescription,
-          displayMasteryPercentText = _this$props3.displayMasteryPercentText,
-          scope = _this$props3.scope;
-      return focusedOutcome && /*#__PURE__*/React.createElement(OutcomeViewModal, {
-        artifactTypeName: artifactTypeName,
-        displayMasteryDescription: displayMasteryDescription,
-        displayMasteryPercentText: displayMasteryPercentText,
-        outcome: focusedOutcome,
-        scope: scope,
-        closeAlignment: function closeAlignment() {
-          return setFocusedOutcome(null);
-        },
-        isOpen: true
-      });
-    }
   }, {
     key: "renderSearchMode",
     value: function renderSearchMode() {
-      var _this$props4 = this.props,
-          screenreaderNotification = _this$props4.screenreaderNotification,
-          setSearchLoading = _this$props4.setSearchLoading,
-          setSearchEntries = _this$props4.setSearchEntries,
-          searchText = _this$props4.searchText,
-          updateSearchPage = _this$props4.updateSearchPage,
-          isSearchLoading = _this$props4.isSearchLoading,
-          isOutcomeSelected = _this$props4.isOutcomeSelected,
-          searchEntries = _this$props4.searchEntries,
-          searchPage = _this$props4.searchPage,
-          searchTotal = _this$props4.searchTotal,
-          selectOutcomeIds = _this$props4.selectOutcomeIds,
-          deselectOutcomeIds = _this$props4.deselectOutcomeIds,
-          setFocusedOutcome = _this$props4.setFocusedOutcome;
+      var _this$props3 = this.props,
+          screenreaderNotification = _this$props3.screenreaderNotification,
+          setSearchLoading = _this$props3.setSearchLoading,
+          setSearchEntries = _this$props3.setSearchEntries,
+          searchText = _this$props3.searchText,
+          updateSearchPage = _this$props3.updateSearchPage,
+          isSearchLoading = _this$props3.isSearchLoading,
+          isOutcomeSelected = _this$props3.isOutcomeSelected,
+          searchEntries = _this$props3.searchEntries,
+          searchPage = _this$props3.searchPage,
+          searchTotal = _this$props3.searchTotal,
+          selectOutcomeIds = _this$props3.selectOutcomeIds,
+          deselectOutcomeIds = _this$props3.deselectOutcomeIds;
       return /*#__PURE__*/React.createElement(SearchResults, {
         screenreaderNotification: screenreaderNotification,
         setSearchLoading: setSearchLoading,
@@ -138,16 +112,15 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
         searchPage: searchPage,
         searchTotal: searchTotal,
         selectOutcomeIds: selectOutcomeIds,
-        deselectOutcomeIds: deselectOutcomeIds,
-        setFocusedOutcome: setFocusedOutcome
+        deselectOutcomeIds: deselectOutcomeIds
       });
     }
   }, {
     key: "renderBody",
     value: function renderBody() {
-      var _this$props5 = this.props,
-          searchText = _this$props5.searchText,
-          isFetching = _this$props5.isFetching;
+      var _this$props4 = this.props,
+          searchText = _this$props4.searchText,
+          isFetching = _this$props4.isFetching;
 
       if (isFetching) {
         return /*#__PURE__*/React.createElement(Flex, {
@@ -164,11 +137,11 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
   }, {
     key: "handleSubmit",
     value: function handleSubmit() {
-      var _this$props6 = this.props,
-          saveOutcomePickerAlignments = _this$props6.saveOutcomePickerAlignments,
-          onUpdate = _this$props6.onUpdate,
-          closeOutcomePicker = _this$props6.closeOutcomePicker,
-          shouldModifyArtifact = _this$props6.shouldModifyArtifact;
+      var _this$props5 = this.props,
+          saveOutcomePickerAlignments = _this$props5.saveOutcomePickerAlignments,
+          onUpdate = _this$props5.onUpdate,
+          closeOutcomePicker = _this$props5.closeOutcomePicker,
+          shouldModifyArtifact = _this$props5.shouldModifyArtifact;
       return saveOutcomePickerAlignments(onUpdate, shouldModifyArtifact).then(function () {
         return closeOutcomePicker();
       });
@@ -196,16 +169,16 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
   }, {
     key: "render",
     value: function render() {
-      var _this$props7 = this.props,
-          liveRegion = _this$props7.liveRegion,
-          mountNode = _this$props7.mountNode,
-          searchText = _this$props7.searchText,
-          placement = _this$props7.placement,
-          size = _this$props7.size,
-          updateSearchText = _this$props7.updateSearchText,
-          closeOutcomePicker = _this$props7.closeOutcomePicker,
-          isOpen = _this$props7.isOpen,
-          resetOutcomePicker = _this$props7.resetOutcomePicker;
+      var _this$props6 = this.props,
+          liveRegion = _this$props6.liveRegion,
+          mountNode = _this$props6.mountNode,
+          searchText = _this$props6.searchText,
+          placement = _this$props6.placement,
+          size = _this$props6.size,
+          updateSearchText = _this$props6.updateSearchText,
+          closeOutcomePicker = _this$props6.closeOutcomePicker,
+          isOpen = _this$props6.isOpen,
+          resetOutcomePicker = _this$props6.resetOutcomePicker;
       var trayProps = {
         placement: placement,
         size: size
@@ -239,7 +212,7 @@ var OutcomeTray = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
           return updateSearchText('');
         },
         searchText: searchText
-      }), this.renderBody()), this.renderActions(), this.renderViewModal()));
+      }), this.renderBody()), this.renderActions()));
     }
   }]);
 

package/es/translated/mi/components/OutcomeView/index.js

@@ -99,7 +99,7 @@ var OutcomeView = (_dec = themeable(theme, styles), _dec(_class = (_temp = _clas
         "data-automation": "outcomeView__friendly_description_header"
       }, /*#__PURE__*/React.createElement(Text, {
         weight: "bold"
-      }, "Friendly Description")), /*#__PURE__*/React.createElement(View, {
+      }, "Ng\u0101 \u0100hua Hoahoa")), /*#__PURE__*/React.createElement(View, {
         as: "div",
         margin: "0 small 0 0",
         padding: "0 small small small",

package/es/translated/mi/components/SearchResults/__tests__/index.test.js

@@ -33,7 +33,7 @@ describe('SearchResults', function () {
     });
     expect(wrapper.find('Spinner')).to.have.length(1);
   });
-  it('passes correct params to OutcomeCheckbox components', function () {
+  it('passes correct params to AlignmentItem components', function () {
     var props = makeProps();
     props.isSearchLoading = false;
     props.searchEntries = [{
@@ -44,7 +44,7 @@ describe('SearchResults', function () {
     var wrapper = shallow( /*#__PURE__*/React.createElement(SearchResults, props), {
       disableLifecycleMethods: true
     });
-    var checkbox = wrapper.find('OutcomeCheckbox');
+    var checkbox = wrapper.find('AlignmentItem');
     expect(checkbox).to.have.length(1);
     expect(checkbox.prop('outcome')).to.eql({
       id: '2',