'use strict';

var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var React = require('react');
var classnames = require('classnames');
var neetoCist = require('@bigbinary/neeto-cist');
var useOnClickOutside = require('@bigbinary/neeto-commons-frontend/v2/react-utils/useOnClickOutside');
var useStateWithDependency = require('@bigbinary/neeto-commons-frontend/v2/react-utils/useStateWithDependency');
var ramda = require('ramda');
var neetoAtoms = require('@bigbinary/neeto-atoms');
var general = require('@bigbinary/neeto-commons-frontend/v2/utils/general');
var useHotkeys = require('@bigbinary/neeto-hotkeys');
var jsxRuntime = require('react/jsx-runtime');
var check = require('../check-VgZf0qTr.js');
var x = require('../x-B38UX0_0.js');
var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
var reactUtils = require('@bigbinary/neeto-commons-frontend/v2/react-utils');
var v2_MoreDropdown = require('./MoreDropdown.js');
var v2_Breadcrumbs = require('./Breadcrumbs.js');
require('../createLucideIcon-DBDhE7kE.js');
require('@babel/runtime/helpers/objectWithoutProperties');
require('react-i18next');
require('../ellipsis-BcfLTtl5.js');
require('@bigbinary/neeto-atoms/primitives');
require('react-router-dom');

var mergeRefs = function mergeRefs() {
  for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
    refs[_key] = arguments[_key];
  }
  return function (node) {
    return refs.forEach(function (ref) {
      return typeof ref === "function" ? ref(node) : ref.current = node;
    });
  };
};

function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var Editor = function Editor(_ref) {
  var placeholder = _ref.placeholder,
    allowEmptySubmission = _ref.allowEmptySubmission,
    name = _ref.name,
    isLoading = _ref.isLoading,
    handleRename = _ref.handleRename,
    submitButtonProps = _ref.submitButtonProps,
    handleClose = _ref.handleClose,
    cancelButtonProps = _ref.cancelButtonProps,
    setName = _ref.setName,
    inputProps = _ref.inputProps,
    editMode = _ref.editMode;
  var inputRef = React.useRef();
  var wrapperRef = React.useRef();
  var closeRef = useHotkeys("escape", function (event) {
    return handleClose({
      event: event
    });
  }, {
    mode: "scoped",
    enabled: editMode
  });
  var submitRef = useHotkeys(["command+return", "return"], function (event) {
    if (ramda.isEmpty(name) && !allowEmptySubmission) return;
    handleRename(event, name);
  }, {
    mode: "scoped",
    enabled: editMode
  });
  React.useLayoutEffect(function () {
    var _wrapperRef$current;
    var inputElement = (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : _wrapperRef$current.querySelector("input");
    mergeRefs(closeRef, submitRef, inputRef)(inputElement);
  });
  React.useEffect(function () {
    var _inputRef$current;
    (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.select();
  }, []);
  return /*#__PURE__*/jsxRuntime.jsxs("div", {
    className: "relative flex max-w-full min-w-0 flex-grow",
    ref: wrapperRef,
    children: [/*#__PURE__*/jsxRuntime.jsx("span", {
      className: "invisible me-[4.25rem] inline-flex min-h-[2.125rem] max-w-full min-w-[7.5rem] cursor-pointer overflow-hidden rounded border border-transparent px-2 py-2 text-sm leading-tight font-semibold whitespace-nowrap",
      children: name.replace(/\s/g, ".") || placeholder
    }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Input, _objectSpread$3(_objectSpread$3({
      placeholder: placeholder,
      autoFocus: true,
      className: "absolute inset-0 w-full",
      "data-testid": "form-rename-text-field",
      value: name,
      suffix: /*#__PURE__*/jsxRuntime.jsxs("div", {
        className: "flex items-center justify-end",
        children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, _objectSpread$3({
          "data-testid": "form-rename-submit-button",
          disabled: !allowEmptySubmission && ramda.isEmpty(name) || isLoading,
          icon: check.Check,
          loading: isLoading,
          size: "icon-sm",
          variant: "ghost",
          onClick: function onClick(event) {
            return handleRename(event, name);
          }
        }, submitButtonProps)), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, _objectSpread$3({
          "data-testid": "form-rename-close-button",
          disabled: isLoading,
          icon: x.X,
          size: "icon-sm",
          variant: "ghost",
          onClick: function onClick(event) {
            return handleClose({
              event: event
            });
          }
        }, cancelButtonProps))]
      }),
      onChange: general.withEventTargetValue(setName),
      onClick: function onClick(event) {
        return event.stopPropagation();
      }
    }, inputProps), {}, {
      label: null
    }))]
  });
};

