{"_id":"@apexara/ng-components","_rev":"16-d96720006bca72eef2c949611f392e75","name":"@apexara/ng-components","dist-tags":{"latest":"1.0.6-test.7"},"versions":{"1.0.0":{"name":"@apexara/ng-components","version":"1.0.0","keywords":["Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.0","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"73221816c48f207ef155f9edc5df025a47231664","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.0.tgz","fileCount":59,"integrity":"sha512-zLJ3ADV+/m9IsXGjIprfl0tF1Tf4ELoXGcCCup91lJ/1HHAJPaM8nZi4500hC/D+NE3aimN/FSLW2b5mrLmVtA==","signatures":[{"sig":"MEUCIQCYrNnasNRajoP+lskM+E7CYqj2IKCYbYTpVKdIIq1YQAIgAf53jDYBb094xiecvcJqrQ7SN/ednFnVXVNh6LghEzg=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1000326},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"2c93d5e67caea1450dcc1b7b3334a171188dd203","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=20 <22","@angular/core":">=20 <22","@angular/forms":">=20 <22","@angular/common":">=20 <22","@angular/material":">=20 <22","@angular/animations":">=20 <22","@angular/platform-browser":">=20 <22"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.0_1770045621086_0.022496178501473896","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@apexara/ng-components","version":"1.0.1","keywords":["Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.1","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"ce267079b8cc15e4756417e89df578ecd1ace9cd","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.1.tgz","fileCount":59,"integrity":"sha512-sk9gMTmkbF42T4OVCo9hW1l5CVJ9Oy9zV/fyCpw5nV7sZcdEAequtDwVy3UCOZigVSCAOGkorQlcKrqTwxoQNA==","signatures":[{"sig":"MEUCIEGwr8zakxHSjZZZrMU9JwsdzmQGE7Jw9xrXqeh0C160AiEAnW1flR6FL5NtK7+v9yr2mQEQXfVc5uiSN50nwye7wuU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1002141},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"0d147424472bb1a17142c46caa37e9a7ba80b1be","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=20 <22","@angular/core":">=20 <22","@angular/forms":">=20 <22","@angular/common":">=20 <22","@angular/material":">=20 <22","@angular/animations":">=20 <22","@angular/platform-browser":">=20 <22"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.1_1770046724220_0.3316047540310778","host":"s3://npm-registry-packages-npm-production"}},"1.0.2-test.1":{"name":"@apexara/ng-components","version":"1.0.2-test.1","keywords":["Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.2-test.1","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"bc743d3fd4e9bcfaa1d876b814171223d1bb93b8","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.2-test.1.tgz","fileCount":59,"integrity":"sha512-JxgtFD+oJMLQaduyDRLg2YEuoAlAGJX3IsMpsSpqjGH1aHosjnQIdHc/rmjstkfM1JoKFp7ptUtTsikMmWW+oA==","signatures":[{"sig":"MEQCIFgOXlaIh+CRmtiM3WZoFPcOHf27LeKkUWWhXXbaM7rAAiAFVswlVqQfuKHWTwkBLgKhIC4DQXsdF/UxszNkBefH8g==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1005375},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"8fc871e2a4e7b9e0b0c02c1c3f2b344a7bd23f6c","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=20 <22","@angular/core":">=20 <22","@angular/forms":">=20 <22","@angular/common":">=20 <22","@angular/material":">=20 <22","@angular/animations":">=20 <22","@angular/platform-browser":">=20 <22"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.2-test.1_1772457240659_0.9454833982171416","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@apexara/ng-components","version":"1.0.2","keywords":["Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.2","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"419f76119ee15d3365ff9ac262c84e6b8bcd9a96","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.2.tgz","fileCount":59,"integrity":"sha512-tZN0j6kynNSuubFpRhbUCprqC5JKbb0oExS+fXTxRz++kSXptS2zdjLcyobLyrPlVudZF/TbkbAA1HjtCrtIlw==","signatures":[{"sig":"MEYCIQDM45ZI4qsS9uZh4TbB41yVlJ7O/K5qwZHrlRUGN0tE5AIhALYm3mGs1twq+76nRv4S6STQBdGo4hpu7jJQMKqU/W79","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1005368},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"8fc871e2a4e7b9e0b0c02c1c3f2b344a7bd23f6c","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=20 <22","@angular/core":">=20 <22","@angular/forms":">=20 <22","@angular/common":">=20 <22","@angular/material":">=20 <22","@angular/animations":">=20 <22","@angular/platform-browser":">=20 <22"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.2_1772463816880_0.021057573334694046","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@apexara/ng-components","version":"1.0.3","keywords":["Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.3","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"fe0483ae722414cf36c29eacc69cb3370f3b7618","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.3.tgz","fileCount":59,"integrity":"sha512-Nynj4wP2wmW8peUo1gZ35FJnDolhFhhqVpJzaTZA43fihp/kK2yR6zBJVFPMmOsOKD79OvREikqy89VJKTIC1w==","signatures":[{"sig":"MEQCIApX9usb3Pf+FQbb75wNvkV9aFQ/m+qRU3ZHNJMUeBHwAiAn2Rthaf61ggmbX0iR7nRKtXbJnS+VMgMGImYEuolBTw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1005848},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"c838f529bbee57b5eb0b1f94cbf4b71166a83ba9","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=20 <22","@angular/core":">=20 <22","@angular/forms":">=20 <22","@angular/common":">=20 <22","@angular/material":">=20 <22","@angular/animations":">=20 <22","@angular/platform-browser":">=20 <22"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.3_1772467126939_0.41797936575532146","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"@apexara/ng-components","version":"1.0.4","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.4","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"bb4205e253435f5dd4f9723aac46e1d725af040b","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.4.tgz","fileCount":59,"integrity":"sha512-u0z16hquG2qh5DDy8V5jP4pR9FgKudUhWTpILnf3nY/vZ6Yr6fSsQJ/x9E+RLp0SNfz7e7mmKWz0JaTjkkIVdg==","signatures":[{"sig":"MEYCIQDvLERFNFBiWZk4ZOKHjmfDGI8i0zBCsLEUwwnoK8mZ4QIhAJ+uEIFe8OO/vNci17odbO2fGRT25tbHrBdE3/SYZ0MA","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1005838},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"57e7cbd3a3046eff55c754234140cc90286865ee","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=19","@angular/core":">=19","@angular/forms":">=19","@angular/common":">=19","@angular/material":">=19","@angular/animations":">=19","@angular/platform-browser":">=19"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.4_1772819981054_0.6117830346586981","host":"s3://npm-registry-packages-npm-production"}},"1.0.5":{"name":"@apexara/ng-components","version":"1.0.5","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.5","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"106dc9c4548597a4d20e240df229c8f33d25dda7","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.5.tgz","fileCount":59,"integrity":"sha512-Pbr9on97uA2J0jvXvKgljnednUItGHOBi0nLwTO7tCX4u3JnrhaOT7qvj8vKwKwuASmsud4py4IEIevoRT9Zrw==","signatures":[{"sig":"MEUCIE7lwgWQUHjzYHZelu0b57o1MaDUQlLgcBAWpIGuhenTAiEAxzoFk5xzV9pJKgEVSxla6nfQPNnRqIOENAyaVaYDXuw=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1017424},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"bcedb014d45251713c248b9c1e005efb3333d9d0","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=19","@angular/core":">=19","@angular/forms":">=19","@angular/common":">=19","@angular/material":">=19","@angular/animations":">=19","@angular/platform-browser":">=19"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.5_1773058616304_0.0522396123298996","host":"s3://npm-registry-packages-npm-production"}},"1.0.6-test.1":{"name":"@apexara/ng-components","version":"1.0.6-test.1","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.6-test.1","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"2d891ee79471677e5d4efbb8490fbe93e8902338","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.6-test.1.tgz","fileCount":62,"integrity":"sha512-xawKJxdMhMOb1NcoKJ0yp+XPT7djtkih8kok3tuPfgb/0LRIJs0BfLTGN3RezBHaPjNTNCVOnAq8Oulq3yDY+A==","signatures":[{"sig":"MEUCIE0sk9ladQgqQhzFcenDyW5ci9fV8wC4Zd7zIfBdbdh2AiEA2SACR6wzZO8USlyRmStc6kwReQYSHgAHspFf9bZylp4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1083675},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./more-options":{"types":"./types/apexara-ng-components-more-options.d.ts","default":"./fesm2022/apexara-ng-components-more-options.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"504c3bcca26bb76a2c356e36cf11356e37ba1057","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=19","@angular/core":">=19","@angular/forms":">=19","@angular/common":">=19","@angular/material":">=19","@angular/platform-browser":">=19"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.6-test.1_1773936468543_0.4019885509556105","host":"s3://npm-registry-packages-npm-production"}},"1.0.6-test.2":{"name":"@apexara/ng-components","version":"1.0.6-test.2","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.6-test.2","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"1bac9093759fcb821fe1a0622770f685aa3491df","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.6-test.2.tgz","fileCount":62,"integrity":"sha512-BOaW6dg1YxpYSa/+OtSlvhY4lWkrMwuFTRWDvONwDkTSuUIA9whWnHRDh1Wp4nu9k8OX2PU5tWG3aCA/exuJXw==","signatures":[{"sig":"MEUCIQCv+Wee1imkjyve537jmKE9ld0Ys8PdGv2QRYDKrmbUmQIgeS2AsWsH3EpyP565Sr3WBZ3r+M5jvqrT9MNGYHK9Z+U=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1087464},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./more-options":{"types":"./types/apexara-ng-components-more-options.d.ts","default":"./fesm2022/apexara-ng-components-more-options.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"ab31aaba13b5af1292a778b2cea96e5625fef9c2","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=19","@angular/core":">=19","@angular/forms":">=19","@angular/common":">=19","@angular/material":">=19","@angular/platform-browser":">=19"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.6-test.2_1774011943565_0.6015430686480099","host":"s3://npm-registry-packages-npm-production"}},"1.0.6-test.3":{"name":"@apexara/ng-components","version":"1.0.6-test.3","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.6-test.3","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"7a532d0413b9352920375514a180e73d29447e27","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.6-test.3.tgz","fileCount":62,"integrity":"sha512-t3S0KeexH9jixK7wdQu1mOd3i6WC2KezkTGL6496z4Ra48JRM1aMNauYgX6wuePK4X12hWkR+ilZD1QcJ42vDQ==","signatures":[{"sig":"MEUCIQDUbfXhja6eFy1+kb0JVCTwfQmMjkByIisOMKT8RgGSHwIgeL19Y6aTb4wGndc+CQRiO+Ev3Xmj4eQIBAnl8/TdiWQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1094946},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./more-options":{"types":"./types/apexara-ng-components-more-options.d.ts","default":"./fesm2022/apexara-ng-components-more-options.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"41c4492549876ffd816c4bd955fbd48d8b582e38","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=19","@angular/core":">=19","@angular/forms":">=19","@angular/common":">=19","@angular/material":">=19","@angular/platform-browser":">=19"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.6-test.3_1774020603194_0.9649329266133457","host":"s3://npm-registry-packages-npm-production"}},"1.0.6-test.4":{"name":"@apexara/ng-components","version":"1.0.6-test.4","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.6-test.4","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"7cb13c45b6f18234bad6458fa53e366dc947b2f2","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.6-test.4.tgz","fileCount":62,"integrity":"sha512-r9/wmN/gWWZoGqLH1GrkB6M3okEWk/gBQ0a6JZc1nU+lCTUHrPkFfE8aGcJF+3F8QBgjCWemzOX3ihEafMgbhQ==","signatures":[{"sig":"MEYCIQDIJ0Sgoe4jFzNf+VdoCquspK8zcW8vNq/APUkSF9ifowIhAMa4pHjalysU72QHh9Jvn7eB9M3vfC/GELSq9O2TBNXs","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1095740},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./more-options":{"types":"./types/apexara-ng-components-more-options.d.ts","default":"./fesm2022/apexara-ng-components-more-options.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"3b41de8c22264485a3419a06c87854c3ae55f4b9","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=19","@angular/core":">=19","@angular/forms":">=19","@angular/common":">=19","@angular/material":">=19","@angular/platform-browser":">=19"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.6-test.4_1774264675950_0.07531632477310457","host":"s3://npm-registry-packages-npm-production"}},"1.0.6-test.5":{"name":"@apexara/ng-components","version":"1.0.6-test.5","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.6-test.5","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"}],"dist":{"shasum":"e0e8993deb05bd4ab93b45f2f35b9b766b00bff4","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.6-test.5.tgz","fileCount":62,"integrity":"sha512-QTeDS+tEYeFLw2BCnbfN7cZlEpFVvmGBiycXI9MXoEb92TboRJE3WdAuhhhQCYZM0QtSeKWAbKjeBqshGedKcA==","signatures":[{"sig":"MEUCIQDEZ3MTzVT+KuYdGN0NkH+UaOqkoTssWi/dba5dwMaGpgIgKGEAX8kDeyCCv1LG8b+JBuMCyBd2Xn3M5GbAJgPKmEc=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1102681},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./more-options":{"types":"./types/apexara-ng-components-more-options.d.ts","default":"./fesm2022/apexara-ng-components-more-options.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"a572f9075a6dc3444ff47ea6c256c1b0722ac6b3","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=19","@angular/core":">=19","@angular/forms":">=19","@angular/common":">=19","@angular/material":">=19","@angular/platform-browser":">=19"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.6-test.5_1774334706176_0.3647423376663266","host":"s3://npm-registry-packages-npm-production"}},"1.0.6-test.6":{"name":"@apexara/ng-components","version":"1.0.6-test.6","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"author":{"name":"apexara"},"license":"ISC","_id":"@apexara/ng-components@1.0.6-test.6","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"},{"name":"martinpetrovapex","email":"martin.petrov@apexara.com"}],"dist":{"shasum":"a1537e9f7768ce6f641de6b22f447808769c7251","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.6-test.6.tgz","fileCount":62,"integrity":"sha512-TAsjnAl5SmVyMSluOqrkQxpBVUEATRjOZcuRSGw/IfodBGdipAijv1I25Gs5udUV6Lwg1PHx7mVKC5BusEi3ng==","signatures":[{"sig":"MEUCIB+GdxTvn0nQ1TBt9JQ7Vs+U5Iwro1r+7eAVHxkpFdl+AiEAtRnKuV+5oaXrTNMz84P31LDdeyKLmgnMTYTQJ7AINMw=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1110346},"module":"fesm2022/apexara-ng-components.mjs","exports":{".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./more-options":{"types":"./types/apexara-ng-components-more-options.d.ts","default":"./fesm2022/apexara-ng-components-more-options.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"fb4c7daec3112fc7f54b9617bd5d8b135ad2d603","private":false,"typings":"types/apexara-ng-components.d.ts","_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"_npmVersion":"10.7.0","description":"Custom Angular Components","directories":{},"sideEffects":false,"_nodeVersion":"18.20.3","dependencies":{"tslib":"^2.8.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/cdk":">=19","@angular/core":">=19","@angular/forms":">=19","@angular/common":">=19","@angular/material":">=19","@angular/platform-browser":">=19"},"_npmOperationalInternal":{"tmp":"tmp/ng-components_1.0.6-test.6_1776418045978_0.4567358342457841","host":"s3://npm-registry-packages-npm-production"}},"1.0.6-test.7":{"name":"@apexara/ng-components","version":"1.0.6-test.7","private":false,"peerDependencies":{"@angular/cdk":">=19","@angular/common":">=19","@angular/core":">=19","@angular/forms":">=19","@angular/material":">=19","@angular/platform-browser":">=19","rxjs":"^7.8.0"},"dependencies":{"tslib":"^2.8.0"},"author":{"name":"apexara"},"license":"ISC","description":"Custom Angular Components","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"module":"fesm2022/apexara-ng-components.mjs","typings":"types/apexara-ng-components.d.ts","sideEffects":false,"exports":{"./package.json":{"default":"./package.json"},".":{"types":"./types/apexara-ng-components.d.ts","default":"./fesm2022/apexara-ng-components.mjs"},"./button":{"types":"./types/apexara-ng-components-button.d.ts","default":"./fesm2022/apexara-ng-components-button.mjs"},"./carousel":{"types":"./types/apexara-ng-components-carousel.d.ts","default":"./fesm2022/apexara-ng-components-carousel.mjs"},"./checkbox":{"types":"./types/apexara-ng-components-checkbox.d.ts","default":"./fesm2022/apexara-ng-components-checkbox.mjs"},"./chip":{"types":"./types/apexara-ng-components-chip.d.ts","default":"./fesm2022/apexara-ng-components-chip.mjs"},"./datepicker":{"types":"./types/apexara-ng-components-datepicker.d.ts","default":"./fesm2022/apexara-ng-components-datepicker.mjs"},"./dialog":{"types":"./types/apexara-ng-components-dialog.d.ts","default":"./fesm2022/apexara-ng-components-dialog.mjs"},"./drawer":{"types":"./types/apexara-ng-components-drawer.d.ts","default":"./fesm2022/apexara-ng-components-drawer.mjs"},"./expander":{"types":"./types/apexara-ng-components-expander.d.ts","default":"./fesm2022/apexara-ng-components-expander.mjs"},"./image":{"types":"./types/apexara-ng-components-image.d.ts","default":"./fesm2022/apexara-ng-components-image.mjs"},"./input":{"types":"./types/apexara-ng-components-input.d.ts","default":"./fesm2022/apexara-ng-components-input.mjs"},"./listbox":{"types":"./types/apexara-ng-components-listbox.d.ts","default":"./fesm2022/apexara-ng-components-listbox.mjs"},"./more-options":{"types":"./types/apexara-ng-components-more-options.d.ts","default":"./fesm2022/apexara-ng-components-more-options.mjs"},"./radiobutton":{"types":"./types/apexara-ng-components-radiobutton.d.ts","default":"./fesm2022/apexara-ng-components-radiobutton.mjs"},"./select":{"types":"./types/apexara-ng-components-select.d.ts","default":"./fesm2022/apexara-ng-components-select.mjs"},"./services":{"types":"./types/apexara-ng-components-services.d.ts","default":"./fesm2022/apexara-ng-components-services.mjs"},"./snackbar":{"types":"./types/apexara-ng-components-snackbar.d.ts","default":"./fesm2022/apexara-ng-components-snackbar.mjs"},"./table":{"types":"./types/apexara-ng-components-table.d.ts","default":"./fesm2022/apexara-ng-components-table.mjs"},"./textarea":{"types":"./types/apexara-ng-components-textarea.d.ts","default":"./fesm2022/apexara-ng-components-textarea.mjs"},"./tooltip":{"types":"./types/apexara-ng-components-tooltip.d.ts","default":"./fesm2022/apexara-ng-components-tooltip.mjs"}},"_id":"@apexara/ng-components@1.0.6-test.7","gitHead":"a187f8cbde2fe8dec25e16477c246c9348ab0266","_nodeVersion":"18.20.3","_npmVersion":"10.7.0","dist":{"integrity":"sha512-//1qjIExuUmRru8RHTL7urimDGBmLnSnG8QFkKD77RgiDbZ4NFI92bJ4D7/VztaeNnkgdYNzqODljaju0WFEog==","shasum":"9c755ff4c613dd3959ce4ce65e43b6276418e90e","tarball":"https://registry.npmjs.org/@apexara/ng-components/-/ng-components-1.0.6-test.7.tgz","fileCount":62,"unpackedSize":1154678,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCWIuIHNCIsoL2c7Up9rAi7FsnETHQsvPKvHm+Yp2KCbAIhALEL9KeS+c4JKa67GMur6KECNEDm1cblzVYpL0l3UNT4"}]},"_npmUser":{"name":"ivozhulev","email":"ivo@apexara.com"},"directories":{},"maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"},{"name":"martinpetrovapex","email":"martin.petrov@apexara.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ng-components_1.0.6-test.7_1776429819520_0.9652328507670185"},"_hasShrinkwrap":false}},"time":{"created":"2026-02-02T15:20:21.085Z","modified":"2026-04-17T12:43:39.831Z","1.0.0":"2026-02-02T15:20:21.306Z","1.0.1":"2026-02-02T15:38:44.460Z","1.0.2-test.1":"2026-03-02T13:14:00.813Z","1.0.2":"2026-03-02T15:03:37.140Z","1.0.3":"2026-03-02T15:58:47.147Z","1.0.4":"2026-03-06T17:59:41.266Z","1.0.5":"2026-03-09T12:16:56.492Z","1.0.6-test.1":"2026-03-19T16:07:48.781Z","1.0.6-test.2":"2026-03-20T13:05:43.818Z","1.0.6-test.3":"2026-03-20T15:30:03.362Z","1.0.6-test.4":"2026-03-23T11:17:56.090Z","1.0.6-test.5":"2026-03-24T06:45:06.386Z","1.0.6-test.6":"2026-04-17T09:27:26.167Z","1.0.6-test.7":"2026-04-17T12:43:39.674Z"},"author":{"name":"apexara"},"license":"ISC","keywords":["Angular 19","Angular 20","Angular 21","Angular Components","Angular UI Components","Angular Material Components","Angular Material UI","UI Components","Angular Library","Angular Table","Angular Select","Angular Expander","Angular Dialog","Angular Input","Angular Chip","Angular Checkbox","Angular Textarea","Angular Snackbar","Angular Dialog","Angular Button","Angular Radiobutton","Angular Services","Angular Tooltip","Angular Loader","Angular Image","ng table","ng input","ng checkbox","ng button","ng expander","ng dialog","ng image","ng listbox","ng radiobutton","ng select","ng services","ng loader","ng scrollblock","ng tooltip","ng textarea"],"description":"Custom Angular Components","maintainers":[{"name":"simeondspasov","email":"simeon.spasov@apexara.com"},{"name":"ivozhulev","email":"ivo@apexara.com"},{"name":"nikolay-kostadinov","email":"nikolay.kostadinov@apexara.com"},{"name":"martinpetrovapex","email":"martin.petrov@apexara.com"}],"readme":"# ng-components\n\nThis package provides custom Angular UI components, developed and maintained by APEX Soft LLC.
\nWebsite: www.apexara.com \n\n# Installation\n\n```sh\nnpm install @apexara/ng-components\n```\n\n# Components\n\n[๐Ÿ”ฝ Button](#apex-button-component)
\n[๐Ÿ”ฝ Checkbox](#apex-checkbox-component)
\n[๐Ÿ”ฝ Chip](#apex-checkbox-component)
\n[๐Ÿ”ฝ Dialog](#apex-dialog-component)
\n[๐Ÿ”ฝ Drawer](#apex-drawer-component)
\n[๐Ÿ”ฝ Expander](#apex-expander-component)
\n[๐Ÿ”ฝ Image](#apex-image-component)
\n[๐Ÿ”ฝ Input](#apex-input-component)
\n[๐Ÿ”ฝ Listbox](#apex-listbox-component)
\n[๐Ÿ”ฝ Radiobutton](#apex-radio-button-component)
\n[๐Ÿ”ฝ Select](#apex-select-component)
\n[๐Ÿ”ฝ Datepicker](#apex-datepicker-component)
\n[๐Ÿ”ฝ Carousel](#apex-carousel-component)
\n[๐Ÿ”ฝ Snackbar](#apex-snackbar-service)
\n[๐Ÿ”ฝ Table](#apex-table-component)
\n[๐Ÿ”ฝ Textarea](#apex-textarea-component)
\n[๐Ÿ”ฝ Tooltip](#apex-tooltip-component)
\n[๐Ÿ”ฝ More Options](#apex-more-options-component)
\n\n\n-----------------------------------------------------------------\n\n# APEX Button Component\nA simple button \n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexButtonComponent }\n>from '@apexara/ng-components/button';\n>\n>@Component({\n> imports: [ ApexButtonComponent ]\n>})\n>\n>export class ButtonExampleComponent {\n>\n> public handleClickChange(event: PointerEvent | MouseEvent | KeyboardEvent): void {\n> // click change login on button emit\n> }\n>\n> public handleFocusChange(event: FocusChange): void {\n> // focus change login on button emit (focusin or focusout type of event)\n> }\n>\n>}\n>```\n>**`parent.component.html`**\n>```html\n> [options]=\"{ \n> iconLeft: 'icon.svg',\n> iconRight: 'icon.svg'\n> throttleTime: 500ms, // A delay after each clickChange event, defaults to 300ms\n> }\"\n> [link]=\"routerLink\"\n> [state]=\"routerLink state\"\n> (focusChange)=\"handleFocusChange()\"\n> (clickChange)=\"handelClickChange()\">\n> Click here \n>\n>```\n\n### Inputs\n\n>#### options\n>two icons inside the button can be passed optionally on the left or right side ot the text.\n\n>#### clickChange\n>event emitter to handle clicks\n\n>#### focusChange\n>event emitter to focus changes on the a tag inside the apex-button\n\n>#### link\n>routerLink can be passed to for navigation\n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-button:\n>\n>```css\n>apex-button {\n> /* Sizes: */\n> --apex-button-border-radius: 4px;\n>\n> /* Focus outline */\n> --apex-button-focus-outline: 2px solid #F96138;\n>\n> /* Colors, Fills, Strokes: */\n> --apex-button-disabled-background-color: #E7E7E7;\n>\n> --apex-button-left-svg-fill: #FFFFFF;\n> --apex-button-left-svg-stroke: #FFFFFF00;\n>\n> --apex-button-right-svg-fill: #FFFFFF;\n> --apex-button-right-svg-fill: #FFFFFF00;\n>\t\t\n> --apex-button-text-color: #FFFFFF;\n> --apex-button-border-color: none;\n> --apex-button-background-color: #0B1222;\n>\n>/* Note: When you want to setup the color of your icon\n> you should experiment with both these variables or consider\n> using the one your icon is based on. */\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Checkbox Component\nA simple checkbox that can project content, be used with FormGroup and have a tooltip displayed \nwith a APEX Tooltip.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexCheckboxComponent, ApexCheckboxOptions } \n>from '@apexara/ng-components/checkbox';\n>\n>@Component({\n> imports: [ ApexCheckboxComponent ] \n>})\n>\n>export class CheckboxExampleComponent {\n>\n> public formGroup = new FormGroup({\n> checkboxControl: [false, [Validators.required]],\n> });\n>\n> public checkboxOptions: ApexCheckboxOptions = {\n> formGroup: this.formGroup,\n> formControlName: 'checkboxControl',\n> }\n>\n> public checkboxWithErrorOptions: ApexCheckboxOptions = {\n> formGroup: this.formGroup,\n> formControlName: 'checkboxControl',\n> errors: {\n> required: 'You must accept the terms and conditions',\n> },\n> }\n>\n>}\n>```\n>**`parent.component.html`**\n>```html\n> [checked]=\"true\"\n> [disabled]=\"false\"\n> [options]=\"checkboxOptions\"\n> [tooltip]=\"'example tooltip text'\">\n>\n>\n>\n>\n> I accept the terms and conditions\n>\n>```\n### Inputs\n\n>#### checked\n>Sets the checked attribute of the checkbox input by default.\n\n>#### disabled\n>Can be used to disabled the input and to prevent a user from interacting with it.\n\n>#### tooltip\n>a text that if present triggers a tooltip component with it inside.\n\n>#### options - ApexCheckboxOptions\n\n>**formGroup?: FormGroup**: Reference to the FormGroup that the apex-checkbox will handle.\n>\n>**formControlName?: string**: Reference to the name of the control that we will access in the FormGroup.\n>\n>**errors?: ApexCheckboxErrors**: A map of validation error keys to error message strings. When the control is touched and invalid, the first matching error message is displayed below the checkbox.\n>```typescript\n>errors: {\n> required: 'This field is required',\n>}\n>```\n\n### CSS Variables\n>Here are all the CSS variables (and their default values) you can set when using apex-checkbox:\n>\n>```css\n>apex-checkbox {\n> /* Sizes */\n> --apex-checkbox-font-size: 14px;\n>\n> /* Colors, Fills, Strokes: */\n> --apex-checkbox-background-color: #F7F8FB;\n> --apex-checkbox-wrapper-border-color: transparent;\n> --apex-checkbox-arrow-color: #FFFFFF;\n> --apex-checkbox-tooltip-icon-stroke: #FFFFFF;\n> --apex-checkbox-error-color: #F96138;\n>\n> --apex-checkbox-border-color: #E9E9E9;\n> --apex-checkbox-border-hover-color: #F96138;\n> --apex-checkbox-outline-color: none;\n>\n> /* Other */\n> --apex-checkbox-box-shadow-color: #F96138;\n> --apex-checkbox-disabled-opacity: 0.5;\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Chip component\nA simple visual container for displaying a text, state, etc. Supports optional left and right icons and an optional close button.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexChipComponent, ApexChipOptions }\n>from '@apexara/ng-components/chip';\n>\n>@Component({\n> imports: [ ApexChipComponent ]\n>})\n>\n>export class ChipExampleComponent {\n>\n> public chipOptions: ApexChipOptions = {\n> iconLeft: 'icon.svg',\n> iconRight: 'arrow.svg',\n> };\n>\n> public chipClose(): void {\n> // handle close\n> }\n>\n>}\n>\n>```\n>**`parent.component.html`**\n>```html\n>\n>Default\n>\n>\n> [closeIcon]=\"true\"\n> (closeChange)=\"chipClose()\">\n> Closeable\n>\n>\n>\n>With Left Icon\n>\n>\n>With Right Icon\n>\n>\n> [options]=\"chipOptions\"\n> [closeIcon]=\"true\"\n> (closeChange)=\"chipClose()\">\n> Full Featured\n>\n>```\n>\n\n### ApexChipOptions\n>```typescript\n>interface ApexChipOptions {\n> iconLeft?: string; // SVG filename relative to assets/img/\n> iconRight?: string; // SVG filename relative to assets/img/\n>}\n>```\n\n### Inputs\n>#### options\n>ApexChipOptions object to configure optional left and right icons. Icon files are resolved from the `assets/img/` directory.\n\n>#### closeIcon\n>boolean that triggers an X icon that has the closeChange event emitter attached.\n\n### Outputs\n>#### closeChange\n>event emitter triggered when the close icon is clicked.\n\n### Layout Order\n>When all features are enabled, the chip renders in this order:\n>\n>`[ left icon ] [ text ] [ right icon ] [ close X ]`\n\n### CSS Variables\n>Here all the available CSS variables (and their default values) you can set when using apex-chip:\n>\n>```css\n>apex-chip {\n> /* Sizes: */\n> --apex-chip-font-size: 12px;\n> --apex-chip-icon-size: 16px;\n> --apex-chip-icon-spacing: 6px;\n>\n> /* Colors, Fills, Strokes: */\n> --apex-chip-color: #FFFFFF;\n> --apex-chip-background-color: #0B1222;\n> --apex-chip-icon-color: #FFFFFF;\n> --apex-chip-left-icon-fill: #FFFFFF;\n> --apex-chip-left-icon-stroke: #ffffff00;\n> --apex-chip-right-icon-fill: #FFFFFF;\n> --apex-chip-right-icon-stroke: #ffffff00;\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Dialog Component\nSimple Dialog component with the option to project everything necessary - close icon, title, description, other content, actions.\nThe styling is only for the Dialog itself, the close icon, the title and the description. The content and the actions can be anything so their styling is up to the parent component\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexDialogComponent }\n>from '@apexara/ng-components/dialog';\n>\n>@Component({\n> imports: [ ApexDialogComponent ]\n>})\n>\n>export class DialogExampleComponent { }\n>```\n>**`parent.component.html`**\n>```html\n>@if (shouldRender) {\n> \n> Title Here\n>\n> Description Here\n>\n> \n> \n> \n>\n> \n> \n> Cancel\n> \n> \n> \n>}\n>```\n\n### Inputs\n>#### Dialog Close Icon\n>Shows a close icon. All you need is to pass [closeIcon]=\"true\" and a function that closes the dialog. In example\n\n>#### Dialog Title\n>The title is projected with the Select=['title']. All you need is an HTML element with 'title' set. In example\n\n>#### Dialog Description\n>The description is projected with the Select=['description']. All you need is an HTML element with 'description' set. In example\n>```html\n>Description Here\n>```\n\n>#### Dialog Content\n>You can place anything you want here. From Forms to Lists or whatever other stuff you need.\n>The Content is projected with the Select=['content']. All you need is an HTML element with 'content' set. In example\n>\n>**`parent.component.html`**\n>```html\n>\n> \n>\n>```\n>\n>**`parent.component.css`**\n>```css\n>apex-input {\n> --apex-input-error-color: red;\n>}\n>```\n\n>#### Dialog Actions\n>**`parent.component.html`**\n>The Actions are projected with the Select=['actions']. All you need is an HTML element with 'actions' set. In example\n>```html\n>\n> Close\n>\n>```\n>**`parent.component.html`**\n>Or with multiple actions:\n>```html\n>\n> Close\n> Trigger Action\n>\n>```\n>Again, the styling of the buttons in this case should happen in the Parent component. You can group them in a div with 'display: flex'\n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-dialog:\n>\n>```css\n>apex-dialog {\n> /* Sizes: */\n> --apex-dialog-max-width: 432px;\n>\n> /* Colors, Fills, Strokes: */\n> --apex-dialog-backdrop-background: #0B1222;\n> --apex-dialog-background: #FFFFFF;\n> --apex-dialog-close-icon-color: #0B1222;\n> --apex-dialog-close-icon-hover-color: #F96138;\n> --apex-dialog-title-color: #0B1222;\n> --apex-dialog-description-color: #5D6068;\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Drawer Component\nSimple Drawer component with the option to project everything necessary - title, description, content, actions.\nThe styling is only for the Drawer itself, the title and the description. The content and the actions can be anything so their styling is up to the parent component\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexDrawerComponent }\n>from '@apexara/ng-components/drawer';\n>\n>@Component({\n> imports: [ ApexDrawerComponent ]\n>})\n>\n>export class DrawerExampleComponent { }\n>```\n>**`parent.component.html`**\n>```html\n>@if (shouldRender) {\n> \n> Title Here\n>\n> Description Here\n>\n> \n> \n> \n>\n> \n> \n> Close\n> \n> \n> \n>}\n>```\n\n### Inputs\n\n>#### closeChange\n>This function should close the drawer. It is called by drawer.close() and is used for the closing transition. It must be provided if drawer.close() is used.\n\n>#### Drawer Title\n>The title is projected with the Select=['title']. All you need is an HTML element with 'title' set. In example\n\n>#### Drawer Description\n>The description is projected with the Select=['description']. All you need is an HTML element with 'description' set. In example\n>```html\n>Description Here\n>```\n\n>#### Drawer Content\n>You can place anything you want here. From Forms to Lists or whatever other stuff you need.\n>The Content is projected with the Select=['content']. All you need is an HTML element with 'content' set. In example\n>\n>**`parent.component.html`**\n>```html\n>\n> \n>\n>```\n>\n>**`parent.component.css`**\n>```css\n>apex-input {\n> --apex-input-error-color: red;\n>}\n>```\n\n>#### Drawer Actions\n>**`parent.component.html`**\n>The Actions are projected with the Select=['actions']. All you need is an HTML element with 'actions' set. In example\n>```html\n>\n> Close\n>\n>```\n>**`parent.component.html`**\n>Or with multiple actions:\n>```html\n>\n> Trigger Action 1\n> Trigger Action 2\n>\n>```\n>Again, the styling of the buttons in this case should happen in the Parent component. You can group them in a div with 'display: flex'\n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-drawer:\n>\n>```css\n>apex-drawer {\n> /* Sizes: */\n> --apex-drawer-width: 410px;\n>\n> /* Colors, Fills, Strokes: */\n> --apex-drawer-backdrop-background: #0B1222;\n> --apex-drawer-background: #FFFFFF;\n> --apex-drawer-title-color: #0B1222;\n> --apex-drawer-description-color: #5D6068;\n> --apex-drawer-box-shadow: 0px 4px 8px 0px #D6D6D635;\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Expander Component\nA simple component that has a title and and expanding option that displays additional text \nby expanding horizontally.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexExpanderComponent } \n>from '@apexara/ng-components/expander';\n>\n>@Component({\n> imports: [ ApexExpanderComponent ]\n>})\n>\n>export class ExpanderExampleComponent { }\n>```\n>**`parent.component.html`**\n>```html\n>\n> \n> With Variables\n> \n>\n> \n> Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.\n> \n>\n>\n>```\n\n### Inputs\n\n>#### isOpen -> boolean (false)\n>Set this to \"true\", to make the expander open by default.\n\n>#### maxHeight -> number | null (null)\n>Set this to stop the content's height from going above a certain number (px). \n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-expander:\n>```css\n>apex-expander {\n> /* Sizes: */\n> --apex-expander-border: 0px;\n>\n> /* Colors, Fills, Strokes: */\n> --apex-expander-background-color: #FFFFFF;\n> --apex-expander-title-color: #0B1222;\n> --apex-expander-content-color: #5D6068;\n> --apex-expander-chevron-color: #5D6068;\n> --apex-expander-chevron-open-color: #F96138;\n>\n> --apex-expander-outline-color: none;\n> /* Other */\n> --apex-expander-box-shadow: 0px 4px 8px 0px rgba(214, 214, 214, 0.35);\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Image Component\nAn image component that fetches an asset and displays it.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexIconComponent } \n>from '@apexara/ng-components/image';\n>\n>@Component({\n> imports: [ ApexIconComponent ]\n>})\n>\n>export class IconExampleComponent { }\n>\n>```\n>\n>**`parent.component.html`**\n>```html\n>\n> [src]=\"assets/img/example.svg\" \n> [ariaLabel]=\"Example aria label for icon.\">\n>\n>\n>```\n\n### Inputs\n>#### src \n>A url path to the desired img.\n\n>### ariaLabel\n>a string value that adds accessible name to the image.\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Input Component\nA Simple input field that handles formGroup, outputs validation errors, has helper messages and infos,\nemits click events on customizable icons that can be used to handle input changes.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexInputComponent, ApexInputOptions }\n>from '@apexara/ng-components/input';\n>\n>@Component({\n> imports: [ ApexInputComponent ]\n>})\n>\n>export class InputExampleComponent {\n>\n> public formGroup = new FormGroup({\n> inputControl: [[], [Validators.required]],\n> });\n>\n> public inputOptions = {\n> label: 'Sample label',\n> type: 'text',\n> placeholder: 'sample placeholder',\n> info: 'Sample info message on hover',\n> infoImg: 'icon.svg',\n> helperText: 'Sample helperText',\n> helperRoute: '/forgot-password',\n> prefixImg: 'email.svg',\n> suffixImg: 'password-hide.svg'\n> formGroup: this.formGroup,\n> formControlName: 'inputControl',\n> errors: {\n> required: 'error message to display',\n> }\n> }\n>\n>}\n>\n>```\n>**`parent.component.html`**\n>```html\n>\n>\n>\n>```\n\n### Inputs\n\n>#### label\n>Label above the input field.\n\n>#### type\n>You can pass the default input type attribute. Default is 'text'.\n\n>#### info && infoImg\n>Info is used together with infoImg to display and icon next to the label that on hover triggers\n>a tooltip with the info string.\n\n>#### placeholder\n>Replaces the input placeholder.\n\n>#### helperText && helperRoute\n>Positioned above the input on the right side ot the label & info can be used\n>to navigate to a given route.\n\n>#### prefixImg && suffixImg\n>Two images for the beggining and end of the input field.\n>suffixImg also emits event on clicks enabling additional logic to be added.\n\n>#### formGroup\n>Refference to the FormGroup that the apex-input will handle\n\n>#### formControlName\n>Refference to the name of the control that we will access in the FormGroup\n\n>#### errors\n>An object with properties which keys are refferences to Form ValidationErrors and a message to display if\n>the input Control has the error.\n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-input:\n>```css\n>apex-input {\n> /* Colors, Fills, Strokes: */\n> --apex-input-header-color: #0B1222;\n> --apex-input-placeholder-color: #0B1222;\n> --apex-input-text-color: #0B1222;\n>\n> /* when there are validator errors we make the text pop-up underneath and change its color */\n> --apex-input-error-color: #F96138;\n> --apex-input-border-error-width: 1px;\n>\n> /* Tooltip icon styling */\n> --apex-input-tooltip-icon-fill: transparent;\n> --apex-input-tooltip-icon-stroke: #C6C6C6;\n>\n> /* on all validators passed we make the text with this color */\n> --apex-input-success-color: #14BD6C;\n> --apex-input-border-color: #E9E9E9;\n> --apex-input-border-width: 1px;\n> --apex-input-value-color: #0B1222;\n>\n> /* Left icon fill & stroke : */\n> `--apex-input-icon-left-fill: #FFFFFF;\n> `--apex-input-icon-left-stroke: transparent;\n>\n> /* Right icon fill & stroke: */\n> --apex-input-icon-right-fill: #FFFFFF;\n> --apex-input-icon-right-stroke: transparent;\n>\n> /* Info icon (the one ot top with the label) fill & stroke */\n> `--apex-input-icon-info-fill: #FFFFFF;\n> `--apex-input-icon-info-stroke: transparent;\n>\n>/* Note: When you want to setup the color of your icon\n> you should experiment with both these variables or consider\n> using the one your icon is based on. */\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Listbox Component\nAPEX Listbox provides selectable options in a list format.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexListboxComponent, ApexListboxOptions } \n>from '@apexara/ng-components/listbox';\n>\n>@Component({\n> imports: [ ApexListboxComponent ]\n>})\n>\n>export class ListboxExampleComponent {\n>\n> public formGroup = new FormGroup({\n> listboxControl: [[], [Validators.required]],\n> });\n>\n> public listboxOptions = {\n> label: 'Sample label',\n> tooltip: 'Optional tooltip for listbox.'\n> data: [\n> { label: 'Option 1', value: 1 },\n> { label: 'Option 2', value: 2 },\n> { label: 'Option 3', value: 3 },\n> { label: 'Option 4', value: 4 },\n> { label: 'Option 5', value: 5 },\n> ],\n> formGroup: this.formGroup,\n> formControlName: 'listboxControl',\n> }\n>\n> public selectChange(event) {\n> // handle change selection if you are not using a form control.\n> }\n>}\n>\n>```\n>**`parent.component.html`**\n>```html\n>\n> [options]=\"listboxOptions\"\n> (selectChange)=\"$event\">\n>\n>\n>```\n\n### Inputs\n\n>#### label\n>Label above the listbox container.\n\n>#### formGroup\n>Refference to the FormGroup that the apex-listbox will handle a specific control\n\n>#### formControlName\n>Refference to the name of the control that we will access in the FormGroup\n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-listbox:\n\n>```css\n>apex-listbox {\n> /* Colors, Fills, Strokes: */\n> --apex-listbox-label-color: default;\n> --apex-listbox-background-color: #FFFFFF;\n>\n> --apex-listbox-item-color: #00000099;\n> --apex-listbox-item-selected-color: #F96138;\n>\n> /* Border */\n> --apex-listbox-border-color: #F2F2F2;\n> --apex-listbox-border-hovor-color: #4B5368;\n>\n> /* Tooltip icon styling */\n> --apex-listbox-tooltip-icon-fill: transparent;\n> --apex-listbox-tooltip-icon-stroke: #C6C6C6;\n>\n>/* Note: When you want to setup the color of the icon you\n> should experiment with both these variables >(fill&stroke)\n> or consider using the one your icon is based on. */\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Radio-button Component\nSimple styled radio-button that can accept a formGroup and a control.\n\n## Usage\n>**`parent.component.html`**\n>```html\n> [options]=\"{ \n> data: [dataOptionOne, dataOptionTwo],\n> inline: true\n> formGroup: formGroup\n> formControlName: formGroup.controls[controlName]\n> }\">\n>\n>\n> [options]=\"{\n> checked: 1\n> data: [dataOptionsOne, dataOptionTwo]\n> }\"\n> (selectChange)=\"handleChange($event)\">\n>\n>```\n\n### Inputs\n\n>#### data \n>Array of elements of type ApexRadioData\n\n>#### inline\n>Property that sets the flex-direction to row instead of column(default)\n\n>#### checked\n>Number refference to the index of the element inside the Array of data that we want to be checked by default.\n>Note: for FormGroup use default value inside the FormControl building.\n\n>#### formGroup\n>Refference to the FormGroup that the radio-button will handle\n\n>#### formControlName\n>Refference to the name of the control that we will access in the FormGroup\n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-radio-button:\n\n>```css\n>apex-radio-button {\n> --apex-radio-button-background-color: #FFFFFF;\n>\n> --apex-radio-button-text-color: #5D6068;\n>\n> --apex-radio-button-unchecked-border-color: #E9E9E9;\n> --apex-radio-button-checked-border-color: #F96138;\n> --apex-radio-button-disabled-border-color: #E7E7E7;\n>\n> --apex-radio-button-outline-color: none;\n>\n> --apex-radio-button-tooltip-icon-fill: transparent;\n> --apex-radio-button-tooltip-icon-stroke: #C6C6C6;\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Select Component\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexSelectComponent, ApexSelectOptions } \n>from '@apexara/ng-components/select';\n>\n>@Component({\n> imports: [ ApexSelectComponent ],\n>})\n>\n>export class SelectExampleComponent {\n>\n> public selectForm = this.formBuilder.group({\n> selectControl: [[], [Validators.required]],\n> });\n>\n> public execute() {\n> // bind any logic to select change or helperText click\n> }\n>\n> public selectOptions: ApexSelectOptions = {\n> label: 'Example label',\n> data: [\n> { label: 'Any string', value: any, icon: 'icon.svg' },\n> { label: '', value: any, icon: 'write.svg' },\n> { label: '', value: any },\n> ],\n> tooltip: 'tooltip text',\n> placeholder: 'Placeholder value',\n> helperText: 'Forgot password?',\n> prefixImg: 'example.svg',\n> formGroup: this.selectForm,\n> formControlName: 'selectControl',\n> errors: {\n> required: 'Select is required'\n> }\n> ,\n> // Optional: cap dropdown max height (px)\n> maxDropdownHeightPx: 240,\n> }\n>}\n>```\n>**`parent.component.html`**\n>```html \n>\n> [options]='selectOptions'\n> (selectChange)='execute()'\n> (helperTextChange)='execute()'>\n>\n>```\n\n### In-dropdown search\n>Set `searchInDropdown: true` to move the search input inside the dropdown\n>(instead of the trigger). Intended for multi-select. The trigger then shows\n>chips (or a counter when `counterAsValue: true`) and the arrow only, and the\n>search input auto-focuses when the dropdown opens.\n>```typescript\n>public selectOptions: ApexSelectOptions = {\n> label: 'Property Type',\n> data: [\n> { label: 'SFR', value: 'sfr' },\n> { label: 'Duplex', value: 'duplex' },\n> { label: 'Condo', value: 'condo' },\n> ],\n> multiple: true,\n> searchInDropdown: true,\n> counterAsValue: true,\n> placeholder: 'Select property types',\n> formGroup: this.selectForm,\n> formControlName: 'selectControl',\n>};\n>```\n\n### Grouped options with categories\n>Pass a `groups` array to render category headers above each section. `groups`\n>supersedes `data` when both are present. Grouped mode requires\n>`searchInDropdown: true` and uses native scroll (not virtual scroll), so it is\n>intended for bounded lists that fit comfortably within\n>`--apex-select-dropdown-body-max-height`. Search filters inside each category\n>and empty categories disappear.\n>```typescript\n>public selectOptions: ApexSelectOptions = {\n> label: 'Property Type',\n> data: [], // ignored when groups is present\n> groups: [\n> {\n> label: 'Residential',\n> data: [\n> { label: 'SFR', value: 'sfr' },\n> { label: 'SFR w/ ADU', value: 'sfr-adu' },\n> { label: 'Duplex', value: 'duplex' },\n> ],\n> },\n> {\n> label: 'Commercial',\n> data: [\n> { label: 'Medical', value: 'medical' },\n> { label: 'Mixed Use', value: 'mixed-use' },\n> ],\n> },\n> ],\n> multiple: true,\n> searchInDropdown: true,\n> counterAsValue: true,\n> formGroup: this.selectForm,\n> formControlName: 'selectControl',\n>};\n>```\n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-select:\n>```css\n>apex-select {\n> /* Dropdown styling */\n> --apex-select-dropdown-box-shadow: none;\n>\n> /* Input styling */\n> --apex-select-input-text-color: #0B1222;\n> --apex-select-input-text-selected-color: #F96138;\n> --apex-select-input-placeholder-color: #0B1222;\n>\n> /* Chip styling (used on searchable multiple options) */\n> --apex-select-chip-font-size: 10px;\n> --apex-select-chip-color: #FFFFFF;\n> --apex-select-chip-background-color: #0B1222;\n> --apex-select-chip-icon-color; #FFFFFF;\n>\n> /* tooltip icon styling */\n> --apex-select-tooltip-icon-fill: transparent;\n> --apex-input-tooltip-icon-stroke: #C6C6C6;\n>\n> /* Prefix icon styling */\n> --apex-select-icon-prefix-fill: #C6C6C6;\n> --apex-select-icon-prefix-stroke: transparent;\n>\n> /* Background color of the input element inside the select */\n> --apex-select-input-background-color: #FFFFFF00;\n>\n> /* Border color of the input element inside the select */\n> --apex-select-input-border-color: #E9E9E9; \n> --apex-select-input-border-width: 1px;\n>\n> /* Options divider color */\n> --apex-select-options-divider-color: #E9E9E9;\n> --apex-select-options-divider-height: 1px;\n>\n> /* Border color on hover */\n> --apex-select-input-border-hover-color: #4B5368;\n>\n> /* Border color on disabled */\n> --apex-select-input-border-disabled-color: #F2F2F2;\n>\n> /* Border and text color for when Select is invalid */\n> --apex-select-invalid-color: #F96138;\n> --apex-select-invalid-border-width: 1px;\n>\n> /* Arrow: */\n> --apex-select-arrow-color: #5D6068;\n> --apex-select-arrow-checked-color: #F96138;\n>\n> /* Header: */\n> --apex-select-header-color: #0B1222;\n> --apex-select-helper-text-color: #5D6068;\n>\n> /* if type table */\n> --apex-select-input-table-color: #5D6068;\n>\n> /* Dropdown: */\n> --apex-select-dropdown-border-color: #E9E9E9;\n> --apex-select-dropdown-background-color: #FFFFFF;\n>\n> /* In-dropdown search row (searchInDropdown: true) */\n> --apex-select-dropdown-search-border-color: #E9E9E9;\n> --apex-select-dropdown-search-icon-color: #5D6068;\n>\n> /* Dropdown body scroll area (grouped mode) */\n> --apex-select-dropdown-body-max-height: 320px;\n>\n> /* Group header (grouped mode) */\n> --apex-select-group-header-color: #9A9A9A;\n>\n> /* Option icons (per-item icons in dropdown): */\n> --apex-select-option-icon-size: 20px;\n> --apex-select-option-icon-spacing: 10px;\n> --apex-select-option-icon-fill: #5D6068;\n> --apex-select-option-icon-stroke: #ffffff00;\n> --apex-select-option-icon-selected-fill: #F96138;\n> --apex-select-option-icon-selected-stroke: #ffffff00;\n>\n>/* Note: When you want to setup the color of your icon\n> you should experiment with both these variables or consider\n> using the one your icon is based on. */\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Datepicker Component\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexDatepickerComponent, ApexDatepickerOptions } \n>from '@apexara/ng-components/datepicker';\n>\n>@Component({\n> imports: [ ApexDatepickerComponent ],\n>})\n>\n>export class DatepickerExampleComponent {\n>\n> public datePickerForm = this.formBuilder.group({\n> singleDate: ['', [Validators.required]],\n> fromRange: ['', [Validators.required]],\n> toRange: ['', [Validators.required]],\n> });\n>\n> this.singleDateOptions = { \n> label: 'Pick a single date.',\n> formGroup: this.formGroup,\n> formControlName: 'singleDate',\n> errors: {\n> required: 'This is a required field.'\n> },\n> min: new Date(2000, 1, 1),\n> max: new Date(2025, 1, 1),\n> }\n>\n> this.rangeDateOptions = {\n> label: 'Pick a range dates.',\n> formGroup: this.formGroup,\n> formControlName: new DateRangeFormControls('fromRange', 'toRange'),\n> errors: {\n> required: 'This is a required field',\n> },\n> min: new Date(2000, 1, 1),\n> max: new Date(2025, 1, 1),\n> };\n>\n>}\n>```\n>**`parent.component.html`**\n>```html \n> \n>\n> \n>```\n\n### Inputs\n>\n>\n>#### options\n>Options are of type ApexDatepickerOptions with the following properties:\n>\n> label - string - used for how long the snackbar should be displayed\n>\n> formGroup - Refference to the FormGroup that the datepicker will handle\n>\n> formControlName - either a string or instance of class DateRangeFormControls\n>\n> min - a Minimal value for Date to be selectable.\n>\n> max - a Maximum value for Date to be selectable.\n>\n> errors - An object with properties which keys are\n> refferences to Form ValidationErrors and a message to display if\n> the input Control has the error.\n>\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-datepicker:\n>```css\n>apex-datepicker {\n>\n> /* Picker variables */\n> --apex-datepicker-svg-background-color:#FF7955;\n> --apex-datepicker-border: 1px solid #E9E9E9;\n> --apex-datepicker-border-hover-color: #FF7955;\n> \n> --apex-datepicker-error-color: #F96138;\n> --apex-datepicker-svg-fill-color #FFFFFF;\n> \n> --apex-datepicker-svg-background-hover-color: #F96138;\n> \n> --apex-datepicker-input-color: #0B1222;\n>\n> --apex-datepicker-header-text-color: #FF7955;\n>\n> --apex-calendar-background-color: #FFFFFF;\n>\n> --apex-calendar-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);\n>\n> --apex-calendar-header-active-date-view-focus-color: #FFFFFF;\n> \n> --apex-calendar-header-active-date-view-focus-background-color: #FF7955;\n> \n> --apex-calendar-header-active-date-view-hover-color: #FFFFFF;\n> \n> --apex-calendar-header-active-date-view-hover-background-color: #FF7955;\n>\n> --apex-calendar-header-chevron-hover-focus-color: #FFFFFF;\n> \n> --apex-calendar-header-chevron-hover-focus-background-color: #FF7955;\n> \n> --apex-calendar-header-chevron-disabled-color: #5D6068;\n> \n> --apex-calendar-month-view-table-header-color: #C6C6C6;\n> \n> --apex-calendar-month-view-table-header-border-bottom-color: #C6C6C6;\n> \n> --apex-calendar-multi-year-view-table-header-border-bottom-color: #C6C6C6;\n> \n> --apex-calendar-year-view-table-header-border-bottom-color: #C6C6C6;\n> \n> --apex-calendar-body-cell-color: #0B1222;\n>\n> --apex-calendar-body-cell-background-color: none;\n>\n> --apex-calendar-body-cell-border: none;\n>\n> --apex-calendar-body-cell-hover-color: white;\n>\n> --apex-calendar-body-cell-hover-background-color: #FFD2C6;\n> \n> --apex-calendar-body-today-cell-border: #FFD2C6;\n> \n> --apex-calendar-body-active-cell-background-color: #f9613880;\n> --apex-calendar-body-cell-selected-color: #FFFFFF;\n> --apex-calendar-body-cell-selected-background-color: #F96138;\n> --apex-calendar-body-cell-in-range-background-color: #FFF2EF;\n> --apex-calendar-body-cell-in-range-active-background-color: #FFD2C6;\n> \n> --apex-calendar-body-cell-in-preview-background-color: #F962381C;\n> \n> --apex-calendar-body-cell-in-preview-border: 1px dashed #F96138;\n> --apex-calendar-body-cell-in-range-border: 1px solid #F96138;\n> --apex-calendar-body-cell-range-start-border: 1px sold #F96138;\n> --apex-calendar-body-cell-range-start-background-color: #F96138;\n> \n> --apex-calendar-body-cell-range-start-color: #FFFFFFF;\n> --apex-calendar-body-cell-range-end-border: 1px sold #F96138;\n> --apex-calendar-body-cell-range-end-background-color: #F96138;\n> \n> --apex-calendar-body-cell-range-end-color: #FFFFFFF;\n> --apex-calendar-body-cell-active-in-range-start-end-background-color: #FFD2C6;\n> --apex-calendar-body-cell-preview-end-border: 1px dashed #F96138;\n> --apex-calendar-body-cell-preview-end-background-color: #FFD2C6;\n> --apex-calendar-body-cell-preview-end-color: #FFFFFF;\n> --apex-calendar-body-cell-preview-start-border: 1px dashed #F96138;\n> --apex-calendar-body-cell-preview-start-background-color: #FFD2C6;\n> \n> --apex-calendar-body-cell-preview-start-color: #FFFFFF;\n> --apex-calendar-body-cell-in-preview-range-start-border: 0px;\n> --apex-calendar-body-cell-in-preview-range-end-border: 0px;\n> \n> --apex-calendar-body-cell-disabled-background-color: #E0DFDE;\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Carousel Component\n\nA dynamic, responsive carousel component designed to enhance user experience. It includes smooth scrolling, keyboard navigation, clickable navigation buttons, and a progress indicator.\n\n---\n\n## Usage\n>### `parent.component.ts`\n>\n>```typescript\n>import { Component } from '@angular/core';\n>import { ApexCarouselComponent } from '@apexara/ng-components/carousel';\n>\n>@Component({\n> imports: [ApexCarouselComponent],\n> selector: 'app-carousel-example',\n> templateUrl: './carousel-example.component.html',\n> styleUrls: ['./carousel-example.component.css']\n>})\n>export class CarouselExampleComponent {\n> \n>}\n>```\n>\n>### `parent.component.html`\n>\n>```html\n>\n> @for (let item of [1, 2, 3, 4, 5]; track $index) {\n>
Item {{ item }}
\n> }\n>```\n\n---\n\n### Features and Inputs\n\n#### **Dynamic Content**\nWrap any HTML or Angular components within `` to display them in the carousel.\n\n#### **Progress Bar**\nAutomatically updates as the carousel scrolls.\n\n#### **Navigation Buttons**\nIncludes \"previous\" and \"next\" buttons with accessible keyboard navigation.\n\n#### **Scroll Behavior**\nSupports smooth scrolling with `scroll-snap` for seamless transitions.\n\n#### **Custom CSS Variables**\nThe following variables allow for customization of colors, dimensions, and other styles:\n\n---\n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-carousel:\n>\n>```css\n>apex-carousel {\n> /* Carousel Background */\n> --apex-carousel-background-color: transparent;\n>\n> --apex-carousel-button-border-color: #FFFFFF;\n> --apex-carousel-button-border-hover-color: #FFFFFF;\n>\n> --apex-carousel-chevron-color: #FFFFFF;\n> --apex-carousel-chevron-hover-color: #FFFFFF;\n>\n> /* Progress Bar */\n> --apex-carousel-scrollbar-color: #FFFFFF;\n> --apex-carousel-scrollbar-container-color: #020617;\n>\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Snackbar Service\nA services that provides a way to display messages on the screen.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>\n>import { \n> ApexSnackbarService,\n> ApexSnackbarOptions,\n> horizontalPosition,\n> verticalPosition } \n>from '@apexara/ng-components/snackbar';\n>\n>@Component({\n> imports: [],\n>})\n>\n>export class SnackbarExample {\n>\n> public message = 'Message to be displayed';\n>\n> public options: ApexSnackbarOptions = {\n> error: true,\n> icon: 'example.svg',\n> animationDuration: 20\n> };\n>\n> // Inject to the component from which you want to execute it\n> constructor(public snackbarService: ApexSnackbarService) {\n> // optionally setting the position\n> this.snackbarService.setPosition({\n> verticalPosition: verticalPosition.Bottom,\n> horizontalPosition: horizontalPosition.Center\n> });\n> }\n>\n>}\n>```\n>**`parent.component.html`**\n>```html\n> (click)=\"this.snackbarService.open(message, options)\">\n>\n>```\n>\n\n### Inputs\n\n>#### positionOptions\n>verticalPosition & horizontalPosition\n>Optional properties of SnackbarPosition interface that is used to set custom \n>position of the snackbar\n\n>#### message\n>Message to be displayed\n\n>#### options\n>Options are of type ApexSnackbarOptions with the following properties:\n>ย ย ย ย title (optional) โ€“ string โ€“ overrides the default 'Error' or 'Success' title with a custom static header\n> animation-duration - number - used for how long the snackbar should be displayed\n> icon (optional) - string - icon name that must be located inside assets/img/ (using apex-img)\n> error (optional) - boolean - used to distinguish error message from info.\n> backgroundColor (optional) - string - sets the background color of the snackbar.\n> placeholderTextColor (optional) - string; - sets title heading text of snackbar color.\n> messageTextColor (optional) - string - sets snackbar message color.\n> progressColor (optional) - string - sets color of animation showing the snackbar showing duration.\n> xIconColor (optional) - string - sets the closing icon color of the snackbar.\n>\n> Note: Default values are set as CSS Variables in the initial component, changing of colors happens as options passed to the open() method.\n\n### CSS Variables\n>\n>```css\n>apex-snackbar {\n> /* Colors, Fills, Strokes: */\n> --apex-snackbar-background-color: #14BD6C;\n> --apex-snackbar-error-background-color: #F96138;\n>\n> --apex-snackbar-placeholder-text-color: #FFFFFF;\n> --apex-snackbar-message-text-color: #FFFFFF;\n>\n> --apex-snackbar-progress-color: #FFFFFF;\n>\n> /* Color of closing icon of the snackbar */\n> --apex-snackbar-x-icon-color: #FFFFFF;\n>\n> --apex-snackbar-animation-duration: 10s;\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Overlay Service\n Service to create Overlays. Overlays are dynamically added pieces of floating UI, meant to be used as a low-level building block for other components. Dialogs, tooltips, menus, selects, etc. can all be built using overlays.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>\n>import { Component } from '@angular/core';\n>import { OverlayService } from '@apexara/ng-components/services';\n>\n>@Component({\n> imports: [],\n> template: `\n> \n> `,\n>})\n>\n>export class FloatingComponentExample {\n>\n> constructor(private overlayService: OverlayService) {}\n>\n> openOverlay() {\n> // Create and open the overlay\n>\n> // Add your custom content to the overlay\n> const overlayContent = document.createElement('div');\n> overlayContent.innerText = 'This is an overlay!';\n> const overlayRef = this.overlayService.apendToOverlay(overlayContent, true);\n>\n> // Close the overlay after 3 seconds\n> setTimeout(() => {\n> overlayRef.removeFromOverlay(overlayContent);\n> }, 3000);\n> }\n>}\n>```\n>\n>#### appendToOverlay(content: HTMLElement, blockable = false)\n>Adds an HTMLElement in the overlay.\n>\n>>#### removeFromOverlay(content: HTMLElement)\n>Remove an HTMLElement if its inside the overlay. \n>Also if it is the last removed element inside the overlay clears all the focus logic and removes the \n>whole overlay.\n>\n>#### blockable\n>When set to true, the `blockable` property triggers scroll block inside the overlay. This prevents \n>scrolling of the underlying content while the overlay is open, ensuring that the user's focus \n>remains within the overlay.\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Table Component\nA simple table that can project data sorted by columns x rows providing editing, sorting and filtering \nof the data. \n\nTwo types of tables are available. One with local data and local sorting & filtering and a server side one.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { \n> ApexTableComponent,\n> ApexTableColumn,\n> ApexTableColumnType } \n>from '@apexara/ng-components/table';\n>\n>@Component({\n> imports: [ ApexTableComponent ]\n>})\n>\n>export class TableExampleComponent {\n>\n> // Used for searching and filtering\n> public tableFilter: string;\n>\n> public tableData = [{\n> id: 'D1954F',\n> name: 'John Doe',\n> credits: 333,\n> cash: 113,\n> admin: false,\n> years: 19,\n> date: new Date()\n> listName: 'first list'\n> },\n> {\n> id: 'A7D543',\n> name: 'Alice Cooper',\n> credits: 500,\n> cash: 100,\n> years: 33,\n> admin: true,\n> date: new Date()\n> listName: 'second list'\n> },\n> {\n> id: 'BB13DA',\n> name: 'Will Smith',\n> credits: 1000,\n> cash: 250,\n> admin: true,\n> years: 33,\n> date: new Date()\n> listName: 'third list',\n> }]\n>\n> public tableColumns: ApexTableColumn[] = [\n> { label: 'Id', value: 'id', width: '70px' },\n> { label: 'Name', value: 'name', width: '70px' },\n> { label: 'Date', value: 'date', type: ApexTableColumnType.Date, \n> dateFormat: \n> { \n> format: 'shortDate',\n> locale: 'en-US',\n> timezone: '+0100'\n> },\n> width: '60px' }\n> { label: 'Years', value: 'years', type: ApexTableColumnType.Number, width: '60px'}\n> { label: 'Credits', value: 'credits', type: ApexTableColumnType.Number width: '70px' },\n> { label: 'Cash', value: 'cash', type: ApexTableColumnType.Number width: '70px' },\n> /* We can use +, -, /, * operations on the value property if it's of type NumberMath */\n> { label: 'Total cash', value: 'credits * 1.5 + cash', type: ApexTableColumnType.NumberMath width: '70px' },\n> { label: 'Admin', value: 'admin', type: ApexTableColumnType.Chip width: '70px' },\n> { label: 'List name', value: 'listName', width: '70px' },\n> { label: 'Actions', type: ApexTableColumnType.Actions, width: '100px',\n> singleActions: [\n> label: 'Download',\n> showOn: [\n> { property: 'admin', values: [true] }\n> ],\n> icon: 'img/download.svg',\n> execute: (row) = execute(row: any)\n> ]\n> }\n> ]\n> \n> public tableChange(from: number, to: number, nextSortingColumn?: any, filter?: string): any {\n> // Your server side data logic here\n> }\n>\n> public execute(row: any) {\n> // bind any logic to customizable icon inside the table row\n> }\n> \n>}\n>```\n>**`parent.component.html`**\n>```html\n> [serverSide]=\"true\"\n> [data]=\"tableData\" [columns]=\"tableColumns\"\n> [filter]=\"tableFilter\" [pageable]=\"true\" \n> [dataLength]=\"tableData.length\"\n> [isLoading]=\"true/false\"\n> (tableChange)=\"tableChange($event.from, $event.to, $event.sort, $event.filter)\">\n>\n>\n> [data]=\"localData\" [columns]=\"tableColumns\"\n> [filter]=\"tableFilter\" [pageable]=\"true\">\n>\n>```\n\n### Inputs\n\n#### Virtual Scroll Example (Local Data)\n>```html\n>\n>\n>```\n\n>#### virtualScroll\n>Enables virtual scrolling for local data tables. Renders only visible rows inside a virtual viewport for better performance with large datasets.\n>\n\n>#### tableHeight\n>Total table height in pixels (including header). The virtual viewport height is automatically calculated from this value. Default is `800`.\n\n>#### serverSide\n>When true it make the table emit events when a change happens with the following properties \n>{from, to, sort, filter} which we can use to create a request and get data.\n>Also stops local filter and sorting logic from executing.\n\n>#### data\n>The data that the table initializes.\n> \n\n>#### columns - ApexTableColumn Interface\n>The columns that will the table have and based on the columns the data will be visualized.\n>\n>The ApexTableColumn interface defines the structure of each column in the APEX Table component. Each column can have various properties to customize its behavior and appearance.\n>\n>\n>**label?: string**: The display label for the column header.\n>\n>**value?: string**: The key in the data object that corresponds to this column.\n>\n>**type?: ApexTableColumnType**: The type of data in the column, which can determine how it's rendered (e.g., date, number, chip, etc.).\n>\n>**width?: string**: The width of the column, defined as a CSS width value (e.g., '70px').\n>\n>**editable?: boolean**: Indicates whether the column can be edited by the user.\n>\n>**prefix?: string**: A string to be displayed before the column value.\n>\n>**suffix?: string**: A string to be displayed after the column value.\n>\n>**singleActions?: Action[]**: An array of actions available for a single row in this column.\n>\n>**multipleActions?: Action[]**: An array of actions available for multiple rows in this column.\n>\n>**dateFormat?: ApexDateFormatOptions**: Formatting options for date values in the column.\n>\n>**chipLabel?: { [key: string]: string }**: A mapping of labels for chip display in the column.\n>\n>**class?: string | { [key: string]: string }**: Custom CSS classes for styling the column.\n>\n>**change?: string**: Row property path for a percentage change value. When set, an inline chip appears next to the cell value showing the change (e.g., \"+6.2%\") โ€” green for positive, red for negative. Works with Text, Number, Currency, and NumberMath column types.\n>\n>**listOptions?: ApexTableListOptions**: Groups list column display options into a single object.\n>- `label?: string` โ€” the property name on each array item to use as the display label (e.g., `'name'`).\n>- `max?: number` โ€” the maximum number of items to show before the overflow badge. Default is `3`.\n>\n>**cellOptions?: ApexTableCellOptions**: Groups cell-level display options (icon, icon position, color) into a single object.\n>\n>```typescript\n>export interface ApexTableCellOptions {\n> icon?: string | { [key: string]: string }; // static icon or value-to-icon map\n> iconPosition?: 'left' | 'right'; // default: 'left'\n> iconColor?: { [key: string]: string }; // value-to-color map for icon fill/stroke\n> textColor?: { [key: string]: string }; // value-to-color map for text color (Text columns)\n> chipColor?: { [key: string]: string }; // value-to-color map for chip text color (Chip columns)\n> chipBackgroundColor?: { [key: string]: string }; // value-to-color map for chip background (Chip columns)\n>}\n>```\n>\n>**Icon with color example** โ€” use `cellOptions` to set icon and text color per value:\n>```typescript\n>{\n> label: 'Trend', value: 'trend', width: '120px',\n> cellOptions: {\n> icon: { 'Up': 'arrow-up.svg', 'Down': 'arrow-down.svg', 'Neutral': 'neutral.svg' },\n> iconColor: { 'Up': '#26D280', 'Down': '#FF4242', 'Neutral': '#FFA753' },\n> textColor: { 'Up': '#26D280', 'Down': '#FF4242', 'Neutral': '#FFA753' }\n> }\n>}\n>```\n>\n>**Chip column styling example** โ€” use `cellOptions` to set chip colors per value without predefined CSS classes:\n>```typescript\n>{\n> label: 'Status', value: 'status', type: ApexTableColumnType.Chip,\n> chipLabel: { 'active': 'Active', 'pending': 'Pending', 'inactive': 'Inactive' },\n> cellOptions: {\n> chipColor: { 'active': '#00B67A', 'pending': '#FFA753', 'inactive': '#FF4242' },\n> chipBackgroundColor: { 'active': '#E6F9F0', 'pending': '#FFF8EF', 'inactive': '#FFF2EF' }\n> }\n>}\n>```\n>\n\n>#### columnType - ApexTableColumnType\n>```typescript\n>export enum ApexTableColumnType {\n> Text, // A standard text column\n> Date, // A column for displaying dates\n> Currency, // A column for displaying currencies\n> Chip, // A column for displaying chip components\n> Checkbox, // A column for displaying checkboxes\n> Number, // A column for displaying numbers\n> NumberMath, // A column for displaying combined properties' values numbers with additional addition, subtraction, multiplication, division logic.\n> Actions, // A column for action buttons\n> List, // A column for displaying arrays with overflow badge\n> Status, // A column for displaying multi-step progress indicators\n>}\n>```\n>\n>Each column type is handled through specific templates:\n>\n>Text Column: Displays standard text, can be editable.\n>\n>Date Column: Formats and displays dates.\n>\n>Chip Column: Displays chips for categorical data.\n>\n>Checkbox Column: Displays checkboxes, currently read-only.\n>\n>Number Column: Displays numbers with optional prefix and suffix. This column type also supports calculations based on the numeric values.\n>\n>Actions Column: Displays action buttons with dynamic visibility based on context.\n>\n>List Column: Displays an array of objects as a formatted text string joined by \" / \" (e.g., \"Miami / Orlando / Tampa\"). When the array exceeds `listOptions.max` items, an overflow badge (+N) appears. Hovering the badge shows a tooltip with all remaining items.\n>\n>Status Column: Displays a horizontal sequence of labeled steps, each underlined by a colored bar. Steps up to and including the row's current status show their configured color; later steps show a muted gray bar. Useful for deal pipelines, order progress, approval flows, etc.\n\n### List Column Usage\n\n>```typescript\n>// Data\n>public tableData = [\n> {\n> id: 1,\n> locations: [\n> { name: 'Miami' },\n> { name: 'Orlando' },\n> { name: 'Tampa' },\n> { name: 'Jacksonville' },\n> { name: 'Tallahassee' }\n> ]\n> }\n>];\n>\n>// Column config\n>public tableColumns: ApexTableColumn[] = [\n> {\n> label: 'Locations',\n> value: 'locations',\n> type: ApexTableColumnType.List,\n> listOptions: {\n> label: 'name', // which property on each item to display\n> max: 3, // show first 3, then \"+2\" badge\n> },\n> width: '200px'\n> }\n>];\n>```\n>\n>This renders: **Miami / Orlando / Tampa** `+2`\n>\n>Hovering `+2` shows a tooltip with:\n>- Jacksonville\n>- Tallahassee\n\n### List Column CSS Variables\n\n>| Variable | Default | Description |\n>|---|---|---|\n>| `--apex-table-list-overflow-background` | `transparent` | Overflow badge background |\n>| `--apex-table-list-overflow-color` | `#FFA753` | Overflow badge text color |\n>| `--apex-table-list-overflow-border-color` | `#FFEFE1` | Overflow badge border color |\n\n### Status Column Usage\n\n>```typescript\n>export interface ApexTableStatusStep {\n> label: string; // Display label for the step\n> value: string | number | boolean; // Identifier matched against the row's status value (strict equality)\n> color: string; // Bar color when this step is reached\n>}\n>```\n>\n>The row's status value (resolved from `column.value`) is matched against each step's `value`. All steps up to and including the matched one are considered completed and show their configured `color`. Remaining steps show the muted incomplete color. If the value doesn't match any step โ†’ every step renders as incomplete.\n>\n>```typescript\n>// Data\n>public tableData = [\n> { id: 1, offerStatus: 'listed' },\n> { id: 2, offerStatus: 'sold' },\n> { id: 3, offerStatus: 'offerAccepted' }\n>];\n>\n>// Column config\n>public tableColumns: ApexTableColumn[] = [\n> {\n> label: 'Offer Status',\n> value: 'offerStatus',\n> type: ApexTableColumnType.Status,\n> width: '320px',\n> statusSteps: [\n> { label: 'Listed', value: 'listed', color: '#FBD84A' },\n> { label: 'Receiving Offers', value: 'receivingOffers', color: '#4AC0E0' },\n> { label: 'Offer Accepted', value: 'offerAccepted', color: '#26D280' },\n> { label: 'Sold', value: 'sold', color: '#FFA753' }\n> ]\n> }\n>];\n>```\n\n### Status Column CSS Variables\n\n>| Variable | Default | Description |\n>|---|---|---|\n>| `--apex-table-status-gap` | `8px` | Gap between steps |\n>| `--apex-table-status-bar-height` | `3px` | Height of the underline bar |\n>| `--apex-table-status-incomplete-color` | `#E5E7EB` | Bar color for not-yet-reached steps |\n>| `--apex-table-status-label-color` | `#888B95` | Label color for not-yet-reached steps |\n>| `--apex-table-status-label-completed-color` | `#191B22` | Label color for reached steps |\n\n### Cell Icons\n\nCell icons allow you to display an icon next to the text in a cell. The icon can be static or mapped per value, making it useful for status indicators, engagement levels, etc.\n\n>```typescript\n>// Column with value-mapped icons and colors\n>public columns: ApexTableColumn[] = [\n> {\n> label: 'Engagement',\n> value: 'engagement',\n> width: '120px',\n> cellOptions: {\n> icon: {\n> 'High': 'arrow-up.svg',\n> 'Medium': 'arrow-up-right.svg',\n> 'Low': 'arrow-down.svg'\n> },\n> color: {\n> 'High': '#26D280',\n> 'Medium': '#FFA753',\n> 'Low': '#FF4242'\n> }\n> }\n> }\n>];\n>```\n>\n>This renders an arrow icon + colored text per value:\n>- **High**: green arrow up + green text\n>- **Medium**: orange diagonal arrow + orange text\n>- **Low**: red arrow down + red text\n>\n>Use `iconPosition: 'right'` inside `cellOptions` to place the icon after the text.\n\n>```typescript\n>export interface Action {\n> icon: string; // Icon source. example: ('assets/icons/icon.svg')\n> label: string; // Label for icon. Tooltip pops on hover.\n> class?: string, // Custom class to add to the specific action.\n> showOn?: ActionShowType, // Array of different objects that represent a condition the row should meet in order to be shown\n> disabled?: boolean, // A column for displaying numbers\n> NumberMath, // A column for displaying combined properties' values numbers with additional addition, subtraction, multiplication, division logic.\n> execute?: (row: any): void, // A column for action buttons\n>}\n>```\n>### **Action ShowOn Examples with Passed Properties to a Column**\n>```typescript \n>export type ActionShowType = Array<{ property: string; values: any[], exists?: boolean; }>\n>\n>```\n>\n>The `showOn` property allows actions to be conditionally displayed based on row values. It supports:\n>- **Single property conditions**: `{ property: 'status', values: ['pending'] }`\n>- **Multiple value conditions**: `{ property: 'status', values: ['completed', 'archived'] }`\n>- **Multiple property & values**: `{ property: 'admin', values: [true] }`, `{ property: 'status', values: ['approved', 'rejected'] }`\n>- **Check if exists conditions (values are no longer taken into consideration)**: `{ property: 'status', values: [], exists: true/false }`\n>\n>#### **Explicit Property Matching**\n>The action will be displayed **only if all conditions match**.\n>\n>```typescript\n>singleActions: [\n> {\n> label: 'Edit',\n> icon: 'img/edit.svg',\n> showOn: [\n> { property: 'status', values: ['pending'] }, // Requires status === 'pending'\n> { property: 'createdBy.role', values: ['Admin'] } // Requires createdBy.role === 'Admin'\n> ],\n> execute: (row) => console.log('Edit action for', row),\n> }\n>]\n>```\n>\n>- **Visible if** `status === 'pending'` **and** `createdBy.role === 'Admin'`.\n>\n>\n>\n>#### **Multiple Possible Values for a Single Property**\n>The action will be displayed **if the property matches any of the specified values**.\n>\n>```typescript\n>singleActions: [\n> {\n> label: 'Delete',\n> icon: 'img/delete.svg',\n> showOn: [\n> { property: 'status', values: ['completed', 'archived'] }, // Matches either 'completed' or 'archived'\n> ],\n> execute: (row) => console.log('Delete action for', row),\n> }\n>]\n>```\n>\n>---\n>\n>### **How It Works**\n>- **All conditions inside `showOn` must be met for the action to appear**.\n>- **Supports deeply nested properties** like `createdBy.role`.\n>\n>---\n>\n\n>#### pageable\n>Whether or not the table has more than one page\n\n>#### sortable\n>Blocks local sorting when set to false\n\n>#### currentSortedColumn / used with serverSide /\n>Refference to the column that is used as a sorter needed for keeping track when changes occur (example\n>page change, new sorting column, sorting same column (reverse sorting), filtering)\n\n>#### isLoading / used with serverSide /\n>When true triggers an animation that blocks the table and shows a loading bar.\n\n>#### dataLength / used with serverSide /\n>The length of the data passed from parent element needed to display properply the pages and the results count.\n\n>#### stickyHeader\n>When true, the table header row sticks to the top of the viewport when the user scrolls down the page. The header gets a background color only when it's actually stuck (scrolled past).\n\n>#### editMode\n>When true, enables edit/selection mode. A checkbox column appears on the right side of each row allowing row selection. Supports shift+click for range selection. A \"Select all\" / \"Deselect\" text button appears in the header.\n\n>#### selectionChange\n>EventEmitter that fires with an array of selected row objects whenever the selection changes in edit mode. Use this to wire up any external actions (delete, export, move, etc.) on the selected rows.\n\n>#### editModeChange\n>EventEmitter that fires with a boolean whenever `editMode` changes. Useful for external components that need to react to the table entering or exiting edit mode.\n\n### CSS Variables\n>Here are all the available CSS variables (and their default values) you can set when using the apex-table:\n>\n>```css\n>apex-table {\n> /* Colors, Fills, Strokes: */\n> --apex-table-background-color: #FFFFFF;\n> --apex-table-row-bottom-border-color: #E9E9E9;\n> --apex-table-first-row-text-color: #5D6068;\n> --apex-table-arranger-hover-color: #F96138;\n> --apex-table-loading-bar-color: #FF7F50;\n>\n> /* Color of all icons on hover */\n> --apex-table-action-icon-hover-fill: #F96138;\n> --apex-table-action-icon-hover-stroke: #FFFFFF00;\n> --apex-table-action-hover-background-color: #F7F8FB;\n>\n> /* Color of the single icons */\n> --apex-table-action-icon-fill: #5D6068;\n> --apex-table-action-icon-stroke: #FFFFFF00;\n>\n> /* Secondary color of single icons */\n> --apex-table-action-secondary-icon-fill: #F96138;\n> --apex-table-action-secondary-icon-stroke: #FFFFFF00;\n>\n> --apex-table-action-secondary-icon-hover-fill: #5D6068;\n> --apex-table-action-secondary-icon-hover-stroke: #FFFFFF00;\n>\n> /* Default color of the more actions (three dots) icon */\n> --apex-table-action-more-icon-default-fill: #5D6068;\n> --apex-table-action-more-icon-default-stroke: #FFFFFF00;\n>\n> /* Color of the more actions icon on hover / when opened */\n> --apex-table-action-more-icon-fill: #F96138;\n> --apex-table-action-more-icon-stroke: #FFFFFF00;\n>\n> /* Color of the icons of multiple actions */\n> --apex-table-dropdown-action-icon-fill: #5D6068;\n> --apex-table-dropdown-action-icon-stroke: #FFFFFF00;\n>\n> /* Background on dropdown if stacked actions are initialized */\n> --apex-table-more-actions-dropdown-background-color: #FFFFFF;\n> --apex-table-more-actions-dropdown-hover-background-color: #00000010;\n>\n> /* Page picker styling */\n> --apex-table-page-picker-text-color: #FFFFFF;\n> --apex-table-page-picker-background: #F96138;\n>\n> /* Chip columns color styling (used by class=\"primary\" / class=\"secondary\") */\n> --apex-table-chip-color: #F96138;\n> --apex-table-chip-background-color: #FFF2EF;\n>\n> --apex-table-chip-color-secondary: #0B1222;\n> --apex-table-chip-background-color-secondary: #E2E2E2;\n>\n> /* Chip colors can also be set per-value via cellOptions.color / cellOptions.backgroundColor */\n>\n> /* Cell icon color (set per-value via cellOptions.iconColor, applies to both fill and stroke SVGs) */\n> --apex-table-cell-icon-fill: unset;\n> --apex-table-cell-icon-stroke: unset;\n>\n> /* Sticky header background when stuck */\n> --apex-table-header-background-color: #FFFFFF;\n>\n> /* Edit mode - selected row highlight */\n> --apex-table-selected-row-background-color: #FFF7F5;\n>\n> /* Edit mode - \"Select all\" / \"Deselect\" button */\n> --apex-table-select-all-color: #F96138;\n> --apex-table-select-all-hover-color: #E0562F;\n> --apex-table-select-all-background-color: transparent;\n> --apex-table-select-all-font-size: 12px;\n> --apex-table-select-all-font-weight: 600;\n>\n>/* Note: When you want to setup the color of your icon\n> you should experiment with both these variables or consider\n> using the one your icon is based on. */\n>}\n>```\n\n[๐Ÿ”ผ Back to top](#components)\n\n-----------------------------------------------------------------\n\n# APEX Textarea Component\nA simple input textarea that handles formGroup control with validators.\n\n## Usage\n>**`parent.component.ts`**\n>```typescript\n>import { ApexTextAreaComponent, ApexTextAreaOptions }\n>from '@apexara/ng-components';\n>\n>@Component({\n> imports: [ ApexTextAreaComponent ]\n>})\n>\n>export class TextAreaExample {\n>\n> public formGroup = new FormGroup({\n> textareaControl: ['', [Validators.required]],\n> });\n>\n> public textAreaOptions = {\n> label: 'Your message inside the placeholder',\n> icon: 'icon.svg',\n> formGroup: formGroup,\n> formControlName: 'textareaControl',\n> errors: {\n> required: 'Textarea is required',\n> }\n>","readmeFilename":"README.md"}