@everymatrix/general-input 1.59.2 → 1.60.0

package/dist/general-input/p-b4c2804b.entry.js

@@ -0,0 +1 @@
+import{r as e,c as t,h as i}from"./p-8b2b0da7.js";import{t as o}from"./p-80314011.js";import{t as s}from"./p-2dccd0bf.js";const l=class{constructor(i){e(this,i),this.sendValidityState=t(this,"sendValidityState",7),this.sendInputValue=t(this,"sendInputValue",7),this.callBackObject={},this.subFieldsObject={},this.value="",this.handleRevealField=(e,t)=>{e.stopPropagation(),window.postMessage({type:`registration${t}Clicked`},window.location.href)},this.setClientStyling=()=>{let e=document.createElement("style");e.innerHTML=this.clientStyling,this.stylingContainer.prepend(e)},this.name=void 0,this.displayName=void 0,this.defaultValue="",this.options=void 0,this.autofilled=void 0,this.tooltip=void 0,this.validation=void 0,this.language=void 0,this.emitValue=void 0,this.clientStyling="",this.errorMessage=void 0,this.isValid=void 0,this.limitStylingAppends=!1,this.showTooltip=!1,this.showFields="true"===this.defaultValue}handleStylingChange(e,t){e!==t&&this.setClientStyling()}validityStateHandler(e){this.sendValidityState.emit(e)}valueHandler(e){this.sendInputValue.emit(e)}handleClickOutside(e){e.composedPath()[0]!==this.tooltipIconReference&&e.composedPath()[0]!==this.tooltipReference&&(this.showTooltip=!1)}componentDidRender(){!this.limitStylingAppends&&this.stylingContainer&&(this.clientStyling&&this.setClientStyling(),this.limitStylingAppends=!0)}componentDidLoad(){0!==this.options.length&&this.options.forEach((e=>{this.callBackObject[e.name]=t=>{this.handleRevealField(t,e.name)},this.subFieldsObject[e.name].addEventListener("click",this.callBackObject[e.name])}))}handleClick(){this.showFields=this.checkboxReference.checked,this.errorMessage=this.setErrorMessage(),this.isValid=this.setValidity(),this.valueHandler({name:this.name,value:this.checkboxReference.checked?"true":"false",type:"toggle"})}setValidity(){return this.checkboxReference.validity.valid}setErrorMessage(){if(this.checkboxReference.validity.valueMissing)return o("requiredError",this.language)}disconnectedCallback(){this.options.forEach((e=>{this.subFieldsObject[e.name].removeEventListener("click",this.callBackObject[e.name])}))}renderLabel(){return i("label",{class:"togglecheckbox__label",htmlFor:`${this.name}__input`},i("div",{class:"togglecheckbox__label-text",innerHTML:`${this.displayName} ${this.validation.mandatory?"*":""}`}))}renderTooltip(){return this.showTooltip?i("div",{class:"togglecheckbox__tooltip "+(this.showTooltip?"visible":""),ref:e=>this.tooltipReference=e,innerHTML:this.tooltip}):null}render(){return i("div",{key:"d7084a7f82d45b3d1e7f8ae373b663b2aefdf5ec",class:`togglecheckbox__wrapper  ${this.name}__input`,ref:e=>this.stylingContainer=e},i("div",{key:"f065f4611805dd8490234bcec1fecdbcfcaefab8",class:"togglecheckbox__wrapper--flex"},i("input",{key:"c5196d5a4cd2f114a610037285ee644fcabc37bd",class:"togglecheckbox__input",type:"checkbox",id:`${this.name}__input`,ref:e=>this.checkboxReference=e,name:this.name,checked:"true"===this.defaultValue,readOnly:this.autofilled,required:this.validation.mandatory,value:this.value,onClick:()=>this.handleClick()}),this.renderLabel()),i("small",{key:"06d5db0994272ec9dde1b5cd0d525bb53ff1a058",class:"togglecheckbox__error-message"},this.errorMessage),i("div",{key:"aff16ac9ed0adb896f2c1822014c5c8c4d6db2d4",class:"togglecheckbox__wrapper--relative"},this.tooltip&&i("img",{key:"6b049cecc095a2127eb566f50fd0f8feaa8cb3d5",class:"togglecheckbox__tooltip-icon",src:s,alt:"",ref:e=>this.tooltipIconReference=e,onClick:()=>this.showTooltip=!this.showTooltip}),this.renderTooltip()),i("div",{key:"372c3eb72cffd482fe1c179047ec3900cef00d46",class:"togglecheckbox__fields-wrapper "+(this.showFields?"":"hidden")},this.options.map((e=>i("general-input",{type:e.inputType,name:e.name,displayName:e.displayName,validation:e.validate,action:e.action||null,defaultValue:e.defaultValue,autofilled:e.autofill,emitValue:this.emitValue,language:this.language,"client-styling":this.clientStyling,tooltip:e.tooltip,placeholder:null==e.placeholder?"":e.placeholder,ref:t=>this.subFieldsObject[e.name]=t})))))}static get watchers(){return{clientStyling:["handleStylingChange"]}}};l.style='*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.togglecheckbox{font-family:"Roboto";font-style:normal;font-size:15px}.togglecheckbox__wrapper{position:relative}.togglecheckbox__wrapper--flex{display:flex;gap:10px;align-items:baseline}.togglecheckbox__wrapper--relative{position:relative;display:inline}.togglecheckbox__input{transform:scale(1.307, 1.307);margin-left:2px;accent-color:var(--emw--login-color-primary, var(--emw--color-primary, #D0046C))}.togglecheckbox__label{font-style:inherit;font-family:inherit;font-weight:400;font-size:16px;color:var(--emw--registration-typography, var(--emw--color-black, #000000));line-height:1.5;cursor:pointer;padding:0}.togglecheckbox__label-text{font-size:16px}.togglecheckbox__label a{color:var(--emw--login-color-primary, var(--emw--color-primary, #D0046C))}.togglecheckbox__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.togglecheckbox__tooltip-icon{width:16px;height:auto}.togglecheckbox__tooltip{position:absolute;top:0;right:0;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.togglecheckbox__tooltip.visible{opacity:1}.togglecheckbox__fields-wrapper{margin-top:40px;display:flex;flex-direction:column;gap:40px}.hidden{display:none}';export{l as toggle_checkbox_input}

