ng-zenduit 2.0.9 → 2.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/esm2020/lib/avatar/zendu-avatar-group.component.mjs +26 -0
  2. package/esm2020/lib/avatar/zendu-avatar-label-group.component.mjs +37 -0
  3. package/esm2020/lib/avatar/zendu-avatar-profile-photo.component.mjs +30 -0
  4. package/esm2020/lib/avatar/zendu-avatar.component.mjs +44 -0
  5. package/esm2020/lib/badge/zen-badge.component.mjs +106 -0
  6. package/esm2020/lib/button/zen-button.component.mjs +97 -0
  7. package/esm2020/lib/card-block/zendu-card-block.component.mjs +1 -1
  8. package/esm2020/lib/chart/zen-chart.component.mjs +205 -0
  9. package/esm2020/lib/chart/zen-chart.types.mjs +2 -0
  10. package/esm2020/lib/date-picker-dropdown/zendu-date-picker-dropdown.component.mjs +1 -1
  11. package/esm2020/lib/datepicker/zendu-datepicker.component.mjs +1 -1
  12. package/esm2020/lib/dropdown-menu/zen-dropdown-menu.component.mjs +267 -0
  13. package/esm2020/lib/eld-status/zen-eld-status.component.mjs +30 -0
  14. package/esm2020/lib/file-upload/zendu-file-upload.component.mjs +1 -1
  15. package/esm2020/lib/file-uploader/zendu-file-uploader.component.mjs +1 -1
  16. package/esm2020/lib/filter/zendu-filter.component.mjs +1 -1
  17. package/esm2020/lib/icon/zendu-icon.component.mjs +13 -4
  18. package/esm2020/lib/input/zendu-input.component.mjs +557 -0
  19. package/esm2020/lib/location-search/zendu-location-search.component.mjs +1 -1
  20. package/esm2020/lib/module-popup/zen-module-popup.component.mjs +78 -0
  21. package/esm2020/lib/nav-item/zen-nav-item.component.mjs +104 -0
  22. package/esm2020/lib/nav-search/zen-nav-search.component.mjs +41 -0
  23. package/esm2020/lib/navigation/zen-navigation.component.mjs +73 -0
  24. package/esm2020/lib/ng-zenduit.module.mjs +135 -6
  25. package/esm2020/lib/pagination/zendu-pagination.component.mjs +75 -0
  26. package/esm2020/lib/pagination-bar/zendu-pagination-bar.component.mjs +10 -4
  27. package/esm2020/lib/phone-input/zendu-phone-input.component.mjs +14 -6
  28. package/esm2020/lib/progress-steps/zen-progress-steps.component.mjs +56 -0
  29. package/esm2020/lib/progress-steps/zen-progress-steps.types.mjs +2 -0
  30. package/esm2020/lib/progress-steps/zen-step-base.component.mjs +65 -0
  31. package/esm2020/lib/search-box/zendu-search-box.component.mjs +3 -3
  32. package/esm2020/lib/select/zendu-select.component.mjs +557 -203
  33. package/esm2020/lib/side-nav-item/zen-side-nav-item.component.mjs +91 -0
  34. package/esm2020/lib/slider/zendu-slider.component.mjs +166 -0
  35. package/esm2020/lib/submodule-item/zen-submodule-item.component.mjs +38 -0
  36. package/esm2020/lib/subpage-item/zen-subpage-item.component.mjs +56 -0
  37. package/esm2020/lib/timepicker/zendu-timepicker.component.mjs +170 -90
  38. package/esm2020/lib/tooltip/zen-tooltip.component.mjs +40 -0
  39. package/esm2020/lib/tooltip/zen-tooltip.directive.mjs +142 -0
  40. package/esm2020/lib/top-nav/zen-top-nav.component.mjs +97 -0
  41. package/esm2020/lib/top-nav-item/zen-top-nav-item.component.mjs +120 -0
  42. package/esm2020/public-api.mjs +28 -1
  43. package/fesm2015/ng-zenduit.mjs +3455 -352
  44. package/fesm2015/ng-zenduit.mjs.map +1 -1
  45. package/fesm2020/ng-zenduit.mjs +3453 -354
  46. package/fesm2020/ng-zenduit.mjs.map +1 -1
  47. package/icons/figma-icon-list.json +805 -0
  48. package/icons/sparkles.svg +7 -0
  49. package/lib/avatar/zendu-avatar-group.component.d.ts +10 -0
  50. package/lib/avatar/zendu-avatar-label-group.component.d.ts +16 -0
  51. package/lib/avatar/zendu-avatar-profile-photo.component.d.ts +12 -0
  52. package/lib/avatar/zendu-avatar.component.d.ts +17 -0
  53. package/lib/badge/zen-badge.component.d.ts +41 -0
  54. package/lib/button/zen-button.component.d.ts +16 -0
  55. package/lib/chart/zen-chart.component.d.ts +37 -0
  56. package/lib/chart/zen-chart.types.d.ts +7 -0
  57. package/lib/dropdown-menu/zen-dropdown-menu.component.d.ts +63 -0
  58. package/lib/eld-status/zen-eld-status.component.d.ts +9 -0
  59. package/lib/icon/zendu-icon.component.d.ts +2 -1
  60. package/lib/input/zendu-input.component.d.ts +246 -0
  61. package/lib/module-popup/zen-module-popup.component.d.ts +24 -0
  62. package/lib/nav-item/zen-nav-item.component.d.ts +31 -0
  63. package/lib/nav-search/zen-nav-search.component.d.ts +14 -0
  64. package/lib/navigation/zen-navigation.component.d.ts +33 -0
  65. package/lib/ng-zenduit.module.d.ts +34 -8
  66. package/lib/pagination/zendu-pagination.component.d.ts +16 -0
  67. package/lib/pagination-bar/zendu-pagination-bar.component.d.ts +4 -1
  68. package/lib/phone-input/zendu-phone-input.component.d.ts +3 -1
  69. package/lib/progress-steps/zen-progress-steps.component.d.ts +16 -0
  70. package/lib/progress-steps/zen-progress-steps.types.d.ts +9 -0
  71. package/lib/progress-steps/zen-step-base.component.d.ts +24 -0
  72. package/lib/select/zendu-select.component.d.ts +278 -61
  73. package/lib/side-nav-item/zen-side-nav-item.component.d.ts +33 -0
  74. package/lib/slider/zendu-slider.component.d.ts +40 -0
  75. package/lib/submodule-item/zen-submodule-item.component.d.ts +13 -0
  76. package/lib/subpage-item/zen-subpage-item.component.d.ts +21 -0
  77. package/lib/timepicker/zendu-timepicker.component.d.ts +25 -24
  78. package/lib/tooltip/zen-tooltip.component.d.ts +13 -0
  79. package/lib/tooltip/zen-tooltip.directive.d.ts +28 -0
  80. package/lib/top-nav/zen-top-nav.component.d.ts +47 -0
  81. package/lib/top-nav-item/zen-top-nav-item.component.d.ts +45 -0
  82. package/package.json +4 -2
  83. package/public-api.d.ts +27 -0
  84. package/styles/all.scss +1 -0
  85. package/styles/typography.scss +180 -0
