export const INPUT_MASK_TEXT_PROP = '--descope-input-mask-content';
export const INPUT_MASK_DISPLAY_PROP = '--descope-input-mask-display';
export const INPUT_MASK_FALLBACK_PROP = '--descope-input-mask-fallback';

export const focusElement = (ele) => {
  ele?.focus();
  ele?.setSelectionRange?.(1, 1);
};

export const sanitizeStr = (str) => {
  return str.replace(/\D/g, '') || '';
};

export const toggleMaskVisibility = (input, value) => {
  if (value) {
    input.style.setProperty(INPUT_MASK_TEXT_PROP, `"${value}"`);
    input.style.setProperty(INPUT_MASK_DISPLAY_PROP, 'flex');
  } else {
    input.style.removeProperty(INPUT_MASK_TEXT_PROP);
    input.style.removeProperty(INPUT_MASK_DISPLAY_PROP);
  }
};
