@carbon/ibm-products 2.41.1-canary.13 → 2.41.1-canary.5

Sign up to get free protection for your applications and to get access to all the features.
Files changed (62) hide show
  1. package/css/index-full-carbon.css +0 -6
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +1 -1
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +0 -6
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +1 -1
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +0 -6
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +1 -1
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +0 -6
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +1 -1
  16. package/css/index.min.css.map +1 -1
  17. package/es/components/Datagrid/Datagrid/DatagridContent.js +1 -21
  18. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +2 -12
  19. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.d.ts +3 -3
  20. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +5 -5
  21. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.d.ts +1 -3
  22. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +3 -12
  23. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js +0 -7
  24. package/es/components/Datagrid/useCustomizeColumns.js +4 -0
  25. package/es/components/Datagrid/useEditableCell.js +1 -1
  26. package/es/components/Datagrid/useFocusRowExpander.js +1 -1
  27. package/es/components/Datagrid/useInlineEdit.d.ts +1 -1
  28. package/es/components/Datagrid/useInlineEdit.js +16 -9
  29. package/es/components/EditUpdateCards/EditUpdateCards.d.ts +3 -4
  30. package/es/components/Guidebanner/Guidebanner.js +2 -7
  31. package/es/components/ProductiveCard/ProductiveCard.d.ts +2 -115
  32. package/es/components/ProductiveCard/ProductiveCard.js +9 -9
  33. package/es/components/index.d.ts +0 -1
  34. package/es/global/js/hooks/usePortalTarget.js +2 -4
  35. package/es/index.js +0 -1
  36. package/lib/components/Datagrid/Datagrid/DatagridContent.js +29 -49
  37. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +19 -13
  38. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.d.ts +3 -3
  39. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +5 -5
  40. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.d.ts +1 -3
  41. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +3 -12
  42. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js +0 -7
  43. package/lib/components/Datagrid/useCustomizeColumns.js +4 -0
  44. package/lib/components/Datagrid/useEditableCell.js +1 -1
  45. package/lib/components/Datagrid/useFocusRowExpander.js +1 -1
  46. package/lib/components/Datagrid/useInlineEdit.d.ts +1 -1
  47. package/lib/components/Datagrid/useInlineEdit.js +15 -8
  48. package/lib/components/EditUpdateCards/EditUpdateCards.d.ts +3 -4
  49. package/lib/components/Guidebanner/Guidebanner.js +2 -7
  50. package/lib/components/ProductiveCard/ProductiveCard.d.ts +2 -115
  51. package/lib/components/ProductiveCard/ProductiveCard.js +9 -9
  52. package/lib/components/index.d.ts +0 -1
  53. package/lib/global/js/hooks/usePortalTarget.js +2 -4
  54. package/lib/index.js +0 -4
  55. package/package.json +3 -7
  56. package/scss/components/Datagrid/styles/_useInlineEdit.scss +0 -6
  57. package/es/components/FeatureFlags/index.d.ts +0 -37
  58. package/es/components/FeatureFlags/index.js +0 -151
  59. package/es/feature-flags.d.ts +0 -1
  60. package/lib/components/FeatureFlags/index.d.ts +0 -37
  61. package/lib/components/FeatureFlags/index.js +0 -162
  62. package/lib/feature-flags.d.ts +0 -1
