@carbon/ibm-products 2.0.0-rc.2 → 2.0.0-rc.20

package/scss/components/{InlineEdit → InlineEditV1}/_index.scss

@@ -5,4 +5,4 @@
 // LICENSE file in the root directory of this source tree.
 //
 
-@use './inline-edit';
+@use './inline-edit-v1';

package/scss/components/{InlineEdit/_inline-edit.scss → InlineEditV1/_inline-edit-v1.scss}

@@ -105,8 +105,10 @@ $block-class: #{c4p-settings.$pkg-prefix}--inline-edit;
     overflow: hidden;
     // positions text and placeholder including when showing placeholder
     // NOTE: Using flex does strange things to a caret in content editable
-    width: calc(100% - var(--#{$block-class}--toolbar-width) - $spacing-05);
-    max-width: calc(100% - var(--#{$block-class}--toolbar-width) - $spacing-05);
+    width: calc(100% - var(--#{$block-class}--toolbar-width) - #{$spacing-05});
+    max-width: calc(
+      100% - var(--#{$block-class}--toolbar-width) - #{$spacing-05}
+    );
     min-height: var(--#{$block-class}--size);
     /* stylelint-disable-next-line carbon/layout-token-use */
     margin-right: var(--#{$block-class}--toolbar-width);

package/scss/components/InlineEditV2/_carbon-imports.scss

@@ -0,0 +1,9 @@
+//
+// Copyright IBM Corp. 2022, 2022
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@use '@carbon/react/scss/components/button';
+@use '@carbon/react/scss/components/text-input';

package/scss/components/InlineEditV2/_index-with-carbon.scss

@@ -0,0 +1,9 @@
+//
+// Copyright IBM Corp. 2022, 2022
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@use './carbon-imports';
+@use './inline-edit-v2';

package/scss/components/InlineEditV2/_index.scss

@@ -0,0 +1,10 @@
+//
+// Copyright IBM Corp. 2022, 2022
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+// An index file is most useful when you have multiple components
+
+@use './inline-edit-v2';

package/scss/components/InlineEditV2/_inline-edit-v2.scss

@@ -0,0 +1,83 @@
+//
+// Copyright IBM Corp. 2022, 2022
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+// Standard imports.
+@use '@carbon/styles/scss/spacing' as *;
+@use '@carbon/styles/scss/theme' as *;
+@use '../../global/styles/project-settings' as *;
+@use '@carbon/styles/scss/type';
+
+$block-class: #{$pkg-prefix}--inline-edit-v2;
+$carbon-input: #{$carbon-prefix}--text-input;
+
+.#{$block-class} {
+  display: flex;
+  align-items: center;
+  background: transparent;
+  cursor: pointer;
+}
+
+.#{$block-class}-readonly {
+  cursor: not-allowed;
+}
+
+.#{$block-class}:hover {
+  background: $field-01;
+}
+
+.#{$block-class}:hover .#{$block-class}__btn-edit {
+  visibility: visible;
+}
+
+.#{$block-class}__btn-edit {
+  visibility: hidden;
+}
+
+.#{$block-class}-focused {
+  background: $field-01;
+  outline: 2px solid $focus;
+}
+
+.#{$block-class}__text-input {
+  flex: 1;
+}
+
+.#{$block-class}__text-input-label {
+  display: none;
+}
+
+.#{$block-class}__warning-icon {
+  /* stylelint-disable-next-line carbon/layout-token-use */
+  margin-right: 0.4375rem;
+  color: $support-error;
+}
+
+.#{$block-class}__warning-text {
+  @include type.type-style('label-01');
+
+  margin-top: $spacing-03;
+  color: $support-error;
+}
+
+// overrides
+.#{$block-class}__text-input.#{$carbon-input} {
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  outline: none;
+}
+
+.#{$block-class}-readonly .#{$block-class}__text-input.#{$carbon-input},
+.#{$block-class}-readonly
+  .#{$carbon-prefix}--btn.#{$carbon-prefix}--btn--icon-only.#{$carbon-prefix}--tooltip__trigger {
+  cursor: not-allowed;
+}
+
+.#{$block-class}__text-input.#{$carbon-input}:focus,
+.#{$block-class}__text-input.#{$carbon-input}:active {
+  outline: none;
+}

