@k-int/stripes-kint-components 2.8.2 → 3.0.0

package/CHANGELOG.md

@@ -1,8 +1,20 @@
-## 2.8.2 2022-07-25
+## 3.0.0 In progress
+  * RichSelect default trigger now uses DropdownButton under the hood -- changed styling
+  * ActionList previously added actionListItems directly to cached object--sometimes this caused the react-query cache ITSELF to update, although I'm not sure why here and not anywhere else. Fixed by creating a clone internally in ActionListFieldArray and assigning actionListActions on that.
   * New util function `parseErrorResponse`, used in places where we catch http errors, allows for text only response bodies
+  * onRowClick supplied to ActionList now controls whether or not the underlying MCL is considered "interactive"
+  * ActionList actions now accept `tooltip` and `tooltipSub` props to control a wrapper Tooltip on the action
+  * Complete overhaul of translations and labelOverrides. Not backwards compatible, hence major version bump.
+    * Translations now require a setup hook "useIntlKeyStore" to set up a favoured intl key, then use that throughout:
 
-## 2.8.1 2022-07-21
-  * ActionList previously added actionListItems directly to cached object--sometimes this caused the react-query cache ITSELF to update, although I'm not sure why here and not anywhere else. Fixed by creating a clone internally in ActionListFieldArray and assigning actionListActions on that.
+    ```
+    const addKey = useIntlKeyStore(state => state.addKey);
+    addKey('ui-agreements');
+    ```
+
+    * Translations can be overridden by labelOverrides, but these must now ALWAYS be a String, either direct translated string value, or an intl key that can then be passed certain values where applicable
+  * Removed deprecated "actionCalls" prop from ActionList
+  * Removed `useAvailableCustomProperties`
 
 ## 2.8.0 2022-07-15
   * Fixed bug where non-createable fields which were editable would display a field on creation.

package/es/index.js

@@ -131,6 +131,12 @@ Object.defineProperty(exports, "FormModal", {
     return _FormModal.default;
   }
 });
