quang 20.2.1 → 20.2.2

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.
@@ -35,7 +35,9 @@ The component supports the following input types, each with specific behaviors a
35
35
  #### Password (`componentType="password"`)
36
36
 
37
37
  - **Toggle visibility**: Built-in show/hide password functionality
38
- - **Icon support**: Custom icons through content projection
38
+ - **Icon support**: Uses content projection through slots for customizing the show/hide icons
39
+ - `[show-password]` slot: Content to display when password is hidden (show password icon)
40
+ - `[hide-password]` slot: Content to display when password is visible (hide password icon)
39
41
  - **Security**: Masks input by default, reveals on toggle
40
42
 
41
43
  #### Number (`componentType="number"`)
@@ -121,11 +123,9 @@ The component supports the following input types, each with specific behaviors a
121
123
  componentType="password"
122
124
  formControlName="password"
123
125
  >
124
- @if (showPassword()) {
125
- <svg-icon src="assets/icons/svg/visibility_off.svg" />
126
- } @else {
127
- <svg-icon src="assets/icons/svg/visibility.svg" />
128
- }
126
+ <!-- Content for the show/hide password button -->
127
+ <svg-icon src="assets/icons/svg/visibility.svg" show-password />
128
+ <svg-icon src="assets/icons/svg/visibility_off.svg" hide-password />
129
129
  </quang-input>