package/scss/components/InlineEditV2/_storybook-styles.scss

@@ -0,0 +1,9 @@
+//
+// Copyright IBM Corp. 2022, 2022
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+.inline-edit-v2-example {
+  width: 15rem;
+}

package/scss/components/MultiAddSelect/_multi-add-select.scss

@@ -1 +1,8 @@
-@use '../AddSelect/add-select';
+//
+// Copyright IBM Corp. 2022, 2022
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@use '../AddSelect/add-select' as *;

package/scss/components/MultiAddSelect/_storybook-styles.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2021
+// Copyright IBM Corp. 2022, 2022
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.

package/scss/components/NotificationsPanel/_notifications-panel.scss

@@ -60,8 +60,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--notifications-panel;
   max-height: 38.5rem;
   background-color: $background;
   color: $text-primary;
-  transition: transform $duration-fast-02;
-  transition-timing-function: motion(standard);
+  transition: transform $duration-fast-02 motion(standard);
 
   .#{$block-class}__header-container {
     position: sticky;
@@ -123,8 +122,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--notifications-panel;
     background-color: $background;
     cursor: pointer;
     text-align: left;
-    transition: background-color $duration-moderate-02;
-    transition-timing-function: motion(standard);
+    transition: background-color $duration-moderate-02 motion(standard);
     .#{$block-class}__notification-title {
       margin-bottom: $spacing-02;
       color: $text-on-color;
@@ -236,8 +234,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--notifications-panel;
     margin: 0 auto;
     background-color: $layer-02;
     content: '';
-    transition: background-color $duration-moderate-02;
-    transition-timing-function: motion(standard);
+    transition: background-color $duration-moderate-02 motion(standard);
   }
   .#{$block-class}__notification-today:hover
     + .#{$block-class}__notification-today:not(:first-of-type):before,

package/scss/components/RemoveModal/_remove-modal.scss

@@ -21,10 +21,6 @@ $block-class: #{c4p-settings.$pkg-prefix}--remove-modal;
   padding-right: $spacing-05;
 }
 
-.#{$block-class} .#{c4p-settings.$carbon-prefix}--modal-close {
-  display: none;
-}
-
 .#{$block-class}__body {
   padding-right: 20%;
   margin-bottom: $spacing-05;

package/scss/components/SidePanel/_side-panel.scss

@@ -26,49 +26,6 @@
 $block-class: #{c4p-settings.$pkg-prefix}--side-panel;
 $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
 