package/esm2020/lib/avatar/zendu-avatar-group.component.mjs ADDED
@@ -0,0 +1,26 @@
1
+ import { Component, Input } from '@angular/core';
2
+ import * as i0 from "@angular/core";
3
+ import * as i1 from "@angular/common";
4
+ export class ZenduAvatarGroupComponent {
5
+ constructor() {
6
+ this.size = 'md';
7
+ this.images = [];
8
+ this.moreCount = 0;
9
+ this.showAddButton = false;
10
+ }
11
+ }
12
+ ZenduAvatarGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduAvatarGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
13
+ ZenduAvatarGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduAvatarGroupComponent, selector: "zendu-avatar-group", inputs: { size: "size", images: "images", moreCount: "moreCount", showAddButton: "showAddButton" }, ngImport: i0, template: "<div class=\"zendu-avatar-group\" [ngClass]=\"'zendu-avatar-group--' + size\">\n <div class=\"zendu-avatar-group__avatars\">\n <div *ngFor=\"let img of images\" class=\"zendu-avatar-group__wrap\">\n <div class=\"zendu-avatar-group__avatar\">\n <img [src]=\"img\" alt=\"\" />\n </div>\n </div>\n\n <div *ngIf=\"moreCount > 0\" class=\"zendu-avatar-group__more\">\n <span>+{{ moreCount }}</span>\n </div>\n </div>\n\n <div *ngIf=\"showAddButton\" class=\"zendu-avatar-group__add-btn\">\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.333v9.334M3.333 8h9.334\" stroke=\"currentColor\" stroke-width=\"1.33\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n", styles: [".zendu-avatar-group{display:inline-flex;align-items:flex-start}.zendu-avatar-group__avatars{display:flex;align-items:flex-start}.zendu-avatar-group__wrap{flex-shrink:0}.zendu-avatar-group__avatar{position:absolute;left:0;top:0;border:1.5px solid #FFFFFF;border-radius:50%;overflow:hidden;box-sizing:border-box}.zendu-avatar-group__avatar img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}.zendu-avatar-group__more{background-color:#f9fafb;border:2px solid #FFFFFF;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box}.zendu-avatar-group__more span{font-family:Inter,sans-serif;font-weight:500;color:#475467;text-align:center}.zendu-avatar-group__add-btn{background-color:#fff;border:1px dashed #D0D5DD;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;color:#98a2b3;cursor:pointer}.zendu-avatar-group__add-btn svg{width:16px;height:16px}.zendu-avatar-group--xs{gap:12px}.zendu-avatar-group--xs .zendu-avatar-group__wrap{position:relative;width:20px;height:24px}.zendu-avatar-group--xs .zendu-avatar-group__avatar,.zendu-avatar-group--xs .zendu-avatar-group__more{width:24px;height:24px}.zendu-avatar-group--xs .zendu-avatar-group__more span{font-size:12px;line-height:18px}.zendu-avatar-group--xs .zendu-avatar-group__add-btn{width:24px;height:24px;border-radius:12px}.zendu-avatar-group--sm{gap:16px}.zendu-avatar-group--sm .zendu-avatar-group__wrap{position:relative;width:24px;height:32px}.zendu-avatar-group--sm .zendu-avatar-group__avatar,.zendu-avatar-group--sm .zendu-avatar-group__more{width:32px;height:32px}.zendu-avatar-group--sm .zendu-avatar-group__more span{font-size:14px;line-height:20px}.zendu-avatar-group--sm .zendu-avatar-group__add-btn{width:32px;height:32px;border-radius:16px}.zendu-avatar-group--md{gap:20px}.zendu-avatar-group--md .zendu-avatar-group__wrap{position:relative;width:28px;height:40px}.zendu-avatar-group--md .zendu-avatar-group__avatar,.zendu-avatar-group--md .zendu-avatar-group__more{width:40px;height:40px}.zendu-avatar-group--md .zendu-avatar-group__more span{font-size:16px;line-height:24px}.zendu-avatar-group--md .zendu-avatar-group__add-btn{width:40px;height:40px;border-radius:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
14
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduAvatarGroupComponent, decorators: [{
15
+ type: Component,
16
+ args: [{ selector: 'zendu-avatar-group', template: "<div class=\"zendu-avatar-group\" [ngClass]=\"'zendu-avatar-group--' + size\">\n <div class=\"zendu-avatar-group__avatars\">\n <div *ngFor=\"let img of images\" class=\"zendu-avatar-group__wrap\">\n <div class=\"zendu-avatar-group__avatar\">\n <img [src]=\"img\" alt=\"\" />\n </div>\n </div>\n\n <div *ngIf=\"moreCount > 0\" class=\"zendu-avatar-group__more\">\n <span>+{{ moreCount }}</span>\n </div>\n </div>\n\n <div *ngIf=\"showAddButton\" class=\"zendu-avatar-group__add-btn\">\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M8 3.333v9.334M3.333 8h9.334\" stroke=\"currentColor\" stroke-width=\"1.33\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n</div>\n", styles: [".zendu-avatar-group{display:inline-flex;align-items:flex-start}.zendu-avatar-group__avatars{display:flex;align-items:flex-start}.zendu-avatar-group__wrap{flex-shrink:0}.zendu-avatar-group__avatar{position:absolute;left:0;top:0;border:1.5px solid #FFFFFF;border-radius:50%;overflow:hidden;box-sizing:border-box}.zendu-avatar-group__avatar img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}.zendu-avatar-group__more{background-color:#f9fafb;border:2px solid #FFFFFF;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box}.zendu-avatar-group__more span{font-family:Inter,sans-serif;font-weight:500;color:#475467;text-align:center}.zendu-avatar-group__add-btn{background-color:#fff;border:1px dashed #D0D5DD;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;color:#98a2b3;cursor:pointer}.zendu-avatar-group__add-btn svg{width:16px;height:16px}.zendu-avatar-group--xs{gap:12px}.zendu-avatar-group--xs .zendu-avatar-group__wrap{position:relative;width:20px;height:24px}.zendu-avatar-group--xs .zendu-avatar-group__avatar,.zendu-avatar-group--xs .zendu-avatar-group__more{width:24px;height:24px}.zendu-avatar-group--xs .zendu-avatar-group__more span{font-size:12px;line-height:18px}.zendu-avatar-group--xs .zendu-avatar-group__add-btn{width:24px;height:24px;border-radius:12px}.zendu-avatar-group--sm{gap:16px}.zendu-avatar-group--sm .zendu-avatar-group__wrap{position:relative;width:24px;height:32px}.zendu-avatar-group--sm .zendu-avatar-group__avatar,.zendu-avatar-group--sm .zendu-avatar-group__more{width:32px;height:32px}.zendu-avatar-group--sm .zendu-avatar-group__more span{font-size:14px;line-height:20px}.zendu-avatar-group--sm .zendu-avatar-group__add-btn{width:32px;height:32px;border-radius:16px}.zendu-avatar-group--md{gap:20px}.zendu-avatar-group--md .zendu-avatar-group__wrap{position:relative;width:28px;height:40px}.zendu-avatar-group--md .zendu-avatar-group__avatar,.zendu-avatar-group--md .zendu-avatar-group__more{width:40px;height:40px}.zendu-avatar-group--md .zendu-avatar-group__more span{font-size:16px;line-height:24px}.zendu-avatar-group--md .zendu-avatar-group__add-btn{width:40px;height:40px;border-radius:20px}\n"] }]
17
+ }], propDecorators: { size: [{
18
+ type: Input
19
+ }], images: [{
20
+ type: Input
21
+ }], moreCount: [{
22
+ type: Input
23
+ }], showAddButton: [{
24
+ type: Input
25
+ }] } });
26
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemVuZHUtYXZhdGFyLWdyb3VwLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9hdmF0YXIvemVuZHUtYXZhdGFyLWdyb3VwLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9hdmF0YXIvemVuZHUtYXZhdGFyLWdyb3VwLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFTakQsTUFBTSxPQUFPLHlCQUF5QjtJQUx0QztRQU9XLFNBQUksR0FBeUIsSUFBSSxDQUFDO1FBQ2xDLFdBQU0sR0FBYSxFQUFFLENBQUM7UUFDdEIsY0FBUyxHQUFHLENBQUMsQ0FBQztRQUNkLGtCQUFhLEdBQUcsS0FBSyxDQUFDO0tBQ2hDOzt1SEFOWSx5QkFBeUI7MkdBQXpCLHlCQUF5Qiw4SkNUdEMsaXhCQW1CQTs0RkRWYSx5QkFBeUI7a0JBTHJDLFNBQVM7K0JBQ0Usb0JBQW9COzhCQU1yQixJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csYUFBYTtzQkFBckIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuZXhwb3J0IHR5cGUgWmVuZHVBdmF0YXJHcm91cFNpemUgPSAneHMnIHwgJ3NtJyB8ICdtZCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3plbmR1LWF2YXRhci1ncm91cCcsXG4gIHRlbXBsYXRlVXJsOiAnLi96ZW5kdS1hdmF0YXItZ3JvdXAuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi96ZW5kdS1hdmF0YXItZ3JvdXAuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBaZW5kdUF2YXRhckdyb3VwQ29tcG9uZW50IHtcblxuICBASW5wdXQoKSBzaXplOiBaZW5kdUF2YXRhckdyb3VwU2l6ZSA9ICdtZCc7XG4gIEBJbnB1dCgpIGltYWdlczogc3RyaW5nW10gPSBbXTtcbiAgQElucHV0KCkgbW9yZUNvdW50ID0gMDtcbiAgQElucHV0KCkgc2hvd0FkZEJ1dHRvbiA9IGZhbHNlO1xufVxuIiwiPGRpdiBjbGFzcz1cInplbmR1LWF2YXRhci1ncm91cFwiIFtuZ0NsYXNzXT1cIid6ZW5kdS1hdmF0YXItZ3JvdXAtLScgKyBzaXplXCI+XG4gIDxkaXYgY2xhc3M9XCJ6ZW5kdS1hdmF0YXItZ3JvdXBfX2F2YXRhcnNcIj5cbiAgICA8ZGl2ICpuZ0Zvcj1cImxldCBpbWcgb2YgaW1hZ2VzXCIgY2xhc3M9XCJ6ZW5kdS1hdmF0YXItZ3JvdXBfX3dyYXBcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJ6ZW5kdS1hdmF0YXItZ3JvdXBfX2F2YXRhclwiPlxuICAgICAgICA8aW1nIFtzcmNdPVwiaW1nXCIgYWx0PVwiXCIgLz5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuXG4gICAgPGRpdiAqbmdJZj1cIm1vcmVDb3VudCA+IDBcIiBjbGFzcz1cInplbmR1LWF2YXRhci1ncm91cF9fbW9yZVwiPlxuICAgICAgPHNwYW4+K3t7IG1vcmVDb3VudCB9fTwvc3Bhbj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG5cbiAgPGRpdiAqbmdJZj1cInNob3dBZGRCdXR0b25cIiBjbGFzcz1cInplbmR1LWF2YXRhci1ncm91cF9fYWRkLWJ0blwiPlxuICAgIDxzdmcgdmlld0JveD1cIjAgMCAxNiAxNlwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHBhdGggZD1cIk04IDMuMzMzdjkuMzM0TTMuMzMzIDhoOS4zMzRcIiBzdHJva2U9XCJjdXJyZW50Q29sb3JcIiBzdHJva2Utd2lkdGg9XCIxLjMzXCIgc3Ryb2tlLWxpbmVjYXA9XCJyb3VuZFwiIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCIvPlxuICAgIDwvc3ZnPlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19
package/esm2020/lib/avatar/zendu-avatar-label-group.component.mjs ADDED
@@ -0,0 +1,37 @@
1
+ import { Component, Input } from '@angular/core';
2
+ import * as i0 from "@angular/core";
3
+ import * as i1 from "@angular/common";
4
+ import * as i2 from "./zendu-avatar.component";
5
+ export class ZenduAvatarLabelGroupComponent {
6
+ constructor() {
7
+ this.size = 'md';
8
+ this.statusIcon = 'none';
9
+ this.focused = false;
10
+ }
11
+ get avatarSize() {
12
+ return this.size;
13
+ }
14
+ }
15
+ ZenduAvatarLabelGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduAvatarLabelGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
16
+ ZenduAvatarLabelGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduAvatarLabelGroupComponent, selector: "zendu-avatar-label-group", inputs: { size: "size", src: "src", text: "text", name: "name", subtitle: "subtitle", statusIcon: "statusIcon", companyImgSrc: "companyImgSrc", focused: "focused" }, ngImport: i0, template: "<div class=\"zendu-avatar-label-group\" [ngClass]=\"'zendu-avatar-label-group--' + size\">\n <zendu-avatar\n [size]=\"avatarSize\"\n [src]=\"src\"\n [text]=\"text\"\n [statusIcon]=\"statusIcon\"\n [companyImgSrc]=\"companyImgSrc\"\n [focused]=\"focused\">\n </zendu-avatar>\n\n <div class=\"zendu-avatar-label-group__text\">\n <span class=\"zendu-avatar-label-group__name\">{{ name }}</span>\n <span *ngIf=\"subtitle\" class=\"zendu-avatar-label-group__subtitle\">{{ subtitle }}</span>\n </div>\n</div>\n", styles: [".zendu-avatar-label-group{display:inline-flex;align-items:center}.zendu-avatar-label-group__text{display:flex;flex-direction:column;align-items:flex-start;white-space:nowrap}.zendu-avatar-label-group__name{font-family:Inter,sans-serif;font-weight:500;color:#344054}.zendu-avatar-label-group__subtitle{font-family:Inter,sans-serif;font-weight:400;color:#667085}.zendu-avatar-label-group--sm{gap:10px}.zendu-avatar-label-group--sm .zendu-avatar-label-group__name{font-size:14px;line-height:20px}.zendu-avatar-label-group--sm .zendu-avatar-label-group__subtitle{font-size:12px;line-height:18px}.zendu-avatar-label-group--md{gap:12px}.zendu-avatar-label-group--md .zendu-avatar-label-group__name,.zendu-avatar-label-group--md .zendu-avatar-label-group__subtitle{font-size:14px;line-height:20px}.zendu-avatar-label-group--lg{gap:12px}.zendu-avatar-label-group--lg .zendu-avatar-label-group__name,.zendu-avatar-label-group--lg .zendu-avatar-label-group__subtitle{font-size:16px;line-height:24px}.zendu-avatar-label-group--xl{gap:16px}.zendu-avatar-label-group--xl .zendu-avatar-label-group__name{font-size:18px;line-height:28px}.zendu-avatar-label-group--xl .zendu-avatar-label-group__subtitle{font-size:16px;line-height:24px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ZenduAvatarComponent, selector: "zendu-avatar", inputs: ["size", "src", "text", "statusIcon", "companyImgSrc", "focused"] }] });
17
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduAvatarLabelGroupComponent, decorators: [{
18
+ type: Component,
19
+ args: [{ selector: 'zendu-avatar-label-group', template: "<div class=\"zendu-avatar-label-group\" [ngClass]=\"'zendu-avatar-label-group--' + size\">\n <zendu-avatar\n [size]=\"avatarSize\"\n [src]=\"src\"\n [text]=\"text\"\n [statusIcon]=\"statusIcon\"\n [companyImgSrc]=\"companyImgSrc\"\n [focused]=\"focused\">\n </zendu-avatar>\n\n <div class=\"zendu-avatar-label-group__text\">\n <span class=\"zendu-avatar-label-group__name\">{{ name }}</span>\n <span *ngIf=\"subtitle\" class=\"zendu-avatar-label-group__subtitle\">{{ subtitle }}</span>\n </div>\n</div>\n", styles: [".zendu-avatar-label-group{display:inline-flex;align-items:center}.zendu-avatar-label-group__text{display:flex;flex-direction:column;align-items:flex-start;white-space:nowrap}.zendu-avatar-label-group__name{font-family:Inter,sans-serif;font-weight:500;color:#344054}.zendu-avatar-label-group__subtitle{font-family:Inter,sans-serif;font-weight:400;color:#667085}.zendu-avatar-label-group--sm{gap:10px}.zendu-avatar-label-group--sm .zendu-avatar-label-group__name{font-size:14px;line-height:20px}.zendu-avatar-label-group--sm .zendu-avatar-label-group__subtitle{font-size:12px;line-height:18px}.zendu-avatar-label-group--md{gap:12px}.zendu-avatar-label-group--md .zendu-avatar-label-group__name,.zendu-avatar-label-group--md .zendu-avatar-label-group__subtitle{font-size:14px;line-height:20px}.zendu-avatar-label-group--lg{gap:12px}.zendu-avatar-label-group--lg .zendu-avatar-label-group__name,.zendu-avatar-label-group--lg .zendu-avatar-label-group__subtitle{font-size:16px;line-height:24px}.zendu-avatar-label-group--xl{gap:16px}.zendu-avatar-label-group--xl .zendu-avatar-label-group__name{font-size:18px;line-height:28px}.zendu-avatar-label-group--xl .zendu-avatar-label-group__subtitle{font-size:16px;line-height:24px}\n"] }]
20
+ }], propDecorators: { size: [{
21
+ type: Input
22
+ }], src: [{
23
+ type: Input
24
+ }], text: [{
25
+ type: Input
26
+ }], name: [{
27
+ type: Input
28
+ }], subtitle: [{
29
+ type: Input
30
+ }], statusIcon: [{
31
+ type: Input
32
+ }], companyImgSrc: [{
33
+ type: Input
34
+ }], focused: [{
35
+ type: Input
36
+ }] } });
37
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemVuZHUtYXZhdGFyLWxhYmVsLWdyb3VwLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9hdmF0YXIvemVuZHUtYXZhdGFyLWxhYmVsLWdyb3VwLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9hdmF0YXIvemVuZHUtYXZhdGFyLWxhYmVsLWdyb3VwLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBVWpELE1BQU0sT0FBTyw4QkFBOEI7SUFMM0M7UUFPVyxTQUFJLEdBQThCLElBQUksQ0FBQztRQUt2QyxlQUFVLEdBQTBCLE1BQU0sQ0FBQztRQUUzQyxZQUFPLEdBQUcsS0FBSyxDQUFDO0tBSzFCO0lBSEMsSUFBSSxVQUFVO1FBQ1osT0FBTyxJQUFJLENBQUMsSUFBdUIsQ0FBQztJQUN0QyxDQUFDOzs0SEFiVSw4QkFBOEI7Z0hBQTlCLDhCQUE4QixzT0NWM0Msc2hCQWVBOzRGRExhLDhCQUE4QjtrQkFMMUMsU0FBUzsrQkFDRSwwQkFBMEI7OEJBTTNCLElBQUk7c0JBQVosS0FBSztnQkFDRyxHQUFHO3NCQUFYLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csYUFBYTtzQkFBckIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBaZW5kdUF2YXRhclNpemUsIFplbmR1QXZhdGFyU3RhdHVzSWNvbiB9IGZyb20gJy4vemVuZHUtYXZhdGFyLmNvbXBvbmVudCc7XG5cbmV4cG9ydCB0eXBlIFplbmR1QXZhdGFyTGFiZWxHcm91cFNpemUgPSAnc20nIHwgJ21kJyB8ICdsZycgfCAneGwnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd6ZW5kdS1hdmF0YXItbGFiZWwtZ3JvdXAnLFxuICB0ZW1wbGF0ZVVybDogJy4vemVuZHUtYXZhdGFyLWxhYmVsLWdyb3VwLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vemVuZHUtYXZhdGFyLWxhYmVsLWdyb3VwLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgWmVuZHVBdmF0YXJMYWJlbEdyb3VwQ29tcG9uZW50IHtcblxuICBASW5wdXQoKSBzaXplOiBaZW5kdUF2YXRhckxhYmVsR3JvdXBTaXplID0gJ21kJztcbiAgQElucHV0KCkgc3JjOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHRleHQ6IHN0cmluZztcbiAgQElucHV0KCkgbmFtZTogc3RyaW5nO1xuICBASW5wdXQoKSBzdWJ0aXRsZTogc3RyaW5nO1xuICBASW5wdXQoKSBzdGF0dXNJY29uOiBaZW5kdUF2YXRhclN0YXR1c0ljb24gPSAnbm9uZSc7XG4gIEBJbnB1dCgpIGNvbXBhbnlJbWdTcmM6IHN0cmluZztcbiAgQElucHV0KCkgZm9jdXNlZCA9IGZhbHNlO1xuXG4gIGdldCBhdmF0YXJTaXplKCk6IFplbmR1QXZhdGFyU2l6ZSB7XG4gICAgcmV0dXJuIHRoaXMuc2l6ZSBhcyBaZW5kdUF2YXRhclNpemU7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJ6ZW5kdS1hdmF0YXItbGFiZWwtZ3JvdXBcIiBbbmdDbGFzc109XCInemVuZHUtYXZhdGFyLWxhYmVsLWdyb3VwLS0nICsgc2l6ZVwiPlxuICA8emVuZHUtYXZhdGFyXG4gICAgW3NpemVdPVwiYXZhdGFyU2l6ZVwiXG4gICAgW3NyY109XCJzcmNcIlxuICAgIFt0ZXh0XT1cInRleHRcIlxuICAgIFtzdGF0dXNJY29uXT1cInN0YXR1c0ljb25cIlxuICAgIFtjb21wYW55SW1nU3JjXT1cImNvbXBhbnlJbWdTcmNcIlxuICAgIFtmb2N1c2VkXT1cImZvY3VzZWRcIj5cbiAgPC96ZW5kdS1hdmF0YXI+XG5cbiAgPGRpdiBjbGFzcz1cInplbmR1LWF2YXRhci1sYWJlbC1ncm91cF9fdGV4dFwiPlxuICAgIDxzcGFuIGNsYXNzPVwiemVuZHUtYXZhdGFyLWxhYmVsLWdyb3VwX19uYW1lXCI+e3sgbmFtZSB9fTwvc3Bhbj5cbiAgICA8c3BhbiAqbmdJZj1cInN1YnRpdGxlXCIgY2xhc3M9XCJ6ZW5kdS1hdmF0YXItbGFiZWwtZ3JvdXBfX3N1YnRpdGxlXCI+e3sgc3VidGl0bGUgfX08L3NwYW4+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=
package/esm2020/lib/avatar/zendu-avatar-profile-photo.component.mjs ADDED
@@ -0,0 +1,30 @@
1
+ import { Component, Input } from '@angular/core';
2
+ import * as i0 from "@angular/core";
3
+ import * as i1 from "@angular/common";
4
+ export class ZenduAvatarProfilePhotoComponent {
5
+ constructor() {
6
+ this.size = 'lg';
7
+ }
8
+ get showImage() {
9
+ return !!this.src;
10
+ }
11
+ get showText() {
12
+ return !this.src && !!this.text;
13
+ }
14
+ get showPlaceholder() {
15
+ return !this.src && !this.text;
16
+ }
17
+ }
18
+ ZenduAvatarProfilePhotoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduAvatarProfilePhotoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
19
+ ZenduAvatarProfilePhotoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduAvatarProfilePhotoComponent, selector: "zendu-avatar-profile-photo", inputs: { size: "size", src: "src", text: "text" }, ngImport: i0, template: "<div class=\"zendu-avatar-profile-photo\" [ngClass]=\"'zendu-avatar-profile-photo--' + size\">\n <!-- Image -->\n <img *ngIf=\"showImage\" [src]=\"src\" class=\"zendu-avatar-profile-photo__img\" alt=\"\" />\n\n <!-- Placeholder icon -->\n <div *ngIf=\"showPlaceholder\" class=\"zendu-avatar-profile-photo__placeholder\">\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M16.6666 17.5C16.6666 16.337 16.6666 15.7555 16.4942 15.2824C16.1544 14.3491 15.4008 13.5955 14.4675 13.2558C13.9944 13.0833 13.4129 13.0833 12.2499 13.0833H7.74992C6.58694 13.0833 6.00545 13.0833 5.53237 13.2558C4.59907 13.5955 3.84542 14.3491 3.50567 15.2824C3.33325 15.7555 3.33325 16.337 3.33325 17.5M13.7499 6.25C13.7499 8.32107 12.0710 10 9.99992 10C7.92885 10 6.24992 8.32107 6.24992 6.25C6.24992 4.17893 7.92885 2.5 9.99992 2.5C12.0710 2.5 13.7499 4.17893 13.7499 6.25Z\" stroke=\"currentColor\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n\n <!-- Text initials -->\n <span *ngIf=\"showText\" class=\"zendu-avatar-profile-photo__text\">{{ text }}</span>\n</div>\n", styles: [".zendu-avatar-profile-photo{position:relative;border:4px solid #FFFFFF;border-radius:50%;overflow:hidden;box-sizing:border-box;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808;display:inline-flex;align-items:center;justify-content:center}.zendu-avatar-profile-photo__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;pointer-events:none}.zendu-avatar-profile-photo__placeholder{display:flex;align-items:center;justify-content:center;color:#475467}.zendu-avatar-profile-photo__text{font-family:Inter,sans-serif;font-weight:500;color:#475467;text-align:center}.zendu-avatar-profile-photo--md{width:96px;height:96px;background-color:#f9fafb}.zendu-avatar-profile-photo--md .zendu-avatar-profile-photo__placeholder{width:48px;height:48px}.zendu-avatar-profile-photo--md .zendu-avatar-profile-photo__placeholder svg{width:100%;height:100%}.zendu-avatar-profile-photo--md .zendu-avatar-profile-photo__text{font-size:36px;line-height:44px;letter-spacing:-.72px}.zendu-avatar-profile-photo--lg{width:160px;height:160px;background-color:#f9fafb}.zendu-avatar-profile-photo--lg .zendu-avatar-profile-photo__placeholder{width:80px;height:80px}.zendu-avatar-profile-photo--lg .zendu-avatar-profile-photo__placeholder svg{width:100%;height:100%}.zendu-avatar-profile-photo--lg .zendu-avatar-profile-photo__text{font-size:60px;line-height:72px;letter-spacing:-1.2px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
20
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduAvatarProfilePhotoComponent, decorators: [{
21
+ type: Component,
22
+ args: [{ selector: 'zendu-avatar-profile-photo', template: "<div class=\"zendu-avatar-profile-photo\" [ngClass]=\"'zendu-avatar-profile-photo--' + size\">\n <!-- Image -->\n <img *ngIf=\"showImage\" [src]=\"src\" class=\"zendu-avatar-profile-photo__img\" alt=\"\" />\n\n <!-- Placeholder icon -->\n <div *ngIf=\"showPlaceholder\" class=\"zendu-avatar-profile-photo__placeholder\">\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M16.6666 17.5C16.6666 16.337 16.6666 15.7555 16.4942 15.2824C16.1544 14.3491 15.4008 13.5955 14.4675 13.2558C13.9944 13.0833 13.4129 13.0833 12.2499 13.0833H7.74992C6.58694 13.0833 6.00545 13.0833 5.53237 13.2558C4.59907 13.5955 3.84542 14.3491 3.50567 15.2824C3.33325 15.7555 3.33325 16.337 3.33325 17.5M13.7499 6.25C13.7499 8.32107 12.0710 10 9.99992 10C7.92885 10 6.24992 8.32107 6.24992 6.25C6.24992 4.17893 7.92885 2.5 9.99992 2.5C12.0710 2.5 13.7499 4.17893 13.7499 6.25Z\" stroke=\"currentColor\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n\n <!-- Text initials -->\n <span *ngIf=\"showText\" class=\"zendu-avatar-profile-photo__text\">{{ text }}</span>\n</div>\n", styles: [".zendu-avatar-profile-photo{position:relative;border:4px solid #FFFFFF;border-radius:50%;overflow:hidden;box-sizing:border-box;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808;display:inline-flex;align-items:center;justify-content:center}.zendu-avatar-profile-photo__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;pointer-events:none}.zendu-avatar-profile-photo__placeholder{display:flex;align-items:center;justify-content:center;color:#475467}.zendu-avatar-profile-photo__text{font-family:Inter,sans-serif;font-weight:500;color:#475467;text-align:center}.zendu-avatar-profile-photo--md{width:96px;height:96px;background-color:#f9fafb}.zendu-avatar-profile-photo--md .zendu-avatar-profile-photo__placeholder{width:48px;height:48px}.zendu-avatar-profile-photo--md .zendu-avatar-profile-photo__placeholder svg{width:100%;height:100%}.zendu-avatar-profile-photo--md .zendu-avatar-profile-photo__text{font-size:36px;line-height:44px;letter-spacing:-.72px}.zendu-avatar-profile-photo--lg{width:160px;height:160px;background-color:#f9fafb}.zendu-avatar-profile-photo--lg .zendu-avatar-profile-photo__placeholder{width:80px;height:80px}.zendu-avatar-profile-photo--lg .zendu-avatar-profile-photo__placeholder svg{width:100%;height:100%}.zendu-avatar-profile-photo--lg .zendu-avatar-profile-photo__text{font-size:60px;line-height:72px;letter-spacing:-1.2px}\n"] }]
23
+ }], propDecorators: { size: [{
24
+ type: Input
25
+ }], src: [{
26
+ type: Input
27
+ }], text: [{
28
+ type: Input
29
+ }] } });
30
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemVuZHUtYXZhdGFyLXByb2ZpbGUtcGhvdG8uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctemVuZHVpdC9zcmMvbGliL2F2YXRhci96ZW5kdS1hdmF0YXItcHJvZmlsZS1waG90by5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy16ZW5kdWl0L3NyYy9saWIvYXZhdGFyL3plbmR1LWF2YXRhci1wcm9maWxlLXBob3RvLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFTakQsTUFBTSxPQUFPLGdDQUFnQztJQUw3QztRQU9XLFNBQUksR0FBZ0MsSUFBSSxDQUFDO0tBZW5EO0lBWEMsSUFBSSxTQUFTO1FBQ1gsT0FBTyxDQUFDLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQztJQUNwQixDQUFDO0lBRUQsSUFBSSxRQUFRO1FBQ1YsT0FBTyxDQUFDLElBQUksQ0FBQyxHQUFHLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUM7SUFDbEMsQ0FBQztJQUVELElBQUksZUFBZTtRQUNqQixPQUFPLENBQUMsSUFBSSxDQUFDLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUM7SUFDakMsQ0FBQzs7OEhBaEJVLGdDQUFnQztrSEFBaEMsZ0NBQWdDLHNIQ1Q3Qyxzb0NBY0E7NEZETGEsZ0NBQWdDO2tCQUw1QyxTQUFTOytCQUNFLDRCQUE0Qjs4QkFNN0IsSUFBSTtzQkFBWixLQUFLO2dCQUNHLEdBQUc7c0JBQVgsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmV4cG9ydCB0eXBlIFplbmR1QXZhdGFyUHJvZmlsZVBob3RvU2l6ZSA9ICdtZCcgfCAnbGcnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd6ZW5kdS1hdmF0YXItcHJvZmlsZS1waG90bycsXG4gIHRlbXBsYXRlVXJsOiAnLi96ZW5kdS1hdmF0YXItcHJvZmlsZS1waG90by5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3plbmR1LWF2YXRhci1wcm9maWxlLXBob3RvLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgWmVuZHVBdmF0YXJQcm9maWxlUGhvdG9Db21wb25lbnQge1xuXG4gIEBJbnB1dCgpIHNpemU6IFplbmR1QXZhdGFyUHJvZmlsZVBob3RvU2l6ZSA9ICdsZyc7XG4gIEBJbnB1dCgpIHNyYzogc3RyaW5nO1xuICBASW5wdXQoKSB0ZXh0OiBzdHJpbmc7XG5cbiAgZ2V0IHNob3dJbWFnZSgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gISF0aGlzLnNyYztcbiAgfVxuXG4gIGdldCBzaG93VGV4dCgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gIXRoaXMuc3JjICYmICEhdGhpcy50ZXh0O1xuICB9XG5cbiAgZ2V0IHNob3dQbGFjZWhvbGRlcigpOiBib29sZWFuIHtcbiAgICByZXR1cm4gIXRoaXMuc3JjICYmICF0aGlzLnRleHQ7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJ6ZW5kdS1hdmF0YXItcHJvZmlsZS1waG90b1wiIFtuZ0NsYXNzXT1cIid6ZW5kdS1hdmF0YXItcHJvZmlsZS1waG90by0tJyArIHNpemVcIj5cbiAgPCEtLSBJbWFnZSAtLT5cbiAgPGltZyAqbmdJZj1cInNob3dJbWFnZVwiIFtzcmNdPVwic3JjXCIgY2xhc3M9XCJ6ZW5kdS1hdmF0YXItcHJvZmlsZS1waG90b19faW1nXCIgYWx0PVwiXCIgLz5cblxuICA8IS0tIFBsYWNlaG9sZGVyIGljb24gLS0+XG4gIDxkaXYgKm5nSWY9XCJzaG93UGxhY2Vob2xkZXJcIiBjbGFzcz1cInplbmR1LWF2YXRhci1wcm9maWxlLXBob3RvX19wbGFjZWhvbGRlclwiPlxuICAgIDxzdmcgdmlld0JveD1cIjAgMCAyMCAyMFwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHBhdGggZD1cIk0xNi42NjY2IDE3LjVDMTYuNjY2NiAxNi4zMzcgMTYuNjY2NiAxNS43NTU1IDE2LjQ5NDIgMTUuMjgyNEMxNi4xNTQ0IDE0LjM0OTEgMTUuNDAwOCAxMy41OTU1IDE0LjQ2NzUgMTMuMjU1OEMxMy45OTQ0IDEzLjA4MzMgMTMuNDEyOSAxMy4wODMzIDEyLjI0OTkgMTMuMDgzM0g3Ljc0OTkyQzYuNTg2OTQgMTMuMDgzMyA2LjAwNTQ1IDEzLjA4MzMgNS41MzIzNyAxMy4yNTU4QzQuNTk5MDcgMTMuNTk1NSAzLjg0NTQyIDE0LjM0OTEgMy41MDU2NyAxNS4yODI0QzMuMzMzMjUgMTUuNzU1NSAzLjMzMzI1IDE2LjMzNyAzLjMzMzI1IDE3LjVNMTMuNzQ5OSA2LjI1QzEzLjc0OTkgOC4zMjEwNyAxMi4wNzEwIDEwIDkuOTk5OTIgMTBDNy45Mjg4NSAxMCA2LjI0OTkyIDguMzIxMDcgNi4yNDk5MiA2LjI1QzYuMjQ5OTIgNC4xNzg5MyA3LjkyODg1IDIuNSA5Ljk5OTkyIDIuNUMxMi4wNzEwIDIuNSAxMy43NDk5IDQuMTc4OTMgMTMuNzQ5OSA2LjI1WlwiIHN0cm9rZT1cImN1cnJlbnRDb2xvclwiIHN0cm9rZS13aWR0aD1cIjEuNjY2NjdcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIi8+XG4gICAgPC9zdmc+XG4gIDwvZGl2PlxuXG4gIDwhLS0gVGV4dCBpbml0aWFscyAtLT5cbiAgPHNwYW4gKm5nSWY9XCJzaG93VGV4dFwiIGNsYXNzPVwiemVuZHUtYXZhdGFyLXByb2ZpbGUtcGhvdG9fX3RleHRcIj57eyB0ZXh0IH19PC9zcGFuPlxuPC9kaXY+XG4iXX0=
package/esm2020/lib/avatar/zendu-avatar.component.mjs ADDED
@@ -0,0 +1,44 @@
1
+ import { Component, Input } from '@angular/core';
2
+ import * as i0 from "@angular/core";
3
+ import * as i1 from "@angular/common";
4
+ export class ZenduAvatarComponent {
5
+ constructor() {
6
+ this.size = 'md';
7
+ this.statusIcon = 'none';
8
+ this.focused = false;
9
+ }
10
+ get showImage() {
11
+ return !!this.src;
12
+ }
13
+ get showText() {
14
+ return !this.src && !!this.text;
15
+ }
16
+ get showPlaceholder() {
17
+ return !this.src && !this.text;
18
+ }
19
+ get cssClasses() {
20
+ return {
21
+ ['zendu-avatar--' + this.size]: true,
22
+ 'zendu-avatar--focused': this.focused
23
+ };
24
+ }
25
+ }
26
+ ZenduAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
27
+ ZenduAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduAvatarComponent, selector: "zendu-avatar", inputs: { size: "size", src: "src", text: "text", statusIcon: "statusIcon", companyImgSrc: "companyImgSrc", focused: "focused" }, ngImport: i0, template: "<div class=\"zendu-avatar\" [ngClass]=\"cssClasses\">\n <!-- Image avatar -->\n <img *ngIf=\"showImage\" [src]=\"src\" class=\"zendu-avatar__img\" alt=\"\" />\n\n <!-- Text initials -->\n <span *ngIf=\"showText\" class=\"zendu-avatar__text\">{{ text }}</span>\n\n <!-- Placeholder user icon -->\n <div *ngIf=\"showPlaceholder\" class=\"zendu-avatar__placeholder\">\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M16.6666 17.5C16.6666 16.337 16.6666 15.7555 16.4942 15.2824C16.1544 14.3491 15.4008 13.5955 14.4675 13.2558C13.9944 13.0833 13.4129 13.0833 12.2499 13.0833H7.74992C6.58694 13.0833 6.00545 13.0833 5.53237 13.2558C4.59907 13.5955 3.84542 14.3491 3.50567 15.2824C3.33325 15.7555 3.33325 16.337 3.33325 17.5M13.7499 6.25C13.7499 8.32107 12.0710 10 9.99992 10C7.92885 10 6.24992 8.32107 6.24992 6.25C6.24992 4.17893 7.92885 2.5 9.99992 2.5C12.0710 2.5 13.7499 4.17893 13.7499 6.25Z\" stroke=\"currentColor\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n\n <!-- Online indicator -->\n <div *ngIf=\"statusIcon === 'online'\" class=\"zendu-avatar__online-dot\"></div>\n\n <!-- Company icon -->\n <div *ngIf=\"statusIcon === 'company'\" class=\"zendu-avatar__company-icon\">\n <img *ngIf=\"companyImgSrc\" [src]=\"companyImgSrc\" alt=\"\" />\n </div>\n</div>\n", styles: [".zendu-avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background-color:#f9fafb;overflow:visible;box-sizing:border-box}.zendu-avatar--focused{border:4px solid #F2F4F7}.zendu-avatar__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;pointer-events:none}.zendu-avatar__text{font-family:Inter,sans-serif;font-weight:500;color:#475467;text-align:center;white-space:nowrap}.zendu-avatar__placeholder{display:flex;align-items:center;justify-content:center;color:#475467}.zendu-avatar__placeholder svg{width:100%;height:100%}.zendu-avatar__online-dot{position:absolute;bottom:0;right:0;background-color:#12b76a;border:1.5px solid #FFFFFF;border-radius:50%;box-sizing:border-box}.zendu-avatar__company-icon{position:absolute;bottom:0;right:0;border:1.5px solid #FFFFFF;border-radius:25%;overflow:hidden;box-sizing:border-box}.zendu-avatar__company-icon img{width:100%;height:100%;object-fit:cover;display:block}.zendu-avatar--xs{width:24px;height:24px}.zendu-avatar--xs .zendu-avatar__text{font-size:12px;line-height:18px}.zendu-avatar--xs .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--xs .zendu-avatar__online-dot{width:6px;height:6px}.zendu-avatar--xs .zendu-avatar__company-icon{width:10px;height:10px}.zendu-avatar--sm{width:32px;height:32px}.zendu-avatar--sm .zendu-avatar__text{font-size:14px;line-height:20px}.zendu-avatar--sm .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--sm .zendu-avatar__online-dot{width:8px;height:8px}.zendu-avatar--sm .zendu-avatar__company-icon{width:12px;height:12px}.zendu-avatar--md{width:40px;height:40px}.zendu-avatar--md .zendu-avatar__text{font-size:16px;line-height:24px}.zendu-avatar--md .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--md .zendu-avatar__online-dot{width:10px;height:10px}.zendu-avatar--md .zendu-avatar__company-icon{width:14px;height:14px}.zendu-avatar--lg{width:48px;height:48px}.zendu-avatar--lg .zendu-avatar__text{font-size:18px;line-height:28px}.zendu-avatar--lg .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--lg .zendu-avatar__online-dot{width:12px;height:12px}.zendu-avatar--lg .zendu-avatar__company-icon{width:16px;height:16px}.zendu-avatar--xl{width:56px;height:56px}.zendu-avatar--xl .zendu-avatar__text{font-size:20px;line-height:30px}.zendu-avatar--xl .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--xl .zendu-avatar__online-dot{width:14px;height:14px}.zendu-avatar--xl .zendu-avatar__company-icon{width:18px;height:18px}.zendu-avatar--2xl{width:64px;height:64px}.zendu-avatar--2xl .zendu-avatar__text{font-size:24px;line-height:32px}.zendu-avatar--2xl .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--2xl .zendu-avatar__online-dot{width:16px;height:16px}.zendu-avatar--2xl .zendu-avatar__company-icon{width:20px;height:20px;border-width:1.667px;border-radius:30%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
28
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduAvatarComponent, decorators: [{
29
+ type: Component,
30
+ args: [{ selector: 'zendu-avatar', template: "<div class=\"zendu-avatar\" [ngClass]=\"cssClasses\">\n <!-- Image avatar -->\n <img *ngIf=\"showImage\" [src]=\"src\" class=\"zendu-avatar__img\" alt=\"\" />\n\n <!-- Text initials -->\n <span *ngIf=\"showText\" class=\"zendu-avatar__text\">{{ text }}</span>\n\n <!-- Placeholder user icon -->\n <div *ngIf=\"showPlaceholder\" class=\"zendu-avatar__placeholder\">\n <svg viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M16.6666 17.5C16.6666 16.337 16.6666 15.7555 16.4942 15.2824C16.1544 14.3491 15.4008 13.5955 14.4675 13.2558C13.9944 13.0833 13.4129 13.0833 12.2499 13.0833H7.74992C6.58694 13.0833 6.00545 13.0833 5.53237 13.2558C4.59907 13.5955 3.84542 14.3491 3.50567 15.2824C3.33325 15.7555 3.33325 16.337 3.33325 17.5M13.7499 6.25C13.7499 8.32107 12.0710 10 9.99992 10C7.92885 10 6.24992 8.32107 6.24992 6.25C6.24992 4.17893 7.92885 2.5 9.99992 2.5C12.0710 2.5 13.7499 4.17893 13.7499 6.25Z\" stroke=\"currentColor\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n </svg>\n </div>\n\n <!-- Online indicator -->\n <div *ngIf=\"statusIcon === 'online'\" class=\"zendu-avatar__online-dot\"></div>\n\n <!-- Company icon -->\n <div *ngIf=\"statusIcon === 'company'\" class=\"zendu-avatar__company-icon\">\n <img *ngIf=\"companyImgSrc\" [src]=\"companyImgSrc\" alt=\"\" />\n </div>\n</div>\n", styles: [".zendu-avatar{position:relative;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background-color:#f9fafb;overflow:visible;box-sizing:border-box}.zendu-avatar--focused{border:4px solid #F2F4F7}.zendu-avatar__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;pointer-events:none}.zendu-avatar__text{font-family:Inter,sans-serif;font-weight:500;color:#475467;text-align:center;white-space:nowrap}.zendu-avatar__placeholder{display:flex;align-items:center;justify-content:center;color:#475467}.zendu-avatar__placeholder svg{width:100%;height:100%}.zendu-avatar__online-dot{position:absolute;bottom:0;right:0;background-color:#12b76a;border:1.5px solid #FFFFFF;border-radius:50%;box-sizing:border-box}.zendu-avatar__company-icon{position:absolute;bottom:0;right:0;border:1.5px solid #FFFFFF;border-radius:25%;overflow:hidden;box-sizing:border-box}.zendu-avatar__company-icon img{width:100%;height:100%;object-fit:cover;display:block}.zendu-avatar--xs{width:24px;height:24px}.zendu-avatar--xs .zendu-avatar__text{font-size:12px;line-height:18px}.zendu-avatar--xs .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--xs .zendu-avatar__online-dot{width:6px;height:6px}.zendu-avatar--xs .zendu-avatar__company-icon{width:10px;height:10px}.zendu-avatar--sm{width:32px;height:32px}.zendu-avatar--sm .zendu-avatar__text{font-size:14px;line-height:20px}.zendu-avatar--sm .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--sm .zendu-avatar__online-dot{width:8px;height:8px}.zendu-avatar--sm .zendu-avatar__company-icon{width:12px;height:12px}.zendu-avatar--md{width:40px;height:40px}.zendu-avatar--md .zendu-avatar__text{font-size:16px;line-height:24px}.zendu-avatar--md .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--md .zendu-avatar__online-dot{width:10px;height:10px}.zendu-avatar--md .zendu-avatar__company-icon{width:14px;height:14px}.zendu-avatar--lg{width:48px;height:48px}.zendu-avatar--lg .zendu-avatar__text{font-size:18px;line-height:28px}.zendu-avatar--lg .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--lg .zendu-avatar__online-dot{width:12px;height:12px}.zendu-avatar--lg .zendu-avatar__company-icon{width:16px;height:16px}.zendu-avatar--xl{width:56px;height:56px}.zendu-avatar--xl .zendu-avatar__text{font-size:20px;line-height:30px}.zendu-avatar--xl .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--xl .zendu-avatar__online-dot{width:14px;height:14px}.zendu-avatar--xl .zendu-avatar__company-icon{width:18px;height:18px}.zendu-avatar--2xl{width:64px;height:64px}.zendu-avatar--2xl .zendu-avatar__text{font-size:24px;line-height:32px}.zendu-avatar--2xl .zendu-avatar__placeholder{width:57.14%;height:57.14%}.zendu-avatar--2xl .zendu-avatar__online-dot{width:16px;height:16px}.zendu-avatar--2xl .zendu-avatar__company-icon{width:20px;height:20px;border-width:1.667px;border-radius:30%}\n"] }]
31
+ }], propDecorators: { size: [{
32
+ type: Input
33
+ }], src: [{
34
+ type: Input
35
+ }], text: [{
36
+ type: Input
37
+ }], statusIcon: [{
38
+ type: Input
39
+ }], companyImgSrc: [{
40
+ type: Input
41
+ }], focused: [{
42
+ type: Input
43
+ }] } });
44
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemVuZHUtYXZhdGFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9hdmF0YXIvemVuZHUtYXZhdGFyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9hdmF0YXIvemVuZHUtYXZhdGFyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFVakQsTUFBTSxPQUFPLG9CQUFvQjtJQUxqQztRQU9XLFNBQUksR0FBb0IsSUFBSSxDQUFDO1FBRzdCLGVBQVUsR0FBMEIsTUFBTSxDQUFDO1FBRTNDLFlBQU8sR0FBRyxLQUFLLENBQUM7S0FvQjFCO0lBbEJDLElBQUksU0FBUztRQUNYLE9BQU8sQ0FBQyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUM7SUFDcEIsQ0FBQztJQUVELElBQUksUUFBUTtRQUNWLE9BQU8sQ0FBQyxJQUFJLENBQUMsR0FBRyxJQUFJLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDO0lBQ2xDLENBQUM7SUFFRCxJQUFJLGVBQWU7UUFDakIsT0FBTyxDQUFDLElBQUksQ0FBQyxHQUFHLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDO0lBQ2pDLENBQUM7SUFFRCxJQUFJLFVBQVU7UUFDWixPQUFPO1lBQ0wsQ0FBQyxnQkFBZ0IsR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLEVBQUUsSUFBSTtZQUNwQyx1QkFBdUIsRUFBRSxJQUFJLENBQUMsT0FBTztTQUN0QyxDQUFDO0lBQ0osQ0FBQzs7a0hBMUJVLG9CQUFvQjtzR0FBcEIsb0JBQW9CLHNMQ1ZqQyw4MkNBc0JBOzRGRFphLG9CQUFvQjtrQkFMaEMsU0FBUzsrQkFDRSxjQUFjOzhCQU1mLElBQUk7c0JBQVosS0FBSztnQkFDRyxHQUFHO3NCQUFYLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csYUFBYTtzQkFBckIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmV4cG9ydCB0eXBlIFplbmR1QXZhdGFyU2l6ZSA9ICd4cycgfCAnc20nIHwgJ21kJyB8ICdsZycgfCAneGwnIHwgJzJ4bCc7XG5leHBvcnQgdHlwZSBaZW5kdUF2YXRhclN0YXR1c0ljb24gPSAnbm9uZScgfCAnb25saW5lJyB8ICdjb21wYW55JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnemVuZHUtYXZhdGFyJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3plbmR1LWF2YXRhci5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3plbmR1LWF2YXRhci5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIFplbmR1QXZhdGFyQ29tcG9uZW50IHtcblxuICBASW5wdXQoKSBzaXplOiBaZW5kdUF2YXRhclNpemUgPSAnbWQnO1xuICBASW5wdXQoKSBzcmM6IHN0cmluZztcbiAgQElucHV0KCkgdGV4dDogc3RyaW5nO1xuICBASW5wdXQoKSBzdGF0dXNJY29uOiBaZW5kdUF2YXRhclN0YXR1c0ljb24gPSAnbm9uZSc7XG4gIEBJbnB1dCgpIGNvbXBhbnlJbWdTcmM6IHN0cmluZztcbiAgQElucHV0KCkgZm9jdXNlZCA9IGZhbHNlO1xuXG4gIGdldCBzaG93SW1hZ2UoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuICEhdGhpcy5zcmM7XG4gIH1cblxuICBnZXQgc2hvd1RleHQoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuICF0aGlzLnNyYyAmJiAhIXRoaXMudGV4dDtcbiAgfVxuXG4gIGdldCBzaG93UGxhY2Vob2xkZXIoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuICF0aGlzLnNyYyAmJiAhdGhpcy50ZXh0O1xuICB9XG5cbiAgZ2V0IGNzc0NsYXNzZXMoKTogUmVjb3JkPHN0cmluZywgYm9vbGVhbj4ge1xuICAgIHJldHVybiB7XG4gICAgICBbJ3plbmR1LWF2YXRhci0tJyArIHRoaXMuc2l6ZV06IHRydWUsXG4gICAgICAnemVuZHUtYXZhdGFyLS1mb2N1c2VkJzogdGhpcy5mb2N1c2VkXG4gICAgfTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cInplbmR1LWF2YXRhclwiIFtuZ0NsYXNzXT1cImNzc0NsYXNzZXNcIj5cbiAgPCEtLSBJbWFnZSBhdmF0YXIgLS0+XG4gIDxpbWcgKm5nSWY9XCJzaG93SW1hZ2VcIiBbc3JjXT1cInNyY1wiIGNsYXNzPVwiemVuZHUtYXZhdGFyX19pbWdcIiBhbHQ9XCJcIiAvPlxuXG4gIDwhLS0gVGV4dCBpbml0aWFscyAtLT5cbiAgPHNwYW4gKm5nSWY9XCJzaG93VGV4dFwiIGNsYXNzPVwiemVuZHUtYXZhdGFyX190ZXh0XCI+e3sgdGV4dCB9fTwvc3Bhbj5cblxuICA8IS0tIFBsYWNlaG9sZGVyIHVzZXIgaWNvbiAtLT5cbiAgPGRpdiAqbmdJZj1cInNob3dQbGFjZWhvbGRlclwiIGNsYXNzPVwiemVuZHUtYXZhdGFyX19wbGFjZWhvbGRlclwiPlxuICAgIDxzdmcgdmlld0JveD1cIjAgMCAyMCAyMFwiIGZpbGw9XCJub25lXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiPlxuICAgICAgPHBhdGggZD1cIk0xNi42NjY2IDE3LjVDMTYuNjY2NiAxNi4zMzcgMTYuNjY2NiAxNS43NTU1IDE2LjQ5NDIgMTUuMjgyNEMxNi4xNTQ0IDE0LjM0OTEgMTUuNDAwOCAxMy41OTU1IDE0LjQ2NzUgMTMuMjU1OEMxMy45OTQ0IDEzLjA4MzMgMTMuNDEyOSAxMy4wODMzIDEyLjI0OTkgMTMuMDgzM0g3Ljc0OTkyQzYuNTg2OTQgMTMuMDgzMyA2LjAwNTQ1IDEzLjA4MzMgNS41MzIzNyAxMy4yNTU4QzQuNTk5MDcgMTMuNTk1NSAzLjg0NTQyIDE0LjM0OTEgMy41MDU2NyAxNS4yODI0QzMuMzMzMjUgMTUuNzU1NSAzLjMzMzI1IDE2LjMzNyAzLjMzMzI1IDE3LjVNMTMuNzQ5OSA2LjI1QzEzLjc0OTkgOC4zMjEwNyAxMi4wNzEwIDEwIDkuOTk5OTIgMTBDNy45Mjg4NSAxMCA2LjI0OTkyIDguMzIxMDcgNi4yNDk5MiA2LjI1QzYuMjQ5OTIgNC4xNzg5MyA3LjkyODg1IDIuNSA5Ljk5OTkyIDIuNUMxMi4wNzEwIDIuNSAxMy43NDk5IDQuMTc4OTMgMTMuNzQ5OSA2LjI1WlwiIHN0cm9rZT1cImN1cnJlbnRDb2xvclwiIHN0cm9rZS13aWR0aD1cIjEuNjY2NjdcIiBzdHJva2UtbGluZWNhcD1cInJvdW5kXCIgc3Ryb2tlLWxpbmVqb2luPVwicm91bmRcIi8+XG4gICAgPC9zdmc+XG4gIDwvZGl2PlxuXG4gIDwhLS0gT25saW5lIGluZGljYXRvciAtLT5cbiAgPGRpdiAqbmdJZj1cInN0YXR1c0ljb24gPT09ICdvbmxpbmUnXCIgY2xhc3M9XCJ6ZW5kdS1hdmF0YXJfX29ubGluZS1kb3RcIj48L2Rpdj5cblxuICA8IS0tIENvbXBhbnkgaWNvbiAtLT5cbiAgPGRpdiAqbmdJZj1cInN0YXR1c0ljb24gPT09ICdjb21wYW55J1wiIGNsYXNzPVwiemVuZHUtYXZhdGFyX19jb21wYW55LWljb25cIj5cbiAgICA8aW1nICpuZ0lmPVwiY29tcGFueUltZ1NyY1wiIFtzcmNdPVwiY29tcGFueUltZ1NyY1wiIGFsdD1cIlwiIC8+XG4gIDwvZGl2PlxuPC9kaXY+XG4iXX0=
package/esm2020/lib/badge/zen-badge.component.mjs ADDED
@@ -0,0 +1,106 @@
1
+ import { Component, Input, Output, EventEmitter } from '@angular/core';
2
+ import * as i0 from "@angular/core";
3
+ import * as i1 from "@angular/common";
4
+ import * as i2 from "../icon/zendu-icon.component";
5
+ export class ZenBadgeComponent {
6
+ constructor() {
7
+ this.size = 'md';
8
+ this.color = 'primary';
9
+ this.dot = false;
10
+ this.removable = false;
11
+ this.iconOnly = false;
12
+ /** Icon placement direction */
13
+ this.iconDirection = 'left';
14
+ /** Badge group mode — renders as a pill with inner badge + message */
15
+ this.group = false;
16
+ /** Badge group: badge position (leading = left, trailing = right) */
17
+ this.badgePosition = 'leading';
18
+ /** Badge group: theme variant */
19
+ this.theme = 'light';
20
+ /** Badge group: show arrow icon */
21
+ this.showIcon = false;
22
+ this.remove = new EventEmitter();
23
+ this.clicked = new EventEmitter();
24
+ }
25
+ get hasIcon() {
26
+ return !!(this.icon || this.iconSrc);
27
+ }
28
+ get hostClasses() {
29
+ const classes = [
30
+ 'zen-badge',
31
+ `zen-badge--${this.size}`,
32
+ `zen-badge--${this.color}`,
33
+ ];
34
+ if (this.dot)
35
+ classes.push('zen-badge--dot');
36
+ if (this.removable)
37
+ classes.push('zen-badge--removable');
38
+ if (this.iconOnly)
39
+ classes.push('zen-badge--icon-only');
40
+ if (this.imgSrc)
41
+ classes.push('zen-badge--has-img');
42
+ if (this.hasIcon && !this.iconOnly && this.iconDirection === 'left')
43
+ classes.push('zen-badge--icon-left');
44
+ if ((this.hasIcon && !this.iconOnly && this.iconDirection === 'right') || this.removable)
45
+ classes.push('zen-badge--icon-right');
46
+ return classes.join(' ');
47
+ }
48
+ get groupClasses() {
49
+ const classes = [
50
+ 'zen-badge-group',
51
+ `zen-badge-group--${this.size}`,
52
+ `zen-badge-group--${this.color}`,
53
+ `zen-badge-group--${this.theme}`,
54
+ `zen-badge-group--${this.badgePosition}`,
55
+ ];
56
+ if (this.showIcon)
57
+ classes.push('zen-badge-group--has-icon');
58
+ return classes.join(' ');
59
+ }
60
+ onClick(event) {
61
+ this.clicked.emit(event);
62
+ }
63
+ onRemove(event) {
64
+ event.stopPropagation();
65
+ this.remove.emit();
66
+ }
67
+ }
68
+ ZenBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
69
+ ZenBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenBadgeComponent, selector: "zen-badge", inputs: { size: "size", color: "color", dot: "dot", removable: "removable", iconOnly: "iconOnly", icon: "icon", iconSrc: "iconSrc", iconDirection: "iconDirection", imgSrc: "imgSrc", group: "group", badgeLabel: "badgeLabel", badgePosition: "badgePosition", theme: "theme", showIcon: "showIcon" }, outputs: { remove: "remove", clicked: "clicked" }, ngImport: i0, template: "<!-- Badge Group mode -->\n<ng-container *ngIf=\"group; else standardBadge\">\n <div [class]=\"groupClasses\" (click)=\"onClick($event)\">\n\n <!-- Leading: inner badge first -->\n <ng-container *ngIf=\"badgePosition === 'leading'\">\n <span class=\"zen-badge-group__badge\">{{ badgeLabel }}</span>\n <span class=\"zen-badge-group__content\">\n <span class=\"zen-badge-group__message\"><ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container></span>\n <zen-icon *ngIf=\"showIcon\" class=\"zen-badge-group__icon\" name=\"arrow-right\"></zen-icon>\n </span>\n </ng-container>\n\n <!-- Trailing: message first, badge with optional icon last -->\n <ng-container *ngIf=\"badgePosition === 'trailing'\">\n <span class=\"zen-badge-group__message\"><ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container></span>\n <span class=\"zen-badge-group__badge\">\n {{ badgeLabel }}\n <zen-icon *ngIf=\"showIcon\" class=\"zen-badge-group__badge-icon\" name=\"arrow-right\"></zen-icon>\n </span>\n </ng-container>\n\n </div>\n</ng-container>\n\n<!-- Standard badge mode -->\n<ng-template #standardBadge>\n <div [class]=\"hostClasses\" (click)=\"onClick($event)\">\n <span *ngIf=\"dot\" class=\"zen-badge__dot\"></span>\n\n <img *ngIf=\"imgSrc\" class=\"zen-badge__img\" [src]=\"imgSrc\" alt=\"\">\n\n <zen-icon *ngIf=\"hasIcon && !iconOnly && iconDirection === 'left'\" class=\"zen-badge__icon\"\n [name]=\"icon\" [src]=\"iconSrc\"></zen-icon>\n\n <span *ngIf=\"!iconOnly\" class=\"zen-badge__text\">\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\n </span>\n\n <zen-icon *ngIf=\"iconOnly && hasIcon\" class=\"zen-badge__icon\"\n [name]=\"icon\" [src]=\"iconSrc\"></zen-icon>\n\n <zen-icon *ngIf=\"hasIcon && !iconOnly && iconDirection === 'right'\" class=\"zen-badge__icon\"\n [name]=\"icon\" [src]=\"iconSrc\"></zen-icon>\n\n <button *ngIf=\"removable\" class=\"zen-badge__close\" (click)=\"onRemove($event)\" type=\"button\" aria-label=\"Remove\">\n <zen-icon class=\"zen-badge__icon\" name=\"x\"></zen-icon>\n </button>\n </div>\n</ng-template>\n\n<ng-template #contentTpl><ng-content></ng-content></ng-template>\n", styles: [".zen-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;font-family:Inter,sans-serif;font-weight:500;white-space:nowrap;mix-blend-mode:multiply;gap:4px;cursor:pointer}.zen-badge__icon{display:inline-block;flex-shrink:0;width:12px;height:12px;background-color:currentColor}.zen-badge--sm{padding:2px 8px;font-size:12px;line-height:18px}.zen-badge--sm.zen-badge--dot,.zen-badge--sm.zen-badge--icon-left{padding-left:6px}.zen-badge--sm.zen-badge--icon-right,.zen-badge--sm.zen-badge--removable{padding-right:6px}.zen-badge--sm.zen-badge--icon-only{padding:4px}.zen-badge--sm.zen-badge--has-img{padding-left:3px;gap:6px}.zen-badge--sm .zen-badge__dot{width:6px;height:6px}.zen-badge--sm .zen-badge__close svg{width:10px;height:10px}.zen-badge--sm .zen-badge__img{width:16px;height:16px}.zen-badge--md{padding:2px 10px;font-size:14px;line-height:20px}.zen-badge--md.zen-badge--dot,.zen-badge--md.zen-badge--icon-left{padding-left:8px}.zen-badge--md.zen-badge--icon-right,.zen-badge--md.zen-badge--removable{padding-right:8px}.zen-badge--md.zen-badge--icon-only{padding:6px}.zen-badge--md.zen-badge--has-img{padding-left:4px;gap:6px}.zen-badge--md .zen-badge__dot{width:8px;height:8px}.zen-badge--md .zen-badge__img{width:18px;height:18px}.zen-badge--lg{padding:4px 12px;font-size:14px;line-height:20px}.zen-badge--lg.zen-badge--dot,.zen-badge--lg.zen-badge--icon-left{padding-left:10px}.zen-badge--lg.zen-badge--icon-right,.zen-badge--lg.zen-badge--removable{padding-right:10px}.zen-badge--lg.zen-badge--icon-only{padding:8px}.zen-badge--lg.zen-badge--has-img{padding-left:5px;gap:6px}.zen-badge--lg .zen-badge__dot{width:8px;height:8px}.zen-badge--lg .zen-badge__img{width:20px;height:20px}.zen-badge__dot{display:inline-block;border-radius:50%;flex-shrink:0}.zen-badge__img{flex-shrink:0;border-radius:50%;object-fit:cover}.zen-badge__text{text-align:center}.zen-badge__close{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:0;cursor:pointer;color:inherit;flex-shrink:0}.zen-badge__close svg{width:12px;height:12px}.zen-badge--gray{background-color:#f2f4f7;color:#344054}.zen-badge--gray .zen-badge__dot{background-color:#667085}.zen-badge--primary{background-color:#f1f7fe;color:#105494}.zen-badge--primary .zen-badge__dot{background-color:#2188d9}.zen-badge--error{background-color:#fef3f2;color:#b42318}.zen-badge--error .zen-badge__dot{background-color:#f04438}.zen-badge--warning{background-color:#fffaeb;color:#b54708}.zen-badge--warning .zen-badge__dot{background-color:#f79009}.zen-badge--success{background-color:#ecfdf3;color:#027a48}.zen-badge--success .zen-badge__dot{background-color:#12b76a}.zen-badge--blue-gray{background-color:#f8f9fc;color:#363f72}.zen-badge--blue-gray .zen-badge__dot{background-color:#4e5ba6}.zen-badge--blue-light{background-color:#f0f9ff;color:#026aa2}.zen-badge--blue-light .zen-badge__dot{background-color:#0ba5ec}.zen-badge--blue{background-color:#eff8ff;color:#175cd3}.zen-badge--blue .zen-badge__dot{background-color:#2e90fa}.zen-badge--indigo{background-color:#eef4ff;color:#3538cd}.zen-badge--indigo .zen-badge__dot{background-color:#6172f3}.zen-badge--purple{background-color:#f4f3ff;color:#5925dc}.zen-badge--purple .zen-badge__dot{background-color:#7a5af8}.zen-badge--pink{background-color:#fdf2fa;color:#c11574}.zen-badge--pink .zen-badge__dot{background-color:#ee46bc}.zen-badge--rose{background-color:#fff1f3;color:#c01048}.zen-badge--rose .zen-badge__dot{background-color:#f63d68}.zen-badge--orange{background-color:#fef6ee;color:#b93815}.zen-badge--orange .zen-badge__dot{background-color:#ef6820}.zen-badge-group{display:inline-flex;align-items:center;border-radius:16px;font-family:Inter,sans-serif;font-weight:500;white-space:nowrap;mix-blend-mode:multiply;cursor:pointer}.zen-badge-group__badge{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;white-space:nowrap;flex-shrink:0;gap:4px}.zen-badge-group__content{display:inline-flex;align-items:center;gap:4px;flex-shrink:0}.zen-badge-group__message{white-space:nowrap;flex-shrink:0}.zen-badge-group__icon,.zen-badge-group__badge-icon{display:inline-block;flex-shrink:0;background-color:currentColor}.zen-badge-group--md,.zen-badge-group--sm{padding:4px;gap:8px;font-size:12px;line-height:18px}.zen-badge-group--md.zen-badge-group--leading,.zen-badge-group--leading.zen-badge-group--sm{padding-right:10px}.zen-badge-group--md.zen-badge-group--trailing,.zen-badge-group--trailing.zen-badge-group--sm{padding-left:12px}.zen-badge-group--md.zen-badge-group--leading.zen-badge-group--has-icon,.zen-badge-group--leading.zen-badge-group--has-icon.zen-badge-group--sm{padding-right:10px}.zen-badge-group--md .zen-badge-group__badge,.zen-badge-group--sm .zen-badge-group__badge{padding:2px 8px;font-size:12px;line-height:18px}.zen-badge-group--md .zen-badge-group__icon,.zen-badge-group--sm .zen-badge-group__icon{width:16px;height:16px}.zen-badge-group--md .zen-badge-group__badge-icon,.zen-badge-group--sm .zen-badge-group__badge-icon{width:12px;height:12px}.zen-badge-group--lg{padding:4px;gap:12px;font-size:14px;line-height:20px}.zen-badge-group--lg.zen-badge-group--leading{padding-right:12px}.zen-badge-group--lg.zen-badge-group--trailing{padding-left:14px}.zen-badge-group--lg.zen-badge-group--leading.zen-badge-group--has-icon{padding-right:12px}.zen-badge-group--lg .zen-badge-group__badge{padding:2px 10px;font-size:14px;line-height:20px}.zen-badge-group--lg .zen-badge-group__icon{width:18px;height:18px}.zen-badge-group--lg .zen-badge-group__badge-icon{width:14px;height:14px}.zen-badge-group--primary{color:#105494}.zen-badge-group--primary.zen-badge-group--light{background-color:#f1f7fe}.zen-badge-group--primary.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#105494}.zen-badge-group--primary.zen-badge-group--medium{background-color:#e3eefb}.zen-badge-group--primary.zen-badge-group--medium .zen-badge-group__badge{background-color:#f1f7fe;color:#105494}.zen-badge-group--primary.zen-badge-group--dark{background-color:#f1f7fe}.zen-badge-group--primary.zen-badge-group--dark .zen-badge-group__badge{background-color:#136ab6;color:#fff}.zen-badge-group--gray{color:#344054}.zen-badge-group--gray.zen-badge-group--light{background-color:#f9fafb}.zen-badge-group--gray.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#344054}.zen-badge-group--gray.zen-badge-group--medium{background-color:#f2f4f7}.zen-badge-group--gray.zen-badge-group--medium .zen-badge-group__badge{background-color:#f9fafb;color:#344054}.zen-badge-group--gray.zen-badge-group--dark{background-color:#f9fafb}.zen-badge-group--gray.zen-badge-group--dark .zen-badge-group__badge{background-color:#475467;color:#fff}.zen-badge-group--error{color:#b42318}.zen-badge-group--error.zen-badge-group--light{background-color:#fef3f2}.zen-badge-group--error.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#b42318}.zen-badge-group--error.zen-badge-group--medium{background-color:#fee4e2}.zen-badge-group--error.zen-badge-group--medium .zen-badge-group__badge{background-color:#fef3f2;color:#b42318}.zen-badge-group--error.zen-badge-group--dark{background-color:#fef3f2}.zen-badge-group--error.zen-badge-group--dark .zen-badge-group__badge{background-color:#d92d20;color:#fff}.zen-badge-group--warning{color:#b54708}.zen-badge-group--warning.zen-badge-group--light{background-color:#fffaeb}.zen-badge-group--warning.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#b54708}.zen-badge-group--warning.zen-badge-group--medium{background-color:#fef0c7}.zen-badge-group--warning.zen-badge-group--medium .zen-badge-group__badge{background-color:#fffaeb;color:#b54708}.zen-badge-group--warning.zen-badge-group--dark{background-color:#fffaeb}.zen-badge-group--warning.zen-badge-group--dark .zen-badge-group__badge{background-color:#dc6803;color:#fff}.zen-badge-group--success{color:#027a48}.zen-badge-group--success.zen-badge-group--light{background-color:#ecfdf3}.zen-badge-group--success.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#027a48}.zen-badge-group--success.zen-badge-group--medium{background-color:#d1fadf}.zen-badge-group--success.zen-badge-group--medium .zen-badge-group__badge{background-color:#ecfdf3;color:#027a48}.zen-badge-group--success.zen-badge-group--dark{background-color:#ecfdf3}.zen-badge-group--success.zen-badge-group--dark .zen-badge-group__badge{background-color:#039855;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.ZenduIconComponent, selector: "zen-icon", inputs: ["src", "name", "size", "color", "theme", "customColor"] }] });
70
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenBadgeComponent, decorators: [{
71
+ type: Component,
72
+ args: [{ selector: 'zen-badge', template: "<!-- Badge Group mode -->\n<ng-container *ngIf=\"group; else standardBadge\">\n <div [class]=\"groupClasses\" (click)=\"onClick($event)\">\n\n <!-- Leading: inner badge first -->\n <ng-container *ngIf=\"badgePosition === 'leading'\">\n <span class=\"zen-badge-group__badge\">{{ badgeLabel }}</span>\n <span class=\"zen-badge-group__content\">\n <span class=\"zen-badge-group__message\"><ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container></span>\n <zen-icon *ngIf=\"showIcon\" class=\"zen-badge-group__icon\" name=\"arrow-right\"></zen-icon>\n </span>\n </ng-container>\n\n <!-- Trailing: message first, badge with optional icon last -->\n <ng-container *ngIf=\"badgePosition === 'trailing'\">\n <span class=\"zen-badge-group__message\"><ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container></span>\n <span class=\"zen-badge-group__badge\">\n {{ badgeLabel }}\n <zen-icon *ngIf=\"showIcon\" class=\"zen-badge-group__badge-icon\" name=\"arrow-right\"></zen-icon>\n </span>\n </ng-container>\n\n </div>\n</ng-container>\n\n<!-- Standard badge mode -->\n<ng-template #standardBadge>\n <div [class]=\"hostClasses\" (click)=\"onClick($event)\">\n <span *ngIf=\"dot\" class=\"zen-badge__dot\"></span>\n\n <img *ngIf=\"imgSrc\" class=\"zen-badge__img\" [src]=\"imgSrc\" alt=\"\">\n\n <zen-icon *ngIf=\"hasIcon && !iconOnly && iconDirection === 'left'\" class=\"zen-badge__icon\"\n [name]=\"icon\" [src]=\"iconSrc\"></zen-icon>\n\n <span *ngIf=\"!iconOnly\" class=\"zen-badge__text\">\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\n </span>\n\n <zen-icon *ngIf=\"iconOnly && hasIcon\" class=\"zen-badge__icon\"\n [name]=\"icon\" [src]=\"iconSrc\"></zen-icon>\n\n <zen-icon *ngIf=\"hasIcon && !iconOnly && iconDirection === 'right'\" class=\"zen-badge__icon\"\n [name]=\"icon\" [src]=\"iconSrc\"></zen-icon>\n\n <button *ngIf=\"removable\" class=\"zen-badge__close\" (click)=\"onRemove($event)\" type=\"button\" aria-label=\"Remove\">\n <zen-icon class=\"zen-badge__icon\" name=\"x\"></zen-icon>\n </button>\n </div>\n</ng-template>\n\n<ng-template #contentTpl><ng-content></ng-content></ng-template>\n", styles: [".zen-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;font-family:Inter,sans-serif;font-weight:500;white-space:nowrap;mix-blend-mode:multiply;gap:4px;cursor:pointer}.zen-badge__icon{display:inline-block;flex-shrink:0;width:12px;height:12px;background-color:currentColor}.zen-badge--sm{padding:2px 8px;font-size:12px;line-height:18px}.zen-badge--sm.zen-badge--dot,.zen-badge--sm.zen-badge--icon-left{padding-left:6px}.zen-badge--sm.zen-badge--icon-right,.zen-badge--sm.zen-badge--removable{padding-right:6px}.zen-badge--sm.zen-badge--icon-only{padding:4px}.zen-badge--sm.zen-badge--has-img{padding-left:3px;gap:6px}.zen-badge--sm .zen-badge__dot{width:6px;height:6px}.zen-badge--sm .zen-badge__close svg{width:10px;height:10px}.zen-badge--sm .zen-badge__img{width:16px;height:16px}.zen-badge--md{padding:2px 10px;font-size:14px;line-height:20px}.zen-badge--md.zen-badge--dot,.zen-badge--md.zen-badge--icon-left{padding-left:8px}.zen-badge--md.zen-badge--icon-right,.zen-badge--md.zen-badge--removable{padding-right:8px}.zen-badge--md.zen-badge--icon-only{padding:6px}.zen-badge--md.zen-badge--has-img{padding-left:4px;gap:6px}.zen-badge--md .zen-badge__dot{width:8px;height:8px}.zen-badge--md .zen-badge__img{width:18px;height:18px}.zen-badge--lg{padding:4px 12px;font-size:14px;line-height:20px}.zen-badge--lg.zen-badge--dot,.zen-badge--lg.zen-badge--icon-left{padding-left:10px}.zen-badge--lg.zen-badge--icon-right,.zen-badge--lg.zen-badge--removable{padding-right:10px}.zen-badge--lg.zen-badge--icon-only{padding:8px}.zen-badge--lg.zen-badge--has-img{padding-left:5px;gap:6px}.zen-badge--lg .zen-badge__dot{width:8px;height:8px}.zen-badge--lg .zen-badge__img{width:20px;height:20px}.zen-badge__dot{display:inline-block;border-radius:50%;flex-shrink:0}.zen-badge__img{flex-shrink:0;border-radius:50%;object-fit:cover}.zen-badge__text{text-align:center}.zen-badge__close{display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:0;cursor:pointer;color:inherit;flex-shrink:0}.zen-badge__close svg{width:12px;height:12px}.zen-badge--gray{background-color:#f2f4f7;color:#344054}.zen-badge--gray .zen-badge__dot{background-color:#667085}.zen-badge--primary{background-color:#f1f7fe;color:#105494}.zen-badge--primary .zen-badge__dot{background-color:#2188d9}.zen-badge--error{background-color:#fef3f2;color:#b42318}.zen-badge--error .zen-badge__dot{background-color:#f04438}.zen-badge--warning{background-color:#fffaeb;color:#b54708}.zen-badge--warning .zen-badge__dot{background-color:#f79009}.zen-badge--success{background-color:#ecfdf3;color:#027a48}.zen-badge--success .zen-badge__dot{background-color:#12b76a}.zen-badge--blue-gray{background-color:#f8f9fc;color:#363f72}.zen-badge--blue-gray .zen-badge__dot{background-color:#4e5ba6}.zen-badge--blue-light{background-color:#f0f9ff;color:#026aa2}.zen-badge--blue-light .zen-badge__dot{background-color:#0ba5ec}.zen-badge--blue{background-color:#eff8ff;color:#175cd3}.zen-badge--blue .zen-badge__dot{background-color:#2e90fa}.zen-badge--indigo{background-color:#eef4ff;color:#3538cd}.zen-badge--indigo .zen-badge__dot{background-color:#6172f3}.zen-badge--purple{background-color:#f4f3ff;color:#5925dc}.zen-badge--purple .zen-badge__dot{background-color:#7a5af8}.zen-badge--pink{background-color:#fdf2fa;color:#c11574}.zen-badge--pink .zen-badge__dot{background-color:#ee46bc}.zen-badge--rose{background-color:#fff1f3;color:#c01048}.zen-badge--rose .zen-badge__dot{background-color:#f63d68}.zen-badge--orange{background-color:#fef6ee;color:#b93815}.zen-badge--orange .zen-badge__dot{background-color:#ef6820}.zen-badge-group{display:inline-flex;align-items:center;border-radius:16px;font-family:Inter,sans-serif;font-weight:500;white-space:nowrap;mix-blend-mode:multiply;cursor:pointer}.zen-badge-group__badge{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;white-space:nowrap;flex-shrink:0;gap:4px}.zen-badge-group__content{display:inline-flex;align-items:center;gap:4px;flex-shrink:0}.zen-badge-group__message{white-space:nowrap;flex-shrink:0}.zen-badge-group__icon,.zen-badge-group__badge-icon{display:inline-block;flex-shrink:0;background-color:currentColor}.zen-badge-group--md,.zen-badge-group--sm{padding:4px;gap:8px;font-size:12px;line-height:18px}.zen-badge-group--md.zen-badge-group--leading,.zen-badge-group--leading.zen-badge-group--sm{padding-right:10px}.zen-badge-group--md.zen-badge-group--trailing,.zen-badge-group--trailing.zen-badge-group--sm{padding-left:12px}.zen-badge-group--md.zen-badge-group--leading.zen-badge-group--has-icon,.zen-badge-group--leading.zen-badge-group--has-icon.zen-badge-group--sm{padding-right:10px}.zen-badge-group--md .zen-badge-group__badge,.zen-badge-group--sm .zen-badge-group__badge{padding:2px 8px;font-size:12px;line-height:18px}.zen-badge-group--md .zen-badge-group__icon,.zen-badge-group--sm .zen-badge-group__icon{width:16px;height:16px}.zen-badge-group--md .zen-badge-group__badge-icon,.zen-badge-group--sm .zen-badge-group__badge-icon{width:12px;height:12px}.zen-badge-group--lg{padding:4px;gap:12px;font-size:14px;line-height:20px}.zen-badge-group--lg.zen-badge-group--leading{padding-right:12px}.zen-badge-group--lg.zen-badge-group--trailing{padding-left:14px}.zen-badge-group--lg.zen-badge-group--leading.zen-badge-group--has-icon{padding-right:12px}.zen-badge-group--lg .zen-badge-group__badge{padding:2px 10px;font-size:14px;line-height:20px}.zen-badge-group--lg .zen-badge-group__icon{width:18px;height:18px}.zen-badge-group--lg .zen-badge-group__badge-icon{width:14px;height:14px}.zen-badge-group--primary{color:#105494}.zen-badge-group--primary.zen-badge-group--light{background-color:#f1f7fe}.zen-badge-group--primary.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#105494}.zen-badge-group--primary.zen-badge-group--medium{background-color:#e3eefb}.zen-badge-group--primary.zen-badge-group--medium .zen-badge-group__badge{background-color:#f1f7fe;color:#105494}.zen-badge-group--primary.zen-badge-group--dark{background-color:#f1f7fe}.zen-badge-group--primary.zen-badge-group--dark .zen-badge-group__badge{background-color:#136ab6;color:#fff}.zen-badge-group--gray{color:#344054}.zen-badge-group--gray.zen-badge-group--light{background-color:#f9fafb}.zen-badge-group--gray.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#344054}.zen-badge-group--gray.zen-badge-group--medium{background-color:#f2f4f7}.zen-badge-group--gray.zen-badge-group--medium .zen-badge-group__badge{background-color:#f9fafb;color:#344054}.zen-badge-group--gray.zen-badge-group--dark{background-color:#f9fafb}.zen-badge-group--gray.zen-badge-group--dark .zen-badge-group__badge{background-color:#475467;color:#fff}.zen-badge-group--error{color:#b42318}.zen-badge-group--error.zen-badge-group--light{background-color:#fef3f2}.zen-badge-group--error.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#b42318}.zen-badge-group--error.zen-badge-group--medium{background-color:#fee4e2}.zen-badge-group--error.zen-badge-group--medium .zen-badge-group__badge{background-color:#fef3f2;color:#b42318}.zen-badge-group--error.zen-badge-group--dark{background-color:#fef3f2}.zen-badge-group--error.zen-badge-group--dark .zen-badge-group__badge{background-color:#d92d20;color:#fff}.zen-badge-group--warning{color:#b54708}.zen-badge-group--warning.zen-badge-group--light{background-color:#fffaeb}.zen-badge-group--warning.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#b54708}.zen-badge-group--warning.zen-badge-group--medium{background-color:#fef0c7}.zen-badge-group--warning.zen-badge-group--medium .zen-badge-group__badge{background-color:#fffaeb;color:#b54708}.zen-badge-group--warning.zen-badge-group--dark{background-color:#fffaeb}.zen-badge-group--warning.zen-badge-group--dark .zen-badge-group__badge{background-color:#dc6803;color:#fff}.zen-badge-group--success{color:#027a48}.zen-badge-group--success.zen-badge-group--light{background-color:#ecfdf3}.zen-badge-group--success.zen-badge-group--light .zen-badge-group__badge{background-color:#fff;color:#027a48}.zen-badge-group--success.zen-badge-group--medium{background-color:#d1fadf}.zen-badge-group--success.zen-badge-group--medium .zen-badge-group__badge{background-color:#ecfdf3;color:#027a48}.zen-badge-group--success.zen-badge-group--dark{background-color:#ecfdf3}.zen-badge-group--success.zen-badge-group--dark .zen-badge-group__badge{background-color:#039855;color:#fff}\n"] }]
73
+ }], propDecorators: { size: [{
74
+ type: Input
75
+ }], color: [{
76
+ type: Input
77
+ }], dot: [{
78
+ type: Input
79
+ }], removable: [{
80
+ type: Input
81
+ }], iconOnly: [{
82
+ type: Input
83
+ }], icon: [{
84
+ type: Input
85
+ }], iconSrc: [{
86
+ type: Input
87
+ }], iconDirection: [{
88
+ type: Input
89
+ }], imgSrc: [{
90
+ type: Input
91
+ }], group: [{
92
+ type: Input
93
+ }], badgeLabel: [{
94
+ type: Input
95
+ }], badgePosition: [{
96
+ type: Input
97
+ }], theme: [{
98
+ type: Input
99
+ }], showIcon: [{
100
+ type: Input
101
+ }], remove: [{
102
+ type: Output
103
+ }], clicked: [{
104
+ type: Output
105
+ }] } });
106
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemVuLWJhZGdlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLXplbmR1aXQvc3JjL2xpYi9iYWRnZS96ZW4tYmFkZ2UuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctemVuZHVpdC9zcmMvbGliL2JhZGdlL3plbi1iYWRnZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBZ0J2RSxNQUFNLE9BQU8saUJBQWlCO0lBTDlCO1FBT1csU0FBSSxHQUFpQixJQUFJLENBQUM7UUFDMUIsVUFBSyxHQUFrQixTQUFTLENBQUM7UUFDakMsUUFBRyxHQUFHLEtBQUssQ0FBQztRQUNaLGNBQVMsR0FBRyxLQUFLLENBQUM7UUFDbEIsYUFBUSxHQUFHLEtBQUssQ0FBQztRQU0xQiwrQkFBK0I7UUFDdEIsa0JBQWEsR0FBMEIsTUFBTSxDQUFDO1FBS3ZELHNFQUFzRTtRQUM3RCxVQUFLLEdBQUcsS0FBSyxDQUFDO1FBR3ZCLHFFQUFxRTtRQUM1RCxrQkFBYSxHQUErQixTQUFTLENBQUM7UUFDL0QsaUNBQWlDO1FBQ3hCLFVBQUssR0FBdUIsT0FBTyxDQUFDO1FBQzdDLG1DQUFtQztRQUMxQixhQUFRLEdBQUcsS0FBSyxDQUFDO1FBRWhCLFdBQU0sR0FBRyxJQUFJLFlBQVksRUFBUSxDQUFDO1FBQ2xDLFlBQU8sR0FBRyxJQUFJLFlBQVksRUFBYyxDQUFDO0tBeUNwRDtJQXZDQyxJQUFJLE9BQU87UUFDVCxPQUFPLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLElBQUksSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQ3ZDLENBQUM7SUFFRCxJQUFJLFdBQVc7UUFDYixNQUFNLE9BQU8sR0FBRztZQUNkLFdBQVc7WUFDWCxjQUFjLElBQUksQ0FBQyxJQUFJLEVBQUU7WUFDekIsY0FBYyxJQUFJLENBQUMsS0FBSyxFQUFFO1NBQzNCLENBQUM7UUFDRixJQUFJLElBQUksQ0FBQyxHQUFHO1lBQUUsT0FBTyxDQUFDLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO1FBQzdDLElBQUksSUFBSSxDQUFDLFNBQVM7WUFBRSxPQUFPLENBQUMsSUFBSSxDQUFDLHNCQUFzQixDQUFDLENBQUM7UUFDekQsSUFBSSxJQUFJLENBQUMsUUFBUTtZQUFFLE9BQU8sQ0FBQyxJQUFJLENBQUMsc0JBQXNCLENBQUMsQ0FBQztRQUN4RCxJQUFJLElBQUksQ0FBQyxNQUFNO1lBQUUsT0FBTyxDQUFDLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxDQUFDO1FBQ3BELElBQUksSUFBSSxDQUFDLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLElBQUksSUFBSSxDQUFDLGFBQWEsS0FBSyxNQUFNO1lBQUUsT0FBTyxDQUFDLElBQUksQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDO1FBQzFHLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsSUFBSSxJQUFJLENBQUMsYUFBYSxLQUFLLE9BQU8sQ0FBQyxJQUFJLElBQUksQ0FBQyxTQUFTO1lBQUUsT0FBTyxDQUFDLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxDQUFDO1FBQ2hJLE9BQU8sT0FBTyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztJQUMzQixDQUFDO0lBRUQsSUFBSSxZQUFZO1FBQ2QsTUFBTSxPQUFPLEdBQUc7WUFDZCxpQkFBaUI7WUFDakIsb0JBQW9CLElBQUksQ0FBQyxJQUFJLEVBQUU7WUFDL0Isb0JBQW9CLElBQUksQ0FBQyxLQUFLLEVBQUU7WUFDaEMsb0JBQW9CLElBQUksQ0FBQyxLQUFLLEVBQUU7WUFDaEMsb0JBQW9CLElBQUksQ0FBQyxhQUFhLEVBQUU7U0FDekMsQ0FBQztRQUNGLElBQUksSUFBSSxDQUFDLFFBQVE7WUFBRSxPQUFPLENBQUMsSUFBSSxDQUFDLDJCQUEyQixDQUFDLENBQUM7UUFDN0QsT0FBTyxPQUFPLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBQzNCLENBQUM7SUFFRCxPQUFPLENBQUMsS0FBaUI7UUFDdkIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDM0IsQ0FBQztJQUVELFFBQVEsQ0FBQyxLQUFpQjtRQUN4QixLQUFLLENBQUMsZUFBZSxFQUFFLENBQUM7UUFDeEIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUNyQixDQUFDOzsrR0F0RVUsaUJBQWlCO21HQUFqQixpQkFBaUIsNFlDaEI5QixndkVBb0RBOzRGRHBDYSxpQkFBaUI7a0JBTDdCLFNBQVM7K0JBQ0UsV0FBVzs4QkFNWixJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLEdBQUc7c0JBQVgsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBR0csSUFBSTtzQkFBWixLQUFLO2dCQUVHLE9BQU87c0JBQWYsS0FBSztnQkFFRyxhQUFhO3NCQUFyQixLQUFLO2dCQUdHLE1BQU07c0JBQWQsS0FBSztnQkFHRyxLQUFLO3NCQUFiLEtBQUs7Z0JBRUcsVUFBVTtzQkFBbEIsS0FBSztnQkFFRyxhQUFhO3NCQUFyQixLQUFLO2dCQUVHLEtBQUs7c0JBQWIsS0FBSztnQkFFRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVJLE1BQU07c0JBQWYsTUFBTTtnQkFDRyxPQUFPO3NCQUFoQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuZXhwb3J0IHR5cGUgWmVuQmFkZ2VTaXplID0gJ3NtJyB8ICdtZCcgfCAnbGcnO1xuZXhwb3J0IHR5cGUgWmVuQmFkZ2VDb2xvciA9XG4gIHwgJ2dyYXknIHwgJ3ByaW1hcnknIHwgJ2Vycm9yJyB8ICd3YXJuaW5nJyB8ICdzdWNjZXNzJ1xuICB8ICdibHVlLWdyYXknIHwgJ2JsdWUtbGlnaHQnIHwgJ2JsdWUnIHwgJ2luZGlnbycgfCAncHVycGxlJ1xuICB8ICdwaW5rJyB8ICdyb3NlJyB8ICdvcmFuZ2UnO1xuZXhwb3J0IHR5cGUgWmVuQmFkZ2VJY29uRGlyZWN0aW9uID0gJ2xlZnQnIHwgJ3JpZ2h0JztcbmV4cG9ydCB0eXBlIFplbkJhZGdlR3JvdXBUaGVtZSA9ICdsaWdodCcgfCAnbWVkaXVtJyB8ICdkYXJrJztcbmV4cG9ydCB0eXBlIFplbkJhZGdlR3JvdXBCYWRnZVBvc2l0aW9uID0gJ2xlYWRpbmcnIHwgJ3RyYWlsaW5nJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnemVuLWJhZGdlJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3plbi1iYWRnZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3plbi1iYWRnZS5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIFplbkJhZGdlQ29tcG9uZW50IHtcblxuICBASW5wdXQoKSBzaXplOiBaZW5CYWRnZVNpemUgPSAnbWQnO1xuICBASW5wdXQoKSBjb2xvcjogWmVuQmFkZ2VDb2xvciA9ICdwcmltYXJ5JztcbiAgQElucHV0KCkgZG90ID0gZmFsc2U7XG4gIEBJbnB1dCgpIHJlbW92YWJsZSA9IGZhbHNlO1xuICBASW5wdXQoKSBpY29uT25seSA9IGZhbHNlO1xuXG4gIC8qKiBJY29uIG5hbWUgKHJlc29sdmVkIHZpYSB6ZW4taWNvbidzIGljb25CYXNlUGF0aCkgKi9cbiAgQElucHV0KCkgaWNvbjogc3RyaW5nO1xuICAvKiogRGlyZWN0IGljb24gc3JjIFVSTCAodXNlIGluc3RlYWQgb2YgbmFtZSkgKi9cbiAgQElucHV0KCkgaWNvblNyYzogc3RyaW5nO1xuICAvKiogSWNvbiBwbGFjZW1lbnQgZGlyZWN0aW9uICovXG4gIEBJbnB1dCgpIGljb25EaXJlY3Rpb246IFplbkJhZGdlSWNvbkRpcmVjdGlvbiA9ICdsZWZ0JztcblxuICAvKiogSW1hZ2Ugc3JjIChjb3VudHJ5IGZsYWcgb3IgYXZhdGFyKSDigJQgc2hvd24gYXMgYSByb3VuZCBpbWFnZSBsZWZ0IG9mIHRleHQgKi9cbiAgQElucHV0KCkgaW1nU3JjOiBzdHJpbmc7XG5cbiAgLyoqIEJhZGdlIGdyb3VwIG1vZGUg4oCUIHJlbmRlcnMgYXMgYSBwaWxsIHdpdGggaW5uZXIgYmFkZ2UgKyBtZXNzYWdlICovXG4gIEBJbnB1dCgpIGdyb3VwID0gZmFsc2U7XG4gIC8qKiBCYWRnZSBncm91cDogaW5uZXIgYmFkZ2UgbGFiZWwgdGV4dCAqL1xuICBASW5wdXQoKSBiYWRnZUxhYmVsOiBzdHJpbmc7XG4gIC8qKiBCYWRnZSBncm91cDogYmFkZ2UgcG9zaXRpb24gKGxlYWRpbmcgPSBsZWZ0LCB0cmFpbGluZyA9IHJpZ2h0KSAqL1xuICBASW5wdXQoKSBiYWRnZVBvc2l0aW9uOiBaZW5CYWRnZUdyb3VwQmFkZ2VQb3NpdGlvbiA9ICdsZWFkaW5nJztcbiAgLyoqIEJhZGdlIGdyb3VwOiB0aGVtZSB2YXJpYW50ICovXG4gIEBJbnB1dCgpIHRoZW1lOiBaZW5CYWRnZUdyb3VwVGhlbWUgPSAnbGlnaHQnO1xuICAvKiogQmFkZ2UgZ3JvdXA6IHNob3cgYXJyb3cgaWNvbiAqL1xuICBASW5wdXQoKSBzaG93SWNvbiA9IGZhbHNlO1xuXG4gIEBPdXRwdXQoKSByZW1vdmUgPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG4gIEBPdXRwdXQoKSBjbGlja2VkID0gbmV3IEV2ZW50RW1pdHRlcjxNb3VzZUV2ZW50PigpO1xuXG4gIGdldCBoYXNJY29uKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiAhISh0aGlzLmljb24gfHwgdGhpcy5pY29uU3JjKTtcbiAgfVxuXG4gIGdldCBob3N0Q2xhc3NlcygpOiBzdHJpbmcge1xuICAgIGNvbnN0IGNsYXNzZXMgPSBbXG4gICAgICAnemVuLWJhZGdlJyxcbiAgICAgIGB6ZW4tYmFkZ2UtLSR7dGhpcy5zaXplfWAsXG4gICAgICBgemVuLWJhZGdlLS0ke3RoaXMuY29sb3J9YCxcbiAgICBdO1xuICAgIGlmICh0aGlzLmRvdCkgY2xhc3Nlcy5wdXNoKCd6ZW4tYmFkZ2UtLWRvdCcpO1xuICAgIGlmICh0aGlzLnJlbW92YWJsZSkgY2xhc3Nlcy5wdXNoKCd6ZW4tYmFkZ2UtLXJlbW92YWJsZScpO1xuICAgIGlmICh0aGlzLmljb25Pbmx5KSBjbGFzc2VzLnB1c2goJ3plbi1iYWRnZS0taWNvbi1vbmx5Jyk7XG4gICAgaWYgKHRoaXMuaW1nU3JjKSBjbGFzc2VzLnB1c2goJ3plbi1iYWRnZS0taGFzLWltZycpO1xuICAgIGlmICh0aGlzLmhhc0ljb24gJiYgIXRoaXMuaWNvbk9ubHkgJiYgdGhpcy5pY29uRGlyZWN0aW9uID09PSAnbGVmdCcpIGNsYXNzZXMucHVzaCgnemVuLWJhZGdlLS1pY29uLWxlZnQnKTtcbiAgICBpZiAoKHRoaXMuaGFzSWNvbiAmJiAhdGhpcy5pY29uT25seSAmJiB0aGlzLmljb25EaXJlY3Rpb24gPT09ICdyaWdodCcpIHx8IHRoaXMucmVtb3ZhYmxlKSBjbGFzc2VzLnB1c2goJ3plbi1iYWRnZS0taWNvbi1yaWdodCcpO1xuICAgIHJldHVybiBjbGFzc2VzLmpvaW4oJyAnKTtcbiAgfVxuXG4gIGdldCBncm91cENsYXNzZXMoKTogc3RyaW5nIHtcbiAgICBjb25zdCBjbGFzc2VzID0gW1xuICAgICAgJ3plbi1iYWRnZS1ncm91cCcsXG4gICAgICBgemVuLWJhZGdlLWdyb3VwLS0ke3RoaXMuc2l6ZX1gLFxuICAgICAgYHplbi1iYWRnZS1ncm91cC0tJHt0aGlzLmNvbG9yfWAsXG4gICAgICBgemVuLWJhZGdlLWdyb3VwLS0ke3RoaXMudGhlbWV9YCxcbiAgICAgIGB6ZW4tYmFkZ2UtZ3JvdXAtLSR7dGhpcy5iYWRnZVBvc2l0aW9ufWAsXG4gICAgXTtcbiAgICBpZiAodGhpcy5zaG93SWNvbikgY2xhc3Nlcy5wdXNoKCd6ZW4tYmFkZ2UtZ3JvdXAtLWhhcy1pY29uJyk7XG4gICAgcmV0dXJuIGNsYXNzZXMuam9pbignICcpO1xuICB9XG5cbiAgb25DbGljayhldmVudDogTW91c2VFdmVudCk6IHZvaWQge1xuICAgIHRoaXMuY2xpY2tlZC5lbWl0KGV2ZW50KTtcbiAgfVxuXG4gIG9uUmVtb3ZlKGV2ZW50OiBNb3VzZUV2ZW50KTogdm9pZCB7XG4gICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgdGhpcy5yZW1vdmUuZW1pdCgpO1xuICB9XG59XG4iLCI8IS0tIEJhZGdlIEdyb3VwIG1vZGUgLS0+XG48bmctY29udGFpbmVyICpuZ0lmPVwiZ3JvdXA7IGVsc2Ugc3RhbmRhcmRCYWRnZVwiPlxuICA8ZGl2IFtjbGFzc109XCJncm91cENsYXNzZXNcIiAoY2xpY2spPVwib25DbGljaygkZXZlbnQpXCI+XG5cbiAgICA8IS0tIExlYWRpbmc6IGlubmVyIGJhZGdlIGZpcnN0IC0tPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJiYWRnZVBvc2l0aW9uID09PSAnbGVhZGluZydcIj5cbiAgICAgIDxzcGFuIGNsYXNzPVwiemVuLWJhZGdlLWdyb3VwX19iYWRnZVwiPnt7IGJhZGdlTGFiZWwgfX08L3NwYW4+XG4gICAgICA8c3BhbiBjbGFzcz1cInplbi1iYWRnZS1ncm91cF9fY29udGVudFwiPlxuICAgICAgICA8c3BhbiBjbGFzcz1cInplbi1iYWRnZS1ncm91cF9fbWVzc2FnZVwiPjxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJjb250ZW50VHBsXCI+PC9uZy1jb250YWluZXI+PC9zcGFuPlxuICAgICAgICA8emVuLWljb24gKm5nSWY9XCJzaG93SWNvblwiIGNsYXNzPVwiemVuLWJhZGdlLWdyb3VwX19pY29uXCIgbmFtZT1cImFycm93LXJpZ2h0XCI+PC96ZW4taWNvbj5cbiAgICAgIDwvc3Bhbj5cbiAgICA8L25nLWNvbnRhaW5lcj5cblxuICAgIDwhLS0gVHJhaWxpbmc6IG1lc3NhZ2UgZmlyc3QsIGJhZGdlIHdpdGggb3B0aW9uYWwgaWNvbiBsYXN0IC0tPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJiYWRnZVBvc2l0aW9uID09PSAndHJhaWxpbmcnXCI+XG4gICAgICA8c3BhbiBjbGFzcz1cInplbi1iYWRnZS1ncm91cF9fbWVzc2FnZVwiPjxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJjb250ZW50VHBsXCI+PC9uZy1jb250YWluZXI+PC9zcGFuPlxuICAgICAgPHNwYW4gY2xhc3M9XCJ6ZW4tYmFkZ2UtZ3JvdXBfX2JhZGdlXCI+XG4gICAgICAgIHt7IGJhZGdlTGFiZWwgfX1cbiAgICAgICAgPHplbi1pY29uICpuZ0lmPVwic2hvd0ljb25cIiBjbGFzcz1cInplbi1iYWRnZS1ncm91cF9fYmFkZ2UtaWNvblwiIG5hbWU9XCJhcnJvdy1yaWdodFwiPjwvemVuLWljb24+XG4gICAgICA8L3NwYW4+XG4gICAgPC9uZy1jb250YWluZXI+XG5cbiAgPC9kaXY+XG48L25nLWNvbnRhaW5lcj5cblxuPCEtLSBTdGFuZGFyZCBiYWRnZSBtb2RlIC0tPlxuPG5nLXRlbXBsYXRlICNzdGFuZGFyZEJhZGdlPlxuICA8ZGl2IFtjbGFzc109XCJob3N0Q2xhc3Nlc1wiIChjbGljayk9XCJvbkNsaWNrKCRldmVudClcIj5cbiAgICA8c3BhbiAqbmdJZj1cImRvdFwiIGNsYXNzPVwiemVuLWJhZGdlX19kb3RcIj48L3NwYW4+XG5cbiAgICA8aW1nICpuZ0lmPVwiaW1nU3JjXCIgY2xhc3M9XCJ6ZW4tYmFkZ2VfX2ltZ1wiIFtzcmNdPVwiaW1nU3JjXCIgYWx0PVwiXCI+XG5cbiAgICA8emVuLWljb24gKm5nSWY9XCJoYXNJY29uICYmICFpY29uT25seSAmJiBpY29uRGlyZWN0aW9uID09PSAnbGVmdCdcIiBjbGFzcz1cInplbi1iYWRnZV9faWNvblwiXG4gICAgICAgICAgICAgIFtuYW1lXT1cImljb25cIiBbc3JjXT1cImljb25TcmNcIj48L3plbi1pY29uPlxuXG4gICAgPHNwYW4gKm5nSWY9XCIhaWNvbk9ubHlcIiBjbGFzcz1cInplbi1iYWRnZV9fdGV4dFwiPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cImNvbnRlbnRUcGxcIj48L25nLWNvbnRhaW5lcj5cbiAgICA8L3NwYW4+XG5cbiAgICA8emVuLWljb24gKm5nSWY9XCJpY29uT25seSAmJiBoYXNJY29uXCIgY2xhc3M9XCJ6ZW4tYmFkZ2VfX2ljb25cIlxuICAgICAgICAgICAgICBbbmFtZV09XCJpY29uXCIgW3NyY109XCJpY29uU3JjXCI+PC96ZW4taWNvbj5cblxuICAgIDx6ZW4taWNvbiAqbmdJZj1cImhhc0ljb24gJiYgIWljb25Pbmx5ICYmIGljb25EaXJlY3Rpb24gPT09ICdyaWdodCdcIiBjbGFzcz1cInplbi1iYWRnZV9faWNvblwiXG4gICAgICAgICAgICAgIFtuYW1lXT1cImljb25cIiBbc3JjXT1cImljb25TcmNcIj48L3plbi1pY29uPlxuXG4gICAgPGJ1dHRvbiAqbmdJZj1cInJlbW92YWJsZVwiIGNsYXNzPVwiemVuLWJhZGdlX19jbG9zZVwiIChjbGljayk9XCJvblJlbW92ZSgkZXZlbnQpXCIgdHlwZT1cImJ1dHRvblwiIGFyaWEtbGFiZWw9XCJSZW1vdmVcIj5cbiAgICAgIDx6ZW4taWNvbiBjbGFzcz1cInplbi1iYWRnZV9faWNvblwiIG5hbWU9XCJ4XCI+PC96ZW4taWNvbj5cbiAgICA8L2J1dHRvbj5cbiAgPC9kaXY+XG48L25nLXRlbXBsYXRlPlxuXG48bmctdGVtcGxhdGUgI2NvbnRlbnRUcGw+PG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PjwvbmctdGVtcGxhdGU+XG4iXX0=
package/esm2020/lib/button/zen-button.component.mjs ADDED
@@ -0,0 +1,97 @@
1
+ import { Component, Input } from '@angular/core';
2
+ import * as i0 from "@angular/core";
3
+ import * as i1 from "@angular/common";
4
+ import * as i2 from "../icon/zendu-icon.component";
5
+ export class ZenButtonComponent {
6
+ constructor() {
7
+ this.variant = 'primary';
8
+ this.buttonType = 'button';
9
+ this.size = 'md';
10
+ this.destructive = false;
11
+ this.disabled = false;
12
+ this.fullWidth = false;
13
+ this.type = 'button';
14
+ }
15
+ get isIconOnly() {
16
+ return this.buttonType === 'button-icon-only';
17
+ }
18
+ get buttonClasses() {
19
+ const classes = [];
20
+ // Base variant class
21
+ if (this.variant === 'primary') {
22
+ classes.push('button-base');
23
+ }
24
+ else if (this.variant === 'secondary-gray') {
25
+ classes.push('button-secondary-gray');
26
+ }
27
+ else if (this.variant === 'secondary') {
28
+ classes.push('button-secondary-color');
29
+ }
30
+ else if (this.variant === 'tertiary-gray') {
31
+ classes.push('button-tertiary-gray');
32
+ }
33
+ else if (this.variant === 'tertiary') {
34
+ classes.push('button-tertiary-color');
35
+ }
36
+ else if (this.variant === 'link-gray') {
37
+ classes.push('button-link-gray');
38
+ }
39
+ else if (this.variant === 'link') {
40
+ classes.push('button-link-color');
41
+ }
42
+ // Size class
43
+ classes.push(`button-${this.size}`);
44
+ // Typography classes based on size
45
+ classes.push('text');
46
+ if (this.size === '2xl') {
47
+ classes.push('text-lg');
48
+ classes.push('text-weight-medium');
49
+ }
50
+ else if (this.size === 'xl' || this.size === 'lg') {
51
+ classes.push('text-md');
52
+ classes.push('text-weight-medium');
53
+ }
54
+ else {
55
+ classes.push('text-sm');
56
+ classes.push('text-weight-medium');
57
+ }
58
+ // State modifiers
59
+ if (this.destructive) {
60
+ classes.push('destructive');
61
+ }
62
+ if (this.isIconOnly) {
63
+ classes.push('button-icon-only');
64
+ }
65
+ if (this.fullWidth) {
66
+ classes.push('full-width');
67
+ }
68
+ return classes.join(' ');
69
+ }
70
+ getIconName() {
71
+ // Use the icon input if provided, otherwise default to circle
72
+ return this.icon || 'circle';
73
+ }
74
+ }
75
+ ZenButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
76
+ ZenButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenButtonComponent, selector: "zen-button", inputs: { variant: "variant", buttonType: "buttonType", icon: "icon", size: "size", destructive: "destructive", disabled: "disabled", fullWidth: "fullWidth", type: "type" }, ngImport: i0, template: "<button \n [class]=\"buttonClasses\"\n [type]=\"type\"\n [disabled]=\"disabled\">\n \n <!-- Dot indicator -->\n <span *ngIf=\"buttonType === 'button-dot'\" class=\"button-dot\"></span>\n \n <!-- Leading icon -->\n <zen-icon *ngIf=\"buttonType === 'button-icon-leading' || isIconOnly\" \n [name]=\"getIconName()\"\n size=\"xs\"></zen-icon>\n \n <!-- Button content -->\n <ng-content *ngIf=\"!isIconOnly\"></ng-content>\n \n <!-- Trailing icon -->\n <zen-icon *ngIf=\"buttonType === 'button-icon-trailing'\" \n [name]=\"getIconName()\"\n size=\"xs\"></zen-icon>\n</button>", styles: [".text{margin:0;padding:0;color:#101828}.text-display-2xl{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:72px;line-height:90px;letter-spacing:-.02em}.text-display-xl{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:60px;line-height:72px;letter-spacing:-.02em}.text-display-lg{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:48px;line-height:60px;letter-spacing:-.02em}.text-display-md{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:36px;line-height:44px;letter-spacing:-.02em}.text-display-sm{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:30px;line-height:38px;letter-spacing:0}.text-display-xs{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:24px;line-height:32px;letter-spacing:0}.text-xl{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:20px;line-height:30px;letter-spacing:0}.text-lg{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:18px;line-height:28px;letter-spacing:0}.text-md{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:24px;letter-spacing:0}.text-sm{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px;line-height:20px;letter-spacing:0}.text-xs{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:12px;line-height:18px;letter-spacing:0}.text-weight-regular{font-weight:400;font-style:normal}.text-weight-medium{font-weight:500;font-style:normal}.text-weight-semibold{font-weight:600;font-style:normal}.text-weight-bold{font-weight:700;font-style:normal}@media (max-width: 768px){.text-display-2xl{font-size:48px;line-height:56px}.text-display-xl{font-size:40px;line-height:48px}.text-display-lg{font-size:32px;line-height:40px}}.button-2xl{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:60px;padding:0 28px}.button-2xl zen-icon{color:inherit;background-color:currentColor}.button-2xl .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-2xl:disabled{cursor:not-allowed}.button-2xl.full-width{width:100%;justify-content:center}.button-2xl.button-icon-only{padding:0;justify-content:center}.button-2xl.button-icon-only{width:60px;padding:0}.button-xl{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:48px;padding:0 20px}.button-xl zen-icon{color:inherit;background-color:currentColor}.button-xl .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-xl:disabled{cursor:not-allowed}.button-xl.full-width{width:100%;justify-content:center}.button-xl.button-icon-only{padding:0;justify-content:center}.button-xl.button-icon-only{width:48px;padding:0}.button-lg{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:44px;padding:0 18px}.button-lg zen-icon{color:inherit;background-color:currentColor}.button-lg .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-lg:disabled{cursor:not-allowed}.button-lg.full-width{width:100%;justify-content:center}.button-lg.button-icon-only{padding:0;justify-content:center}.button-lg.button-icon-only{width:44px;padding:0}.button-md{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:40px;padding:0 16px}.button-md zen-icon{color:inherit;background-color:currentColor}.button-md .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-md:disabled{cursor:not-allowed}.button-md.full-width{width:100%;justify-content:center}.button-md.button-icon-only{padding:0;justify-content:center}.button-md.button-icon-only{width:40px;padding:0}.button-sm{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:36px;padding:0 14px}.button-sm zen-icon{color:inherit;background-color:currentColor}.button-sm .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-sm:disabled{cursor:not-allowed}.button-sm.full-width{width:100%;justify-content:center}.button-sm.button-icon-only{padding:0;justify-content:center}.button-sm.button-icon-only{width:36px;padding:0}.button-base{background:#136AB6;color:#fff;border:1px solid #136AB6;box-shadow:0 1px 2px #1018280d}.button-base:hover:not(:disabled){background:#105494;border-color:#105494}.button-base:focus:not(:disabled){outline:none;box-shadow:0 1px 2px #1018280d,0 0 0 4px #136ab63d}.button-base.destructive{background:#D92D20;border-color:#d92d20}.button-base.destructive:hover:not(:disabled){background:#B42318;border-color:#b42318}.button-base.destructive:focus:not(:disabled){box-shadow:0 1px 2px #1018280d,0 0 0 4px #d92d203d}.button-base.destructive:disabled{background:#FECDCA;border-color:#fecdca;color:#fff}.button-base:disabled{background:#C0DDF7;border-color:#c0ddf7;color:#fff}.button-secondary-gray{background:#FFFFFF;color:#344054;border:1px solid #D0D5DD;box-shadow:0 1px 2px #1018280d}.button-secondary-gray:hover:not(:disabled){background:#F9FAFB;color:#1d2939}.button-secondary-gray:focus:not(:disabled){outline:none;box-shadow:0 1px 2px #1018280d,0 0 0 4px #f2f4f7}.button-secondary-gray.destructive{color:#b42318}.button-secondary-gray.destructive:hover:not(:disabled){background:#FEF3F2;color:#912018}.button-secondary-gray.destructive:focus:not(:disabled){box-shadow:0 1px 2px #1018280d,0 0 0 4px #d92d203d}.button-secondary-gray.destructive:disabled{background:#FFFFFF;border-color:#eaecf0;color:#fda29b}.button-secondary-gray:disabled{background:#FFFFFF;border-color:#eaecf0;color:#d0d5dd}.button-secondary-color{background:#F1F7FE;color:#105494;border:1px solid #F1F7FE;box-shadow:0 1px 2px #1018280d}.button-secondary-color:hover:not(:disabled){background:#E3EEFB;border-color:#e3eefb}.button-secondary-color:focus:not(:disabled){outline:none;box-shadow:0 1px 2px #1018280d,0 0 0 4px #136ab63d}.button-secondary-color.destructive{background:#FEF3F2;color:#b42318;border-color:#fef3f2}.button-secondary-color.destructive:hover:not(:disabled){background:#FEE4E2;border-color:#fee4e2}.button-secondary-color.destructive:focus:not(:disabled){box-shadow:0 1px 2px #1018280d,0 0 0 4px #d92d203d}.button-secondary-color.destructive:disabled{background:#FFFBFA;border-color:#fffbfa;color:#fda29b}.button-secondary-color:disabled{background:#FAFDFF;border-color:#fafdff;color:#88c1f1}.button-tertiary-gray{background:transparent;color:#667085;border:1px solid transparent}.button-tertiary-gray:hover:not(:disabled){background:#F9FAFB;color:#475467}.button-tertiary-gray:focus:not(:disabled){outline:none;background:#F9FAFB}.button-tertiary-gray.destructive{color:#b42318}.button-tertiary-gray.destructive:hover:not(:disabled){background:#FEF3F2;color:#912018}.button-tertiary-gray.destructive:focus:not(:disabled){background:#FEF3F2}.button-tertiary-gray.destructive:disabled{color:#fda29b}.button-tertiary-gray:disabled{color:#d0d5dd}.button-tertiary-color{background:transparent;color:#105494;border:1px solid transparent}.button-tertiary-color:hover:not(:disabled){background:#F1F7FE}.button-tertiary-color:focus:not(:disabled){outline:none;background:#F1F7FE}.button-tertiary-color.destructive{color:#b42318}.button-tertiary-color.destructive:hover:not(:disabled){background:#FEF3F2;color:#912018}.button-tertiary-color.destructive:focus:not(:disabled){background:#FEF3F2}.button-tertiary-color.destructive:disabled{color:#fda29b}.button-tertiary-color:disabled{color:#d0d5dd}.button-link-gray{background:transparent;color:#475467;border:none;text-decoration:none}.button-link-gray:hover:not(:disabled){color:#344054}.button-link-gray:focus:not(:disabled){outline:none}.button-link-gray.destructive{color:#b42318}.button-link-gray.destructive:hover:not(:disabled){color:#912018}.button-link-gray.destructive:disabled{color:#fda29b}.button-link-gray:disabled{color:#d0d5dd}.button-link-color{background:transparent;color:#105494;border:none;text-decoration:none}.button-link-color:hover:not(:disabled){color:#12497a}.button-link-color:focus:not(:disabled){outline:none}.button-link-color.destructive{color:#b42318}.button-link-color.destructive:hover:not(:disabled){color:#912018}.button-link-color.destructive:disabled{color:#fda29b}.button-link-color:disabled{color:#d0d5dd}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ZenduIconComponent, selector: "zen-icon", inputs: ["src", "name", "size", "color", "theme", "customColor"] }] });
77
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenButtonComponent, decorators: [{
78
+ type: Component,
79
+ args: [{ selector: 'zen-button', template: "<button \n [class]=\"buttonClasses\"\n [type]=\"type\"\n [disabled]=\"disabled\">\n \n <!-- Dot indicator -->\n <span *ngIf=\"buttonType === 'button-dot'\" class=\"button-dot\"></span>\n \n <!-- Leading icon -->\n <zen-icon *ngIf=\"buttonType === 'button-icon-leading' || isIconOnly\" \n [name]=\"getIconName()\"\n size=\"xs\"></zen-icon>\n \n <!-- Button content -->\n <ng-content *ngIf=\"!isIconOnly\"></ng-content>\n \n <!-- Trailing icon -->\n <zen-icon *ngIf=\"buttonType === 'button-icon-trailing'\" \n [name]=\"getIconName()\"\n size=\"xs\"></zen-icon>\n</button>", styles: [".text{margin:0;padding:0;color:#101828}.text-display-2xl{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:72px;line-height:90px;letter-spacing:-.02em}.text-display-xl{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:60px;line-height:72px;letter-spacing:-.02em}.text-display-lg{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:48px;line-height:60px;letter-spacing:-.02em}.text-display-md{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:36px;line-height:44px;letter-spacing:-.02em}.text-display-sm{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:30px;line-height:38px;letter-spacing:0}.text-display-xs{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:24px;line-height:32px;letter-spacing:0}.text-xl{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:20px;line-height:30px;letter-spacing:0}.text-lg{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:18px;line-height:28px;letter-spacing:0}.text-md{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:24px;letter-spacing:0}.text-sm{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px;line-height:20px;letter-spacing:0}.text-xs{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:12px;line-height:18px;letter-spacing:0}.text-weight-regular{font-weight:400;font-style:normal}.text-weight-medium{font-weight:500;font-style:normal}.text-weight-semibold{font-weight:600;font-style:normal}.text-weight-bold{font-weight:700;font-style:normal}@media (max-width: 768px){.text-display-2xl{font-size:48px;line-height:56px}.text-display-xl{font-size:40px;line-height:48px}.text-display-lg{font-size:32px;line-height:40px}}.button-2xl{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:60px;padding:0 28px}.button-2xl zen-icon{color:inherit;background-color:currentColor}.button-2xl .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-2xl:disabled{cursor:not-allowed}.button-2xl.full-width{width:100%;justify-content:center}.button-2xl.button-icon-only{padding:0;justify-content:center}.button-2xl.button-icon-only{width:60px;padding:0}.button-xl{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:48px;padding:0 20px}.button-xl zen-icon{color:inherit;background-color:currentColor}.button-xl .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-xl:disabled{cursor:not-allowed}.button-xl.full-width{width:100%;justify-content:center}.button-xl.button-icon-only{padding:0;justify-content:center}.button-xl.button-icon-only{width:48px;padding:0}.button-lg{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:44px;padding:0 18px}.button-lg zen-icon{color:inherit;background-color:currentColor}.button-lg .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-lg:disabled{cursor:not-allowed}.button-lg.full-width{width:100%;justify-content:center}.button-lg.button-icon-only{padding:0;justify-content:center}.button-lg.button-icon-only{width:44px;padding:0}.button-md{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:40px;padding:0 16px}.button-md zen-icon{color:inherit;background-color:currentColor}.button-md .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-md:disabled{cursor:not-allowed}.button-md.full-width{width:100%;justify-content:center}.button-md.button-icon-only{padding:0;justify-content:center}.button-md.button-icon-only{width:40px;padding:0}.button-sm{display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;border-radius:8px;box-sizing:border-box;white-space:nowrap;border:none;transition:all .2s ease;cursor:pointer;font-family:inherit;height:36px;padding:0 14px}.button-sm zen-icon{color:inherit;background-color:currentColor}.button-sm .button-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block}.button-sm:disabled{cursor:not-allowed}.button-sm.full-width{width:100%;justify-content:center}.button-sm.button-icon-only{padding:0;justify-content:center}.button-sm.button-icon-only{width:36px;padding:0}.button-base{background:#136AB6;color:#fff;border:1px solid #136AB6;box-shadow:0 1px 2px #1018280d}.button-base:hover:not(:disabled){background:#105494;border-color:#105494}.button-base:focus:not(:disabled){outline:none;box-shadow:0 1px 2px #1018280d,0 0 0 4px #136ab63d}.button-base.destructive{background:#D92D20;border-color:#d92d20}.button-base.destructive:hover:not(:disabled){background:#B42318;border-color:#b42318}.button-base.destructive:focus:not(:disabled){box-shadow:0 1px 2px #1018280d,0 0 0 4px #d92d203d}.button-base.destructive:disabled{background:#FECDCA;border-color:#fecdca;color:#fff}.button-base:disabled{background:#C0DDF7;border-color:#c0ddf7;color:#fff}.button-secondary-gray{background:#FFFFFF;color:#344054;border:1px solid #D0D5DD;box-shadow:0 1px 2px #1018280d}.button-secondary-gray:hover:not(:disabled){background:#F9FAFB;color:#1d2939}.button-secondary-gray:focus:not(:disabled){outline:none;box-shadow:0 1px 2px #1018280d,0 0 0 4px #f2f4f7}.button-secondary-gray.destructive{color:#b42318}.button-secondary-gray.destructive:hover:not(:disabled){background:#FEF3F2;color:#912018}.button-secondary-gray.destructive:focus:not(:disabled){box-shadow:0 1px 2px #1018280d,0 0 0 4px #d92d203d}.button-secondary-gray.destructive:disabled{background:#FFFFFF;border-color:#eaecf0;color:#fda29b}.button-secondary-gray:disabled{background:#FFFFFF;border-color:#eaecf0;color:#d0d5dd}.button-secondary-color{background:#F1F7FE;color:#105494;border:1px solid #F1F7FE;box-shadow:0 1px 2px #1018280d}.button-secondary-color:hover:not(:disabled){background:#E3EEFB;border-color:#e3eefb}.button-secondary-color:focus:not(:disabled){outline:none;box-shadow:0 1px 2px #1018280d,0 0 0 4px #136ab63d}.button-secondary-color.destructive{background:#FEF3F2;color:#b42318;border-color:#fef3f2}.button-secondary-color.destructive:hover:not(:disabled){background:#FEE4E2;border-color:#fee4e2}.button-secondary-color.destructive:focus:not(:disabled){box-shadow:0 1px 2px #1018280d,0 0 0 4px #d92d203d}.button-secondary-color.destructive:disabled{background:#FFFBFA;border-color:#fffbfa;color:#fda29b}.button-secondary-color:disabled{background:#FAFDFF;border-color:#fafdff;color:#88c1f1}.button-tertiary-gray{background:transparent;color:#667085;border:1px solid transparent}.button-tertiary-gray:hover:not(:disabled){background:#F9FAFB;color:#475467}.button-tertiary-gray:focus:not(:disabled){outline:none;background:#F9FAFB}.button-tertiary-gray.destructive{color:#b42318}.button-tertiary-gray.destructive:hover:not(:disabled){background:#FEF3F2;color:#912018}.button-tertiary-gray.destructive:focus:not(:disabled){background:#FEF3F2}.button-tertiary-gray.destructive:disabled{color:#fda29b}.button-tertiary-gray:disabled{color:#d0d5dd}.button-tertiary-color{background:transparent;color:#105494;border:1px solid transparent}.button-tertiary-color:hover:not(:disabled){background:#F1F7FE}.button-tertiary-color:focus:not(:disabled){outline:none;background:#F1F7FE}.button-tertiary-color.destructive{color:#b42318}.button-tertiary-color.destructive:hover:not(:disabled){background:#FEF3F2;color:#912018}.button-tertiary-color.destructive:focus:not(:disabled){background:#FEF3F2}.button-tertiary-color.destructive:disabled{color:#fda29b}.button-tertiary-color:disabled{color:#d0d5dd}.button-link-gray{background:transparent;color:#475467;border:none;text-decoration:none}.button-link-gray:hover:not(:disabled){color:#344054}.button-link-gray:focus:not(:disabled){outline:none}.button-link-gray.destructive{color:#b42318}.button-link-gray.destructive:hover:not(:disabled){color:#912018}.button-link-gray.destructive:disabled{color:#fda29b}.button-link-gray:disabled{color:#d0d5dd}.button-link-color{background:transparent;color:#105494;border:none;text-decoration:none}.button-link-color:hover:not(:disabled){color:#12497a}.button-link-color:focus:not(:disabled){outline:none}.button-link-color.destructive{color:#b42318}.button-link-color.destructive:hover:not(:disabled){color:#912018}.button-link-color.destructive:disabled{color:#fda29b}.button-link-color:disabled{color:#d0d5dd}\n"] }]
80
+ }], propDecorators: { variant: [{
81
+ type: Input
82
+ }], buttonType: [{
83
+ type: Input
84
+ }], icon: [{
85
+ type: Input
86
+ }], size: [{
87
+ type: Input
88
+ }], destructive: [{
89
+ type: Input
90
+ }], disabled: [{
91
+ type: Input
92
+ }], fullWidth: [{
93
+ type: Input
94
+ }], type: [{
95
+ type: Input
96
+ }] } });
97
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiemVuLWJ1dHRvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy16ZW5kdWl0L3NyYy9saWIvYnV0dG9uL3plbi1idXR0b24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctemVuZHVpdC9zcmMvbGliL2J1dHRvbi96ZW4tYnV0dG9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBT2pELE1BQU0sT0FBTyxrQkFBa0I7SUFML0I7UUFPVyxZQUFPLEdBQXFHLFNBQVMsQ0FBQztRQUV0SCxlQUFVLEdBQWtHLFFBQVEsQ0FBQztRQUdySCxTQUFJLEdBQXNDLElBQUksQ0FBQztRQUMvQyxnQkFBVyxHQUFZLEtBQUssQ0FBQztRQUM3QixhQUFRLEdBQVksS0FBSyxDQUFDO1FBQzFCLGNBQVMsR0FBWSxLQUFLLENBQUM7UUFDM0IsU0FBSSxHQUFrQyxRQUFRLENBQUM7S0E4RHpEO0lBNURDLElBQUksVUFBVTtRQUNaLE9BQU8sSUFBSSxDQUFDLFVBQVUsS0FBSyxrQkFBa0IsQ0FBQztJQUNoRCxDQUFDO0lBRUQsSUFBSSxhQUFhO1FBQ2YsTUFBTSxPQUFPLEdBQUcsRUFBRSxDQUFDO1FBRW5CLHFCQUFxQjtRQUNyQixJQUFJLElBQUksQ0FBQyxPQUFPLEtBQUssU0FBUyxFQUFFO1lBQzlCLE9BQU8sQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUM7U0FDN0I7YUFBTSxJQUFJLElBQUksQ0FBQyxPQUFPLEtBQUssZ0JBQWdCLEVBQUU7WUFDNUMsT0FBTyxDQUFDLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxDQUFDO1NBQ3ZDO2FBQU0sSUFBSSxJQUFJLENBQUMsT0FBTyxLQUFLLFdBQVcsRUFBRTtZQUN2QyxPQUFPLENBQUMsSUFBSSxDQUFDLHdCQUF3QixDQUFDLENBQUM7U0FDeEM7YUFBTSxJQUFJLElBQUksQ0FBQyxPQUFPLEtBQUssZUFBZSxFQUFFO1lBQzNDLE9BQU8sQ0FBQyxJQUFJLENBQUMsc0JBQXNCLENBQUMsQ0FBQztTQUN0QzthQUFNLElBQUksSUFBSSxDQUFDLE9BQU8sS0FBSyxVQUFVLEVBQUU7WUFDdEMsT0FBTyxDQUFDLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxDQUFDO1NBQ3ZDO2FBQU0sSUFBSSxJQUFJLENBQUMsT0FBTyxLQUFLLFdBQVcsRUFBRTtZQUN2QyxPQUFPLENBQUMsSUFBSSxDQUFDLGtCQUFrQixDQUFDLENBQUM7U0FDbEM7YUFBTSxJQUFJLElBQUksQ0FBQyxPQUFPLEtBQUssTUFBTSxFQUFFO1lBQ2xDLE9BQU8sQ0FBQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsQ0FBQztTQUNuQztRQUVELGFBQWE7UUFDYixPQUFPLENBQUMsSUFBSSxDQUFDLFVBQVUsSUFBSSxDQUFDLElBQUksRUFBRSxDQUFDLENBQUM7UUFFcEMsbUNBQW1DO1FBQ25DLE9BQU8sQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDckIsSUFBSSxJQUFJLENBQUMsSUFBSSxLQUFLLEtBQUssRUFBRTtZQUN2QixPQUFPLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDO1lBQ3hCLE9BQU8sQ0FBQyxJQUFJLENBQUMsb0JBQW9CLENBQUMsQ0FBQztTQUNwQzthQUFNLElBQUksSUFBSSxDQUFDLElBQUksS0FBSyxJQUFJLElBQUksSUFBSSxDQUFDLElBQUksS0FBSyxJQUFJLEVBQUU7WUFDbkQsT0FBTyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQztZQUN4QixPQUFPLENBQUMsSUFBSSxDQUFDLG9CQUFvQixDQUFDLENBQUM7U0FDcEM7YUFBTTtZQUNMLE9BQU8sQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLENBQUM7WUFDeEIsT0FBTyxDQUFDLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxDQUFDO1NBQ3BDO1FBRUQsa0JBQWtCO1FBQ2xCLElBQUksSUFBSSxDQUFDLFdBQVcsRUFBRTtZQUNwQixPQUFPLENBQUMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1NBQzdCO1FBRUQsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO1lBQ25CLE9BQU8sQ0FBQyxJQUFJLENBQUMsa0JBQWtCLENBQUMsQ0FBQztTQUNsQztRQUVELElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUNsQixPQUFPLENBQUMsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUFDO1NBQzVCO1FBRUQsT0FBTyxPQUFPLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBQzNCLENBQUM7SUFFRCxXQUFXO1FBQ1QsOERBQThEO1FBQzlELE9BQU8sSUFBSSxDQUFDLElBQUksSUFBSSxRQUFRLENBQUM7SUFDL0IsQ0FBQzs7Z0hBeEVVLGtCQUFrQjtvR0FBbEIsa0JBQWtCLGdPQ1AvQix1bkJBb0JTOzRGRGJJLGtCQUFrQjtrQkFMOUIsU0FBUzsrQkFDRSxZQUFZOzhCQU1iLE9BQU87c0JBQWYsS0FBSztnQkFFRyxVQUFVO3NCQUFsQixLQUFLO2dCQUVHLElBQUk7c0JBQVosS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd6ZW4tYnV0dG9uJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3plbi1idXR0b24uY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi96ZW4tYnV0dG9uLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgWmVuQnV0dG9uQ29tcG9uZW50IHtcbiAgXG4gIEBJbnB1dCgpIHZhcmlhbnQ6ICdwcmltYXJ5JyB8ICdzZWNvbmRhcnktZ3JheScgfCAnc2Vjb25kYXJ5JyB8ICd0ZXJ0aWFyeS1ncmF5JyB8ICd0ZXJ0aWFyeScgfCAnbGluay1ncmF5JyB8ICdsaW5rJyA9ICdwcmltYXJ5JztcbiAgXG4gIEBJbnB1dCgpIGJ1dHRvblR5cGU6ICdidXR0b24nIHwgJ2J1dHRvbi1kb3QnIHwgJ2J1dHRvbi1pY29uLWxlYWRpbmcnIHwgJ2J1dHRvbi1pY29uLXRyYWlsaW5nJyB8ICdidXR0b24taWNvbi1vbmx5JyA9ICdidXR0b24nO1xuICBcbiAgQElucHV0KCkgaWNvbj86IHN0cmluZztcbiAgQElucHV0KCkgc2l6ZTogJzJ4bCcgfCAneGwnIHwgJ2xnJyB8ICdtZCcgfCAnc20nID0gJ21kJztcbiAgQElucHV0KCkgZGVzdHJ1Y3RpdmU6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgZGlzYWJsZWQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgZnVsbFdpZHRoOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIHR5cGU6ICdidXR0b24nIHwgJ3N1Ym1pdCcgfCAncmVzZXQnID0gJ2J1dHRvbic7XG5cbiAgZ2V0IGlzSWNvbk9ubHkoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuYnV0dG9uVHlwZSA9PT0gJ2J1dHRvbi1pY29uLW9ubHknO1xuICB9XG5cbiAgZ2V0IGJ1dHRvbkNsYXNzZXMoKTogc3RyaW5nIHtcbiAgICBjb25zdCBjbGFzc2VzID0gW107XG4gICAgXG4gICAgLy8gQmFzZSB2YXJpYW50IGNsYXNzXG4gICAgaWYgKHRoaXMudmFyaWFudCA9PT0gJ3ByaW1hcnknKSB7XG4gICAgICBjbGFzc2VzLnB1c2goJ2J1dHRvbi1iYXNlJyk7XG4gICAgfSBlbHNlIGlmICh0aGlzLnZhcmlhbnQgPT09ICdzZWNvbmRhcnktZ3JheScpIHtcbiAgICAgIGNsYXNzZXMucHVzaCgnYnV0dG9uLXNlY29uZGFyeS1ncmF5Jyk7XG4gICAgfSBlbHNlIGlmICh0aGlzLnZhcmlhbnQgPT09ICdzZWNvbmRhcnknKSB7XG4gICAgICBjbGFzc2VzLnB1c2goJ2J1dHRvbi1zZWNvbmRhcnktY29sb3InKTtcbiAgICB9IGVsc2UgaWYgKHRoaXMudmFyaWFudCA9PT0gJ3RlcnRpYXJ5LWdyYXknKSB7XG4gICAgICBjbGFzc2VzLnB1c2goJ2J1dHRvbi10ZXJ0aWFyeS1ncmF5Jyk7XG4gICAgfSBlbHNlIGlmICh0aGlzLnZhcmlhbnQgPT09ICd0ZXJ0aWFyeScpIHtcbiAgICAgIGNsYXNzZXMucHVzaCgnYnV0dG9uLXRlcnRpYXJ5LWNvbG9yJyk7XG4gICAgfSBlbHNlIGlmICh0aGlzLnZhcmlhbnQgPT09ICdsaW5rLWdyYXknKSB7XG4gICAgICBjbGFzc2VzLnB1c2goJ2J1dHRvbi1saW5rLWdyYXknKTtcbiAgICB9IGVsc2UgaWYgKHRoaXMudmFyaWFudCA9PT0gJ2xpbmsnKSB7XG4gICAgICBjbGFzc2VzLnB1c2goJ2J1dHRvbi1saW5rLWNvbG9yJyk7XG4gICAgfVxuICAgIFxuICAgIC8vIFNpemUgY2xhc3NcbiAgICBjbGFzc2VzLnB1c2goYGJ1dHRvbi0ke3RoaXMuc2l6ZX1gKTtcbiAgICBcbiAgICAvLyBUeXBvZ3JhcGh5IGNsYXNzZXMgYmFzZWQgb24gc2l6ZVxuICAgIGNsYXNzZXMucHVzaCgndGV4dCcpO1xuICAgIGlmICh0aGlzLnNpemUgPT09ICcyeGwnKSB7XG4gICAgICBjbGFzc2VzLnB1c2goJ3RleHQtbGcnKTtcbiAgICAgIGNsYXNzZXMucHVzaCgndGV4dC13ZWlnaHQtbWVkaXVtJyk7XG4gICAgfSBlbHNlIGlmICh0aGlzLnNpemUgPT09ICd4bCcgfHwgdGhpcy5zaXplID09PSAnbGcnKSB7XG4gICAgICBjbGFzc2VzLnB1c2goJ3RleHQtbWQnKTtcbiAgICAgIGNsYXNzZXMucHVzaCgndGV4dC13ZWlnaHQtbWVkaXVtJyk7XG4gICAgfSBlbHNlIHtcbiAgICAgIGNsYXNzZXMucHVzaCgndGV4dC1zbScpO1xuICAgICAgY2xhc3Nlcy5wdXNoKCd0ZXh0LXdlaWdodC1tZWRpdW0nKTtcbiAgICB9XG4gICAgXG4gICAgLy8gU3RhdGUgbW9kaWZpZXJzXG4gICAgaWYgKHRoaXMuZGVzdHJ1Y3RpdmUpIHtcbiAgICAgIGNsYXNzZXMucHVzaCgnZGVzdHJ1Y3RpdmUnKTtcbiAgICB9XG4gICAgXG4gICAgaWYgKHRoaXMuaXNJY29uT25seSkge1xuICAgICAgY2xhc3Nlcy5wdXNoKCdidXR0b24taWNvbi1vbmx5Jyk7XG4gICAgfVxuICAgIFxuICAgIGlmICh0aGlzLmZ1bGxXaWR0aCkge1xuICAgICAgY2xhc3Nlcy5wdXNoKCdmdWxsLXdpZHRoJyk7XG4gICAgfVxuICAgIFxuICAgIHJldHVybiBjbGFzc2VzLmpvaW4oJyAnKTtcbiAgfVxuXG4gIGdldEljb25OYW1lKCk6IHN0cmluZyB7XG4gICAgLy8gVXNlIHRoZSBpY29uIGlucHV0IGlmIHByb3ZpZGVkLCBvdGhlcndpc2UgZGVmYXVsdCB0byBjaXJjbGVcbiAgICByZXR1cm4gdGhpcy5pY29uIHx8ICdjaXJjbGUnO1xuICB9XG59IiwiPGJ1dHRvbiBcbiAgW2NsYXNzXT1cImJ1dHRvbkNsYXNzZXNcIlxuICBbdHlwZV09XCJ0eXBlXCJcbiAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCI+XG4gIFxuICA8IS0tIERvdCBpbmRpY2F0b3IgLS0+XG4gIDxzcGFuICpuZ0lmPVwiYnV0dG9uVHlwZSA9PT0gJ2J1dHRvbi1kb3QnXCIgY2xhc3M9XCJidXR0b24tZG90XCI+PC9zcGFuPlxuICBcbiAgPCEtLSBMZWFkaW5nIGljb24gLS0+XG4gIDx6ZW4taWNvbiAqbmdJZj1cImJ1dHRvblR5cGUgPT09ICdidXR0b24taWNvbi1sZWFkaW5nJyB8fCBpc0ljb25Pbmx5XCIgXG4gICAgICAgICAgICBbbmFtZV09XCJnZXRJY29uTmFtZSgpXCJcbiAgICAgICAgICAgIHNpemU9XCJ4c1wiPjwvemVuLWljb24+XG4gIFxuICA8IS0tIEJ1dHRvbiBjb250ZW50IC0tPlxuICA8bmctY29udGVudCAqbmdJZj1cIiFpc0ljb25Pbmx5XCI+PC9uZy1jb250ZW50PlxuICBcbiAgPCEtLSBUcmFpbGluZyBpY29uIC0tPlxuICA8emVuLWljb24gKm5nSWY9XCJidXR0b25UeXBlID09PSAnYnV0dG9uLWljb24tdHJhaWxpbmcnXCIgXG4gICAgICAgICAgICBbbmFtZV09XCJnZXRJY29uTmFtZSgpXCJcbiAgICAgICAgICAgIHNpemU9XCJ4c1wiPjwvemVuLWljb24+XG48L2J1dHRvbj4iXX0=
package/esm2020/lib/card-block/zendu-card-block.component.mjs CHANGED
@@ -5,7 +5,7 @@ import * as i2 from "../icon/zendu-icon.component";
5
5
  export class ZenduCardBlockComponent {
6
6
  }
