@corva/ui 0.65.0-1-test → 0.65.0-3

package/components/Drillstring/BHAComponentsTable/components/Component.js

@@ -1,648 +1 @@
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { memo, useState, useEffect } from 'react';
-import classNames from 'classnames';
-import { omit, isEmpty, map } from 'lodash';
-import PropTypes from 'prop-types';
-import { Grid, Menu, MenuItem } from '@material-ui/core';
-import '../../../../utils/index.js';
-import { COMPONENT_FAMILIES } from '../../../../constants/drillstring.js';
-import '../../../DevCenter/DevCenterAppContainer/components/AppActions/AppActions.css.js';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import '../../../DevCenter/DevCenterAppContainer/components/AppSettingsDialog/AppSettingsDialog.js';
-import '../../../DevCenter/DevCenterAppContainer/components/AppSettingsDialogV2/AppSettingsDialog.js';
-import '../../../DevCenter/DevCenterAppContainer/components/AnnotationsButton/AnnotationsButton.js';
-import '../../../DevCenter/DevCenterAppContainer/components/NonPriorityMenus/NonPriorityMenus.js';
-import '../../../DevCenter/DevCenterAppContainer/components/FullscreenButton/FullscreenButton.js';
-import '../../../DevCenter/DevCenterAppContainer/components/AppInfoMessage/AppInfoMessage.js';
-import '../../../DevCenter/DevCenterAppContainer/components/DevCenterAppView/DevCenterAppView.js';
-import '../../../DevCenter/DevCenterAppContainer/components/DcFullscreenElemsCoordinatorProvider/DcFullscreenElemsCoordinatorProvider.js';
-import '../../../DevCenter/DevCenterAppContainer/components/DcFullscreenElemsCoordinatorProvider/IsInsideDcFullscreenElemProvider.js';
-import '../../../DevCenter/DevCenterAppContainer/components/IsInsideDcAppProvider/IsInsideDcAppProvider.js';
-import '../../../Modal/CorvaModal.js';
-import 'uuid';
-import '../../../IconMenu/index.js';
-import '../../../StyledMenuItem/index.js';
-import '../../../AppIcon/AppIcon.js';
-import '../../../DevCenter/AppHeader/AppHeader.js';
-import '../../../DevCenter/AppSideBar/AppSideBar.js';
-import '../../../DevCenter/AppsDataProvider/AppsDataProvider.js';
-import '@material-ui/icons';
-import 'moment-timezone';
-import '../../../Icons/AnnotationIcon.js';
-import '../../../Annotations/components/AnnotationsList/index.js';
-import '../../../Annotations/components/LastAnnotation/index.js';
-import '../../../Annotations/AnnotationsContext.js';
-import '../../../../utils/mobileDetect.js';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/regenerator';
-import 'querystring';
-import 'uuid/v1';
-import 'query-string';
-import '../../../../clients/api/apiCore.js';
-import '../../../../clients/constants.js';
-import '../../../../clients/subscriptions.js';
-import '../../../../constants/goals.js';
-import '../../../../constants/segment.js';
-import '../../../../constants/alerts.js';
-import '../../../../constants/apps.js';
-import '../../../../constants/completion.js';
-import '../../../../constants/notifications.js';
-import '../../../../constants/feed.js';
-import '../../../../constants/bha.js';
-import '../../../../utils/env.js';
-import '../../../GradientManager/configuration/constants.js';
-import 'jsona';
-import '../../../StatusBadge/constants.js';
-import '@babel/runtime/helpers/toConsumableArray';
-import 'lodash/set';
-import 'lodash/get';
-import 'lodash/unset';
-import 'moment';
-import '../../../HelpCenter/HelpCenterIcon.js';
-import '../../../DevCenter/AppContext.js';
-import '../../../DevCenter/DevCenterAppContainer/DevCenterAppContainer.css.js';
-import '../../../DevCenter/DevCenterAppContainer/components/RestoreAppSizeButton/index.js';
-import '../../../DevCenter/DevCenterAppContainer/components/PriorityMenus/PriorityMenus.css.js';
-import '../../../DevCenter/DevCenterRouterContext/DevCenterRouterContext.js';
-import '../../../DevCenter/DevCenterRouterContext/UniversalLink/UniversalLink.js';
-import 'react-router';
-import 'rollbar';
-import '@rollbar/react';
-import '../../../DevCenter/NavigationBar/NavigationBar.js';
-import '../../../DevCenter/SideBar/SideBar.js';
-import '../../../DevCenter/AppSettingsPopover/AppSettingsPopover.js';
-import '../../../DevCenter/AppFilterPanelLayout/AppFilterPanelLayout.js';
-import '../../../DevCenter/IsolatedDevCenterAppContainer/DevCenterIsolatedAppPage.js';
-import '../../../DevCenter/IsolatedDevCenterAppContainer/DevCenterIsolatedApp.js';
-import '../../../AssetEditor/index.js';
-import '../../../AssetEditorV2/index.js';
-import '../../../AppVersionsSelect/AppVersionsSelect.js';
-import '../../../LoadingIndicator/LoadingIndicator.js';
-import '../../../Typography.js';
-import '../../../RealTimeValuesSidebar/RealTimeSidebar.js';
-import '../../../CollapsableSidebar.js';
-import '../../../DateTimePicker/index.js';
-import '../../../DatePicker/index.js';
-import '../../../ErrorBoundary/ErrorBoundary.js';
-import '../../../ErrorBoundary/DevCenterAppErrorView/DevCenterAppErrorView.js';
-import '../../../SlateFormattedText/SlateFormattedText.js';
-import '../../../SlateFormattedText/RenderElements.js';
-import '@babel/runtime/helpers/typeof';
-import 'slate';
-import '../../../EmptyState/EmptyState.js';
-import '../../../ParameterCharts/ParameterCharts.js';
-import '../../../ParameterCharts/AddEditTrack.js';
-import '../../../ChartActionsList/ChartActionsList.js';
-import '../../../CopyToClipboard/CopyToClipboard.js';
-import '../../../AssetEditor/AssetEditorAutocomplete.js';
-import '../../../AssetEditor/SingleAssetEditor.js';
-import '../../../SettingEditors/ColorEditor/index.js';
-import '../../../SettingEditors/DropdownEditor/index.js';
-import '../../../SettingEditors/RadioEditor/index.js';
-import '../../../SwitchControl/index.js';
-import '../../../ColorPicker/ColorPicker.js';
-import '../../../Chart/components/ChartButton.js';
-import '../../../Chart/components/ChartButtons.js';
-import '../../../Chart/components/ChartWrapper.js';
-import '../../../Chart/components/AxisDropdown.js';
-import '../../../Chart/components/ChartSelect.js';
-import '../../../Chart/components/buttons/DragToZoomButton.js';
-import '../../../Chart/components/buttons/ZoomInButton.js';
-import '../../../Chart/components/buttons/ZoomOutButton.js';
-import '../../../Chart/components/buttons/PanButton.js';
-import '../../../Chart/components/buttons/ResetZoomButton.js';
-import '../../../Chart/components/buttons/HideAxesButton.js';
-import '../../../Chart/components/buttons/ChartTypeButton.js';
-import '../../../ColorPicker/PaletteChromePicker/PaletteChromePicker.js';
-import '../../../TruncatedText/index.js';
-import '../../../RangeSlider/RangeSlider.js';
-import '../../../AdvancedSlider/AdvancedSlider.js';
-import '../../../Breadcrumbs/index.js';
-import '../../../VirtualizedTable/index.js';
-import '../../../EmptyView/EmptyView.js';
-import '../../../EmptyView/EmptyAppView/EmptyAppView.js';
-import '../../../Button/index.js';
-import '../../../ContextMenuItem/index.js';
-import '../../../FolderMenuItem/index.js';
-import '../../../EditableItem/EditableItem/index.js';
-import '../../../EditableItem/EditableItemWithBadge/index.js';
-import '../../../Checkbox/index.js';
-import '../../../FolderMenuItemWithLinks/index.js';
-import '../../../IconButton/index.js';
-import '../../../TextField/index.js';
-import '../../../Chip/index.js';
-import '../../../Counter/index.js';
-import '../../../AnchorsList/AnchorsList.js';
-import '../../../Select/index.js';
-import '../../../Select/SelectFilterBy.js';
-import '../../../CustomSelect/index.js';
-import '../../../Tabs/Tabs.js';
-import '../../../Tabs/Tab.js';
-import '../../../ResizableTable/ResizableTable.js';
-import '@material-ui/icons/Check';
-import '@material-ui/icons/Close';
-import '@material-ui/icons/Edit';
-import '@material-ui/icons/Delete';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@material-ui/icons/AddCircle';
-import '../../../GradientManager/GradientPreview/GradientPreview.js';
-import '../../../GradientManager/GradientSelect.styles.js';
-import '../../../GradientPicker/GradientPicker.js';
-import '../../../GradientManager/GradientManager.styles.js';
-import '../../BHASchematic.js';
-import '../../BHATable/index.js';
-import ComponentIcon from '../../BHAComponentIcon.js';
-import '../../BHAComponentDetail/index.js';
-import '../../BHATileIcon.js';
-import '../../BHATile/BHATile.js';
-import '../../BHAList/BHAList.js';
-import '../BHAComponentsTable.js';
-import '../../../Casing/CasingTable/index.js';
-import '../../../Casing/CasingComponentIcon.js';
-import '../../../Casing/CasingTileIcon.js';
-import '../../../Casing/CasingTableV2/CasingTableV2.js';
-import '../../../Casing/CasingTile/CasingTile.js';
-import '../../../DisabledSettingsMessage/DisabledSettingsMessage.js';
-import '../../../WellSummary/WellSummaryItemLabel.js';
-import '../../../WellSummary/WellSummaryItemTitle.js';
-import '../../../WellSummary/WellSummaryItemValue.js';
-import '../../../WellSummary/ActivitySummaryChart.js';
-import '../../../WellSummary/FracWirelineTimeChart.js';
-import '../../../BICOffsetPickerDialog/index.js';
-import '../../../OffsetWellButton/OffsetWellButton.js';
-import '../../../OffsetWellPickerV2/OffsetWellPickerDialog.js';
-import '../../../OffsetWellPickerV3/index.js';
-import '../../../OffsetWellChips/Chip.js';
-import '../../../OffsetWellChips/ChipsContainer.js';
-import '../../../OffsetWellPickerV4/OffsetWellPickerV4.js';
-import '../../../OffsetWellMap/OffsetWellMap.js';
-import '@material-ui/core/Snackbar';
-import '../../../Notifications/Toast.js';
-import '../../../Toaster/Toaster.js';
-import '../../../ConfirmationDialog.js';
-import '../../../TextLink/index.js';
-import '../../../Avatar/index.js';
-import '../../../Template/TemplatePopover/index.js';
-import '../../../Template/TemplateSharingDialog/index.js';
-import '../../../MenuItem/index.js';
-import '../../../PadModeSelect/PadModeSelect.js';
-import '../../../PinnableFilters/PinnableFilters.js';
-import '../../../HeaderLayout/HeaderLayout.js';
-import '../../../PadOffsetsPicker/PadOffsetsPicker.js';
-import '../../../PadOffsetsPicker/OffsetAssetChip.js';
-import '../../../PadOffsetsPicker/OffsetAssetsListExpander.js';
-import '../../../PadOffsetsPicker/StagesSelector.js';
-import '../../../PadOffsetsPickerV2/PadOffsetsPickerV2.js';
-import '../../../Table/TableToolbar/TableToolbar.js';
-import '../../../Table/TableContainer/TableContainer.js';
-import '../../../Table/TableCell/TableCell.js';
-import '../../../Tooltip/ScrollableTooltip.js';
-import '../../../PriceInput/PriceInput.js';
-import '../../../LabelsCounter/LabelsCounter.js';
-import '../../../Stepper/Step.js';
-import '../../../Stepper/StepsWrapper.js';
-import '../../../Stepper/Stepper.js';
-import '../../../Comment/CommentIcon/index.js';
-import '../../../FilesLoader/FilesLoader.js';
-import '../../../FilesLoader/Icons/FileIcon.js';
-import '../../../SearchInput/index.js';
-import '../../../FeedItem/FeedItem.js';
-import '../../../FeedItem/FeedItemEditProvider/FeedItemEditProvider.js';
-import '../../../PostInput/PostInput.js';
-import '../../../KeyboardDateTimePicker.js';
-import '../../../AddComment/Popover.js';
-import '../../../AddComment/Popup.js';
-import '../../../StageDesignVActual/ComparisonBar/ComparisonBar.js';
-import '../../../StageDesignVActual/ElementsComparison/ElementsComparison.js';
-import '../../../StageDesignVActual/ComparisonHeader.js';
-import '../../../StageDesignVActual/ComparisonRow.js';
-import '../../../EmbeddedApp/DevCenterEmbeddedApp.js';
-import '../../../EmbeddedApp/EmbeddedApp.js';
-import '../../../Autocomplete/Autocomplete.js';
-import '../../../DocumentViewer/DocumentViewer.js';
-import '../../../ColorPickerPalette/ColorPickerPalette.js';
-import '../../../Search/Search.js';
-import '../../../Search/components/Listbox.js';
-import '../../../Search/components/Paper.js';
-import '../../../Search/components/RecentSearches.js';
-import '../../../Search/components/InputAdornmentLeft.js';
-import '../../../Search/components/Groups.js';
-import '../../../StatusBadge/index.js';
-import '../../../Attachment/index.js';
-import '../../../EmojiIconButton.js';
-import '../../../FileUploadIconButton.js';
-import '../../../FilePreview/index.js';
-import '../../../FailedFileUploading.js';
-import '../../../UserMention/index.js';
-import '../../../CommentsInfo/index.js';
-import '../../../CommentInput/index.js';
-import '../../../Comment/index.js';
-import '../../../CommentLoader.js';
-import '../../../AssetNameLabel/AssetStatusBadge.js';
-import '../../../AssetEditorV2/components/PrimaryAssetSelect.js';
-import '../../../AssetEditorV2/components/SecondaryAssetSelect.js';
-import '../../../AssetEditorV2/components/SelectItem.js';
-import '../../../AssetEditorV2/components/MultipleAssetsToggle.js';
-import './shared/CancelButton.js';
-import { ExpandCollapseButton } from './shared/ExpandCollapseButton.js';
-import { FormatedNumber } from './shared/FormatedNumber.js';
-import './shared/InputText.js';
-import { MoreButton } from './shared/MoreButton.js';
-import './shared/SaveButton.js';
-import './shared/SelectField.js';
-import { StaticField } from './shared/StaticField.js';
-import './shared/SharedEditorElements.js';
-import { ConfirmationPopup } from './shared/ConfirmationPopup.js';
-import { useStyles } from './sharedStyles.js';
-import { calculateComponent } from './utils/calculation.js';
-import AgitatorBrowser from './Agitator/Browser.js';
-import AgitatorEditor from './Agitator/Editor.js';
-import BitBrowser from './Bit/Browser.js';
-import BitEditor from './Bit/Editor.js';
-import DrillCollarBrowser from './DrillCollar/Browser.js';
-import DrillCollarEditor from './DrillCollar/Editor.js';
-import DrillPipeBrowser from './DrillPipe/Browser.js';
-import DrillPipeEditor from './DrillPipe/Editor.js';
-import JarBrowser from './Jar/Browser.js';
-import JarEditor from './Jar/Editor.js';
-import LwdBrowser from './Lwd/Browser.js';
-import LwdEditor from './Lwd/Editor.js';
-import MwdBrowser from './Mwd/Browser.js';
-import MwdEditor from './Mwd/Editor.js';
-import PdmBrowser from './Pdm/Browser.js';
-import PdmEditor from './Pdm/Editor.js';
-import RssBrowser from './Rss/Browser.js';
-import RssEditor from './Rss/Editor.js';
-import StabilizerBrowser from './Stabilizer/Browser.js';
-import StabilizerEditor from './Stabilizer/Editor.js';
-import SubBrowser from './Sub/Browser.js';
-import SubEditor from './Sub/Editor.js';
-import UrBrowser from './Ur/Browser.js';
-import UrEditor from './Ur/Editor.js';
-import EditComponentDialog from './EditComponentDialog.js';
-import { showErrorNotification } from '../../../../utils/notificationToasts.js';
-
-var _excluded = ["is_editing"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function getComponentName(family) {
-  var _COMPONENT_FAMILIES$d;
-  return ((_COMPONENT_FAMILIES$d = COMPONENT_FAMILIES.drilling.find(function (item) {
-    return item.type === family;
-  })) === null || _COMPONENT_FAMILIES$d === void 0 ? void 0 : _COMPONENT_FAMILIES$d.name) || '—';
-}
-function Component(_ref) {
-  var _classNames2;
-  var isMobile = _ref.isMobile,
-    viewColumnsPerRow = _ref.viewColumnsPerRow,
-    editColumnsPerRow = _ref.editColumnsPerRow,
-    component = _ref.component,
-    validate = _ref.validate,
-    isDraft = _ref.isDraft,
-    onCancel = _ref.onCancel,
-    onDelete = _ref.onDelete,
-    onSave = _ref.onSave,
-    onChangeEditing = _ref.onChangeEditing,
-    onAutocompleteApplied = _ref.onAutocompleteApplied,
-    isDragComponent = _ref.isDragComponent;
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    actionAnchorEl = _useState2[0],
-    setActionAnchorEl = _useState2[1];
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isOpenSaveConfirm = _useState4[0],
-    setIsOpenSaveConfirm = _useState4[1];
-  var _useState5 = useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    isOpenDeleteDialog = _useState6[0],
-    setIsOpenDeleteDialog = _useState6[1];
-  var _useState7 = useState(component),
-    _useState8 = _slicedToArray(_useState7, 2),
-    tempComponent = _useState8[0],
-    setTempComponent = _useState8[1];
-  var _useState9 = useState(null),
-    _useState10 = _slicedToArray(_useState9, 2),
-    error = _useState10[0],
-    setError = _useState10[1];
-  var _useState11 = useState(false),
-    _useState12 = _slicedToArray(_useState11, 2),
-    isOpenEditorDialog = _useState12[0],
-    setIsOpenEditorDialog = _useState12[1];
-  var classes = useStyles({
-    isMobile: isMobile,
-    isEditing: tempComponent.is_editing,
-    isDragComponent: isDragComponent
-  });
-  useEffect(function () {
-    if (onChangeEditing) onChangeEditing(tempComponent.is_editing);
-  }, [tempComponent.is_editing]);
-  var handleExpandCollapse = function handleExpandCollapse() {
-    setTempComponent(function (prev) {
-      return prev.is_expanded ? _objectSpread(_objectSpread({}, prev), {}, {
-        is_expanded: false
-      }) : _objectSpread(_objectSpread({}, prev), {}, {
-        is_expanded: true
-      });
-    });
-  };
-  var handleOpenActionMenu = function handleOpenActionMenu(e) {
-    setActionAnchorEl(e.currentTarget);
-  };
-  var handleCloseActionMenu = function handleCloseActionMenu() {
-    setActionAnchorEl(null);
-  };
-  var handleEdit = function handleEdit() {
-    setActionAnchorEl(null);
-    setTempComponent(function (prev) {
-      return _objectSpread(_objectSpread({}, prev), {}, {
-        is_editing: true
-      });
-    });
-  };
-  var handleConfirmDelete = function handleConfirmDelete() {
-    setActionAnchorEl(null);
-    setIsOpenDeleteDialog(true);
-  };
-  var handleDelete = function handleDelete() {
-    onDelete(component);
-  };
-  var handleCancel = function handleCancel() {
-    setError(null);
-    if (isDraft) {
-      onCancel();
-      return;
-    }
-    setTempComponent(component);
-  };
-  var handleChange = function handleChange(key, value) {
-    var newComponent = calculateComponent(tempComponent, key, value);
-    var result = validate(newComponent, isDraft);
-    setTempComponent(newComponent);
-    if (result) {
-      setError(result.components[tempComponent.id]);
-    } else {
-      setError(null);
-    }
-  };
-  var handleUseSuggestion = function handleUseSuggestion(suggestion) {
-    if (onAutocompleteApplied) {
-      onAutocompleteApplied(true);
-    }
-    setTempComponent(function (prev) {
-      return _objectSpread(_objectSpread({}, prev), suggestion);
-    });
-  };
-  var handleConfirmSave = function handleConfirmSave() {
-    var result = validate(tempComponent, isDraft);
-    if (result) {
-      setError(result.components[tempComponent.id]);
-
-      // TODO: handle global errors notification
-      var globalErros = _objectSpread(_objectSpread({}, omit(result, ['general', 'components', 'specificErrors'])), result.general);
-      if (globalErros && !isEmpty(globalErros)) {
-        map(globalErros, function (msg) {
-          showErrorNotification(msg);
-        });
-      }
-      return;
-    }
-    setError(null);
-    setIsOpenSaveConfirm(true);
-  };
-  var handleSave = function handleSave() {
-    setIsOpenSaveConfirm(false);
-    setIsOpenEditorDialog(false);
-    tempComponent.is_editing;
-      var saving = _objectWithoutProperties(tempComponent, _excluded);
-    setTempComponent(saving);
-    onSave(omit(saving, ['is_expanded']), isDraft);
-  };
-  var contentCellName = classNames(classes.cell, classes.ratioWidth, _defineProperty({}, classes.focusedFontsize, tempComponent.is_editing || tempComponent.is_expanded));
-  if (tempComponent.is_editing && !isOpenEditorDialog) {
-    var family = tempComponent.family;
-    var componentProps = {
-      component: tempComponent,
-      isDraft: isDraft,
-      error: error,
-      onChange: handleChange,
-      onUseSuggestion: handleUseSuggestion,
-      onCancel: handleCancel,
-      onSave: isMobile ? handleSave : handleConfirmSave,
-      columns: editColumnsPerRow
-    };
-    if (isMobile) {
-      setIsOpenEditorDialog(true);
-    } else {
-      return /*#__PURE__*/jsxs("div", {
-        className: classes.component,
-        children: [(family === 'dp' || family === 'hwdp') && /*#__PURE__*/jsx(DrillPipeEditor, _objectSpread({}, componentProps)), family === 'agitator' && /*#__PURE__*/jsx(AgitatorEditor, _objectSpread({}, componentProps)), family === 'bit' && /*#__PURE__*/jsx(BitEditor, _objectSpread({}, componentProps)), family === 'dc' && /*#__PURE__*/jsx(DrillCollarEditor, _objectSpread({}, componentProps)), family === 'jar' && /*#__PURE__*/jsx(JarEditor, _objectSpread({}, componentProps)), family === 'lwd' && /*#__PURE__*/jsx(LwdEditor, _objectSpread({}, componentProps)), family === 'mwd' && /*#__PURE__*/jsx(MwdEditor, _objectSpread({}, componentProps)), family === 'pdm' && /*#__PURE__*/jsx(PdmEditor, _objectSpread({}, componentProps)), family === 'rss' && /*#__PURE__*/jsx(RssEditor, _objectSpread({}, componentProps)), family === 'stabilizer' && /*#__PURE__*/jsx(StabilizerEditor, _objectSpread({}, componentProps)), family === 'sub' && /*#__PURE__*/jsx(SubEditor, _objectSpread({}, componentProps)), family === 'ur' && /*#__PURE__*/jsx(UrEditor, _objectSpread({}, componentProps)), isOpenSaveConfirm && /*#__PURE__*/jsx(ConfirmationPopup, {
-          title: "Save Changes?",
-          text: "You will not be able to recover it.",
-          okText: "Save",
-          handleClose: function handleClose() {
-            return setIsOpenSaveConfirm(false);
-          },
-          handleOk: handleSave
-        })]
-      });
-    }
-  }
-  return /*#__PURE__*/jsxs("div", {
-    className: classNames(classes.component, (_classNames2 = {}, _defineProperty(_classNames2, classes.componentMobile, isMobile), _defineProperty(_classNames2, classes.componentExpandedMobile, isMobile && tempComponent.is_expanded), _defineProperty(_classNames2, classes.componentActive, Boolean(actionAnchorEl)), _classNames2)),
-    children: [/*#__PURE__*/jsxs("div", {
-      className: classNames(classes.row, _defineProperty({}, classes.rowExpanded, isMobile && tempComponent.is_expanded)),
-      children: [/*#__PURE__*/jsx("div", {
-        className: classNames(classes.cell, _defineProperty({}, classes.componentMobileCell, isMobile)),
-        children: /*#__PURE__*/jsx(ComponentIcon, {
-          component: tempComponent
-        })
-      }), /*#__PURE__*/jsx("div", {
-        className: contentCellName,
-        children: getComponentName(tempComponent.family)
-      }), !isMobile && /*#__PURE__*/jsxs(Fragment, {
-        children: [/*#__PURE__*/jsx("div", {
-          className: contentCellName,
-          children: /*#__PURE__*/jsx(FormatedNumber, {
-            value: tempComponent.family === 'bit' ? tempComponent.size : tempComponent.outer_diameter
-          })
-        }), /*#__PURE__*/jsx("div", {
-          className: contentCellName,
-          children: /*#__PURE__*/jsx(FormatedNumber, {
-            value: tempComponent.inner_diameter
-          })
-        }), /*#__PURE__*/jsx("div", {
-          className: contentCellName,
-          children: /*#__PURE__*/jsx(FormatedNumber, {
-            value: tempComponent.linear_weight
-          })
-        }), /*#__PURE__*/jsx("div", {
-          className: contentCellName,
-          children: /*#__PURE__*/jsx(FormatedNumber, {
-            value: tempComponent.length,
-            format: "0.0"
-          })
-        })]
-      }), /*#__PURE__*/jsxs("div", {
-        className: classNames(classes.cell, classes.actionCell),
-        children: [/*#__PURE__*/jsx(ExpandCollapseButton, {
-          isExpanded: tempComponent.is_expanded,
-          classes: classes,
-          handleExpandCollapse: handleExpandCollapse
-        }), /*#__PURE__*/jsx(MoreButton, {
-          classes: classes,
-          handleOpenActionMenu: handleOpenActionMenu
-        })]
-      })]
-    }), tempComponent.is_expanded && /*#__PURE__*/jsxs(Fragment, {
-      children: [isMobile && /*#__PURE__*/jsxs(Grid, {
-        container: true,
-        spacing: 2,
-        style: {
-          padding: '8px 4px 16px'
-        },
-        children: [/*#__PURE__*/jsx(StaticField, {
-          label: tempComponent.family === 'bit' ? 'Bit Size' : 'OD',
-          unit: "shortLength",
-          value: tempComponent.family === 'bit' ? tempComponent.size : tempComponent.outer_diameter
-        }), tempComponent.family !== 'bit' && /*#__PURE__*/jsx(StaticField, {
-          label: "ID",
-          unit: "shortLength",
-          value: component.inner_diameter
-        }), tempComponent.family !== 'bit' && /*#__PURE__*/jsx(StaticField, {
-          label: "Linear Weight",
-          unit: "massPerLength",
-          value: component.linear_weight,
-          format: "0.0"
-        }), /*#__PURE__*/jsx(StaticField, {
-          label: "Length",
-          unit: "length",
-          value: component.length,
-          format: "0.0"
-        })]
-      }), (tempComponent.family === 'dp' || tempComponent.family === 'hwdp') && /*#__PURE__*/jsx(DrillPipeBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'agitator' && /*#__PURE__*/jsx(AgitatorBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'bit' && /*#__PURE__*/jsx(BitBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'dc' && /*#__PURE__*/jsx(DrillCollarBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'jar' && /*#__PURE__*/jsx(JarBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'lwd' && /*#__PURE__*/jsx(LwdBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'mwd' && /*#__PURE__*/jsx(MwdBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'pdm' && /*#__PURE__*/jsx(PdmBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'rss' && /*#__PURE__*/jsx(RssBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'stabilizer' && /*#__PURE__*/jsx(StabilizerBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'sub' && /*#__PURE__*/jsx(SubBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      }), tempComponent.family === 'ur' && /*#__PURE__*/jsx(UrBrowser, {
-        component: tempComponent,
-        columns: viewColumnsPerRow
-      })]
-    }), /*#__PURE__*/jsxs(Menu, {
-      anchorEl: actionAnchorEl,
-      keepMounted: true,
-      open: Boolean(actionAnchorEl),
-      getContentAnchorEl: null,
-      anchorOrigin: {
-        vertical: 'bottom',
-        horizontal: 'right'
-      },
-      transformOrigin: {
-        vertical: 'top',
-        horizontal: 'right'
-      },
-      onClose: handleCloseActionMenu,
-      children: [/*#__PURE__*/jsx(MenuItem, {
-        onClick: handleEdit,
-        className: classes.menuItem,
-        children: "Edit"
-      }), tempComponent.family !== 'bit' && /*#__PURE__*/jsx(MenuItem, {
-        onClick: handleConfirmDelete,
-        className: classes.menuItem,
-        children: "Delete"
-      })]
-    }), isOpenDeleteDialog && /*#__PURE__*/jsx(ConfirmationPopup, {
-      title: "Delete Component?",
-      text: "You will not be able to recover it.",
-      okText: "Delete",
-      handleClose: function handleClose() {
-        return setIsOpenDeleteDialog(false);
-      },
-      handleOk: handleDelete
-    }), isOpenEditorDialog && /*#__PURE__*/jsx(EditComponentDialog, {
-      component: tempComponent,
-      isDraft: isDraft,
-      error: error,
-      onChange: handleChange,
-      onUseSuggestion: handleUseSuggestion,
-      onCancel: handleCancel,
-      onSave: handleConfirmSave,
-      onClose: function onClose() {
-        handleCancel();
-        setIsOpenEditorDialog(false);
-      }
-    }), isMobile && isOpenSaveConfirm && /*#__PURE__*/jsx(ConfirmationPopup, {
-      title: "Save Changes?",
-      text: "You will not be able to recover it.",
-      okText: "Save",
-      handleClose: function handleClose() {
-        return setIsOpenSaveConfirm(false);
-      },
-      handleOk: handleSave
-    })]
-  });
-}
-Component.propTypes = {
-  isMobile: PropTypes.bool.isRequired,
-  component: PropTypes.shape({
-    family: PropTypes.string,
-    size: PropTypes.number,
-    outer_diameter: PropTypes.number,
-    inner_diameter: PropTypes.number,
-    linear_weight: PropTypes.number,
-    length: PropTypes.number
-  }).isRequired,
-  isDraft: PropTypes.bool,
-  validate: PropTypes.func.isRequired,
-  onCancel: PropTypes.func,
-  onDelete: PropTypes.func,
-  onSave: PropTypes.func.isRequired,
-  onChangeEditing: PropTypes.func,
-  viewColumnsPerRow: PropTypes.number.isRequired,
-  editColumnsPerRow: PropTypes.number.isRequired,
-  onAutocompleteApplied: PropTypes.func,
-  isDragComponent: PropTypes.bool.isRequired
-};
-Component.defaultProps = {
-  isDraft: false,
-  onCancel: null,
-  onDelete: null,
-  onChangeEditing: undefined,
-  onAutocompleteApplied: undefined
-};
-var Component$1 = memo(Component);
-
-export { Component$1 as default };
-//# sourceMappingURL=Component.js.map
+import e from"@babel/runtime/helpers/objectWithoutProperties";import t from"@babel/runtime/helpers/defineProperty";import o from"@babel/runtime/helpers/slicedToArray";import{memo as r,useState as i,useEffect as n}from"react";import s from"classnames";import{omit as p,isEmpty as m,map as a}from"lodash";import l from"prop-types";import{Grid as d,Menu as c,MenuItem as j}from"@material-ui/core";import"../../../../utils/index.js";import{COMPONENT_FAMILIES as u}from"../../../../constants/drillstring.js";import{jsxs as C,jsx as f,Fragment as b}from"react/jsx-runtime";import"../../../DevCenter/DevCenterAppContainer/components/AppActions/AppActions.css.js";import"../../../DevCenter/DevCenterAppContainer/components/AppSettingsDialog/AppSettingsDialog.js";import"../../../DevCenter/DevCenterAppContainer/components/AppSettingsDialogV2/AppSettingsDialog.js";import"../../../DevCenter/DevCenterAppContainer/components/AnnotationsButton/AnnotationsButton.js";import"../../../DevCenter/DevCenterAppContainer/components/NonPriorityMenus/NonPriorityMenus.js";import"../../../DevCenter/DevCenterAppContainer/components/FullscreenButton/FullscreenButton.js";import"../../../DevCenter/DevCenterAppContainer/components/AppInfoMessage/AppInfoMessage.js";import"../../../DevCenter/DevCenterAppContainer/components/DevCenterAppView/DevCenterAppView.js";import"../../../DevCenter/DevCenterAppContainer/components/DcFullscreenElemsCoordinatorProvider/DcFullscreenElemsCoordinatorProvider.js";import"../../../DevCenter/DevCenterAppContainer/components/DcFullscreenElemsCoordinatorProvider/IsInsideDcFullscreenElemProvider.js";import"../../../DevCenter/DevCenterAppContainer/components/IsInsideDcAppProvider/IsInsideDcAppProvider.js";import"../../../Modal/CorvaModal.js";import"uuid";import"../../../IconMenu/index.js";import"../../../StyledMenuItem/index.js";import"../../../AppIcon/AppIcon.js";import"../../../DevCenter/AppHeader/AppHeader.js";import"../../../DevCenter/AppSideBar/AppSideBar.js";import"../../../DevCenter/AppsDataProvider/AppsDataProvider.js";import"@material-ui/icons";import"../../../Icons/AnnotationIcon.js";import"../../../Annotations/components/AnnotationsList/index.js";import"../../../Annotations/components/LastAnnotation/index.js";import"../../../Annotations/AnnotationsContext.js";import"../../../../utils/mobileDetect.js";import"@babel/runtime/helpers/asyncToGenerator";import"@babel/runtime/regenerator";import"querystring";import"uuid/v1";import"../../../../clients/jsonApi/index.js";import"../../../../clients/subscriptions.js";import"../../../../constants/goals.js";import"../../../../constants/segment.js";import"../../../../constants/alerts.js";import"../../../../constants/apps.js";import"../../../../constants/completion.js";import"../../../../constants/notifications.js";import"../../../../constants/feed.js";import"../../../../constants/bha.js";import"../../../../utils/env.js";import"../../../GradientManager/configuration/constants.js";import"jsona";import"../../../StatusBadge/constants.js";import"@babel/runtime/helpers/toConsumableArray";import"lodash/set";import"lodash/get";import"lodash/unset";import"moment";import"../../../../clients/api/apiCore.js";import"../../../../clients/constants.js";import"../../../HelpCenter/HelpCenterIcon.js";import"../../../DevCenter/AppContext.js";import"../../../DevCenter/DevCenterAppContainer/DevCenterAppContainer.css.js";import"../../../DevCenter/DevCenterAppContainer/components/RestoreAppSizeButton/index.js";import"../../../DevCenter/DevCenterAppContainer/components/PriorityMenus/PriorityMenus.css.js";import"../../../DevCenter/DevCenterRouterContext/DevCenterRouterContext.js";import"../../../DevCenter/DevCenterRouterContext/UniversalLink/UniversalLink.js";import"react-router";import"rollbar";import"@rollbar/react";import"../../../DevCenter/NavigationBar/NavigationBar.js";import"../../../DevCenter/SideBar/SideBar.js";import"../../../DevCenter/AppSettingsPopover/AppSettingsPopover.js";import"../../../DevCenter/AppFilterPanelLayout/AppFilterPanelLayout.js";import"../../../DevCenter/IsolatedDevCenterAppContainer/DevCenterIsolatedAppPage.js";import"../../../DevCenter/IsolatedDevCenterAppContainer/DevCenterIsolatedApp.js";import"../../../AssetEditor/index.js";import"../../../AssetEditorV2/index.js";import"../../../AppVersionsSelect/AppVersionsSelect.js";import"../../../LoadingIndicator/LoadingIndicator.js";import"../../../Typography.js";import"../../../RealTimeValuesSidebar/RealTimeSidebar.js";import"../../../CollapsableSidebar.js";import"../../../DateTimePicker/index.js";import"../../../DatePicker/index.js";import"../../../ErrorBoundary/ErrorBoundary.js";import"../../../ErrorBoundary/DevCenterAppErrorView/DevCenterAppErrorView.js";import"../../../SlateFormattedText/SlateFormattedText.js";import"../../../SlateFormattedText/RenderElements.js";import"@babel/runtime/helpers/typeof";import"slate";import"../../../EmptyState/EmptyState.js";import"../../../ParameterCharts/ParameterCharts.js";import"../../../ParameterCharts/AddEditTrack.js";import"../../../ChartActionsList/ChartActionsList.js";import"../../../CopyToClipboard/CopyToClipboard.js";import"../../../AssetEditor/AssetEditorAutocomplete.js";import"../../../AssetEditor/SingleAssetEditor.js";import"../../../SettingEditors/ColorEditor/index.js";import"../../../SettingEditors/DropdownEditor/index.js";import"../../../SettingEditors/RadioEditor/index.js";import"../../../SwitchControl/index.js";import"../../../ColorPicker/ColorPicker.js";import"../../../Chart/components/ChartButton.js";import"../../../Chart/components/ChartButtons.js";import"../../../Chart/components/ChartWrapper.js";import"../../../Chart/components/AxisDropdown.js";import"../../../Chart/components/ChartSelect.js";import"../../../Chart/components/buttons/DragToZoomButton.js";import"../../../Chart/components/buttons/ZoomInButton.js";import"../../../Chart/components/buttons/ZoomOutButton.js";import"../../../Chart/components/buttons/PanButton.js";import"../../../Chart/components/buttons/ResetZoomButton.js";import"../../../Chart/components/buttons/HideAxesButton.js";import"../../../Chart/components/buttons/ChartTypeButton.js";import"../../../ColorPicker/PaletteChromePicker/PaletteChromePicker.js";import"../../../TruncatedText/index.js";import"../../../RangeSlider/RangeSlider.js";import"../../../AdvancedSlider/AdvancedSlider.js";import"../../../Breadcrumbs/index.js";import"../../../VirtualizedTable/index.js";import"../../../EmptyView/EmptyView.js";import"../../../EmptyView/EmptyAppView/EmptyAppView.js";import"../../../Button/index.js";import"../../../ContextMenuItem/index.js";import"../../../FolderMenuItem/index.js";import"../../../EditableItem/EditableItem/index.js";import"../../../EditableItem/EditableItemWithBadge/index.js";import"../../../Checkbox/index.js";import"../../../FolderMenuItemWithLinks/index.js";import"../../../IconButton/index.js";import"../../../TextField/index.js";import"../../../Chip/index.js";import"../../../Counter/index.js";import"../../../AnchorsList/AnchorsList.js";import"../../../Select/index.js";import"../../../Select/SelectFilterBy.js";import"../../../CustomSelect/index.js";import"../../../Tabs/Tabs.js";import"../../../Tabs/Tab.js";import"../../../ResizableTable/ResizableTable.js";import"@material-ui/icons/Check";import"@material-ui/icons/Close";import"@material-ui/icons/Edit";import"@material-ui/icons/Delete";import"../../../GradientManager/GradientList.js";import"@material-ui/icons/AddCircle";import"../../../GradientManager/GradientPreview/GradientPreview.js";import"../../../GradientManager/GradientSelect.styles.js";import"../../../GradientPicker/GradientPicker.js";import"../../../GradientManager/GradientManager.styles.js";import"../../BHASchematic.js";import"../../BHATable/index.js";import g from"../../BHAComponentIcon.js";import"../../BHAComponentDetail/index.js";import"../../BHATileIcon.js";import"../../BHATile/BHATile.js";import"../../BHAList/BHAList.js";import"../BHAComponentsTable.js";import"../../../Casing/CasingTable/index.js";import"../../../Casing/CasingComponentIcon.js";import"../../../Casing/CasingTileIcon.js";import"../../../Casing/CasingTableV2/CasingTableV2.js";import"../../../Casing/CasingTile/CasingTile.js";import"../../../DisabledSettingsMessage/DisabledSettingsMessage.js";import"../../../WellSummary/WellSummaryItemLabel.js";import"../../../WellSummary/WellSummaryItemTitle.js";import"../../../WellSummary/WellSummaryItemValue.js";import"../../../WellSummary/ActivitySummaryChart.js";import"../../../WellSummary/FracWirelineTimeChart.js";import"../../../BICOffsetPickerDialog/index.js";import"../../../OffsetWellButton/OffsetWellButton.js";import"../../../OffsetWellPickerV2/OffsetWellPickerDialog.js";import"../../../OffsetWellPickerV3/index.js";import"../../../OffsetWellChips/Chip.js";import"../../../OffsetWellChips/ChipsContainer.js";import"../../../OffsetWellPickerV4/OffsetWellPickerV4.js";import"../../../OffsetWellMap/OffsetWellMap.js";import"@material-ui/core/Snackbar";import"../../../Notifications/Toast.js";import"../../../Toaster/Toaster.js";import"../../../ConfirmationDialog.js";import"../../../TextLink/index.js";import"../../../Avatar/index.js";import"../../../Template/TemplatePopover/index.js";import"../../../Template/TemplateSharingDialog/index.js";import"../../../MenuItem/index.js";import"../../../PadModeSelect/PadModeSelect.js";import"../../../PinnableFilters/PinnableFilters.js";import"../../../HeaderLayout/HeaderLayout.js";import"../../../PadOffsetsPicker/PadOffsetsPicker.js";import"../../../PadOffsetsPicker/OffsetAssetChip.js";import"../../../PadOffsetsPicker/OffsetAssetsListExpander.js";import"../../../PadOffsetsPicker/StagesSelector.js";import"../../../PadOffsetsPickerV2/PadOffsetsPickerV2.js";import"../../../Table/TableToolbar/TableToolbar.js";import"../../../Table/TableContainer/TableContainer.js";import"../../../Table/TableCell/TableCell.js";import"../../../Tooltip/ScrollableTooltip.js";import"../../../PriceInput/PriceInput.js";import"../../../LabelsCounter/LabelsCounter.js";import"../../../Stepper/Step.js";import"../../../Stepper/StepsWrapper.js";import"../../../Stepper/Stepper.js";import"../../../Comment/CommentIcon/index.js";import"../../../FilesLoader/FilesLoader.js";import"../../../FilesLoader/Icons/FileIcon.js";import"../../../SearchInput/index.js";import"../../../FeedItem/FeedItem.js";import"../../../FeedItem/FeedItemEditProvider/FeedItemEditProvider.js";import"../../../PostInput/PostInput.js";import"../../../KeyboardDateTimePicker.js";import"../../../AddComment/Popover.js";import"../../../AddComment/Popup.js";import"../../../StageDesignVActual/ComparisonBar/ComparisonBar.js";import"../../../StageDesignVActual/ElementsComparison/ElementsComparison.js";import"../../../StageDesignVActual/ComparisonHeader.js";import"../../../StageDesignVActual/ComparisonRow.js";import"../../../EmbeddedApp/DevCenterEmbeddedApp.js";import"../../../EmbeddedApp/EmbeddedApp.js";import"../../../Autocomplete/Autocomplete.js";import"../../../DocumentViewer/DocumentViewer.js";import"../../../ColorPickerPalette/ColorPickerPalette.js";import"../../../Search/Search.js";import"../../../Search/components/Listbox.js";import"../../../Search/components/Paper.js";import"../../../Search/components/RecentSearches.js";import"../../../Search/components/InputAdornmentLeft.js";import"../../../Search/components/Groups.js";import"../../../StatusBadge/index.js";import"../../../Attachment/index.js";import"../../../EmojiIconButton.js";import"../../../FileUploadIconButton.js";import"../../../FilePreview/index.js";import"../../../FailedFileUploading.js";import"../../../UserMention/index.js";import"../../../CommentsInfo/index.js";import"../../../CommentInput/index.js";import"../../../Comment/index.js";import"../../../CommentLoader.js";import"../../../AssetNameLabel/AssetStatusBadge.js";import"../../../AssetEditorV2/components/PrimaryAssetSelect.js";import"../../../AssetEditorV2/components/SecondaryAssetSelect.js";import"../../../AssetEditorV2/components/SelectItem.js";import"../../../AssetEditorV2/components/MultipleAssetsToggle.js";import"./shared/CancelButton.js";import{ExpandCollapseButton as h}from"./shared/ExpandCollapseButton.js";import{FormatedNumber as v}from"./shared/FormatedNumber.js";import"./shared/InputText.js";import{MoreButton as A}from"./shared/MoreButton.js";import"./shared/SaveButton.js";import"./shared/SelectField.js";import{StaticField as D}from"./shared/StaticField.js";import"./shared/SharedEditorElements.js";import{ConfirmationPopup as S}from"./shared/ConfirmationPopup.js";import{useStyles as P}from"./sharedStyles.js";import{calculateComponent as x}from"./utils/calculation.js";import y from"./Agitator/Browser.js";import E from"./Agitator/Editor.js";import B from"./Bit/Browser.js";import T from"./Bit/Editor.js";import I from"./DrillCollar/Browser.js";import w from"./DrillCollar/Editor.js";import O from"./DrillPipe/Browser.js";import k from"./DrillPipe/Editor.js";import M from"./Jar/Browser.js";import L from"./Jar/Editor.js";import F from"./Lwd/Browser.js";import V from"./Lwd/Editor.js";import R from"./Mwd/Browser.js";import W from"./Mwd/Editor.js";import _ from"./Pdm/Browser.js";import N from"./Pdm/Editor.js";import H from"./Rss/Browser.js";import z from"./Rss/Editor.js";import G from"./Stabilizer/Browser.js";import U from"./Stabilizer/Editor.js";import q from"./Sub/Browser.js";import Z from"./Sub/Editor.js";import Y from"./Ur/Browser.js";import J from"./Ur/Editor.js";import K from"./EditComponentDialog.js";import{showErrorNotification as Q}from"../../../../utils/notificationToasts.js";var X=["is_editing"];function $(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),o.push.apply(o,r)}return o}function ee(e){for(var o=1;o<arguments.length;o++){var r=null!=arguments[o]?arguments[o]:{};o%2?$(Object(r),!0).forEach((function(o){t(e,o,r[o])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):$(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function te(e){var t;return(null===(t=u.drilling.find((function(t){return t.type===e})))||void 0===t?void 0:t.name)||"—"}function oe(r){var l,u=r.isMobile,$=r.viewColumnsPerRow,oe=r.editColumnsPerRow,re=r.component,ie=r.validate,ne=r.isDraft,se=r.onCancel,pe=r.onDelete,me=r.onSave,ae=r.onChangeEditing,le=r.onAutocompleteApplied,de=r.isDragComponent,ce=i(null),je=o(ce,2),ue=je[0],Ce=je[1],fe=i(!1),be=o(fe,2),ge=be[0],he=be[1],ve=i(!1),Ae=o(ve,2),De=Ae[0],Se=Ae[1],Pe=i(re),xe=o(Pe,2),ye=xe[0],Ee=xe[1],Be=i(null),Te=o(Be,2),Ie=Te[0],we=Te[1],Oe=i(!1),ke=o(Oe,2),Me=ke[0],Le=ke[1],Fe=P({isMobile:u,isEditing:ye.is_editing,isDragComponent:de});n((function(){ae&&ae(ye.is_editing)}),[ye.is_editing]);var Ve=function(){we(null),ne?se():Ee(re)},Re=function(e,t){var o=x(ye,e,t),r=ie(o,ne);Ee(o),we(r?r.components[ye.id]:null)},We=function(e){le&&le(!0),Ee((function(t){return ee(ee({},t),e)}))},_e=function(){var e=ie(ye,ne);if(e){we(e.components[ye.id]);var t=ee(ee({},p(e,["general","components","specificErrors"])),e.general);t&&!m(t)&&a(t,(function(e){Q(e)}))}else we(null),he(!0)},Ne=function(){he(!1),Le(!1),ye.is_editing;var t=e(ye,X);Ee(t),me(p(t,["is_expanded"]),ne)},He=s(Fe.cell,Fe.ratioWidth,t({},Fe.focusedFontsize,ye.is_editing||ye.is_expanded));if(ye.is_editing&&!Me){var ze=ye.family,Ge={component:ye,isDraft:ne,error:Ie,onChange:Re,onUseSuggestion:We,onCancel:Ve,onSave:u?Ne:_e,columns:oe};if(!u)return C("div",{className:Fe.component,children:[("dp"===ze||"hwdp"===ze)&&f(k,ee({},Ge)),"agitator"===ze&&f(E,ee({},Ge)),"bit"===ze&&f(T,ee({},Ge)),"dc"===ze&&f(w,ee({},Ge)),"jar"===ze&&f(L,ee({},Ge)),"lwd"===ze&&f(V,ee({},Ge)),"mwd"===ze&&f(W,ee({},Ge)),"pdm"===ze&&f(N,ee({},Ge)),"rss"===ze&&f(z,ee({},Ge)),"stabilizer"===ze&&f(U,ee({},Ge)),"sub"===ze&&f(Z,ee({},Ge)),"ur"===ze&&f(J,ee({},Ge)),ge&&f(S,{title:"Save Changes?",text:"You will not be able to recover it.",okText:"Save",handleClose:function(){return he(!1)},handleOk:Ne})]});Le(!0)}return C("div",{className:s(Fe.component,(l={},t(l,Fe.componentMobile,u),t(l,Fe.componentExpandedMobile,u&&ye.is_expanded),t(l,Fe.componentActive,Boolean(ue)),l)),children:[C("div",{className:s(Fe.row,t({},Fe.rowExpanded,u&&ye.is_expanded)),children:[f("div",{className:s(Fe.cell,t({},Fe.componentMobileCell,u)),children:f(g,{component:ye})}),f("div",{className:He,children:te(ye.family)}),!u&&C(b,{children:[f("div",{className:He,children:f(v,{value:"bit"===ye.family?ye.size:ye.outer_diameter})}),f("div",{className:He,children:f(v,{value:ye.inner_diameter})}),f("div",{className:He,children:f(v,{value:ye.linear_weight})}),f("div",{className:He,children:f(v,{value:ye.length,format:"0.0"})})]}),C("div",{className:s(Fe.cell,Fe.actionCell),children:[f(h,{isExpanded:ye.is_expanded,classes:Fe,handleExpandCollapse:function(){Ee((function(e){return e.is_expanded?ee(ee({},e),{},{is_expanded:!1}):ee(ee({},e),{},{is_expanded:!0})}))}}),f(A,{classes:Fe,handleOpenActionMenu:function(e){Ce(e.currentTarget)}})]})]}),ye.is_expanded&&C(b,{children:[u&&C(d,{container:!0,spacing:2,style:{padding:"8px 4px 16px"},children:[f(D,{label:"bit"===ye.family?"Bit Size":"OD",unit:"shortLength",value:"bit"===ye.family?ye.size:ye.outer_diameter}),"bit"!==ye.family&&f(D,{label:"ID",unit:"shortLength",value:re.inner_diameter}),"bit"!==ye.family&&f(D,{label:"Linear Weight",unit:"massPerLength",value:re.linear_weight,format:"0.0"}),f(D,{label:"Length",unit:"length",value:re.length,format:"0.0"})]}),("dp"===ye.family||"hwdp"===ye.family)&&f(O,{component:ye,columns:$}),"agitator"===ye.family&&f(y,{component:ye,columns:$}),"bit"===ye.family&&f(B,{component:ye,columns:$}),"dc"===ye.family&&f(I,{component:ye,columns:$}),"jar"===ye.family&&f(M,{component:ye,columns:$}),"lwd"===ye.family&&f(F,{component:ye,columns:$}),"mwd"===ye.family&&f(R,{component:ye,columns:$}),"pdm"===ye.family&&f(_,{component:ye,columns:$}),"rss"===ye.family&&f(H,{component:ye,columns:$}),"stabilizer"===ye.family&&f(G,{component:ye,columns:$}),"sub"===ye.family&&f(q,{component:ye,columns:$}),"ur"===ye.family&&f(Y,{component:ye,columns:$})]}),C(c,{anchorEl:ue,keepMounted:!0,open:Boolean(ue),getContentAnchorEl:null,anchorOrigin:{vertical:"bottom",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},onClose:function(){Ce(null)},children:[f(j,{onClick:function(){Ce(null),Ee((function(e){return ee(ee({},e),{},{is_editing:!0})}))},className:Fe.menuItem,children:"Edit"}),"bit"!==ye.family&&f(j,{onClick:function(){Ce(null),Se(!0)},className:Fe.menuItem,children:"Delete"})]}),De&&f(S,{title:"Delete Component?",text:"You will not be able to recover it.",okText:"Delete",handleClose:function(){return Se(!1)},handleOk:function(){pe(re)}}),Me&&f(K,{component:ye,isDraft:ne,error:Ie,onChange:Re,onUseSuggestion:We,onCancel:Ve,onSave:_e,onClose:function(){Ve(),Le(!1)}}),u&&ge&&f(S,{title:"Save Changes?",text:"You will not be able to recover it.",okText:"Save",handleClose:function(){return he(!1)},handleOk:Ne})]})}oe.propTypes={isMobile:l.bool.isRequired,component:l.shape({family:l.string,size:l.number,outer_diameter:l.number,inner_diameter:l.number,linear_weight:l.number,length:l.number}).isRequired,isDraft:l.bool,validate:l.func.isRequired,onCancel:l.func,onDelete:l.func,onSave:l.func.isRequired,onChangeEditing:l.func,viewColumnsPerRow:l.number.isRequired,editColumnsPerRow:l.number.isRequired,onAutocompleteApplied:l.func,isDragComponent:l.bool.isRequired},oe.defaultProps={isDraft:!1,onCancel:null,onDelete:null,onChangeEditing:void 0,onAutocompleteApplied:void 0};var re=r(oe);export{re as default};