mis-crystal-design-system 18.1.13 → 18.1.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/action-list/action-list.component.mjs +2 -2
- package/esm2022/async-search-dropdown/async-dropdown.component.mjs +2 -2
- package/esm2022/button/button.component.mjs +2 -2
- package/esm2022/checkbox/checkbox.component.mjs +2 -2
- package/esm2022/chip/chip.component.mjs +2 -2
- package/esm2022/datepicker_v2/tz-dp-container/tz-dp-container.component.mjs +2 -2
- package/esm2022/daterangepicker_v2/tz-drp-container/tz-drp-container.component.mjs +2 -2
- package/esm2022/dropdown/dropdown.component.mjs +2 -2
- package/esm2022/dynamic-form/dynamic-form.component.mjs +2 -2
- package/esm2022/fab/fab.component.mjs +3 -3
- package/esm2022/filter/filter-panel/filter-panel.component.mjs +8 -4
- package/esm2022/input/mis-input.component.mjs +2 -2
- package/esm2022/loader/loader.component.mjs +2 -2
- package/esm2022/mobile-filter/mobile-filter.component.mjs +2 -2
- package/esm2022/multi-select-dropdown/multi-select-dropdown.component.mjs +2 -2
- package/esm2022/nested-multi-select-dropdown/nested-multi-select-dropdown.component.mjs +2 -2
- package/esm2022/phone-input/phone-input.component.mjs +2 -2
- package/esm2022/radio-button/radio-button.component.mjs +2 -2
- package/esm2022/ske-loader/ske-loader.component.mjs +2 -2
- package/esm2022/specificdatepicker/tz-sdp-container/tz-sdp-container.component.mjs +2 -2
- package/esm2022/star-rating/star-rating.component.mjs +2 -2
- package/esm2022/switch/switch.component.mjs +2 -2
- package/esm2022/table/table.component.mjs +46 -27
- package/esm2022/timepicker/timepicker.component.mjs +2 -2
- package/esm2022/toast/toast.component.mjs +3 -3
- package/esm2022/tooltip/tooltip-container/tooltip.component.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-action-list.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-action-list.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-async-search-dropdown.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-async-search-dropdown.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-button.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-button.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-checkbox.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-checkbox.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-chip.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-chip.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-datepicker_v2.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-datepicker_v2.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-daterangepicker_v2.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-daterangepicker_v2.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-dropdown.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-dropdown.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-dynamic-form.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-dynamic-form.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-fab.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-fab.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-filter.mjs +7 -3
- package/fesm2022/mis-crystal-design-system-filter.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-input.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-input.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-loader.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-loader.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-mobile-filter.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-mobile-filter.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-multi-select-dropdown.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-multi-select-dropdown.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-nested-multi-select-dropdown.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-nested-multi-select-dropdown.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-phone-input.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-phone-input.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-radio-button.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-radio-button.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-ske-loader.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-ske-loader.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-specificdatepicker.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-specificdatepicker.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-star-rating.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-star-rating.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-switch.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-switch.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-table.mjs +45 -26
- package/fesm2022/mis-crystal-design-system-table.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-timepicker.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-timepicker.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-toast.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-toast.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-tooltip.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-tooltip.mjs.map +1 -1
- package/filter/filter-panel/filter-panel.component.d.ts +3 -1
- package/package.json +7 -7
- package/styles/mis-color-constants.scss +4 -0
- package/table/table.component.d.ts +2 -0
|
@@ -469,11 +469,11 @@ export class DropdownComponent {
|
|
|
469
469
|
i0.ɵɵproperty("ngIf", !ctx.showOnlyIcon())("ngIfElse", showIcon_r9);
|
|
470
470
|
i0.ɵɵadvance(3);
|
|
471
471
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(14, _c6, ctx.isOpen() ? "rotate(180deg)" : "rotate(0deg)"));
|
|
472
|
-
} }, dependencies: [i2.NgClass, i2.NgIf, i2.NgTemplateOutlet, i2.NgStyle, i3.DefaultValueAccessor, i3.NgControlStatus, i3.NgModel, i4.CdkFixedSizeVirtualScroll, i4.CdkVirtualForOf, i4.CdkVirtualScrollViewport, i5.LoaderComponent, i6.CdkTrapFocus], styles: ["[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.main-container[_ngcontent-%COMP%]{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;height:32px;width:256px;font-family:Lato,sans-serif!important}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;height:inherit;border:1px solid var(--border-primary, #E0E0E0);border-radius:6px;background-color:var(--bg-primary, #FFFFFF);cursor:pointer;display:flex;gap:4px;align-items:center;width:100%;box-sizing:border-box;padding:0 12px}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%]:hover, .main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%]:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%] .label[_ngcontent-%COMP%]{box-sizing:border-box;display:flex;justify-content:flex-start;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] .text[_ngcontent-%COMP%]{margin:0!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] .count[_ngcontent-%COMP%]{background-color:var(--border-primary, #E0E0E0);border-radius:50%;padding:2px 7px;margin:0}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%] .handle[_ngcontent-%COMP%]{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.main-container[_ngcontent-%COMP%] .dropdown-port[_ngcontent-%COMP%]{background:var(--brand-primary-active, #DAE1F3)}.popup-container[_ngcontent-%COMP%]{width:100%;max-height:340px;padding-bottom:0;border:1px solid var(--border-primary, #E0E0E0);border-radius:8px;background-color:var(--bg-primary, #FFFFFF);box-shadow:0 12px 24px #0000001f;display:flex;flex-direction:column;overflow:hidden;justify-content:space-between}.popup-container[_ngcontent-%COMP%]::-webkit-scrollbar{width:0;height:0}.popup-container[_ngcontent-%COMP%] .search-container[_ngcontent-%COMP%]{position:relative;box-sizing:border-box;padding:8px}.popup-container[_ngcontent-%COMP%] .search-container[_ngcontent-%COMP%] .search-icon[_ngcontent-%COMP%]{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.popup-container[_ngcontent-%COMP%] .search-container[_ngcontent-%COMP%] .search-input[_ngcontent-%COMP%]{height:40px;width:100%;padding:12px;border:1px solid var(--border-primary, #E0E0E0);box-sizing:border-box;border-radius:8px;outline:none;caret-color:var(--brand-primary, #0937B2);font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container[_ngcontent-%COMP%] .search-container[_ngcontent-%COMP%] .cancel-icon[_ngcontent-%COMP%]{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%]{padding:0 0 8px 8px;overflow-y:auto}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%]::-webkit-scrollbar{width:5px;height:0}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:10px}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .noData[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;height:44px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%]{height:100%}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%]{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;gap:10px;padding:4px 12px;border-radius:6px;min-height:40px;height:auto;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%]:hover, .popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%]:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .label[_ngcontent-%COMP%]{width:100%;line-height:20px;font-size:14px;font-style:normal;font-weight:400}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] .primaryText[_ngcontent-%COMP%]{color:var(--text-primary, #181F33);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] .secondaryText[_ngcontent-%COMP%]{color:var(--text-secondary, #6A737D);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .icon-container[_ngcontent-%COMP%]{width:10%;display:flex;justify-content:flex-end}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .icon-container[_ngcontent-%COMP%] .icon[_ngcontent-%COMP%]{width:20px;height:20px}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-disabled[_ngcontent-%COMP%]{cursor:not-allowed!important}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-disabled[_ngcontent-%COMP%]:hover, .popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-disabled[_ngcontent-%COMP%]:focus-visible{background-color:transparent!important;outline:none!important}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-disabled[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:var(--text-tertiary, #929DAB)!important;-webkit-user-select:none!important;user-select:none!important}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-selected[_ngcontent-%COMP%]{background-color:var(--brand-primary-active, #DAE1F3);outline:none}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .icon-only[_ngcontent-%COMP%]{justify-content:center!important}[_ngcontent-%COMP%]::-webkit-scrollbar{height:8px;width:8px;background:var(--bg-primary, #FFFFFF);border-radius:13px}[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--text-disabled, #C8CDD3);border-radius:13px;cursor:pointer}.status-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;height:128px}.status-container[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{text-align:center}"] }); }
|
|
472
|
+
} }, dependencies: [i2.NgClass, i2.NgIf, i2.NgTemplateOutlet, i2.NgStyle, i3.DefaultValueAccessor, i3.NgControlStatus, i3.NgModel, i4.CdkFixedSizeVirtualScroll, i4.CdkVirtualForOf, i4.CdkVirtualScrollViewport, i5.LoaderComponent, i6.CdkTrapFocus], styles: ["[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-muted-secondary: #E5E5E5;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.main-container[_ngcontent-%COMP%]{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;height:32px;width:256px;font-family:Lato,sans-serif!important}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;height:inherit;border:1px solid var(--border-primary, #E0E0E0);border-radius:6px;background-color:var(--bg-primary, #FFFFFF);cursor:pointer;display:flex;gap:4px;align-items:center;width:100%;box-sizing:border-box;padding:0 12px}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%]:hover, .main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%]:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%] .label[_ngcontent-%COMP%]{box-sizing:border-box;display:flex;justify-content:flex-start;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] .text[_ngcontent-%COMP%]{margin:0!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] .count[_ngcontent-%COMP%]{background-color:var(--border-primary, #E0E0E0);border-radius:50%;padding:2px 7px;margin:0}.main-container[_ngcontent-%COMP%] .dropdown[_ngcontent-%COMP%] .handle[_ngcontent-%COMP%]{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.main-container[_ngcontent-%COMP%] .dropdown-port[_ngcontent-%COMP%]{background:var(--brand-primary-active, #DAE1F3)}.popup-container[_ngcontent-%COMP%]{width:100%;max-height:340px;padding-bottom:0;border:1px solid var(--border-primary, #E0E0E0);border-radius:8px;background-color:var(--bg-primary, #FFFFFF);box-shadow:0 12px 24px #0000001f;display:flex;flex-direction:column;overflow:hidden;justify-content:space-between}.popup-container[_ngcontent-%COMP%]::-webkit-scrollbar{width:0;height:0}.popup-container[_ngcontent-%COMP%] .search-container[_ngcontent-%COMP%]{position:relative;box-sizing:border-box;padding:8px}.popup-container[_ngcontent-%COMP%] .search-container[_ngcontent-%COMP%] .search-icon[_ngcontent-%COMP%]{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.popup-container[_ngcontent-%COMP%] .search-container[_ngcontent-%COMP%] .search-input[_ngcontent-%COMP%]{height:40px;width:100%;padding:12px;border:1px solid var(--border-primary, #E0E0E0);box-sizing:border-box;border-radius:8px;outline:none;caret-color:var(--brand-primary, #0937B2);font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container[_ngcontent-%COMP%] .search-container[_ngcontent-%COMP%] .cancel-icon[_ngcontent-%COMP%]{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%]{padding:0 0 8px 8px;overflow-y:auto}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%]::-webkit-scrollbar{width:5px;height:0}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:10px}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .noData[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;height:44px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%]{height:100%}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%]{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;gap:10px;padding:4px 12px;border-radius:6px;min-height:40px;height:auto;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%]:hover, .popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%]:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .label[_ngcontent-%COMP%]{width:100%;line-height:20px;font-size:14px;font-style:normal;font-weight:400}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] .primaryText[_ngcontent-%COMP%]{color:var(--text-primary, #181F33);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] .secondaryText[_ngcontent-%COMP%]{color:var(--text-secondary, #6A737D);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .icon-container[_ngcontent-%COMP%]{width:10%;display:flex;justify-content:flex-end}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .dropdown-viewport[_ngcontent-%COMP%] .item[_ngcontent-%COMP%] .icon-container[_ngcontent-%COMP%] .icon[_ngcontent-%COMP%]{width:20px;height:20px}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-disabled[_ngcontent-%COMP%]{cursor:not-allowed!important}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-disabled[_ngcontent-%COMP%]:hover, .popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-disabled[_ngcontent-%COMP%]:focus-visible{background-color:transparent!important;outline:none!important}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-disabled[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:var(--text-tertiary, #929DAB)!important;-webkit-user-select:none!important;user-select:none!important}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .item-selected[_ngcontent-%COMP%]{background-color:var(--brand-primary-active, #DAE1F3);outline:none}.popup-container[_ngcontent-%COMP%] .items[_ngcontent-%COMP%] .icon-only[_ngcontent-%COMP%]{justify-content:center!important}[_ngcontent-%COMP%]::-webkit-scrollbar{height:8px;width:8px;background:var(--bg-primary, #FFFFFF);border-radius:13px}[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--text-disabled, #C8CDD3);border-radius:13px;cursor:pointer}.status-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;height:128px}.status-container[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{text-align:center}"] }); }
|
|
473
473
|
}
|
|
474
474
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DropdownComponent, [{
|
|
475
475
|
type: Component,
|
|
476
|
-
args: [{ selector: "mis-dropdown", template: "<div (click)=\"setUpAsyncDataSearch()\"\n(keyup.enter)=\"setUpAsyncDataSearch()\"\n class=\"main-container\"\n [ngStyle]=\"{\n height: height().length > 0 ? height() : '',\n width: width().length > 0 ? width() : ''\n }\"\n>\n <div\n class=\"dropdown\"\n #select\n tabindex=\"0\"\n (keyup.enter)=\"toggleDropdown()\"\n (click)=\"toggleDropdown()\"\n [ngStyle]=\"customStyles()\"\n [attr.aria-label]=\"ariaLabel()\"\n [ngClass]=\"isOpen() ? 'dropdown-port': ''\"\n >\n <img class=\"img-container\" [width]=\"16\" [height]=\"16\" [src]=\"selectedItem()?.customIcon\" *ngIf=\"selectedItem()?.customIcon\">\n <div class=\"label\" [ngStyle]=\"{width: selectedItem()?.customIcon ? 'calc(100% - 48px)' : 'calc(100% - 32px)'}\">\n <p class=\"text\" *ngIf=\"!showOnlyIcon(); else showIcon\">\n {{ multiLine() ? selectedItem()?.label?.primaryText : selectedItem()?.label || label() }}\n </p>\n <ng-template #showIcon>\n <p class=\"text\" *ngIf=\"!selectedItem()?.icon\">\n {{ label() }}\n </p>\n <img class=\"icon\" *ngIf=\"!!selectedItem()?.icon\" [src]=\"selectedItem()?.icon\" alt=\"no img\" />\n </ng-template>\n </div>\n <svg\n class=\"handle\"\n [ngStyle]=\"{ transform: isOpen() ? 'rotate(180deg)' : 'rotate(0deg)' }\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13.825 7.15845L10 10.9751L6.175 7.15845L5 8.33345L10 13.3334L15 8.33345L13.825 7.15845Z\"\n fill=\"#181F33\"\n />\n </svg>\n </div>\n</div>\n\n<ng-template #popupContainer>\n <div\n class=\"popup-container\" \n cdkTrapFocus \n [cdkTrapFocusAutoCapture]=\"true\" \n tabindex=\"0\"\n [ngStyle]=\"{\n height: dropdownListHeight(),\n width: dropdownListWidth()\n }\"\n (keyup.esc)=\"closeOnEsc($event)\"\n aria-label=\"dropdown\"\n >\n <div *ngIf=\"searchEnabled()\" class=\"search-container\">\n <svg\n *ngIf=\"!isSearchInputFocused()\"\n class=\"search-icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.21508 11.1456C4.21508 7.3179 7.33722 4.21165 11.1926 4.21165C15.048 4.21165 18.1702 7.3179 18.1702 11.1456C18.1702 12.6931 17.6599 14.1226 16.7972 15.2767L15.3685 16.7013C14.2044 17.5668 12.759 18.0796 11.1926 18.0796C7.33722 18.0796 4.21508 14.9734 4.21508 11.1456ZM15.9421 17.7835C14.6021 18.7329 12.9627 19.2913 11.1926 19.2913C6.66977 19.2913 3 15.6461 3 11.1456C3 6.64512 6.66977 3 11.1926 3C15.7155 3 19.3852 6.64512 19.3852 11.1456C19.3852 12.9371 18.8037 14.5931 17.8184 15.9375L19.8361 17.4048C20.6705 17.912 21.7554 18.6543 20.2454 20.215C18.7353 21.7756 18.0099 20.6663 17.4991 19.8364L15.9421 17.7835Z\"\n fill=\"#6A737D\"\n />\n </svg>\n <input\n [ngModel]=\"searchInput()\"\n [ngStyle]=\"{\n paddingLeft: isSearchInputFocused() ? '12px' : '45px',\n border: isSearchInputFocused() ? '1px solid #0937B2' : '1px solid #e0e0e0',\n paddingRight: isSearchInputFocused() ? '45px' : '10px'\n }\"\n [tabIndex]=\"0\"\n (ngModelChange)=\"searchInputOnChange($event)\"\n [placeholder]=\"isSearchInputFocused() ? '' : searchLabel()\"\n (focus)=\"searchInputFocused(true)\"\n class=\"search-input\"\n [attr.aria-label]=\"searchLabel()\"\n />\n <svg\n *ngIf=\"isSearchInputFocused()\"\n class=\"cancel-icon\"\n (click)=\"searchInputCanceled($event)\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M8.87446 7.32144C8.44588 6.89285 7.751 6.89285 7.32242 7.32144C6.89383 7.75002 6.89383 8.4449 7.32242 8.87349L10.4488 11.9999L7.32357 15.1252C6.89498 15.5538 6.89498 16.2486 7.32357 16.6772C7.75215 17.1058 8.44703 17.1058 8.87561 16.6772L12.0009 13.552L15.1261 16.6772C15.5547 17.1058 16.2496 17.1058 16.6781 16.6772C17.1067 16.2486 17.1067 15.5537 16.6781 15.1251L13.5529 11.9999L16.6793 8.87354C17.1079 8.44496 17.1079 7.75008 16.6793 7.3215C16.2507 6.89291 15.5558 6.89291 15.1273 7.3215L12.0009 10.4479L8.87446 7.32144Z\"\n fill=\"#6A737D\"\n />\n </svg>\n </div>\n <div class=\"status-container\" *ngIf=\"loading()\">\n <mis-loader [mobileView]=\"true\"></mis-loader>\n </div>\n <div tabindex=\"-1\" *ngIf=\"!searchEnabled()\" cdkFocusInitial></div>\n <div class=\"items\" #itemsContainer [ngStyle]=\"itemsContainerStyle\" *ngIf=\"!loading()\">\n <cdk-virtual-scroll-viewport *ngIf=\"currentData.length > 0\" \n [itemSize]=\"itemSizeForCdk() || 36\" \n class=\"dropdown-viewport\"\n [minBufferPx]=\"200\"\n [maxBufferPx]=\"400\">\n <div\n class=\"item\"\n tabindex=\"0\"\n [ngClass]=\"{ \n 'item-disabled': item.disabled, \n 'item-selected': (higlightSelectedValue() && item.value === selectedItem()?.value), \n 'icon-only': showOnlyIcon() \n }\"\n (click)=\"item.disabled ? null : selectItem(item)\"\n (keyup.enter)=\"item.disabled ? null : selectItem(item)\"\n *cdkVirtualFor=\"let item of currentData; let i = index\"\n tabIndex=\"0\"\n >\n <ng-container *ngIf=\"customItem; else standardItem\">\n <ng-container\n [ngTemplateOutlet]=\"customItem\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardItem>\n <div class=\"label\" *ngIf=\"!showOnlyIcon()\" [ngStyle]=\"{ \n width: item.icon ? '90%' : '100%', \n 'display': multiLine() ? 'flex': 'inherit', \n 'flex-direction': multiLine() ? 'column': 'inherit' \n }\">\n <span class=\"primaryText\">\n {{ multiLine() ? item?.label?.primaryText : item?.label }}\n </span>\n <span class=\"secondaryText\" *ngIf=\"multiLine()\">\n {{ item?.label?.secondaryText ? item?.label?.secondaryText : additionalInfoMessage() }}\n </span>\n </div>\n <div class=\"icon-container\" *ngIf=\"item.icon\">\n <img class=\"icon\" [src]=\"item.icon\" alt=\"no img\" />\n </div>\n </ng-template>\n </div>\n </cdk-virtual-scroll-viewport>\n <div class=\"noData\" *ngIf=\"currentData.length === 0\">\n {{ searchInput() === \"\" ? noDataMessage() : \"No results\" }}\n </div>\n </div>\n </div>\n</ng-template>", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.main-container{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;height:32px;width:256px;font-family:Lato,sans-serif!important}.main-container .dropdown{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;height:inherit;border:1px solid var(--border-primary, #E0E0E0);border-radius:6px;background-color:var(--bg-primary, #FFFFFF);cursor:pointer;display:flex;gap:4px;align-items:center;width:100%;box-sizing:border-box;padding:0 12px}.main-container .dropdown:hover,.main-container .dropdown:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.main-container .dropdown .label{box-sizing:border-box;display:flex;justify-content:flex-start;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container .dropdown .label .text{margin:0!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container .dropdown .label .count{background-color:var(--border-primary, #E0E0E0);border-radius:50%;padding:2px 7px;margin:0}.main-container .dropdown .handle{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.main-container .dropdown-port{background:var(--brand-primary-active, #DAE1F3)}.popup-container{width:100%;max-height:340px;padding-bottom:0;border:1px solid var(--border-primary, #E0E0E0);border-radius:8px;background-color:var(--bg-primary, #FFFFFF);box-shadow:0 12px 24px #0000001f;display:flex;flex-direction:column;overflow:hidden;justify-content:space-between}.popup-container::-webkit-scrollbar{width:0;height:0}.popup-container .search-container{position:relative;box-sizing:border-box;padding:8px}.popup-container .search-container .search-icon{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.popup-container .search-container .search-input{height:40px;width:100%;padding:12px;border:1px solid var(--border-primary, #E0E0E0);box-sizing:border-box;border-radius:8px;outline:none;caret-color:var(--brand-primary, #0937B2);font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container .search-container .cancel-icon{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container .items{padding:0 0 8px 8px;overflow-y:auto}.popup-container .items::-webkit-scrollbar{width:5px;height:0}.popup-container .items::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:10px}.popup-container .items .noData{display:flex;justify-content:center;align-items:center;height:44px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container .items .dropdown-viewport{height:100%}.popup-container .items .dropdown-viewport .item{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;gap:10px;padding:4px 12px;border-radius:6px;min-height:40px;height:auto;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container .items .dropdown-viewport .item:hover,.popup-container .items .dropdown-viewport .item:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.popup-container .items .dropdown-viewport .item .label{width:100%;line-height:20px;font-size:14px;font-style:normal;font-weight:400}.popup-container .items .dropdown-viewport .item .label .primaryText{color:var(--text-primary, #181F33);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container .items .dropdown-viewport .item .label .secondaryText{color:var(--text-secondary, #6A737D);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container .items .dropdown-viewport .item .icon-container{width:10%;display:flex;justify-content:flex-end}.popup-container .items .dropdown-viewport .item .icon-container .icon{width:20px;height:20px}.popup-container .items .item-disabled{cursor:not-allowed!important}.popup-container .items .item-disabled:hover,.popup-container .items .item-disabled:focus-visible{background-color:transparent!important;outline:none!important}.popup-container .items .item-disabled .label>span{color:var(--text-tertiary, #929DAB)!important;-webkit-user-select:none!important;user-select:none!important}.popup-container .items .item-selected{background-color:var(--brand-primary-active, #DAE1F3);outline:none}.popup-container .items .icon-only{justify-content:center!important}::-webkit-scrollbar{height:8px;width:8px;background:var(--bg-primary, #FFFFFF);border-radius:13px}::-webkit-scrollbar-thumb{background:var(--text-disabled, #C8CDD3);border-radius:13px;cursor:pointer}.status-container{display:flex;justify-content:center;align-items:center;height:128px}.status-container p{text-align:center}\n"] }]
|
|
476
|
+
args: [{ selector: "mis-dropdown", template: "<div (click)=\"setUpAsyncDataSearch()\"\n(keyup.enter)=\"setUpAsyncDataSearch()\"\n class=\"main-container\"\n [ngStyle]=\"{\n height: height().length > 0 ? height() : '',\n width: width().length > 0 ? width() : ''\n }\"\n>\n <div\n class=\"dropdown\"\n #select\n tabindex=\"0\"\n (keyup.enter)=\"toggleDropdown()\"\n (click)=\"toggleDropdown()\"\n [ngStyle]=\"customStyles()\"\n [attr.aria-label]=\"ariaLabel()\"\n [ngClass]=\"isOpen() ? 'dropdown-port': ''\"\n >\n <img class=\"img-container\" [width]=\"16\" [height]=\"16\" [src]=\"selectedItem()?.customIcon\" *ngIf=\"selectedItem()?.customIcon\">\n <div class=\"label\" [ngStyle]=\"{width: selectedItem()?.customIcon ? 'calc(100% - 48px)' : 'calc(100% - 32px)'}\">\n <p class=\"text\" *ngIf=\"!showOnlyIcon(); else showIcon\">\n {{ multiLine() ? selectedItem()?.label?.primaryText : selectedItem()?.label || label() }}\n </p>\n <ng-template #showIcon>\n <p class=\"text\" *ngIf=\"!selectedItem()?.icon\">\n {{ label() }}\n </p>\n <img class=\"icon\" *ngIf=\"!!selectedItem()?.icon\" [src]=\"selectedItem()?.icon\" alt=\"no img\" />\n </ng-template>\n </div>\n <svg\n class=\"handle\"\n [ngStyle]=\"{ transform: isOpen() ? 'rotate(180deg)' : 'rotate(0deg)' }\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13.825 7.15845L10 10.9751L6.175 7.15845L5 8.33345L10 13.3334L15 8.33345L13.825 7.15845Z\"\n fill=\"#181F33\"\n />\n </svg>\n </div>\n</div>\n\n<ng-template #popupContainer>\n <div\n class=\"popup-container\" \n cdkTrapFocus \n [cdkTrapFocusAutoCapture]=\"true\" \n tabindex=\"0\"\n [ngStyle]=\"{\n height: dropdownListHeight(),\n width: dropdownListWidth()\n }\"\n (keyup.esc)=\"closeOnEsc($event)\"\n aria-label=\"dropdown\"\n >\n <div *ngIf=\"searchEnabled()\" class=\"search-container\">\n <svg\n *ngIf=\"!isSearchInputFocused()\"\n class=\"search-icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M4.21508 11.1456C4.21508 7.3179 7.33722 4.21165 11.1926 4.21165C15.048 4.21165 18.1702 7.3179 18.1702 11.1456C18.1702 12.6931 17.6599 14.1226 16.7972 15.2767L15.3685 16.7013C14.2044 17.5668 12.759 18.0796 11.1926 18.0796C7.33722 18.0796 4.21508 14.9734 4.21508 11.1456ZM15.9421 17.7835C14.6021 18.7329 12.9627 19.2913 11.1926 19.2913C6.66977 19.2913 3 15.6461 3 11.1456C3 6.64512 6.66977 3 11.1926 3C15.7155 3 19.3852 6.64512 19.3852 11.1456C19.3852 12.9371 18.8037 14.5931 17.8184 15.9375L19.8361 17.4048C20.6705 17.912 21.7554 18.6543 20.2454 20.215C18.7353 21.7756 18.0099 20.6663 17.4991 19.8364L15.9421 17.7835Z\"\n fill=\"#6A737D\"\n />\n </svg>\n <input\n [ngModel]=\"searchInput()\"\n [ngStyle]=\"{\n paddingLeft: isSearchInputFocused() ? '12px' : '45px',\n border: isSearchInputFocused() ? '1px solid #0937B2' : '1px solid #e0e0e0',\n paddingRight: isSearchInputFocused() ? '45px' : '10px'\n }\"\n [tabIndex]=\"0\"\n (ngModelChange)=\"searchInputOnChange($event)\"\n [placeholder]=\"isSearchInputFocused() ? '' : searchLabel()\"\n (focus)=\"searchInputFocused(true)\"\n class=\"search-input\"\n [attr.aria-label]=\"searchLabel()\"\n />\n <svg\n *ngIf=\"isSearchInputFocused()\"\n class=\"cancel-icon\"\n (click)=\"searchInputCanceled($event)\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M8.87446 7.32144C8.44588 6.89285 7.751 6.89285 7.32242 7.32144C6.89383 7.75002 6.89383 8.4449 7.32242 8.87349L10.4488 11.9999L7.32357 15.1252C6.89498 15.5538 6.89498 16.2486 7.32357 16.6772C7.75215 17.1058 8.44703 17.1058 8.87561 16.6772L12.0009 13.552L15.1261 16.6772C15.5547 17.1058 16.2496 17.1058 16.6781 16.6772C17.1067 16.2486 17.1067 15.5537 16.6781 15.1251L13.5529 11.9999L16.6793 8.87354C17.1079 8.44496 17.1079 7.75008 16.6793 7.3215C16.2507 6.89291 15.5558 6.89291 15.1273 7.3215L12.0009 10.4479L8.87446 7.32144Z\"\n fill=\"#6A737D\"\n />\n </svg>\n </div>\n <div class=\"status-container\" *ngIf=\"loading()\">\n <mis-loader [mobileView]=\"true\"></mis-loader>\n </div>\n <div tabindex=\"-1\" *ngIf=\"!searchEnabled()\" cdkFocusInitial></div>\n <div class=\"items\" #itemsContainer [ngStyle]=\"itemsContainerStyle\" *ngIf=\"!loading()\">\n <cdk-virtual-scroll-viewport *ngIf=\"currentData.length > 0\" \n [itemSize]=\"itemSizeForCdk() || 36\" \n class=\"dropdown-viewport\"\n [minBufferPx]=\"200\"\n [maxBufferPx]=\"400\">\n <div\n class=\"item\"\n tabindex=\"0\"\n [ngClass]=\"{ \n 'item-disabled': item.disabled, \n 'item-selected': (higlightSelectedValue() && item.value === selectedItem()?.value), \n 'icon-only': showOnlyIcon() \n }\"\n (click)=\"item.disabled ? null : selectItem(item)\"\n (keyup.enter)=\"item.disabled ? null : selectItem(item)\"\n *cdkVirtualFor=\"let item of currentData; let i = index\"\n tabIndex=\"0\"\n >\n <ng-container *ngIf=\"customItem; else standardItem\">\n <ng-container\n [ngTemplateOutlet]=\"customItem\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n ></ng-container>\n </ng-container>\n <ng-template #standardItem>\n <div class=\"label\" *ngIf=\"!showOnlyIcon()\" [ngStyle]=\"{ \n width: item.icon ? '90%' : '100%', \n 'display': multiLine() ? 'flex': 'inherit', \n 'flex-direction': multiLine() ? 'column': 'inherit' \n }\">\n <span class=\"primaryText\">\n {{ multiLine() ? item?.label?.primaryText : item?.label }}\n </span>\n <span class=\"secondaryText\" *ngIf=\"multiLine()\">\n {{ item?.label?.secondaryText ? item?.label?.secondaryText : additionalInfoMessage() }}\n </span>\n </div>\n <div class=\"icon-container\" *ngIf=\"item.icon\">\n <img class=\"icon\" [src]=\"item.icon\" alt=\"no img\" />\n </div>\n </ng-template>\n </div>\n </cdk-virtual-scroll-viewport>\n <div class=\"noData\" *ngIf=\"currentData.length === 0\">\n {{ searchInput() === \"\" ? noDataMessage() : \"No results\" }}\n </div>\n </div>\n </div>\n</ng-template>", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-muted-secondary: #E5E5E5;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.main-container{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;height:32px;width:256px;font-family:Lato,sans-serif!important}.main-container .dropdown{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;height:inherit;border:1px solid var(--border-primary, #E0E0E0);border-radius:6px;background-color:var(--bg-primary, #FFFFFF);cursor:pointer;display:flex;gap:4px;align-items:center;width:100%;box-sizing:border-box;padding:0 12px}.main-container .dropdown:hover,.main-container .dropdown:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.main-container .dropdown .label{box-sizing:border-box;display:flex;justify-content:flex-start;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container .dropdown .label .text{margin:0!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container .dropdown .label .count{background-color:var(--border-primary, #E0E0E0);border-radius:50%;padding:2px 7px;margin:0}.main-container .dropdown .handle{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.main-container .dropdown-port{background:var(--brand-primary-active, #DAE1F3)}.popup-container{width:100%;max-height:340px;padding-bottom:0;border:1px solid var(--border-primary, #E0E0E0);border-radius:8px;background-color:var(--bg-primary, #FFFFFF);box-shadow:0 12px 24px #0000001f;display:flex;flex-direction:column;overflow:hidden;justify-content:space-between}.popup-container::-webkit-scrollbar{width:0;height:0}.popup-container .search-container{position:relative;box-sizing:border-box;padding:8px}.popup-container .search-container .search-icon{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.popup-container .search-container .search-input{height:40px;width:100%;padding:12px;border:1px solid var(--border-primary, #E0E0E0);box-sizing:border-box;border-radius:8px;outline:none;caret-color:var(--brand-primary, #0937B2);font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container .search-container .cancel-icon{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container .items{padding:0 0 8px 8px;overflow-y:auto}.popup-container .items::-webkit-scrollbar{width:5px;height:0}.popup-container .items::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:10px}.popup-container .items .noData{display:flex;justify-content:center;align-items:center;height:44px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container .items .dropdown-viewport{height:100%}.popup-container .items .dropdown-viewport .item{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;gap:10px;padding:4px 12px;border-radius:6px;min-height:40px;height:auto;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container .items .dropdown-viewport .item:hover,.popup-container .items .dropdown-viewport .item:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.popup-container .items .dropdown-viewport .item .label{width:100%;line-height:20px;font-size:14px;font-style:normal;font-weight:400}.popup-container .items .dropdown-viewport .item .label .primaryText{color:var(--text-primary, #181F33);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container .items .dropdown-viewport .item .label .secondaryText{color:var(--text-secondary, #6A737D);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container .items .dropdown-viewport .item .icon-container{width:10%;display:flex;justify-content:flex-end}.popup-container .items .dropdown-viewport .item .icon-container .icon{width:20px;height:20px}.popup-container .items .item-disabled{cursor:not-allowed!important}.popup-container .items .item-disabled:hover,.popup-container .items .item-disabled:focus-visible{background-color:transparent!important;outline:none!important}.popup-container .items .item-disabled .label>span{color:var(--text-tertiary, #929DAB)!important;-webkit-user-select:none!important;user-select:none!important}.popup-container .items .item-selected{background-color:var(--brand-primary-active, #DAE1F3);outline:none}.popup-container .items .icon-only{justify-content:center!important}::-webkit-scrollbar{height:8px;width:8px;background:var(--bg-primary, #FFFFFF);border-radius:13px}::-webkit-scrollbar-thumb{background:var(--text-disabled, #C8CDD3);border-radius:13px;cursor:pointer}.status-container{display:flex;justify-content:center;align-items:center;height:128px}.status-container p{text-align:center}\n"] }]
|
|
477
477
|
}], () => [{ type: i0.ElementRef }, { type: i1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }], { selectElement: [{
|
|
478
478
|
type: ViewChild,
|
|
479
479
|
args: ["select", { static: false }]
|
|
@@ -1061,11 +1061,11 @@ export class DynamicFormComponent {
|
|
|
1061
1061
|
i0.ɵɵproperty("formGroup", ctx.dynamicForm());
|
|
1062
1062
|
i0.ɵɵadvance(2);
|
|
1063
1063
|
i0.ɵɵproperty("ngForOf", ctx.getDynamicFieldsControls().controls);
|
|
1064
|
-
} }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle, i2.ɵNgNoValidate, i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgControlStatusGroup, i2.FormControlDirective, i2.FormGroupDirective, i2.FormGroupName, i2.FormArrayName, i3.DropdownComponent, i4.SwitchComponent, i5.MultiSelectDropdownComponent, i6.TzDatepickerDirective, i1.KeyValuePipe], styles: ["[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}p[_ngcontent-%COMP%]{margin:0;cursor:default} .main-container{margin:0;max-width:100%}.sub-dynamic-form[_ngcontent-%COMP%]{padding-left:24px;border-bottom:1px solid var(--border-primary, #E0E0E0)}.dynamic-field[_ngcontent-%COMP%] .container{height:32px!important}.single-line-field-container[_ngcontent-%COMP%]{display:flex;justify-content:space-between;align-items:center;padding:28px 16px;border-bottom:1px solid var(--border-primary, #E0E0E0)}.multi-line-field-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;align-items:flex-start;padding:28px 16px;flex-wrap:wrap;border-bottom:1px solid var(--border-primary, #E0E0E0)}.field-title-sm[_ngcontent-%COMP%]{margin-bottom:8px;cursor:default}.input-field[_ngcontent-%COMP%]{width:100%;background-color:var(--bg-secondary, #FAFAFA);border:1px solid var(--border-primary, #E0E0E0);border-radius:6px}.ip-text[_ngcontent-%COMP%]{height:44px;padding:8px 12px}.ip-textarea[_ngcontent-%COMP%]{max-height:94px;padding:8px}input[_ngcontent-%COMP%]:focus{outline:none}input[_ngcontent-%COMP%]::placeholder{color:var(--border-primary, #E0E0E0)}textarea[_ngcontent-%COMP%]:focus{outline:none}.date-picker-container[_ngcontent-%COMP%]{position:relative;width:140px}.date-picker-container[_ngcontent-%COMP%] .date-picker[_ngcontent-%COMP%]{cursor:pointer;height:32px;width:100%;font-size:14px;border-radius:6px;padding:0 12px;border:1px solid var(--border-primary, #E0E0E0);inset:10px auto auto 80px;background-color:var(--bg-primary, #FFFFFF)}.date-picker-container[_ngcontent-%COMP%] .date-picker[_ngcontent-%COMP%]:hover{background-color:var(--brand-primary-hover, #F0F3FA)}.date-picker-container[_ngcontent-%COMP%] .date-picker-icon[_ngcontent-%COMP%]{position:absolute;top:50%;right:12px;transform:translateY(-50%);cursor:pointer}form[_ngcontent-%COMP%] .dynamic-field[_ngcontent-%COMP%]:last-child{border-bottom:none!important}#checkboxes-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.radio-checkbox-common[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:8px;margin-bottom:8px;background-color:var(--bg-primary, #FFFFFF);padding:12px 16px;border:1px solid var(--text-secondary, #6A737D);border-radius:8px}.radio-checkbox-common[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{color:var(--text-secondary, #6A737D);cursor:pointer}.radio-checkbox-common[_ngcontent-%COMP%] img[_ngcontent-%COMP%]{margin-right:8px}.checkbox-active[_ngcontent-%COMP%]{background-color:var(--brand-primary, #0937B2)}.checkbox-active[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{color:var(--bg-primary, #FFFFFF)}#error-messages-container[_ngcontent-%COMP%]{margin-top:4px;width:100%;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}#error-messages-container[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{color:var(--brand-error, #B00020)}.removeable-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center}.removeable-container[_ngcontent-%COMP%] .remove-icon[_ngcontent-%COMP%]{cursor:pointer;margin-left:8px;max-width:24px}span[_ngcontent-%COMP%]{color:var(--brand-error, #B00020)}"] }); }
|
|
1064
|
+
} }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle, i2.ɵNgNoValidate, i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgControlStatusGroup, i2.FormControlDirective, i2.FormGroupDirective, i2.FormGroupName, i2.FormArrayName, i3.DropdownComponent, i4.SwitchComponent, i5.MultiSelectDropdownComponent, i6.TzDatepickerDirective, i1.KeyValuePipe], styles: ["[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-muted-secondary: #E5E5E5;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}p[_ngcontent-%COMP%]{margin:0;cursor:default} .main-container{margin:0;max-width:100%}.sub-dynamic-form[_ngcontent-%COMP%]{padding-left:24px;border-bottom:1px solid var(--border-primary, #E0E0E0)}.dynamic-field[_ngcontent-%COMP%] .container{height:32px!important}.single-line-field-container[_ngcontent-%COMP%]{display:flex;justify-content:space-between;align-items:center;padding:28px 16px;border-bottom:1px solid var(--border-primary, #E0E0E0)}.multi-line-field-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;align-items:flex-start;padding:28px 16px;flex-wrap:wrap;border-bottom:1px solid var(--border-primary, #E0E0E0)}.field-title-sm[_ngcontent-%COMP%]{margin-bottom:8px;cursor:default}.input-field[_ngcontent-%COMP%]{width:100%;background-color:var(--bg-secondary, #FAFAFA);border:1px solid var(--border-primary, #E0E0E0);border-radius:6px}.ip-text[_ngcontent-%COMP%]{height:44px;padding:8px 12px}.ip-textarea[_ngcontent-%COMP%]{max-height:94px;padding:8px}input[_ngcontent-%COMP%]:focus{outline:none}input[_ngcontent-%COMP%]::placeholder{color:var(--border-primary, #E0E0E0)}textarea[_ngcontent-%COMP%]:focus{outline:none}.date-picker-container[_ngcontent-%COMP%]{position:relative;width:140px}.date-picker-container[_ngcontent-%COMP%] .date-picker[_ngcontent-%COMP%]{cursor:pointer;height:32px;width:100%;font-size:14px;border-radius:6px;padding:0 12px;border:1px solid var(--border-primary, #E0E0E0);inset:10px auto auto 80px;background-color:var(--bg-primary, #FFFFFF)}.date-picker-container[_ngcontent-%COMP%] .date-picker[_ngcontent-%COMP%]:hover{background-color:var(--brand-primary-hover, #F0F3FA)}.date-picker-container[_ngcontent-%COMP%] .date-picker-icon[_ngcontent-%COMP%]{position:absolute;top:50%;right:12px;transform:translateY(-50%);cursor:pointer}form[_ngcontent-%COMP%] .dynamic-field[_ngcontent-%COMP%]:last-child{border-bottom:none!important}#checkboxes-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.radio-checkbox-common[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:8px;margin-bottom:8px;background-color:var(--bg-primary, #FFFFFF);padding:12px 16px;border:1px solid var(--text-secondary, #6A737D);border-radius:8px}.radio-checkbox-common[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{color:var(--text-secondary, #6A737D);cursor:pointer}.radio-checkbox-common[_ngcontent-%COMP%] img[_ngcontent-%COMP%]{margin-right:8px}.checkbox-active[_ngcontent-%COMP%]{background-color:var(--brand-primary, #0937B2)}.checkbox-active[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{color:var(--bg-primary, #FFFFFF)}#error-messages-container[_ngcontent-%COMP%]{margin-top:4px;width:100%;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}#error-messages-container[_ngcontent-%COMP%] p[_ngcontent-%COMP%]{color:var(--brand-error, #B00020)}.removeable-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center}.removeable-container[_ngcontent-%COMP%] .remove-icon[_ngcontent-%COMP%]{cursor:pointer;margin-left:8px;max-width:24px}span[_ngcontent-%COMP%]{color:var(--brand-error, #B00020)}"] }); }
|
|
1065
1065
|
}
|
|
1066
1066
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DynamicFormComponent, [{
|
|
1067
1067
|
type: Component,
|
|
1068
|
-
args: [{ selector: "mis-dynamic-form", template: "<form [formGroup]=\"dynamicForm()\">\n <ng-container formArrayName=\"dynamicFields\">\n <ng-container [formGroupName]=\"i\" *ngFor=\"let fieldControl of getDynamicFieldsControls().controls; let i = index\">\n <ng-container\n [ngTemplateOutlet]=\"dynamicField\"\n [ngTemplateOutletContext]=\"{\n $implicit: formFieldsArray?.[i],\n formGroup: fieldControl,\n control: fieldControl.controls.value\n }\"\n >\n </ng-container>\n <div class=\"sub-dynamic-form\" *ngIf=\"fieldControl?.value && (!!formFieldsArray?.[i]?.subFields && formFieldsArray?.[i]?.subFields?.length > 0 && matchParentConfig(formFieldsArray?.[i]?.subFields, fieldControl?.controls?.value?.value?.value))\">\n <ng-container *ngFor=\"let subFieldControl of fieldControl.controls.subFields.controls; let j = index\">\n <ng-container\n [ngTemplateOutlet]=\"dynamicField\"\n [ngTemplateOutletContext]=\"{\n $implicit: findSelectedSubFieldConfig(formFieldsArray?.[i]?.subFields, fieldControl.controls.value.value.value,j),\n control: subFieldControl\n }\">\n </ng-container>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n</form>\n\n\n<ng-template #dynamicField let-field let-control=\"control\" let-formgroup=\"formGroup\">\n\n <!-- fieldType: 'input' fieldInputType: 'text' | 'number' -->\n <ng-container *ngIf=\"field.fieldType === 'input' && (field.fieldInputType === 'text' || field.fieldInputType === 'number')\">\n <ng-container *ngIf=\"customInputTextNumber; else defaultInputTextNumber\">\n <ng-template\n [ngTemplateOutlet]=\"customInputTextNumber\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultInputTextNumber>\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h7 field-title-sm\">\n {{ field?.title }} <span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div style=\"flex-basis: 100%\"></div>\n <input class=\"input-field ip-text\" [type]=\"field.fieldInputType\" [formControl]=\"control\"\n (ngModelChange)=\"updateSubDynamicFields(field, formgroup, $event)\" \n [ngStyle]=\"{'border': control.touched && control.errors ? '1px solid #B00020': ''}\"\n [placeholder]=\"field.placeholderText ? field.placeholderText : 'Input Text'\" \n [min]=\"field.fieldInputType === 'number' ? 0 : '' \"/>\n <ng-container *ngIf=\"control.touched && control.errors\"\n [ngTemplateOutlet]=\"dynamicFieldErrors\" \n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\"\n >\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n \n <!-- fieldType: 'input' fieldInputType: 'textarea' -->\n <ng-container *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'textarea'\">\n <ng-container *ngIf=\"customInputTextarea; else defaultInputTextarea\">\n <ng-template\n [ngTemplateOutlet]=\"customInputTextarea\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultInputTextarea>\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div style=\"flex-basis: 100%\"></div>\n <textarea class=\"input-field ip-textarea\" type=\"text\"\n [ngStyle]=\"{'border': control.touched && control.errors ? '1px solid #B00020': ''}\"\n [placeholder]=\"field.placeholderText ? field.placeholderText : 'Input Text'\" [formControl]=\"control\" (ngModelChange)=\"updateSubDynamicFields(field, formgroup, $event)\"></textarea>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n \n <!-- fieldType: 'input' fieldInputType: 'date' -->\n <ng-container *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'date'\">\n <ng-container *ngIf=\"customInputDate; else defaultInputDate\">\n <ng-template\n [ngTemplateOutlet]=\"customInputDate\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultInputDate>\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'date'\">\n <p class=\"h6\">\n {{ field.title }} <span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div class=\"date-picker-container\">\n <input class=\"date-picker\" readonly misTzDp [dpConfig]=\"field.fieldConfig\"\n (dateChange)=\"control.setValue($event)\" [selectedDate]=\"control.value\" [offsetY]=\"0\"\n [value]=\"control.value\" #dp />\n <img alt=\"data-picker\" *ngIf=\"calendarIconUrl()\" class=\"date-picker-icon\" [src]=\"calendarIconUrl()\"\n (click)=\"dp.click()\" />\n </div>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n\n <!-- fieldType: 'boolean' fieldInputType: 'toggle' -->\n <ng-container *ngIf=\"field.fieldType === 'boolean' && field.fieldInputType === 'toggle'\">\n <ng-container *ngIf=\"customBooleanToggle; else defaultBooleanToggle\">\n <ng-template\n [ngTemplateOutlet]=\"customBooleanToggle\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultBooleanToggle>\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h6\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <mis-switch [control]=\"control\" (valueChanged)=\"updateSubDynamicFields(field, formgroup, $event)\"></mis-switch>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div> \n </ng-template>\n </ng-container>\n\n <!-- fieldType: 'singleSelect' fieldInputType: 'dropdown' -->\n <ng-container *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'dropdown'\">\n <ng-container *ngIf=\"customSingleSelectDropdown; else defaultSingleSelectDropdown\">\n <ng-template\n [ngTemplateOutlet]=\"customSingleSelectDropdown\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultSingleSelectDropdown>\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h6\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div [ngClass]=\"{'removeable-container' : field?.isRemoveable}\">\n <mis-dropdown [searchEnabled]=\"false\" [width]=\"'140px'\" [data]=\"field.itemsList\" [selectedItem]=\"control.value\"\n (onChange)=\"updateSelectedValueForSingleSelect(field, control, formgroup, $event);\">\n </mis-dropdown>\n <img *ngIf=\"field.isRemoveable && removeIconUrl()\" class=\"remove-icon\" [src]=\"removeIconUrl()\" (click)=\"fieldRemoved.emit(field)\">\n </div>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container >\n \n\n <!-- fieldType: 'singleSelect' fieldInputType: 'radio' -->\n <ng-container *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'radio'\">\n <ng-container *ngIf=\"customSingleSelectRadio; else defaultSingleSelectRadio\">\n <ng-template\n [ngTemplateOutlet]=\"customSingleSelectRadio\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultSingleSelectRadio>\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div style=\"flex-basis: 100%\"></div>\n <div id=\"checkboxes-container\">\n <div class=\"radio-checkbox-common\" *ngFor=\"let item of field.itemsList\"\n [ngClass]=\"{ 'checkbox-active': item.label === control.value?.label }\"\n (click)=\"updateSelectedValueForSingleSelect(field, control, formgroup, item);\">\n <img *ngIf=\"(item.label === control.value?.label) && activeBtnIconUrl()\" [src]=\"activeBtnIconUrl()\" alt=\"\" />\n <p class=\"h6\">{{ item.label }}</p>\n </div>\n </div>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n \n\n <!-- fieldType: 'multiSelect' fieldInputType: 'checkbox' -->\n <ng-container *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'checkbox'\">\n <ng-container *ngIf=\"customMultiSelectCheckbox; else defaultMultiSelectCheckbox\">\n <ng-template\n [ngTemplateOutlet]=\"customMultiSelectCheckbox\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultMultiSelectCheckbox>\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div style=\"flex-basis: 100%\"></div>\n <div id=\"checkboxes-container\">\n <div class=\"radio-checkbox-common\" *ngFor=\"let item of field.itemsList\"\n [ngClass]=\"{ 'checkbox-active': isCheckBoxSelected(item.label, control.value) }\"\n (click)=\"updateSelectedValueForMultiSelect(field, control, formgroup, [item])\">\n <img *ngIf=\"isCheckBoxSelected(item.label, control.value) && activeBtnIconUrl()\" [src]=\"activeBtnIconUrl()\"\n alt=\"\" />\n <p class=\"h6\">{{ item.label }}</p>\n </div>\n </div>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n\n\n <!-- fieldType: 'multiSelect' fieldInputType: 'dropdown' -->\n <ng-container *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'dropdown'\">\n <ng-container *ngIf=\"customMultiSelectDropdown; else defaultMultiSelectDropdown\">\n <ng-template\n [ngTemplateOutlet]=\"customMultiSelectDropdown\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultMultiSelectDropdown>\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h6\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <mis-multi-select-dropdown [width]=\"'140px'\" [showSelectedCount]=\"true\" [dropdownListWidth]=\"'256px'\"\n [searchEnabled]=\"false\" [hideApplyButton]=\"true\" [data]=\"field.itemsList\"\n [selectedItems]=\"control.value\" (onChange)=\"updateSelectedValueForMultiSelect(field, control, formgroup, $event);\"></mis-multi-select-dropdown>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n\n</ng-template>\n\n<ng-template #dynamicFieldErrors let-errors>\n <div id=\"error-messages-container\">\n <ng-container *ngFor=\"let error of errors | keyvalue\">\n <p class=\"h8\">\n {{\" \u2022 \" + error.value}}\n </p>\n <div [ngStyle]=\"{ 'flex-basis': '100%', 'height': '0' }\"></div>\n </ng-container>\n </div>\n</ng-template>", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}p{margin:0;cursor:default}::ng-deep .main-container{margin:0;max-width:100%}.sub-dynamic-form{padding-left:24px;border-bottom:1px solid var(--border-primary, #E0E0E0)}.dynamic-field ::ng-deep .container{height:32px!important}.single-line-field-container{display:flex;justify-content:space-between;align-items:center;padding:28px 16px;border-bottom:1px solid var(--border-primary, #E0E0E0)}.multi-line-field-container{display:flex;justify-content:flex-start;align-items:flex-start;padding:28px 16px;flex-wrap:wrap;border-bottom:1px solid var(--border-primary, #E0E0E0)}.field-title-sm{margin-bottom:8px;cursor:default}.input-field{width:100%;background-color:var(--bg-secondary, #FAFAFA);border:1px solid var(--border-primary, #E0E0E0);border-radius:6px}.ip-text{height:44px;padding:8px 12px}.ip-textarea{max-height:94px;padding:8px}input:focus{outline:none}input::placeholder{color:var(--border-primary, #E0E0E0)}textarea:focus{outline:none}.date-picker-container{position:relative;width:140px}.date-picker-container .date-picker{cursor:pointer;height:32px;width:100%;font-size:14px;border-radius:6px;padding:0 12px;border:1px solid var(--border-primary, #E0E0E0);inset:10px auto auto 80px;background-color:var(--bg-primary, #FFFFFF)}.date-picker-container .date-picker:hover{background-color:var(--brand-primary-hover, #F0F3FA)}.date-picker-container .date-picker-icon{position:absolute;top:50%;right:12px;transform:translateY(-50%);cursor:pointer}form .dynamic-field:last-child{border-bottom:none!important}#checkboxes-container{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.radio-checkbox-common{display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:8px;margin-bottom:8px;background-color:var(--bg-primary, #FFFFFF);padding:12px 16px;border:1px solid var(--text-secondary, #6A737D);border-radius:8px}.radio-checkbox-common p{color:var(--text-secondary, #6A737D);cursor:pointer}.radio-checkbox-common img{margin-right:8px}.checkbox-active{background-color:var(--brand-primary, #0937B2)}.checkbox-active p{color:var(--bg-primary, #FFFFFF)}#error-messages-container{margin-top:4px;width:100%;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}#error-messages-container p{color:var(--brand-error, #B00020)}.removeable-container{display:flex;justify-content:center;align-items:center}.removeable-container .remove-icon{cursor:pointer;margin-left:8px;max-width:24px}span{color:var(--brand-error, #B00020)}\n"] }]
|
|
1068
|
+
args: [{ selector: "mis-dynamic-form", template: "<form [formGroup]=\"dynamicForm()\">\n <ng-container formArrayName=\"dynamicFields\">\n <ng-container [formGroupName]=\"i\" *ngFor=\"let fieldControl of getDynamicFieldsControls().controls; let i = index\">\n <ng-container\n [ngTemplateOutlet]=\"dynamicField\"\n [ngTemplateOutletContext]=\"{\n $implicit: formFieldsArray?.[i],\n formGroup: fieldControl,\n control: fieldControl.controls.value\n }\"\n >\n </ng-container>\n <div class=\"sub-dynamic-form\" *ngIf=\"fieldControl?.value && (!!formFieldsArray?.[i]?.subFields && formFieldsArray?.[i]?.subFields?.length > 0 && matchParentConfig(formFieldsArray?.[i]?.subFields, fieldControl?.controls?.value?.value?.value))\">\n <ng-container *ngFor=\"let subFieldControl of fieldControl.controls.subFields.controls; let j = index\">\n <ng-container\n [ngTemplateOutlet]=\"dynamicField\"\n [ngTemplateOutletContext]=\"{\n $implicit: findSelectedSubFieldConfig(formFieldsArray?.[i]?.subFields, fieldControl.controls.value.value.value,j),\n control: subFieldControl\n }\">\n </ng-container>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n</form>\n\n\n<ng-template #dynamicField let-field let-control=\"control\" let-formgroup=\"formGroup\">\n\n <!-- fieldType: 'input' fieldInputType: 'text' | 'number' -->\n <ng-container *ngIf=\"field.fieldType === 'input' && (field.fieldInputType === 'text' || field.fieldInputType === 'number')\">\n <ng-container *ngIf=\"customInputTextNumber; else defaultInputTextNumber\">\n <ng-template\n [ngTemplateOutlet]=\"customInputTextNumber\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultInputTextNumber>\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h7 field-title-sm\">\n {{ field?.title }} <span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div style=\"flex-basis: 100%\"></div>\n <input class=\"input-field ip-text\" [type]=\"field.fieldInputType\" [formControl]=\"control\"\n (ngModelChange)=\"updateSubDynamicFields(field, formgroup, $event)\" \n [ngStyle]=\"{'border': control.touched && control.errors ? '1px solid #B00020': ''}\"\n [placeholder]=\"field.placeholderText ? field.placeholderText : 'Input Text'\" \n [min]=\"field.fieldInputType === 'number' ? 0 : '' \"/>\n <ng-container *ngIf=\"control.touched && control.errors\"\n [ngTemplateOutlet]=\"dynamicFieldErrors\" \n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\"\n >\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n \n <!-- fieldType: 'input' fieldInputType: 'textarea' -->\n <ng-container *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'textarea'\">\n <ng-container *ngIf=\"customInputTextarea; else defaultInputTextarea\">\n <ng-template\n [ngTemplateOutlet]=\"customInputTextarea\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultInputTextarea>\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div style=\"flex-basis: 100%\"></div>\n <textarea class=\"input-field ip-textarea\" type=\"text\"\n [ngStyle]=\"{'border': control.touched && control.errors ? '1px solid #B00020': ''}\"\n [placeholder]=\"field.placeholderText ? field.placeholderText : 'Input Text'\" [formControl]=\"control\" (ngModelChange)=\"updateSubDynamicFields(field, formgroup, $event)\"></textarea>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n \n <!-- fieldType: 'input' fieldInputType: 'date' -->\n <ng-container *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'date'\">\n <ng-container *ngIf=\"customInputDate; else defaultInputDate\">\n <ng-template\n [ngTemplateOutlet]=\"customInputDate\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultInputDate>\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'date'\">\n <p class=\"h6\">\n {{ field.title }} <span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div class=\"date-picker-container\">\n <input class=\"date-picker\" readonly misTzDp [dpConfig]=\"field.fieldConfig\"\n (dateChange)=\"control.setValue($event)\" [selectedDate]=\"control.value\" [offsetY]=\"0\"\n [value]=\"control.value\" #dp />\n <img alt=\"data-picker\" *ngIf=\"calendarIconUrl()\" class=\"date-picker-icon\" [src]=\"calendarIconUrl()\"\n (click)=\"dp.click()\" />\n </div>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n\n <!-- fieldType: 'boolean' fieldInputType: 'toggle' -->\n <ng-container *ngIf=\"field.fieldType === 'boolean' && field.fieldInputType === 'toggle'\">\n <ng-container *ngIf=\"customBooleanToggle; else defaultBooleanToggle\">\n <ng-template\n [ngTemplateOutlet]=\"customBooleanToggle\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultBooleanToggle>\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h6\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <mis-switch [control]=\"control\" (valueChanged)=\"updateSubDynamicFields(field, formgroup, $event)\"></mis-switch>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div> \n </ng-template>\n </ng-container>\n\n <!-- fieldType: 'singleSelect' fieldInputType: 'dropdown' -->\n <ng-container *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'dropdown'\">\n <ng-container *ngIf=\"customSingleSelectDropdown; else defaultSingleSelectDropdown\">\n <ng-template\n [ngTemplateOutlet]=\"customSingleSelectDropdown\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultSingleSelectDropdown>\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h6\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div [ngClass]=\"{'removeable-container' : field?.isRemoveable}\">\n <mis-dropdown [searchEnabled]=\"false\" [width]=\"'140px'\" [data]=\"field.itemsList\" [selectedItem]=\"control.value\"\n (onChange)=\"updateSelectedValueForSingleSelect(field, control, formgroup, $event);\">\n </mis-dropdown>\n <img *ngIf=\"field.isRemoveable && removeIconUrl()\" class=\"remove-icon\" [src]=\"removeIconUrl()\" (click)=\"fieldRemoved.emit(field)\">\n </div>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container >\n \n\n <!-- fieldType: 'singleSelect' fieldInputType: 'radio' -->\n <ng-container *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'radio'\">\n <ng-container *ngIf=\"customSingleSelectRadio; else defaultSingleSelectRadio\">\n <ng-template\n [ngTemplateOutlet]=\"customSingleSelectRadio\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultSingleSelectRadio>\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div style=\"flex-basis: 100%\"></div>\n <div id=\"checkboxes-container\">\n <div class=\"radio-checkbox-common\" *ngFor=\"let item of field.itemsList\"\n [ngClass]=\"{ 'checkbox-active': item.label === control.value?.label }\"\n (click)=\"updateSelectedValueForSingleSelect(field, control, formgroup, item);\">\n <img *ngIf=\"(item.label === control.value?.label) && activeBtnIconUrl()\" [src]=\"activeBtnIconUrl()\" alt=\"\" />\n <p class=\"h6\">{{ item.label }}</p>\n </div>\n </div>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n \n\n <!-- fieldType: 'multiSelect' fieldInputType: 'checkbox' -->\n <ng-container *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'checkbox'\">\n <ng-container *ngIf=\"customMultiSelectCheckbox; else defaultMultiSelectCheckbox\">\n <ng-template\n [ngTemplateOutlet]=\"customMultiSelectCheckbox\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultMultiSelectCheckbox>\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <div style=\"flex-basis: 100%\"></div>\n <div id=\"checkboxes-container\">\n <div class=\"radio-checkbox-common\" *ngFor=\"let item of field.itemsList\"\n [ngClass]=\"{ 'checkbox-active': isCheckBoxSelected(item.label, control.value) }\"\n (click)=\"updateSelectedValueForMultiSelect(field, control, formgroup, [item])\">\n <img *ngIf=\"isCheckBoxSelected(item.label, control.value) && activeBtnIconUrl()\" [src]=\"activeBtnIconUrl()\"\n alt=\"\" />\n <p class=\"h6\">{{ item.label }}</p>\n </div>\n </div>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n\n\n <!-- fieldType: 'multiSelect' fieldInputType: 'dropdown' -->\n <ng-container *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'dropdown'\">\n <ng-container *ngIf=\"customMultiSelectDropdown; else defaultMultiSelectDropdown\">\n <ng-template\n [ngTemplateOutlet]=\"customMultiSelectDropdown\"\n [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n ></ng-template>\n </ng-container>\n <ng-template #defaultMultiSelectDropdown>\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\">\n <p class=\"h6\">\n {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n </p>\n <mis-multi-select-dropdown [width]=\"'140px'\" [showSelectedCount]=\"true\" [dropdownListWidth]=\"'256px'\"\n [searchEnabled]=\"false\" [hideApplyButton]=\"true\" [data]=\"field.itemsList\"\n [selectedItems]=\"control.value\" (onChange)=\"updateSelectedValueForMultiSelect(field, control, formgroup, $event);\"></mis-multi-select-dropdown>\n <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n\n</ng-template>\n\n<ng-template #dynamicFieldErrors let-errors>\n <div id=\"error-messages-container\">\n <ng-container *ngFor=\"let error of errors | keyvalue\">\n <p class=\"h8\">\n {{\" \u2022 \" + error.value}}\n </p>\n <div [ngStyle]=\"{ 'flex-basis': '100%', 'height': '0' }\"></div>\n </ng-container>\n </div>\n</ng-template>", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-muted-secondary: #E5E5E5;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}p{margin:0;cursor:default}::ng-deep .main-container{margin:0;max-width:100%}.sub-dynamic-form{padding-left:24px;border-bottom:1px solid var(--border-primary, #E0E0E0)}.dynamic-field ::ng-deep .container{height:32px!important}.single-line-field-container{display:flex;justify-content:space-between;align-items:center;padding:28px 16px;border-bottom:1px solid var(--border-primary, #E0E0E0)}.multi-line-field-container{display:flex;justify-content:flex-start;align-items:flex-start;padding:28px 16px;flex-wrap:wrap;border-bottom:1px solid var(--border-primary, #E0E0E0)}.field-title-sm{margin-bottom:8px;cursor:default}.input-field{width:100%;background-color:var(--bg-secondary, #FAFAFA);border:1px solid var(--border-primary, #E0E0E0);border-radius:6px}.ip-text{height:44px;padding:8px 12px}.ip-textarea{max-height:94px;padding:8px}input:focus{outline:none}input::placeholder{color:var(--border-primary, #E0E0E0)}textarea:focus{outline:none}.date-picker-container{position:relative;width:140px}.date-picker-container .date-picker{cursor:pointer;height:32px;width:100%;font-size:14px;border-radius:6px;padding:0 12px;border:1px solid var(--border-primary, #E0E0E0);inset:10px auto auto 80px;background-color:var(--bg-primary, #FFFFFF)}.date-picker-container .date-picker:hover{background-color:var(--brand-primary-hover, #F0F3FA)}.date-picker-container .date-picker-icon{position:absolute;top:50%;right:12px;transform:translateY(-50%);cursor:pointer}form .dynamic-field:last-child{border-bottom:none!important}#checkboxes-container{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.radio-checkbox-common{display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:8px;margin-bottom:8px;background-color:var(--bg-primary, #FFFFFF);padding:12px 16px;border:1px solid var(--text-secondary, #6A737D);border-radius:8px}.radio-checkbox-common p{color:var(--text-secondary, #6A737D);cursor:pointer}.radio-checkbox-common img{margin-right:8px}.checkbox-active{background-color:var(--brand-primary, #0937B2)}.checkbox-active p{color:var(--bg-primary, #FFFFFF)}#error-messages-container{margin-top:4px;width:100%;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}#error-messages-container p{color:var(--brand-error, #B00020)}.removeable-container{display:flex;justify-content:center;align-items:center}.removeable-container .remove-icon{cursor:pointer;margin-left:8px;max-width:24px}span{color:var(--brand-error, #B00020)}\n"] }]
|
|
1069
1069
|
}], () => [], { customInputTextNumber: [{
|
|
1070
1070
|
type: ContentChild,
|
|
1071
1071
|
args: ["customInputTextNumber", { static: false }]
|
|
@@ -100,7 +100,7 @@ export class FabComponent {
|
|
|
100
100
|
i0.ɵɵtemplate(0, FabComponent_div_0_Template, 5, 5, "div", 0);
|
|
101
101
|
} if (rf & 2) {
|
|
102
102
|
i0.ɵɵproperty("ngIf", ctx.show());
|
|
103
|
-
} }, dependencies: [i1.NgForOf, i1.NgIf, i1.NgStyle], styles: ["[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.fab-wrapper[_ngcontent-%COMP%]{position:fixed;right:24px;bottom:24px;z-index:1000}.fab-wrapper[_ngcontent-%COMP%] .fab-item[_ngcontent-%COMP%]{position:relative;padding:0 0 16px 8px}.fab-wrapper[_ngcontent-%COMP%] .fab-item[_ngcontent-%COMP%] .fab-tooltip[_ngcontent-%COMP%]{position:absolute;background-color:var(--text-primary, #181F33);border-radius:4px;color:var(--bg-primary, #FFFFFF);padding:8px;display:flex;justify-content:center;align-items:center;white-space:nowrap;right:100%;top:calc(50% - 8px);transform:translateY(-50%)}.fab-wrapper[_ngcontent-%COMP%] .fab-item[_ngcontent-%COMP%] .fab-button[_ngcontent-%COMP%]{width:40px;height:40px;cursor:pointer;border-radius:50%;display:flex;justify-content:center;align-items:center}.fab-wrapper[_ngcontent-%COMP%] .fab-container[_ngcontent-%COMP%]{border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;width:56px;height:56px}.add-img[_ngcontent-%COMP%]{height:24px;width:24px}"], data: { animation: [
|
|
103
|
+
} }, dependencies: [i1.NgForOf, i1.NgIf, i1.NgStyle], styles: ["[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-muted-secondary: #E5E5E5;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.fab-wrapper[_ngcontent-%COMP%]{position:fixed;right:24px;bottom:24px;z-index:1000}.fab-wrapper[_ngcontent-%COMP%] .fab-item[_ngcontent-%COMP%]{position:relative;padding:0 0 16px 8px}.fab-wrapper[_ngcontent-%COMP%] .fab-item[_ngcontent-%COMP%] .fab-tooltip[_ngcontent-%COMP%]{position:absolute;background-color:var(--text-primary, #181F33);border-radius:4px;color:var(--bg-primary, #FFFFFF);padding:8px;display:flex;justify-content:center;align-items:center;white-space:nowrap;right:100%;top:calc(50% - 8px);transform:translateY(-50%)}.fab-wrapper[_ngcontent-%COMP%] .fab-item[_ngcontent-%COMP%] .fab-button[_ngcontent-%COMP%]{width:40px;height:40px;cursor:pointer;border-radius:50%;display:flex;justify-content:center;align-items:center}.fab-wrapper[_ngcontent-%COMP%] .fab-container[_ngcontent-%COMP%]{border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;width:56px;height:56px}.add-img[_ngcontent-%COMP%]{height:24px;width:24px}"], data: { animation: [
|
|
104
104
|
trigger("slideUpFab", [
|
|
105
105
|
transition(":enter", [
|
|
106
106
|
style({ transform: "translateY(50px)", opacity: 0 }),
|
|
@@ -132,10 +132,10 @@ export class FabComponent {
|
|
|
132
132
|
transition("rotated => default", animate("300ms ease-out")),
|
|
133
133
|
transition("default => rotated", animate("200ms ease-in"))
|
|
134
134
|
])
|
|
135
|
-
], template: "<div class=\"fab-wrapper\" *ngIf=\"show()\">\n <div class=\"fab-items\" *ngIf=\"isOpen()\" @slideUpFab>\n <div class=\"fab-item\" *ngFor=\"let item of items().reverse(); let i = index\" (click)=\"clickItem(item)\">\n <div *ngIf=\"item.label\" class=\"fab-tooltip\">\n {{ item.label }}\n </div>\n <div\n class=\"fab-button\"\n [ngStyle]=\"{\n backgroundColor: item.backgroundColor || '#0937B2'\n }\"\n >\n <img [src]=\"item.icon\" class=\"add-img\" />\n </div>\n </div>\n </div>\n <div\n class=\"fab-container\"\n [ngStyle]=\"{\n backgroundColor: isOpen() ? computedOptions().backgroundColorOpened : computedOptions().backgroundColorClosed\n }\"\n (click)=\"toogleFab()\"\n >\n <svg\n [@rotateButton]=\"isOpen() ? 'rotated' : 'default'\"\n class=\"add-img\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13.1424 5.15607C13.1424 4.51759 12.6313 4 12.0009 4C11.3704 4 10.8594 4.51759 10.8594 5.15607V10.8421H5.14149C4.51106 10.8421 4 11.3597 4 11.9982C4 12.6367 4.51106 13.1543 5.14149 13.1543H10.8594V18.8439C10.8594 19.4824 11.3704 20 12.0009 20C12.6313 20 13.1424 19.4824 13.1424 18.8439V13.1543H18.8585C19.4889 13.1543 20 12.6367 20 11.9982C20 11.3597 19.4889 10.8421 18.8585 10.8421H13.1424V5.15607Z\"\n fill=\"white\"\n />\n </svg>\n </div>\n</div>\n", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.fab-wrapper{position:fixed;right:24px;bottom:24px;z-index:1000}.fab-wrapper .fab-item{position:relative;padding:0 0 16px 8px}.fab-wrapper .fab-item .fab-tooltip{position:absolute;background-color:var(--text-primary, #181F33);border-radius:4px;color:var(--bg-primary, #FFFFFF);padding:8px;display:flex;justify-content:center;align-items:center;white-space:nowrap;right:100%;top:calc(50% - 8px);transform:translateY(-50%)}.fab-wrapper .fab-item .fab-button{width:40px;height:40px;cursor:pointer;border-radius:50%;display:flex;justify-content:center;align-items:center}.fab-wrapper .fab-container{border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;width:56px;height:56px}.add-img{height:24px;width:24px}\n"] }]
|
|
135
|
+
], template: "<div class=\"fab-wrapper\" *ngIf=\"show()\">\n <div class=\"fab-items\" *ngIf=\"isOpen()\" @slideUpFab>\n <div class=\"fab-item\" *ngFor=\"let item of items().reverse(); let i = index\" (click)=\"clickItem(item)\">\n <div *ngIf=\"item.label\" class=\"fab-tooltip\">\n {{ item.label }}\n </div>\n <div\n class=\"fab-button\"\n [ngStyle]=\"{\n backgroundColor: item.backgroundColor || '#0937B2'\n }\"\n >\n <img [src]=\"item.icon\" class=\"add-img\" />\n </div>\n </div>\n </div>\n <div\n class=\"fab-container\"\n [ngStyle]=\"{\n backgroundColor: isOpen() ? computedOptions().backgroundColorOpened : computedOptions().backgroundColorClosed\n }\"\n (click)=\"toogleFab()\"\n >\n <svg\n [@rotateButton]=\"isOpen() ? 'rotated' : 'default'\"\n class=\"add-img\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13.1424 5.15607C13.1424 4.51759 12.6313 4 12.0009 4C11.3704 4 10.8594 4.51759 10.8594 5.15607V10.8421H5.14149C4.51106 10.8421 4 11.3597 4 11.9982C4 12.6367 4.51106 13.1543 5.14149 13.1543H10.8594V18.8439C10.8594 19.4824 11.3704 20 12.0009 20C12.6313 20 13.1424 19.4824 13.1424 18.8439V13.1543H18.8585C19.4889 13.1543 20 12.6367 20 11.9982C20 11.3597 19.4889 10.8421 18.8585 10.8421H13.1424V5.15607Z\"\n fill=\"white\"\n />\n </svg>\n </div>\n</div>\n", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-muted-secondary: #E5E5E5;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.fab-wrapper{position:fixed;right:24px;bottom:24px;z-index:1000}.fab-wrapper .fab-item{position:relative;padding:0 0 16px 8px}.fab-wrapper .fab-item .fab-tooltip{position:absolute;background-color:var(--text-primary, #181F33);border-radius:4px;color:var(--bg-primary, #FFFFFF);padding:8px;display:flex;justify-content:center;align-items:center;white-space:nowrap;right:100%;top:calc(50% - 8px);transform:translateY(-50%)}.fab-wrapper .fab-item .fab-button{width:40px;height:40px;cursor:pointer;border-radius:50%;display:flex;justify-content:center;align-items:center}.fab-wrapper .fab-container{border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;width:56px;height:56px}.add-img{height:24px;width:24px}\n"] }]
|
|
136
136
|
}], () => [{ type: i0.ElementRef }], { clickout: [{
|
|
137
137
|
type: HostListener,
|
|
138
138
|
args: ["document:click", ["$event"]]
|
|
139
139
|
}] }); })();
|
|
140
140
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FabComponent, { className: "FabComponent" }); })();
|
|
141
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
141
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmFiLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL21pcy1jb21wb25lbnRzL2ZhYi9mYWIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vcHJvamVjdHMvbWlzLWNvbXBvbmVudHMvZmFiL2ZhYi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjO0FBRWQsT0FBTyxFQUFFLFNBQVMsRUFBYyxZQUFZLEVBQXNDLEtBQUssRUFBRSxNQUFNLEVBQWtCLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqSixPQUFPLEVBQUUsT0FBTyxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7OztJQ0EzRSwrQkFBNEM7SUFDMUMsWUFDRjtJQUFBLGlCQUFNOzs7SUFESixjQUNGO0lBREUsOENBQ0Y7Ozs7SUFIRiw4QkFBc0c7SUFBMUIsNE1BQVMseUJBQWUsS0FBQztJQUNuRywrRUFBNEM7SUFHNUMsK0JBS0M7SUFDQywwQkFBeUM7SUFFN0MsQUFERSxpQkFBTSxFQUNGOzs7SUFYRSxjQUFnQjtJQUFoQixvQ0FBZ0I7SUFLcEIsY0FFRTtJQUZGLDBGQUVFO0lBRUcsY0FBaUI7SUFBakIsb0RBQWlCOzs7SUFYNUIsOEJBQW9EO0lBQ2xELHlFQUFzRztJQWF4RyxpQkFBTTs7O0lBZGtDLHVDQUFXO0lBQ1YsY0FBc0I7SUFBdEIsa0RBQXNCOzs7O0lBRmpFLDhCQUF3QztJQUN0QyxtRUFBb0Q7SUFlcEQsOEJBTUM7SUFEQyxxS0FBUyxrQkFBVyxLQUFDOztJQUVyQiw4QkFRQztJQUNDLDBCQUtFO0lBR1IsQUFERSxBQURFLGlCQUFNLEVBQ0YsRUFDRjs7O0lBdkNvQixjQUFjO0lBQWQsc0NBQWM7SUFpQnBDLGNBRUU7SUFGRix1S0FFRTtJQUlBLGNBQWtEO0lBQWxELHVFQUFrRDs7QURpQnhELE1BQU0sT0FBTyxZQUFZO0lBa0J2QixZQUFvQixJQUFnQjtRQUFoQixTQUFJLEdBQUosSUFBSSxDQUFZO1FBakJwQyxTQUFJLEdBQUcsS0FBSyxDQUFVLEtBQUssQ0FBQyxDQUFDO1FBQzdCLFlBQU8sR0FBRyxLQUFLLENBQWEsRUFBRSxDQUFDLENBQUM7UUFDaEMsVUFBSyxHQUFHLEtBQUssQ0FBVyxFQUFFLENBQUMsQ0FBQztRQUU1QixXQUFNLEdBQTRCLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUVoRCw0Q0FBNEM7UUFDNUMsb0JBQWUsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFO1lBQzlCLE1BQU0sY0FBYyxHQUFHLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztZQUN0QyxPQUFPO2dCQUNMLElBQUksRUFBRSxFQUFFO2dCQUNSLHFCQUFxQixFQUFFLFNBQVM7Z0JBQ2hDLHFCQUFxQixFQUFFLFNBQVM7Z0JBQ2hDLEdBQUcsY0FBYzthQUNsQixDQUFDO1FBQ0osQ0FBQyxDQUFDLENBQUM7SUFFb0MsQ0FBQztJQUd4QyxRQUFRLENBQUMsS0FBVTtRQUNqQixJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUMsRUFBRSxDQUFDO1lBQ3BELElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztRQUNsQixDQUFDO0lBQ0gsQ0FBQztJQUVELFdBQVcsS0FBVSxDQUFDO0lBRXRCLFNBQVMsQ0FBQyxJQUFhO1FBQ3JCLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztRQUNoQixJQUFJLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQztJQUNqQixDQUFDO0lBRUQsUUFBUTtRQUNOLElBQUksQ0FBQyxNQUFNLENBQUMsR0FBRyxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3pCLENBQUM7SUFFRCxTQUFTO1FBQ1AsSUFBSSxDQUFDLE1BQU0sQ0FBQyxHQUFHLENBQUMsQ0FBQyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUMsQ0FBQztJQUNsQyxDQUFDOzZHQXhDVSxZQUFZO29FQUFaLFlBQVk7WUFBWix1RkFBQSxvQkFBZ0IsaUNBQUo7O1lDekN6Qiw2REFBd0M7O1lBQWQsaUNBQVk7OHRKRHlCeEI7Z0JBQ1YsT0FBTyxDQUFDLFlBQVksRUFBRTtvQkFDcEIsVUFBVSxDQUFDLFFBQVEsRUFBRTt3QkFDbkIsS0FBSyxDQUFDLEVBQUUsU0FBUyxFQUFFLGtCQUFrQixFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsQ0FBQzt3QkFDcEQsT0FBTyxDQUFDLGdCQUFnQixFQUFFLEtBQUssQ0FBQyxFQUFFLFNBQVMsRUFBRSxpQkFBaUIsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQztxQkFDL0UsQ0FBQztvQkFDRixVQUFVLENBQUMsUUFBUSxFQUFFLENBQUMsT0FBTyxDQUFDLGdCQUFnQixFQUFFLEtBQUssQ0FBQyxFQUFFLFNBQVMsRUFBRSxrQkFBa0IsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUM7aUJBQ3hHLENBQUM7Z0JBQ0YsT0FBTyxDQUFDLGNBQWMsRUFBRTtvQkFDdEIsS0FBSyxDQUFDLFNBQVMsRUFBRSxLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUsV0FBVyxFQUFFLENBQUMsQ0FBQztvQkFDbkQsS0FBSyxDQUFDLFNBQVMsRUFBRSxLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUsZUFBZSxFQUFFLENBQUMsQ0FBQztvQkFDdkQsVUFBVSxDQUFDLG9CQUFvQixFQUFFLE9BQU8sQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO29CQUMzRCxVQUFVLENBQUMsb0JBQW9CLEVBQUUsT0FBTyxDQUFDLGVBQWUsQ0FBQyxDQUFDO2lCQUMzRCxDQUFDO2FBQ0g7O2lGQUVVLFlBQVk7Y0FwQnhCLFNBQVM7MkJBQ0UsU0FBUyxjQUdQO29CQUNWLE9BQU8sQ0FBQyxZQUFZLEVBQUU7d0JBQ3BCLFVBQVUsQ0FBQyxRQUFRLEVBQUU7NEJBQ25CLEtBQUssQ0FBQyxFQUFFLFNBQVMsRUFBRSxrQkFBa0IsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUM7NEJBQ3BELE9BQU8sQ0FBQyxnQkFBZ0IsRUFBRSxLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUsaUJBQWlCLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUM7eUJBQy9FLENBQUM7d0JBQ0YsVUFBVSxDQUFDLFFBQVEsRUFBRSxDQUFDLE9BQU8sQ0FBQyxnQkFBZ0IsRUFBRSxLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUsa0JBQWtCLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDO3FCQUN4RyxDQUFDO29CQUNGLE9BQU8sQ0FBQyxjQUFjLEVBQUU7d0JBQ3RCLEtBQUssQ0FBQyxTQUFTLEVBQUUsS0FBSyxDQUFDLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxDQUFDLENBQUM7d0JBQ25ELEtBQUssQ0FBQyxTQUFTLEVBQUUsS0FBSyxDQUFDLEVBQUUsU0FBUyxFQUFFLGVBQWUsRUFBRSxDQUFDLENBQUM7d0JBQ3ZELFVBQVUsQ0FBQyxvQkFBb0IsRUFBRSxPQUFPLENBQUMsZ0JBQWdCLENBQUMsQ0FBQzt3QkFDM0QsVUFBVSxDQUFDLG9CQUFvQixFQUFFLE9BQU8sQ0FBQyxlQUFlLENBQUMsQ0FBQztxQkFDM0QsQ0FBQztpQkFDSDsyQ0F1QkQsUUFBUTtrQkFEUCxZQUFZO21CQUFDLGdCQUFnQixFQUFFLENBQUMsUUFBUSxDQUFDOztrRkFwQi9CLFlBQVkiLCJzb3VyY2VzQ29udGVudCI6WyIvKiogQGZvcm1hdCAqL1xuXG5pbXBvcnQgeyBDb21wb25lbnQsIEVsZW1lbnRSZWYsIEhvc3RMaXN0ZW5lciwgT25EZXN0cm95LCBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgaW5wdXQsIHNpZ25hbCwgV3JpdGFibGVTaWduYWwsIGNvbXB1dGVkIH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IHRyaWdnZXIsIHRyYW5zaXRpb24sIHN0eWxlLCBhbmltYXRlLCBzdGF0ZSB9IGZyb20gXCJAYW5ndWxhci9hbmltYXRpb25zXCI7XG5cbmV4cG9ydCB0eXBlIEZhYk9wdGlvbnMgPSB7XG4gIGJhY2tncm91bmRDb2xvckNsb3NlZD86IHN0cmluZztcbiAgYmFja2dyb3VuZENvbG9yT3BlbmVkPzogc3RyaW5nO1xuICBzaXplPzogbnVtYmVyO1xufTtcblxuZXhwb3J0IHR5cGUgRmFiSXRlbSA9IHtcbiAgbGFiZWw/OiBzdHJpbmc7XG4gIGljb246IHN0cmluZztcbiAgYmFja2dyb3VuZENvbG9yPzogc3RyaW5nO1xuICBpZD86IHN0cmluZztcbiAgY2xpY2s/OiAoKSA9PiBhbnk7XG59O1xuXG5leHBvcnQgdHlwZSBGYWJJdGVtcyA9IEZhYkl0ZW1bXTtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcIm1pcy1mYWJcIixcbiAgdGVtcGxhdGVVcmw6IFwiLi9mYWIuY29tcG9uZW50Lmh0bWxcIixcbiAgc3R5bGVVcmxzOiBbXCIuL2ZhYi5jb21wb25lbnQuc2Nzc1wiXSxcbiAgYW5pbWF0aW9uczogW1xuICAgIHRyaWdnZXIoXCJzbGlkZVVwRmFiXCIsIFtcbiAgICAgIHRyYW5zaXRpb24oXCI6ZW50ZXJcIiwgW1xuICAgICAgICBzdHlsZSh7IHRyYW5zZm9ybTogXCJ0cmFuc2xhdGVZKDUwcHgpXCIsIG9wYWNpdHk6IDAgfSksXG4gICAgICAgIGFuaW1hdGUoXCIzMDBtcyBlYXNlLW91dFwiLCBzdHlsZSh7IHRyYW5zZm9ybTogXCJ0cmFuc2xhdGVZKDBweClcIiwgb3BhY2l0eTogMSB9KSlcbiAgICAgIF0pLFxuICAgICAgdHJhbnNpdGlvbihcIjpsZWF2ZVwiLCBbYW5pbWF0ZShcIjIwMG1zIGVhc2Utb3V0XCIsIHN0eWxlKHsgdHJhbnNmb3JtOiBcInRyYW5zbGF0ZVkoNzBweClcIiwgb3BhY2l0eTogMCB9KSldKVxuICAgIF0pLFxuICAgIHRyaWdnZXIoXCJyb3RhdGVCdXR0b25cIiwgW1xuICAgICAgc3RhdGUoXCJkZWZhdWx0XCIsIHN0eWxlKHsgdHJhbnNmb3JtOiBcInJvdGF0ZSgwKVwiIH0pKSxcbiAgICAgIHN0YXRlKFwicm90YXRlZFwiLCBzdHlsZSh7IHRyYW5zZm9ybTogXCJyb3RhdGUoNDVkZWcpXCIgfSkpLFxuICAgICAgdHJhbnNpdGlvbihcInJvdGF0ZWQgPT4gZGVmYXVsdFwiLCBhbmltYXRlKFwiMzAwbXMgZWFzZS1vdXRcIikpLFxuICAgICAgdHJhbnNpdGlvbihcImRlZmF1bHQgPT4gcm90YXRlZFwiLCBhbmltYXRlKFwiMjAwbXMgZWFzZS1pblwiKSlcbiAgICBdKVxuICBdXG59KVxuZXhwb3J0IGNsYXNzIEZhYkNvbXBvbmVudCBpbXBsZW1lbnRzIE9uRGVzdHJveSB7XG4gIHNob3cgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XG4gIG9wdGlvbnMgPSBpbnB1dDxGYWJPcHRpb25zPih7fSk7XG4gIGl0ZW1zID0gaW5wdXQ8RmFiSXRlbXM+KFtdKTtcblxuICBpc09wZW46IFdyaXRhYmxlU2lnbmFsPGJvb2xlYW4+ID0gc2lnbmFsKGZhbHNlKTtcblxuICAvLyBDb21wdXRlZCBzaWduYWwgZm9yIG9wdGlvbnMgd2l0aCBkZWZhdWx0c1xuICBjb21wdXRlZE9wdGlvbnMgPSBjb21wdXRlZCgoKSA9PiB7XG4gICAgY29uc3QgY3VycmVudE9wdGlvbnMgPSB0aGlzLm9wdGlvbnMoKTtcbiAgICByZXR1cm4ge1xuICAgICAgc2l6ZTogNTYsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3JDbG9zZWQ6IFwiIzA5MzdCMlwiLFxuICAgICAgYmFja2dyb3VuZENvbG9yT3BlbmVkOiBcIiMzYTVmYzFcIixcbiAgICAgIC4uLmN1cnJlbnRPcHRpb25zXG4gICAgfTtcbiAgfSk7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBlUmVmOiBFbGVtZW50UmVmKSB7fVxuXG4gIEBIb3N0TGlzdGVuZXIoXCJkb2N1bWVudDpjbGlja1wiLCBbXCIkZXZlbnRcIl0pXG4gIGNsaWNrb3V0KGV2ZW50OiBhbnkpIHtcbiAgICBpZiAoIXRoaXMuZVJlZi5uYXRpdmVFbGVtZW50LmNvbnRhaW5zKGV2ZW50LnRhcmdldCkpIHtcbiAgICAgIHRoaXMuY2xvc2VGYWIoKTtcbiAgICB9XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHt9XG5cbiAgY2xpY2tJdGVtKGl0ZW06IEZhYkl0ZW0pIHtcbiAgICB0aGlzLmNsb3NlRmFiKCk7XG4gICAgaXRlbS5jbGljaz8uKCk7XG4gIH1cblxuICBjbG9zZUZhYigpIHtcbiAgICB0aGlzLmlzT3Blbi5zZXQoZmFsc2UpO1xuICB9XG5cbiAgdG9vZ2xlRmFiKCkge1xuICAgIHRoaXMuaXNPcGVuLnNldCghdGhpcy5pc09wZW4oKSk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJmYWItd3JhcHBlclwiICpuZ0lmPVwic2hvdygpXCI+XG4gIDxkaXYgY2xhc3M9XCJmYWItaXRlbXNcIiAqbmdJZj1cImlzT3BlbigpXCIgQHNsaWRlVXBGYWI+XG4gICAgPGRpdiBjbGFzcz1cImZhYi1pdGVtXCIgKm5nRm9yPVwibGV0IGl0ZW0gb2YgaXRlbXMoKS5yZXZlcnNlKCk7IGxldCBpID0gaW5kZXhcIiAoY2xpY2spPVwiY2xpY2tJdGVtKGl0ZW0pXCI+XG4gICAgICA8ZGl2ICpuZ0lmPVwiaXRlbS5sYWJlbFwiIGNsYXNzPVwiZmFiLXRvb2x0aXBcIj5cbiAgICAgICAge3sgaXRlbS5sYWJlbCB9fVxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2XG4gICAgICAgIGNsYXNzPVwiZmFiLWJ1dHRvblwiXG4gICAgICAgIFtuZ1N0eWxlXT1cIntcbiAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IGl0ZW0uYmFja2dyb3VuZENvbG9yIHx8ICcjMDkzN0IyJ1xuICAgICAgICB9XCJcbiAgICAgID5cbiAgICAgICAgPGltZyBbc3JjXT1cIml0ZW0uaWNvblwiIGNsYXNzPVwiYWRkLWltZ1wiIC8+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG4gIDxkaXZcbiAgICBjbGFzcz1cImZhYi1jb250YWluZXJcIlxuICAgIFtuZ1N0eWxlXT1cIntcbiAgICAgIGJhY2tncm91bmRDb2xvcjogaXNPcGVuKCkgPyBjb21wdXRlZE9wdGlvbnMoKS5iYWNrZ3JvdW5kQ29sb3JPcGVuZWQgOiBjb21wdXRlZE9wdGlvbnMoKS5iYWNrZ3JvdW5kQ29sb3JDbG9zZWRcbiAgICB9XCJcbiAgICAoY2xpY2spPVwidG9vZ2xlRmFiKClcIlxuICA+XG4gICAgPHN2Z1xuICAgICAgW0Byb3RhdGVCdXR0b25dPVwiaXNPcGVuKCkgPyAncm90YXRlZCcgOiAnZGVmYXVsdCdcIlxuICAgICAgY2xhc3M9XCJhZGQtaW1nXCJcbiAgICAgIHdpZHRoPVwiMjRcIlxuICAgICAgaGVpZ2h0PVwiMjRcIlxuICAgICAgdmlld0JveD1cIjAgMCAyNCAyNFwiXG4gICAgICBmaWxsPVwibm9uZVwiXG4gICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCJcbiAgICA+XG4gICAgICA8cGF0aFxuICAgICAgICBmaWxsLXJ1bGU9XCJldmVub2RkXCJcbiAgICAgICAgY2xpcC1ydWxlPVwiZXZlbm9kZFwiXG4gICAgICAgIGQ9XCJNMTMuMTQyNCA1LjE1NjA3QzEzLjE0MjQgNC41MTc1OSAxMi42MzEzIDQgMTIuMDAwOSA0QzExLjM3MDQgNCAxMC44NTk0IDQuNTE3NTkgMTAuODU5NCA1LjE1NjA3VjEwLjg0MjFINS4xNDE0OUM0LjUxMTA2IDEwLjg0MjEgNCAxMS4zNTk3IDQgMTEuOTk4MkM0IDEyLjYzNjcgNC41MTEwNiAxMy4xNTQzIDUuMTQxNDkgMTMuMTU0M0gxMC44NTk0VjE4Ljg0MzlDMTAuODU5NCAxOS40ODI0IDExLjM3MDQgMjAgMTIuMDAwOSAyMEMxMi42MzEzIDIwIDEzLjE0MjQgMTkuNDgyNCAxMy4xNDI0IDE4Ljg0MzlWMTMuMTU0M0gxOC44NTg1QzE5LjQ4ODkgMTMuMTU0MyAyMCAxMi42MzY3IDIwIDExLjk5ODJDMjAgMTEuMzU5NyAxOS40ODg5IDEwLjg0MjEgMTguODU4NSAxMC44NDIxSDEzLjE0MjRWNS4xNTYwN1pcIlxuICAgICAgICBmaWxsPVwid2hpdGVcIlxuICAgICAgLz5cbiAgICA8L3N2Zz5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
|