2021-07-22 22:54:10 +02:00
|
|
|
/**
|
2021-08-13 23:26:18 +02:00
|
|
|
* EGroupware eTemplate2 - Textbox widget (WebComponent)
|
2021-07-22 22:54:10 +02:00
|
|
|
*
|
|
|
|
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
|
|
|
|
* @package etemplate
|
|
|
|
* @subpackage api
|
|
|
|
* @link https://www.egroupware.org
|
|
|
|
* @author Nathan Gray
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
2022-03-02 22:22:19 +01:00
|
|
|
import {css, PropertyValues} from "@lion/core";
|
2021-08-27 08:13:36 +02:00
|
|
|
import {LionInput} from "@lion/input";
|
2021-08-25 23:35:06 +02:00
|
|
|
import {Et2InputWidget} from "../Et2InputWidget/Et2InputWidget";
|
2022-03-02 22:22:19 +01:00
|
|
|
import {Regex} from "../Validators/Regex";
|
2021-07-22 22:54:10 +02:00
|
|
|
|
2021-08-26 20:59:13 +02:00
|
|
|
export class Et2Textbox extends Et2InputWidget(LionInput)
|
2021-07-22 22:54:10 +02:00
|
|
|
{
|
|
|
|
|
2021-08-13 23:26:18 +02:00
|
|
|
static get styles()
|
|
|
|
{
|
|
|
|
return [
|
2022-02-25 18:21:16 +01:00
|
|
|
super.styles,
|
2021-08-13 23:26:18 +02:00
|
|
|
css`
|
2022-02-03 22:41:58 +01:00
|
|
|
:host([type="hidden"]) {
|
|
|
|
display: none;
|
|
|
|
}
|
2021-08-13 23:26:18 +02:00
|
|
|
`,
|
|
|
|
];
|
|
|
|
}
|
|
|
|
|
|
|
|
static get properties()
|
|
|
|
{
|
|
|
|
return {
|
|
|
|
...super.properties,
|
2022-03-02 22:22:19 +01:00
|
|
|
/**
|
|
|
|
* Perl regular expression eg. '/^[0-9][a-f]{4}$/i'
|
|
|
|
*
|
|
|
|
* Not to be confused with this.validators, which is a list of validators for this widget
|
|
|
|
*/
|
|
|
|
validator: String,
|
2021-08-20 23:52:22 +02:00
|
|
|
onkeypress: Function,
|
2021-08-10 23:02:52 +02:00
|
|
|
}
|
2021-08-13 23:26:18 +02:00
|
|
|
}
|
2021-08-10 23:02:52 +02:00
|
|
|
|
2021-08-26 20:59:13 +02:00
|
|
|
constructor(...args : any[])
|
2021-08-13 23:26:18 +02:00
|
|
|
{
|
2021-08-26 20:59:13 +02:00
|
|
|
super(...args);
|
2021-08-13 23:26:18 +02:00
|
|
|
}
|
2021-08-10 23:02:52 +02:00
|
|
|
|
2021-08-13 23:26:18 +02:00
|
|
|
connectedCallback()
|
|
|
|
{
|
|
|
|
super.connectedCallback();
|
|
|
|
}
|
2022-03-02 22:22:19 +01:00
|
|
|
|
|
|
|
/** @param {import('@lion/core').PropertyValues } changedProperties */
|
|
|
|
updated(changedProperties : PropertyValues)
|
|
|
|
{
|
|
|
|
super.updated(changedProperties);
|
|
|
|
if(changedProperties.has('validator'))
|
|
|
|
{
|
|
|
|
// Remove all existing Pattern validators (avoids duplicates)
|
|
|
|
this.validators = (this.validators || []).filter((validator) => validator instanceof Regex)
|
|
|
|
this.validators.push(new Regex(this.validator));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
get validator()
|
|
|
|
{
|
|
|
|
return this.__validator;
|
|
|
|
}
|
|
|
|
|
|
|
|
set validator(value)
|
|
|
|
{
|
|
|
|
if(typeof value == 'string')
|
|
|
|
{
|
|
|
|
let parts = value.split('/');
|
|
|
|
let flags = parts.pop();
|
|
|
|
if(parts.length < 2 || parts[0] !== '')
|
|
|
|
{
|
|
|
|
this.egw().debug(this.egw().lang("'%1' has an invalid format !!!", value));
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
parts.shift();
|
|
|
|
this.__validator = new RegExp(parts.join('/'), flags);
|
|
|
|
|
|
|
|
this.requestUpdate("validator");
|
|
|
|
}
|
|
|
|
}
|
2021-07-22 22:54:10 +02:00
|
|
|
}
|
2021-08-10 23:02:52 +02:00
|
|
|
|
2021-08-27 19:21:40 +02:00
|
|
|
// @ts-ignore TypeScript is not recognizing that Et2Textbox is a LitElement
|
2022-02-21 19:58:56 +01:00
|
|
|
customElements.define("et2-textbox", Et2Textbox);
|