@splunk/react-ui 4.1.0 → 4.4.1

package/File.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 108);
+/******/ 	return __webpack_require__(__webpack_require__.s = 107);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -108,7 +108,7 @@ module.exports = require("@splunk/ui-utils/id");
 
 /***/ }),
 
-/***/ 108:
+/***/ 107:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -144,17 +144,17 @@ var i18n_ = __webpack_require__(5);
 var id_ = __webpack_require__(10);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/format"
-var format_ = __webpack_require__(37);
+var format_ = __webpack_require__(41);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Progress"
-var Progress_ = __webpack_require__(75);
+var Progress_ = __webpack_require__(77);
 var Progress_default = /*#__PURE__*/__webpack_require__.n(Progress_);
 
 // EXTERNAL MODULE: ./src/icons/CrossMark.tsx
-var CrossMark = __webpack_require__(20);
+var CrossMark = __webpack_require__(21);
 
 // EXTERNAL MODULE: external "@splunk/react-icons/SVG"
-var SVG_ = __webpack_require__(21);
+var SVG_ = __webpack_require__(22);
 var SVG_default = /*#__PURE__*/__webpack_require__.n(SVG_);
 
 // CONCATENATED MODULE: ./src/File/PaperClip.tsx
@@ -215,6 +215,13 @@ function Trash(props) {
     fill: "currentColor"
   }));
 }
+// CONCATENATED MODULE: ./src/File/FileContext.tsx
+
+var FileContext = /*#__PURE__*/Object(external_react_["createContext"])({
+  disabled: false
+});
+FileContext.displayName = 'File';
+/* harmony default export */ var File_FileContext = (FileContext);
 // EXTERNAL MODULE: external "styled-components"
 var external_styled_components_ = __webpack_require__(3);
 var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
@@ -228,7 +235,7 @@ var Clickable_ = __webpack_require__(11);
 var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_);
 
 // EXTERNAL MODULE: external "@splunk/themes/mixins"
-var mixins_ = __webpack_require__(76);
+var mixins_ = __webpack_require__(78);
 
 // CONCATENATED MODULE: ./src/File/ItemStyles.ts
 
