quang 19.3.16-1 → 19.4.0
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/components/autocomplete/README.md +34 -0
- package/components/autocomplete/autocomplete.component.d.ts +2 -0
- package/components/date/date.component.d.ts +10 -1
- package/components/select/README.md +34 -0
- package/components/select/select.component.d.ts +1 -0
- package/components/shared/option-list/option-list.component.d.ts +7 -1
- package/components/shared/quang-base-component.directive.d.ts +3 -1
- package/fesm2022/quang-components-autocomplete.mjs +9 -3
- package/fesm2022/quang-components-autocomplete.mjs.map +1 -1
- package/fesm2022/quang-components-checkbox.mjs +2 -2
- package/fesm2022/quang-components-checkbox.mjs.map +1 -1
- package/fesm2022/quang-components-date.mjs +249 -132
- package/fesm2022/quang-components-date.mjs.map +1 -1
- package/fesm2022/quang-components-input.mjs +2 -2
- package/fesm2022/quang-components-input.mjs.map +1 -1
- package/fesm2022/quang-components-select.mjs +6 -3
- package/fesm2022/quang-components-select.mjs.map +1 -1
- package/fesm2022/quang-components-shared.mjs +35 -14
- package/fesm2022/quang-components-shared.mjs.map +1 -1
- package/package.json +36 -36
|
@@ -32,7 +32,7 @@ class QuangCheckboxComponent extends QuangBaseComponent {
|
|
|
32
32
|
useExisting: forwardRef(() => QuangCheckboxComponent),
|
|
33
33
|
multi: true,
|
|
34
34
|
},
|
|
35
|
-
], usesInheritance: true, ngImport: i0, template: "<div\n [class.form-
|
|
35
|
+
], usesInheritance: true, ngImport: i0, template: "<div\n [class.form-switch]=\"checkType() === 'toggle'\"\n [class.label-bottom]=\"labelPosition() === 'bottom'\"\n [class.label-left]=\"labelPosition() === 'left'\"\n [class.label-right]=\"labelPosition() === 'right'\"\n [class.label-top]=\"labelPosition() === 'top'\"\n [class.toggle-wrapper]=\"checkType() === 'toggle'\"\n [ngClass]=\"{ 'mb-3': !removeMargin(), 'form-check': !removeMargin() }\"\n>\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n [ngClass]=\"{ 'cursor-pointer': !_isDisabled() }\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n <input\n [attr.required]=\"getIsRequiredControl()\"\n [attr.role]=\"checkType() === 'checkbox' ? 'checkbox' : 'switch'\"\n [checked]=\"_value()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\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-check-input {{ _isDisabled() ? '' : 'cursor-pointer' }}\"\n type=\"checkbox\"\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", styles: [":host{display:block}.label-top{display:flex;flex-direction:column;padding-left:0}.label-top .form-check-input{float:none;margin-left:0;margin-right:0}.label-bottom{display:flex;flex-direction:column-reverse;padding-left:0}.label-bottom .form-check-input{float:none;margin-left:0;margin-right:0}.label-right{display:flex;flex-direction:row-reverse;justify-content:flex-end;align-items:center;gap:.5rem;padding-left:0}.label-right label{margin-bottom:0;align-self:center}.label-right .form-check-input{float:none;margin-left:0;margin-right:0}.label-left{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:.5rem;padding-left:0}.label-left label{margin-bottom:0;align-self:center}.label-left .form-check-input{float:none;margin-left:0;margin-right:0}.toggle-wrapper{display:flex;padding-left:unset}.toggle-wrapper label{display:block}.toggle-wrapper input{margin-left:unset;width:3em;height:1.5em}.direction-row{flex-direction:row}.direction-row .form-label{margin-right:.5rem}.direction-reverse-row{flex-direction:row-reverse;justify-content:start}.direction-reverse-row input{margin-right:.5rem}.direction-column{flex-direction:column}.cursor-pointer{cursor:pointer}\n"], dependencies: [{ kind: "pipe", type: TranslocoPipe, name: "transloco" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
36
36
|
}
|
|
37
37
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: QuangCheckboxComponent, decorators: [{
|
|
38
38
|
type: Component,
|
|
@@ -42,7 +42,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
42
42
|
useExisting: forwardRef(() => QuangCheckboxComponent),
|
|
43
43
|
multi: true,
|
|
44
44
|
},
|
|
45
|
-
], imports: [TranslocoPipe, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [class.form-
|
|
45
|
+
], imports: [TranslocoPipe, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [class.form-switch]=\"checkType() === 'toggle'\"\n [class.label-bottom]=\"labelPosition() === 'bottom'\"\n [class.label-left]=\"labelPosition() === 'left'\"\n [class.label-right]=\"labelPosition() === 'right'\"\n [class.label-top]=\"labelPosition() === 'top'\"\n [class.toggle-wrapper]=\"checkType() === 'toggle'\"\n [ngClass]=\"{ 'mb-3': !removeMargin(), 'form-check': !removeMargin() }\"\n>\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n [ngClass]=\"{ 'cursor-pointer': !_isDisabled() }\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n <input\n [attr.required]=\"getIsRequiredControl()\"\n [attr.role]=\"checkType() === 'checkbox' ? 'checkbox' : 'switch'\"\n [checked]=\"_value()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\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-check-input {{ _isDisabled() ? '' : 'cursor-pointer' }}\"\n type=\"checkbox\"\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", styles: [":host{display:block}.label-top{display:flex;flex-direction:column;padding-left:0}.label-top .form-check-input{float:none;margin-left:0;margin-right:0}.label-bottom{display:flex;flex-direction:column-reverse;padding-left:0}.label-bottom .form-check-input{float:none;margin-left:0;margin-right:0}.label-right{display:flex;flex-direction:row-reverse;justify-content:flex-end;align-items:center;gap:.5rem;padding-left:0}.label-right label{margin-bottom:0;align-self:center}.label-right .form-check-input{float:none;margin-left:0;margin-right:0}.label-left{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:.5rem;padding-left:0}.label-left label{margin-bottom:0;align-self:center}.label-left .form-check-input{float:none;margin-left:0;margin-right:0}.toggle-wrapper{display:flex;padding-left:unset}.toggle-wrapper label{display:block}.toggle-wrapper input{margin-left:unset;width:3em;height:1.5em}.direction-row{flex-direction:row}.direction-row .form-label{margin-right:.5rem}.direction-reverse-row{flex-direction:row-reverse;justify-content:start}.direction-reverse-row input{margin-right:.5rem}.direction-column{flex-direction:column}.cursor-pointer{cursor:pointer}\n"] }]
|
|
46
46
|
}] });
|
|
47
47
|
|
|
48
48
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"quang-components-checkbox.mjs","sources":["../../../projects/quang/components/checkbox/checkbox.component.ts","../../../projects/quang/components/checkbox/checkbox.component.html","../../../projects/quang/components/checkbox/quang-components-checkbox.ts"],"sourcesContent":["import { NgClass } from '@angular/common'\nimport { ChangeDetectionStrategy, Component, forwardRef, input } from '@angular/core'\nimport { NG_VALUE_ACCESSOR } from '@angular/forms'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\n\nimport { QuangBaseComponent } from 'quang/components/shared'\n\nexport type LabelPosition = 'top' | 'left' | 'right' | 'bottom'\n\n@Component({\n selector: 'quang-checkbox',\n templateUrl: './checkbox.component.html',\n styleUrl: './checkbox.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => QuangCheckboxComponent),\n multi: true,\n },\n ],\n imports: [TranslocoPipe, NgClass],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * Checkbox component for rendering a `checkbox` or a `toggle` switch.\n *\n * @usageNotes\n * This component can be configured to display as a standard checkbox or as a toggle switch,\n * depending on the `checkType` input property.\n *\n * The component label can be aligned in {@link LabelPosition} by setting the `labelPosition` input property.\n */\nexport class QuangCheckboxComponent extends QuangBaseComponent<boolean> {\n labelPosition = input<LabelPosition>('top')\n\n checkType = input.required<'checkbox' | 'toggle'>()\n\n removeMargin = input<boolean>(false)\n\n override onChangedEventHandler($event: Event) {\n const inputElement = $event.target as HTMLInputElement\n this.onChangedHandler(inputElement.checked)\n }\n}\n","<div\n [class.form-
|
|
1
|
+
{"version":3,"file":"quang-components-checkbox.mjs","sources":["../../../projects/quang/components/checkbox/checkbox.component.ts","../../../projects/quang/components/checkbox/checkbox.component.html","../../../projects/quang/components/checkbox/quang-components-checkbox.ts"],"sourcesContent":["import { NgClass } from '@angular/common'\nimport { ChangeDetectionStrategy, Component, forwardRef, input } from '@angular/core'\nimport { NG_VALUE_ACCESSOR } from '@angular/forms'\n\nimport { TranslocoPipe } from '@jsverse/transloco'\n\nimport { QuangBaseComponent } from 'quang/components/shared'\n\nexport type LabelPosition = 'top' | 'left' | 'right' | 'bottom'\n\n@Component({\n selector: 'quang-checkbox',\n templateUrl: './checkbox.component.html',\n styleUrl: './checkbox.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => QuangCheckboxComponent),\n multi: true,\n },\n ],\n imports: [TranslocoPipe, NgClass],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\n/**\n * Checkbox component for rendering a `checkbox` or a `toggle` switch.\n *\n * @usageNotes\n * This component can be configured to display as a standard checkbox or as a toggle switch,\n * depending on the `checkType` input property.\n *\n * The component label can be aligned in {@link LabelPosition} by setting the `labelPosition` input property.\n */\nexport class QuangCheckboxComponent extends QuangBaseComponent<boolean> {\n labelPosition = input<LabelPosition>('top')\n\n checkType = input.required<'checkbox' | 'toggle'>()\n\n removeMargin = input<boolean>(false)\n\n override onChangedEventHandler($event: Event) {\n const inputElement = $event.target as HTMLInputElement\n this.onChangedHandler(inputElement.checked)\n }\n}\n","<div\n [class.form-switch]=\"checkType() === 'toggle'\"\n [class.label-bottom]=\"labelPosition() === 'bottom'\"\n [class.label-left]=\"labelPosition() === 'left'\"\n [class.label-right]=\"labelPosition() === 'right'\"\n [class.label-top]=\"labelPosition() === 'top'\"\n [class.toggle-wrapper]=\"checkType() === 'toggle'\"\n [ngClass]=\"{ 'mb-3': !removeMargin(), 'form-check': !removeMargin() }\"\n>\n @if (componentLabel()) {\n <label\n [htmlFor]=\"componentId()\"\n [ngClass]=\"{ 'cursor-pointer': !_isDisabled() }\"\n class=\"form-label\"\n >\n {{ componentLabel() | transloco }}\n <span [hidden]=\"!_isRequired()\">*</span>\n </label>\n }\n <input\n [attr.required]=\"getIsRequiredControl()\"\n [attr.role]=\"checkType() === 'checkbox' ? 'checkbox' : 'switch'\"\n [checked]=\"_value()\"\n [class.is-invalid]=\"_showErrors()\"\n [class.is-valid]=\"_showSuccess()\"\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-check-input {{ _isDisabled() ? '' : 'cursor-pointer' }}\"\n type=\"checkbox\"\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 * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;AAwBA;;;;;;;;AAQG;AACG,MAAO,sBAAuB,SAAQ,kBAA2B,CAAA;AAvBvE,IAAA,WAAA,GAAA;;AAwBE,QAAA,IAAA,CAAA,aAAa,GAAG,KAAK,CAAgB,KAAK,CAAC;AAE3C,QAAA,IAAA,CAAA,SAAS,GAAG,KAAK,CAAC,QAAQ,EAAyB;AAEnD,QAAA,IAAA,CAAA,YAAY,GAAG,KAAK,CAAU,KAAK,CAAC;AAMrC;AAJU,IAAA,qBAAqB,CAAC,MAAa,EAAA;AAC1C,QAAA,MAAM,YAAY,GAAG,MAAM,CAAC,MAA0B;AACtD,QAAA,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC,OAAO,CAAC;;+GATlC,sBAAsB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,sBAAsB,EAnBtB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,SAAA,EAAA;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,sBAAsB,CAAC;AACrD,gBAAA,KAAK,EAAE,IAAI;AACZ,aAAA;AACF,SAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECpBH,ixDAqDA,EAAA,MAAA,EAAA,CAAA,+qCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EDhCY,aAAa,EAAA,IAAA,EAAA,WAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAYrB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAvBlC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,gBAAgB,EAGf,SAAA,EAAA;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,4BAA4B,CAAC;AACrD,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;qBACF,EACQ,OAAA,EAAA,CAAC,aAAa,EAAE,OAAO,CAAC,EAChB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,ixDAAA,EAAA,MAAA,EAAA,CAAA,+qCAAA,CAAA,EAAA;;;AEtBjD;;AAEG;;;;"}
|