/*
 * This file is part of the TYPO3 CMS project.
 *
 * It is free software; you can redistribute it and/or modify it under
 * the terms of the GNU General Public License, either version 2
 * of the License, or any later version.
 *
 * For the full copyright and license information, please read the
 * LICENSE.txt file that was distributed with this source code.
 *
 * The TYPO3 project - inspiring people to share!
 */
import{property as c,state as m,customElement as u}from"lit/decorators.js";import{LitElement as g,html as d}from"lit";import f from"~labels/core.core";var o=function(a,e,t,n){var i=arguments.length,r=i<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,t):n,h;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(a,e,t,n);else for(var l=a.length-1;l>=0;l--)(h=a[l])&&(r=(i<3?h(r):i>3?h(e,t,r):h(e,t))||r);return i>3&&r&&Object.defineProperty(e,t,r),r};let s=class extends g{constructor(){super(...arguments),this.remainingCharacters=0,this.targetElement=null,this.threshold=15,this.onInput=e=>{this.determineRemainingCharacters(e.target)},this.onFocus=e=>{this.determineRemainingCharacters(e.target),this.hidden=!1},this.onBlur=()=>{this.hidden=!0}}connectedCallback(){super.connectedCallback(),this.registerCallbacks(),this.hidden=!0}disconnectedCallback(){super.disconnectedCallback(),this.removeCallbacks()}createRenderRoot(){return this}updated(e){e.has("target")&&(this.removeCallbacks(),this.targetElement=document.querySelector(this.target),this.registerCallbacks())}render(){return d`<span class="form-hint form-hint--${this.determineCounterClass()}"> ${f.get("labels.remainingCharacters",{0:this.remainingCharacters.toString(10)})} </span>`}registerCallbacks(){this.targetElement!==null&&(this.targetElement.addEventListener("input",this.onInput),this.targetElement.addEventListener("focus",this.onFocus),this.targetElement.addEventListener("blur",this.onBlur))}removeCallbacks(){this.targetElement!==null&&(this.targetElement.removeEventListener("input",this.onInput),this.targetElement.removeEventListener("focus",this.onFocus),this.targetElement.removeEventListener("blur",this.onBlur))}determineRemainingCharacters(e){const t=e.value,n=t.length,i=(t.match(/\n/g)||[]).length;this.remainingCharacters=this.targetElement.maxLength-n-i}determineCounterClass(){return this.remainingCharacters<this.threshold?"danger":this.remainingCharacters<this.threshold*2?"warning":"info"}};o([c()],s.prototype,"target",void 0),o([m()],s.prototype,"remainingCharacters",void 0),s=o([u("typo3-backend-formengine-char-counter")],s);export{s as CharCounter};
