import { HTMLBuilder } from "@sankhyalabs/core";
const MINIMIUM_WIDTH_TEXTAREA = 210;
const PADDING_VALUE_TEXTAREA = 12;
export const buildTextInput = ({ name, contextName }) => {
  const textInput = HTMLBuilder.parseElement(`<ez-text-input
        class="ez-grid grid_editor"
        data-field-name=${name}
        data-context-name=${contextName}
        mode="slim"
    />`);
  textInput.autoFocus = true;
  return textInput;
};
export const buildTextAreaInput = ({ eGridCell, editionManager }) => {
  const element = HTMLBuilder.parseElement(`<ez-text-area
            can-show-error="false"
            enable-resize="true"
        />`);
  element.addEventListener('keydown', event => handlePressEnterEvent(event, element, editionManager));
  setElementInitialWidth(eGridCell, element);
  element.isPopUp = true;
  element.autoFocus = true;
  return element;
};
function setElementInitialWidth(eGridCell, element) {
  const { width } = eGridCell.getBoundingClientRect();
  const newValue = width > MINIMIUM_WIDTH_TEXTAREA ? width : MINIMIUM_WIDTH_TEXTAREA;
  element.style.minWidth = `${newValue - PADDING_VALUE_TEXTAREA}px`;
  element.style.resize = "both";
}
function handlePressEnterEvent(event, element, editionManager) {
  if (isEnter(event)) {
    const shouldBreakLine = event.ctrlKey;
    if (shouldBreakLine) {
      element.appendTextToSelection('\n');
      event.preventDefault();
      return;
    }
    editionManager.navigateByEnterKey(event);
  }
}
function isEnter(event) {
  return [event.key, event.code].includes('Enter');
}