+Object.defineProperty(exports, "FormattedKintMessage", {
+  enumerable: true,
+  get: function get() {
+    return _FormattedKintMessage.default;
+  }
+});
 Object.defineProperty(exports, "IconSelect", {
   enumerable: true,
   get: function get() {
@@ -224,7 +230,13 @@ Object.defineProperty(exports, "boldString", {
 Object.defineProperty(exports, "composeValidators", {
   enumerable: true,
   get: function get() {
-    return _validators.composeValidators;
+    return _utils.composeValidators;
+  }
+});
+Object.defineProperty(exports, "composeValidatorsWithArgs", {
+  enumerable: true,
+  get: function get() {
+    return _utils.composeValidatorsWithArgs;
   }
 });
 exports.customPropertyContants = void 0;
@@ -255,7 +267,7 @@ Object.defineProperty(exports, "highlightString", {
 Object.defineProperty(exports, "invalidNumber", {
   enumerable: true,
   get: function get() {
-    return _validators.invalidNumber;
+    return _utils.invalidNumber;
   }
 });
 Object.defineProperty(exports, "matchString", {
@@ -270,6 +282,18 @@ Object.defineProperty(exports, "parseErrorResponse", {
     return _utils.parseErrorResponse;
   }
 });
+Object.defineProperty(exports, "rangeOverflow", {
+  enumerable: true,
+  get: function get() {
+    return _utils.rangeOverflow;
+  }
+});
+Object.defineProperty(exports, "rangeUnderflow", {
+  enumerable: true,
+  get: function get() {
+    return _utils.rangeUnderflow;
+  }
+});
 Object.defineProperty(exports, "refdataOptions", {
   enumerable: true,
   get: function get() {
@@ -285,13 +309,13 @@ Object.defineProperty(exports, "refdataQueryKey", {
 Object.defineProperty(exports, "required", {
   enumerable: true,
   get: function get() {
-    return _validators.required;
+    return _utils.required;
   }
 });
 Object.defineProperty(exports, "requiredObject", {
   enumerable: true,
   get: function get() {
-    return _validators.requiredObject;
+    return _utils.requiredObject;
   }
 });
 Object.defineProperty(exports, "selectorSafe", {
@@ -318,12 +342,6 @@ Object.defineProperty(exports, "useAppSettings", {
     return _hooks.useAppSettings;
   }
 });
-Object.defineProperty(exports, "useAvailableCustomProperties", {
-  enumerable: true,
-  get: function get() {
-    return _hooks.useAvailableCustomProperties;
-  }
-});
 Object.defineProperty(exports, "useCustomProperties", {
   enumerable: true,
   get: function get() {
@@ -336,12 +354,30 @@ Object.defineProperty(exports, "useHelperApp", {
     return _hooks.useHelperApp;
   }
 });
+Object.defineProperty(exports, "useIntlKey", {
+  enumerable: true,
+  get: function get() {
+    return _hooks.useIntlKey;
+  }
+});
+Object.defineProperty(exports, "useIntlKeyStore", {
+  enumerable: true,
+  get: function get() {
+    return _hooks.useIntlKeyStore;
+  }
+});
 Object.defineProperty(exports, "useInvalidateRefdata", {
   enumerable: true,
   get: function get() {
     return _hooks.useInvalidateRefdata;
   }
 });
+Object.defineProperty(exports, "useKintIntl", {
+  enumerable: true,
+  get: function get() {
+    return _hooks.useKintIntl;
+  }
+});
 Object.defineProperty(exports, "useKiwtFieldArray", {
   enumerable: true,
   get: function get() {
@@ -419,8 +455,6 @@ var _hooks = require("./lib/hooks");
 
 var _utils = require("./lib/utils");
 
-var _validators = require("./lib/utils/validators");
-
 var _contexts = require("./lib/contexts");
 
 var _SettingPage = require("./lib/SettingPage");
@@ -461,6 +495,8 @@ var _IconSelect = _interopRequireDefault(require("./lib/IconSelect"));
 
 var _RichSelect = _interopRequireWildcard(require("./lib/RichSelect"));
 
+var _FormattedKintMessage = _interopRequireDefault(require("./lib/FormattedKintMessage"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/es/lib/ActionList/ActionList.js

@@ -21,7 +21,7 @@ var _ActionListFieldArray = _interopRequireDefault(require("./ActionListFieldArr
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _excluded = ["actionAssigner", "actionCalls", "columnMapping", "contentData", "creatableFields", "createCallback", "defaultNewObject", "editableFields", "fieldComponents", "hideCreateButton", "label", "validateFields", "visibleFields"];
+var _excluded = ["actionAssigner", "columnMapping", "contentData", "creatableFields", "createCallback", "defaultNewObject", "editableFields", "fieldComponents", "hideCreateButton", "intlKey", "intlNS", "label", "labelOverrides", "validateFields", "visibleFields"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -41,7 +41,6 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 var propTypes = {
   actionAssigner: _propTypes.default.func,
-  actionCalls: _propTypes.default.object,
   columnMapping: _propTypes.default.object,
   contentData: _propTypes.default.arrayOf(_propTypes.default.object),
   creatableFields: _propTypes.default.object,
@@ -50,14 +49,15 @@ var propTypes = {
   editableFields: _propTypes.default.object,
   fieldComponents: _propTypes.default.object,
   hideCreateButton: _propTypes.default.bool,
+  intlKey: _propTypes.default.string,
+  intlNS: _propTypes.default.string,
   label: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
+  labelOverrides: _propTypes.default.object,
   validateFields: _propTypes.default.object,
   visibleFields: _propTypes.default.arrayOf(_propTypes.default.string)
 };
 var ActionList = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var actionAssigner = _ref.actionAssigner,
-      _ref$actionCalls = _ref.actionCalls,
-      actionCalls = _ref$actionCalls === void 0 ? {} : _ref$actionCalls,
       columnMapping = _ref.columnMapping,
       contentData = _ref.contentData,
       _ref$creatableFields = _ref.creatableFields,
@@ -70,7 +70,11 @@ var ActionList = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
       _ref$fieldComponents = _ref.fieldComponents,
       fieldComponents = _ref$fieldComponents === void 0 ? {} : _ref$fieldComponents,
       hideCreateButton = _ref.hideCreateButton,
+      passedIntlKey = _ref.intlKey,
+      passedIntlNS = _ref.intlNS,
       label = _ref.label,
+      _ref$labelOverrides = _ref.labelOverrides,
+      labelOverrides = _ref$labelOverrides === void 0 ? {} : _ref$labelOverrides,
       validateFields = _ref.validateFields,
       visibleFields = _ref.visibleFields,
       mclProps = _objectWithoutProperties(_ref, _excluded);
@@ -102,7 +106,6 @@ var ActionList = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
           },
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalFormArrays.FieldArray, _objectSpread({
             actionAssigner: actionAssigner,
-            actionCalls: actionCalls,
             columnMapping: columnMapping,
             component: ActionListFieldArrayWithRef,
             creatableFields: creatableFields,
@@ -111,7 +114,10 @@ var ActionList = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
             editableFields: editableFields,
             fieldComponents: fieldComponents,
             hideCreateButton: hideCreateButton,
+            intlKey: passedIntlKey,
+            intlNS: passedIntlNS,
             label: label,
+            labelOverrides: labelOverrides,
             name: "contentData",
             triggerFormSubmit: handleSubmit,
             validateFields: validateFields,

package/es/lib/ActionList/ActionListFieldArray.js

@@ -11,8 +11,6 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _reactIntl = require("react-intl");
-
 var _get = _interopRequireDefault(require("lodash/get"));
 
 var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));
@@ -21,15 +19,19 @@ var _reactFinalForm = require("react-final-form");
 
 var _components = require("@folio/stripes/components");
 
+var _hooks = require("../hooks");
+
 var _ActionListFieldArray = _interopRequireDefault(require("../../../styles/ActionListFieldArray.css"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _excluded = ["actionAssigner", "actionCalls", "columnMapping", "creatableFields", "createCallback", "defaultNewObject", "editableFields", "fields", "fieldComponents", "hideCreateButton", "label", "validateFields", "visibleFields", "triggerFormSubmit"],
-    _excluded2 = ["actionListActions", "fieldName", "fieldIndex"],
+var _excluded = ["action"],
+    _excluded2 = ["actionAssigner", "columnMapping", "creatableFields", "createCallback", "defaultNewObject", "editableFields", "fields", "fieldComponents", "hideCreateButton", "intlKey", "intlNS", "label", "labelOverrides", "onRowClick", "validateFields", "visibleFields", "triggerFormSubmit"],
     _excluded3 = ["actionListActions", "fieldName", "fieldIndex"],
-    _excluded4 = ["actionListActions"],
-    _excluded5 = ["formatter"];
+    _excluded4 = ["actionListActions", "fieldName", "fieldIndex"],
+    _excluded5 = ["actionListActions"],
+    _excluded6 = ["formatter"],
+    _excluded7 = ["actionListActions"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -45,12 +47,6 @@ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symb
 
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -63,6 +59,12 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
 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; }
@@ -72,7 +74,6 @@ var NON_EDITING_ACTIONS_WIDTH = 20;
 var TOTAL_WIDTH = 100;
 var propTypes = {
   actionAssigner: _propTypes.default.func,
-  actionCalls: _propTypes.default.object,
   columnMapping: _propTypes.default.object,
   creatableFields: _propTypes.default.object,
   createCallback: _propTypes.default.func,
@@ -82,28 +83,64 @@ var propTypes = {
   fieldComponents: _propTypes.default.object,
   formatter: _propTypes.default.object,
   hideCreateButton: _propTypes.default.bool,
+  intlKey: _propTypes.default.string,
+  intlNS: _propTypes.default.string,
   label: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
+  labelOverrides: _propTypes.default.object,
+  onRowClick: _propTypes.default.func,
   triggerFormSubmit: _propTypes.default.func.isRequired,
   validateFields: _propTypes.default.object,
   visibleFields: _propTypes.default.arrayOf(_propTypes.default.string)
+}; // This needs to be outside of the main component for forwardRef to work properly it seems.
+
+var ActionTrigger = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var _action$label;
+
+  var action = _ref.action,
+      actionTriggerProps = _objectWithoutProperties(_ref, _excluded);
+
+  if (action.icon) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.IconButton, _objectSpread({
+      ref: ref,
+      icon: action.icon
+    }, actionTriggerProps));
+  }
+
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, _objectSpread(_objectSpread({
+    ref: ref,
+    marginBottom0: true
+  }, actionTriggerProps), {}, {
+    children: (_action$label = action.label) !== null && _action$label !== void 0 ? _action$label : action.name
+  }));
+});
+ActionTrigger.propTypes = {
+  action: _propTypes.default.shape({
+    icon: _propTypes.default.string,
+    label: _propTypes.default.string,
+    name: _propTypes.default.string
+  })
 };
-var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
-  var actionAssigner = _ref.actionAssigner,
-      actionCalls = _ref.actionCalls,
-      columnMapping = _ref.columnMapping,
-      creatableFields = _ref.creatableFields,
-      createCallback = _ref.createCallback,
-      defaultNewObject = _ref.defaultNewObject,
-      editableFields = _ref.editableFields,
-      fields = _ref.fields,
-      fieldComponents = _ref.fieldComponents,
-      _ref$hideCreateButton = _ref.hideCreateButton,
-      hideCreateButton = _ref$hideCreateButton === void 0 ? false : _ref$hideCreateButton,
-      label = _ref.label,
-      validateFields = _ref.validateFields,
-      visibleFields = _ref.visibleFields,
-      triggerFormSubmit = _ref.triggerFormSubmit,
-      mclProps = _objectWithoutProperties(_ref, _excluded);
+var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
+  var actionAssigner = _ref2.actionAssigner,
+      columnMapping = _ref2.columnMapping,
+      creatableFields = _ref2.creatableFields,
+      createCallback = _ref2.createCallback,
+      defaultNewObject = _ref2.defaultNewObject,
+      editableFields = _ref2.editableFields,
+      fields = _ref2.fields,
+      fieldComponents = _ref2.fieldComponents,
+      _ref2$hideCreateButto = _ref2.hideCreateButton,
+      hideCreateButton = _ref2$hideCreateButto === void 0 ? false : _ref2$hideCreateButto,
+      passedIntlKey = _ref2.intlKey,
+      passedIntlNS = _ref2.intlNS,
+      label = _ref2.label,
+      _ref2$labelOverrides = _ref2.labelOverrides,
+      labelOverrides = _ref2$labelOverrides === void 0 ? {} : _ref2$labelOverrides,
+      onRowClick = _ref2.onRowClick,
+      validateFields = _ref2.validateFields,
+      visibleFields = _ref2.visibleFields,
+      triggerFormSubmit = _ref2.triggerFormSubmit,
+      mclProps = _objectWithoutProperties(_ref2, _excluded2);
 
   // Grab finalForm functions/values from form hooks
   var _useForm = (0, _reactFinalForm.useForm)(),
@@ -115,13 +152,14 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
       pristine = _useFormState.pristine,
       submitting = _useFormState.submitting,
       values = _useFormState.values;
+
+  var kintIntl = (0, _hooks.useKintIntl)(passedIntlKey, passedIntlNS);
   /*
     Keep track of which field we are editing.
     null for no field, string id if we are editing an existing field and
     'NEW_ROW' for a new row
   */
 
-
   var _useState = (0, _react.useState)(null),
       _useState2 = _slicedToArray(_useState, 2),
       editing = _useState2[0],
@@ -142,7 +180,7 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
         _a = _fields$value$index.actionListActions,
         _fn = _fields$value$index.fieldName,
         _fi = _fields$value$index.fieldIndex,
-        rowData = _objectWithoutProperties(_fields$value$index, _excluded2); // Find "edit" entry in actionAssigner
+        rowData = _objectWithoutProperties(_fields$value$index, _excluded3); // Find "edit" entry in actionAssigner
 
 
     var editCallback = (_actionAssigner = actionAssigner(rowData)) === null || _actionAssigner === void 0 ? void 0 : (_actionAssigner$find = _actionAssigner.find(function (act) {
@@ -151,8 +189,6 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
 
     if (editCallback) {
       editCallback(rowData);
-    } else {
-      actionCalls.edit(rowData); // DEPRECATED
     }
   };
 
@@ -161,12 +197,10 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
         _a = _fields$value$index2.actionListActions,
         _fn = _fields$value$index2.fieldName,
         _fi = _fields$value$index2.fieldIndex,
-        rowData = _objectWithoutProperties(_fields$value$index2, _excluded3);
+        rowData = _objectWithoutProperties(_fields$value$index2, _excluded4);
 
     if (createCallback) {
       createCallback(rowData);
-    } else {
-      actionCalls.create(rowData); // DEPRECATED
     }
   };
 
@@ -200,11 +234,12 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
     var fieldName = "contentData[".concat(data.rowIndex, "]");
 
     var actions = data.actionListActions,
-        rest = _objectWithoutProperties(data, _excluded4);
+        rest = _objectWithoutProperties(data, _excluded5);
 
     if (data.id === editing || !data.id && editing === 'NEW_ROW') {
       // Render the save/cancel buttons
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        id: "action-button-parent",
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
           buttonStyle: "primary",
           disabled: hasValidationErrors || submitting || pristine,
@@ -223,8 +258,9 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
             }
           },
           type: "submit",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
-            id: "stripes-kint-components.actionList.save"
+          children: kintIntl.formatKintMessage({
+            id: 'save',
+            overrideValue: labelOverrides === null || labelOverrides === void 0 ? void 0 : labelOverrides.save
           })
         }, "save[".concat(data.rowIndex, "]")), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
           "data-type-button": "cancel",
@@ -238,30 +274,23 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
               toggleEditing(data.id);
             }
           },
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
-            id: "stripes-kint-components.actionList.cancel"
+          children: kintIntl.formatKintMessage({
+            id: 'cancel',
+            overrideValue: labelOverrides === null || labelOverrides === void 0 ? void 0 : labelOverrides.cancel
           })
         }, "cancel[".concat(data.rowIndex, "]"))]
       });
     }
 
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      id: "action-button-parent",
       children: actions === null || actions === void 0 ? void 0 : actions.map(function (action) {
-        var _action$label;
-
         var actionFunction;
 
         if (action.callback) {
           actionFunction = function actionFunction() {
             return action.callback(rest);
           };
-        }
-
-        if (!actionFunction && actionCalls[action.name]) {
-          actionFunction = function actionFunction() {
-            return actionCalls[action.name](rest);
-          }; // DEPRECATED
-
         } // Edit has special action functionality, revealing fields etc.
 
 
@@ -281,35 +310,64 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
           } else {
             throw new Error("Provided ariaLabel for action \"".concat(action.name, "\" must be a function or a string."));
           }
-        } // If we're handed an icon, use that for the action button
+        }
 
+        var tooltip;
+        var tooltipSub;
+
+        if (action !== null && action !== void 0 && action.tooltip) {
+          if (typeof action.tooltip === 'function') {
+            tooltip = action.tooltip(data);
+          } else {
+            tooltip = action.tooltip;
+          }
 
-        if (action.icon) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.IconButton, {
-            ariaLabel: ariaLabel,
-            disabled: editing,
-            icon: action.icon,
-            onClick: function onClick() {
-              return actionFunction ? actionFunction() : function () {
-                return null;
-              };
-            },
-            to: action.to
-          }, "action-".concat(action.name, "[").concat(data.rowIndex, "]"));
-        } // Else return a button with the label, or failing that the name of the action
+          if (action !== null && action !== void 0 && action.tooltipSub) {
+            if (typeof action.tooltipSub === 'function') {
+              tooltipSub = action.tooltipSub(data);
+            } else {
+              tooltipSub = action.tooltipSub;
+            }
+          }
+        } // If a tooltip is declared, render that around the actionButton
+
+
+        if (tooltip) {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Tooltip, {
+            id: "action-".concat(action.name, "[").concat(data.rowIndex, "]-tooltip"),
+            sub: tooltipSub,
+            text: tooltip,
+            children: function children(_ref3) {
+              var actionTriggerRef = _ref3.ref,
+                  ariaIds = _ref3.ariaIds;
+              return /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionTrigger, {
+                ref: actionTriggerRef,
+                action: action,
+                "aria-describedby": ariaIds.sub,
+                "aria-labelledby": ariaIds.text,
+                disabled: editing,
+                onClick: function onClick() {
+                  return actionFunction ? actionFunction() : function () {
+                    return null;
+                  };
+                },
+                to: action.to
+              }, "action-".concat(action.name, "[").concat(data.rowIndex, "]"));
+            }
+          });
+        } // Finally, render the action button itself
 
 
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(ActionTrigger, {
+          action: action,
           ariaLabel: ariaLabel,
           disabled: editing,
-          marginBottom0: true,
           onClick: function onClick() {
             return actionFunction ? actionFunction() : function () {
               return null;
             };
           },
-          to: action.to,
-          children: (_action$label = action.label) !== null && _action$label !== void 0 ? _action$label : action.name
+          to: action.to
         }, "action-".concat(action.name, "[").concat(data.rowIndex, "]"));
       })
     });
@@ -328,7 +386,7 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
   };
 
   var formatter = mclProps.formatter,
-      restOfMclProps = _objectWithoutProperties(mclProps, _excluded5); // Destructure formatter part of mclProps
+      restOfMclProps = _objectWithoutProperties(mclProps, _excluded6); // Destructure formatter part of mclProps
 
 
   var fieldAwareFormatter = function fieldAwareFormatter() {
@@ -396,18 +454,19 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
         className: _ActionListFieldArray.default.headerText,
         children: label
       }), !hideCreateButton && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
-        disabled: editing || !actionCalls.create && !createCallback // DEPRECATED actionCalls
-        ,
+        disabled: editing || !createCallback,
         marginBottom0: true,
         onClick: handleClickCreate,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
-          id: "stripes-kint-components.new"
+        children: kintIntl.formatKintMessage({
+          id: 'new',
+          overrideValue: labelOverrides === null || labelOverrides === void 0 ? void 0 : labelOverrides.new
         })
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MultiColumnList, _objectSpread({
       columnMapping: _objectSpread(_objectSpread({}, columnMapping), {}, {
-        actionListActions: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
-          id: "stripes-kint-components.actionList.actions"
+        actionListActions: kintIntl.formatKintMessage({
+          id: 'actions',
+          overrideValue: labelOverrides === null || labelOverrides === void 0 ? void 0 : labelOverrides.actions
         })
       }),
       columnWidths: getColumnWidths(),
@@ -415,7 +474,18 @@ var ActionListFieldArray = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, r
       formatter: _objectSpread({
         actionListActions: renderActionButtons
       }, fieldAwareFormatter()),
-      interactive: false,
+      interactive: !!onRowClick,
+      onRowClick: onRowClick ? function (e, row) {
+        // Make sure we ONLY fire row click from row, and not from action buttons.
+        var targetIsAction = e.target.closest('[id^=action-button-parent]') !== null;
+
+        if (!targetIsAction) {
+          var _ala = row.actionListActions,
+              rowWithoutActions = _objectWithoutProperties(row, _excluded7);
+
+          onRowClick(e, rowWithoutActions);
+        }
+      } : null,
       visibleColumns: [].concat(_toConsumableArray(visibleFields), ['actionListActions'])
     }, restOfMclProps))]
   });