package/dist/types/components/checkbox-group-input/checkbox-group-input.d.ts

@@ -1,7 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { ValidationSchema, InputStateEvent, InputValueEvent, RegCfgContentField } from '../../utils/types';
-import '@vaadin/checkbox';
-import '@vaadin/checkbox-group';
 export declare class CheckboxGroupInput {
     /**
      * Name of the input.

package/dist/types/components/date-input/date-input.d.ts

@@ -1,7 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { ValidationSchema, InputStateEvent, InputValueEvent } from '../../utils/types';
-import '@vaadin/date-picker';
-import type { DatePicker, DatePickerDate, DatePickerChangeEvent } from '@vaadin/date-picker';
+import type { DatePicker, DatePickerChangeEvent } from "../../../../../../dist/libs/vaadin-facade/index";
 export declare class DateInput {
     /**
      * Name of the input.

package/dist/types/components/general-input/general-input.d.ts

@@ -1,4 +1,5 @@
 import type { ValidationSchema } from '../../utils/types';
+import "../../../../../../dist/libs/vaadin-facade/index";
 export declare class GeneralInput {
     /**
      * Type the general-input should take. Can take the default HTML input values.

package/dist/types/components/password-input/password-input.d.ts

@@ -1,6 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { ValidationSchema, InputStateEvent, InputValueEvent, PasswordComplexity } from '../../utils/types';
-import '@vaadin/password-field';
 export declare class PasswordInput {
     /**
      * Name of the input.

package/dist/types/components/select-input/select-input.d.ts

@@ -1,6 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import type { ValidationSchema, InputStateEvent, InputValueEvent, Option } from '../../utils/types';
-import '@vaadin/combo-box';
 export declare class SelectInput {
     /**
      * Name of the input.

package/dist/types/components/tel-input/tel-input.d.ts

@@ -1,6 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { ValidationSchema, InputStateEvent, InputValueEvent, Option } from '../../utils/types';
-import '@vaadin/combo-box';
 export declare class TelInput {
     /**
      * Name of the input.

package/dist/types/components/toggle-checkbox-input/toggle-checkbox-input.d.ts

@@ -50,6 +50,8 @@ export declare class ToggleCheckboxInput {
     private checkboxReference;
     private tooltipReference;
     private tooltipIconReference;
+    private callBackObject;
+    private subFieldsObject;
     value: string;
     handleStylingChange(newValue: string, oldValue: string): void;
     sendValidityState: EventEmitter<InputStateEvent>;
@@ -58,10 +60,13 @@ export declare class ToggleCheckboxInput {
     valueHandler(inputValueEvent: InputValueEvent): void;
     handleClickOutside(event: MouseEvent): void;
     componentDidRender(): void;
+    componentDidLoad(): void;
+    handleRevealField: (event: Event, fieldName: string) => void;
     handleClick(): void;
     setValidity(): boolean;
     setErrorMessage(): string;
     setClientStyling: () => void;
+    disconnectedCallback(): void;
     renderLabel(): any;
     renderTooltip(): any;
     render(): any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/general-input",
-  "version": "1.59.2",
+  "version": "1.60.0",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",