iptdevs-design-system 2.7.8 → 2.7.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/atoms/select/select.component.mjs +2 -8
- package/esm2020/lib/components/forms/create-user-form/create-user-form.component.mjs +2 -2
- package/fesm2015/iptdevs-design-system.mjs +2 -8
- package/fesm2015/iptdevs-design-system.mjs.map +1 -1
- package/fesm2020/iptdevs-design-system.mjs +2 -8
- package/fesm2020/iptdevs-design-system.mjs.map +1 -1
- package/lib/components/atoms/select/select.component.d.ts +1 -3
- package/package.json +1 -1
|
@@ -573,10 +573,8 @@ class SelectComponent {
|
|
|
573
573
|
constructor() {
|
|
574
574
|
this.boxShadow = 0;
|
|
575
575
|
this.clicked = false;
|
|
576
|
-
this.value = '';
|
|
577
576
|
this.disabledSel = false;
|
|
578
577
|
this.eventSelect = new EventEmitter();
|
|
579
|
-
this.eventToNextSelect = new EventEmitter();
|
|
580
578
|
}
|
|
581
579
|
// type viene de otro componente -> indica de que tipo es el arreglo si pregrade, posgrade o modo
|
|
582
580
|
set control(value) {
|
|
@@ -590,7 +588,6 @@ class SelectComponent {
|
|
|
590
588
|
}
|
|
591
589
|
}
|
|
592
590
|
seleccionar(evt) {
|
|
593
|
-
this.value = evt;
|
|
594
591
|
if (this.eventSelect.emit(evt) !== this.defaultText) {
|
|
595
592
|
this.boxShadow = 1;
|
|
596
593
|
}
|
|
@@ -601,7 +598,6 @@ class SelectComponent {
|
|
|
601
598
|
setBinding() {
|
|
602
599
|
if (this.initialValue !== '') {
|
|
603
600
|
this.binding = this.initialValue;
|
|
604
|
-
this.eventToNextSelect.emit(this.value);
|
|
605
601
|
}
|
|
606
602
|
else {
|
|
607
603
|
this.binding = this.defaultText;
|
|
@@ -621,7 +617,7 @@ class SelectComponent {
|
|
|
621
617
|
}
|
|
622
618
|
}
|
|
623
619
|
SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
624
|
-
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: SelectComponent, selector: "ipt-select", inputs: { isRequired: "isRequired", data: "data", defaultText: "defaultText", selectCode: "selectCode", disabledSel: "disabledSel", initialValue: "initialValue", control: "control" }, outputs: { eventSelect: "eventSelect"
|
|
620
|
+
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: SelectComponent, selector: "ipt-select", inputs: { isRequired: "isRequired", data: "data", defaultText: "defaultText", selectCode: "selectCode", disabledSel: "disabledSel", initialValue: "initialValue", control: "control" }, outputs: { eventSelect: "eventSelect" }, usesOnChanges: true, ngImport: i0, template: `
|
|
625
621
|
<div class="select-container">
|
|
626
622
|
<label [ngClass]="labelClass">{{ defaultText }}</label>
|
|
627
623
|
<select
|
|
@@ -667,8 +663,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.3", ngImpor
|
|
|
667
663
|
type: Input
|
|
668
664
|
}], eventSelect: [{
|
|
669
665
|
type: Output
|
|
670
|
-
}], eventToNextSelect: [{
|
|
671
|
-
type: Output
|
|
672
666
|
}], control: [{
|
|
673
667
|
type: Input
|
|
674
668
|
}] } });
|
|
@@ -1478,7 +1472,7 @@ class CreateUserFormComponent {
|
|
|
1478
1472
|
}
|
|
1479
1473
|
}
|
|
1480
1474
|
CreateUserFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.3", ngImport: i0, type: CreateUserFormComponent, deps: [{ token: i1$1.FormBuilder }, { token: ParameterService }, { token: UserService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1481
|
-
CreateUserFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: CreateUserFormComponent, selector: "ipt-create-user-form", inputs: { userType: "userType", visibility: "visibility" }, outputs: { userCreated: "userCreated", onHide: "onHide" }, ngImport: i0, template: "<main *ngIf=\"visibility\">\n <div @fade class=\"modal_container\">\n <div class=\"header_modal\">\n <h1>Crear usuario de {{ userType | titlecase}}</h1>\n <button (click)=\"closeModal()\">x</button>\n </div>\n <div class=\"grid_container\">\n <div>\n <form autocomplete=\"off\" [formGroup]=\"createUserForm\">\n <ipt-input\n [inputType]=\"'text'\"\n [placeHolder]=\"'Nombre completo'\"\n [control]=\"createUserForm.controls['name']\"\n [validateText]=\"'Debe ingresar el nombre'\"\n ></ipt-input>\n <ipt-input\n [inputType]=\"'text'\"\n [placeHolder]=\"'Apellidos'\"\n [control]=\"createUserForm.controls['last_name']\"\n [validateText]=\"'Debe ingresar los apellidos'\"\n ></ipt-input>\n <ipt-input\n [inputType]=\"'text'\"\n [placeHolder]=\"'Correo electr\u00F3nico'\"\n [control]=\"createUserForm.controls['email']\"\n [validateText]=\"'Debe tener dominio @inglesparatodos.edu.co'\"\n ></ipt-input>\n <ipt-select\n [isRequired]=\"true\"\n [defaultText]=\"'Seleccione el rol'\"\n (eventSelect)=\"selectRol($event)\"\n [data]=\"getRolesOptions()\"\n ></ipt-select>\n <ipt-select\n [isRequired]=\"true\"\n [data]=\"phoneNumberIndicatives\"\n (eventSelect)=\"selectIndicatives($event)\"\n [defaultText]=\"'Seleccione el indicativo'\"\n ></ipt-select>\n <ipt-input\n [inputType]=\"'number'\"\n [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\n [control]=\"createUserForm.controls['phone_number']\"\n [validateText]=\"'Debe ingresar un n\u00FAmero de tel\u00E9fono v\u00E1lido'\"\n ></ipt-input>\n <ipt-select\n [isRequired]=\"true\"\n [data]=\"idTypes\"\n (eventSelect)=\"selectIdType($event)\"\n [defaultText]=\"'Ingrese el tipo de documento'\"\n ></ipt-select>\n <ipt-input\n [inputType]=\"'number'\"\n [placeHolder]=\"'Documento de identidad'\"\n [control]=\"createUserForm.controls['id_card']\"\n [validateText]=\"'Debe ingresar el n\u00FAmero de documento'\"\n ></ipt-input>\n <ipt-select\n [isRequired]=\"true\"\n (eventSelect)=\"selectState($event)\"\n [data]=\"states\"\n [defaultText]=\"'Seleccione el departamento'\"\n ></ipt-select>\n <ipt-select\n [isRequired]=\"true\"\n (eventSelect)=\"selectCity($event)\"\n [data]=\"cities\"\n [defaultText]=\"'Ciudad de residencia'\"\n ></ipt-select>\n <ipt-input *ngIf=\"!(userType === 'student')\"\n [inputType]=\"'number'\"\n [placeHolder]=\"'Ingrese las horas de servicio'\"\n [control]=\"createUserForm.controls['service_hour']\"\n [validateText]=\"'Debe ingresar las horas de servicio'\"\n ></ipt-input>\n <ipt-input\n [inputType]=\"'password'\"\n [placeHolder]=\"'Contrase\u00F1a'\"\n [control]=\"createUserForm.controls['password']\"\n >\n </ipt-input>\n <ipt-input\n [inputType]=\"'password'\"\n [placeHolder]=\"'Repetir contrase\u00F1a'\"\n [control]=\"createUserForm.controls['re_password']\"\n >\n </ipt-input>\n </form>\n\n <div class=\"buttons-container\">\n <ipt-button\n [label]=\"'Crear usuario'\"\n [isEnabled]=\"\n !loader &&\n createUserForm.value['re_password'] ===\n createUserForm.value['password']\n \"\n (onClick)=\"createUser()\"\n [primary]=\"true\"\n >\n </ipt-button>\n </div>\n </div>\n <div [ngStyle]=\"{'background-image': 'url(' + photo + ')'}\" class=\"user_type_image\"></div>\n </div>\n </div>\n</main>\n", styles: ["@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100vh;width:100vw;transition:all .5s}main .modal_container{width:60%;height:-moz-fit-content;height:fit-content;position:absolute;top:0;left:0;bottom:0;right:0;margin:auto;background-color:#fff;border-radius:6px}.header_modal{display:flex;padding:0 15px;gap:1rem;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1.25rem;font-weight:700}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.grid_container{display:grid;grid-template-columns:1fr}form{display:grid;grid-template-columns:1fr;grid-gap:.25rem;gap:.25rem;justify-content:center;padding:0 1rem}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}.user_type_image{display:none}}@media screen and (min-width: 768px){form{display:grid;grid-template-columns:1fr 1fr;grid-gap:1rem;gap:1rem;justify-content:center}}@media screen and (min-width: 1366px){form{padding:0rem}.grid_container{display:grid;grid-template-columns:1fr 250px;grid-gap:1rem;gap:1rem;padding:1rem}.user_type_image{display:flex;background-size:cover;background-repeat:no-repeat;background-position:center;height:100%;border-radius:1rem;padding:1rem}}\n"], components: [{ type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal"], outputs: ["dateSelected"] }, { type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"
|
|
1475
|
+
CreateUserFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.3", type: CreateUserFormComponent, selector: "ipt-create-user-form", inputs: { userType: "userType", visibility: "visibility" }, outputs: { userCreated: "userCreated", onHide: "onHide" }, ngImport: i0, template: "<main *ngIf=\"visibility\">\n <div @fade class=\"modal_container\">\n <div class=\"header_modal\">\n <h1>Crear usuario de {{ userType | titlecase}}</h1>\n <button (click)=\"closeModal()\">x</button>\n </div>\n <div class=\"grid_container\">\n <div>\n <form autocomplete=\"off\" [formGroup]=\"createUserForm\">\n <ipt-input\n [inputType]=\"'text'\"\n [placeHolder]=\"'Nombre completo'\"\n [control]=\"createUserForm.controls['name']\"\n [validateText]=\"'Debe ingresar el nombre'\"\n ></ipt-input>\n <ipt-input\n [inputType]=\"'text'\"\n [placeHolder]=\"'Apellidos'\"\n [control]=\"createUserForm.controls['last_name']\"\n [validateText]=\"'Debe ingresar los apellidos'\"\n ></ipt-input>\n <ipt-input\n [inputType]=\"'text'\"\n [placeHolder]=\"'Correo electr\u00F3nico'\"\n [control]=\"createUserForm.controls['email']\"\n [validateText]=\"'Debe tener dominio @inglesparatodos.edu.co'\"\n ></ipt-input>\n <ipt-select\n [isRequired]=\"true\"\n [defaultText]=\"'Seleccione el rol'\"\n (eventSelect)=\"selectRol($event)\"\n [data]=\"getRolesOptions()\"\n ></ipt-select>\n <ipt-select\n [isRequired]=\"true\"\n [data]=\"phoneNumberIndicatives\"\n (eventSelect)=\"selectIndicatives($event)\"\n [defaultText]=\"'Seleccione el indicativo'\"\n ></ipt-select>\n <ipt-input\n [inputType]=\"'number'\"\n [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\n [control]=\"createUserForm.controls['phone_number']\"\n [validateText]=\"'Debe ingresar un n\u00FAmero de tel\u00E9fono v\u00E1lido'\"\n ></ipt-input>\n <ipt-select\n [isRequired]=\"true\"\n [data]=\"idTypes\"\n (eventSelect)=\"selectIdType($event)\"\n [defaultText]=\"'Ingrese el tipo de documento'\"\n ></ipt-select>\n <ipt-input\n [inputType]=\"'number'\"\n [placeHolder]=\"'Documento de identidad'\"\n [control]=\"createUserForm.controls['id_card']\"\n [validateText]=\"'Debe ingresar el n\u00FAmero de documento'\"\n ></ipt-input>\n <ipt-select\n [isRequired]=\"true\"\n (eventSelect)=\"selectState($event)\"\n [data]=\"states\"\n [defaultText]=\"'Seleccione el departamento'\"\n ></ipt-select>\n <ipt-select\n [isRequired]=\"true\"\n (eventSelect)=\"selectCity($event)\"\n [data]=\"cities\"\n [defaultText]=\"'Ciudad de residencia'\"\n ></ipt-select>\n <ipt-input *ngIf=\"!(userType === 'student')\"\n [inputType]=\"'number'\"\n [placeHolder]=\"'Ingrese las horas de servicio'\"\n [control]=\"createUserForm.controls['service_hour']\"\n [validateText]=\"'Debe ingresar las horas de servicio'\"\n ></ipt-input>\n <ipt-input\n [inputType]=\"'password'\"\n [placeHolder]=\"'Contrase\u00F1a'\"\n [control]=\"createUserForm.controls['password']\"\n >\n </ipt-input>\n <ipt-input\n [inputType]=\"'password'\"\n [placeHolder]=\"'Repetir contrase\u00F1a'\"\n [control]=\"createUserForm.controls['re_password']\"\n >\n </ipt-input>\n </form>\n\n <div class=\"buttons-container\">\n <ipt-button\n [label]=\"'Crear usuario'\"\n [isEnabled]=\"\n !loader &&\n createUserForm.value['re_password'] ===\n createUserForm.value['password']\n \"\n (onClick)=\"createUser()\"\n [primary]=\"true\"\n >\n </ipt-button>\n </div>\n </div>\n <div [ngStyle]=\"{'background-image': 'url(' + photo + ')'}\" class=\"user_type_image\"></div>\n </div>\n </div>\n</main>\n", styles: ["@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100vh;width:100vw;transition:all .5s}main .modal_container{width:60%;height:-moz-fit-content;height:fit-content;position:absolute;top:0;left:0;bottom:0;right:0;margin:auto;background-color:#fff;border-radius:6px}.header_modal{display:flex;padding:0 15px;gap:1rem;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1.25rem;font-weight:700}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.grid_container{display:grid;grid-template-columns:1fr}form{display:grid;grid-template-columns:1fr;grid-gap:.25rem;gap:.25rem;justify-content:center;padding:0 1rem}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}.user_type_image{display:none}}@media screen and (min-width: 768px){form{display:grid;grid-template-columns:1fr 1fr;grid-gap:1rem;gap:1rem;justify-content:center}}@media screen and (min-width: 1366px){form{padding:0rem}.grid_container{display:grid;grid-template-columns:1fr 250px;grid-gap:1rem;gap:1rem;padding:1rem}.user_type_image{display:flex;background-size:cover;background-repeat:no-repeat;background-position:center;height:100%;border-radius:1rem;padding:1rem}}\n"], components: [{ type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal"], outputs: ["dateSelected"] }, { type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { type: ButtonComponent, selector: "ipt-button", inputs: ["primary", "size", "label", "buttonType", "isEnabled"], outputs: ["onClick"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "titlecase": i1.TitleCasePipe }, animations: [
|
|
1482
1476
|
trigger('fade', [
|
|
1483
1477
|
transition('void => *', [
|
|
1484
1478
|
style({ opacity: 0 }),
|