@@ -1,9 +1,9 @@
1
- export function InlineEditButton({ label, renderIcon: Icon, labelIcon: LabelIcon, placeholder, disabledCell, nonEditCell, isActiveCell, columnConfig, type, }: {
1
+ export function InlineEditButton({ label, renderIcon: Icon, disabled, labelIcon: LabelIcon, placeholder, nonEditCell, isActiveCell, columnConfig, type, }: {
2
2
  label: any;
3
3
  renderIcon: any;
4
+ disabled: any;
4
5
  labelIcon: any;
5
6
  placeholder: any;
6
- disabledCell: any;
7
7
  nonEditCell: any;
8
8
  isActiveCell: any;
9
9
  columnConfig: any;
@@ -12,7 +12,7 @@ export function InlineEditButton({ label, renderIcon: Icon, labelIcon: LabelIcon
12
12
  export namespace InlineEditButton {
13
13
  namespace propTypes {
14
14
  let columnConfig: PropTypes.Requireable<object>;
15
- let disabledCell: PropTypes.Requireable<boolean>;
15
+ let disabled: PropTypes.Requireable<boolean>;
16
16
  let isActiveCell: PropTypes.Requireable<boolean>;
17
17
  let label: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
18
18
  let labelIcon: PropTypes.Requireable<object>;
@@ -15,18 +15,18 @@ var blockClass = "".concat(pkg.prefix, "--datagrid");
15
15
  var InlineEditButton = function InlineEditButton(_ref) {
16
16
  var label = _ref.label,
17
17
  Icon = _ref.renderIcon,
18
+ disabled = _ref.disabled,
18
19
  LabelIcon = _ref.labelIcon,
19
20
  placeholder = _ref.placeholder,
20
- disabledCell = _ref.disabledCell,
21
21
  nonEditCell = _ref.nonEditCell,
22
22
  isActiveCell = _ref.isActiveCell,
23
23
  columnConfig = _ref.columnConfig,
24
24
  type = _ref.type;
25
25
  return /*#__PURE__*/React__default.createElement("div", {
26
- className: cx("".concat(blockClass, "__inline-edit-button"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(blockClass, "__inline-edit-button--disabled"), disabledCell), "".concat(blockClass, "__inline-edit-button--with-label-icon"), LabelIcon), "".concat(blockClass, "__inline-edit-button--non-edit"), nonEditCell), "".concat(blockClass, "__inline-edit-button--active"), isActiveCell), "".concat(blockClass, "__inline-edit-button--").concat(type), type === 'date' || type === 'selection')),
26
+ className: cx("".concat(blockClass, "__inline-edit-button"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(blockClass, "__inline-edit-button--disabled"), disabled || nonEditCell), "".concat(blockClass, "__inline-edit-button--with-label-icon"), LabelIcon), "".concat(blockClass, "__inline-edit-button--non-edit"), nonEditCell), "".concat(blockClass, "__inline-edit-button--active"), isActiveCell), "".concat(blockClass, "__inline-edit-button--").concat(type), type === 'date' || type === 'selection')),
27
27
  tabIndex: isActiveCell ? 0 : -1,
28
- "data-disabled": disabledCell,
29
- "aria-disabled": disabledCell,
28
+ "data-disabled": disabled || nonEditCell,
29
+ "aria-disabled": disabled || nonEditCell,
30
30
  role: "button",
31
31
  title: label
32
32
  }, LabelIcon && /*#__PURE__*/React__default.createElement("div", {
@@ -41,7 +41,7 @@ var InlineEditButton = function InlineEditButton(_ref) {
41
41
  };
42
42
  InlineEditButton.propTypes = {
43
43
  columnConfig: PropTypes.object,
44
- disabledCell: PropTypes.bool,
44
+ disabled: PropTypes.bool,
45
45
  isActiveCell: PropTypes.bool,
46
46
  label: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
47
47
  labelIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
@@ -1,7 +1,6 @@
1
- export function InlineEditCell({ cell, config, disabledCell, instance, placeholder, tabIndex, value, nonEditCell, type, }: {
1
+ export function InlineEditCell({ cell, config, instance, placeholder, tabIndex, value, nonEditCell, type, }: {
2
2
  cell: any;
3
3
  config: any;
4
- disabledCell?: boolean | undefined;
5
4
  instance: any;
6
5
  placeholder?: string | undefined;
7
6
  tabIndex: any;
@@ -13,7 +12,6 @@ export namespace InlineEditCell {
13
12
  namespace propTypes {
14
13
  let cell: PropTypes.Requireable<object>;
15
14
  let config: PropTypes.Requireable<object>;
16
- let disabledCell: PropTypes.Requireable<boolean>;
17
15
  let instance: PropTypes.Requireable<PropTypes.InferProps<{
18
16
  columns: PropTypes.Requireable<(object | null | undefined)[]>;
19
17
  onDataUpdate: PropTypes.Requireable<(...args: any[]) => any>;
@@ -22,8 +22,6 @@ var InlineEditCell = function InlineEditCell(_ref) {
22
22
  var _config$validator, _value$text;
23
23
  var cell = _ref.cell,
24
24
  config = _ref.config,
25
- _ref$disabledCell = _ref.disabledCell,
26
- disabledCell = _ref$disabledCell === void 0 ? false : _ref$disabledCell,
27
25
  instance = _ref.instance,
28
26
  _ref$placeholder = _ref.placeholder,
29
27
  placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
@@ -321,11 +319,6 @@ var InlineEditCell = function InlineEditCell(_ref) {
321
319
  return Calendar;
322
320
  }
323
321
  };
324
- var renderRegularCell = function renderRegularCell() {
325
- return /*#__PURE__*/React__default.createElement("span", _extends({}, inputProps, {
326
- id: cellId
327
- }));
328
- };
329
322
  var renderDateCell = function renderDateCell() {
330
323
  var _config$inputProps, _outerButtonElement$c;
331
324
  var datePickerPreparedProps = prepareProps(config.inputProps, ['datePickerInputProps']);
@@ -441,16 +434,15 @@ var InlineEditCell = function InlineEditCell(_ref) {
441
434
  "data-cell-id": cellId,
442
435
  "data-column-index": columnIndex,
443
436
  "data-row-index": cell.row.index,
444
- "data-disabled": disabledCell,
437
+ "data-disabled": nonEditCell,
445
438
  "data-inline-type": type,
446
439
  onClick: !nonEditCell ? handleInlineCellClick : addActiveState,
447
440
  onKeyDown: !nonEditCell ? handleKeyDown : null,
448
- className: cx("".concat(blockClass, "__inline-edit--outer-cell-button"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(blockClass, "__inline-edit--outer-cell-button--").concat(rowSize), rowSize), "".concat(blockClass, "__inline-edit--outer-cell-button--lg"), !rowSize), "".concat(blockClass, "__inline-edit--outer-cell-button--invalid"), config === null || config === void 0 || (_config$validator = config.validator) === null || _config$validator === void 0 ? void 0 : _config$validator.call(config, cellValue)), "".concat(blockClass, "__static--outer-cell"), !disabledCell))
449
- }, !nonEditCell && !disabledCell && renderRegularCell(), (!inEditMode || disabledCell) && /*#__PURE__*/React__default.createElement(InlineEditButton, {
441
+ className: cx("".concat(blockClass, "__inline-edit--outer-cell-button"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(blockClass, "__inline-edit--outer-cell-button--").concat(rowSize), rowSize), "".concat(blockClass, "__inline-edit--outer-cell-button--lg"), !rowSize), "".concat(blockClass, "__inline-edit--outer-cell-button--invalid"), config === null || config === void 0 || (_config$validator = config.validator) === null || _config$validator === void 0 ? void 0 : _config$validator.call(config, cellValue)))
442
+ }, !inEditMode && /*#__PURE__*/React__default.createElement(InlineEditButton, {
450
443
  isActiveCell: cellId === activeCellId,
451
444
  renderIcon: setRenderIcon(),
452
445
  label: type === 'selection' ? (_value$text = value === null || value === void 0 ? void 0 : value.text) !== null && _value$text !== void 0 ? _value$text : value : type === 'date' ? buildDate(value) : value,
453
- disabledCell: disabledCell,
454
446
  labelIcon: (value === null || value === void 0 ? void 0 : value.icon) || null,
455
447
  placeholder: placeholder,
456
448
  tabIndex: tabIndex,
@@ -463,7 +455,6 @@ var InlineEditCell = function InlineEditCell(_ref) {
463
455
  InlineEditCell.propTypes = {
464
456
  cell: PropTypes.object,
465
457
  config: PropTypes.object,
466
- disabledCell: PropTypes.bool,
467
458
  instance: PropTypes.shape({
468
459
  columns: PropTypes.arrayOf(PropTypes.object),
469
460
  onDataUpdate: PropTypes.func,
@@ -73,13 +73,6 @@ var inlineEditReducer = function inlineEditReducer(state, action) {
73
73
  }
74
74
  break;
75
75
  }
76
- case 'SET_FEATURE_FLAGS':
77
- {
78
- var _action$payload2;
79
- return _objectSpread2(_objectSpread2({}, state), {}, {
80
- featureFlags: (_action$payload2 = action.payload) !== null && _action$payload2 !== void 0 ? _action$payload2 : {}
81
- });
82
- }
83
76
  default:
84
77
  return state;
85
78
  }
@@ -7,10 +7,14 @@
7
7
 
8
8
  import { slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
9
  import * as React from 'react';
10
+ import { pkg } from '../../settings.js';
10
11
  import ToggleButtonWrapper from './Datagrid/addons/CustomizeColumns/ButtonWrapper.js';
11
12
  import CustomizeColumnsTearsheetWrapper from './Datagrid/addons/CustomizeColumns/TearsheetWrapper.js';
12
13
 
13
14
  var useCustomizeColumns = function useCustomizeColumns(hooks) {
15
+ React.useEffect(function () {
16
+ pkg.checkReportFeatureEnabled('Datagrid.useCustomizeColumns');
17
+ }, []);
14
18
  var _React$useState = React.useState(false),
15
19
  _React$useState2 = _slicedToArray(_React$useState, 2),
16
20
  isTearsheetOpen = _React$useState2[0],
@@ -8,7 +8,7 @@
8
8
  import useInlineEdit from './useInlineEdit.js';
9
9
 
10
10
  var useEditableCell = function useEditableCell(hooks) {
11
- useInlineEdit(hooks);
11
+ useInlineEdit(hooks, 'usingEditableCell');
12
12
  };
13
13
  var useEditableCell$1 = useEditableCell;
14
14
 
@@ -34,7 +34,7 @@ var useFocusRowExpander = function useFocusRowExpander(_ref) {
34
34
  });
35
35
  if (activeRow.length) {
36
36
  var rowExpander = activeRow[0].querySelector(".".concat(blockClass, "__row-expander"));
37
- rowExpander === null || rowExpander === void 0 || rowExpander.focus();
37
+ rowExpander.focus();
38
38
  }
39
39
  }, [instance === null || instance === void 0 ? void 0 : instance.tableId, instance === null || instance === void 0 ? void 0 : instance.expandedRows, lastExpandedRowIndex, blockClass, activeElement]);
40
40
  };
@@ -1,2 +1,2 @@
1
1
  export default useInlineEdit;
2
- declare function useInlineEdit(hooks: any): void;
2
+ declare function useInlineEdit(hooks: any, usingEditableCell: any): void;
@@ -5,27 +5,34 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- import React__default from 'react';
8
+ import { defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
9
+ import React__default, { useEffect } from 'react';
9
10
  import { pkg } from '../../settings.js';
10
11
  import cx from 'classnames';
11
12
  import { InlineEditCell } from './Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js';
12
13
 
13
14
  var blockClass = "".concat(pkg.prefix, "--datagrid");
14
- var useInlineEdit = function useInlineEdit(hooks) {
15
+ var useInlineEdit = function useInlineEdit(hooks, usingEditableCell) {
16
+ useEffect(function () {
17
+ if (!usingEditableCell) {
18
+ pkg.checkReportFeatureEnabled('Datagrid.useInlineEdit');
19
+ }
20
+ if (usingEditableCell) {
21
+ pkg.checkReportFeatureEnabled('Datagrid.useEditableCell');
22
+ }
23
+ }, [usingEditableCell]);
15
24
  var addInlineEdit = function addInlineEdit(props, _ref) {
16
- var _cell$column, _cell$column2;
25
+ var _cell$column;
17
26
  var cell = _ref.cell,
18
27
  instance = _ref.instance;
19
28
  var columnInlineEditConfig = cell.column.inlineEdit;
20
29
  var inlineEditType = (_cell$column = cell.column) === null || _cell$column === void 0 || (_cell$column = _cell$column.inlineEdit) === null || _cell$column === void 0 ? void 0 : _cell$column.type;
21
- var isDisabled = (_cell$column2 = cell.column) === null || _cell$column2 === void 0 ? void 0 : _cell$column2.isDisabled;
22
30
  var renderInlineEditComponent = function renderInlineEditComponent(type) {
23
31
  return /*#__PURE__*/React__default.createElement(InlineEditCell, {
24
32
  config: columnInlineEditConfig,
25
33
  tabIndex: -1,
26
34
  value: cell.value,
27
35
  cell: cell,
28
- isDisabled: isDisabled,
29
36
  instance: instance,
30
37
  type: type
31
38
  });
@@ -36,15 +43,15 @@ var useInlineEdit = function useInlineEdit(hooks) {
36
43
  }];
37
44
  }
38
45
  return [props, {
39
- className: cx("".concat(blockClass, "__cell"), "".concat(blockClass, "__cell-inline-edit")),
46
+ className: cx("".concat(blockClass, "__cell"), _defineProperty({}, "".concat(blockClass, "__cell-inline-edit"), !!usingEditableCell || pkg.isFeatureEnabled('Datagrid.useInlineEdit') ? true : '')),
40
47
  role: 'gridcell',
41
- children: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, inlineEditType === 'text' && renderInlineEditComponent(inlineEditType), inlineEditType === 'number' && renderInlineEditComponent(inlineEditType), inlineEditType === 'selection' && renderInlineEditComponent(inlineEditType), inlineEditType === 'date' && renderInlineEditComponent(inlineEditType), !inlineEditType && /*#__PURE__*/React__default.createElement(InlineEditCell, {
48
+ children: (!!usingEditableCell || pkg.isFeatureEnabled('Datagrid.useInlineEdit')) && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, inlineEditType === 'text' && renderInlineEditComponent(inlineEditType), inlineEditType === 'number' && renderInlineEditComponent(inlineEditType), inlineEditType === 'selection' && renderInlineEditComponent(inlineEditType), inlineEditType === 'date' && renderInlineEditComponent(inlineEditType), !inlineEditType && /*#__PURE__*/React__default.createElement(InlineEditCell, {
42
49
  config: columnInlineEditConfig,
43
50
  tabIndex: -1,
44
51
  value: cell.value,
45
52
  cell: cell,
46
53
  instance: instance,
47
- disabledCell: isDisabled,
54
+ disabled: true,
48
55
  nonEditCell: true,
49
56
  type: "text"
50
57
  }))
@@ -53,7 +60,7 @@ var useInlineEdit = function useInlineEdit(hooks) {
53
60
  hooks.getCellProps.push(addInlineEdit);
54
61
  hooks.useInstance.push(function (instance) {
55
62
  Object.assign(instance, {
56
- withInlineEdit: true
63
+ withInlineEdit: !!usingEditableCell || pkg.isFeatureEnabled('Datagrid.useInlineEdit') ? true : false
57
64
  });
58
65
  });
59
66
  };
@@ -14,7 +14,6 @@ type ActionIcon = {
14
14
  iconDescription: string;
15
15
  href?: string;
16
16
  };
17
- type PlacementType = 'top' | 'bottom';
18
17
  interface EditUpdateCardsProps {
19
18
  /**
20
19
  * Icons that are displayed on card. Refer to design documentation for implementation guidelines
@@ -23,7 +22,7 @@ interface EditUpdateCardsProps {
23
22
  /**
24
23
  * Determines if the action icons are on the top or bottom of the card
25
24
  */
26
- actionsPlacement?: PlacementType;
25
+ actionsPlacement?: 'top' | 'bottom';
27
26
  /**
28
27
  * Optional label for the top of the card.
29
28
  */
@@ -67,7 +66,7 @@ interface EditUpdateCardsProps {
67
66
  /**
68
67
  * Determines if the primary button is on the top or bottom of the card
69
68
  */
70
- primaryButtonPlacement?: PlacementType;
69
+ primaryButtonPlacement?: 'top' | 'bottom';
71
70
  /**
72
71
  * The text that's displayed in the primary button
73
72
  */
@@ -87,7 +86,7 @@ interface EditUpdateCardsProps {
87
86
  /**
88
87
  * Determines if the secondary button is on the top or bottom of the card
89
88
  */
90
- secondaryButtonPlacement?: PlacementType;
89
+ secondaryButtonPlacement?: 'top' | 'bottom';
91
90
  /**
92
91
  * The text that's displayed in the secondary button
93
92
  */
@@ -14,7 +14,6 @@ import { Idea, CaretLeft, CaretRight, Close } from '@carbon/react/icons';
14
14
  import { Button, IconButton } from '@carbon/react';
15
15
  import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
16
16
  import { pkg } from '../../settings.js';
17
- import uuidv4 from '../../global/js/utils/uuidv4.js';
18
17
  import { Carousel } from '../Carousel/Carousel.js';
19
18
 
20
19
  var _CaretLeft, _CaretRight, _Close;
@@ -77,9 +76,8 @@ var Guidebanner = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
77
76
  return !prevState;
78
77
  });
79
78
  };
80
- var carouselContentId = "".concat(uuidv4(), "--carousel-content-id");
81
79
  return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
82
- "aria-owns": !isCollapsed ? carouselContentId : undefined,
80
+ "aria-expanded": !isCollapsed,
83
81
  className: cx(blockClass, className, collapsible && "".concat(blockClass, "__collapsible"), isCollapsed && "".concat(blockClass, "__collapsible-collapsed"), withLeftGutter && "".concat(blockClass, "__with-left-gutter")),
84
82
  ref: ref
85
83
  }, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement(Idea, {
@@ -88,7 +86,6 @@ var Guidebanner = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
88
86
  }), /*#__PURE__*/React__default.createElement("div", {
89
87
  className: "".concat(blockClass, "__title")
90
88
  }, title), /*#__PURE__*/React__default.createElement(Carousel, {
91
- id: carouselContentId,
92
89
  className: "".concat(blockClass, "__carousel")
93
90
  // These colors are to match the Carousel's faded edges
94
91
  // against the Guidebanner's gradient background.
@@ -111,9 +108,7 @@ var Guidebanner = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
111
108
  size: "md",
112
109
  className: "".concat(blockClass, "__toggle-button"),
113
110
  onClick: handleClickToggle,
114
- ref: toggleRef,
115
- "aria-controls": !isCollapsed ? carouselContentId : undefined,
116
- "aria-expanded": !isCollapsed
111
+ ref: toggleRef
117
112
  }, isCollapsed ? expandButtonLabel : collapseButtonLabel), showNavigation && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("span", {
118
113
  className: cx("".concat(blockClass, "__back-button"), [scrollPosition === 0 ? "".concat(blockClass, "__back-button--disabled") : null])
119
114
  }, /*#__PURE__*/React__default.createElement(IconButton, {
@@ -1,115 +1,2 @@
1
- import React, { PropsWithChildren, ReactNode } from 'react';
2
- import { CarbonIconType } from '@carbon/icons-react/lib/CarbonIcon';
3
- type ActionIcon = {
4
- id?: string;
5
- icon?: CarbonIconType;
6
- onKeyDown?(): void;
7
- onClick?(): void;
8
- iconDescription?: string;
9
- href?: string;
10
- };
11
- type overflowAction = {
12
- id?: string;
13
- itemText?: string;
14
- onClick?: () => void;
15
- onKeydown?: () => void;
16
- };
17
- type PlacementType = 'top' | 'bottom';
18
- type ClickZoneType = 'one' | 'two' | 'three';
19
- interface ProductiveCardProps extends PropsWithChildren {
20
- /**
21
- * Icons that are displayed on card. Refer to design documentation for implementation guidelines. Note- href will supersede onClick
22
- */
23
- actionIcons?: ActionIcon[];
24
- /**
25
- * Determines if the action icons are on the top or bottom of the card
26
- */
27
- actionsPlacement?: PlacementType;
28
- /**
29
- * Content that shows in the body of the card
30
- */
31
- /**
32
- * Optional user provided class
33
- */
34
- className?: string;
35
- children: ReactNode;
36
- /**
37
- * Designates which zones of the card are clickable. Refer to design documentation for implementation guidelines
38
- */
39
- clickZone?: ClickZoneType;
40
- /**
41
- * Optional header description
42
- */
43
- description?: string | object | ReactNode;
44
- /**
45
- * Optional label for the top of the card
46
- */
47
- label?: string | object | ReactNode;
48
- /**
49
- * Provides the callback for a clickable card
50
- */
51
- onClick?: () => void;
52
- /**
53
- * Function that's called from the primary button or action icon
54
- */
55
- onPrimaryButtonClick?: () => void;
56
- /**
57
- * Function that's called from the secondary button
58
- */
59
- onSecondaryButtonClick?: () => void;
60
- /**
61
- * Use an overflow menu instead of action icons. Refer to design documentation for implementation guidelines
62
- */
63
- overflowActions?: overflowAction[];
64
- /**
65
- * Aria label prop required for OverflowMenu
66
- */
67
- overflowAriaLabel?: string;
68
- /**
69
- * Optionally specify an href for your Button to become an <a> element
70
- */
71
- primaryButtonHref?: string;
72
- /**
73
- * Optional prop to allow overriding the icon rendering. Can be a React component class
74
- */
75
- primaryButtonIcon?: CarbonIconType;
76
- /**
77
- * Determines if the primary button is on the top or bottom of the card
78
- */
79
- primaryButtonPlacement?: PlacementType;
80
- /**
81
- * The text that's displayed in the primary button
82
- */
83
- primaryButtonText?: string;
84
- /**
85
- * Optionally specify an href for your Button to become an <a> element
86
- */
87
- secondaryButtonHref?: string;
88
- /**
89
- * Optional prop to allow overriding the icon rendering. Can be a React component class
90
- */
91
- secondaryButtonIcon?: CarbonIconType;
92
- /**
93
- * Determines if the secondary button is on the top or bottom of the card
94
- */
95
- secondaryButtonPlacement?: PlacementType;
96
- /**
97
- * The text that's displayed in the secondary button
98
- */
99
- secondaryButtonText?: string;
100
- /**
101
- * **Experimental:** For all cases a `Slug` component can be provided.
102
- * Clickable tiles only accept a boolean value of true and display a hollow slug.
103
- */
104
- slug?: ReactNode | boolean;
105
- /**
106
- * Title that's displayed at the top of the card
107
- */
108
- title?: string | object | ReactNode;
109
- /**
110
- * Determines title size
111
- */
112
- titleSize?: 'default' | 'large';
113
- }
114
- export declare let ProductiveCard: React.ForwardRefExoticComponent<ProductiveCardProps & React.RefAttributes<HTMLDivElement>>;
115
- export {};
1
+ export let ProductiveCard: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
2
+ import React from 'react';
@@ -15,16 +15,22 @@ import { Card } from '../Card/Card.js';
15
15
 
16
16
  var _excluded = ["actionsPlacement"];
17
17
  var componentName = 'ProductiveCard';
18
+
19
+ // Default values for props
20
+ var defaults = {
21
+ actionsPlacement: 'top'
22
+ };
18
23
  var ProductiveCard = /*#__PURE__*/forwardRef(function (_ref, ref) {
19
24
  var _ref$actionsPlacement = _ref.actionsPlacement,
20
- actionsPlacement = _ref$actionsPlacement === void 0 ? 'top' : _ref$actionsPlacement,
25
+ actionsPlacement = _ref$actionsPlacement === void 0 ? defaults.actionsPlacement : _ref$actionsPlacement,
21
26
  rest = _objectWithoutProperties(_ref, _excluded);
22
27
  var validProps = prepareProps(rest, ['media', 'mediaPosition', 'pictogram', 'primaryButtonClick', 'productive', 'secondaryButtonKind']);
23
28
  return /*#__PURE__*/React__default.createElement(Card, _extends({}, _objectSpread2(_objectSpread2({}, validProps), {}, {
24
29
  actionsPlacement: actionsPlacement,
25
- ref: ref,
30
+ ref: ref
31
+ }), {
26
32
  productive: true
27
- }), getDevtoolsProps(componentName)));
33
+ }, getDevtoolsProps(componentName)));
28
34
  });
29
35
 
30
36
  // Return a placeholder if not released and not enabled by feature flag
@@ -33,7 +39,6 @@ ProductiveCard.propTypes = {
33
39
  /**
34
40
  * Icons that are displayed on card. Refer to design documentation for implementation guidelines
35
41
  */
36
- /**@ts-ignore */
37
42
  actionIcons: PropTypes.arrayOf(PropTypes.shape({
38
43
  id: PropTypes.string,
39
44
  icon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
@@ -81,7 +86,6 @@ ProductiveCard.propTypes = {
81
86
  /**
82
87
  * Use an overflow menu instead of action icons. Refer to design documentation for implementation guidelines
83
88
  */
84
- /**@ts-ignore */
85
89
  overflowActions: PropTypes.arrayOf(PropTypes.shape({
86
90
  id: PropTypes.string,
87
91
  itemText: PropTypes.string,
@@ -99,7 +103,6 @@ ProductiveCard.propTypes = {
99
103
  /**
100
104
  * Optional prop to allow overriding the icon rendering. Can be a React component class
101
105
  */
102
- /**@ts-ignore */
103
106
  primaryButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
104
107
  /**
105
108
  * Determines if the primary button is on the top or bottom of the card
@@ -108,7 +111,6 @@ ProductiveCard.propTypes = {
108
111
  /**
109
112
  * The text that's displayed in the primary button
110
113
  */
111
- /**@ts-ignore */
112
114
  primaryButtonText: PropTypes.node,
113
115
  /**
114
116
  * Optionally specify an href for your Button to become an <a> element
@@ -117,7 +119,6 @@ ProductiveCard.propTypes = {
117
119
  /**
118
120
  * Optional prop to allow overriding the icon rendering. Can be a React component class
119
121
  */
120
- /**@ts-ignore */
121
122
  secondaryButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
122
123
  /**
123
124
  * Determines if the secondary button is on the top or bottom of the card
@@ -126,7 +127,6 @@ ProductiveCard.propTypes = {
126
127
  /**
127
128
  * The text that's displayed in the secondary button
128
129
  */
129
- /**@ts-ignore */
130
130
  secondaryButtonText: PropTypes.node,
131
131
  /**
132
132
  * **Experimental:** For all cases a `Slug` component can be provided.
@@ -69,4 +69,3 @@ export { Guidebanner, GuidebannerElement, GuidebannerElementButton, GuidebannerE
69
69
  export { InlineTip, InlineTipButton, InlineTipLink } from "./InlineTip";
70
70
  export { DescriptionList, DescriptionListBody, DescriptionListCell, DescriptionListRow } from "./DescriptionList";
71
71
  export { FilterPanel, FilterPanelAccordion, FilterPanelAccordionItem, FilterPanelCheckbox, FilterPanelCheckboxWithOverflow, FilterPanelGroup, FilterPanelLabel, FilterPanelSearch } from "./FilterPanel";
72
- export { FeatureFlags as unstable_FeatureFlags, useFeatureFlag as unstable_useFeatureFlag, useFeatureFlags as unstable_useFeatureFlags } from "./FeatureFlags";
@@ -9,10 +9,8 @@ import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPlugin
9
9
  import { useState, useEffect, useCallback } from 'react';
10
10
  import { pkg } from '../../../settings.js';
11
11
  import { createPortal } from 'react-dom';
12
- import { useFeatureFlag } from '../../../components/FeatureFlags/index.js';
13
12
 
14
13
  var usePortalTarget = function usePortalTarget(portalTargetIn) {
15
- var enablePortalTarget = useFeatureFlag('default-portal-target-body');
16
14
  var _useState = useState(null),
17
15
  _useState2 = _slicedToArray(_useState, 2),
18
16
  portalTarget = _useState2[0],
@@ -21,11 +19,11 @@ var usePortalTarget = function usePortalTarget(portalTargetIn) {
21
19
  if (portalTargetIn) {
22
20
  setPortalTarget(portalTargetIn);
23
21
  } else {
24
- if (pkg.isFeatureEnabled('default-portal-target-body') || enablePortalTarget) {
22
+ if (pkg.isFeatureEnabled('default-portal-target-body')) {
25
23
  setPortalTarget(document.body);
26
24
  }
27
25
  }
28
- }, [portalTargetIn, enablePortalTarget]);
26
+ }, [portalTargetIn]);
29
27
  var renderPortalUse = useCallback(function (children) {
30
28
  return portalTarget ? /*#__PURE__*/createPortal(children, portalTarget) : children;
31
29
  }, [portalTarget]);
package/es/index.js CHANGED
@@ -133,4 +133,3 @@ export { FilterPanelLabel } from './components/FilterPanel/FilterPanelLabel/Filt
133
133
  export { FilterPanelSearch } from './components/FilterPanel/FilterPanelSearch/FilterPanelSearch.js';
134
134
  export { ConditionBuilder } from './components/ConditionBuilder/ConditionBuilder.js';
135
135
  export { GetStartedCard } from './components/GetStartedCard/GetStartedCard.js';
136
- export { FeatureFlags as unstable_FeatureFlags, useFeatureFlag as unstable_useFeatureFlag, useFeatureFlags as unstable_useFeatureFlags } from './components/FeatureFlags/index.js';