"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.TagListItemEditable = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireDefault(require("react"));
var _designSystem = require("@wix/design-system");
var _TagItemEditable = require("../TagItemEditable");
var _ActionModal = require("../../../../ActionModal");
var _Trans = require("../../../../Trans");
var _mobxReactLite = require("mobx-react-lite");
var _bexCore = require("@wix/bex-core");
var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/Tags/ManageTags/ManageTagsModal/List/TagListItemEditable.tsx";
const _TagListItemEditable = ({
  state,
  tag,
  isLastTag
}) => {
  const onCancel = () => {
    state.handleCancelEditCtaClick();
  };
  const onApprove = async newName => {
    await state.updateTag({
      tag,
      newName,
      isLastTag
    });
  };
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_TagItemEditable.TagItemEditable, {
    tagName: tag.name,
    isLastTag: isLastTag,
    errorMessage: state.editedTagErrorMessage,
    onApprove: onApprove,
    onCancel: onCancel,
    maxLength: _bexCore.TAG_MAX_LENGTH,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 32,
      columnNumber: 7
    }
  }), state.confirmModalState.value && /*#__PURE__*/_react.default.createElement(_ActionModal.MessageActionModal, (0, _extends2.default)({
    dataHook: "manage-tags-modal-confirm-delete-modal",
    state: state.confirmModalState,
    content: /*#__PURE__*/_react.default.createElement(_Trans.Trans, {
      i18nKey: "cairo.tags.manageTags.modal.deleteModal.body",
      values: {
        name: tag.name
      },
      components: {
        text: /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
          __self: void 0,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 50,
            columnNumber: 23
          }
        }),
        name: /*#__PURE__*/_react.default.createElement(_designSystem.Text, {
          weight: "bold",
          __self: void 0,
          __source: {
            fileName: _jsxFileName,
            lineNumber: 51,
            columnNumber: 23
          }
        })
      },
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 46,
        columnNumber: 13
      }
    })
  }, state.confirmModalState.value, {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 42,
      columnNumber: 9
    }
  })));
};
const TagListItemEditable = exports.TagListItemEditable = (0, _mobxReactLite.observer)(_TagListItemEditable);
//# sourceMappingURL=TagListItemEditable.js.map