@@ -399,19 +406,16 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 
+
 var propTypes = {
-  /** @private */
   disabled: external_prop_types_default.a.bool,
   elementRef: external_prop_types_default.a.oneOfType([external_prop_types_default.a.func, external_prop_types_default.a.object]),
   error: external_prop_types_default.a.bool,
-  itemId: external_prop_types_default.a.any,
-  name: external_prop_types_default.a.string.isRequired,
 
   /** @private */
-  onRequestRemove: external_prop_types_default.a.func,
-
-  /** @private */
-  onRequestRetry: external_prop_types_default.a.func,
+  index: external_prop_types_default.a.number,
+  itemId: external_prop_types_default.a.any,
+  name: external_prop_types_default.a.string.isRequired,
 
   /** If the uploadPercentage is 0, the item is assumed to be queued. If the upload is complete or
    * not applicable, uploadPercentage must be undefined. */
@@ -419,16 +423,15 @@ var propTypes = {
 };
 
 function Item(_ref) {
-  var _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+  var disabled = _ref.disabled,
       _ref$error = _ref.error,
       error = _ref$error === void 0 ? false : _ref$error,
       itemId = _ref.itemId,
       name = _ref.name,
-      onRequestRemove = _ref.onRequestRemove,
-      onRequestRetry = _ref.onRequestRetry,
+      _ref$index = _ref.index,
+      index = _ref$index === void 0 ? 0 : _ref$index,
       uploadPercentage = _ref.uploadPercentage,
-      otherProps = _objectWithoutProperties(_ref, ["disabled", "error", "itemId", "name", "onRequestRemove", "onRequestRetry", "uploadPercentage"]);
+      otherProps = _objectWithoutProperties(_ref, ["disabled", "error", "itemId", "name", "index", "uploadPercentage"]);
 
   // @docs-props-type ItemPropsBase
   var _useSplunkTheme = Object(themes_["useSplunkTheme"])(),
@@ -436,22 +439,33 @@ function Item(_ref) {
 
   var isPrisma = family === 'prisma';
 
+  var _useContext = Object(external_react_["useContext"])(FileContext),
+      handleRequestRemoveContext = _useContext.onRequestRemove;
+
   function handleRequestRemove(e) {
     e.preventDefault();
-    onRequestRemove === null || onRequestRemove === void 0 ? void 0 : onRequestRemove({
+    handleRequestRemoveContext === null || handleRequestRemoveContext === void 0 ? void 0 : handleRequestRemoveContext({
       itemId: itemId,
-      name: name
+      name: name,
+      index: index
     });
   }
 
+  var _useContext2 = Object(external_react_["useContext"])(FileContext),
+      handleRequestRetryContext = _useContext2.onRequestRetry;
+
   function handleRequestRetry(e) {
     e.preventDefault();
-    onRequestRetry === null || onRequestRetry === void 0 ? void 0 : onRequestRetry({
+    handleRequestRetryContext === null || handleRequestRetryContext === void 0 ? void 0 : handleRequestRetryContext({
       itemId: itemId,
-      name: name
+      name: name,
+      index: index
     });
   }
 
+  var _useContext3 = Object(external_react_["useContext"])(FileContext),
+      disabledContext = _useContext3.disabled;
+
   var removeLabel = Object(format_["sprintf"])(Object(i18n_["_"])('Remove "%(filename)s"'), {
     filename: name
   });
@@ -467,28 +481,30 @@ function Item(_ref) {
     }
   }, Object(i18n_["_"])('Uploading ')), /*#__PURE__*/external_react_default.a.createElement(StyledPercentage, null, uploadPercentage, "%"));
   var label = isPrisma && !Object(external_lodash_["isUndefined"])(uploadPercentage) && uploadPercentage > 0 ? progressLabel : name;
+  var disabledValue = disabled !== undefined ? disabled : disabledContext;
   return /*#__PURE__*/external_react_default.a.createElement(external_react_default.a.Fragment, null, /*#__PURE__*/external_react_default.a.createElement(StyledBox, Item_extends({
-    "data-test": "item"
+    "data-test": "item",
+    "data-test-disabled": disabledValue
   }, otherProps, {
     flex: true,
     $error: error,
-    $disabled: disabled
+    $disabled: disabledValue
   }), isPrisma && Object(external_lodash_["isUndefined"])(uploadPercentage) && /*#__PURE__*/external_react_default.a.createElement(StyledPaperClipIcon, {
     "data-test": "paper-clip",
-    $disabled: disabled
+    $disabled: disabledValue
   }, /*#__PURE__*/external_react_default.a.createElement(PaperClip, {
     "aria-hidden": "true"
   })), /*#__PURE__*/external_react_default.a.createElement(StyledLabel, {
     "data-test": "label",
     $error: error,
-    $disabled: disabled
-  }, label), isPrisma && onRequestRetry && error && /*#__PURE__*/external_react_default.a.createElement(StyledIconClickable, {
+    $disabled: disabledValue
+  }, label), isPrisma && handleRequestRetryContext && error && /*#__PURE__*/external_react_default.a.createElement(StyledIconClickable, {
     "data-test": "retry",
     onClick: handleRequestRetry,
     "aria-label": retryLabel
   }, /*#__PURE__*/external_react_default.a.createElement(Retry, {
     screenReaderText: Object(i18n_["_"])('Retry')
-  })), !disabled && (isPrisma && Object(external_lodash_["isUndefined"])(uploadPercentage) && !error ? /*#__PURE__*/external_react_default.a.createElement(StyledTrashIcon, {
+  })), !disabledValue && (isPrisma && Object(external_lodash_["isUndefined"])(uploadPercentage) && !error ? /*#__PURE__*/external_react_default.a.createElement(StyledTrashIcon, {
     "data-test": "remove",
     onClick: handleRequestRemove,
     "aria-label": removeLabel
@@ -727,6 +743,9 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 
 
+
+/** @public */
+
 var File_propTypes = {
   accept: external_prop_types_default.a.string,
   allowMultiple: external_prop_types_default.a.bool,
@@ -874,40 +893,9 @@ var File_File = /*#__PURE__*/function (_Component) {
       var isPrisma = splunkTheme.family === 'prisma';
       var fileCount = 0;
       var childrenCloned = external_react_["Children"].toArray(children).filter(external_react_["isValidElement"]).map(function (item, index) {
-        var handleRemove = function handleRemove(event) {
-          onRequestRemove === null || onRequestRemove === void 0 ? void 0 : onRequestRemove({
-            event: event,
-            filename: item.props.name,
-            index: index,
-            itemId: item.props.itemId,
-            name: name
-          });
-        };
-
-        var handleRetry = function handleRetry(event) {
-          onRequestRetry === null || onRequestRetry === void 0 ? void 0 : onRequestRetry({
-            event: event,
-            filename: item.props.name,
-            index: index,
-            itemId: item.props.itemId,
-            name: name
-          });
-        };
-
         fileCount += 1;
-
-        if (onRequestRemove || onRequestRetry) {
-          return /*#__PURE__*/Object(external_react_["cloneElement"])(item, {
-            disabled: disabled,
-            onRequestRemove: onRequestRemove ? handleRemove : undefined,
-            onRequestRetry: onRequestRetry ? handleRetry : undefined,
-            key: item.key || item.props.itemId || "item-".concat(index)
-          });
-        } // custom children have no onRequestRemove or onRequestRetry
-
-
         return /*#__PURE__*/Object(external_react_["cloneElement"])(item, {
-          disabled: disabled,
+          index: index,
           key: item.key || item.props.itemId || "item-".concat(index)
         });
       });
@@ -919,6 +907,27 @@ var File_File = /*#__PURE__*/function (_Component) {
       var StyledIcon = fullscreen ? StyledWindowIcon : StyledNormalIcon;
       var dragOver = dragOverOrDisabled ? false : this.state.dragOver || false;
       var fileTypes = Object(external_lodash_["isString"])(accept) && Object(external_lodash_["toUpper"])(accept.split(',').join(', '));
+
+      var handleRetry = function handleRetry(event) {
+        onRequestRetry === null || onRequestRetry === void 0 ? void 0 : onRequestRetry({
+          event: event,
+          filename: event.name,
+          index: event.index,
+          itemId: event.itemId,
+          name: name
+        });
+      };
+
+      var handleRemove = function handleRemove(event) {
+        onRequestRemove === null || onRequestRemove === void 0 ? void 0 : onRequestRemove({
+          event: event,
+          index: event.index,
+          filename: event.name,
+          itemId: event.itemId,
+          name: name
+        });
+      };
+
       return /*#__PURE__*/external_react_default.a.createElement(StyledDropTargetBox, File_extends({
         onDragOver: dragOverOrDisabled ? undefined : this.handleDragOver,
         onDragLeave: dragOverOrDisabled ? undefined : this.handleDragLeave,
@@ -958,7 +967,13 @@ var File_File = /*#__PURE__*/function (_Component) {
         onDragOver: this.handleDragOver,
         onDrop: this.handleDrop,
         target: window
-      }), childrenCloned);
+      }), /*#__PURE__*/external_react_default.a.createElement(File_FileContext.Provider, {
+        value: {
+          disabled: disabled,
+          onRequestRemove: onRequestRemove ? handleRemove : undefined,
+          onRequestRetry: onRequestRetry ? handleRetry : undefined
+        }
+      }, childrenCloned));
     }
   }]);
 
@@ -1004,14 +1019,14 @@ module.exports = require("react");
 
 /***/ }),
 
-/***/ 20:
+/***/ 21:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return CrossMark; });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _splunk_react_icons_Close__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(23);
+/* harmony import */ var _splunk_react_icons_Close__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(25);
 /* harmony import */ var _splunk_react_icons_Close__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_splunk_react_icons_Close__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _ThemedIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7);
 /* harmony import */ var _SVG__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6);
@@ -1054,14 +1069,14 @@ function CrossMark(props) {
 
 /***/ }),
 
-/***/ 21:
+/***/ 22:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/SVG");
 
 /***/ }),
 
-/***/ 23:
+/***/ 25:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-icons/Close");
@@ -1075,17 +1090,17 @@ module.exports = require("styled-components");
 
 /***/ }),
 
-/***/ 37:
+/***/ 4:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/ui-utils/format");
+module.exports = require("lodash");
 
 /***/ }),
 
-/***/ 4:
+/***/ 41:
 /***/ (function(module, exports) {
 
-module.exports = require("lodash");
+module.exports = require("@splunk/ui-utils/format");
 
 /***/ }),
 
@@ -1239,14 +1254,14 @@ Icon.defaultProps = defaultProps;
 
 /***/ }),
 
-/***/ 75:
+/***/ 77:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/Progress");
 
 /***/ }),
 
-/***/ 76:
+/***/ 78:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/themes/mixins");