function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var RenameMenu = reactUtils.withT(function (_ref) {
  var t = _ref.t,
    handleRenameClick = _ref.handleRenameClick,
    disabled = _ref.disabled,
    dropdownItems = _ref.dropdownItems,
    onArchiveStatusToggle = _ref.onArchiveStatusToggle,
    onDisableStatusToggle = _ref.onDisableStatusToggle,
    onClone = _ref.onClone,
    onDelete = _ref.onDelete,
    isArchived = _ref.isArchived,
    isDisabled = _ref.isDisabled,
    dropdownButtonProps = _ref.dropdownButtonProps,
    dropdownProps = _ref.dropdownProps;
  return /*#__PURE__*/jsxRuntime.jsx(v2_MoreDropdown, {
    dropdownButtonProps: _objectSpread$2({
      "data-testid": "neeto-molecules-menu-button"
    }, dropdownButtonProps),
    dropdownProps: _objectSpread$2({
      position: "bottom-start",
      onClick: function onClick(event) {
        return event.stopPropagation();
      }
    }, dropdownProps),
    menuItems: [{
      "data-testid": "form-rename-button",
      onClick: handleRenameClick,
      label: t("neetoMolecules.common.actions.rename"),
      isVisible: !disabled,
      key: "edit-name-menu"
    }, {
      "data-testid": "form-clone-button",
      onClick: onClone,
      label: t("neetoMolecules.common.actions.clone"),
      isVisible: neetoCist.isPresent(onClone),
      key: "clone-entity-menu"
    }, {
      "data-testid": "form-archive-button",
      onClick: onArchiveStatusToggle,
      label: isArchived ? t("neetoMolecules.common.actions.unArchive") : t("neetoMolecules.common.actions.archive"),
      isVisible: neetoCist.isPresent(onArchiveStatusToggle),
      key: "archive-entity-menu"
    }, {
      "data-testid": "form-enable-button",
      onClick: onDisableStatusToggle,
      label: isDisabled ? t("neetoMolecules.common.actions.enable") : t("neetoMolecules.common.actions.disable"),
      isVisible: neetoCist.isPresent(onDisableStatusToggle),
      key: "enable-entity-menu"
    }, {
      "data-testid": "form-delete-button",
      onClick: onDelete,
      label: t("neetoMolecules.common.actions.delete"),
      isVisible: neetoCist.isPresent(onDelete),
      key: "delete-entity-menu"
    }].concat(_toConsumableArray(dropdownItems))
  });
});

function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var ViewName = function ViewName(_ref) {
  var disabled = _ref.disabled,
    textProps = _ref.textProps,
    formatText = _ref.formatText,
    handleRenameClick = _ref.handleRenameClick,
    name = _ref.name;
  return /*#__PURE__*/jsxRuntime.jsx("p", _objectSpread$1(_objectSpread$1({
    "data-testid": "form-title",
    className: classnames("neeto-molecules-rename__text neeto-molecules-rename__display-text bg-card hover:border-input text-foreground flex h-[2.125rem] w-full max-w-md items-center truncate rounded border border-transparent px-2 text-sm leading-tight font-semibold transition", {
      "cursor-pointer": !disabled,
      "pointer-events-none cursor-text": disabled
    }),
    onClick: handleRenameClick
  }, textProps), {}, {
    children: typeof formatText === "function" ? formatText(name) : name
  }));
};