7
7
  ZenduCardBlockComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduCardBlockComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
8
- ZenduCardBlockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduCardBlockComponent, selector: "zen-card-block", inputs: { icon: "icon", title: "title", text: "text", selected: "selected" }, ngImport: i0, template: "<div class=\"component\">\n <zen-icon *ngIf=\"icon\"\n [src]=\"icon\"></zen-icon>\n\n <div class=\"title\">\n {{title}}\n </div>\n <div class=\"text\">\n {{text}}\n </div>\n</div>\n", styles: [".component{border-radius:10px;border:2px solid transparent;background:var(--color-white-primary, #ffffff);box-shadow:0 0 20px 2px #f0f0f0;padding:16px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;width:100%}.component:hover{border:2px solid var(--color-grey-shade-7, #121212)}.component zen-icon{width:50px;height:50px}.component .title{width:167px;text-align:center;font-family:Roboto;font-size:32px;font-style:normal;font-weight:500}.component .text{color:var(--color-white-tint-6, #bebebe);text-align:center;margin-top:22px;font-size:16px;font-style:normal;font-weight:400;line-height:130%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ZenduIconComponent, selector: "zen-icon", inputs: ["src", "name", "size", "color", "theme"] }] });
8
+ ZenduCardBlockComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ZenduCardBlockComponent, selector: "zen-card-block", inputs: { icon: "icon", title: "title", text: "text", selected: "selected" }, ngImport: i0, template: "<div class=\"component\">\n <zen-icon *ngIf=\"icon\"\n [src]=\"icon\"></zen-icon>\n\n <div class=\"title\">\n {{title}}\n </div>\n <div class=\"text\">\n {{text}}\n </div>\n</div>\n", styles: [".component{border-radius:10px;border:2px solid transparent;background:var(--color-white-primary, #ffffff);box-shadow:0 0 20px 2px #f0f0f0;padding:16px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;width:100%}.component:hover{border:2px solid var(--color-grey-shade-7, #121212)}.component zen-icon{width:50px;height:50px}.component .title{width:167px;text-align:center;font-family:Roboto;font-size:32px;font-style:normal;font-weight:500}.component .text{color:var(--color-white-tint-6, #bebebe);text-align:center;margin-top:22px;font-size:16px;font-style:normal;font-weight:400;line-height:130%}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ZenduIconComponent, selector: "zen-icon", inputs: ["src", "name", "size", "color", "theme", "customColor"] }] });
9
9
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ZenduCardBlockComponent, decorators: [{
10
10
  type: Component,
11
11
  args: [{ selector: 'zen-card-block', template: "<div class=\"component\">\n <zen-icon *ngIf=\"icon\"\n [src]=\"icon\"></zen-icon>\n\n <div class=\"title\">\n {{title}}\n </div>\n <div class=\"text\">\n {{text}}\n </div>\n</div>\n", styles: [".component{border-radius:10px;border:2px solid transparent;background:var(--color-white-primary, #ffffff);box-shadow:0 0 20px 2px #f0f0f0;padding:16px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;width:100%}.component:hover{border:2px solid var(--color-grey-shade-7, #121212)}.component zen-icon{width:50px;height:50px}.component .title{width:167px;text-align:center;font-family:Roboto;font-size:32px;font-style:normal;font-weight:500}.component .text{color:var(--color-white-tint-6, #bebebe);text-align:center;margin-top:22px;font-size:16px;font-style:normal;font-weight:400;line-height:130%}\n"] }]