130
130
  ```
131
131
 
@@ -12,13 +12,12 @@ declare class QuangInputComponent extends QuangBaseComponent<string | number> {
12
12
  resizable: _angular_core.InputSignal<boolean>;
13
13
  buttonClass: _angular_core.InputSignal<string>;
14
14
  showHidePasswordButton: _angular_core.InputSignal<boolean>;
15
- showPassword: _angular_core.OutputEmitterRef<boolean>;
16
- private onShowPassword;
15
+ showPassword: _angular_core.WritableSignal<boolean>;
17
16
  componentInputType: _angular_core.Signal<InputType>;
18
17
  constructor();
19
18
  onTogglePasswordVisibility(): void;
20
19
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<QuangInputComponent, never>;
21
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<QuangInputComponent, "quang-input", never, { "componentType": { "alias": "componentType"; "required": true; "isSignal": true; }; "maxLengthText": { "alias": "maxLengthText"; "required": false; "isSignal": true; }; "minLengthText": { "alias": "minLengthText"; "required": false; "isSignal": true; }; "minNumber": { "alias": "minNumber"; "required": false; "isSignal": true; }; "maxNumber": { "alias": "maxNumber"; "required": false; "isSignal": true; }; "componentStep": { "alias": "componentStep"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "buttonClass": { "alias": "buttonClass"; "required": false; "isSignal": true; }; "showHidePasswordButton": { "alias": "showHidePasswordButton"; "required": false; "isSignal": true; }; }, { "showPassword": "showPassword"; }, never, ["*"], true, never>;
20
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<QuangInputComponent, "quang-input", never, { "componentType": { "alias": "componentType"; "required": true; "isSignal": true; }; "maxLengthText": { "alias": "maxLengthText"; "required": false; "isSignal": true; }; "minLengthText": { "alias": "minLengthText"; "required": false; "isSignal": true; }; "minNumber": { "alias": "minNumber"; "required": false; "isSignal": true; }; "maxNumber": { "alias": "maxNumber"; "required": false; "isSignal": true; }; "componentStep": { "alias": "componentStep"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "buttonClass": { "alias": "buttonClass"; "required": false; "isSignal": true; }; "showHidePasswordButton": { "alias": "showHidePasswordButton"; "required": false; "isSignal": true; }; }, {}, never, ["[hide-password]", "[show-password]"], true, never>;
22
21
  }
23
22
 
24
23
  export { QuangInputComponent };
@@ -1,6 +1,6 @@
1
1
  import { NgClass } from '@angular/common';
2
2
  import * as i0 from '@angular/core';
3
- import { input, output, signal, computed, forwardRef, ChangeDetectionStrategy, Component } from '@angular/core';
3
+ import { input, signal, computed, forwardRef, ChangeDetectionStrategy, Component } from '@angular/core';
4
4
  import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
5
5
  import { NG_VALUE_ACCESSOR } from '@angular/forms';
6
6
  import { TranslocoPipe } from '@jsverse/transloco';
@@ -22,9 +22,8 @@ class QuangInputComponent extends QuangBaseComponent {
22
22
  this.resizable = input(true);
23
23
  this.buttonClass = input('');
24
24
  this.showHidePasswordButton = input(true);
25
- this.showPassword = output();
26
- this.onShowPassword = signal(false);
27
- this.componentInputType = computed(() => this.componentType() === 'password' && this.onShowPassword() ? 'text' : this.componentType());
25
+ this.showPassword = signal(false);
26
+ this.componentInputType = computed(() => this.componentType() === 'password' && this.showPassword() ? 'text' : this.componentType());
28
27
  toObservable(this.componentType)
29
28
  .pipe(takeUntilDestroyed(this.destroyRef))
30
29
  .subscribe(() => {
@@ -32,17 +31,16 @@ class QuangInputComponent extends QuangBaseComponent {
32
31
  });
33
32
  }
34
33
  onTogglePasswordVisibility() {
35
- this.onShowPassword.update((current) => !current);
36
- this.showPassword.emit(this.onShowPassword());
34
+ this.showPassword.update((current) => !current);
37
35
  }
38
36
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: QuangInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
39
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: QuangInputComponent, isStandalone: true, selector: "quang-input", inputs: { componentType: { classPropertyName: "componentType", publicName: "componentType", isSignal: true, isRequired: true, transformFunction: null }, maxLengthText: { classPropertyName: "maxLengthText", publicName: "maxLengthText", isSignal: true, isRequired: false, transformFunction: null }, minLengthText: { classPropertyName: "minLengthText", publicName: "minLengthText", isSignal: true, isRequired: false, transformFunction: null }, minNumber: { classPropertyName: "minNumber", publicName: "minNumber", isSignal: true, isRequired: false, transformFunction: null }, maxNumber: { classPropertyName: "maxNumber", publicName: "maxNumber", isSignal: true, isRequired: false, transformFunction: null }, componentStep: { classPropertyName: "componentStep", publicName: "componentStep", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, buttonClass: { classPropertyName: "buttonClass", publicName: "buttonClass", isSignal: true, isRequired: false, transformFunction: null }, showHidePasswordButton: { classPropertyName: "showHidePasswordButton", publicName: "showHidePasswordButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { showPassword: "showPassword" }, providers: [
37
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.4", type: QuangInputComponent, isStandalone: true, selector: "quang-input", inputs: { componentType: { classPropertyName: "componentType", publicName: "componentType", isSignal: true, isRequired: true, transformFunction: null }, maxLengthText: { classPropertyName: "maxLengthText", publicName: "maxLengthText", isSignal: true, isRequired: false, transformFunction: null }, minLengthText: { classPropertyName: "minLengthText", publicName: "minLengthText", isSignal: true, isRequired: false, transformFunction: null }, minNumber: { classPropertyName: "minNumber", publicName: "minNumber", isSignal: true, isRequired: false, transformFunction: null }, maxNumber: { classPropertyName: "maxNumber", publicName: "maxNumber", isSignal: true, isRequired: false, transformFunction: null }, componentStep: { classPropertyName: "componentStep", publicName: "componentStep", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, buttonClass: { classPropertyName: "buttonClass", publicName: "buttonClass", isSignal: true, isRequired: false, transformFunction: null }, showHidePasswordButton: { classPropertyName: "showHidePasswordButton", publicName: "showHidePasswordButton", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
40
38
  {
41
39
  provide: NG_VALUE_ACCESSOR,
42
40
  useExisting: forwardRef(() => QuangInputComponent),
43
41
  multi: true,
44
42
  },
45
- ], usesInheritance: true, ngImport: i0, template: "@if (componentType()) {\n <div class=\"mb-3\">\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n @if (componentType() !== 'textarea') {\n <div class=\"input-container\">\n <input\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.with-button-password]=\"showHidePasswordButton()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [max]=\"maxNumber()\"\n [min]=\"minNumber()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [step]=\"componentStep()\"\n [tabIndex]=\"componentTabIndex()\"\n [type]=\"componentInputType()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n autocomplete=\"off\"\n class=\"form-control\"\n />\n @if (componentType() === 'password' && showHidePasswordButton()) {\n <button\n [class.border-danger]=\"_showErrors()\"\n [class.border-success]=\"_showSuccess()\"\n [ngClass]=\"buttonClass()\"\n (click)=\"_ngControl()?.disabled ? null : onTogglePasswordVisibility()\"\n #calendarButton\n aria-label=\"calendar-button\"\n class=\"btn btn-outline-secondary btn-outline-password\"\n type=\"button\"\n >\n <ng-content></ng-content>\n </button>\n }\n </div>\n }\n @if (componentType() === 'textarea') {\n <textarea\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.no-resize]=\"!resizable()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n class=\"form-control\"\n ></textarea>\n }\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n </div>\n}\n", styles: ["input::-webkit-search-cancel-button{-webkit-appearance:none;height:.75rem;width:.75rem;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 3 1024 1024' width='12' height='12' fill='currentColor'%3E%3Cpath d='M9 1018q5 4 10.5 6.5 5.5 2.5 11.5 2.5 6 0 11.5-2.5 5.5-2.5 10.5-6.5l459-459 459 459q5 4 10.5 6.5 5.5 2.5 11.5 2.5 6 0 11.5-2.5 5.5-2.5 10.5-6.5 9-9 9-22 0-13-9-22l-459-459 459-459q9-9 9-22 0-13-9-22-9-9-22-9-13 0-22 9l-459 459-459-459q-9-9-22-9-13 0-22 9-9 9-9 22 0 13 9 22l459 459-459 459q-9 9-9 22 0 13 9 22l0 0z'/%3E%3C/svg%3E%0A\");cursor:pointer}:host{display:block}.no-resize{resize:none}.btn-outline-password{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0;min-width:unset;display:flex;border-color:var(--bs-border-color)}.input-container{display:flex}input{flex:1}input.with-button-password{border-top-right-radius:0;border-bottom-right-radius:0}input:disabled{border-radius:var(--bs-border-radius)}.border-danger{border-color:var(--bs-form-invalid-border-color)}.border-success{border-color:var(--bs-form-valid-border-color)}\n"], dependencies: [{ kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
43
+ ], usesInheritance: true, ngImport: i0, template: "@if (componentType()) {\n <div class=\"mb-3\">\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n @if (componentType() !== 'textarea') {\n <div class=\"input-container\">\n <input\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.with-button-password]=\"showHidePasswordButton()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [max]=\"maxNumber()\"\n [min]=\"minNumber()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [step]=\"componentStep()\"\n [tabIndex]=\"componentTabIndex()\"\n [type]=\"componentInputType()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n autocomplete=\"off\"\n class=\"form-control\"\n />\n @if (componentType() === 'password' && showHidePasswordButton()) {\n <button\n [class.border-danger]=\"_showErrors()\"\n [class.border-success]=\"_showSuccess()\"\n [ngClass]=\"buttonClass()\"\n (click)=\"_ngControl()?.disabled ? null : onTogglePasswordVisibility()\"\n #calendarButton\n aria-label=\"calendar-button\"\n class=\"btn btn-outline-secondary btn-outline-password\"\n type=\"button\"\n >\n @if (showPassword()) {\n <ng-content select=\"[hide-password]\"></ng-content>\n } @else {\n <ng-content select=\"[show-password]\"></ng-content>\n }\n </button>\n }\n </div>\n }\n @if (componentType() === 'textarea') {\n <textarea\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.no-resize]=\"!resizable()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n class=\"form-control\"\n ></textarea>\n }\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n </div>\n}\n", styles: ["input::-webkit-search-cancel-button{-webkit-appearance:none;height:.75rem;width:.75rem;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 3 1024 1024' width='12' height='12' fill='currentColor'%3E%3Cpath d='M9 1018q5 4 10.5 6.5 5.5 2.5 11.5 2.5 6 0 11.5-2.5 5.5-2.5 10.5-6.5l459-459 459 459q5 4 10.5 6.5 5.5 2.5 11.5 2.5 6 0 11.5-2.5 5.5-2.5 10.5-6.5 9-9 9-22 0-13-9-22l-459-459 459-459q9-9 9-22 0-13-9-22-9-9-22-9-13 0-22 9l-459 459-459-459q-9-9-22-9-13 0-22 9-9 9-9 22 0 13 9 22l459 459-459 459q-9 9-9 22 0 13 9 22l0 0z'/%3E%3C/svg%3E%0A\");cursor:pointer}:host{display:block}.no-resize{resize:none}.btn-outline-password{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0;min-width:unset;display:flex;border-color:var(--bs-border-color)}.input-container{display:flex}input{flex:1}input.with-button-password{border-top-right-radius:0;border-bottom-right-radius:0}input:disabled{border-radius:var(--bs-border-radius)}.border-danger{border-color:var(--bs-form-invalid-border-color)}.border-success{border-color:var(--bs-form-valid-border-color)}\n"], dependencies: [{ kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
46
44
  }
47
45
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: QuangInputComponent, decorators: [{
48
46
  type: Component,
@@ -52,7 +50,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImpor
52
50
  useExisting: forwardRef(() => QuangInputComponent),
53
51
  multi: true,
54
52
  },
55
- ], imports: [TranslocoPipe, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (componentType()) {\n <div class=\"mb-3\">\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n @if (componentType() !== 'textarea') {\n <div class=\"input-container\">\n <input\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.with-button-password]=\"showHidePasswordButton()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [max]=\"maxNumber()\"\n [min]=\"minNumber()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [step]=\"componentStep()\"\n [tabIndex]=\"componentTabIndex()\"\n [type]=\"componentInputType()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n autocomplete=\"off\"\n class=\"form-control\"\n />\n @if (componentType() === 'password' && showHidePasswordButton()) {\n <button\n [class.border-danger]=\"_showErrors()\"\n [class.border-success]=\"_showSuccess()\"\n [ngClass]=\"buttonClass()\"\n (click)=\"_ngControl()?.disabled ? null : onTogglePasswordVisibility()\"\n #calendarButton\n aria-label=\"calendar-button\"\n class=\"btn btn-outline-secondary btn-outline-password\"\n type=\"button\"\n >\n <ng-content></ng-content>\n </button>\n }\n </div>\n }\n @if (componentType() === 'textarea') {\n <textarea\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.no-resize]=\"!resizable()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n class=\"form-control\"\n ></textarea>\n }\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n </div>\n}\n", styles: ["input::-webkit-search-cancel-button{-webkit-appearance:none;height:.75rem;width:.75rem;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 3 1024 1024' width='12' height='12' fill='currentColor'%3E%3Cpath d='M9 1018q5 4 10.5 6.5 5.5 2.5 11.5 2.5 6 0 11.5-2.5 5.5-2.5 10.5-6.5l459-459 459 459q5 4 10.5 6.5 5.5 2.5 11.5 2.5 6 0 11.5-2.5 5.5-2.5 10.5-6.5 9-9 9-22 0-13-9-22l-459-459 459-459q9-9 9-22 0-13-9-22-9-9-22-9-13 0-22 9l-459 459-459-459q-9-9-22-9-13 0-22 9-9 9-9 22 0 13 9 22l459 459-459 459q-9 9-9 22 0 13 9 22l0 0z'/%3E%3C/svg%3E%0A\");cursor:pointer}:host{display:block}.no-resize{resize:none}.btn-outline-password{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0;min-width:unset;display:flex;border-color:var(--bs-border-color)}.input-container{display:flex}input{flex:1}input.with-button-password{border-top-right-radius:0;border-bottom-right-radius:0}input:disabled{border-radius:var(--bs-border-radius)}.border-danger{border-color:var(--bs-form-invalid-border-color)}.border-success{border-color:var(--bs-form-valid-border-color)}\n"] }]
53
+ ], imports: [TranslocoPipe, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (componentType()) {\n <div class=\"mb-3\">\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n @if (componentType() !== 'textarea') {\n <div class=\"input-container\">\n <input\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.with-button-password]=\"showHidePasswordButton()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [max]=\"maxNumber()\"\n [min]=\"minNumber()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [step]=\"componentStep()\"\n [tabIndex]=\"componentTabIndex()\"\n [type]=\"componentInputType()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n autocomplete=\"off\"\n class=\"form-control\"\n />\n @if (componentType() === 'password' && showHidePasswordButton()) {\n <button\n [class.border-danger]=\"_showErrors()\"\n [class.border-success]=\"_showSuccess()\"\n [ngClass]=\"buttonClass()\"\n (click)=\"_ngControl()?.disabled ? null : onTogglePasswordVisibility()\"\n #calendarButton\n aria-label=\"calendar-button\"\n class=\"btn btn-outline-secondary btn-outline-password\"\n type=\"button\"\n >\n @if (showPassword()) {\n <ng-content select=\"[hide-password]\"></ng-content>\n } @else {\n <ng-content select=\"[show-password]\"></ng-content>\n }\n </button>\n }\n </div>\n }\n @if (componentType() === 'textarea') {\n <textarea\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.no-resize]=\"!resizable()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n class=\"form-control\"\n ></textarea>\n }\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n </div>\n}\n", styles: ["input::-webkit-search-cancel-button{-webkit-appearance:none;height:.75rem;width:.75rem;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 3 1024 1024' width='12' height='12' fill='currentColor'%3E%3Cpath d='M9 1018q5 4 10.5 6.5 5.5 2.5 11.5 2.5 6 0 11.5-2.5 5.5-2.5 10.5-6.5l459-459 459 459q5 4 10.5 6.5 5.5 2.5 11.5 2.5 6 0 11.5-2.5 5.5-2.5 10.5-6.5 9-9 9-22 0-13-9-22l-459-459 459-459q9-9 9-22 0-13-9-22-9-9-22-9-13 0-22 9l-459 459-459-459q-9-9-22-9-13 0-22 9-9 9-9 22 0 13 9 22l459 459-459 459q-9 9-9 22 0 13 9 22l0 0z'/%3E%3C/svg%3E%0A\");cursor:pointer}:host{display:block}.no-resize{resize:none}.btn-outline-password{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0;min-width:unset;display:flex;border-color:var(--bs-border-color)}.input-container{display:flex}input{flex:1}input.with-button-password{border-top-right-radius:0;border-bottom-right-radius:0}input:disabled{border-radius:var(--bs-border-radius)}.border-danger{border-color:var(--bs-form-invalid-border-color)}.border-success{border-color:var(--bs-form-valid-border-color)}\n"] }]
56
54
  }], ctorParameters: () => [] });
57
55
 
58
56
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"quang-components-input.mjs","sources":["../../../projects/quang/components/input/input.component.ts","../../../projects/quang/components/input/input.component.html","../../../projects/quang/components/input/quang-components-input.ts"],"sourcesContent":["import { NgClass } from '@angular/common'\nimport { ChangeDetectionStrategy, Component, computed, forwardRef, input, output, signal } from '@angular/core'\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop'\nimport { NG_VALUE_ACCESSOR } from '@angular/forms'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\n\nimport { QuangBaseComponent } from 'quang/components/shared'\n\nexport type InputType = 'text' | 'textarea' | 'password' | 'email' | 'number' | 'url' | 'search' | 'tel' | 'color'\n\n@Component({\n selector: 'quang-input',\n templateUrl: './input.component.html',\n styleUrl: './input.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => QuangInputComponent),\n multi: true,\n },\n ],\n imports: [TranslocoPipe, NgClass],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * Input component that handles all the types declared in {@link InputType}\n * @property {boolean} resizable just for textarea {@link InputType}\n */\nexport class QuangInputComponent extends QuangBaseComponent<string | number> {\n componentType = input.required<InputType>()\n\n maxLengthText = input<number | null>(null)\n\n minLengthText = input<number | null>(null)\n\n minNumber = input<number | undefined>(undefined)\n\n maxNumber = input<number | undefined>(undefined)\n\n componentStep = input<number>(1)\n\n resizable = input(true)\n\n buttonClass = input<string>('')\n\n showHidePasswordButton = input(true)\n\n showPassword = output<boolean>()\n\n private onShowPassword = signal<boolean>(false)\n\n componentInputType = computed<InputType>(() =>\n this.componentType() === 'password' && this.onShowPassword() ? 'text' : this.componentType()\n )\n\n constructor() {\n super()\n toObservable(this.componentType)\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => {\n this.setupFormControl()\n })\n }\n\n onTogglePasswordVisibility(): void {\n this.onShowPassword.update((current) => !current)\n this.showPassword.emit(this.onShowPassword())\n }\n}\n","@if (componentType()) {\n <div class=\"mb-3\">\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n @if (componentType() !== 'textarea') {\n <div class=\"input-container\">\n <input\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.with-button-password]=\"showHidePasswordButton()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [max]=\"maxNumber()\"\n [min]=\"minNumber()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [step]=\"componentStep()\"\n [tabIndex]=\"componentTabIndex()\"\n [type]=\"componentInputType()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n autocomplete=\"off\"\n class=\"form-control\"\n />\n @if (componentType() === 'password' && showHidePasswordButton()) {\n <button\n [class.border-danger]=\"_showErrors()\"\n [class.border-success]=\"_showSuccess()\"\n [ngClass]=\"buttonClass()\"\n (click)=\"_ngControl()?.disabled ? null : onTogglePasswordVisibility()\"\n #calendarButton\n aria-label=\"calendar-button\"\n class=\"btn btn-outline-secondary btn-outline-password\"\n type=\"button\"\n >\n <ng-content></ng-content>\n </button>\n }\n </div>\n }\n @if (componentType() === 'textarea') {\n <textarea\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.no-resize]=\"!resizable()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n class=\"form-control\"\n ></textarea>\n }\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"quang-components-input.mjs","sources":["../../../projects/quang/components/input/input.component.ts","../../../projects/quang/components/input/input.component.html","../../../projects/quang/components/input/quang-components-input.ts"],"sourcesContent":["import { NgClass } from '@angular/common'\nimport { ChangeDetectionStrategy, Component, computed, forwardRef, input, signal } from '@angular/core'\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop'\nimport { NG_VALUE_ACCESSOR } from '@angular/forms'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\n\nimport { QuangBaseComponent } from 'quang/components/shared'\n\nexport type InputType = 'text' | 'textarea' | 'password' | 'email' | 'number' | 'url' | 'search' | 'tel' | 'color'\n\n@Component({\n selector: 'quang-input',\n templateUrl: './input.component.html',\n styleUrl: './input.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => QuangInputComponent),\n multi: true,\n },\n ],\n imports: [TranslocoPipe, NgClass],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * Input component that handles all the types declared in {@link InputType}\n * @property {boolean} resizable just for textarea {@link InputType}\n */\nexport class QuangInputComponent extends QuangBaseComponent<string | number> {\n componentType = input.required<InputType>()\n\n maxLengthText = input<number | null>(null)\n\n minLengthText = input<number | null>(null)\n\n minNumber = input<number | undefined>(undefined)\n\n maxNumber = input<number | undefined>(undefined)\n\n componentStep = input<number>(1)\n\n resizable = input(true)\n\n buttonClass = input<string>('')\n\n showHidePasswordButton = input(true)\n\n showPassword = signal<boolean>(false)\n\n componentInputType = computed<InputType>(() =>\n this.componentType() === 'password' && this.showPassword() ? 'text' : this.componentType()\n )\n\n constructor() {\n super()\n toObservable(this.componentType)\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => {\n this.setupFormControl()\n })\n }\n\n onTogglePasswordVisibility(): void {\n this.showPassword.update((current) => !current)\n }\n}\n","@if (componentType()) {\n <div class=\"mb-3\">\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n @if (componentType() !== 'textarea') {\n <div class=\"input-container\">\n <input\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [attr.required]=\"getIsRequiredControl()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.with-button-password]=\"showHidePasswordButton()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [max]=\"maxNumber()\"\n [min]=\"minNumber()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [step]=\"componentStep()\"\n [tabIndex]=\"componentTabIndex()\"\n [type]=\"componentInputType()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n autocomplete=\"off\"\n class=\"form-control\"\n />\n @if (componentType() === 'password' && showHidePasswordButton()) {\n <button\n [class.border-danger]=\"_showErrors()\"\n [class.border-success]=\"_showSuccess()\"\n [ngClass]=\"buttonClass()\"\n (click)=\"_ngControl()?.disabled ? null : onTogglePasswordVisibility()\"\n #calendarButton\n aria-label=\"calendar-button\"\n class=\"btn btn-outline-secondary btn-outline-password\"\n type=\"button\"\n >\n @if (showPassword()) {\n <ng-content select=\"[hide-password]\"></ng-content>\n } @else {\n <ng-content select=\"[show-password]\"></ng-content>\n }\n </button>\n }\n </div>\n }\n @if (componentType() === 'textarea') {\n <textarea\n [attr.maxLength]=\"maxLengthText()\"\n [attr.minLength]=\"minLengthText()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\n [class.no-resize]=\"!resizable()\"\n [disabled]=\"_isDisabled()\"\n [id]=\"componentId()\"\n [ngClass]=\"componentClass()\"\n [placeholder]=\"componentPlaceholder() | transloco\"\n [readOnly]=\"isReadonly()\"\n [tabIndex]=\"componentTabIndex()\"\n [value]=\"_value()\"\n (blur)=\"onBlurHandler()\"\n (input)=\"onChangedEventHandler($event)\"\n class=\"form-control\"\n ></textarea>\n }\n <div class=\"valid-feedback\">\n {{ successMessage() | transloco }}\n </div>\n <div class=\"invalid-feedback\">\n {{ _currentErrorMessage() | transloco: _currentErrorMessageExtraData() }}\n </div>\n @if (helpMessage()) {\n <small\n [hidden]=\"_showSuccess() || _showErrors()\"\n aria-live=\"assertive\"\n class=\"form-text text-muted\"\n >\n {{ helpMessage() | transloco }}\n </small>\n }\n </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "quang",
3
3
  "sideEffects": false,
4
- "version": "20.2.1",
4
+ "version": "20.2.2",
5
5
  "dependencies": {
6
6
  "tslib": "^2.3.0"
7
7
  },
@@ -63,10 +63,6 @@
63
63
  "types": "./index.d.ts",
64
64
  "default": "./fesm2022/quang.mjs"
65
65
  },
66
- "./auth": {
67
- "types": "./auth/index.d.ts",
68
- "default": "./fesm2022/quang-auth.mjs"
69
- },
70
66
  "./data-handling": {
71
67
  "types": "./data-handling/index.d.ts",
72
68
  "default": "./fesm2022/quang-data-handling.mjs"
@@ -75,14 +71,6 @@
75
71
  "types": "./device/index.d.ts",
76
72
  "default": "./fesm2022/quang-device.mjs"
77
73
  },
78
- "./forms": {
79
- "types": "./forms/index.d.ts",
80
- "default": "./fesm2022/quang-forms.mjs"
81
- },
82
- "./loader": {
83
- "types": "./loader/index.d.ts",
84
- "default": "./fesm2022/quang-loader.mjs"
85
- },
86
74
  "./shared": {
87
75
  "types": "./shared/index.d.ts",
88
76
  "default": "./fesm2022/quang-shared.mjs"
@@ -91,54 +79,70 @@
91
79
  "types": "./translation/index.d.ts",
92
80
  "default": "./fesm2022/quang-translation.mjs"
93
81
  },
94
- "./auth/mobile": {
95
- "types": "./auth/mobile/index.d.ts",
96
- "default": "./fesm2022/quang-auth-mobile.mjs"
82
+ "./auth": {
83
+ "types": "./auth/index.d.ts",
84
+ "default": "./fesm2022/quang-auth.mjs"
85
+ },
86
+ "./forms": {
87
+ "types": "./forms/index.d.ts",
88
+ "default": "./fesm2022/quang-forms.mjs"
89
+ },
90
+ "./loader": {
91
+ "types": "./loader/index.d.ts",
92
+ "default": "./fesm2022/quang-loader.mjs"
97
93
  },
98
94
  "./components/autocomplete": {
99
95
  "types": "./components/autocomplete/index.d.ts",
100
96
  "default": "./fesm2022/quang-components-autocomplete.mjs"
101
97
  },
98
+ "./components/input": {
99
+ "types": "./components/input/index.d.ts",
100
+ "default": "./fesm2022/quang-components-input.mjs"
101
+ },
102
+ "./components/select": {
103
+ "types": "./components/select/index.d.ts",
104
+ "default": "./fesm2022/quang-components-select.mjs"
105
+ },
102
106
  "./components/checkbox": {
103
107
  "types": "./components/checkbox/index.d.ts",
104
108
  "default": "./fesm2022/quang-components-checkbox.mjs"
105
109
  },
110
+ "./components/table": {
111
+ "types": "./components/table/index.d.ts",
112
+ "default": "./fesm2022/quang-components-table.mjs"
113
+ },
106
114
  "./components/date": {
107
115
  "types": "./components/date/index.d.ts",
108
116
  "default": "./fesm2022/quang-components-date.mjs"
109
117
  },
110
- "./components/input": {
111
- "types": "./components/input/index.d.ts",
112
- "default": "./fesm2022/quang-components-input.mjs"
113
- },
114
118
  "./components/paginator": {
115
119
  "types": "./components/paginator/index.d.ts",
116
120
  "default": "./fesm2022/quang-components-paginator.mjs"
117
121
  },
118
- "./components/select": {
119
- "types": "./components/select/index.d.ts",
120
- "default": "./fesm2022/quang-components-select.mjs"
122
+ "./overlay/popover": {
123
+ "types": "./overlay/popover/index.d.ts",
124
+ "default": "./fesm2022/quang-overlay-popover.mjs"
121
125
  },
122
126
  "./components/shared": {
123
127
  "types": "./components/shared/index.d.ts",
124
128
  "default": "./fesm2022/quang-components-shared.mjs"
125
129
  },
126
- "./components/table": {
127
- "types": "./components/table/index.d.ts",
128
- "default": "./fesm2022/quang-components-table.mjs"
129
- },
130
130
  "./components/wysiwyg": {
131
131
  "types": "./components/wysiwyg/index.d.ts",
132
132
  "default": "./fesm2022/quang-components-wysiwyg.mjs"
133
133
  },
134
+ "./overlay/tooltip": {
135
+ "types": "./overlay/tooltip/index.d.ts",
136
+ "default": "./fesm2022/quang-overlay-tooltip.mjs"
137
+ },
138
+ "./auth/mobile": {
139
+ "types": "./auth/mobile/index.d.ts",
140
+ "default": "./fesm2022/quang-auth-mobile.mjs"
141
+ },
134
142
  "./overlay/modal": {
135
143
  "types": "./overlay/modal/index.d.ts",
136
144
  "default": "./fesm2022/quang-overlay-modal.mjs"
137
145
  },
138
- "./overlay/popover": {
139
- "types": "./overlay/popover/index.d.ts",
140
- "default": "./fesm2022/quang-overlay-popover.mjs"
141
- },
142
146
  "./overlay/shared": {
143
147
  "types": "./overlay/shared/index.d.ts",
144
148
  "default": "./fesm2022/quang-overlay-shared.mjs"
@@ -146,10 +150,6 @@
146
150
  "./overlay/toast": {
147
151
  "types": "./overlay/toast/index.d.ts",
148
152
  "default": "./fesm2022/quang-overlay-toast.mjs"
149
- },
150
- "./overlay/tooltip": {
151
- "types": "./overlay/tooltip/index.d.ts",
152
- "default": "./fesm2022/quang-overlay-tooltip.mjs"
153
153
  }
154
154
  }
155
155
  }