function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var Rename = function Rename(_ref) {
  var value = _ref.value,
    onRename = _ref.onRename,
    onClone = _ref.onClone,
    onArchiveStatusToggle = _ref.onArchiveStatusToggle,
    onDisableStatusToggle = _ref.onDisableStatusToggle,
    onDelete = _ref.onDelete,
    isArchived = _ref.isArchived,
    isDisabled = _ref.isDisabled,
    _ref$isOpen = _ref.isOpen,
    isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
    _ref$isLoading = _ref.isLoading,
    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
    _ref$placeholder = _ref.placeholder,
    placeholder = _ref$placeholder === void 0 ? "" : _ref$placeholder,
    _ref$hideMenu = _ref.hideMenu,
    hideMenu = _ref$hideMenu === void 0 ? false : _ref$hideMenu,
    _ref$disabled = _ref.disabled,
    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
    _ref$dropdownItems = _ref.dropdownItems,
    dropdownItems = _ref$dropdownItems === void 0 ? [] : _ref$dropdownItems,
    _ref$breadcrumbs = _ref.breadcrumbs,
    breadcrumbs = _ref$breadcrumbs === void 0 ? [] : _ref$breadcrumbs,
    _ref$textProps = _ref.textProps,
    textProps = _ref$textProps === void 0 ? {} : _ref$textProps,
    _ref$inputProps = _ref.inputProps,
    inputProps = _ref$inputProps === void 0 ? {} : _ref$inputProps,
    _ref$submitButtonProp = _ref.submitButtonProps,
    submitButtonProps = _ref$submitButtonProp === void 0 ? {} : _ref$submitButtonProp,
    _ref$cancelButtonProp = _ref.cancelButtonProps,
    cancelButtonProps = _ref$cancelButtonProp === void 0 ? {} : _ref$cancelButtonProp,
    _ref$className = _ref.className,
    className = _ref$className === void 0 ? "" : _ref$className,
    _ref$allowEmptySubmis = _ref.allowEmptySubmission,
    allowEmptySubmission = _ref$allowEmptySubmis === void 0 ? false : _ref$allowEmptySubmis,
    _ref$defaultName = _ref.defaultName,
    defaultName = _ref$defaultName === void 0 ? "" : _ref$defaultName,
    formatText = _ref.formatText,
    _ref$dropdownButtonPr = _ref.dropdownButtonProps,
    dropdownButtonProps = _ref$dropdownButtonPr === void 0 ? {} : _ref$dropdownButtonPr,
    _ref$dropdownProps = _ref.dropdownProps,
    dropdownProps = _ref$dropdownProps === void 0 ? {} : _ref$dropdownProps,
    _ref$secondaryInfo = _ref.secondaryInfo,
    secondaryInfo = _ref$secondaryInfo === void 0 ? "" : _ref$secondaryInfo;
  var _useStateWithDependen = useStateWithDependency(value !== null && value !== void 0 ? value : ""),
    _useStateWithDependen2 = _slicedToArray(_useStateWithDependen, 2),
    name = _useStateWithDependen2[0],
    setName = _useStateWithDependen2[1];
  var _useState = React.useState(isOpen),
    _useState2 = _slicedToArray(_useState, 2),
    editMode = _useState2[0],
    setEditMode = _useState2[1];
  var renameRef = React.useRef(null);
  var initialName = React.useMemo(function () {
    return name;
  }, [editMode]);
  useOnClickOutside(renameRef, function () {
    return editMode && handleClose({
      saveOnOutsideClick: neetoCist.notEquals(name, initialName)
    });
  });
  var handleRename = function handleRename(event, name) {
    event === null || event === void 0 || event.stopPropagation();
    var newName = allowEmptySubmission && ramda.isEmpty(name) ? defaultName : name;
    setName(newName);
    onRename === null || onRename === void 0 || onRename(newName);
    setEditMode(false);
  };
  var handleClose = function handleClose(_ref2) {
    var _ref2$event = _ref2.event,
      event = _ref2$event === void 0 ? null : _ref2$event,
      _ref2$saveOnOutsideCl = _ref2.saveOnOutsideClick,
      saveOnOutsideClick = _ref2$saveOnOutsideCl === void 0 ? false : _ref2$saveOnOutsideCl;
    event === null || event === void 0 || event.stopPropagation();
    saveOnOutsideClick ? handleRename(event, name) : setName(value);
    setEditMode(false);
  };
  var handleRenameClick = function handleRenameClick(event) {
    event.stopPropagation();
    !disabled && setEditMode(true);
  };
  var isDefaultMenuCallbacksPresent = neetoCist.isPresent(onArchiveStatusToggle) || neetoCist.isPresent(onDisableStatusToggle) || neetoCist.isPresent(onDelete) || neetoCist.isPresent(onClone);
  var isMenuVisible = !editMode && !hideMenu && (neetoCist.isNotEmpty(dropdownItems) || !disabled || isDefaultMenuCallbacksPresent);
  var editNameProps = {
    allowEmptySubmission: allowEmptySubmission,
    cancelButtonProps: cancelButtonProps,
    handleClose: handleClose,
    handleRename: handleRename,
    inputProps: inputProps,
    isLoading: isLoading,
    name: name,
    placeholder: placeholder,
    setName: setName,
    submitButtonProps: submitButtonProps,
    editMode: editMode
  };
  var viewNameProps = {
    disabled: disabled,
    formatText: formatText,
    handleRenameClick: handleRenameClick,
    name: name,
    textProps: textProps
  };
  var renameMenuProps = {
    disabled: disabled,
    dropdownButtonProps: dropdownButtonProps,
    dropdownItems: dropdownItems,
    dropdownProps: dropdownProps,
    handleRenameClick: handleRenameClick,
    isArchived: isArchived,
    isDisabled: isDisabled,
    onArchiveStatusToggle: onArchiveStatusToggle,
    onClone: onClone,
    onDelete: onDelete,
    onDisableStatusToggle: onDisableStatusToggle
  };
  return /*#__PURE__*/jsxRuntime.jsxs("div", {
    ref: renameRef,
    className: classnames("neeto-molecules-rename flex max-w-md min-w-0", className),
    children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
      className: "flex max-w-full flex-1 flex-col items-start",
      children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
        className: "flex max-w-full flex-col items-start md:flex-row md:items-center",
        children: [neetoCist.isNotEmpty(breadcrumbs) && /*#__PURE__*/jsxRuntime.jsx(v2_Breadcrumbs, {
          breadcrumbs: breadcrumbs,
          hasTrailingSeparator: true,
          className: "neeto-molecules-rename-breadcrumbs"
        }), /*#__PURE__*/jsxRuntime.jsx("div", {
          className: "flex max-w-full items-center",
          children: editMode ? /*#__PURE__*/jsxRuntime.jsx(Editor, _objectSpread({}, editNameProps)) : /*#__PURE__*/jsxRuntime.jsx(ViewName, _objectSpread({}, viewNameProps))
        })]
      }), neetoCist.isNotEmpty(secondaryInfo) && !editMode && /*#__PURE__*/jsxRuntime.jsx("div", {
        className: "text-muted-foreground ms-2 -mt-1 max-w-full truncate text-xs leading-tight",
        children: secondaryInfo
      })]
    }), isMenuVisible && /*#__PURE__*/jsxRuntime.jsx("div", {
      className: "ms-1 flex items-center self-center",
      children: /*#__PURE__*/jsxRuntime.jsx(RenameMenu, _objectSpread({}, renameMenuProps))
    })]
  });
};

module.exports = Rename;
//# sourceMappingURL=Rename.js.map
