@carbon/ibm-products 1.10.0 → 1.11.0
Sign up to get free protection for your applications and to get access to all the features.
- package/css/index-full-carbon.css +76 -30
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +3 -3
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +10 -4
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +76 -30
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +3 -3
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +76 -30
- package/css/index.css.map +1 -1
- package/css/index.min.css +3 -3
- package/css/index.min.css.map +1 -1
- package/es/components/AddSelect/AddSelect.js +88 -87
- package/es/components/AddSelect/AddSelectColumn.js +143 -6
- package/es/components/AddSelect/AddSelectSidebar.js +1 -14
- package/es/components/AddSelect/add-select-utils.js +64 -0
- package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +2 -1
- package/es/components/DataSpreadsheet/DataSpreadsheet.js +255 -140
- package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +37 -38
- package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +55 -6
- package/es/components/DataSpreadsheet/hooks/useMoveActiveCell.js +27 -0
- package/es/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js +28 -0
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +41 -0
- package/es/components/DataSpreadsheet/{checkActiveHeaderCell.js → utils/checkActiveHeaderCell.js} +1 -1
- package/es/components/DataSpreadsheet/{createActiveCellFn.js → utils/createActiveCellFn.js} +20 -9
- package/es/components/DataSpreadsheet/{createCellSelectionArea.js → utils/createCellSelectionArea.js} +8 -4
- package/es/components/DataSpreadsheet/{generateData.js → utils/generateData.js} +6 -0
- package/es/components/DataSpreadsheet/{getCellSize.js → utils/getCellSize.js} +0 -0
- package/es/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +46 -0
- package/es/components/DataSpreadsheet/utils/handleMultipleKeys.js +82 -0
- package/es/components/DataSpreadsheet/utils/removeCellSelections.js +30 -0
- package/es/components/InlineEdit/InlineEdit.js +49 -8
- package/es/components/OptionsTile/OptionsTile.js +20 -20
- package/es/components/OptionsTile/index.js +1 -1
- package/es/components/PageHeader/PageHeader.js +35 -32
- package/es/components/PageHeader/PageHeaderTitle.js +2 -1
- package/es/components/PageHeader/PageHeaderUtils.js +21 -22
- package/lib/components/AddSelect/AddSelect.js +91 -87
- package/lib/components/AddSelect/AddSelectColumn.js +144 -4
- package/lib/components/AddSelect/AddSelectSidebar.js +7 -14
- package/lib/components/AddSelect/add-select-utils.js +78 -0
- package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +2 -1
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +263 -142
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +39 -36
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +62 -8
- package/lib/components/DataSpreadsheet/hooks/useMoveActiveCell.js +37 -0
- package/lib/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js +39 -0
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +52 -0
- package/lib/components/DataSpreadsheet/{checkActiveHeaderCell.js → utils/checkActiveHeaderCell.js} +1 -1
- package/lib/components/DataSpreadsheet/{createActiveCellFn.js → utils/createActiveCellFn.js} +20 -9
- package/lib/components/DataSpreadsheet/{createCellSelectionArea.js → utils/createCellSelectionArea.js} +8 -4
- package/lib/components/DataSpreadsheet/{generateData.js → utils/generateData.js} +6 -0
- package/lib/components/DataSpreadsheet/{getCellSize.js → utils/getCellSize.js} +0 -0
- package/lib/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +59 -0
- package/lib/components/DataSpreadsheet/utils/handleMultipleKeys.js +92 -0
- package/lib/components/DataSpreadsheet/utils/removeCellSelections.js +41 -0
- package/lib/components/InlineEdit/InlineEdit.js +52 -10
- package/lib/components/OptionsTile/OptionsTile.js +19 -19
- package/lib/components/PageHeader/PageHeader.js +35 -32
- package/lib/components/PageHeader/PageHeaderTitle.js +2 -1
- package/lib/components/PageHeader/PageHeaderUtils.js +21 -22
- package/package.json +2 -2
- package/scss/components/AddSelect/_add-select.scss +16 -0
- package/scss/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss +7 -3
- package/scss/components/CreateSidePanel/_create-side-panel.scss +1 -1
- package/scss/components/CreateSidePanel/_storybook-styles.scss +1 -1
- package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +14 -1
- package/scss/components/EditSidePanel/_edit-side-panel.scss +9 -0
- package/scss/components/EditSidePanel/_storybook-styles.scss +1 -1
- package/scss/components/InlineEdit/_inline-edit.scss +31 -37
- package/scss/components/OptionsTile/_index.scss +1 -1
- package/scss/components/OptionsTile/_options-tile.scss +17 -17
- package/scss/components/OptionsTile/_storybook-styles.scss +4 -4
- package/scss/components/PageHeader/_page-header.scss +3 -2
- package/scss/components/SidePanel/_side-panel.scss +8 -8
@@ -0,0 +1,92 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.handleMultipleKeys = void 0;
|
7
|
+
|
8
|
+
var _deepCloneObject = require("../../../global/js/utils/deepCloneObject");
|
9
|
+
|
10
|
+
/**
|
11
|
+
* Copyright IBM Corp. 2022, 2022
|
12
|
+
*
|
13
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
14
|
+
* LICENSE file in the root directory of this source tree.
|
15
|
+
*/
|
16
|
+
var handleMultipleKeys = function handleMultipleKeys(_ref) {
|
17
|
+
var _selectionAreasClone$;
|
18
|
+
|
19
|
+
var activeKeys = _ref.activeKeys,
|
20
|
+
selectionAreas = _ref.selectionAreas,
|
21
|
+
currentMatcher = _ref.currentMatcher,
|
22
|
+
rows = _ref.rows,
|
23
|
+
setSelectionAreas = _ref.setSelectionAreas,
|
24
|
+
columns = _ref.columns;
|
25
|
+
var activeKeyValues = activeKeys.current;
|
26
|
+
var selectionAreasClone = (0, _deepCloneObject.deepCloneObject)(selectionAreas);
|
27
|
+
var indexOfCurrentArea = selectionAreasClone.findIndex(function (item) {
|
28
|
+
return item.matcher === currentMatcher;
|
29
|
+
});
|
30
|
+
var pointToUpdate = (_selectionAreasClone$ = selectionAreasClone[indexOfCurrentArea]) !== null && _selectionAreasClone$ !== void 0 && _selectionAreasClone$.point2 ? selectionAreasClone[indexOfCurrentArea].point2 : selectionAreasClone[indexOfCurrentArea].point1; // Down + Shift
|
31
|
+
|
32
|
+
if (activeKeyValues.includes('Shift') && activeKeyValues.includes('ArrowDown')) {
|
33
|
+
if (rows.length - 1 === pointToUpdate.row) {
|
34
|
+
return;
|
35
|
+
}
|
36
|
+
|
37
|
+
var newPoint = {
|
38
|
+
row: pointToUpdate.row + 1,
|
39
|
+
column: pointToUpdate.column
|
40
|
+
};
|
41
|
+
selectionAreasClone[indexOfCurrentArea].point2 = newPoint;
|
42
|
+
selectionAreasClone[indexOfCurrentArea].areaCreated = false;
|
43
|
+
setSelectionAreas(selectionAreasClone);
|
44
|
+
} // Right + Shift
|
45
|
+
|
46
|
+
|
47
|
+
if (activeKeyValues.includes('Shift') && activeKeyValues.includes('ArrowRight')) {
|
48
|
+
if (columns.length - 1 === pointToUpdate.column) {
|
49
|
+
return;
|
50
|
+
}
|
51
|
+
|
52
|
+
var _newPoint = {
|
53
|
+
row: pointToUpdate.row,
|
54
|
+
column: pointToUpdate.column + 1
|
55
|
+
};
|
56
|
+
selectionAreasClone[indexOfCurrentArea].point2 = _newPoint;
|
57
|
+
selectionAreasClone[indexOfCurrentArea].areaCreated = false;
|
58
|
+
setSelectionAreas(selectionAreasClone);
|
59
|
+
} // Up + Shift
|
60
|
+
|
61
|
+
|
62
|
+
if (activeKeyValues.includes('Shift') && activeKeyValues.includes('ArrowUp')) {
|
63
|
+
if (pointToUpdate.row === 0) {
|
64
|
+
return;
|
65
|
+
}
|
66
|
+
|
67
|
+
var _newPoint2 = {
|
68
|
+
row: pointToUpdate.row - 1,
|
69
|
+
column: pointToUpdate.column
|
70
|
+
};
|
71
|
+
selectionAreasClone[indexOfCurrentArea].point2 = _newPoint2;
|
72
|
+
selectionAreasClone[indexOfCurrentArea].areaCreated = false;
|
73
|
+
setSelectionAreas(selectionAreasClone);
|
74
|
+
} // Left + Shift
|
75
|
+
|
76
|
+
|
77
|
+
if (activeKeyValues.includes('Shift') && activeKeyValues.includes('ArrowLeft')) {
|
78
|
+
if (pointToUpdate.column === 0) {
|
79
|
+
return;
|
80
|
+
}
|
81
|
+
|
82
|
+
var _newPoint3 = {
|
83
|
+
row: pointToUpdate.row,
|
84
|
+
column: pointToUpdate.column - 1
|
85
|
+
};
|
86
|
+
selectionAreasClone[indexOfCurrentArea].point2 = _newPoint3;
|
87
|
+
selectionAreasClone[indexOfCurrentArea].areaCreated = false;
|
88
|
+
setSelectionAreas(selectionAreasClone);
|
89
|
+
}
|
90
|
+
};
|
91
|
+
|
92
|
+
exports.handleMultipleKeys = handleMultipleKeys;
|
@@ -0,0 +1,41 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4
|
+
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
6
|
+
value: true
|
7
|
+
});
|
8
|
+
exports.removeCellSelections = void 0;
|
9
|
+
|
10
|
+
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
11
|
+
|
12
|
+
var _settings = require("../../../settings");
|
13
|
+
|
14
|
+
/**
|
15
|
+
* Copyright IBM Corp. 2022, 2022
|
16
|
+
*
|
17
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
18
|
+
* LICENSE file in the root directory of this source tree.
|
19
|
+
*/
|
20
|
+
// Removes the cell selection elements
|
21
|
+
var removeCellSelections = function removeCellSelections(_ref) {
|
22
|
+
var matcher = _ref.matcher,
|
23
|
+
spreadsheetRef = _ref.spreadsheetRef,
|
24
|
+
_ref$blockClass = _ref.blockClass,
|
25
|
+
blockClass = _ref$blockClass === void 0 ? "".concat(_settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass;
|
26
|
+
|
27
|
+
if (matcher && typeof matcher === 'string') {
|
28
|
+
var selectionToRemove = spreadsheetRef.current.querySelector("[data-matcher-id=\"".concat(matcher, "\"]"));
|
29
|
+
|
30
|
+
if (selectionToRemove) {
|
31
|
+
selectionToRemove.remove();
|
32
|
+
}
|
33
|
+
} else {
|
34
|
+
var cellSelections = spreadsheetRef.current.querySelectorAll(".".concat(blockClass, "__selection-area--element"));
|
35
|
+
(0, _toConsumableArray2.default)(cellSelections).forEach(function (element) {
|
36
|
+
return element.remove();
|
37
|
+
});
|
38
|
+
}
|
39
|
+
};
|
40
|
+
|
41
|
+
exports.removeCellSelections = removeCellSelections;
|
@@ -2,7 +2,7 @@
|
|
2
2
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4
4
|
|
5
|
-
var
|
5
|
+
var _typeof3 = require("@babel/runtime/helpers/typeof");
|
6
6
|
|
7
7
|
Object.defineProperty(exports, "__esModule", {
|
8
8
|
value: true
|
@@ -13,6 +13,8 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
|
|
13
13
|
|
14
14
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
15
15
|
|
16
|
+
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
17
|
+
|
16
18
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
17
19
|
|
18
20
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
@@ -31,21 +33,24 @@ var _carbonComponentsReact = require("carbon-components-react");
|
|
31
33
|
|
32
34
|
var _iconsReact = require("@carbon/icons-react");
|
33
35
|
|
34
|
-
var _excluded = ["cancelDescription", "className", "disabled", "editAlwaysVisible", "editDescription", "id", "invalid", "invalidText", "labelText", "light", "onCancel", "onSave", "onChange", "placeholder", "saveDescription", "size", "value"];
|
36
|
+
var _excluded = ["buttonTooltipAlignment", "buttonTooltipPosition", "cancelDescription", "className", "disabled", "editAlwaysVisible", "editDescription", "id", "invalid", "invalidText", "labelText", "light", "onCancel", "onSave", "onChange", "placeholder", "saveDescription", "size", "value"];
|
35
37
|
|
36
38
|
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); }
|
37
39
|
|
38
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null ||
|
40
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(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; }
|
39
41
|
|
40
42
|
// The block part of our conventional BEM class names (blockClass__E--M).
|
41
43
|
var blockClass = "".concat(_settings.pkg.prefix, "--inline-edit");
|
42
44
|
var componentName = 'InlineEdit'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
|
43
45
|
|
44
46
|
var defaults = {
|
47
|
+
buttonTooltipAlignment: 'center',
|
48
|
+
buttonTooltipPosition: 'top',
|
45
49
|
light: true,
|
46
50
|
// defaults to true to reflect design
|
47
51
|
size: 'md'
|
48
52
|
};
|
53
|
+
var buttons = ['cancel', 'edit', 'save'];
|
49
54
|
/**
|
50
55
|
* TODO: A description of the component.
|
51
56
|
*/
|
@@ -53,7 +58,9 @@ var defaults = {
|
|
53
58
|
var InlineEdit = /*#__PURE__*/_react.default.forwardRef(function (_ref, refIn) {
|
54
59
|
var _cx, _refInput$current, _refInput$current$inn, _cx3;
|
55
60
|
|
56
|
-
var
|
61
|
+
var buttonTooltipAlignment = _ref.buttonTooltipAlignment,
|
62
|
+
buttonTooltipPosition = _ref.buttonTooltipPosition,
|
63
|
+
cancelDescription = _ref.cancelDescription,
|
57
64
|
className = _ref.className,
|
58
65
|
disabled = _ref.disabled,
|
59
66
|
editAlwaysVisible = _ref.editAlwaysVisible,
|
@@ -91,7 +98,21 @@ var InlineEdit = /*#__PURE__*/_react.default.forwardRef(function (_ref, refIn) {
|
|
91
98
|
|
92
99
|
var validationText = invalidText; // || warnText;
|
93
100
|
|
94
|
-
var validationIcon = showValidation ? /*#__PURE__*/_react.default.createElement(_iconsReact.WarningFilled16, null) : null;
|
101
|
+
var validationIcon = showValidation ? /*#__PURE__*/_react.default.createElement(_iconsReact.WarningFilled16, null) : null; // sanitize the tooltip values
|
102
|
+
|
103
|
+
var alignIsObject = (0, _typeof2.default)(buttonTooltipAlignment) === 'object';
|
104
|
+
var directionIsObject = (0, _typeof2.default)(buttonTooltipPosition) === 'object';
|
105
|
+
var tipPositions = buttons.reduce(function (acc, button) {
|
106
|
+
var _ref2, _ref3;
|
107
|
+
|
108
|
+
var tooltipAlignment = (_ref2 = alignIsObject ? buttonTooltipAlignment[button] : buttonTooltipAlignment) !== null && _ref2 !== void 0 ? _ref2 : defaults.buttonTooltipAlignment;
|
109
|
+
var tooltipPosition = (_ref3 = directionIsObject ? buttonTooltipPosition[button] : buttonTooltipPosition) !== null && _ref3 !== void 0 ? _ref3 : defaults.buttonTooltipPosition;
|
110
|
+
acc[button] = {
|
111
|
+
tooltipAlignment: tooltipAlignment,
|
112
|
+
tooltipPosition: tooltipPosition
|
113
|
+
};
|
114
|
+
return acc;
|
115
|
+
}, {});
|
95
116
|
|
96
117
|
var doSetEditing = function doSetEditing(value) {
|
97
118
|
if (value === false) {
|
@@ -274,14 +295,14 @@ var InlineEdit = /*#__PURE__*/_react.default.forwardRef(function (_ref, refIn) {
|
|
274
295
|
className: (0, _classnames.default)("".concat(blockClass, "__toolbar"), (_cx3 = {}, (0, _defineProperty2.default)(_cx3, "".concat(blockClass, "__toolbar--animation"), toolbarAnimation), (0, _defineProperty2.default)(_cx3, "".concat(blockClass, "__toolbar--saveable"), refInput.current && value !== internalValue), _cx3))
|
275
296
|
}, showValidation && /*#__PURE__*/_react.default.createElement("div", {
|
276
297
|
className: "".concat(blockClass, "__validation-icon")
|
277
|
-
}, validationIcon), editing ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, {
|
298
|
+
}, validationIcon), editing ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, (0, _extends2.default)({
|
278
299
|
className: "".concat(blockClass, "__cancel"),
|
279
300
|
kind: "ghost",
|
280
301
|
hasIconOnly: true,
|
281
302
|
iconDescription: cancelDescription,
|
282
303
|
onClick: handleCancel,
|
283
304
|
renderIcon: _iconsReact.Close16
|
284
|
-
}), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, {
|
305
|
+
}, tipPositions.cancel)), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, (0, _extends2.default)({
|
285
306
|
className: "".concat(blockClass, "__save"),
|
286
307
|
kind: "ghost",
|
287
308
|
hasIconOnly: true,
|
@@ -289,8 +310,7 @@ var InlineEdit = /*#__PURE__*/_react.default.forwardRef(function (_ref, refIn) {
|
|
289
310
|
onClick: handleSave,
|
290
311
|
renderIcon: _iconsReact.Checkmark16,
|
291
312
|
disabled: value === internalValue
|
292
|
-
})) : /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, {
|
293
|
-
"aria-hidden": "true",
|
313
|
+
}, tipPositions.save))) : /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, (0, _extends2.default)({
|
294
314
|
className: (0, _classnames.default)("".concat(blockClass, "__edit"), (0, _defineProperty2.default)({}, "".concat(blockClass, "__edit--always-visible"), editAlwaysVisible)),
|
295
315
|
kind: "ghost",
|
296
316
|
hasIconOnly: true,
|
@@ -299,7 +319,7 @@ var InlineEdit = /*#__PURE__*/_react.default.forwardRef(function (_ref, refIn) {
|
|
299
319
|
renderIcon: disabled ? _iconsReact.EditOff16 : _iconsReact.Edit16,
|
300
320
|
disabled: disabled,
|
301
321
|
tabIndex: -1
|
302
|
-
}))), /*#__PURE__*/_react.default.createElement("div", {
|
322
|
+
}, tipPositions.edit)))), /*#__PURE__*/_react.default.createElement("div", {
|
303
323
|
className: (0, _classnames.default)("".concat(blockClass, "__disabled-cover"))
|
304
324
|
}), showValidation && validationText && validationText.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
|
305
325
|
className: "".concat(blockClass, "__validation-text ").concat(_settings.carbon.prefix, "--form-requirement")
|
@@ -317,6 +337,28 @@ InlineEdit.displayName = componentName; // The types and DocGen commentary for t
|
|
317
337
|
// See https://www.npmjs.com/package/prop-types#usage.
|
318
338
|
|
319
339
|
InlineEdit.propTypes = {
|
340
|
+
/**
|
341
|
+
* buttonTooltipAlignment from the standard tooltip. Default center.
|
342
|
+
*
|
343
|
+
* Can be passed either as one of tooltip options or as an object specifying cancel, edit and save separately
|
344
|
+
*/
|
345
|
+
buttonTooltipAlignment: _propTypes.default.oneOfType([_propTypes.default.oneOf(['start', 'center', 'end']), _propTypes.default.shape({
|
346
|
+
cancel: _propTypes.default.oneOf(['start', 'center', 'end']),
|
347
|
+
edit: _propTypes.default.oneOf(['start', 'center', 'end']),
|
348
|
+
save: _propTypes.default.oneOf(['start', 'center', 'end'])
|
349
|
+
})]),
|
350
|
+
|
351
|
+
/**
|
352
|
+
* buttonTooltipPosition from the standard tooltip
|
353
|
+
*
|
354
|
+
* Can be passed either as one of tooltip options or as an object specifying cancel, edit and save separately
|
355
|
+
*/
|
356
|
+
buttonTooltipPosition: _propTypes.default.oneOfType([_propTypes.default.oneOf(['top', 'right', 'bottom', 'left']), _propTypes.default.shape({
|
357
|
+
cancel: _propTypes.default.oneOf(['top', 'right', 'bottom', 'left']),
|
358
|
+
edit: _propTypes.default.oneOf(['top', 'right', 'bottom', 'left']),
|
359
|
+
save: _propTypes.default.oneOf(['top', 'right', 'bottom', 'left'])
|
360
|
+
})]),
|
361
|
+
|
320
362
|
/**
|
321
363
|
* label for cancel button
|
322
364
|
*/
|
@@ -35,7 +35,7 @@ var _iconsReact = require("@carbon/icons-react");
|
|
35
35
|
|
36
36
|
var carbonMotion = _interopRequireWildcard(require("@carbon/motion"));
|
37
37
|
|
38
|
-
var _excluded = ["children", "className", "enabled", "
|
38
|
+
var _excluded = ["children", "className", "enabled", "invalid", "invalidText", "locked", "lockedText", "onToggle", "open", "size", "summary", "title", "titleId", "warn", "warnText"];
|
39
39
|
|
40
40
|
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); }
|
41
41
|
|
@@ -57,8 +57,6 @@ var OptionsTile = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
57
57
|
var children = _ref.children,
|
58
58
|
className = _ref.className,
|
59
59
|
enabled = _ref.enabled,
|
60
|
-
heading = _ref.heading,
|
61
|
-
userDefinedHeadingId = _ref.headingId,
|
62
60
|
invalid = _ref.invalid,
|
63
61
|
invalidText = _ref.invalidText,
|
64
62
|
locked = _ref.locked,
|
@@ -68,6 +66,8 @@ var OptionsTile = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
68
66
|
_ref$size = _ref.size,
|
69
67
|
size = _ref$size === void 0 ? defaults.size : _ref$size,
|
70
68
|
summary = _ref.summary,
|
69
|
+
title = _ref.title,
|
70
|
+
userDefinedTitleId = _ref.titleId,
|
71
71
|
warn = _ref.warn,
|
72
72
|
warnText = _ref.warnText,
|
73
73
|
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
@@ -90,7 +90,7 @@ var OptionsTile = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
90
90
|
var detailsRef = (0, _react.useRef)(null);
|
91
91
|
var contentRef = (0, _react.useRef)(null);
|
92
92
|
var id = (0, _uuidv.default)();
|
93
|
-
var
|
93
|
+
var titleId = userDefinedTitleId !== null && userDefinedTitleId !== void 0 ? userDefinedTitleId : "".concat(id, "-title");
|
94
94
|
var isExpandable = children !== undefined;
|
95
95
|
var isInvalid = invalid;
|
96
96
|
var isWarn = !isInvalid && warn;
|
@@ -218,11 +218,11 @@ var OptionsTile = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
218
218
|
}
|
219
219
|
|
220
220
|
return /*#__PURE__*/_react.default.createElement("div", {
|
221
|
-
className: "".concat(blockClass, "__title")
|
222
|
-
}, /*#__PURE__*/_react.default.createElement("h6", {
|
223
|
-
id: headingId,
|
224
221
|
className: "".concat(blockClass, "__heading")
|
225
|
-
},
|
222
|
+
}, /*#__PURE__*/_react.default.createElement("h6", {
|
223
|
+
id: titleId,
|
224
|
+
className: "".concat(blockClass, "__title")
|
225
|
+
}, title), text && /*#__PURE__*/_react.default.createElement("span", {
|
226
226
|
className: (0, _classnames.default)(summaryClasses),
|
227
227
|
"aria-hidden": summaryHidden
|
228
228
|
}, Icon && /*#__PURE__*/_react.default.createElement(Icon, null), /*#__PURE__*/_react.default.createElement("span", {
|
@@ -243,7 +243,7 @@ var OptionsTile = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
243
243
|
toggled: enabled,
|
244
244
|
labelA: "",
|
245
245
|
labelB: "",
|
246
|
-
"aria-labelledby":
|
246
|
+
"aria-labelledby": titleId,
|
247
247
|
onToggle: onToggle,
|
248
248
|
size: "sm",
|
249
249
|
disabled: isLocked
|
@@ -292,16 +292,6 @@ OptionsTile.propTypes = {
|
|
292
292
|
*/
|
293
293
|
enabled: _propTypes.default.bool,
|
294
294
|
|
295
|
-
/**
|
296
|
-
* Provide the heading for this OptionsTile.
|
297
|
-
*/
|
298
|
-
heading: _propTypes.default.string.isRequired,
|
299
|
-
|
300
|
-
/**
|
301
|
-
* Optionally provide an id which should be used for the heading.
|
302
|
-
*/
|
303
|
-
headingId: _propTypes.default.string,
|
304
|
-
|
305
295
|
/**
|
306
296
|
* Whether the OptionsTile is in invalid validation state.
|
307
297
|
*/
|
@@ -343,6 +333,16 @@ OptionsTile.propTypes = {
|
|
343
333
|
*/
|
344
334
|
summary: _propTypes.default.string,
|
345
335
|
|
336
|
+
/**
|
337
|
+
* Provide the title for this OptionsTile.
|
338
|
+
*/
|
339
|
+
title: _propTypes.default.string.isRequired,
|
340
|
+
|
341
|
+
/**
|
342
|
+
* Optionally provide an id which should be used for the title.
|
343
|
+
*/
|
344
|
+
titleId: _propTypes.default.string,
|
345
|
+
|
346
346
|
/**
|
347
347
|
* Whether the OptionsTile is in warning validation state.
|
348
348
|
*/
|
@@ -69,7 +69,7 @@ var defaults = {
|
|
69
69
|
};
|
70
70
|
|
71
71
|
var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
72
|
-
var _withoutBackground,
|
72
|
+
var _withoutBackground, _enableBreadcrumbScro, _ref6, _cx2, _ref7, _cx4, _cx7;
|
73
73
|
|
74
74
|
var actionBarItems = _ref.actionBarItems,
|
75
75
|
actionBarMenuOptionsClass = _ref.actionBarMenuOptionsClass,
|
@@ -86,7 +86,7 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
86
86
|
collapseHeaderIconDescription = _ref.collapseHeaderIconDescription,
|
87
87
|
collapseTitle = _ref.collapseTitle,
|
88
88
|
deprecated_disableBreadcrumbScroll = _ref.disableBreadcrumbScroll,
|
89
|
-
|
89
|
+
enableBreadcrumbScroll = _ref.enableBreadcrumbScroll,
|
90
90
|
expandHeaderIconDescription = _ref.expandHeaderIconDescription,
|
91
91
|
_ref$fullWidthGrid = _ref.fullWidthGrid,
|
92
92
|
fullWidthGrid = _ref$fullWidthGrid === void 0 ? defaults.fullWidthGrid : _ref$fullWidthGrid,
|
@@ -104,8 +104,10 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
104
104
|
withoutBackground = _ref.withoutBackground,
|
105
105
|
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
106
106
|
// handle deprecated props - START
|
107
|
-
// if withoutBackground is
|
108
|
-
(_withoutBackground = withoutBackground) !== null && _withoutBackground !== void 0 ? _withoutBackground : withoutBackground = !(deprecated_hasBackgroundAlways !== null && deprecated_hasBackgroundAlways !== void 0 ? deprecated_hasBackgroundAlways : true); //
|
107
|
+
// if withoutBackground is nullish check deprecated_hasBackgroundAlways and default false
|
108
|
+
(_withoutBackground = withoutBackground) !== null && _withoutBackground !== void 0 ? _withoutBackground : withoutBackground = !(deprecated_hasBackgroundAlways !== null && deprecated_hasBackgroundAlways !== void 0 ? deprecated_hasBackgroundAlways : true); // prefer enabled if nullish check deprecated_disableBreadcrumbScroll and default false
|
109
|
+
|
110
|
+
(_enableBreadcrumbScro = enableBreadcrumbScroll) !== null && _enableBreadcrumbScro !== void 0 ? _enableBreadcrumbScro : enableBreadcrumbScroll = !(deprecated_disableBreadcrumbScroll !== null && deprecated_disableBreadcrumbScroll !== void 0 ? deprecated_disableBreadcrumbScroll : true); // handle deprecated props - END
|
109
111
|
|
110
112
|
var _useState = (0, _react.useState)({}),
|
111
113
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
@@ -124,8 +126,7 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
124
126
|
var offsetTopMeasuringRef = (0, _react.useRef)(null); // state based on props only
|
125
127
|
|
126
128
|
var hasActionBar = actionBarItems && actionBarItems.length > 0;
|
127
|
-
var hasBreadcrumbRow = !!breadcrumbs || !!actionBarItems;
|
128
|
-
var enableBreadcrumbScroll = (_ref2 = in_enableBreadcrumbScroll !== null && in_enableBreadcrumbScroll !== void 0 ? in_enableBreadcrumbScroll : !deprecated_disableBreadcrumbScroll) !== null && _ref2 !== void 0 ? _ref2 : false; // utility functions
|
129
|
+
var hasBreadcrumbRow = !!breadcrumbs || !!actionBarItems; // utility functions
|
129
130
|
|
130
131
|
var checkUpdateVerticalSpace = function checkUpdateVerticalSpace() {
|
131
132
|
return (0, _PageHeaderUtils.utilCheckUpdateVerticalSpace)(headerRef, offsetTopMeasuringRef, navigation, enableBreadcrumbScroll, hasActionBar, widthIsNarrow, setMetrics);
|
@@ -191,9 +192,9 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
191
192
|
setWidthIsNarrow = _useState26[1]; // handlers
|
192
193
|
|
193
194
|
|
194
|
-
var handleActionBarWidthChange = function handleActionBarWidthChange(
|
195
|
-
var minWidth =
|
196
|
-
maxWidth =
|
195
|
+
var handleActionBarWidthChange = function handleActionBarWidthChange(_ref2) {
|
196
|
+
var minWidth = _ref2.minWidth,
|
197
|
+
maxWidth = _ref2.maxWidth;
|
197
198
|
|
198
199
|
/* don't know how to test resize */
|
199
200
|
|
@@ -206,9 +207,9 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
206
207
|
setActionBarMinWidth(minWidth);
|
207
208
|
};
|
208
209
|
|
209
|
-
var handlePageActionWidthChange = function handlePageActionWidthChange(
|
210
|
-
var minWidth =
|
211
|
-
maxWidth =
|
210
|
+
var handlePageActionWidthChange = function handlePageActionWidthChange(_ref3) {
|
211
|
+
var minWidth = _ref3.minWidth,
|
212
|
+
maxWidth = _ref3.maxWidth;
|
212
213
|
|
213
214
|
/* don't know how to test resize */
|
214
215
|
|
@@ -247,6 +248,7 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
247
248
|
|
248
249
|
|
249
250
|
(0, _react.useEffect)(function () {
|
251
|
+
/* istanbul ignore else */
|
250
252
|
if (pageActions !== null && pageActions !== void 0 && pageActions.content) {
|
251
253
|
var minWidth = pageActions.minWidth,
|
252
254
|
maxWidth = pageActions.maxWidth;
|
@@ -306,8 +308,9 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
306
308
|
});
|
307
309
|
}, [headerRef, enableBreadcrumbScroll, metrics, metrics.breadcrumbRowHeight, metrics.breadcrumbRowSpaceBelow, metrics.breadcrumbTitleHeight, metrics.breadcrumbRowWidth, metrics.headerHeight, metrics.headerWidth, metrics.headerOffset, metrics.headerTopValue, metrics.navigationRowHeight, navigation, scrollYValue, tags]);
|
308
310
|
(0, _hooks.useNearestScroll)(headerRef, // on scroll or various layout changes check updates if needed
|
309
|
-
|
310
|
-
|
311
|
+
// istanbul ignore next
|
312
|
+
function (_ref4) {
|
313
|
+
var current = _ref4.current;
|
311
314
|
setPageHeaderStyles(function (prev) {
|
312
315
|
return _objectSpread(_objectSpread({}, prev), {}, (0, _defineProperty2.default)({}, "--".concat(_PageHeaderUtils.blockClass, "--breadcrumb-top"), "".concat(metrics.headerOffset, "px")));
|
313
316
|
});
|
@@ -323,8 +326,8 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
323
326
|
document.documentElement.style.setProperty("--".concat(_PageHeaderUtils.blockClass, "--tagset-tooltip-offset"), "".concat(tagsetTooltipOffset, "px"));
|
324
327
|
setScrollYValue(current.scrollY);
|
325
328
|
}, [metrics.headerHeight, metrics.headerTopValue, metrics.headerOffset, enableBreadcrumbScroll]);
|
326
|
-
(0, _hooks.useWindowResize)(function (
|
327
|
-
var current =
|
329
|
+
(0, _hooks.useWindowResize)(function (_ref5) {
|
330
|
+
var current = _ref5.current;
|
328
331
|
// on window resize and other updates some values may have changed
|
329
332
|
checkUpdateVerticalSpace();
|
330
333
|
setWidthIsNarrow(current.innerWidth < _layout.breakpoints.md.width); // small (below medium) media query
|
@@ -390,7 +393,7 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
390
393
|
className: "".concat(_PageHeaderUtils.blockClass, "--offset-top-measuring-element"),
|
391
394
|
ref: offsetTopMeasuringRef
|
392
395
|
}), /*#__PURE__*/_react.default.createElement("section", (0, _extends2.default)({}, rest, {
|
393
|
-
className: (0, _classnames.default)([_PageHeaderUtils.blockClass, "".concat(_PageHeaderUtils.blockClass, "--no-margins-below-row"), className, (
|
396
|
+
className: (0, _classnames.default)([_PageHeaderUtils.blockClass, "".concat(_PageHeaderUtils.blockClass, "--no-margins-below-row"), className, (_ref6 = {}, (0, _defineProperty2.default)(_ref6, "".concat(_PageHeaderUtils.blockClass, "--has-navigation"), navigation || tags), (0, _defineProperty2.default)(_ref6, "".concat(_PageHeaderUtils.blockClass, "--has-navigation-tags-only"), !navigation && tags), _ref6)]),
|
394
397
|
style: pageHeaderStyles,
|
395
398
|
ref: headerRef
|
396
399
|
}, (0, _devtools.getDevtoolsProps)(componentName)), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Grid, {
|
@@ -412,7 +415,7 @@ var PageHeader = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
412
415
|
breadcrumbs: breadcrumbs && breadcrumbItemForTitle ? breadcrumbs.concat(breadcrumbItemForTitle) : breadcrumbItemForTitle ? [breadcrumbItemForTitle] : breadcrumbs // breadcrumbs may be null or undefined
|
413
416
|
|
414
417
|
}) : null), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Column, {
|
415
|
-
className: (0, _classnames.default)(["".concat(_PageHeaderUtils.blockClass, "__action-bar-column ").concat(_PageHeaderUtils.blockClass, "__action-bar-column--background"), (
|
418
|
+
className: (0, _classnames.default)(["".concat(_PageHeaderUtils.blockClass, "__action-bar-column ").concat(_PageHeaderUtils.blockClass, "__action-bar-column--background"), (_ref7 = {}, (0, _defineProperty2.default)(_ref7, "".concat(_PageHeaderUtils.blockClass, "__action-bar-column--has-page-actions"), pageActions), (0, _defineProperty2.default)(_ref7, "".concat(_PageHeaderUtils.blockClass, "__action-bar-column--influenced-by-collapse-button"), spaceForCollapseButton), _ref7)])
|
416
419
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
417
420
|
className: "".concat(_PageHeaderUtils.blockClass, "__action-bar-column-content"),
|
418
421
|
ref: sizingContainerRef
|
@@ -565,8 +568,8 @@ PageHeader.propTypes = _objectSpread({
|
|
565
568
|
*
|
566
569
|
* NOTE: This prop is required if actionBarItems are supplied
|
567
570
|
*/
|
568
|
-
actionBarOverflowAriaLabel: _propTypes.default.string.isRequired.if(function (
|
569
|
-
var actionBarItems =
|
571
|
+
actionBarOverflowAriaLabel: _propTypes.default.string.isRequired.if(function (_ref9) {
|
572
|
+
var actionBarItems = _ref9.actionBarItems;
|
570
573
|
return actionBarItems && actionBarItems.length > 0;
|
571
574
|
}),
|
572
575
|
|
@@ -601,8 +604,8 @@ PageHeader.propTypes = _objectSpread({
|
|
601
604
|
* If the user supplies breadcrumbs then this property is required.
|
602
605
|
* It is used in an overflow menu when there is insufficient space to display all breadcrumbs inline.
|
603
606
|
*/
|
604
|
-
breadcrumbOverflowAriaLabel: _propTypes.default.string.isRequired.if(function (
|
605
|
-
var breadcrumbs =
|
607
|
+
breadcrumbOverflowAriaLabel: _propTypes.default.string.isRequired.if(function (_ref10) {
|
608
|
+
var breadcrumbs = _ref10.breadcrumbs;
|
606
609
|
return breadcrumbs && breadcrumbs.length > 0;
|
607
610
|
}),
|
608
611
|
|
@@ -641,8 +644,8 @@ PageHeader.propTypes = _objectSpread({
|
|
641
644
|
/**
|
642
645
|
* A text version of the `label` for display, required if `label` is not a string.
|
643
646
|
*/
|
644
|
-
title: _propTypes.default.string.isRequired.if(function (
|
645
|
-
var label =
|
647
|
+
title: _propTypes.default.string.isRequired.if(function (_ref11) {
|
648
|
+
var label = _ref11.label;
|
646
649
|
return typeof label !== 'string';
|
647
650
|
})
|
648
651
|
})),
|
@@ -672,9 +675,9 @@ PageHeader.propTypes = _objectSpread({
|
|
672
675
|
* If `hasCollapseHeaderToggle` is set and `withoutBackground` is unset/falsy then assistive text is
|
673
676
|
* required for both the expend and collapse states of the button component used.
|
674
677
|
*/
|
675
|
-
collapseHeaderIconDescription: _propTypes.default.string.isRequired.if(function (
|
676
|
-
var withoutBackground =
|
677
|
-
hasCollapseHeaderToggle =
|
678
|
+
collapseHeaderIconDescription: _propTypes.default.string.isRequired.if(function (_ref12) {
|
679
|
+
var withoutBackground = _ref12.withoutBackground,
|
680
|
+
hasCollapseHeaderToggle = _ref12.hasCollapseHeaderToggle;
|
678
681
|
return !withoutBackground && hasCollapseHeaderToggle;
|
679
682
|
}),
|
680
683
|
|
@@ -694,9 +697,9 @@ PageHeader.propTypes = _objectSpread({
|
|
694
697
|
* If `hasCollapseHeaderToggle` is set and `withoutBackground` is unset/falsy then assistive text is
|
695
698
|
* required for both the expend and collapse states of the button component used.
|
696
699
|
*/
|
697
|
-
expandHeaderIconDescription: _propTypes.default.string.isRequired.if(function (
|
698
|
-
var withoutBackground =
|
699
|
-
hasCollapseHeaderToggle =
|
700
|
+
expandHeaderIconDescription: _propTypes.default.string.isRequired.if(function (_ref13) {
|
701
|
+
var withoutBackground = _ref13.withoutBackground,
|
702
|
+
hasCollapseHeaderToggle = _ref13.hasCollapseHeaderToggle;
|
700
703
|
return !withoutBackground && hasCollapseHeaderToggle;
|
701
704
|
}),
|
702
705
|
|
@@ -767,8 +770,8 @@ PageHeader.propTypes = _objectSpread({
|
|
767
770
|
*
|
768
771
|
* NOTE: This prop is required if pageActions are supplied
|
769
772
|
*/
|
770
|
-
pageActionsOverflowLabel: _propTypes.default.node.isRequired.if(function (
|
771
|
-
var pageActions =
|
773
|
+
pageActionsOverflowLabel: _propTypes.default.node.isRequired.if(function (_ref14) {
|
774
|
+
var pageActions = _ref14.pageActions;
|
772
775
|
return pageActions && pageActions.length > 0 && !pageActions.content;
|
773
776
|
}),
|
774
777
|
|
@@ -71,7 +71,8 @@ var PageHeaderTitle = function PageHeaderTitle(_ref) {
|
|
71
71
|
onSave: onSave,
|
72
72
|
labelText: editableLabel,
|
73
73
|
revertDescription: revertDescription,
|
74
|
-
saveDescription: saveDescription
|
74
|
+
saveDescription: saveDescription,
|
75
|
+
buttonTooltipPosition: "bottom"
|
75
76
|
}, rest)) : /*#__PURE__*/_react.default.createElement("span", {
|
76
77
|
title: !loading ? asText : null
|
77
78
|
}, text));
|
@@ -85,7 +85,10 @@ var utilCheckUpdateVerticalSpace = function utilCheckUpdateVerticalSpace(headerR
|
|
85
85
|
var scrollableContainer = (0, _scrollableAncestor.scrollableAncestor)(headerRef.current);
|
86
86
|
/* istanbul ignore next */
|
87
87
|
|
88
|
-
|
88
|
+
var scrollableContainerTop = scrollableContainer ? scrollableContainer.scrollTop - scrollableContainer.offsetTop : 0; // The header offset calculation is either going to work out at 0 if we have no gap between scrolling container
|
89
|
+
// top and the measuring ref top, or the difference between. It does not change on scroll or resize.
|
90
|
+
|
91
|
+
update.headerOffset = scrollableContainerTop + offsetTopMeasuringRef.current.getBoundingClientRect().top;
|
89
92
|
/* istanbul ignore next */
|
90
93
|
|
91
94
|
update.breadcrumbRowHeight = breadcrumbRowEl ? breadcrumbRowEl.clientHeight : 0;
|
@@ -125,35 +128,31 @@ var utilCheckUpdateVerticalSpace = function utilCheckUpdateVerticalSpace(headerR
|
|
125
128
|
if (!enableBreadcrumbScroll || !navigation) {
|
126
129
|
// adjust sticky top if no navigation or breadcrumb is to stay on screen
|
127
130
|
update.headerTopValue += update.breadcrumbRowHeight;
|
128
|
-
}
|
131
|
+
} // if (window) {
|
129
132
|
|
130
|
-
if (window) {
|
131
|
-
var val;
|
132
|
-
/* don't know how to test resize */
|
133
133
|
|
134
|
-
|
134
|
+
var val;
|
135
|
+
/* don't know how to test resize */
|
135
136
|
|
136
|
-
|
137
|
-
val = parseFloat(window.getComputedStyle(breadcrumbRowEl).getPropertyValue('margin-bottom'), 10);
|
138
|
-
update.breadcrumbRowSpaceBelow = isNaN(val) ? 0 : val;
|
139
|
-
}
|
140
|
-
/* don't know how to test resize */
|
137
|
+
/* istanbul ignore if */
|
141
138
|
|
142
|
-
|
139
|
+
if (breadcrumbRowEl) {
|
140
|
+
val = parseFloat(window.getComputedStyle(breadcrumbRowEl).getPropertyValue('margin-bottom'), 10);
|
141
|
+
update.breadcrumbRowSpaceBelow = isNaN(val) ? 0 : val;
|
142
|
+
}
|
143
|
+
/* don't know how to test resize */
|
143
144
|
|
145
|
+
/* istanbul ignore if */
|
144
146
|
|
145
|
-
if (titleRowEl) {
|
146
|
-
val = parseFloat(window.getComputedStyle(titleRowEl).getPropertyValue('margin-top'), 10);
|
147
|
-
update.titleRowSpaceAbove = isNaN(val) ? 0 : val;
|
148
147
|
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
148
|
+
if (titleRowEl) {
|
149
|
+
val = parseFloat(window.getComputedStyle(titleRowEl).getPropertyValue('margin-top'), 10);
|
150
|
+
update.titleRowSpaceAbove = isNaN(val) ? 0 : val;
|
151
|
+
|
152
|
+
if (pageActionsEl) {
|
153
|
+
val = parseFloat(window.getComputedStyle(pageActionsEl).getPropertyValue('margin-top'), 10);
|
154
|
+
update.pageActionsSpaceAbove = titleRowEl.clientHeight - pageActionsEl.clientHeight + update.titleRowSpaceAbove - (isNaN(val) ? 0 : val);
|
153
155
|
}
|
154
|
-
} else {
|
155
|
-
update.breadcrumbRowSpaceBelow = 0;
|
156
|
-
update.titleRowSpaceAbove = 0;
|
157
156
|
}
|
158
157
|
|
159
158
|
return _objectSpread(_objectSpread({}, previous), update);
|
package/package.json
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"name": "@carbon/ibm-products",
|
3
3
|
"description": "Carbon for IBM Products",
|
4
|
-
"version": "1.
|
4
|
+
"version": "1.11.0",
|
5
5
|
"license": "Apache-2.0",
|
6
6
|
"main": "lib/index.js",
|
7
7
|
"module": "es/index.js",
|
@@ -88,5 +88,5 @@
|
|
88
88
|
"react": "^16.8.6 || ^17.0.1",
|
89
89
|
"react-dom": "^16.8.6 || ^17.0.1"
|
90
90
|
},
|
91
|
-
"gitHead": "
|
91
|
+
"gitHead": "684e0bceb27d3f1376651a624db23bcedeab5c59"
|
92
92
|
}
|