box-ui-elements 16.1.0-beta.9 → 17.0.0

package/es/elements/content-uploader/ItemAction.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/content-uploader/ItemAction.js"],"names":["React","FormattedMessage","injectIntl","IconCheck","IconClose","IconInProgress","IconRetry","LoadingIndicator","PlainButton","PrimaryButton","Tooltip","messages","ERROR_CODE_UPLOAD_FILE_SIZE_LIMIT_EXCEEDED","STATUS_PENDING","STATUS_IN_PROGRESS","STATUS_STAGED","STATUS_COMPLETE","STATUS_ERROR","ICON_CHECK_COLOR","ItemAction","error","intl","isFolder","isResumableUploadsEnabled","onClick","onUpgradeCTAClick","status","icon","tooltip","code","remove","resume","retry","uploadsCancelButtonTooltip","uploadsFileSizeLimitExceededUpgradeMessageForUpgradeCta","formatMessage","ItemActionForTesting"],"mappings":"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","sourcesContent":["/**\n * @flow\n * @file Item action component\n */\n\nimport React from 'react';\nimport { FormattedMessage, injectIntl } from 'react-intl';\nimport type { InjectIntlProvidedProps } from 'react-intl';\nimport IconCheck from '../../icons/general/IconCheck';\nimport IconClose from '../../icons/general/IconClose';\nimport IconInProgress from './IconInProgress';\nimport IconRetry from '../../icons/general/IconRetry';\nimport LoadingIndicator from '../../components/loading-indicator';\nimport PlainButton from '../../components/plain-button/PlainButton';\nimport PrimaryButton from '../../components/primary-button/PrimaryButton';\nimport Tooltip from '../../components/tooltip';\nimport messages from '../common/messages';\nimport {\n    ERROR_CODE_UPLOAD_FILE_SIZE_LIMIT_EXCEEDED,\n    STATUS_PENDING,\n    STATUS_IN_PROGRESS,\n    STATUS_STAGED,\n    STATUS_COMPLETE,\n    STATUS_ERROR,\n} from '../../constants';\nimport type { UploadStatus } from '../../common/types/upload';\n\nimport './ItemAction.scss';\n\nconst ICON_CHECK_COLOR = '#26C281';\n\ntype Props = {\n    error?: Object,\n    isFolder?: boolean,\n    isResumableUploadsEnabled: boolean,\n    onClick: Function,\n    onUpgradeCTAClick?: Function,\n    status: UploadStatus,\n} & InjectIntlProvidedProps;\n\nconst ItemAction = ({\n    error = {},\n    intl,\n    isFolder = false,\n    isResumableUploadsEnabled,\n    onClick,\n    onUpgradeCTAClick,\n    status,\n}: Props) => {\n    let icon = <IconClose />;\n    let tooltip;\n    const { code } = error;\n\n    if (isFolder && status !== STATUS_PENDING) {\n        return null;\n    }\n\n    switch (status) {\n        case STATUS_COMPLETE:\n            icon = <IconCheck color={ICON_CHECK_COLOR} />;\n            if (!isResumableUploadsEnabled) {\n                tooltip = messages.remove;\n            }\n            break;\n        case STATUS_ERROR:\n            icon = <IconRetry height={24} width={24} />;\n            tooltip = isResumableUploadsEnabled ? messages.resume : messages.retry;\n            break;\n        case STATUS_IN_PROGRESS:\n        case STATUS_STAGED:\n            if (isResumableUploadsEnabled) {\n                icon = <LoadingIndicator />;\n            } else {\n                icon = <IconInProgress />;\n                tooltip = messages.uploadsCancelButtonTooltip;\n            }\n            break;\n        case STATUS_PENDING:\n        default:\n            if (isResumableUploadsEnabled) {\n                icon = <LoadingIndicator />;\n            } else {\n                tooltip = messages.uploadsCancelButtonTooltip;\n            }\n            break;\n    }\n\n    if (status === STATUS_ERROR && code === ERROR_CODE_UPLOAD_FILE_SIZE_LIMIT_EXCEEDED && !!onUpgradeCTAClick) {\n        return (\n            <PrimaryButton\n                onClick={onUpgradeCTAClick}\n                data-resin-target=\"large_version_error_inline_upgrade_cta\"\n                type=\"button\"\n            >\n                <FormattedMessage {...messages.uploadsFileSizeLimitExceededUpgradeMessageForUpgradeCta} />\n            </PrimaryButton>\n        );\n    }\n\n    return (\n        <div className=\"bcu-item-action\">\n            {tooltip ? (\n                <Tooltip position=\"top-left\" text={intl.formatMessage(tooltip)}>\n                    <PlainButton onClick={onClick} type=\"button\" isDisabled={status === STATUS_STAGED}>\n                        {icon}\n                    </PlainButton>\n                </Tooltip>\n            ) : (\n                icon\n            )}\n        </div>\n    );\n};\n\nexport { ItemAction as ItemActionForTesting };\nexport default injectIntl(ItemAction);\n"],"file":"ItemAction.js"}
+{"version":3,"sources":["../../../src/elements/content-uploader/ItemAction.js"],"names":["React","FormattedMessage","injectIntl","IconCheck","IconClose","IconInProgress","IconRetry","LoadingIndicator","PlainButton","PrimaryButton","Tooltip","messages","ERROR_CODE_UPLOAD_FILE_SIZE_LIMIT_EXCEEDED","STATUS_PENDING","STATUS_IN_PROGRESS","STATUS_STAGED","STATUS_COMPLETE","STATUS_ERROR","ICON_CHECK_COLOR","ItemAction","error","intl","isFolder","isResumableUploadsEnabled","onClick","onUpgradeCTAClick","status","icon","tooltip","code","formatMessage","remove","resume","retry","uploadsCancelButtonTooltip","uploadsFileSizeLimitExceededUpgradeMessageForUpgradeCta","isDisabled","tooltipText","ItemActionForTesting"],"mappings":"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","sourcesContent":["/**\n * @flow\n * @file Item action component displayed on the upload toast, e.g. cancel/resume\n */\n\nimport React from 'react';\nimport { FormattedMessage, injectIntl } from 'react-intl';\nimport type { InjectIntlProvidedProps } from 'react-intl';\nimport IconCheck from '../../icons/general/IconCheck';\nimport IconClose from '../../icons/general/IconClose';\nimport IconInProgress from './IconInProgress';\nimport IconRetry from '../../icons/general/IconRetry';\nimport LoadingIndicator from '../../components/loading-indicator';\nimport PlainButton from '../../components/plain-button/PlainButton';\nimport PrimaryButton from '../../components/primary-button/PrimaryButton';\nimport Tooltip from '../../components/tooltip';\nimport messages from '../common/messages';\nimport {\n    ERROR_CODE_UPLOAD_FILE_SIZE_LIMIT_EXCEEDED,\n    STATUS_PENDING,\n    STATUS_IN_PROGRESS,\n    STATUS_STAGED,\n    STATUS_COMPLETE,\n    STATUS_ERROR,\n} from '../../constants';\nimport type { UploadStatus } from '../../common/types/upload';\n\nimport './ItemAction.scss';\n\nconst ICON_CHECK_COLOR = '#26C281';\n\ntype Props = {\n    error?: Object,\n    isFolder?: boolean,\n    isResumableUploadsEnabled: boolean,\n    onClick: Function,\n    onUpgradeCTAClick?: Function,\n    status: UploadStatus,\n} & InjectIntlProvidedProps;\n\nconst ItemAction = ({\n    error = {},\n    intl,\n    isFolder = false,\n    isResumableUploadsEnabled,\n    onClick,\n    onUpgradeCTAClick,\n    status,\n}: Props) => {\n    let icon = <IconClose />;\n    let tooltip;\n    const { code } = error;\n    const { formatMessage } = intl;\n\n    if (isFolder && status !== STATUS_PENDING) {\n        return null;\n    }\n\n    switch (status) {\n        case STATUS_COMPLETE:\n            icon = <IconCheck color={ICON_CHECK_COLOR} />;\n            if (!isResumableUploadsEnabled) {\n                tooltip = messages.remove;\n            }\n            break;\n        case STATUS_ERROR:\n            icon = <IconRetry height={24} width={24} />;\n            tooltip = isResumableUploadsEnabled ? messages.resume : messages.retry;\n            break;\n        case STATUS_IN_PROGRESS:\n        case STATUS_STAGED:\n            if (isResumableUploadsEnabled) {\n                icon = <LoadingIndicator />;\n            } else {\n                icon = <IconInProgress />;\n                tooltip = messages.uploadsCancelButtonTooltip;\n            }\n            break;\n        case STATUS_PENDING:\n        default:\n            if (isResumableUploadsEnabled) {\n                icon = <LoadingIndicator />;\n            } else {\n                tooltip = messages.uploadsCancelButtonTooltip;\n            }\n            break;\n    }\n\n    if (status === STATUS_ERROR && code === ERROR_CODE_UPLOAD_FILE_SIZE_LIMIT_EXCEEDED && !!onUpgradeCTAClick) {\n        return (\n            <PrimaryButton\n                onClick={onUpgradeCTAClick}\n                data-resin-target=\"large_version_error_inline_upgrade_cta\"\n                type=\"button\"\n            >\n                <FormattedMessage {...messages.uploadsFileSizeLimitExceededUpgradeMessageForUpgradeCta} />\n            </PrimaryButton>\n        );\n    }\n    const isDisabled = status === STATUS_STAGED;\n    const tooltipText = tooltip && formatMessage(tooltip);\n\n    return (\n        <div className=\"bcu-item-action\">\n            {tooltip ? (\n                <Tooltip position=\"top-left\" text={tooltipText}>\n                    <PlainButton aria-label={tooltipText} isDisabled={isDisabled} onClick={onClick} type=\"button\">\n                        {icon}\n                    </PlainButton>\n                </Tooltip>\n            ) : (\n                icon\n            )}\n        </div>\n    );\n};\n\nexport { ItemAction as ItemActionForTesting };\nexport default injectIntl(ItemAction);\n"],"file":"ItemAction.js"}

package/es/elements/content-uploader/ItemRemove.js

@@ -5,7 +5,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
  * @file Item remove component
  */
 import React from 'react';
-import { FormattedMessage } from 'react-intl';
+import { injectIntl } from 'react-intl';
 import PlainButton from '../../components/plain-button/PlainButton';
 import Tooltip from '../../components/tooltip';
 import IconClose from '../../icons/general/IconClose';
@@ -13,7 +13,8 @@ import messages from '../common/messages';
 import { STATUS_ERROR, STATUS_IN_PROGRESS, STATUS_STAGED } from '../../constants';
 
 var ItemRemove = function ItemRemove(_ref) {
-  var onClick = _ref.onClick,
+  var intl = _ref.intl,
+      onClick = _ref.onClick,
       status = _ref.status;
   var resin = {};
   var target = null;
@@ -28,17 +29,21 @@ var ItemRemove = function ItemRemove(_ref) {
     resin['data-resin-target'] = target;
   }
 
+  var isDisabled = status === STATUS_STAGED;
+  var tooltipText = intl.formatMessage(messages.remove);
   return React.createElement("div", {
     className: "bcu-item-action"
   }, React.createElement(Tooltip, {
     position: "top-left",
-    text: React.createElement(FormattedMessage, messages.remove)
+    text: tooltipText
   }, React.createElement(PlainButton, _extends({
+    "aria-label": tooltipText,
+    isDisabled: isDisabled,
     onClick: onClick,
-    type: "button",
-    isDisabled: status === STATUS_STAGED
+    type: "button"
   }, resin), React.createElement(IconClose, null))));
 };
 
-export default ItemRemove;
+export { ItemRemove as ItemRemoveBase };
+export default injectIntl(ItemRemove);
 //# sourceMappingURL=ItemRemove.js.map

package/es/elements/content-uploader/ItemRemove.js.flow

@@ -4,20 +4,22 @@
  */
 
 import React from 'react';
-import { FormattedMessage } from 'react-intl';
+import { injectIntl } from 'react-intl';
+import type { InjectIntlProvidedProps } from 'react-intl';
 import PlainButton from '../../components/plain-button/PlainButton';
 import Tooltip from '../../components/tooltip';
 import IconClose from '../../icons/general/IconClose';
 import messages from '../common/messages';
 import { STATUS_ERROR, STATUS_IN_PROGRESS, STATUS_STAGED } from '../../constants';
+
 import type { UploadItem, UploadStatus } from '../../common/types/upload';
 
 type Props = {
     onClick: (item: UploadItem) => void,
     status: UploadStatus,
-};
+} & InjectIntlProvidedProps;
 
