@apexara/ng-components 1.0.5 → 1.0.6-test.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.
- package/README.md +298 -25
- package/fesm2022/apexara-ng-components-checkbox.mjs +53 -11
- package/fesm2022/apexara-ng-components-checkbox.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-chip.mjs +5 -2
- package/fesm2022/apexara-ng-components-chip.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-datepicker.mjs +65 -70
- package/fesm2022/apexara-ng-components-datepicker.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-dialog.mjs +2 -2
- package/fesm2022/apexara-ng-components-dialog.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-drawer.mjs +12 -22
- package/fesm2022/apexara-ng-components-drawer.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-expander.mjs +3 -15
- package/fesm2022/apexara-ng-components-expander.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-image.mjs +3 -5
- package/fesm2022/apexara-ng-components-image.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-input.mjs +19 -19
- package/fesm2022/apexara-ng-components-input.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-listbox.mjs +41 -33
- package/fesm2022/apexara-ng-components-listbox.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-more-options.mjs +132 -0
- package/fesm2022/apexara-ng-components-more-options.mjs.map +1 -0
- package/fesm2022/apexara-ng-components-radiobutton.mjs +2 -2
- package/fesm2022/apexara-ng-components-radiobutton.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-select.mjs +96 -79
- package/fesm2022/apexara-ng-components-select.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-snackbar.mjs +2 -44
- package/fesm2022/apexara-ng-components-snackbar.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-table.mjs +175 -102
- package/fesm2022/apexara-ng-components-table.mjs.map +1 -1
- package/fesm2022/apexara-ng-components-textarea.mjs +20 -17
- package/fesm2022/apexara-ng-components-textarea.mjs.map +1 -1
- package/package.json +5 -2
- package/types/apexara-ng-components-checkbox.d.ts +17 -8
- package/types/apexara-ng-components-chip.d.ts +7 -1
- package/types/apexara-ng-components-datepicker.d.ts +4 -6
- package/types/apexara-ng-components-drawer.d.ts +3 -4
- package/types/apexara-ng-components-image.d.ts +2 -3
- package/types/apexara-ng-components-input.d.ts +6 -8
- package/types/apexara-ng-components-listbox.d.ts +7 -8
- package/types/apexara-ng-components-more-options.d.ts +34 -0
- package/types/apexara-ng-components-select.d.ts +13 -10
- package/types/apexara-ng-components-snackbar.d.ts +0 -3
- package/types/apexara-ng-components-table.d.ts +46 -23
- package/types/apexara-ng-components-textarea.d.ts +6 -8
|
@@ -16,7 +16,7 @@ class ApexRadioButtonComponent {
|
|
|
16
16
|
this.selectChange.emit(item);
|
|
17
17
|
}
|
|
18
18
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ApexRadioButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
19
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: ApexRadioButtonComponent, isStandalone: true, selector: "apex-radio-button", inputs: { options: "options" }, outputs: { selectChange: "selectChange" }, ngImport: i0, template: "@if (options) {\n @if (options.formGroup && options.formControlName) {\n <div class=\"container\" [formGroup]=\"options.formGroup\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item) {\n <label class=\"radio-button\" [ngClass]=\"{ 'disabled': options.formGroup.controls[options.formControlName].disabled }\">\n <input type=\"radio\" [value]=\"item.value\" [formControlName]=\"options.formControlName\"/>\n \n <span>{{ item.label }}</span>\n </label>\n }\n </div>\n } @else {\n <div class=\"container\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item; let i = $index) {\n <label class=\"radio-button\">\n <input type=\"radio\" [name]=\"buttonGroupId\" [checked]=\"i === options.checked\" (change)=\"onChange(item)\">\n\n <span>{{ item.label }}</span>\n\n @if (item.tooltip) {\n <svg class=\"tooltip-icon\" [apexTooltip]=\"item.tooltip\" [tooltipPosition]=\"tooltipPositionAbove\" width=\"16\" height=\"16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g>\n <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 7.5H8V11h.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M8.25 5.25a.25.25 0 1 1-.5 0 .25.25 0 0 1 .5 0z\" fill=\"#fff\"/>\n </g>\n </svg>\n }\n </label>\n }\n </div>\n }\n}\n", styles: [".container{display:flex;flex-direction:column}.inline{flex-direction:row}.radio-button{display:flex;align-items:center;cursor:pointer}.container.inline label{margin-right:16px}.radio-button.disabled{opacity:.5;cursor:not-allowed}input[type=radio]{width:20px;height:20px;background-color:var(--apex-radio-button-background-color, #FFFFFF);cursor:pointer;transition:border .12s ease-in-out;appearance:none;-webkit-appearance:none;border:2px solid var(--apex-radio-button-unchecked-border-color, #E9E9E9);border-radius:50%;margin:0 8px 0 0}input[type=radio]:focus{outline:var(--apex-radio-button-outline-color, none)}input[type=radio]:checked{border:5px solid var(--apex-radio-button-checked-border-color, #F96138)}.radio-button.disabled input[type=radio]{border:5px solid var(--apex-radio-button-disabled-border-color, #E7E7E7)}.radio-button span{color:var(--apex-radio-button-text-color, #5D6068);font-size:14px;margin-right:4px}.tooltip-icon{overflow:visible}.tooltip-icon path{fill:var(--apex-radio-button-tooltip-icon-fill, transparent);stroke:var(--apex-radio-button-tooltip-icon-stroke, #C6C6C6)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: ApexTooltipDirective, selector: "[apexTooltip]", inputs: ["apexTooltip", "tooltipPosition"] }] }); }
|
|
19
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: ApexRadioButtonComponent, isStandalone: true, selector: "apex-radio-button", inputs: { options: "options" }, outputs: { selectChange: "selectChange" }, ngImport: i0, template: "@if (options) {\n @if (options.formGroup && options.formControlName) {\n <div class=\"container\" [formGroup]=\"options.formGroup\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item) {\n <label class=\"radio-button\" [ngClass]=\"{ 'disabled': options.formGroup.controls[options.formControlName].disabled }\">\n <input type=\"radio\" [value]=\"item.value\" [formControlName]=\"options.formControlName\"/>\n \n <span>{{ item.label }}</span>\n </label>\n }\n </div>\n } @else {\n <div class=\"container\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item; let i = $index) {\n <label class=\"radio-button\">\n <input type=\"radio\" [name]=\"buttonGroupId\" [checked]=\"i === options.checked\" (change)=\"onChange(item)\">\n\n <span>{{ item.label }}</span>\n\n @if (item.tooltip) {\n <svg class=\"tooltip-icon\" [apexTooltip]=\"item.tooltip\" [tooltipPosition]=\"tooltipPositionAbove\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g>\n <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 7.5H8V11h.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M8.25 5.25a.25.25 0 1 1-.5 0 .25.25 0 0 1 .5 0z\" fill=\"#fff\"/>\n </g>\n </svg>\n }\n </label>\n }\n </div>\n }\n}\n", styles: [".container{display:flex;flex-direction:column}.inline{flex-direction:row}.radio-button{display:flex;align-items:center;cursor:pointer}.container.inline label{margin-right:16px}.radio-button.disabled{opacity:.5;cursor:not-allowed}input[type=radio]{width:20px;height:20px;background-color:var(--apex-radio-button-background-color, #FFFFFF);cursor:pointer;transition:border .12s ease-in-out;appearance:none;-webkit-appearance:none;border:2px solid var(--apex-radio-button-unchecked-border-color, #E9E9E9);border-radius:50%;margin:0 8px 0 0}input[type=radio]:focus{outline:var(--apex-radio-button-outline-color, none)}input[type=radio]:checked{border:5px solid var(--apex-radio-button-checked-border-color, #F96138)}.radio-button.disabled input[type=radio]{border:5px solid var(--apex-radio-button-disabled-border-color, #E7E7E7)}.radio-button span{color:var(--apex-radio-button-text-color, #5D6068);font-size:14px;margin-right:4px}.tooltip-icon{overflow:visible}.tooltip-icon path{fill:var(--apex-radio-button-tooltip-icon-fill, transparent);stroke:var(--apex-radio-button-tooltip-icon-stroke, #C6C6C6)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: ApexTooltipDirective, selector: "[apexTooltip]", inputs: ["apexTooltip", "tooltipPosition"] }] }); }
|
|
20
20
|
}
|
|
21
21
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ApexRadioButtonComponent, decorators: [{
|
|
22
22
|
type: Component,
|
|
@@ -25,7 +25,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImpor
|
|
|
25
25
|
FormsModule,
|
|
26
26
|
ReactiveFormsModule,
|
|
27
27
|
ApexTooltipDirective,
|
|
28
|
-
], template: "@if (options) {\n @if (options.formGroup && options.formControlName) {\n <div class=\"container\" [formGroup]=\"options.formGroup\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item) {\n <label class=\"radio-button\" [ngClass]=\"{ 'disabled': options.formGroup.controls[options.formControlName].disabled }\">\n <input type=\"radio\" [value]=\"item.value\" [formControlName]=\"options.formControlName\"/>\n \n <span>{{ item.label }}</span>\n </label>\n }\n </div>\n } @else {\n <div class=\"container\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item; let i = $index) {\n <label class=\"radio-button\">\n <input type=\"radio\" [name]=\"buttonGroupId\" [checked]=\"i === options.checked\" (change)=\"onChange(item)\">\n\n <span>{{ item.label }}</span>\n\n @if (item.tooltip) {\n <svg class=\"tooltip-icon\" [apexTooltip]=\"item.tooltip\" [tooltipPosition]=\"tooltipPositionAbove\" width=\"16\" height=\"16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g>\n <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 7.5H8V11h.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M8.25 5.25a.25.25 0 1 1-.5 0 .25.25 0 0 1 .5 0z\" fill=\"#fff\"/>\n </g>\n </svg>\n }\n </label>\n }\n </div>\n }\n}\n", styles: [".container{display:flex;flex-direction:column}.inline{flex-direction:row}.radio-button{display:flex;align-items:center;cursor:pointer}.container.inline label{margin-right:16px}.radio-button.disabled{opacity:.5;cursor:not-allowed}input[type=radio]{width:20px;height:20px;background-color:var(--apex-radio-button-background-color, #FFFFFF);cursor:pointer;transition:border .12s ease-in-out;appearance:none;-webkit-appearance:none;border:2px solid var(--apex-radio-button-unchecked-border-color, #E9E9E9);border-radius:50%;margin:0 8px 0 0}input[type=radio]:focus{outline:var(--apex-radio-button-outline-color, none)}input[type=radio]:checked{border:5px solid var(--apex-radio-button-checked-border-color, #F96138)}.radio-button.disabled input[type=radio]{border:5px solid var(--apex-radio-button-disabled-border-color, #E7E7E7)}.radio-button span{color:var(--apex-radio-button-text-color, #5D6068);font-size:14px;margin-right:4px}.tooltip-icon{overflow:visible}.tooltip-icon path{fill:var(--apex-radio-button-tooltip-icon-fill, transparent);stroke:var(--apex-radio-button-tooltip-icon-stroke, #C6C6C6)}\n"] }]
|
|
28
|
+
], template: "@if (options) {\n @if (options.formGroup && options.formControlName) {\n <div class=\"container\" [formGroup]=\"options.formGroup\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item) {\n <label class=\"radio-button\" [ngClass]=\"{ 'disabled': options.formGroup.controls[options.formControlName].disabled }\">\n <input type=\"radio\" [value]=\"item.value\" [formControlName]=\"options.formControlName\"/>\n \n <span>{{ item.label }}</span>\n </label>\n }\n </div>\n } @else {\n <div class=\"container\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item; let i = $index) {\n <label class=\"radio-button\">\n <input type=\"radio\" [name]=\"buttonGroupId\" [checked]=\"i === options.checked\" (change)=\"onChange(item)\">\n\n <span>{{ item.label }}</span>\n\n @if (item.tooltip) {\n <svg class=\"tooltip-icon\" [apexTooltip]=\"item.tooltip\" [tooltipPosition]=\"tooltipPositionAbove\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g>\n <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 7.5H8V11h.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M8.25 5.25a.25.25 0 1 1-.5 0 .25.25 0 0 1 .5 0z\" fill=\"#fff\"/>\n </g>\n </svg>\n }\n </label>\n }\n </div>\n }\n}\n", styles: [".container{display:flex;flex-direction:column}.inline{flex-direction:row}.radio-button{display:flex;align-items:center;cursor:pointer}.container.inline label{margin-right:16px}.radio-button.disabled{opacity:.5;cursor:not-allowed}input[type=radio]{width:20px;height:20px;background-color:var(--apex-radio-button-background-color, #FFFFFF);cursor:pointer;transition:border .12s ease-in-out;appearance:none;-webkit-appearance:none;border:2px solid var(--apex-radio-button-unchecked-border-color, #E9E9E9);border-radius:50%;margin:0 8px 0 0}input[type=radio]:focus{outline:var(--apex-radio-button-outline-color, none)}input[type=radio]:checked{border:5px solid var(--apex-radio-button-checked-border-color, #F96138)}.radio-button.disabled input[type=radio]{border:5px solid var(--apex-radio-button-disabled-border-color, #E7E7E7)}.radio-button span{color:var(--apex-radio-button-text-color, #5D6068);font-size:14px;margin-right:4px}.tooltip-icon{overflow:visible}.tooltip-icon path{fill:var(--apex-radio-button-tooltip-icon-fill, transparent);stroke:var(--apex-radio-button-tooltip-icon-stroke, #C6C6C6)}\n"] }]
|
|
29
29
|
}], propDecorators: { options: [{
|
|
30
30
|
type: Input
|
|
31
31
|
}], selectChange: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"apexara-ng-components-radiobutton.mjs","sources":["../../../../projects/apexara/ng-components/radiobutton/src/radio-button.component.ts","../../../../projects/apexara/ng-components/radiobutton/src/radio-button.component.html","../../../../projects/apexara/ng-components/radiobutton/apexara-ng-components-radiobutton.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport { Component, Input, Output, EventEmitter } from '@angular/core';\nimport { FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';\n\nimport { ApexTooltipDirective, TooltipPosition } from '@apexara/ng-components/tooltip';\n\nexport interface ApexRadioData {\n label: string;\n value: any;\n tooltip?: string;\n isHover?: boolean;\n}\n\nexport interface ApexRadioButtonOptions {\n checked?: number;\n inline?: boolean;\n data: ApexRadioData[];\n formGroup?: FormGroup;\n formControlName?: string;\n}\n\n@Component({\n selector: 'apex-radio-button',\n templateUrl: './radio-button.component.html',\n styleUrls: ['./radio-button.component.css'],\n imports: [\n NgClass,\n FormsModule,\n ReactiveFormsModule,\n ApexTooltipDirective,\n ]\n})\n\nexport class ApexRadioButtonComponent {\n\n @Input() options!: ApexRadioButtonOptions;\n\n @Output() selectChange = new EventEmitter<ApexRadioData>();\n\n // random ID for name of the radiobutton so no collision happen with other radio components\n public buttonGroupId = Math.random();\n\n public tooltipPositionAbove = TooltipPosition.Above;\n\n public onChange(item: ApexRadioData): void {\n this.selectChange.emit(item);\n }\n\n}\n","@if (options) {\n @if (options.formGroup && options.formControlName) {\n <div class=\"container\" [formGroup]=\"options.formGroup\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item) {\n <label class=\"radio-button\" [ngClass]=\"{ 'disabled': options.formGroup.controls[options.formControlName].disabled }\">\n <input type=\"radio\" [value]=\"item.value\" [formControlName]=\"options.formControlName\"/>\n \n <span>{{ item.label }}</span>\n </label>\n }\n </div>\n } @else {\n <div class=\"container\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item; let i = $index) {\n <label class=\"radio-button\">\n <input type=\"radio\" [name]=\"buttonGroupId\" [checked]=\"i === options.checked\" (change)=\"onChange(item)\">\n\n <span>{{ item.label }}</span>\n\n @if (item.tooltip) {\n <svg class=\"tooltip-icon\" [apexTooltip]=\"item.tooltip\" [tooltipPosition]=\"tooltipPositionAbove\" width=\"16\" height=\"16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g>\n <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 7.5H8V11h.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M8.25 5.25a.25.25 0 1 1-.5 0 .25.25 0 0 1 .5 0z\" fill=\"#fff\"/>\n </g>\n </svg>\n }\n </label>\n }\n </div>\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAiCa,wBAAwB,CAAA;AAZrC,IAAA,WAAA,GAAA;AAgBY,QAAA,IAAA,CAAA,YAAY,GAAG,IAAI,YAAY,EAAiB;;AAGnD,QAAA,IAAA,CAAA,aAAa,GAAG,IAAI,CAAC,MAAM,EAAE;AAE7B,QAAA,IAAA,CAAA,oBAAoB,GAAG,eAAe,CAAC,KAAK;AAMpD,IAAA;AAJQ,IAAA,QAAQ,CAAC,IAAmB,EAAA;AACjC,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;IAC9B;8GAbW,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAxB,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,EAAA,YAAA,EAAA,cAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECjCrC,
|
|
1
|
+
{"version":3,"file":"apexara-ng-components-radiobutton.mjs","sources":["../../../../projects/apexara/ng-components/radiobutton/src/radio-button.component.ts","../../../../projects/apexara/ng-components/radiobutton/src/radio-button.component.html","../../../../projects/apexara/ng-components/radiobutton/apexara-ng-components-radiobutton.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport { Component, Input, Output, EventEmitter } from '@angular/core';\nimport { FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';\n\nimport { ApexTooltipDirective, TooltipPosition } from '@apexara/ng-components/tooltip';\n\nexport interface ApexRadioData {\n label: string;\n value: any;\n tooltip?: string;\n isHover?: boolean;\n}\n\nexport interface ApexRadioButtonOptions {\n checked?: number;\n inline?: boolean;\n data: ApexRadioData[];\n formGroup?: FormGroup;\n formControlName?: string;\n}\n\n@Component({\n selector: 'apex-radio-button',\n templateUrl: './radio-button.component.html',\n styleUrls: ['./radio-button.component.css'],\n imports: [\n NgClass,\n FormsModule,\n ReactiveFormsModule,\n ApexTooltipDirective,\n ]\n})\n\nexport class ApexRadioButtonComponent {\n\n @Input() options!: ApexRadioButtonOptions;\n\n @Output() selectChange = new EventEmitter<ApexRadioData>();\n\n // random ID for name of the radiobutton so no collision happen with other radio components\n public buttonGroupId = Math.random();\n\n public tooltipPositionAbove = TooltipPosition.Above;\n\n public onChange(item: ApexRadioData): void {\n this.selectChange.emit(item);\n }\n\n}\n","@if (options) {\n @if (options.formGroup && options.formControlName) {\n <div class=\"container\" [formGroup]=\"options.formGroup\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item) {\n <label class=\"radio-button\" [ngClass]=\"{ 'disabled': options.formGroup.controls[options.formControlName].disabled }\">\n <input type=\"radio\" [value]=\"item.value\" [formControlName]=\"options.formControlName\"/>\n \n <span>{{ item.label }}</span>\n </label>\n }\n </div>\n } @else {\n <div class=\"container\" [ngClass]=\"{ 'inline': options.inline }\">\n @for (item of options.data; track item; let i = $index) {\n <label class=\"radio-button\">\n <input type=\"radio\" [name]=\"buttonGroupId\" [checked]=\"i === options.checked\" (change)=\"onChange(item)\">\n\n <span>{{ item.label }}</span>\n\n @if (item.tooltip) {\n <svg class=\"tooltip-icon\" [apexTooltip]=\"item.tooltip\" [tooltipPosition]=\"tooltipPositionAbove\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g>\n <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M7.5 7.5H8V11h.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n <path d=\"M8.25 5.25a.25.25 0 1 1-.5 0 .25.25 0 0 1 .5 0z\" fill=\"#fff\"/>\n </g>\n </svg>\n }\n </label>\n }\n </div>\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAiCa,wBAAwB,CAAA;AAZrC,IAAA,WAAA,GAAA;AAgBY,QAAA,IAAA,CAAA,YAAY,GAAG,IAAI,YAAY,EAAiB;;AAGnD,QAAA,IAAA,CAAA,aAAa,GAAG,IAAI,CAAC,MAAM,EAAE;AAE7B,QAAA,IAAA,CAAA,oBAAoB,GAAG,eAAe,CAAC,KAAK;AAMpD,IAAA;AAJQ,IAAA,QAAQ,CAAC,IAAmB,EAAA;AACjC,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;IAC9B;8GAbW,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAxB,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,EAAA,YAAA,EAAA,cAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECjCrC,swDAgCA,EAAA,MAAA,EAAA,CAAA,glCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDNI,OAAO,mFACP,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,8MAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,yBAAA,EAAA,QAAA,EAAA,8FAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,iBAAA,EAAA,OAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,sGAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACX,mBAAmB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,WAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,oBAAoB,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,iBAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FAIX,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAZpC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,EAAA,OAAA,EAGpB;wBACP,OAAO;wBACP,WAAW;wBACX,mBAAmB;wBACnB,oBAAoB;AACrB,qBAAA,EAAA,QAAA,EAAA,swDAAA,EAAA,MAAA,EAAA,CAAA,glCAAA,CAAA,EAAA;;sBAKA;;sBAEA;;;AErCH;;AAEG;;;;"}
|