-@mixin sidePanelEntranceRight($size: map-get($side-panel-sizes, md)) {
-  @keyframes side-panel-entrance-right {
-    0% {
-      opacity: 0;
-      // stylelint-disable-next-line carbon/layout-token-use
-      transform: translateX(#{$size}); // the size width of the side panel
-    }
-
-    100% {
-      opacity: 1;
-      transform: translateX(0);
-    }
-  }
-}
-
-@mixin sidePanelEntranceLeft($size: map-get($side-panel-sizes, md)) {
-  @keyframes side-panel-entrance-left {
-    0% {
-      opacity: 0;
-      // stylelint-disable-next-line carbon/layout-token-use
-      transform: translateX(-#{$size}); // the size width of the side panel
-    }
-
-    100% {
-      opacity: 1;
-      transform: translateX(0);
-    }
-  }
-}
-
-@mixin sidePanelEntrance(
-  $placement: 'right',
-  $size: map-get($side-panel-sizes, md)
-) {
-  width: $size;
-  max-width: 100%;
-  @if $placement == right {
-    @include sidePanelEntranceRight($size);
-  } @else {
-    @include sidePanelEntranceLeft($size);
-  }
-}
-
 @mixin setPanelSize($size: map-get($side-panel-sizes, md)) {
   width: $size;
   max-width: 100%;
@@ -93,32 +50,6 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
   -webkit-line-clamp: 2;
 }
 
-@keyframes side-panel-exit-left {
-  0% {
-    opacity: 1;
-    transform: translateX(0);
-  }
-
-  100% {
-    opacity: 0;
-    // stylelint-disable-next-line carbon/layout-token-use
-    transform: translateX(calc(-1 * #{map-get($side-panel-sizes, md)}));
-  }
-}
-
-@keyframes side-panel-exit-right {
-  0% {
-    opacity: 1;
-    transform: translateX(0);
-  }
-
-  100% {
-    opacity: 0;
-    // stylelint-disable-next-line carbon/layout-token-use
-    transform: translateX(map-get($side-panel-sizes, md));
-  }
-}
-
 .#{$block-class}__container {
   --#{$block-class}--subtitle-opacity: 1;
   --#{$block-class}--title-container-height: 0;
@@ -140,8 +71,6 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
   box-sizing: border-box;
   background-color: $layer-01;
   color: $text-primary;
-  transition: transform $duration-moderate-02;
-  transition-timing-function: motion(standard);
   @each $size, $size_value in $side-panel-sizes {
     &.#{$block-class}__container--#{$size} {
       @include setPanelSize($size_value);
@@ -153,14 +82,10 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
       }
     }
     &.#{$block-class}__container-right-placement.#{$block-class}__container--#{$size} {
-      @include sidePanelEntrance(right, $size_value);
-
       right: 0;
       border-left: 1px solid $border-subtle-02;
     }
     &.#{$block-class}__container-left-placement.#{$block-class}__container--#{$size} {
-      @include sidePanelEntrance(left, $size_value);
-
       left: 0;
       border-right: 1px solid $border-subtle-02;
     }
@@ -284,7 +209,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
     // stylelint-disable-next-line carbon/layout-token-use
     top: calc(
       var(--#{$block-class}--title-text-height) +
-        var(--#{$block-class}--label-text-height) + #{$spacing-09}
+        var(--#{$block-class}--label-text-height)
     );
     background-color: $layer-01;
   }
@@ -304,7 +229,6 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
 
   .#{$block-class}__title-container.#{$block-class}__title-container--no-title-animation {
     position: fixed;
-    top: $spacing-09;
     height: calc(
       var(--#{$block-class}--title-text-height) +
         var(--#{$block-class}--label-text-height)
@@ -359,7 +283,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
     // stylelint-disable-next-line carbon/layout-token-use
     top: calc(
       var(--#{$block-class}--title-text-height) +
-        var(--#{$block-class}--subtitle-container-height) + #{$spacing-09}
+        var(--#{$block-class}--subtitle-container-height)
     );
     width: 100%;
     border-bottom: 1px solid $layer-active-01;
@@ -389,8 +313,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
     padding: 0 $spacing-05;
     margin-bottom: $spacing-03;
     background-color: $layer-01;
-    transition: transform $duration-moderate-01;
-    transition-timing-function: motion(standard);
+    transition: transform $duration-moderate-01 motion(standard);
     .#{$block-class}__action-toolbar-button {
       min-width: 2rem;
       &.#{$block-class}__action-toolbar-icon-only-button {
@@ -535,6 +458,4 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set;
   width: 100%;
   height: 100%;
   background-color: $overlay;
-  transition: background-color $duration-moderate-02;
-  transition-timing-function: motion(standard);
 }

package/scss/components/SidePanel/_storybook-styles.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2020, 2021
+// Copyright IBM Corp. 2020, 2022
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.
@@ -7,6 +7,7 @@
 
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/spacing' as *;
+@use '@carbon/themes/scss/themes';
 @use '@carbon/styles/scss/type';
 
 $story-prefix: side-panel-stories__;
@@ -38,3 +39,7 @@ $story-prefix: side-panel-stories__;
     margin: $spacing-05 0 $spacing-04;
   }
 }
+
+.#{$story-prefix}header {
+  @include theme(themes.$g100);
+}

package/scss/components/SingleAddSelect/_carbon-imports.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2022, 2022
+// Copyright IBM Corp. 2022
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.

package/scss/components/SingleAddSelect/_index-with-carbon.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2022, 2022
+// Copyright IBM Corp. 2022
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.

package/scss/components/SingleAddSelect/_index.scss

@@ -1 +1,8 @@
+//
+// Copyright IBM Corp. 2022
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
 @use './single-add-select';

package/scss/components/SingleAddSelect/_single-add-select.scss

@@ -1 +1,8 @@
-@use '../AddSelect/add-select';
+//
+// Copyright IBM Corp. 2022
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@use '../AddSelect/add-select' as *;

package/scss/components/SingleAddSelect/_storybook-styles.scss

@@ -1,5 +1,5 @@
 //
-// Copyright IBM Corp. 2021
+// Copyright IBM Corp. 2022
 //
 // This source code is licensed under the Apache-2.0 license found in the
 // LICENSE file in the root directory of this source tree.

package/scss/components/Tearsheet/_tearsheet.scss

@@ -47,8 +47,8 @@ $motion-duration: $duration-moderate-02;
     /* stylelint-disable-next-line function-no-unknown */
     z-index: utilities.z('modal');
     align-items: flex-end;
-    // stylelint-disable-next-line carbon/motion-easing-use, carbon/motion-duration-use
-    transition: visibility 0 linear,
+    // stylelint-disable-next-line carbon/motion-duration-use, carbon/motion-easing-use
+    transition: visibility 0s linear,
       background-color $motion-duration motion(entrance, expressive),
       opacity $motion-duration motion(entrance, expressive);
     @media (prefers-reduced-motion: reduce) {
@@ -202,6 +202,8 @@ $motion-duration: $duration-moderate-02;
     @include breakpoint-up('md') {
       max-width: 60%;
     }
+
+    word-break: break-word;
   }
 
   &.#{$block-class}--narrow .#{$block-class}__header-description {

package/scss/components/_index-released-only-with-carbon.scss

@@ -21,14 +21,16 @@
 @use './ExportModal/index-with-carbon' as *;
 @use './ExpressiveCard/index-with-carbon' as *;
 @use './HTTPErrors/index-with-carbon' as *;
-@use './InlineEdit/index-with-carbon' as *;
+@use './InlineEditV1/index-with-carbon' as *;
 @use './ImportModal/index-with-carbon' as *;
+@use './MultiAddSelect/index-with-carbon' as *;
 @use './NotificationsPanel/index-with-carbon' as *;
 @use './PageHeader/index-with-carbon' as *;
 @use './ProductiveCard/index-with-carbon' as *;
 @use './RemoveModal/index-with-carbon' as *;
 @use './Saving/index-with-carbon' as *;
 @use './SidePanel/index-with-carbon' as *;
+@use './SingleAddSelect/index-with-carbon' as *;
 @use './StatusIcon/index-with-carbon' as *;
 @use './TagSet/index-with-carbon' as *;
 @use './Tearsheet/index-with-carbon' as *;

package/scss/components/_index-released-only.scss

@@ -21,15 +21,18 @@
 @use './ExportModal';
 @use './ExpressiveCard';
 @use './HTTPErrors';
-@use './InlineEdit';
+@use './InlineEditV1';
 @use './ImportModal';
+@use './MultiAddSelect';
 @use './NotificationsPanel';
 @use './PageHeader';
 @use './ProductiveCard';
 @use './RemoveModal';
 @use './Saving';
 @use './SidePanel';
+@use './SingleAddSelect';
 @use './StatusIcon';
 @use './TagSet';
 @use './Tearsheet';
 @use './UserProfileImage';
+@use './WebTerminal';

package/scss/components/_index-with-carbon.scss

@@ -42,6 +42,8 @@
 @use './UserProfileImage/index-with-carbon' as *;
 @use './EditSidePanel/index-with-carbon' as *;
 @use './OptionsTile/index-with-carbon' as *;
-@use './InlineEdit/index-with-carbon' as *;
+@use './InlineEditV1/index-with-carbon' as *;
+@use './InlineEditV2/index-with-carbon' as *;
 @use './DataSpreadsheet/index-with-carbon' as *;
 @use './Datagrid/index-with-carbon' as *;
+@use './EditUpdateCards/index-with-carbon' as *;

package/scss/components/_index.scss

@@ -23,6 +23,7 @@
 @use './EmptyStates';
 @use './ExportModal';
 @use './ExpressiveCard';
+@use './FilterSummary/index';
 @use './HTTPErrors';
 @use './ImportModal';
 @use './ModifiedTabs';
@@ -42,9 +43,11 @@
 @use './UserProfileImage';
 @use './EditSidePanel';
 @use './OptionsTile';
-@use './InlineEdit';
+@use './InlineEditV1';
+@use './InlineEditV2';
 @use './DataSpreadsheet';
 @use './Datagrid';
 @use './EditTearsheet';
 @use './EditTearsheetNarrow';
 @use './EditFullPage';
+@use './EditUpdateCards';

package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsModal.js

@@ -1,157 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-
-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; }
-
-/*
- * Licensed Materials - Property of IBM
- * 5724-Q36
- * (c) Copyright IBM Corp. 2021
- * US Government Users Restricted Rights - Use, duplication or disclosure
- * restricted by GSA ADP Schedule Contract with IBM Corp.
- */
-// @flow
-import React, { useState } from 'react';
-import PropTypes from 'prop-types';
-import { Modal } from '@carbon/react';
-import { isColumnVisible } from './common';
-import Columns from './Columns';
-import Actions from './Actions';
-import { pkg } from '../../../../../settings';
-var blockClass = "".concat(pkg.prefix, "--datagrid");
-
-var CustomizeColumnsModal = function CustomizeColumnsModal(_ref) {
-  var isOpen = _ref.isOpen,
-      setIsModalOpen = _ref.setIsModalOpen,
-      onSaveColumnPrefs = _ref.onSaveColumnPrefs,
-      columnDefinitions = _ref.columnDefinitions,
-      originalColumnDefinitions = _ref.originalColumnDefinitions,
-      _ref$customizeModalHe = _ref.customizeModalHeadingLabel,
-      customizeModalHeadingLabel = _ref$customizeModalHe === void 0 ? 'Customize display' : _ref$customizeModalHe,
-      _ref$primaryButtonTex = _ref.primaryButtonTextLabel,
-      primaryButtonTextLabel = _ref$primaryButtonTex === void 0 ? 'Save' : _ref$primaryButtonTex,
-      _ref$secondaryButtonT = _ref.secondaryButtonTextLabel,
-      secondaryButtonTextLabel = _ref$secondaryButtonT === void 0 ? 'Cancel' : _ref$secondaryButtonT,
-      _ref$instructionsLabe = _ref.instructionsLabel,
-      instructionsLabel = _ref$instructionsLabe === void 0 ? 'Deselect columns to hide them. Click and drag the white box to reorder the columns. These specifications will be saved and persist if you leave and return to the data table.' : _ref$instructionsLabe;
-
-  var _useState = useState(''),
-      _useState2 = _slicedToArray(_useState, 2),
-      searchText = _useState2[0],
-      setSearchText = _useState2[1];
-
-  var _useState3 = useState(columnDefinitions // hide the columns without Header, e.g the sticky actions, spacer
-  .filter(function (colDef) {
-    return !!colDef.Header.props;
-  }) // only sort the hidden column to the end when modal reopen
-  .sort(function (defA, defB) {
-    var isVisibleA = isColumnVisible(defA);
-    var isVisibleB = isColumnVisible(defB);
-
-    if (isVisibleA && !isVisibleB) {
-      return -1;
-    }
-
-    if (!isVisibleA && isVisibleB) {
-      return 1;
-    }
-
-    return 0;
-  })),
-      _useState4 = _slicedToArray(_useState3, 2),
-      columnObjects = _useState4[0],
-      _setColumnsObject = _useState4[1];
-
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      isDirty = _useState6[0],
-      setIsDirty = _useState6[1];
-
-  var onRequestClose = function onRequestClose() {
-    setIsModalOpen(false);
-  };
-
-  var onRequestSubmit = function onRequestSubmit() {
-    setIsModalOpen(false);
-    var updatedColumns = columnObjects.map(function (colDef) {
-      return {
-        id: colDef.id,
-        isVisible: colDef.isVisible
-      };
-    });
-    onSaveColumnPrefs(updatedColumns);
-  };
-
-  var onCheckboxCheck = function onCheckboxCheck(col, value) {
-    var changedDefinitions = columnObjects.map(function (definition) {
-      if (definition.id === col.id) {
-        return _objectSpread(_objectSpread({}, definition), {}, {
-          isVisible: value
-        });
-      }
-
-      return definition;
-    });
-
-    _setColumnsObject(changedDefinitions);
-
-    setDirty();
-  };
-
-  var setDirty = function setDirty() {
-    if (!isDirty) {
-      setIsDirty(true);
-    }
-  };
-
-  var string = searchText.trim().toLowerCase();
-  return /*#__PURE__*/React.createElement(Modal, {
-    className: "".concat(blockClass, "__customize-columns-modal"),
-    open: isOpen,
-    modalHeading: customizeModalHeadingLabel,
-    primaryButtonText: primaryButtonTextLabel,
-    secondaryButtonText: secondaryButtonTextLabel,
-    selectorPrimaryFocus: ".".concat(blockClass, "__customize-columns-column-list--focus"),
-    primaryButtonDisabled: !isDirty,
-    onRequestClose: onRequestClose,
-    onRequestSubmit: onRequestSubmit,
-    size: "sm",
-    hasForm: true
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(blockClass, "__customize-columns-instructions")
-  }, instructionsLabel), /*#__PURE__*/React.createElement(Actions, {
-    columns: columnObjects,
-    originalColumnDefinitions: originalColumnDefinitions,
-    searchText: searchText,
-    setColumnsObject: function setColumnsObject(cols) {
-      _setColumnsObject(cols);
-
-      setDirty();
-    },
-    setSearchText: setSearchText
-  }), isOpen && /*#__PURE__*/React.createElement(Columns, {
-    columns: columnObjects,
-    filterString: string,
-    onSelectColumn: onCheckboxCheck,
-    setColumnsObject: function setColumnsObject(cols) {
-      _setColumnsObject(cols);
-
-      setDirty();
-    }
-  }));
-};
-
-CustomizeColumnsModal.propTypes = {
-  columnDefinitions: PropTypes.array.isRequired,
-  customizeModalHeadingLabel: PropTypes.string,
-  instructionsLabel: PropTypes.string,
-  isOpen: PropTypes.bool.isRequired,
-  onSaveColumnPrefs: PropTypes.func.isRequired,
-  originalColumnDefinitions: PropTypes.array.isRequired,
-  primaryButtonTextLabel: PropTypes.string,
-  secondaryButtonTextLabel: PropTypes.string,
-  setIsModalOpen: PropTypes.func.isRequired
-};
-export default CustomizeColumnsModal;