-const ItemRemove = ({ onClick, status }: Props) => {
+const ItemRemove = ({ intl, onClick, status }: Props) => {
     const resin = {};
     let target = null;
 
@@ -31,10 +33,19 @@ const ItemRemove = ({ onClick, status }: Props) => {
         resin['data-resin-target'] = target;
     }
 
+    const isDisabled = status === STATUS_STAGED;
+    const tooltipText = intl.formatMessage(messages.remove);
+
     return (
         <div className="bcu-item-action">
-            <Tooltip position="top-left" text={<FormattedMessage {...messages.remove} />}>
-                <PlainButton onClick={onClick} type="button" isDisabled={status === STATUS_STAGED} {...resin}>
+            <Tooltip position="top-left" text={tooltipText}>
+                <PlainButton
+                    aria-label={tooltipText}
+                    isDisabled={isDisabled}
+                    onClick={onClick}
+                    type="button"
+                    {...resin}
+                >
                     <IconClose />
                 </PlainButton>
             </Tooltip>
@@ -42,4 +53,5 @@ const ItemRemove = ({ onClick, status }: Props) => {
     );
 };
 
-export default ItemRemove;
+export { ItemRemove as ItemRemoveBase };
+export default injectIntl(ItemRemove);

package/es/elements/content-uploader/ItemRemove.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/content-uploader/ItemRemove.js"],"names":["React","FormattedMessage","PlainButton","Tooltip","IconClose","messages","STATUS_ERROR","STATUS_IN_PROGRESS","STATUS_STAGED","ItemRemove","onClick","status","resin","target","remove"],"mappings":";;AAAA;;;;AAKA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,gBAAT,QAAiC,YAAjC;AACA,OAAOC,WAAP,MAAwB,2CAAxB;AACA,OAAOC,OAAP,MAAoB,0BAApB;AACA,OAAOC,SAAP,MAAsB,+BAAtB;AACA,OAAOC,QAAP,MAAqB,oBAArB;AACA,SAASC,YAAT,EAAuBC,kBAAvB,EAA2CC,aAA3C,QAAgE,iBAAhE;;AAQA,IAAMC,UAAU,GAAG,SAAbA,UAAa,OAAgC;AAAA,MAA7BC,OAA6B,QAA7BA,OAA6B;AAAA,MAApBC,MAAoB,QAApBA,MAAoB;AAC/C,MAAMC,KAAK,GAAG,EAAd;AACA,MAAIC,MAAM,GAAG,IAAb;;AAEA,MAAIF,MAAM,KAAKJ,kBAAf,EAAmC;AAC/BM,IAAAA,MAAM,GAAG,cAAT;AACH,GAFD,MAEO,IAAIF,MAAM,KAAKL,YAAf,EAA6B;AAChCO,IAAAA,MAAM,GAAG,eAAT;AACH;;AAED,MAAIA,MAAJ,EAAY;AACRD,IAAAA,KAAK,CAAC,mBAAD,CAAL,GAA6BC,MAA7B;AACH;;AAED,SACI;AAAK,IAAA,SAAS,EAAC;AAAf,KACI,oBAAC,OAAD;AAAS,IAAA,QAAQ,EAAC,UAAlB;AAA6B,IAAA,IAAI,EAAE,oBAAC,gBAAD,EAAsBR,QAAQ,CAACS,MAA/B;AAAnC,KACI,oBAAC,WAAD;AAAa,IAAA,OAAO,EAAEJ,OAAtB;AAA+B,IAAA,IAAI,EAAC,QAApC;AAA6C,IAAA,UAAU,EAAEC,MAAM,KAAKH;AAApE,KAAuFI,KAAvF,GACI,oBAAC,SAAD,OADJ,CADJ,CADJ,CADJ;AASH,CAvBD;;AAyBA,eAAeH,UAAf","sourcesContent":["/**\n * @flow\n * @file Item remove component\n */\n\nimport React from 'react';\nimport { FormattedMessage } from 'react-intl';\nimport PlainButton from '../../components/plain-button/PlainButton';\nimport Tooltip from '../../components/tooltip';\nimport IconClose from '../../icons/general/IconClose';\nimport messages from '../common/messages';\nimport { STATUS_ERROR, STATUS_IN_PROGRESS, STATUS_STAGED } from '../../constants';\nimport type { UploadItem, UploadStatus } from '../../common/types/upload';\n\ntype Props = {\n    onClick: (item: UploadItem) => void,\n    status: UploadStatus,\n};\n\nconst ItemRemove = ({ onClick, status }: Props) => {\n    const resin = {};\n    let target = null;\n\n    if (status === STATUS_IN_PROGRESS) {\n        target = 'uploadcancel';\n    } else if (status === STATUS_ERROR) {\n        target = 'remove-failed';\n    }\n\n    if (target) {\n        resin['data-resin-target'] = target;\n    }\n\n    return (\n        <div className=\"bcu-item-action\">\n            <Tooltip position=\"top-left\" text={<FormattedMessage {...messages.remove} />}>\n                <PlainButton onClick={onClick} type=\"button\" isDisabled={status === STATUS_STAGED} {...resin}>\n                    <IconClose />\n                </PlainButton>\n            </Tooltip>\n        </div>\n    );\n};\n\nexport default ItemRemove;\n"],"file":"ItemRemove.js"}
+{"version":3,"sources":["../../../src/elements/content-uploader/ItemRemove.js"],"names":["React","injectIntl","PlainButton","Tooltip","IconClose","messages","STATUS_ERROR","STATUS_IN_PROGRESS","STATUS_STAGED","ItemRemove","intl","onClick","status","resin","target","isDisabled","tooltipText","formatMessage","remove","ItemRemoveBase"],"mappings":";;AAAA;;;;AAKA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,QAA2B,YAA3B;AAEA,OAAOC,WAAP,MAAwB,2CAAxB;AACA,OAAOC,OAAP,MAAoB,0BAApB;AACA,OAAOC,SAAP,MAAsB,+BAAtB;AACA,OAAOC,QAAP,MAAqB,oBAArB;AACA,SAASC,YAAT,EAAuBC,kBAAvB,EAA2CC,aAA3C,QAAgE,iBAAhE;;AASA,IAAMC,UAAU,GAAG,SAAbA,UAAa,OAAsC;AAAA,MAAnCC,IAAmC,QAAnCA,IAAmC;AAAA,MAA7BC,OAA6B,QAA7BA,OAA6B;AAAA,MAApBC,MAAoB,QAApBA,MAAoB;AACrD,MAAMC,KAAK,GAAG,EAAd;AACA,MAAIC,MAAM,GAAG,IAAb;;AAEA,MAAIF,MAAM,KAAKL,kBAAf,EAAmC;AAC/BO,IAAAA,MAAM,GAAG,cAAT;AACH,GAFD,MAEO,IAAIF,MAAM,KAAKN,YAAf,EAA6B;AAChCQ,IAAAA,MAAM,GAAG,eAAT;AACH;;AAED,MAAIA,MAAJ,EAAY;AACRD,IAAAA,KAAK,CAAC,mBAAD,CAAL,GAA6BC,MAA7B;AACH;;AAED,MAAMC,UAAU,GAAGH,MAAM,KAAKJ,aAA9B;AACA,MAAMQ,WAAW,GAAGN,IAAI,CAACO,aAAL,CAAmBZ,QAAQ,CAACa,MAA5B,CAApB;AAEA,SACI;AAAK,IAAA,SAAS,EAAC;AAAf,KACI,oBAAC,OAAD;AAAS,IAAA,QAAQ,EAAC,UAAlB;AAA6B,IAAA,IAAI,EAAEF;AAAnC,KACI,oBAAC,WAAD;AACI,kBAAYA,WADhB;AAEI,IAAA,UAAU,EAAED,UAFhB;AAGI,IAAA,OAAO,EAAEJ,OAHb;AAII,IAAA,IAAI,EAAC;AAJT,KAKQE,KALR,GAOI,oBAAC,SAAD,OAPJ,CADJ,CADJ,CADJ;AAeH,CAhCD;;AAkCA,SAASJ,UAAU,IAAIU,cAAvB;AACA,eAAelB,UAAU,CAACQ,UAAD,CAAzB","sourcesContent":["/**\n * @flow\n * @file Item remove component\n */\n\nimport React from 'react';\nimport { injectIntl } from 'react-intl';\nimport type { InjectIntlProvidedProps } from 'react-intl';\nimport PlainButton from '../../components/plain-button/PlainButton';\nimport Tooltip from '../../components/tooltip';\nimport IconClose from '../../icons/general/IconClose';\nimport messages from '../common/messages';\nimport { STATUS_ERROR, STATUS_IN_PROGRESS, STATUS_STAGED } from '../../constants';\n\nimport type { UploadItem, UploadStatus } from '../../common/types/upload';\n\ntype Props = {\n    onClick: (item: UploadItem) => void,\n    status: UploadStatus,\n} & InjectIntlProvidedProps;\n\nconst ItemRemove = ({ intl, onClick, status }: Props) => {\n    const resin = {};\n    let target = null;\n\n    if (status === STATUS_IN_PROGRESS) {\n        target = 'uploadcancel';\n    } else if (status === STATUS_ERROR) {\n        target = 'remove-failed';\n    }\n\n    if (target) {\n        resin['data-resin-target'] = target;\n    }\n\n    const isDisabled = status === STATUS_STAGED;\n    const tooltipText = intl.formatMessage(messages.remove);\n\n    return (\n        <div className=\"bcu-item-action\">\n            <Tooltip position=\"top-left\" text={tooltipText}>\n                <PlainButton\n                    aria-label={tooltipText}\n                    isDisabled={isDisabled}\n                    onClick={onClick}\n                    type=\"button\"\n                    {...resin}\n                >\n                    <IconClose />\n                </PlainButton>\n            </Tooltip>\n        </div>\n    );\n};\n\nexport { ItemRemove as ItemRemoveBase };\nexport default injectIntl(ItemRemove);\n"],"file":"ItemRemove.js"}

package/es/elements/content-uploader/UploadInput.js

@@ -6,18 +6,30 @@
 import * as React from 'react';
 
 var UploadInput = function UploadInput(_ref) {
-  var _ref$isMultiple = _ref.isMultiple,
-      isMultiple = _ref$isMultiple === void 0 ? true : _ref$isMultiple,
-      _ref$isFolderUpload = _ref.isFolderUpload,
-      isFolderUpload = _ref$isFolderUpload === void 0 ? false : _ref$isFolderUpload,
+  var handleChange = _ref.handleChange,
+      inputLabel = _ref.inputLabel,
       _ref$inputLabelClass = _ref.inputLabelClass,
       inputLabelClass = _ref$inputLabelClass === void 0 ? '' : _ref$inputLabelClass,
-      inputLabel = _ref.inputLabel,
-      handleChange = _ref.handleChange;
-  return inputLabel ? // eslint-disable-next-line jsx-a11y/label-has-for
-  React.createElement("label", {
-    className: inputLabelClass
+      _ref$isFolderUpload = _ref.isFolderUpload,
+      isFolderUpload = _ref$isFolderUpload === void 0 ? false : _ref$isFolderUpload,
+      _ref$isMultiple = _ref.isMultiple,
+      isMultiple = _ref$isMultiple === void 0 ? true : _ref$isMultiple;
+  var inputRef = React.useRef(null);
+
+  var onKeyDown = function onKeyDown(e) {
+    if (e.key === 'Enter' || e.key === ' ') {
+      if (inputRef.current) {
+        inputRef.current.click();
+      }
+    }
+  };
+
+  return inputLabel ? React.createElement("label", {
+    className: inputLabelClass,
+    onKeyDown: onKeyDown,
+    tabIndex: 0
   }, inputLabel, React.createElement("input", {
+    ref: inputRef,
     directory: isFolderUpload ? '' : undefined,
     multiple: isMultiple,
     onChange: handleChange,

package/es/elements/content-uploader/UploadInput.js.flow

@@ -15,17 +15,27 @@ type Props = {
 };
 
 const UploadInput = ({
-    isMultiple = true,
-    isFolderUpload = false,
-    inputLabelClass = '',
-    inputLabel,
     handleChange,
-}: Props) =>
-    inputLabel ? (
-        // eslint-disable-next-line jsx-a11y/label-has-for
-        <label className={inputLabelClass}>
+    inputLabel,
+    inputLabelClass = '',
+    isFolderUpload = false,
+    isMultiple = true,
+}: Props) => {
+    const inputRef = React.useRef(null);
+
+    const onKeyDown = e => {
+        if (e.key === 'Enter' || e.key === ' ') {
+            if (inputRef.current) {
+                inputRef.current.click();
+            }
+        }
+    };
+
+    return inputLabel ? (
+        <label className={inputLabelClass} onKeyDown={onKeyDown} tabIndex={0}>
             {inputLabel}
             <input
+                ref={inputRef}
                 directory={isFolderUpload ? '' : undefined}
                 multiple={isMultiple}
                 onChange={handleChange}
@@ -34,5 +44,5 @@ const UploadInput = ({
             />
         </label>
     ) : null;
-
+};
 export default UploadInput;

package/es/elements/content-uploader/UploadInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/content-uploader/UploadInput.js"],"names":["React","UploadInput","isMultiple","isFolderUpload","inputLabelClass","inputLabel","handleChange","undefined"],"mappings":"AAAA;;;;;AAMA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;;AAUA,IAAMC,WAAW,GAAG,SAAdA,WAAc;AAAA,6BAChBC,UADgB;AAAA,MAChBA,UADgB,gCACH,IADG;AAAA,iCAEhBC,cAFgB;AAAA,MAEhBA,cAFgB,oCAEC,KAFD;AAAA,kCAGhBC,eAHgB;AAAA,MAGhBA,eAHgB,qCAGE,EAHF;AAAA,MAIhBC,UAJgB,QAIhBA,UAJgB;AAAA,MAKhBC,YALgB,QAKhBA,YALgB;AAAA,SAOhBD,UAAU,GACN;AACA;AAAO,IAAA,SAAS,EAAED;AAAlB,KACKC,UADL,EAEI;AACI,IAAA,SAAS,EAAEF,cAAc,GAAG,EAAH,GAAQI,SADrC;AAEI,IAAA,QAAQ,EAAEL,UAFd;AAGI,IAAA,QAAQ,EAAEI,YAHd;AAII,IAAA,IAAI,EAAC,MAJT;AAKI,IAAA,eAAe,EAAEH,cAAc,GAAG,EAAH,GAAQI;AAL3C,IAFJ,CAFM,GAYN,IAnBY;AAAA,CAApB;;AAqBA,eAAeN,WAAf","sourcesContent":["/**\n * @flow\n * @file Input element for folder/file upload\n * @author Box\n */\n\nimport * as React from 'react';\n\ntype Props = {\n    handleChange: Function,\n    inputLabel?: React.Node,\n    inputLabelClass?: string,\n    isFolderUpload?: boolean,\n    isMultiple?: boolean,\n};\n\nconst UploadInput = ({\n    isMultiple = true,\n    isFolderUpload = false,\n    inputLabelClass = '',\n    inputLabel,\n    handleChange,\n}: Props) =>\n    inputLabel ? (\n        // eslint-disable-next-line jsx-a11y/label-has-for\n        <label className={inputLabelClass}>\n            {inputLabel}\n            <input\n                directory={isFolderUpload ? '' : undefined}\n                multiple={isMultiple}\n                onChange={handleChange}\n                type=\"file\"\n                webkitdirectory={isFolderUpload ? '' : undefined}\n            />\n        </label>\n    ) : null;\n\nexport default UploadInput;\n"],"file":"UploadInput.js"}
+{"version":3,"sources":["../../../src/elements/content-uploader/UploadInput.js"],"names":["React","UploadInput","handleChange","inputLabel","inputLabelClass","isFolderUpload","isMultiple","inputRef","useRef","onKeyDown","e","key","current","click","undefined"],"mappings":"AAAA;;;;;AAMA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;;AAUA,IAAMC,WAAW,GAAG,SAAdA,WAAc,OAMP;AAAA,MALTC,YAKS,QALTA,YAKS;AAAA,MAJTC,UAIS,QAJTA,UAIS;AAAA,kCAHTC,eAGS;AAAA,MAHTA,eAGS,qCAHS,EAGT;AAAA,iCAFTC,cAES;AAAA,MAFTA,cAES,oCAFQ,KAER;AAAA,6BADTC,UACS;AAAA,MADTA,UACS,gCADI,IACJ;AACT,MAAMC,QAAQ,GAAGP,KAAK,CAACQ,MAAN,CAAa,IAAb,CAAjB;;AAEA,MAAMC,SAAS,GAAG,SAAZA,SAAY,CAAAC,CAAC,EAAI;AACnB,QAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAnC,EAAwC;AACpC,UAAIJ,QAAQ,CAACK,OAAb,EAAsB;AAClBL,QAAAA,QAAQ,CAACK,OAAT,CAAiBC,KAAjB;AACH;AACJ;AACJ,GAND;;AAQA,SAAOV,UAAU,GACb;AAAO,IAAA,SAAS,EAAEC,eAAlB;AAAmC,IAAA,SAAS,EAAEK,SAA9C;AAAyD,IAAA,QAAQ,EAAE;AAAnE,KACKN,UADL,EAEI;AACI,IAAA,GAAG,EAAEI,QADT;AAEI,IAAA,SAAS,EAAEF,cAAc,GAAG,EAAH,GAAQS,SAFrC;AAGI,IAAA,QAAQ,EAAER,UAHd;AAII,IAAA,QAAQ,EAAEJ,YAJd;AAKI,IAAA,IAAI,EAAC,MALT;AAMI,IAAA,eAAe,EAAEG,cAAc,GAAG,EAAH,GAAQS;AAN3C,IAFJ,CADa,GAYb,IAZJ;AAaH,CA9BD;;AA+BA,eAAeb,WAAf","sourcesContent":["/**\n * @flow\n * @file Input element for folder/file upload\n * @author Box\n */\n\nimport * as React from 'react';\n\ntype Props = {\n    handleChange: Function,\n    inputLabel?: React.Node,\n    inputLabelClass?: string,\n    isFolderUpload?: boolean,\n    isMultiple?: boolean,\n};\n\nconst UploadInput = ({\n    handleChange,\n    inputLabel,\n    inputLabelClass = '',\n    isFolderUpload = false,\n    isMultiple = true,\n}: Props) => {\n    const inputRef = React.useRef(null);\n\n    const onKeyDown = e => {\n        if (e.key === 'Enter' || e.key === ' ') {\n            if (inputRef.current) {\n                inputRef.current.click();\n            }\n        }\n    };\n\n    return inputLabel ? (\n        <label className={inputLabelClass} onKeyDown={onKeyDown} tabIndex={0}>\n            {inputLabel}\n            <input\n                ref={inputRef}\n                directory={isFolderUpload ? '' : undefined}\n                multiple={isMultiple}\n                onChange={handleChange}\n                type=\"file\"\n                webkitdirectory={isFolderUpload ? '' : undefined}\n            />\n        </label>\n    ) : null;\n};\nexport default UploadInput;\n"],"file":"UploadInput.js"}

package/es/features/advanced-content-insights/AdvancedContentInsightsToggle.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import noop from 'lodash/noop';
+import { FormattedMessage } from 'react-intl';
+import InfoBadge16 from '../../icon/fill/InfoBadge16'; // @ts-ignore flow import
+
+import Toggle from '../../components/toggle';
+import Tooltip from '../../components/tooltip';
+import messages from './messages';
+import './AdvancedContentInsightsToggle.scss';
+
+var AdvancedContentInsightsToggle = function AdvancedContentInsightsToggle(_ref) {
+  var hasDescription = _ref.hasDescription,
+      _ref$hasTooltip = _ref.hasTooltip,
+      hasTooltip = _ref$hasTooltip === void 0 ? true : _ref$hasTooltip,
+      _ref$isChecked = _ref.isChecked,
+      isChecked = _ref$isChecked === void 0 ? false : _ref$isChecked,
+      isDisabled = _ref.isDisabled,
+      _ref$onChange = _ref.onChange,
+      _onChange = _ref$onChange === void 0 ? noop : _ref$onChange;
+
+  var description = React.createElement(FormattedMessage, messages.advancedContentInsightsDescription);
+  var label = React.createElement(React.Fragment, null, React.createElement(FormattedMessage, isChecked ? messages.advancedContentInsightsTitleEnabled : messages.advancedContentInsightsTitleDisabled), hasTooltip && React.createElement(Tooltip, {
+    text: description
+  }, React.createElement("div", {
+    className: "AdvancedContentInsightsToggle-icon"
+  }, React.createElement(InfoBadge16, {
+    height: 14,
+    width: 14
+  }))));
+  return React.createElement(Toggle, {
+    className: "AdvancedContentInsightsToggle",
+    "data-testid": "insights-toggle",
+    description: !hasTooltip && hasDescription && description,
+    isDisabled: isDisabled,
+    isOn: isChecked,
+    label: label,
+    onChange: function onChange() {
+      return _onChange(!isChecked);
+    }
+  });
+};
+
+export default AdvancedContentInsightsToggle;
+//# sourceMappingURL=AdvancedContentInsightsToggle.js.map

package/es/features/advanced-content-insights/AdvancedContentInsightsToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/features/advanced-content-insights/AdvancedContentInsightsToggle.tsx"],"names":["React","noop","FormattedMessage","InfoBadge16","Toggle","Tooltip","messages","AdvancedContentInsightsToggle","hasDescription","hasTooltip","isChecked","isDisabled","onChange","description","advancedContentInsightsDescription","label","advancedContentInsightsTitleEnabled","advancedContentInsightsTitleDisabled"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,IAAP,MAAiB,aAAjB;AACA,SAASC,gBAAT,QAAiC,YAAjC;AACA,OAAOC,WAAP,MAAwB,6BAAxB,C,CACA;;AACA,OAAOC,MAAP,MAAmB,yBAAnB;AACA,OAAOC,OAAP,MAAoB,0BAApB;AAEA,OAAOC,QAAP,MAAqB,YAArB;AAEA,OAAO,sCAAP;;AAUA,IAAMC,6BAA6B,GAAG,SAAhCA,6BAAgC,OAMzB;AAAA,MALTC,cAKS,QALTA,cAKS;AAAA,6BAJTC,UAIS;AAAA,MAJTA,UAIS,gCAJI,IAIJ;AAAA,4BAHTC,SAGS;AAAA,MAHTA,SAGS,+BAHG,KAGH;AAAA,MAFTC,UAES,QAFTA,UAES;AAAA,2BADTC,QACS;AAAA,MADTA,SACS,8BADEX,IACF;;AACT,MAAMY,WAAW,GAAG,oBAAC,gBAAD,EAAsBP,QAAQ,CAACQ,kCAA/B,CAApB;AACA,MAAMC,KAAK,GACP,0CACI,oBAAC,gBAAD,EACSL,SAAS,GACRJ,QAAQ,CAACU,mCADD,GAERV,QAAQ,CAACW,oCAHnB,CADJ,EAMKR,UAAU,IACP,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAEI;AAAf,KACI;AAAK,IAAA,SAAS,EAAC;AAAf,KACI,oBAAC,WAAD;AAAa,IAAA,MAAM,EAAE,EAArB;AAAyB,IAAA,KAAK,EAAE;AAAhC,IADJ,CADJ,CAPR,CADJ;AAiBA,SACI,oBAAC,MAAD;AACI,IAAA,SAAS,EAAC,+BADd;AAEI,mBAAY,iBAFhB;AAGI,IAAA,WAAW,EAAE,CAACJ,UAAD,IAAeD,cAAf,IAAiCK,WAHlD;AAII,IAAA,UAAU,EAAEF,UAJhB;AAKI,IAAA,IAAI,EAAED,SALV;AAMI,IAAA,KAAK,EAAEK,KANX;AAOI,IAAA,QAAQ,EAAE;AAAA,aAAMH,SAAQ,CAAC,CAACF,SAAF,CAAd;AAAA;AAPd,IADJ;AAWH,CApCD;;AAsCA,eAAeH,6BAAf","sourcesContent":["import React from 'react';\nimport noop from 'lodash/noop';\nimport { FormattedMessage } from 'react-intl';\nimport InfoBadge16 from '../../icon/fill/InfoBadge16';\n// @ts-ignore flow import\nimport Toggle from '../../components/toggle';\nimport Tooltip from '../../components/tooltip';\n\nimport messages from './messages';\n\nimport './AdvancedContentInsightsToggle.scss';\n\ninterface Props {\n    hasDescription?: boolean;\n    hasTooltip?: boolean;\n    isChecked?: boolean;\n    isDisabled: boolean;\n    onChange?: (isEnabled: boolean) => void;\n}\n\nconst AdvancedContentInsightsToggle = ({\n    hasDescription,\n    hasTooltip = true,\n    isChecked = false,\n    isDisabled,\n    onChange = noop,\n}: Props) => {\n    const description = <FormattedMessage {...messages.advancedContentInsightsDescription} />;\n    const label = (\n        <>\n            <FormattedMessage\n                {...(isChecked\n                    ? messages.advancedContentInsightsTitleEnabled\n                    : messages.advancedContentInsightsTitleDisabled)}\n            />\n            {hasTooltip && (\n                <Tooltip text={description}>\n                    <div className=\"AdvancedContentInsightsToggle-icon\">\n                        <InfoBadge16 height={14} width={14} />\n                    </div>\n                </Tooltip>\n            )}\n        </>\n    );\n\n    return (\n        <Toggle\n            className=\"AdvancedContentInsightsToggle\"\n            data-testid=\"insights-toggle\"\n            description={!hasTooltip && hasDescription && description}\n            isDisabled={isDisabled}\n            isOn={isChecked}\n            label={label}\n            onChange={() => onChange(!isChecked)}\n        />\n    );\n};\n\nexport default AdvancedContentInsightsToggle;\n"],"file":"AdvancedContentInsightsToggle.js"}

package/es/features/advanced-content-insights/AdvancedContentInsightsToggle.scss

@@ -0,0 +1,19 @@
+@import '../../styles/variables';
+
+.AdvancedContentInsightsToggle {
+    margin-bottom: 0;
+
+    .toggle-simple-label {
+        display: flex;
+    }
+
+    .toggle-simple-description {
+        color: $bdl-gray;
+    }
+}
+
+.AdvancedContentInsightsToggle-icon {
+    display: flex;
+    align-items: center;
+    margin-left: 5px;
+}

package/es/features/advanced-content-insights/messages.js

@@ -0,0 +1,17 @@
+import { defineMessages } from 'react-intl';
+var messages = defineMessages({
+  advancedContentInsightsTitleEnabled: {
+    "id": "boxui.advancedContentInsights.advancedContentInsightsTitleEnabled",
+    "defaultMessage": "Engagement Insights is activated"
+  },
+  advancedContentInsightsTitleDisabled: {
+    "id": "boxui.advancedContentInsights.advancedContentInsightsTitleDisabled",
+    "defaultMessage": "Activate Engagement Insights"
+  },
+  advancedContentInsightsDescription: {
+    "id": "boxui.advancedContentInsights.advancedContentInsightsDescription",
+    "defaultMessage": "Get actionable insights into how viewers are engaging with this content. Measure average time spent, page-by-page engagement, per person and per visit details."
+  }
+});
+export default messages;
+//# sourceMappingURL=messages.js.map

package/es/features/advanced-content-insights/messages.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/features/advanced-content-insights/messages.ts"],"names":["defineMessages","messages","advancedContentInsightsTitleEnabled","advancedContentInsightsTitleDisabled","advancedContentInsightsDescription"],"mappings":"AAAA,SAASA,cAAT,QAA+B,YAA/B;AAEA,IAAMC,QAAQ,GAAGD,cAAc,CAAC;AAC5BE,EAAAA,mCAAmC;AAAA;AAAA;AAAA,GADP;AAM5BC,EAAAA,oCAAoC;AAAA;AAAA;AAAA,GANR;AAW5BC,EAAAA,kCAAkC;AAAA;AAAA;AAAA;AAXN,CAAD,CAA/B;AAmBA,eAAeH,QAAf","sourcesContent":["import { defineMessages } from 'react-intl';\n\nconst messages = defineMessages({\n    advancedContentInsightsTitleEnabled: {\n        defaultMessage: 'Engagement Insights is activated',\n        description: 'Advanced Content Insights toggle title',\n        id: 'boxui.advancedContentInsights.advancedContentInsightsTitleEnabled',\n    },\n    advancedContentInsightsTitleDisabled: {\n        defaultMessage: 'Activate Engagement Insights',\n        description: 'Advanced Content Insights toggle title',\n        id: 'boxui.advancedContentInsights.advancedContentInsightsTitleDisabled',\n    },\n    advancedContentInsightsDescription: {\n        defaultMessage:\n            'Get actionable insights into how viewers are engaging with this content. Measure average time spent, page-by-page engagement, per person and per visit details.',\n        description: 'Description text about advanced content insights.',\n        id: 'boxui.advancedContentInsights.advancedContentInsightsDescription',\n    },\n});\n\nexport default messages;\n"],"file":"messages.js"}

package/es/features/classification/classificationColorsMap.js

@@ -36,7 +36,7 @@ var classificationColorsMap = (_classificationColors = {}, _defineProperty(_clas
 }), _defineProperty(_classificationColors, CLASSIFICATION_COLOR_ID_7, {
   name: messages.classificationGrey,
   color: vars.bdlGray20,
-  tinycon: vars.bdlGray62
+  tinycon: vars.bdlGray65
 }), _classificationColors);
 export default classificationColorsMap;
 //# sourceMappingURL=classificationColorsMap.js.map

package/es/features/classification/classificationColorsMap.js.flow

@@ -51,7 +51,7 @@ const classificationColorsMap = {
     [CLASSIFICATION_COLOR_ID_7]: {
         name: messages.classificationGrey,
         color: vars.bdlGray20,
-        tinycon: vars.bdlGray62,
+        tinycon: vars.bdlGray65,
     },
 };
 

package/es/features/classification/classificationColorsMap.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/features/classification/classificationColorsMap.js"],"names":["messages","CLASSIFICATION_COLOR_ID_0","CLASSIFICATION_COLOR_ID_1","CLASSIFICATION_COLOR_ID_2","CLASSIFICATION_COLOR_ID_3","CLASSIFICATION_COLOR_ID_4","CLASSIFICATION_COLOR_ID_5","CLASSIFICATION_COLOR_ID_6","CLASSIFICATION_COLOR_ID_7","vars","classificationColorsMap","name","classificationYellow","color","bdlYellow50","tinycon","bdlYellorange","classificationOrange","bdlOrange50","bdlOrange","classificationRed","bdlWatermelonRed50","bdlWatermelonRed","classificationPurple","bdlPurpleRain50","bdlPurpleRain","classificationLightBlue","bdlLightBlue50","bdlLightBlue","classificationDarkBlue","bdlDarkBlue50","bdlDarkBlue","classificationGreen","bdlGreenLight50","bdlGreenLight","classificationGrey","bdlGray20","bdlGray62"],"mappings":";;;;AACA,OAAOA,QAAP,MAAqB,YAArB;AACA,SACIC,yBADJ,EAEIC,yBAFJ,EAGIC,yBAHJ,EAIIC,yBAJJ,EAKIC,yBALJ,EAMIC,yBANJ,EAOIC,yBAPJ,EAQIC,yBARJ,QASO,aATP;AAUA,OAAO,KAAKC,IAAZ,MAAsB,wBAAtB;AAEA,IAAMC,uBAAuB,uEACxBT,yBADwB,EACI;AACzBU,EAAAA,IAAI,EAAEX,QAAQ,CAACY,oBADU;AAEzBC,EAAAA,KAAK,EAAEJ,IAAI,CAACK,WAFa;AAGzBC,EAAAA,OAAO,EAAEN,IAAI,CAACO;AAHW,CADJ,0CAMxBd,yBANwB,EAMI;AACzBS,EAAAA,IAAI,EAAEX,QAAQ,CAACiB,oBADU;AAEzBJ,EAAAA,KAAK,EAAEJ,IAAI,CAACS,WAFa;AAGzBH,EAAAA,OAAO,EAAEN,IAAI,CAACU;AAHW,CANJ,0CAWxBhB,yBAXwB,EAWI;AACzBQ,EAAAA,IAAI,EAAEX,QAAQ,CAACoB,iBADU;AAEzBP,EAAAA,KAAK,EAAEJ,IAAI,CAACY,kBAFa;AAGzBN,EAAAA,OAAO,EAAEN,IAAI,CAACa;AAHW,CAXJ,0CAgBxBlB,yBAhBwB,EAgBI;AACzBO,EAAAA,IAAI,EAAEX,QAAQ,CAACuB,oBADU;AAEzBV,EAAAA,KAAK,EAAEJ,IAAI,CAACe,eAFa;AAGzBT,EAAAA,OAAO,EAAEN,IAAI,CAACgB;AAHW,CAhBJ,0CAqBxBpB,yBArBwB,EAqBI;AACzBM,EAAAA,IAAI,EAAEX,QAAQ,CAAC0B,uBADU;AAEzBb,EAAAA,KAAK,EAAEJ,IAAI,CAACkB,cAFa;AAGzBZ,EAAAA,OAAO,EAAEN,IAAI,CAACmB;AAHW,CArBJ,0CA0BxBtB,yBA1BwB,EA0BI;AACzBK,EAAAA,IAAI,EAAEX,QAAQ,CAAC6B,sBADU;AAEzBhB,EAAAA,KAAK,EAAEJ,IAAI,CAACqB,aAFa;AAGzBf,EAAAA,OAAO,EAAEN,IAAI,CAACsB;AAHW,CA1BJ,0CA+BxBxB,yBA/BwB,EA+BI;AACzBI,EAAAA,IAAI,EAAEX,QAAQ,CAACgC,mBADU;AAEzBnB,EAAAA,KAAK,EAAEJ,IAAI,CAACwB,eAFa;AAGzBlB,EAAAA,OAAO,EAAEN,IAAI,CAACyB;AAHW,CA/BJ,0CAoCxB1B,yBApCwB,EAoCI;AACzBG,EAAAA,IAAI,EAAEX,QAAQ,CAACmC,kBADU;AAEzBtB,EAAAA,KAAK,EAAEJ,IAAI,CAAC2B,SAFa;AAGzBrB,EAAAA,OAAO,EAAEN,IAAI,CAAC4B;AAHW,CApCJ,yBAA7B;AA2CA,eAAe3B,uBAAf","sourcesContent":["// @flow\nimport messages from './messages';\nimport {\n    CLASSIFICATION_COLOR_ID_0,\n    CLASSIFICATION_COLOR_ID_1,\n    CLASSIFICATION_COLOR_ID_2,\n    CLASSIFICATION_COLOR_ID_3,\n    CLASSIFICATION_COLOR_ID_4,\n    CLASSIFICATION_COLOR_ID_5,\n    CLASSIFICATION_COLOR_ID_6,\n    CLASSIFICATION_COLOR_ID_7,\n} from './constants';\nimport * as vars from '../../styles/variables';\n\nconst classificationColorsMap = {\n    [CLASSIFICATION_COLOR_ID_0]: {\n        name: messages.classificationYellow,\n        color: vars.bdlYellow50,\n        tinycon: vars.bdlYellorange,\n    },\n    [CLASSIFICATION_COLOR_ID_1]: {\n        name: messages.classificationOrange,\n        color: vars.bdlOrange50,\n        tinycon: vars.bdlOrange,\n    },\n    [CLASSIFICATION_COLOR_ID_2]: {\n        name: messages.classificationRed,\n        color: vars.bdlWatermelonRed50,\n        tinycon: vars.bdlWatermelonRed,\n    },\n    [CLASSIFICATION_COLOR_ID_3]: {\n        name: messages.classificationPurple,\n        color: vars.bdlPurpleRain50,\n        tinycon: vars.bdlPurpleRain,\n    },\n    [CLASSIFICATION_COLOR_ID_4]: {\n        name: messages.classificationLightBlue,\n        color: vars.bdlLightBlue50,\n        tinycon: vars.bdlLightBlue,\n    },\n    [CLASSIFICATION_COLOR_ID_5]: {\n        name: messages.classificationDarkBlue,\n        color: vars.bdlDarkBlue50,\n        tinycon: vars.bdlDarkBlue,\n    },\n    [CLASSIFICATION_COLOR_ID_6]: {\n        name: messages.classificationGreen,\n        color: vars.bdlGreenLight50,\n        tinycon: vars.bdlGreenLight,\n    },\n    [CLASSIFICATION_COLOR_ID_7]: {\n        name: messages.classificationGrey,\n        color: vars.bdlGray20,\n        tinycon: vars.bdlGray62,\n    },\n};\n\nexport default classificationColorsMap;\n"],"file":"classificationColorsMap.js"}
+{"version":3,"sources":["../../../src/features/classification/classificationColorsMap.js"],"names":["messages","CLASSIFICATION_COLOR_ID_0","CLASSIFICATION_COLOR_ID_1","CLASSIFICATION_COLOR_ID_2","CLASSIFICATION_COLOR_ID_3","CLASSIFICATION_COLOR_ID_4","CLASSIFICATION_COLOR_ID_5","CLASSIFICATION_COLOR_ID_6","CLASSIFICATION_COLOR_ID_7","vars","classificationColorsMap","name","classificationYellow","color","bdlYellow50","tinycon","bdlYellorange","classificationOrange","bdlOrange50","bdlOrange","classificationRed","bdlWatermelonRed50","bdlWatermelonRed","classificationPurple","bdlPurpleRain50","bdlPurpleRain","classificationLightBlue","bdlLightBlue50","bdlLightBlue","classificationDarkBlue","bdlDarkBlue50","bdlDarkBlue","classificationGreen","bdlGreenLight50","bdlGreenLight","classificationGrey","bdlGray20","bdlGray65"],"mappings":";;;;AACA,OAAOA,QAAP,MAAqB,YAArB;AACA,SACIC,yBADJ,EAEIC,yBAFJ,EAGIC,yBAHJ,EAIIC,yBAJJ,EAKIC,yBALJ,EAMIC,yBANJ,EAOIC,yBAPJ,EAQIC,yBARJ,QASO,aATP;AAUA,OAAO,KAAKC,IAAZ,MAAsB,wBAAtB;AAEA,IAAMC,uBAAuB,uEACxBT,yBADwB,EACI;AACzBU,EAAAA,IAAI,EAAEX,QAAQ,CAACY,oBADU;AAEzBC,EAAAA,KAAK,EAAEJ,IAAI,CAACK,WAFa;AAGzBC,EAAAA,OAAO,EAAEN,IAAI,CAACO;AAHW,CADJ,0CAMxBd,yBANwB,EAMI;AACzBS,EAAAA,IAAI,EAAEX,QAAQ,CAACiB,oBADU;AAEzBJ,EAAAA,KAAK,EAAEJ,IAAI,CAACS,WAFa;AAGzBH,EAAAA,OAAO,EAAEN,IAAI,CAACU;AAHW,CANJ,0CAWxBhB,yBAXwB,EAWI;AACzBQ,EAAAA,IAAI,EAAEX,QAAQ,CAACoB,iBADU;AAEzBP,EAAAA,KAAK,EAAEJ,IAAI,CAACY,kBAFa;AAGzBN,EAAAA,OAAO,EAAEN,IAAI,CAACa;AAHW,CAXJ,0CAgBxBlB,yBAhBwB,EAgBI;AACzBO,EAAAA,IAAI,EAAEX,QAAQ,CAACuB,oBADU;AAEzBV,EAAAA,KAAK,EAAEJ,IAAI,CAACe,eAFa;AAGzBT,EAAAA,OAAO,EAAEN,IAAI,CAACgB;AAHW,CAhBJ,0CAqBxBpB,yBArBwB,EAqBI;AACzBM,EAAAA,IAAI,EAAEX,QAAQ,CAAC0B,uBADU;AAEzBb,EAAAA,KAAK,EAAEJ,IAAI,CAACkB,cAFa;AAGzBZ,EAAAA,OAAO,EAAEN,IAAI,CAACmB;AAHW,CArBJ,0CA0BxBtB,yBA1BwB,EA0BI;AACzBK,EAAAA,IAAI,EAAEX,QAAQ,CAAC6B,sBADU;AAEzBhB,EAAAA,KAAK,EAAEJ,IAAI,CAACqB,aAFa;AAGzBf,EAAAA,OAAO,EAAEN,IAAI,CAACsB;AAHW,CA1BJ,0CA+BxBxB,yBA/BwB,EA+BI;AACzBI,EAAAA,IAAI,EAAEX,QAAQ,CAACgC,mBADU;AAEzBnB,EAAAA,KAAK,EAAEJ,IAAI,CAACwB,eAFa;AAGzBlB,EAAAA,OAAO,EAAEN,IAAI,CAACyB;AAHW,CA/BJ,0CAoCxB1B,yBApCwB,EAoCI;AACzBG,EAAAA,IAAI,EAAEX,QAAQ,CAACmC,kBADU;AAEzBtB,EAAAA,KAAK,EAAEJ,IAAI,CAAC2B,SAFa;AAGzBrB,EAAAA,OAAO,EAAEN,IAAI,CAAC4B;AAHW,CApCJ,yBAA7B;AA2CA,eAAe3B,uBAAf","sourcesContent":["// @flow\nimport messages from './messages';\nimport {\n    CLASSIFICATION_COLOR_ID_0,\n    CLASSIFICATION_COLOR_ID_1,\n    CLASSIFICATION_COLOR_ID_2,\n    CLASSIFICATION_COLOR_ID_3,\n    CLASSIFICATION_COLOR_ID_4,\n    CLASSIFICATION_COLOR_ID_5,\n    CLASSIFICATION_COLOR_ID_6,\n    CLASSIFICATION_COLOR_ID_7,\n} from './constants';\nimport * as vars from '../../styles/variables';\n\nconst classificationColorsMap = {\n    [CLASSIFICATION_COLOR_ID_0]: {\n        name: messages.classificationYellow,\n        color: vars.bdlYellow50,\n        tinycon: vars.bdlYellorange,\n    },\n    [CLASSIFICATION_COLOR_ID_1]: {\n        name: messages.classificationOrange,\n        color: vars.bdlOrange50,\n        tinycon: vars.bdlOrange,\n    },\n    [CLASSIFICATION_COLOR_ID_2]: {\n        name: messages.classificationRed,\n        color: vars.bdlWatermelonRed50,\n        tinycon: vars.bdlWatermelonRed,\n    },\n    [CLASSIFICATION_COLOR_ID_3]: {\n        name: messages.classificationPurple,\n        color: vars.bdlPurpleRain50,\n        tinycon: vars.bdlPurpleRain,\n    },\n    [CLASSIFICATION_COLOR_ID_4]: {\n        name: messages.classificationLightBlue,\n        color: vars.bdlLightBlue50,\n        tinycon: vars.bdlLightBlue,\n    },\n    [CLASSIFICATION_COLOR_ID_5]: {\n        name: messages.classificationDarkBlue,\n        color: vars.bdlDarkBlue50,\n        tinycon: vars.bdlDarkBlue,\n    },\n    [CLASSIFICATION_COLOR_ID_6]: {\n        name: messages.classificationGreen,\n        color: vars.bdlGreenLight50,\n        tinycon: vars.bdlGreenLight,\n    },\n    [CLASSIFICATION_COLOR_ID_7]: {\n        name: messages.classificationGrey,\n        color: vars.bdlGray20,\n        tinycon: vars.bdlGray65,\n    },\n};\n\nexport default classificationColorsMap;\n"],"file":"classificationColorsMap.js"}

package/es/features/collaborator-avatars/CollaboratorAvatarItem.js

@@ -5,7 +5,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import React from 'react';
-import { FormattedMessage } from 'react-intl';
+import { injectIntl } from 'react-intl';
 import Badgeable from '../../components/badgeable/Badgeable';
 import Tooltip from '../../components/tooltip/Tooltip';
 import Avatar from '../../components/avatar';
@@ -16,12 +16,13 @@ var CollaboratorAvatarItem = function CollaboratorAvatarItem(props) {
   var _props$allowBadging = props.allowBadging,
       allowBadging = _props$allowBadging === void 0 ? false : _props$allowBadging,
       expiration = props.expiration,
+      intl = props.intl,
       _props$isExternalColl = props.isExternalCollab,
       isExternalCollab = _props$isExternalColl === void 0 ? false : _props$isExternalColl,
       hasCustomAvatar = props.hasCustomAvatar,
       avatarUrl = props.avatarUrl,
       name = props.name,
-      rest = _objectWithoutProperties(props, ["allowBadging", "expiration", "isExternalCollab", "hasCustomAvatar", "avatarUrl", "name"]);
+      rest = _objectWithoutProperties(props, ["allowBadging", "expiration", "intl", "isExternalCollab", "hasCustomAvatar", "avatarUrl", "name"]);
 
   var avatarInstance = hasCustomAvatar && avatarUrl ? React.createElement(Avatar, _extends({
     avatarUrl: avatarUrl,
@@ -35,14 +36,16 @@ var CollaboratorAvatarItem = function CollaboratorAvatarItem(props) {
     isExternal: isExternalCollab,
     shouldShowExternal: allowBadging
   }));
+  var expirationTooltipMessage = intl.formatMessage(messages.expirationTooltipText, {
+    date: expiration === null || expiration === void 0 ? void 0 : expiration.executeAt
+  });
   var expirationBadge = allowBadging && expiration && expiration.executeAt ? React.createElement(Tooltip, {
     position: "middle-right",
-    text: React.createElement(FormattedMessage, _extends({}, messages.expirationTooltipText, {
-      values: {
-        date: expiration.executeAt
-      }
-    }))
-  }, React.createElement("div", null, React.createElement(IconExpirationBadge, {
+    text: expirationTooltipMessage
+  }, React.createElement("div", {
+    "aria-label": expirationTooltipMessage,
+    role: "img"
+  }, React.createElement(IconExpirationBadge, {
     className: "themed",
     height: 14,
     width: 14
@@ -52,5 +55,6 @@ var CollaboratorAvatarItem = function CollaboratorAvatarItem(props) {
   }, avatarInstance);
 };
 
-export default CollaboratorAvatarItem;
+export { CollaboratorAvatarItem as CollaboratorAvatarItemBase };
+export default injectIntl(CollaboratorAvatarItem);
 //# sourceMappingURL=CollaboratorAvatarItem.js.map

package/es/features/collaborator-avatars/CollaboratorAvatarItem.js.flow

@@ -1,6 +1,7 @@
 /* @flow */
 import React from 'react';
-import { FormattedMessage } from 'react-intl';
+import { injectIntl } from 'react-intl';
+import type { InjectIntlProvidedProps } from 'react-intl';
 
 import Badgeable from '../../components/badgeable/Badgeable';
 import Tooltip from '../../components/tooltip/Tooltip';
@@ -19,12 +20,13 @@ type Props = {
     id: number,
     isExternalCollab?: boolean,
     name: string,
-};
+} & InjectIntlProvidedProps;
 
 const CollaboratorAvatarItem = (props: Props) => {
     const {
         allowBadging = false,
         expiration,
+        intl,
         isExternalCollab = false,
         hasCustomAvatar,
         avatarUrl,
@@ -45,13 +47,13 @@ const CollaboratorAvatarItem = (props: Props) => {
             <Avatar name={name || '-'} {...rest} isExternal={isExternalCollab} shouldShowExternal={allowBadging} />
         );
 
+    const expirationTooltipMessage = intl.formatMessage(messages.expirationTooltipText, {
+        date: expiration?.executeAt,
+    });
     const expirationBadge =
         allowBadging && expiration && expiration.executeAt ? (
-            <Tooltip
-                position="middle-right"
-                text={<FormattedMessage {...messages.expirationTooltipText} values={{ date: expiration.executeAt }} />}
-            >
-                <div>
+            <Tooltip position="middle-right" text={expirationTooltipMessage}>
+                <div aria-label={expirationTooltipMessage} role="img">
                     <IconExpirationBadge className="themed" height={14} width={14} />
                 </div>
             </Tooltip>
@@ -60,4 +62,5 @@ const CollaboratorAvatarItem = (props: Props) => {
     return <Badgeable topLeft={expirationBadge}>{avatarInstance}</Badgeable>;
 };
 
-export default CollaboratorAvatarItem;
+export { CollaboratorAvatarItem as CollaboratorAvatarItemBase };
+export default injectIntl(CollaboratorAvatarItem);

package/es/features/collaborator-avatars/CollaboratorAvatarItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/features/collaborator-avatars/CollaboratorAvatarItem.js"],"names":["React","FormattedMessage","Badgeable","Tooltip","Avatar","IconExpirationBadge","messages","CollaboratorAvatarItem","props","allowBadging","expiration","isExternalCollab","hasCustomAvatar","avatarUrl","name","rest","avatarInstance","expirationBadge","executeAt","expirationTooltipText","date"],"mappings":";;;;;;AACA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,gBAAT,QAAiC,YAAjC;AAEA,OAAOC,SAAP,MAAsB,sCAAtB;AACA,OAAOC,OAAP,MAAoB,kCAApB;AACA,OAAOC,MAAP,MAAmB,yBAAnB;AACA,OAAOC,mBAAP,MAAgC,yCAAhC;AAEA,OAAOC,QAAP,MAAqB,YAArB;;AAcA,IAAMC,sBAAsB,GAAG,SAAzBA,sBAAyB,CAACC,KAAD,EAAkB;AAAA,4BASzCA,KATyC,CAEzCC,YAFyC;AAAA,MAEzCA,YAFyC,oCAE1B,KAF0B;AAAA,MAGzCC,UAHyC,GASzCF,KATyC,CAGzCE,UAHyC;AAAA,8BASzCF,KATyC,CAIzCG,gBAJyC;AAAA,MAIzCA,gBAJyC,sCAItB,KAJsB;AAAA,MAKzCC,eALyC,GASzCJ,KATyC,CAKzCI,eALyC;AAAA,MAMzCC,SANyC,GASzCL,KATyC,CAMzCK,SANyC;AAAA,MAOzCC,IAPyC,GASzCN,KATyC,CAOzCM,IAPyC;AAAA,MAQtCC,IARsC,4BASzCP,KATyC;;AAW7C,MAAMQ,cAAc,GAChBJ,eAAe,IAAIC,SAAnB,GACI,oBAAC,MAAD;AACI,IAAA,SAAS,EAAEA,SADf;AAEI,IAAA,IAAI,EAAEC;AAFV,KAGQC,IAHR;AAII,IAAA,UAAU,EAAEJ,gBAJhB;AAKI,IAAA,kBAAkB,EAAEF;AALxB,KADJ,GASI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAEK,IAAI,IAAI;AAAtB,KAA+BC,IAA/B;AAAqC,IAAA,UAAU,EAAEJ,gBAAjD;AAAmE,IAAA,kBAAkB,EAAEF;AAAvF,KAVR;AAaA,MAAMQ,eAAe,GACjBR,YAAY,IAAIC,UAAhB,IAA8BA,UAAU,CAACQ,SAAzC,GACI,oBAAC,OAAD;AACI,IAAA,QAAQ,EAAC,cADb;AAEI,IAAA,IAAI,EAAE,oBAAC,gBAAD,eAAsBZ,QAAQ,CAACa,qBAA/B;AAAsD,MAAA,MAAM,EAAE;AAAEC,QAAAA,IAAI,EAAEV,UAAU,CAACQ;AAAnB;AAA9D;AAFV,KAII,iCACI,oBAAC,mBAAD;AAAqB,IAAA,SAAS,EAAC,QAA/B;AAAwC,IAAA,MAAM,EAAE,EAAhD;AAAoD,IAAA,KAAK,EAAE;AAA3D,IADJ,CAJJ,CADJ,GASI,IAVR;AAYA,SAAO,oBAAC,SAAD;AAAW,IAAA,OAAO,EAAED;AAApB,KAAsCD,cAAtC,CAAP;AACH,CArCD;;AAuCA,eAAeT,sBAAf","sourcesContent":["/* @flow */\nimport React from 'react';\nimport { FormattedMessage } from 'react-intl';\n\nimport Badgeable from '../../components/badgeable/Badgeable';\nimport Tooltip from '../../components/tooltip/Tooltip';\nimport Avatar from '../../components/avatar';\nimport IconExpirationBadge from '../../icons/general/IconExpirationBadge';\n\nimport messages from './messages';\n\ntype Props = {\n    allowBadging?: boolean,\n    avatarUrl: ?string,\n    expiration?: {\n        executeAt: string,\n    },\n    hasCustomAvatar: ?boolean,\n    id: number,\n    isExternalCollab?: boolean,\n    name: string,\n};\n\nconst CollaboratorAvatarItem = (props: Props) => {\n    const {\n        allowBadging = false,\n        expiration,\n        isExternalCollab = false,\n        hasCustomAvatar,\n        avatarUrl,\n        name,\n        ...rest\n    } = props;\n\n    const avatarInstance =\n        hasCustomAvatar && avatarUrl ? (\n            <Avatar\n                avatarUrl={avatarUrl}\n                name={name}\n                {...rest}\n                isExternal={isExternalCollab}\n                shouldShowExternal={allowBadging}\n            />\n        ) : (\n            <Avatar name={name || '-'} {...rest} isExternal={isExternalCollab} shouldShowExternal={allowBadging} />\n        );\n\n    const expirationBadge =\n        allowBadging && expiration && expiration.executeAt ? (\n            <Tooltip\n                position=\"middle-right\"\n                text={<FormattedMessage {...messages.expirationTooltipText} values={{ date: expiration.executeAt }} />}\n            >\n                <div>\n                    <IconExpirationBadge className=\"themed\" height={14} width={14} />\n                </div>\n            </Tooltip>\n        ) : null;\n\n    return <Badgeable topLeft={expirationBadge}>{avatarInstance}</Badgeable>;\n};\n\nexport default CollaboratorAvatarItem;\n"],"file":"CollaboratorAvatarItem.js"}
+{"version":3,"sources":["../../../src/features/collaborator-avatars/CollaboratorAvatarItem.js"],"names":["React","injectIntl","Badgeable","Tooltip","Avatar","IconExpirationBadge","messages","CollaboratorAvatarItem","props","allowBadging","expiration","intl","isExternalCollab","hasCustomAvatar","avatarUrl","name","rest","avatarInstance","expirationTooltipMessage","formatMessage","expirationTooltipText","date","executeAt","expirationBadge","CollaboratorAvatarItemBase"],"mappings":";;;;;;AACA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,QAA2B,YAA3B;AAGA,OAAOC,SAAP,MAAsB,sCAAtB;AACA,OAAOC,OAAP,MAAoB,kCAApB;AACA,OAAOC,MAAP,MAAmB,yBAAnB;AACA,OAAOC,mBAAP,MAAgC,yCAAhC;AAEA,OAAOC,QAAP,MAAqB,YAArB;;AAcA,IAAMC,sBAAsB,GAAG,SAAzBA,sBAAyB,CAACC,KAAD,EAAkB;AAAA,4BAUzCA,KAVyC,CAEzCC,YAFyC;AAAA,MAEzCA,YAFyC,oCAE1B,KAF0B;AAAA,MAGzCC,UAHyC,GAUzCF,KAVyC,CAGzCE,UAHyC;AAAA,MAIzCC,IAJyC,GAUzCH,KAVyC,CAIzCG,IAJyC;AAAA,8BAUzCH,KAVyC,CAKzCI,gBALyC;AAAA,MAKzCA,gBALyC,sCAKtB,KALsB;AAAA,MAMzCC,eANyC,GAUzCL,KAVyC,CAMzCK,eANyC;AAAA,MAOzCC,SAPyC,GAUzCN,KAVyC,CAOzCM,SAPyC;AAAA,MAQzCC,IARyC,GAUzCP,KAVyC,CAQzCO,IARyC;AAAA,MAStCC,IATsC,4BAUzCR,KAVyC;;AAY7C,MAAMS,cAAc,GAChBJ,eAAe,IAAIC,SAAnB,GACI,oBAAC,MAAD;AACI,IAAA,SAAS,EAAEA,SADf;AAEI,IAAA,IAAI,EAAEC;AAFV,KAGQC,IAHR;AAII,IAAA,UAAU,EAAEJ,gBAJhB;AAKI,IAAA,kBAAkB,EAAEH;AALxB,KADJ,GASI,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAEM,IAAI,IAAI;AAAtB,KAA+BC,IAA/B;AAAqC,IAAA,UAAU,EAAEJ,gBAAjD;AAAmE,IAAA,kBAAkB,EAAEH;AAAvF,KAVR;AAaA,MAAMS,wBAAwB,GAAGP,IAAI,CAACQ,aAAL,CAAmBb,QAAQ,CAACc,qBAA5B,EAAmD;AAChFC,IAAAA,IAAI,EAAEX,UAAF,aAAEA,UAAF,uBAAEA,UAAU,CAAEY;AAD8D,GAAnD,CAAjC;AAGA,MAAMC,eAAe,GACjBd,YAAY,IAAIC,UAAhB,IAA8BA,UAAU,CAACY,SAAzC,GACI,oBAAC,OAAD;AAAS,IAAA,QAAQ,EAAC,cAAlB;AAAiC,IAAA,IAAI,EAAEJ;AAAvC,KACI;AAAK,kBAAYA,wBAAjB;AAA2C,IAAA,IAAI,EAAC;AAAhD,KACI,oBAAC,mBAAD;AAAqB,IAAA,SAAS,EAAC,QAA/B;AAAwC,IAAA,MAAM,EAAE,EAAhD;AAAoD,IAAA,KAAK,EAAE;AAA3D,IADJ,CADJ,CADJ,GAMI,IAPR;AASA,SAAO,oBAAC,SAAD;AAAW,IAAA,OAAO,EAAEK;AAApB,KAAsCN,cAAtC,CAAP;AACH,CAtCD;;AAwCA,SAASV,sBAAsB,IAAIiB,0BAAnC;AACA,eAAevB,UAAU,CAACM,sBAAD,CAAzB","sourcesContent":["/* @flow */\nimport React from 'react';\nimport { injectIntl } from 'react-intl';\nimport type { InjectIntlProvidedProps } from 'react-intl';\n\nimport Badgeable from '../../components/badgeable/Badgeable';\nimport Tooltip from '../../components/tooltip/Tooltip';\nimport Avatar from '../../components/avatar';\nimport IconExpirationBadge from '../../icons/general/IconExpirationBadge';\n\nimport messages from './messages';\n\ntype Props = {\n    allowBadging?: boolean,\n    avatarUrl: ?string,\n    expiration?: {\n        executeAt: string,\n    },\n    hasCustomAvatar: ?boolean,\n    id: number,\n    isExternalCollab?: boolean,\n    name: string,\n} & InjectIntlProvidedProps;\n\nconst CollaboratorAvatarItem = (props: Props) => {\n    const {\n        allowBadging = false,\n        expiration,\n        intl,\n        isExternalCollab = false,\n        hasCustomAvatar,\n        avatarUrl,\n        name,\n        ...rest\n    } = props;\n\n    const avatarInstance =\n        hasCustomAvatar && avatarUrl ? (\n            <Avatar\n                avatarUrl={avatarUrl}\n                name={name}\n                {...rest}\n                isExternal={isExternalCollab}\n                shouldShowExternal={allowBadging}\n            />\n        ) : (\n            <Avatar name={name || '-'} {...rest} isExternal={isExternalCollab} shouldShowExternal={allowBadging} />\n        );\n\n    const expirationTooltipMessage = intl.formatMessage(messages.expirationTooltipText, {\n        date: expiration?.executeAt,\n    });\n    const expirationBadge =\n        allowBadging && expiration && expiration.executeAt ? (\n            <Tooltip position=\"middle-right\" text={expirationTooltipMessage}>\n                <div aria-label={expirationTooltipMessage} role=\"img\">\n                    <IconExpirationBadge className=\"themed\" height={14} width={14} />\n                </div>\n            </Tooltip>\n        ) : null;\n\n    return <Badgeable topLeft={expirationBadge}>{avatarInstance}</Badgeable>;\n};\n\nexport { CollaboratorAvatarItem as CollaboratorAvatarItemBase };\nexport default injectIntl(CollaboratorAvatarItem);\n"],"file":"CollaboratorAvatarItem.js"}

package/es/features/collaborator-avatars/CollaboratorAvatars.scss

@@ -13,7 +13,7 @@
 
     .avatars-label {
         margin-right: 5px;
-        color: $bdl-gray-62;
+        color: $bdl-gray-65;
     }
 
     .avatars {

package/es/features/collaborator-avatars/CollaboratorList.js

@@ -24,7 +24,6 @@ import * as React from 'react';
 import { FormattedMessage } from 'react-intl';
 import { ModalActions } from '../../components/modal';
 import Button from '../../components/button';
-import PlainButton from '../../components/plain-button';
 import { Link } from '../../components/link';
 import CollaborationBadge from '../../icons/badges/CollaborationBadge';
 import commonMessages from '../../common/messages';
@@ -70,9 +69,8 @@ function (_React$Component) {
           manageLinkProps = trackingProps.manageLinkProps,
           viewAdditionalProps = trackingProps.viewAdditionalProps,
           doneButtonProps = trackingProps.doneButtonProps;
-      var manageAllBtn = React.createElement(PlainButton, {
-        className: "manage-all-btn",
-        type: "button"
+      var manageAllBtn = React.createElement("span", {
+        className: "manage-all-btn"
       }, React.createElement(FormattedMessage, messages.manageAllLinkText));
       var maxListSizeToRender = Math.min(maxCollaboratorListSize, MAX_COLLABORATOR_LIST_SIZE);
       return React.createElement("div", {
@@ -100,7 +98,8 @@ function (_React$Component) {
         width: 32
       })), React.createElement("div", null, this.createCollaboratorPageLink(React.createElement(FormattedMessage, messages.viewAdditionalPeopleText), viewAdditionalProps)))), React.createElement(ModalActions, null, React.createElement(Button, _extends({
         className: "btn-done",
-        onClick: onDoneClick
+        onClick: onDoneClick,
+        type: "button"
       }, doneButtonProps), React.createElement(FormattedMessage, commonMessages.done))));
     }
   }]);

package/es/features/collaborator-avatars/CollaboratorList.js.flow

@@ -4,7 +4,6 @@ import { FormattedMessage } from 'react-intl';
 
 import { ModalActions } from '../../components/modal';
 import Button from '../../components/button';
-import PlainButton from '../../components/plain-button';
 import { Link } from '../../components/link';
 import CollaborationBadge from '../../icons/badges/CollaborationBadge';
 import type {
@@ -51,9 +50,9 @@ class CollaboratorList extends React.Component<Props> {
         const { collaborators, onDoneClick, maxCollaboratorListSize, trackingProps } = this.props;
         const { usernameProps, emailProps, manageLinkProps, viewAdditionalProps, doneButtonProps } = trackingProps;
         const manageAllBtn = (
-            <PlainButton className="manage-all-btn" type="button">
+            <span className="manage-all-btn">
                 <FormattedMessage {...messages.manageAllLinkText} />
-            </PlainButton>
+            </span>
         );
         const maxListSizeToRender = Math.min(maxCollaboratorListSize, MAX_COLLABORATOR_LIST_SIZE);
 
@@ -92,7 +91,7 @@ class CollaboratorList extends React.Component<Props> {
                     )}
                 </ul>
                 <ModalActions>
-                    <Button className="btn-done" onClick={onDoneClick} {...doneButtonProps}>
+                    <Button className="btn-done" onClick={onDoneClick} type="button" {...doneButtonProps}>
                         <FormattedMessage {...commonMessages.done} />
                     </Button>
                 </ModalActions>